These are chat archives for FreeCodeCamp/Help

12th
Jan 2015
Bill Maca
@bmaca
Jan 12 2015 00:11
hello world
body {
  font-family: helvetica, sans-serif;
}
Lazarus G.
@PseudoSsiah
Jan 12 2015 03:09
Anyone got any tips for (16: Customize Bootstrap)?
Dominic Jones
@towwiow
Jan 12 2015 03:18
challenge 16?
Lazarus G.
@PseudoSsiah
Jan 12 2015 03:18
Yeah
Kathy O'Driscoll
@odrisck
Jan 12 2015 03:19
what specific are you looking for @PseudoSsiah
Lazarus G.
@PseudoSsiah
Jan 12 2015 03:20
The last part, making it a one-column layout.
Like, do I need to just hide the navbar, or does that need to stay, but be in the page like everything else?
Kathy O'Driscoll
@odrisck
Jan 12 2015 03:21
no don't remove elements from the page, remove formatting thats causing it to split into columns
towwiow @towwiow isn't at challenge 16. Took a break to catch up on another course but is now caught up. Should be getting to challenge 16 within the next 48 - 72 hrs.
Lazarus G.
@PseudoSsiah
Jan 12 2015 03:22
Okay, thx!
Kathy O'Driscoll
@odrisck
Jan 12 2015 03:22
sure :)
Wynda
@Wynda
Jan 12 2015 04:15
Why would the codes all turn green when they are supposed to be yellow. I think it's in CSS for the Build a small business website for the last lesson in it. Also the business website only shows a plain website with writing, all the pictures and color are now gone. I don't know if that was supposed to happen.
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:16
can you be a bit more specific? Did you change something that turned it green? Perhaps your color code was off by one? As for the plain page, I'm not sure, I'd have to see the code, can you share your code here please
Wynda
@Wynda
Jan 12 2015 04:16
Is there a way to post a screen shot?
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:17
you can drag it to the chat window
Wynda
@Wynda
Jan 12 2015 04:18
7Capture.JPG
Sorry it posted twice and trying to remove second one
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:19
ok the code is green because you passed, and I can't see any code referencing your images
so I can't tell why they aren't showing
Wynda
@Wynda
Jan 12 2015 04:20
Where it shows eshas restauraunt to the right is that supposed to look like that?
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:20
which step
Wynda
@Wynda
Jan 12 2015 04:20
Let me grab another screen shot
8Capture.JPG
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:21
that still doesn't show me your html
Wynda
@Wynda
Jan 12 2015 04:23
I am so new at this sorry, Is the HTML at the top of the page?
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:24
which step of that challenge are you on
Wynda
@Wynda
Jan 12 2015 04:25
The last one, page 80 of 80 it says I am done. But it doesn't look correct. I can post all of the code.
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:25
yes please, so I can see what you are missing
Wynda
@Wynda
Jan 12 2015 04:26

<!DOCTYPE html>

<head>
<script src="/assets/jquery.js"></script>
<link href='https://fonts.googleapis.com/css?family=Londrina+Shadow' rel='stylesheet' type='text/css
<style>
body {
font-family: helvetica, sans-serif;
margin: 0 auto;
max-width: 600px;
background: #232323;
}
div {
height: 200px;
background-size: cover;
position: relative;
margin: 40px 0 0 0;
border-radius: 12px;
}
h1 {
font-family: 'Londrina Shadow', cursive;
text-align: center;
font-size: 75px;
color: #aaaaaa;
margin: 60px 0 0 0;
}
h2 {
text-align: center;
color: #bbbbbb;
margin: 0px 0 70px 0;
}
p {
color: rgba(255,255,255,1);
background: black;
background: -webkit-linear-gradient(bottom, rgba(0,0,0,1), rgba(0,0,0,.4));
background: -moz-linear-gradient(bottom, rgba(0,0,0,1), rgba(0,0,0,.4));
background: -o-linear-gradient(bottom, rgba(0,0,0,1), rgba(0,0,0,.4));
padding: 10px;
line-height: 28px;
text-align: justify;
position: absolute;
bottom: 0;
margin: 0;
height: 30px;
transition: height .5s;
-webkit-transition: height .5s;
-moz-transition: height .5s;
}
small {
opacity: 0;
}
.show-description p {
height: 150px;
}
.show-description small {
opacity: 1;
}
.first{
background-image: url("http://dash.ga.co/assets/firstcourse.jpg");
}
.second{
background-image: url("http://dash.ga.co/assets/secondcourse.jpg");
}
.dessert{
background-image: url("http://dash.ga.co/assets/dessertcourse.jpg");
}
.price {
float: right;
}
@media (max-width: 500px) {
h1 {
font-size: 50px;
margin-top: 20px;
line-height: 40px;
}
}
h2 {
font-size: 20px;
margin: 20px 0 30px 0;
}
div {
margin: 20px 12px 0 12px;
}
p {
font-size: 20px;
line-height: 24px;
}
small {
font-size: 16px;
}
}

</style>

</head>

<body>
<h1>esha's restaurant</h1>
<h2>a New York City eatery</h2>
<div class="first">
<p>welsh onion soko <span class="price">$14</span><br />
<small>Mustard sierra leone bologi kale chard beet greens black-eyed pea sorrel amaranth garlic tigernut spring onion summer purslane asparagus lentil. </small></p>
</div>
<div class="second show-description">
<p>pastrami boudin tongue <span class="price">$22</span><br />
<small>Tri-tip capicola kielbasa salami brisket chicken rump strip steak drumstick. Meatloaf chuck boudin ribeye pork jowl. Andouille bacon jowl meatloaf pork loin prosciutto bresaola.</small></p>
</div>
<div class="dessert">
<p>fruitcake marzipan pudding dragee <span class="price">$8</span><br />
<small>Lollipop tart cotton candy jelly-o carrot cake apple pie cupcake. Jelly-o bear claw ice cream candy canes.</small></p>
</div>
<script>
$('div').on('click', function () {
$(this).toggleClass('show-description');
});
</script>

</body>

Kathy O'Driscoll
@odrisck
Jan 12 2015 04:27
gittermarkdowncodetut.jpg
so for next time thats how you post code
Wynda
@Wynda
Jan 12 2015 04:27
Oh thank you, I had no idea.
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:27
have your images show at all during the rest of the challenge?
because they seem fine here
Ben Clist
@BenClist
Jan 12 2015 04:29
I see the problem
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:29
oh good
what did I miss
Ben Clist
@BenClist
Jan 12 2015 04:29
you haven't closed the link tag at the top which includes the google font
<link href='https://fonts.googleapis.com/css?family=Londrina+Shadow' rel='stylesheet' type='text/css
<link href='https://fonts.googleapis.com/css?family=Londrina+Shadow' rel='stylesheet' type='text/css>
Wynda
@Wynda
Jan 12 2015 04:30
The first two lessons they did close
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:30
oh my goodness, thank goodness for more eyes, I scrolled right over that
Wynda
@Wynda
Jan 12 2015 04:30
I am going back and changing that right now, thanks. This is so confusing but I really want to learn this.
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:30
its actually pretty easy to lose closing > by backspacing inadvertently
Ben Clist
@BenClist
Jan 12 2015 04:31
sorry remember to add the closing quote as well
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:31
and never see that you did it
Ben Clist
@BenClist
Jan 12 2015 04:31
<link href='https://fonts.googleapis.com/css?family=Londrina+Shadow' rel='stylesheet' type='text/css'>
Bill Maca
@bmaca
Jan 12 2015 04:31
Good haxoring @BenClist & @odrisck
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:31
when you start using an actual code editor, the good ones will alert you to a missing >
Ben Clist
@BenClist
Jan 12 2015 04:32
That's how I spotted it, I pasted it into codepen and it highlighted the whole lot like an attribute
Wynda
@Wynda
Jan 12 2015 04:32
Oh wow, you guys figured out what was wrong so fast. I had no idea what I did wrong.
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:33
you'll pick up on how to catch them :) it will come quicker than you think
Ben Clist
@BenClist
Jan 12 2015 04:33
It's so, so, easy to make a mistake like that.
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:33
oh yeah I don't think you ever stop making the simple mistakes, you just learn to catch them sooner :)
Wynda
@Wynda
Jan 12 2015 04:33
Did all of your have problems in the beginning and feel totally clueless?
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:33
everyone
because at some point, we were all totally clueless :)
Ben Clist
@BenClist
Jan 12 2015 04:34
I still do, I spent 20 minutes the other day on a coding challenge wondering what I was doing wrong, only to then notice it was something really, really obvious
Wynda
@Wynda
Jan 12 2015 04:34
Does it take long before everything starts clicking and making sense?
Ben Clist
@BenClist
Jan 12 2015 04:35
It's just experience, keep writing code and you'll begin to understand what it does
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:35
yup
thats why I like the dash tutorials, you see the tangible results
Wynda
@Wynda
Jan 12 2015 04:35
Thanks, I appreciate everyone's help. = )
If you ever feel like it's hard, and you're not getting where you want, watch that :)
Wynda
@Wynda
Jan 12 2015 04:36
I will watch it right now. lol
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:36
I'm still writing/debugging a script I've been working on for a couple weeks now, its going to happen, just a matter of sticking with it
Wynda
@Wynda
Jan 12 2015 04:39
is codepen a good place to double check the code?
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:40
absolutely, it will highlight some errors for you so you know where to look
Russ Eby
@RussEby
Jan 12 2015 04:42
Plus you can share the pen so other can help out! Or learn from!
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:43
I often take some of these challenges over and save them in codepen so I can show new campers who are having problems
Jason Braun
@jasonbraun
Jan 12 2015 04:43
codepen is awesome
Wynda
@Wynda
Jan 12 2015 04:43
I never knew about it until today. What happens after we have completed all of the courses on FreeCodeCamp?
Kathy O'Driscoll
@odrisck
Jan 12 2015 04:44
the css robot is saved there to show
Jason Braun
@jasonbraun
Jan 12 2015 04:52
@Wynda you work on projects for non-profits
Wynda
@Wynda
Jan 12 2015 04:53
Oh okay, thanks. I wasn't sure when that part actually happened.
Jason Braun
@jasonbraun
Jan 12 2015 04:57
after 100 or so hours of class
Suzanne Atkinson
@AdventureBear
Jan 12 2015 05:43
OK, so I decided to go revisit some codepen with some front end and play with a JS library before I forgot too much
Came up with this simple thing
what do I need to do to center the button using margin: 0 auto; ?
do I need to set a width for the div or a position element?
oh and speaking of trouble learning, I spent about 20 minutes trouble shooting connecting this button to the javascript using the jquery. Turns out when I cut & pasted the button code from a website the "quotes" were curly quotes or something and the button ID wasn't recognized. all I did was type over the quotes again and everything worked.
Ben Clist
@BenClist
Jan 12 2015 05:53
display: block;
on the button
Suzanne Atkinson
@AdventureBear
Jan 12 2015 05:53
thank you!!
it worked
:)
bit by bit...just like that video above. Don't give up!
Suzanne Atkinson
@AdventureBear
Jan 12 2015 06:10
OK, now it's working better, a little bit styled but there is a delay while this request retrieves the lat/long. If I wanted to display a "working" animation, would I start it on button click? then stop it before the text display? I guess I am asking if I would manually tell it when to start and stop int he JS code? Make sense?
Evan Davis
@davisec52
Jan 12 2015 16:26

Good morning, everybody! Continuing on with the coderbyte LetterChanges problem . . . . I am trying to work with this code, below:


function dev(str) {
    //str = str.split("");
    var alphabet = ("abcdefghijklmnopqrstuvwxyz").split("");
    var count = [];
    count.length = str.length;
    final = [];
    for(var i = 0; i < alphabet.length; i++) {
        for(var j = 0; j < str.length; j++) {
            if(str[j] === alphabet[i]) {
              count.push(alphabet[(i + 1) % 26]);
            }
        }

    }
    return count.join("");
}
dev("hello worldz");

This returns this result:


'efimmmppsxa'

At this point, I have two questions. First, how can I "push" the characters and still retain the correct character order? Basically, under what conditions does push retain char order instead of defaulting to sort?

Second, how can I retain the original word spacing?

Ryan Malm
@Rybar
Jan 12 2015 16:35
check array.prototype method docs for another method of adding an item to an array. push always adds to the end of the array. Alternatively, array also has a method to reverse an array. As far as spacing goes, take a look at your logic; you need a way to handle if it isnt a letter, right now your code does nothing with non-letters.
Evan Davis
@davisec52
Jan 12 2015 16:41
@Rybar Right--I know that is the default, yet I ran across code using push that seemed to put them in order. Just a moment, I;ll look for it.
Evan Davis
@davisec52
Jan 12 2015 16:49
@rybar I found this solution on coderbyte using push. Even when all other code is commented out, it still pushes the characters in the correct order. Does this have something to do with the match method? That does not really make sense to me, but I don't know. This surprised me because I understand push defaults to alphabetical sort.

function LetterChanges(str) {
  // convert string to array
  var strArr = str.split("");
  // initialize result as array
  var result = [];

  for(var i = 0; i < strArr.length; i++){
      if(str[i].match(/[a-yA-Y]/))
        result.push(String.fromCharCode(str[i].charCodeAt(0) + 1));
      // special case for z and Z
      //else if (str[i] === "z" || str[i] === "Z")
        //result.push("A");
      //else
        //result.push(strArr[i]);
      // capitalize vowels
      //if(result[i].match(/[eiou]/))
        //result[i] = result[i].toUpperCase();
  }   
  // code goes here  
  return result.join(""); 

}
LetterChanges("hello worldz");
Evan Davis
@davisec52
Jan 12 2015 17:00

If I remove the push method from the first code I posted, I get this:

``` function dev(str) {
//str = str.split("");
var alphabet = ("abcdefghijklmnopqrstuvwxyz").split("");
var count = [];
count.length = str.length;
final = [];
for(var i = 0; i < alphabet.length; i++) {
for(var j = 0; j < str.length; j++) {
if(str[j] === alphabet[i]) {
//count.push(alphabet[(i + 1) % 26]);
count[j] = alphabet[(i + 1) % 26];

        }
    }

}
return count.join("");

}
dev("hello worldz");


Which gives the result,

'ifmmpxpsmea'

```

So, now to look for a way to handle spaces.

Sorry, the message edit thingy won't let me correct the code formatting. It should look like this:


function dev(str) {
    //str = str.split("");
    var alphabet = ("abcdefghijklmnopqrstuvwxyz").split("");
    var count = [];
    count.length = str.length;
    final = [];
    for(var i = 0; i < alphabet.length; i++) {
        for(var j = 0; j < str.length; j++) {
            if(str[j] === alphabet[i]) {
              //count.push(alphabet[(i + 1) % 26]);
              count[j] = alphabet[(i + 1) % 26];

            }
        }

    }
    return count.join("");
}
dev("hello worldz");

Which gives the result,


'ifmmpxpsmea'
Madina Ibrahim
@MadinaIbrahim
Jan 12 2015 17:04
Good morning everyone! How you search in CodePen? I couldn't find where you "use /re/syntax for regexp search". What does it mean? Thank you!
Nathan
@terakilobyte
Jan 12 2015 17:06
@davisec52 when using modulo to keep something within a range, start the range at 0
Evan Davis
@davisec52
Jan 12 2015 17:12

@terakilobyte Thank you. So,


count[j] = alphabet[(0 + 1) % 26];

Obviously, that is not right. How do I make the correction?

Nathan
@terakilobyte
Jan 12 2015 17:17
turn all the letters into something offset from 0
so a should be 0
and z should be 25
you can achieve this by subtracting ‘a'
Ryan Malm
@Rybar
Jan 12 2015 17:18
your code is already functioning properly by accident, due to 0 index. you just need more conditional logic to handle non-alpha characters.
Charles Watson
@sircharleswatson
Jan 12 2015 17:18
why not use the built in code for each letter?
Nathan
@terakilobyte
Jan 12 2015 17:18
then do your modification, and add the value of ‘a' back in to set it to the current range
Ryan Malm
@Rybar
Jan 12 2015 17:18
his output already correctly wraps z to a.... he just needs to handle spaces.
Nathan
@terakilobyte
Jan 12 2015 17:19
ah
so it does
Evan Davis
@davisec52
Jan 12 2015 17:19
@sircharleswatson I couldn't see how to combine modulo with unicode.
Nathan
@terakilobyte
Jan 12 2015 17:20
@davisec52 what is the unicode value of a?
err. ascii value
Ryan Malm
@Rybar
Jan 12 2015 17:20
97
Nathan
@terakilobyte
Jan 12 2015 17:20
thanks @Rybar :)
Ryan Malm
@Rybar
Jan 12 2015 17:20
the charcode solution is overly complex
Nathan
@terakilobyte
Jan 12 2015 17:21
I think it’s pretty simple
Charles Watson
@sircharleswatson
Jan 12 2015 17:21
you can compare like if "a" > "b"
Nathan
@terakilobyte
Jan 12 2015 17:21
what makes it complex?
Charles Watson
@sircharleswatson
Jan 12 2015 17:21
or: if firstLetter > secondLetter
or whatever you need
Ryan Malm
@Rybar
Jan 12 2015 17:21
do you have to handle capital letters?
Evan Davis
@davisec52
Jan 12 2015 17:22
@Rybar I'm not too concerned about capitalizing vowels. The hard part, for me, is getting the letter change right.
I'll get to vowels once I handle the letter change.
Ryan Malm
@Rybar
Jan 12 2015 17:23
ah, so you're on that one.
Evan Davis
@davisec52
Jan 12 2015 17:23
I'm sorry to be dense, here, but I'm not really getting the bit about adding and subracting "a."
Nathan
@terakilobyte
Jan 12 2015 17:24
‘a’ is just a value
which happens to be 97
b is 98
c is 99, so on
if I have the letter ‘d’ and subtract ‘a’, I get 3
if I were to add 1 to that, I’d have 4, then add ‘a’, I’d have 101
which happens to be the ascii code for e
Evan Davis
@davisec52
Jan 12 2015 17:25
Yes, by now I know the unicode by heart. Almost.
I'm don't know what to do with it in the code sample above.
Nathan
@terakilobyte
Jan 12 2015 17:26
you don’t have to use it becuase you’ve chosen to 0 base the alphabet with an array
Evan Davis
@davisec52
Jan 12 2015 17:26
@terakilobyte The only way I could see to use modulo was to make everything relative to an alphabet array.
Nathan
@terakilobyte
Jan 12 2015 17:27
or the method I just described
regardless
why are you looping twice?
you are looping the length of w/e the input was 26 times
Evan Davis
@davisec52
Jan 12 2015 17:29
How else can I compare str to alphabet?
Nathan
@terakilobyte
Jan 12 2015 17:31
array.find() might be useful
don’t change it right now though, keep your loops
Madina Ibrahim
@MadinaIbrahim
Jan 12 2015 17:33
I've figured it out!
Nathan
@terakilobyte
Jan 12 2015 17:33
as others have said, what if if(str[j] === alphabet[i]) isn’t true?
Evan Davis
@davisec52
Jan 12 2015 17:34
@terakilobyte Thank you for the hint.
Madina Ibrahim
@MadinaIbrahim
Jan 12 2015 17:41
@BenClist Thank you, nice video!
Craig Kofoed
@hIGH-aND-mIGHTY
Jan 12 2015 18:52
I'm a bit confused on the regular expression challenge http://regexone.com/example/2? . The answer is "^([\w.]*)". Why does the wildcard period get past the period in the emails but not go into the @ and + symbols?
Quincy Larson
@QuincyLarson
Jan 12 2015 19:38
@hIGH-aND-mIGHTY There are a number of ways you can do things with regular expressions (one of the reasons they’re so dangerous). The reason they’re using the wildcard here is that they’re specifically trying to teach how to use wildcards.
Craig Kofoed
@hIGH-aND-mIGHTY
Jan 12 2015 19:46
Ok, is there a reason the wildcard doesn't go into other characters like the @ and + in the example?
Also thank you for the response
Quincy Larson
@QuincyLarson
Jan 12 2015 19:50
Yes - because \w will only select alphabetic elements.
period is also selected because it’s also specified
Craig Kofoed
@hIGH-aND-mIGHTY
Jan 12 2015 19:54
Is it seeing the period as just a period and not a wildcard? From the course I thought that required it to be escaped .
Quincy Larson
@QuincyLarson
Jan 12 2015 19:55
In this case, because the period falls within the [], it’s seen as a literal period. Because [] takes a string of characters, and you shouldn’t backslash escape those characters
Craig Kofoed
@hIGH-aND-mIGHTY
Jan 12 2015 19:55
Bam, answered! Thank you, Quincy!