These are chat archives for FreeCodeCamp/HelpFrontEnd

20th
Jun 2016
Moisés Man
@moigithub
Jun 20 2016 00:00
@mav1283 sooo
#results-container{
    display:none !important;  /// <<< REMOVE !important
}

#results-container.active{    // <<<< fix TYPO `contianer`
    display:block; 
}
matthew3454
@matthew3454
Jun 20 2016 00:23
I'm well on my way to completion of the Use theTwitchtv JSON project. I just need someone to assist me if they can thanks! Here you go:http://codepen.io/codeabode20/pen/vKXxbO?editors=0010
JD Tadlock
@jdtdesigns
Jun 20 2016 00:37
@matthew3454 You have some errors with your closing of blocks
Usmaan Ali
@usyyy
Jun 20 2016 00:37
any resources to help with my portfolio
JD Tadlock
@jdtdesigns
Jun 20 2016 00:38
@usyyy what's the issue?
Usmaan Ali
@usyyy
Jun 20 2016 00:39
@jdtdesigns just gathering resources prior to beginning, was checking to see if anybody has sites they used to help with layout/transitions/style/general helpful code
@jdtdesigns or help with navigation styles, button styles for social media links
JD Tadlock
@jdtdesigns
Jun 20 2016 00:40
@usyyy I usually go to pinterest/behance/cssawwards for inspiration
The code is knowledge you must obtain
i don't use any resources for frontend code
there are frameworks like react/angular/vue that will give you great control/organization
Usmaan Ali
@usyyy
Jun 20 2016 00:41
@jdtdesigns i am just starting out, therefore if i dont know how to say implement a navigation bar, i will need to google it, but i do understand that it needs to be learnt, not copied
JD Tadlock
@jdtdesigns
Jun 20 2016 00:42
@usyyy Yeah, that is stuff you need to learn if you want to do anything in this field. The sad truth is that this stuff takes quite a lot of time to learn despite what the youtube videos and ads will tell you.
And when i say quite a lot of time, i mean years ;)
Usmaan Ali
@usyyy
Jun 20 2016 00:44
@jdtdesigns i have just graduated college (university), this is a almost a summer project to see if i have a genuine desire to continue on. If i do, i will apply for a MSc in computer science next year which should help the process
@jdtdesigns graduated with a BSc in mathematics
JD Tadlock
@jdtdesigns
Jun 20 2016 00:46
@usyyy Then you have a great head start on knowing the process of learning. Just be aware that no matter your smarts, it is still a huge load of info to take in and process/remember/understand
when they say 'language' it is exactly what it sounds like
Usmaan Ali
@usyyy
Jun 20 2016 00:47
@jdtdesigns thanks for the advice, i am currently applying the same principles i used during my degree, i.e notetaking (pocketbook) any queries i have, so i have an index to go to for simple issues
CamperBot
@camperbot
Jun 20 2016 00:47
usyyy sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 521 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
buiphuking
@buiphuking
Jun 20 2016 00:47
hi guys, how to send a variable from js to html , i build simon game
angular , i thnk
JD Tadlock
@jdtdesigns
Jun 20 2016 00:47
just like learning a different speaking language, it is a huge undertaking
@usyyy
I'm the reality guy btw. I'm so tired of people being scammed by the videos and fake ads
it's the pyramid scheme of the 2000s
@buiphuking I would hold off on using angular and use something more procedural(easy to understand) like jQuery
Norvin Burrus
@ndburrus
Jun 20 2016 00:50
@usyyy congrats on your graduation!
buiphuking
@buiphuking
Jun 20 2016 00:51
@jdtdesigns
why, angular hard with newbie ?
JD Tadlock
@jdtdesigns
Jun 20 2016 00:52
@buiphuking angular is a complete mvc using oop
huge load of code to process if you don't even understand basic js
buiphuking
@buiphuking
Jun 20 2016 00:52
@jdtdesigns
thanks, but i like challenge ^^
CamperBot
@camperbot
Jun 20 2016 00:52
buiphuking sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 522 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
JD Tadlock
@jdtdesigns
Jun 20 2016 00:52
@buiphuking take on the challenge of learning js first ;)
Usmaan Ali
@usyyy
Jun 20 2016 00:53
@ndburrus thank you :)
CamperBot
@camperbot
Jun 20 2016 00:53
usyyy sends brownie points to @ndburrus :sparkles: :thumbsup: :sparkles:
:cookie: 655 | @ndburrus |http://www.freecodecamp.com/ndburrus
Usmaan Ali
@usyyy
Jun 20 2016 00:54
@jdtdesigns yes i appreciate your honesty, how far would FCC's front end certification go towards at least acquiring an entry level position
JD Tadlock
@jdtdesigns
Jun 20 2016 00:55
@usyyy Not far at all unfortunately. The main way you land a job from FCC is not because of the certification, but because you build your portfolio and knowledge of js.
The certification is not 'certified'. It's just a way of pushing you to learn.
buiphuking
@buiphuking
Jun 20 2016 00:55
plz someone share me a link to learn augular online, and basic for newbie, thanks guys!!!!!!!
JD Tadlock
@jdtdesigns
Jun 20 2016 00:56
@buiphuking Search youtube
Usmaan Ali
@usyyy
Jun 20 2016 00:56
@jdtdesigns so the MSc in CS would go further, i understand the importance of producing good work along the FCC journey
JD Tadlock
@jdtdesigns
Jun 20 2016 00:58
@usyyy That will be good for your resume, but the main thing companies look for is good examples of work you've done in the specifications they require such as angular/php/oop/ajax and so forth.
They most likely will test you very deeply before you land the job.
Usmaan Ali
@usyyy
Jun 20 2016 00:59
@jdtdesigns so as far as learning the basics, FCC is a good way to ease in
JD Tadlock
@jdtdesigns
Jun 20 2016 01:00
@usyyy FCC is great in the sense that is pushes you to build working apps. The main way you learn this stuff is to do it. You will hit wall after wall, but the more you mess up and repeat, the more you will learn and remember.
Other course sites will just give you videos to watch and very little challenge to actually code.
Holish
@Holish
Jun 20 2016 01:01
Anybody knows what is the difference between "git checkout -b..." and "git checkout -a" ?
Usmaan Ali
@usyyy
Jun 20 2016 01:01
@jdtdesigns the thing that i enjoy most so far, is the learning by doing, which is something i have never done before (mathematics is theory then apply), my only worry is developing a reliance on the chat rooms for help
Holish
@Holish
Jun 20 2016 01:01
cant find it in google
JD Tadlock
@jdtdesigns
Jun 20 2016 01:03
@Holisz checkout -b <name> is to create a new branch
commit -a is to commit all changes
@usyyy I will say, having the math down will be a huge help for you. When it comes to programming, especially game dev, math is essential.
I myself, struggle with math lol
Holish
@Holish
Jun 20 2016 01:04
@jdtdesigns Thanks! What about -b, and where can I find this info? Git documentation?
JD Tadlock
@jdtdesigns
Jun 20 2016 01:05
@Holish checkout -b is for a new branch
said that above ;)
Holish
@Holish
Jun 20 2016 01:05
@jdtdesigns thanks, lol i meant -f , sry
CamperBot
@camperbot
Jun 20 2016 01:05
holish sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 523 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
JD Tadlock
@jdtdesigns
Jun 20 2016 01:06
-f is to force the switch to another branch even if you haven't commited changes on your current branch
the default behavior is to make you commit changes before switching
@Holish
@Holish do you have a git repository initialized on your comp?
Holish
@Holish
Jun 20 2016 01:08
@jdtdesigns ohh, I see. Thank you again
CamperBot
@camperbot
Jun 20 2016 01:08
holish sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: holish already gave jdtdesigns points
Holish
@Holish
Jun 20 2016 01:09
@Holish I do, im doing the angular tutorial, and they used 'checkout -b' first and the they switched to '-f' so I was wandering what's the diffrerence
JD Tadlock
@jdtdesigns
Jun 20 2016 01:10
in your terminal, type git help checkout
andreas2249
@andreas2249
Jun 20 2016 01:10

@jdtdesigns, do you have a moment to look at something? I can't seem to get my 'Contact' link to jump to the contact section. This is after a complete rewrite verify everything I could... Thanks in advance if you have the time. Here's the rewrite:

https://codepen.io/andreas2249/pen/MejrMG

CamperBot
@camperbot
Jun 20 2016 01:10
andreas2249 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 524 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Emily Mendez
@emilypmendez
Jun 20 2016 01:10
Thanks @jdtdesigns for your insight. FCC is new to me
CamperBot
@camperbot
Jun 20 2016 01:10
emilypmendez sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 525 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
JD Tadlock
@jdtdesigns
Jun 20 2016 01:10
it will load a webpage with detailed info on checkout
@Holish
Holish
@Holish
Jun 20 2016 01:11
@jdtdesigns i love this chat
andreas2249
@andreas2249
Jun 20 2016 01:12
( @jdtdesigns, it's jumping to the 'Portfolio page for some reason...)
JD Tadlock
@jdtdesigns
Jun 20 2016 01:12
@andreas2249 i'll take a look
@emilypmendez your welcome ;)
andreas2249
@andreas2249
Jun 20 2016 01:13
Thanks, @jdtdesigns. You're a Prince. :+1:
CamperBot
@camperbot
Jun 20 2016 01:13
andreas2249 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: andreas2249 already gave jdtdesigns points
JD Tadlock
@jdtdesigns
Jun 20 2016 01:14
@andreas2249 Your containers floats aren't cleared. Basically means for every left to right row of content, you need a .row class
Laurin Fäller
@faeller
Jun 20 2016 01:17
Hey :)
Ken Haduch
@khaduch
Jun 20 2016 01:18
@faeller - hey there... what's up?
andreas2249
@andreas2249
Jun 20 2016 01:19
@jdtdesigns, pardon my total ignorance: I have no idea what that means. Are you saying that I need a .row class after each of those three .containers in the 'About' section?
@jdtdesigns, i.e. wrap the stuff in the inside the .containers with <div class="row"> ?
JD Tadlock
@jdtdesigns
Jun 20 2016 01:20
@andreas2249 If you inspect the code using the browser inspector, you'll see that the contact section goes all the way up to the about section in height. That is causing the link to go to the top of the about sections instead because the contact begins where the about begins.
@andreas2249 I see a lot of containers
you should only need one container-fluid for the page
the rest of the content will be layed out using rows and columns
Laurin Fäller
@faeller
Jun 20 2016 01:22
@khaduch thanks for the response! I can't seem to get a grid layout to work - setting the width to 50% for 2 elements just creates a line break instead of two elements on that line.
CamperBot
@camperbot
Jun 20 2016 01:22
faeller sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1350 | @khaduch |http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Jun 20 2016 01:23
@faeller - do you have a link to post for help? Setting the width to 50% (If you're trying to use the bootstrap grid) isn't the way it works. but if you post the link, we can check it out.
andreas2249
@andreas2249
Jun 20 2016 01:24

Ohhhh... Only one container-fluid. Humbled here. Didn't know that. I'll start there getting rid of those containers then look at the inspector.

I had thought that I needed a container for the groups of text + pics in the 'About' section. Your comment now makes sense. They are ALREADY in columns by virtue of having a single container-fluid class. Makes a lot of sense.

( @jdtdesigns )
Holish
@Holish
Jun 20 2016 01:24
@faeller It is because display:inline-block takes into account white-space in the html.
Try to edit your html and remove spaces
Laurin Fäller
@faeller
Jun 20 2016 01:24
@khaduch One second, I'll try to upload it
@Holish I've already tried removing them by using the white-space: nowrap - didn't change anything (except for text line breaks to stop)
JD Tadlock
@jdtdesigns
Jun 20 2016 01:25
@faeller can you post the pen?
@Holish Thank you, though. Very appreciated.
CamperBot
@camperbot
Jun 20 2016 01:27
faeller sends brownie points to @holish :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for holish
JD Tadlock
@jdtdesigns
Jun 20 2016 01:28
@faeller What are you trying to achieve?
An image example would be great. ;)
Holish
@Holish
Jun 20 2016 01:28
@faeller Welcome, im curious now what could be the problem
The tablet breakpoint should look like that. First two sections would get 50% and the last one 100%; Alignment of the first two is the thing I'm trying for about
three hours now^^
that should get you started :P
Laurin Fäller
@faeller
Jun 20 2016 01:42
@jdtdesigns Thank you so much!
CamperBot
@camperbot
Jun 20 2016 01:42
faeller sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 526 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Ken Haduch
@khaduch
Jun 20 2016 01:42
@faeller - well, the section.menu-item elements have a fixed-width margin of 20px on all sides, so that takes away 80px across the width. if you reduce the width of the elements where you have 50% to 45%, then it lays out along the lines of your proposed plan (although the third div is at the same width contraint, so it won't lay out as you've planned.
Laurin Fäller
@faeller
Jun 20 2016 01:43
Would it work, if I remove the fixed margin?
JD Tadlock
@jdtdesigns
Jun 20 2016 01:44
@faeller welcome ;)
no need for widths when using flexbox and box-sizing: border-box
just put the items in a flexbox and use margin on them
Ken Haduch
@khaduch
Jun 20 2016 01:45
@faeller - changing the margin changes it (with your original design as the base) @jdtdesigns gave a completely different take on it using flexbox layout. So you can decide which you'd rather work with.
JD Tadlock
@jdtdesigns
Jun 20 2016 01:46
@khaduch I can do another if you all prefer :P
been doing css for 5 years
Laurin Fäller
@faeller
Jun 20 2016 01:48
@jdtdesigns Never heard of the concepts of flexbox's - I'll look into it
@khaduch removing / resetting the margin didn't work (http://i.imgur.com/1pwB6is.jpg)
If element1_width + element2_width <= parent_element_width - shouldn't it align properly?
shivamsonu29
@shivamsonu29
Jun 20 2016 02:00

function diffArray(arr1, arr2) {
  var newArr = [];
  var newArr2= [];
  var newArr3= [];
  var newArr4= [];
  var indexOfi;
  var indexOfj;
  // Same, same; but different.
    function crop(val){
               return val!==arr1[indexOfi];}
function crop2(val){
               return val!==arr2[indexOfj];}


 var len1=arr1.length;
  var len2 =arr2.length;
  for(var i=0;i<len1;i++)
    {
      for(var j=len1;j<len2;j++)
        {
          if(arr1[i]===arr2[j])
            {
              indexOfi=arr1.indexOf(arr1[i]);
              indexOfj=arr2.indexOf(arr2[j]);
              newArr2=newArr2.push(arr1.filter(crop));
              newArr3=newArr3.push(arr2.filter(crop2));

            }
        }
    }
  newArr4=newArr2.concat(newArr3);

return newArr4;
}
diffArray([1, 2, 3, 5], [1, 2, 3, 4, 5]);
error coming that newArr2 is not a function, can anybody help and tell what mistake i have made..
Ken Haduch
@khaduch
Jun 20 2016 02:13

@faeller - I removed the margin, and I also changed the breakpoint that you were using for your wider-width window because you had a max-width on the media query of 991px on it, and then I think you changed to 25% width about 992px?

I don't really understand why, but setting the margin on the elements to 0, the body margin to 0 and leaving the width at 50% does not generate the type of alignment that you want, but changing the width to 49% does generate the alignment that you are looking for on the first two boxes.

Tristan Larsin
@tlarsin
Jun 20 2016 02:13
Hey guys can I get some help with some css. https://jsfiddle.net/tlarsin/phhuunyb/ I cannot get the two divs to float to the right. I have the 4 left divs correct but I want the other two to float to the right
Ken Haduch
@khaduch
Jun 20 2016 02:15
@shivamsonu29 - I'm not following everything that you're trying to do, but this: newArr2=newArr2.push(arr1.filter(crop)); does not look like the proper way to use .push() - you would only need to do newArr2.push() to push the element on that array - no further assignment needed.
shivamsonu29
@shivamsonu29
Jun 20 2016 02:25
@khaduch arguments can be provided in .push which you want to push in the array, it is also mentioned in https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push
This message was deleted
shivamsonu29
@shivamsonu29
Jun 20 2016 02:32
is anybody have idea about how to find difference of 2 arrays and to give output the array having elements which are neither in 1st array or 2nd array...
JD Tadlock
@jdtdesigns
Jun 20 2016 02:34
@faeller Here's another way to do it without flexbox. ;) http://jsbin.com/puluwij/edit?css,output
@shivamsonu29 You can concat the 2 arrays together then filter the array to remove values that are the same
buiphuking
@buiphuking
Jun 20 2016 02:44
guys, before do something we need to draw a flow chart, right?
so how i know if i draw right?
andreas2249
@andreas2249
Jun 20 2016 02:46
@jdtdesigns, I removed the extra containers like you had suggested. So far, so good -- but still a bit confused. In the 'Contact' section, if there's no new container, how can I get the social icons into their own "section" so that they're vertical and to the left of the contact form? Thanks in advance. Here's the CodePen: https://codepen.io/andreas2249/full/MejrMG/
CamperBot
@camperbot
Jun 20 2016 02:46
andreas2249 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 527 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Ken Haduch
@khaduch
Jun 20 2016 02:56
@shivamsonu29 - I think that what I said was that you can do newArr2.push(arr1.filter(crop)), but then assigning that result back to newArr2 would clobber the value in newArr2, because the returned value from the .push() is the new length of the array.
buiphuking
@buiphuking
Jun 20 2016 03:07
how i know my algorithm i use is right when i build simon game , guys ?
Greg Duncan
@GregatGit
Jun 20 2016 03:12
@buiphuking break the game down into steps and see if the game will work on paper
@buiphuking you're first attempt might not work - but maybe your 4th of 5 will. I did 3 or 4 versions of simone before I got it to go
shivamsonu29
@shivamsonu29
Jun 20 2016 03:28
@khaduch thanks, the error is not coming but not giving correct output..
CamperBot
@camperbot
Jun 20 2016 03:28
shivamsonu29 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1351 | @khaduch |http://www.freecodecamp.com/khaduch
96street
@96street
Jun 20 2016 03:31
Can someone please tell me why border-radius is not working here
http://codepen.io/kingdezz/pen/MejQQL click 'Share' and then hover to see the problem
buiphuking
@buiphuking
Jun 20 2016 03:31
@GregatGit
https://postimg.org/image/a1bqcpi7l/
what do you think ?
Greg Duncan
@GregatGit
Jun 20 2016 03:34
@buiphuking flow charts are a bit more technical than that - have a look here -http://www.computerhope.com/jargon/f/flowchar.htm
buiphuking
@buiphuking
Jun 20 2016 03:37
@GregatGit
i mean my algorithm is good to go ?
Greg Duncan
@GregatGit
Jun 20 2016 03:38
i think you need to expand it
Suzanne Atkinson
@AdventureBear
Jun 20 2016 03:39
Finally I feel like I am making some headway! Just need to sort for online or offline now. I assume using hide & show is a reasonable solution
Greg Duncan
@GregatGit
Jun 20 2016 03:53
@AdventureBear i used hide() and show()
Suzanne Atkinson
@AdventureBear
Jun 20 2016 04:05
Thanks @GregatGit ...getting closer. Got a toggle going at least. Did you write different click handlers for each of all , online & offline?
CamperBot
@camperbot
Jun 20 2016 04:06
adventurebear sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 609 | @gregatgit |http://www.freecodecamp.com/gregatgit
Suzanne Atkinson
@AdventureBear
Jun 20 2016 04:09
YES it's working!!
Greg Duncan
@GregatGit
Jun 20 2016 04:10
@AdventureBear You might want to put target='_blank' for the href
Suzanne Atkinson
@AdventureBear
Jun 20 2016 04:11
Couple more formatting things, but I got all the functionality working. FINALLY.
@GregatGit is that so the links open in codepen?
Greg Duncan
@GregatGit
Jun 20 2016 04:12
@AdventureBear so they open in new window/tab
Suzanne Atkinson
@AdventureBear
Jun 20 2016 04:13
So...I started this twitch TV codepen in May of 2015.
Finished...13 months later. Sigh.
Greg Duncan
@GregatGit
Jun 20 2016 04:15
But you finished! :fire:
Suzanne Atkinson
@AdventureBear
Jun 20 2016 04:25
Boom chica! I moved forward but this one really buggedme. I think b/c the get request was somewhat intricate. differeint pieces of data from different calls.
nelsonlho
@nelsonlho
Jun 20 2016 04:55
anyone done pagination with ReactJS?
Claude Daiga Dohnji
@cdaiga
Jun 20 2016 04:56
Hello guys
I am having problems running jquery's $.getJSON() method on code pen
shivamsonu29
@shivamsonu29
Jun 20 2016 05:11

function diffArray(arr1, arr2) {

  var newArr=[];
  var ind=[];
  var fArr=[];
  newArr=arr1.concat(arr2);
  var idx;
  function crop(val){
    for(var i=0;i<ind.length;i++)
            return val!==arr[ind[i]];
          }
  for(var i=0;i<newArr.length;i++)
    {
      do
        {
     idx=newArr.indexOf(newArr[i]);
         ind.push(idx);
          idx=newArr.indexOf(newArr[i],idx+1);

        }while(idx!=-1);
      if(ind.length>1)
        {
          fArr.push(newArr.filter(crop));
        }
    }

  return fArr;
}
diffArray([1, 2, 3, 5], [1, 2, 3, 4, 5]);
infinite loop error is coming, any idea. the error is coming for statement while(idx!=-1)...
Suzanne Atkinson
@AdventureBear
Jun 20 2016 05:18
@cdaiga FCC has a help page about the get JSON method. what challege are you on? Trying to remmeber how / where I found the help page.
RAJESH KUMAR
@raz281389
Jun 20 2016 05:19
text going behind <header>. How to get it below the Header
Suzanne Atkinson
@AdventureBear
Jun 20 2016 05:19
I finally started my wikipedia viewer page. http://codepen.io/AdventureBear/pen/GqjxrG
kirbyedy
@kirbyedy
Jun 20 2016 05:21
@shivamsonu29 not quite understand but you are assigning -1 to idx ? what does that do ?
Ricky
@Rickkwa
Jun 20 2016 05:22
@shivamsonu29 If newArr has 2 elements of the same value, it will loop forever.
shivamsonu29
@shivamsonu29
Jun 20 2016 05:24
@kirbyedy when indexOf function don't get position of element, then it returns -1..please see the link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf
@Rickkwa https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf in this link one program is given which finds the no. of occurences of elements of an array, so what to do for removing the error of infinite loop..
shivamsonu29
@shivamsonu29
Jun 20 2016 05:30
@Rickkwa any idea for removing this error??
Greg Duncan
@GregatGit
Jun 20 2016 05:45
Dose anyone know how to set a maximum size for an image but still keep it responsive so if the page gets smaller it will scale down?
Tony Johnson
@tnyjhnsn
Jun 20 2016 05:55
@GregatGit can try class img-responsive if using bootstrap
Harshit Anand
@nerocool996
Jun 20 2016 05:59
I need some help, I want to style my buttons after I pressed it. http://codepen.io/nerocool996/pen/KMgmxb here is my pen. After pressing the start button ,it stops following my btn properties
Evan
@jubayerevan
Jun 20 2016 06:09
Hi guys, I am currently in the front end section. I was wondering..... Is it possible to complete all the front end Projects without completing the Algorithms? I mean do the projects require that I complete the algorithms?
kirbyedy
@kirbyedy
Jun 20 2016 06:12
@jubayerevan not really, you only have to do the algorithms marked with *
Evan
@jubayerevan
Jun 20 2016 06:14
@kirbyedy I haven't yet done JS or jQuery. I mean can I just finish the projects first and then the algorithms?
kirbyedy
@kirbyedy
Jun 20 2016 06:14
sure
Evan
@jubayerevan
Jun 20 2016 06:14
@kirbyedy thanks
CamperBot
@camperbot
Jun 20 2016 06:14
jubayerevan sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1133 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Greg Duncan
@GregatGit
Jun 20 2016 06:19
@tony-tosp thanks
CamperBot
@camperbot
Jun 20 2016 06:19
gregatgit sends brownie points to @tony-tosp :sparkles: :thumbsup: :sparkles:
:cookie: 272 | @tony-tosp |http://www.freecodecamp.com/tony-tosp
Mayank-Kabra
@Mayank-Kabra
Jun 20 2016 07:25

User Story: I can view a tribute page with an image and text.

User Story: I can click on a link that will take me to an external website with further information on the topic.

what is to b done for these two user stories???
can anybody help
what does these mean??
96street
@96street
Jun 20 2016 07:28
Can someone tell me why hover is not working here? http://codepen.io/kingdezz/pen/MejQQL I want to change colour of 'Share', 'Report' and 'Hide' on hover
Niush Sitaula
@Niush
Jun 20 2016 08:18

@96street just use this simply:

.settingsMenu ul li a:hover {
border-radius: 5px 5px 0 0;
background-color: #666;
}

96street
@96street
Jun 20 2016 09:00
@Niush but then the children of 'Share' change color aswell
click 'Share' and you'll see what i mean
John Delaney
@jdpunk1
Jun 20 2016 09:01
@nerocool996 hi, not sure if anyone answered, but if you use mouseUp in jquery and then add or remove a class it'll style the button- I'm also doing the pomodoro clock and have a question- what method did you use for the countdown, I'm currently trying setInterval, but it's a bit problematic?
@nerocool996 it's $("#id").on('mouseup', function(){change class here});
Harshit Anand
@nerocool996
Jun 20 2016 09:06
@jdpunk1 I fixed my problem, it was just a typo. I also used setInterval for my clock , I have completed the project and I didn't really had any trouble with that function.
What problem do you have?
John Delaney
@jdpunk1
Jun 20 2016 09:12
clearInterval doesn't seem to be working- so it subtracts 1 second, 2 seconds, then 3 and so on for each cycle. I just need more coffee I think! @nerocool996
Harshit Anand
@nerocool996
Jun 20 2016 09:14
@jdpunk1 Do you store the intervalID before calling setInterval?
Harshit Anand
@nerocool996
Jun 20 2016 09:20
This message was deleted
Ramya
@ramyakatakam
Jun 20 2016 09:24
Load denied by X-Frame-Options: https://www.twitch.tv/esl_sc2
does not permit cross-origin framing------why iam getting this while doing twitch .tv json.......tia
hello
NatixDev
@NatixDev
Jun 20 2016 09:24
Hi guys, a little problem with my Local Weather app, it works fine but when I change the location with my input button, my weather icon doesn't change, the problem comes from :before that I use to display the content (Icons are displayed by a font), does anyone know a fix ? https://codepen.io/NatixDev/pen/beVdPp
Andrey Chadov
@go2bed
Jun 20 2016 09:58
Hello, guys, Is there in js function for start another function only after first is success done? some thing like that: fuinction().success(otherFUctnion()) ?
clement12345
@clement12345
Jun 20 2016 09:59
about @tbuglc
CamperBot
@camperbot
Jun 20 2016 09:59
:cookie: 282 | @tbuglc |http://www.freecodecamp.com/tbuglc
Graveworm
@legyolo
Jun 20 2016 10:12
hey there! can somebodey check this for errors? is this enought good to make the next lession?
Marco Mazzeo
@Doko85
Jun 20 2016 10:15
am I the only one who thinks that the JSON "course" on FCC is not that much explainatory? I just ran it AGAIN to see if I could understand it a bit better for the intermediate projects yet I don't know what to do
it just says "copy and paste this code to see how it works", it doesn't explain why you are doing that
Utkarsh Bhimte
@Utkarshbhimte
Jun 20 2016 10:34
https://utkarshbhimte.github.io/DashBoard-Prototype
I dont know why I am getting that blank space in my nav bar, Any Suggestions?
@legyolo You can do better dude
Jack Lyons
@JackEdwardLyons
Jun 20 2016 11:57

is this better?

for (var i = 0; i < collection.length; i++) {
    for ( var key in source ) {
      if (collection[i].hasOwnProperty(source[key]));
    }
  }

@shivamsonu29

sorry
for (var i = 0; i < collection.length; i++) {
    for ( var key in source ) {
      if (collection[i].hasOwnProperty(source[key])); {

      }
    }
  }
Greg Duncan
@GregatGit
Jun 20 2016 12:25
@legyolo It does need more work, but you can continue with the other challenges and keep improving it
Greg Duncan
@GregatGit
Jun 20 2016 12:29
@Doko85 If FCC doesn't have what you need you have to go searching asking.
Marco Mazzeo
@Doko85
Jun 20 2016 12:30
I don't know how to proceed to interact with a api url.
I mean, I "load" the url into an ajax method and then what?
what are the commands that will help me extract the json data from that api url? what do they do?
these stuffs aren't covered on the FCC progam
Greg Duncan
@GregatGit
Jun 20 2016 12:33
@Doko85 what are you working on?
Marco Mazzeo
@Doko85
Jun 20 2016 12:33
the weather app
Greg Duncan
@GregatGit
Jun 20 2016 12:34
in google chrome?
Marco Mazzeo
@Doko85
Jun 20 2016 12:35
yep
Greg Duncan
@GregatGit
Jun 20 2016 12:35
have you used the console in dev tools before?
Marco Mazzeo
@Doko85
Jun 20 2016 12:36
I used the dev tools only to check margin and padding of html elements before tbh
Greg Duncan
@GregatGit
Jun 20 2016 12:37
this will get you started
var api = "http://ip-api.com/json";

$.getJSON(api, function(json){
    console.log(json);
});
press control + shift + i - then look at the console for 'Object' - if it works you should be able to find the lat and long of your location
Marco Mazzeo
@Doko85
Jun 20 2016 12:39
ok, I see them
now I store them into two vars I suppose
Greg Duncan
@GregatGit
Jun 20 2016 12:45
yes - you now you can go to openweather and register to get their weather api that uses lat and long to retrieve the local weather in a similar mannor
Marco Mazzeo
@Doko85
Jun 20 2016 12:46
I already did that previously
Greg Duncan
@GregatGit
Jun 20 2016 12:46
did you register
Marco Mazzeo
@Doko85
Jun 20 2016 12:46
yep
but if I declare a local "lat" (or "long") variable into that function, it wouldn't be accessible into the other one, am I wrong?
Greg Duncan
@GregatGit
Jun 20 2016 12:48
you do it inside the getJSON call that you just made
Marco Mazzeo
@Doko85
Jun 20 2016 12:48
so I m going to create another getJSON function into that one in order to keep using those data
Greg Duncan
@GregatGit
Jun 20 2016 12:49
yes - because you have to wait for that one to return the data before you can make the next getJSON call
I have to go now but good luck - and don't worry if you get stuck - its all part of it
Marco Mazzeo
@Doko85
Jun 20 2016 12:51
thanks @GregatGit for your time ;)
CamperBot
@camperbot
Jun 20 2016 12:51
doko85 sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 610 | @gregatgit |http://www.freecodecamp.com/gregatgit
SystX
@SystX
Jun 20 2016 12:56
Hi, i'm trying to complete my tribute page, but it seems that i have some problems with bootstrap, the site is not well displayed in mobile devices, can you please help me?:) here's the site https://codepen.io/SystX/full/BzLmaO/
This message was deleted
Noahz
@MrNoahz
Jun 20 2016 12:58
@SystX Seems fine on mobile
SystX
@SystX
Jun 20 2016 12:58
really?
Noahz
@MrNoahz
Jun 20 2016 12:58
The font size is a little big though
Marco Mazzeo
@Doko85
Jun 20 2016 12:58
@SystX check your private messages
Uros Tadic
@urketadic
Jun 20 2016 13:21
pleees ser can someone help me with http://codepen.io/urketadic/pen/zBKppa javascript ain worken
pleeeees ser
pleeeeaaas
Noahz
@MrNoahz
Jun 20 2016 13:23
Your last few lines of JS aren't even complete
@urketadic
Uros Tadic
@urketadic
Jun 20 2016 13:24
oh wtf
it didnt update
codepen was offline so it probably didnt update my code
hold on
ok can u check now
man wtf is wrong with this
wont update
ok gotta work now
Uros Tadic
@urketadic
Jun 20 2016 13:31
hello anyone?
Uros Tadic
@urketadic
Jun 20 2016 13:37
can someone help me with http://codepen.io/urketadic/pen/zBKppa
Jaime Nunez
@jaimeNunez
Jun 20 2016 13:39
On the tribute page project I am working on, my bootstrap directives won't work like they did on the freeCodeCamp editor. Any ideas?
Marco Mazzeo
@Doko85
Jun 20 2016 13:41
@jaimeNunez what's wrong?
Tony Johnson
@tnyjhnsn
Jun 20 2016 13:41
@urketadic on your for your #buttonclick function try
$(“#buttonclick”).on(“click”, function(……
Uros Tadic
@urketadic
Jun 20 2016 13:47
yea i think its because i cant get lenght from an object
Dylan
@dhcodes
Jun 20 2016 13:53
@jaimeNunez if you're using codepen, you likely need to add bootstrap in the settings menu under CSS and JS
under Javascript, quick add jQuery first, then bootstrap
@jaimeNunez if you're not using codepen, you still need to reference the bootstrap CDN in your head
Jaime Nunez
@jaimeNunez
Jun 20 2016 13:54
@dhcodes Thanks! I got it fixed
CamperBot
@camperbot
Jun 20 2016 13:54
jaimenunez sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1073 | @dhcodes |http://www.freecodecamp.com/dhcodes
vichus1995
@vichus1995
Jun 20 2016 13:55
guys,im doing the javascript calculator and trying to calculate the expression using eval() .but it is not working.please help me.
http://codepen.io/vichus1995/pen/NxLqyb
Gary Siu
@GarySiu
Jun 20 2016 13:58
This message was deleted
tewfiq
@Tewfiq60
Jun 20 2016 14:00
please how can i get codepen url to sign in help
Gary Siu
@GarySiu
Jun 20 2016 14:00
@vichus1995 cal isn't defined?
Dave Kalu
@ifeanyidavid
Jun 20 2016 14:05
please how do i fade an image out in css
Dylan
@dhcodes
Jun 20 2016 14:05
@Tewfiq60 what do you mean?
@ifeanyidavid opacity: 0.5;
or any number 0-1
Ankur
@ankur01oct
Jun 20 2016 14:06
@ankur01oct
in random quote machine challenge while referencing twitter getting error : Refused to display 'https://twitter.com/' in a frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'self'".
please help
vichus1995
@vichus1995
Jun 20 2016 14:07
@GarySiu yes it is.it refers to the screen.
Marco Mazzeo
@Doko85
Jun 20 2016 14:08
@ifeanyidavid if you want to fadeOut while hovering just use img { opacity: 1 } img:hover { opacity: 0 } but with JavaScript you get a better result since you can specify how much time it takes the transition to occur
I don't know if css transition property works fine for that purpose
I never tried actually
Dave Kalu
@ifeanyidavid
Jun 20 2016 14:09
okay. much appreciated @Doko85
JD Tadlock
@jdtdesigns
Jun 20 2016 14:13
img {
  transition: opacity .4s;
}

img:hover {
  opacity: 0;
}
@ifeanyidavid That's the correct way to do it. No need for js with basic transitions
Ankur
@ankur01oct
Jun 20 2016 14:13
@urketadic where r u stuck ?
Uros Tadic
@urketadic
Jun 20 2016 14:19
I got it fixed now, i now am trying to figure out how to add a tweet button
So it tweets the text that is currently shown on quote div
Ankur
@ankur01oct
Jun 20 2016 14:22
@urketadic i am trying to do the same
Dylan
@dhcodes
Jun 20 2016 14:22
@urketadic check out the twitter dev documentation on web intents
@ankur01oct
@urketadic @ankur01oct fwiw, I had to make my own tweet button to get it to update when the quote changed
you may have to too
Ankur
@ankur01oct
Jun 20 2016 14:24
@urketadic in random quote machine challenge while referencing twitter getting error : Refused to display 'https://twitter.com/' in a frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'self'".
..... here is my pen http://codepen.io/ankur01oct/pen/QEERjr/?editors=1010
@dhcodes @urketadic please check ... if you can comment on error
will save me from googling too much :)
Uros Tadic
@urketadic
Jun 20 2016 14:26
yeah thanks @dhcodes
CamperBot
@camperbot
Jun 20 2016 14:26
urketadic sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1077 | @dhcodes |http://www.freecodecamp.com/dhcodes
Uros Tadic
@urketadic
Jun 20 2016 14:26
il check it now ankur
i dont know tho i never got that erorr
Dylan
@dhcodes
Jun 20 2016 14:29
@ankur01oct I think its' a codepen security thing
read the top
Ankur
@ankur01oct
Jun 20 2016 14:29
oh.. okay.. thanks for stackoverflow link.. hv gone through that already..didn't help
Dylan
@dhcodes
Jun 20 2016 14:30
@ankur01oct add target="_blank" to your link
and it works
Ankur
@ankur01oct
Jun 20 2016 14:31
oh...wow it does.. can you please tell me the logic behind adding that?
@dhcodes : any link / reading material to know that logic?
Dylan
@dhcodes
Jun 20 2016 14:33
@ankur01oct target="_blank" tells the browser to open the link in a new tab or window; for some reason codepen only allows outside links to open in new windows
@ankur01oct you can read more about it here: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a
Eduardo Campaña
@orballo
Jun 20 2016 14:34
hi campers! I'm looking for a good react tutorial for beginners... any suggestions?
Ankur
@ankur01oct
Jun 20 2016 14:34
@dhcodes i think, it maybe related to http and https...
Dylan
@dhcodes
Jun 20 2016 14:34
@ankur01oct maybe but your link wouldn't work with either unless you open in new window. I tried both
Martialis39
@Martialis39
Jun 20 2016 14:34
Hey guys, im working on the Twitch project
and Im looking at the response I get from an offline stream and an online stream
and they look identical
im currently calling
should I be checking for streams instead?
Ankur
@ankur01oct
Jun 20 2016 14:36
ok @dhcodes ..... no .. if you use "http://twitter.com/" it somehow redirects to https://twitter.com/' in console
for me it worked like that.. please correct me if i am wrong @dhcodes
Martialis39
@Martialis39
Jun 20 2016 14:37
Ok nvm I think I got it
Elbert Cortez
@trip16661
Jun 20 2016 14:43
guys I'm trying to fix my zindex of my quote navigation buttons when the height of the browser is less than 500px but its not working
Dylan
@dhcodes
Jun 20 2016 14:47
@trip16661 i don't see what's wrong?
Elbert Cortez
@trip16661
Jun 20 2016 14:47
@dhcodes z index
when you have a height lower than 500 px
the arrows will be down
under a div that hold s the main two buttons
and because of that it's not clickable
Dylan
@dhcodes
Jun 20 2016 14:49
@trip16661 your arrows get covered by the quote on my screen
on load
Elbert Cortez
@trip16661
Jun 20 2016 14:49
what do you mean?
did you open code pen on a tab?
Dylan
@dhcodes
Jun 20 2016 14:50
yes
i mean there is some text and arrows, but those get immediately covered by the quote
and then are inaccessible
what browser are you on?
Hi guys,when I try to write something in my divs
they are moving down
I dont have any idea why
Elbert Cortez
@trip16661
Jun 20 2016 14:51
sorry to bother but could you please screen shot?
im using chrome and ff
it dont work on IE
Uğur
@UgurKurt
Jun 20 2016 14:51
can any one help
Elbert Cortez
@trip16661
Jun 20 2016 14:51
since IE is s*
@UgurKurt you have to set the height of the divs
Dylan
@dhcodes
Jun 20 2016 14:53
@trip16661 what's it look like on your screen?
Uğur
@UgurKurt
Jun 20 2016 14:53
I set them
to 100px
they are still moving down
Dylan
@dhcodes
Jun 20 2016 14:54
@trip16661 nvm
i have to run
sorry
UtkarshShukla7
@UtkarshShukla7
Jun 20 2016 14:58
@ChaZZ27 what's the problem
you have to push the element in arr and then remove the first value from it
shivamsonu29
@shivamsonu29
Jun 20 2016 15:27
@JackEdwardLyons i don't have any knowledge about some statements such as var key in source, source[key]..what are that?? i have made this program without using these statements..and have you tried to run this??
Dan Logajan
@hiltydiggs
Jun 20 2016 15:33
@UgurKurt any luck? Playing with it now.
@UgurKurt add vertical-align: top; to the .one class.
Randall Fine
@randallfine
Jun 20 2016 15:49
I am most likely overlooking something simple, but I can't seem to make my "if" statements print if 422 or 404. Any ideas? http://codepen.io/randallfine/pen/BzjGvL
Dan Logajan
@hiltydiggs
Jun 20 2016 15:53
@Randallfine remove the line var link = data._links.self; and it works. It throws an invalid error.
Randall Fine
@randallfine
Jun 20 2016 15:54
thanks you @hiltydiggs
CamperBot
@camperbot
Jun 20 2016 15:54
randallfine sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 540 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
Dan Logajan
@hiltydiggs
Jun 20 2016 15:57
@Randallfine var links = data._links.self || "";
Gary Siu
@GarySiu
Jun 20 2016 15:58
@vichus1995 Sorry. The problem is on line 21, you override your answer with the contents of the arr immediately after displaying it.
Dan Logajan
@hiltydiggs
Jun 20 2016 16:07
@Randallfine probably even better to use a boolean in this case var links = data._links.self || false;.
Randall Fine
@randallfine
Jun 20 2016 16:08
I just took it completely out. Thanks though
Marco Mazzeo
@Doko85
Jun 20 2016 16:32
is anybody here practical with the weather icons css framework?
Tbuglc
@tbuglc
Jun 20 2016 16:35
@Doko85 : are you working on Local Weather stuff?
Melanie
@MelanieLeAnn
Jun 20 2016 16:40
Question: I am creating my personal portfolio page. Where do you find images?
Marco Mazzeo
@Doko85
Jun 20 2016 16:42
@tbuglc yes
Karolina Kluz
@karolinaKluz
Jun 20 2016 16:42
@MelanieLeAnn I get my free photos here http://deathtothestockphoto.com/
Melanie
@MelanieLeAnn
Jun 20 2016 16:43
I'll check that out, thanks @karolinaKluz
CamperBot
@camperbot
Jun 20 2016 16:43
melanieleann sends brownie points to @karolinakluz :sparkles: :thumbsup: :sparkles:
:cookie: 319 | @karolinakluz |http://www.freecodecamp.com/karolinakluz
Tbuglc
@tbuglc
Jun 20 2016 16:45
@Doko85 : Your weather API doesn't give you that?
Marco Mazzeo
@Doko85
Jun 20 2016 16:46
I haven't tried yet to show the icon
Colin
@finkbeca
Jun 20 2016 16:47
Could Anyone help me figure out how to line up the 'Project 1' - 'Project 4' names directly under the picture I've tried multiple methods and just cant get them to line up. Any help would be greatly appreciated.
Marco Mazzeo
@Doko85
Jun 20 2016 16:50
@tbuglc do you have a second to help me find the cause of an issue on my weather app html?
Tbuglc
@tbuglc
Jun 20 2016 16:53
@Doko85 : let me see
I don't get why it suddenly shows four times the °F icon and why the bottom text is so big
it shouldn't be
Tbuglc
@tbuglc
Jun 20 2016 16:57
@finkbeca : this guy may help you to do that
https://www.youtube.com/results?search_query=thewebsiteboy+gallery+
Mirza
@TAM360
Jun 20 2016 17:00
guys, i need some help in pomodro clock project
can anyone help me?
Dan Logajan
@hiltydiggs
Jun 20 2016 17:04
@Doko85 the .footer text? Just set it in .footer {..}.
Marco Mazzeo
@Doko85
Jun 20 2016 17:04
nope, the "Wind, Humidity etc"
it was ok before, now everything is bigger
also there are "°F" everywhere in the project and I don't know why
Sanne
@sannek
Jun 20 2016 17:06
@Doko85 You forgot to close one of your <i> tags
In the div with the id 'switch'
The switch still doesn't work, but the sizes etc are back to normal when you change that
Dan Logajan
@hiltydiggs
Jun 20 2016 17:07
@Doko85 line 16. Good catch, @sannek .
Marco Mazzeo
@Doko85
Jun 20 2016 17:07
yeah the switch doesn't work
thanks guys that solved the problem
there s still a lot of work to do on this project...
Mirza
@TAM360
Jun 20 2016 17:10
need help in pomodro clock!!!!!!
Suzanne Atkinson
@AdventureBear
Jun 20 2016 17:11
@TAM360 what is yoru question?
Mirza
@TAM360
Jun 20 2016 17:13
https://codepen.io/TAM007/pen/MejmMN for loop in the start button isn't working properly. (check the JS file)
roshmani
@roshmani
Jun 20 2016 17:13
hello everyone! http://codepen.io/roshma/full/QEbwKo/ Please give your feedbacks for my random quote machine
JD Tadlock
@jdtdesigns
Jun 20 2016 17:14
@TAM360 Before the js, I would change the svg to just a plain div and use height, width, ect.
The svg is totally broken and unnecessary.
Mirza
@TAM360
Jun 20 2016 17:15
sure
Dan Logajan
@hiltydiggs
Jun 20 2016 17:16
@TAM360 where is the for loop?
andreas2249
@andreas2249
Jun 20 2016 17:16

Good morning, Campers. Can someone please identify why the link to the 'Contact' section is not going to the top of the 'Contact' page as it does with the 'Portfolio' and 'About' links? (i.e. linking to that page still shows some of the prior page at the top of the screen.)

Here's my CodePen: https://codepen.io/andreas2249/pen/MejrMG Many thanks in advance. :)

Mirza
@TAM360
Jun 20 2016 17:17
in the JS file. inside this $("#start").on("click", function()
Marco Mazzeo
@Doko85
Jun 20 2016 17:17
@jdtdesigns thanks dude, I'm still trying to figure it out how you made the button stand in between the <i>s
CamperBot
@camperbot
Jun 20 2016 17:17
doko85 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 528 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
JD Tadlock
@jdtdesigns
Jun 20 2016 17:18
@Doko85 I removed the absolute from it. Absolute takes the element out of the doc structure.
Marco Mazzeo
@Doko85
Jun 20 2016 17:18
I see
Mirza
@TAM360
Jun 20 2016 17:20
@jdtdesigns @hiltydiggs did you find the loop?
JD Tadlock
@jdtdesigns
Jun 20 2016 17:21
@andreas2249 Same issue as before. The contact section is expanding into the about section.
Dan Logajan
@hiltydiggs
Jun 20 2016 17:22
@TAM360 while loop?
Mirza
@TAM360
Jun 20 2016 17:22
yeah
JD Tadlock
@jdtdesigns
Jun 20 2016 17:22
@TAM360 I can't even see what the screen is supposed to do right now lol. If you fix the html and css, i'll check it out. And btw, it's a while loop.
andreas2249
@andreas2249
Jun 20 2016 17:22
@jdtdesigns, what does "section is expanding mean" and how do I solve it, please? (I removed the extra containers as you had suggested yesterday. Got some improvement.)
Mirza
@TAM360
Jun 20 2016 17:23
sorry, i was initially using for loop.
Dan Logajan
@hiltydiggs
Jun 20 2016 17:23
@TAM360 when i gets to 0 it only runs the else loop and i stays at 0
andreas2249
@andreas2249
Jun 20 2016 17:24
@jdtdesigns, I can put an anywhere in that doc and link to it and have it go to the top of the page. I'm confounded about what I've incorrectly coded here that's caused this "three-day, single-issue horror" :(
JD Tadlock
@jdtdesigns
Jun 20 2016 17:25
@andreas2249 Lol, we've all gone through it. I'll fix it up in a minute.
Dan Logajan
@hiltydiggs
Jun 20 2016 17:26
@jdtdesigns @andreas2249 classic
Mirza
@TAM360
Jun 20 2016 17:26
@hiltydiggs it suppose to remain at 0 because the time has finished. my problem is that the while loop is suppose to work automatically after i click the start button. but it's not working!
Dan Logajan
@hiltydiggs
Jun 20 2016 17:28
@TAM360 console shows setTimeout is not a function.
JD Tadlock
@jdtdesigns
Jun 20 2016 17:29
btw @andreas2249 , your nav disappears on small screens
andreas2249
@andreas2249
Jun 20 2016 17:29
( @jdtdesigns and @hiltydiggs, I'm sure of that. Thanks for saying it, too. It's making me a bit nutso coz professionally, I develop automated trading systems for institutional traders that's 1,000x more complicated than this... I really want to learn this "properly" -- If I can't identify my error, can't learn from it. :)
CamperBot
@camperbot
Jun 20 2016 17:29
andreas2249 sends brownie points to @jdtdesigns and @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 529 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
:cookie: 541 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
Mirza
@TAM360
Jun 20 2016 17:30
@hiltydiggs impossible!! http://www.w3schools.com/js/js_timing.asp check this
swastikmohapatra7
@swastikmohapatra7
Jun 20 2016 17:30
Hello guys
I am trying to leave a gap of 10px between the "outer div" and the "length1" div. What I mean is that I need to have a margin of 10px on the top and bottom of the "length1" div. I worked out the side margins (I am making a simple rectangle inside the outer div). However, I cannot figure out how to leave a gap 10px on top and bottom. Here is my code
<!DOCTYPE html>
<html>
<head>
<style>
*{
    margin:0px;
    padding:0px;

 }
 body{
    margin:10px 0px;
 }
div.outer{
    height:400px;
    width: 500px;
    margin:100px auto;
    margin-top: 130px;
    background-color:red;
 }
 div.length1{
    height:380px;
    width:30px;
    margin:10px 470px 10px 0px;
    background-color:blue;
 }
</style>
</head>
<body>
    <div class="outer">
      <div class="length1"></div>
      <div class="breadth1"></div>
      <div class="length2"></div>
      <div class="breadth2"></div>
    </div>
</body>
</html>
JD Tadlock
@jdtdesigns
Jun 20 2016 17:30
lol
Dan Logajan
@hiltydiggs
Jun 20 2016 17:30
@TAM360 window.setTimeout
andreas2249
@andreas2249
Jun 20 2016 17:30
@jdtdesigns, yes, thanks for that reminder. Drop down on shrink is in there. It's broken for the time being.
CamperBot
@camperbot
Jun 20 2016 17:30
andreas2249 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: andreas2249 already gave jdtdesigns points
Dan Logajan
@hiltydiggs
Jun 20 2016 17:31
@TAM360 something like
$("#minutes").text(i);
$("#seconds").text(sec);
window.setTimeout(function() {}, 1000);
Mirza
@TAM360
Jun 20 2016 17:33
@hiltydiggs my codepen file isn't displaying any syntatic error regarding setTineout
let me check 1st
Dan Logajan
@hiltydiggs
Jun 20 2016 17:34
@TAM360 codepen console or f12 browser console?
Mirza
@TAM360
Jun 20 2016 17:34
codepen
JD Tadlock
@jdtdesigns
Jun 20 2016 17:35
@TAM360 use the browser console, not codepen
Mirza
@TAM360
Jun 20 2016 17:35
ok
Dan Logajan
@hiltydiggs
Jun 20 2016 17:35
@TAM360 open the browser console and hit the start button on your project again.
JD Tadlock
@jdtdesigns
Jun 20 2016 17:37
@andreas2249 There is quite a lot of errors in the code. :/
andreas2249
@andreas2249
Jun 20 2016 17:37
@jdtdesigns, Great! That's what I want to hear. Honestly. Where do I start, please?
JD Tadlock
@jdtdesigns
Jun 20 2016 17:38
You still have container-fluid across the html over and over
that is for wrapping your page content
row is used to wrap column dividers
<div class="row">
  <div class="col-xs-6">
    <h1>A Header</h1>
    <p>Some paragraph text</p>
  </div>
  <div class="col-xs-6">
    <h1>Another Header</h1>
    <p>Some more paragraph text</p>
  </div>
</div>
andreas2249
@andreas2249
Jun 20 2016 17:41
@jdtdesigns, OMG -- I took them out last night as you'd suggested. Looks like I didn't save. Lemme do that again first. Thanks for finding that. :+1:
CamperBot
@camperbot
Jun 20 2016 17:41
andreas2249 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: andreas2249 already gave jdtdesigns points
JD Tadlock
@jdtdesigns
Jun 20 2016 17:41
Also, your animated text up top needs to be spans, not divs
Sorin Ruse
@sorinr
Jun 20 2016 17:41
Hi there. I've just finished my wikipedia viwer. Can you please give me some feedback on this pen: http://codepen.io/sorinr/full/LZVqmJ/
JD Tadlock
@jdtdesigns
Jun 20 2016 17:42
@andreas2249 Go through and make sure all of your content is placed correctly inside of rows/columns. The columns inside a row should always equal to 12 , no matter how much you have in the column.
andreas2249
@andreas2249
Jun 20 2016 17:44
Perfect, @jdtdesigns. Great distinction on columns should always = 12. I'll start there fix those. Thanks for that code snippet, too. Really simplifies my understanding of containers vs. rows.
CamperBot
@camperbot
Jun 20 2016 17:44
andreas2249 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: andreas2249 already gave jdtdesigns points
andreas2249
@andreas2249
Jun 20 2016 17:44
@jdtdesigns, you're a Prince. Thank you for getting me started on the right track here... :)
CamperBot
@camperbot
Jun 20 2016 17:44
andreas2249 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: andreas2249 already gave jdtdesigns points
Dan Logajan
@hiltydiggs
Jun 20 2016 17:44
@sorinr excellent work!
Sorin Ruse
@sorinr
Jun 20 2016 17:45
@hiltydiggs thank you. maybe i should only add and on click event for the X in the search to clear all imput
CamperBot
@camperbot
Jun 20 2016 17:45
sorinr sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 542 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
Subramanya Chakravarthy
@chakrihacker
Jun 20 2016 17:46
@finkbeca try to decrease the font size
Dan Logajan
@hiltydiggs
Jun 20 2016 17:48
@sorinr also, small bit, but it will run through the searches for every iteration of the word you're typing if you type search term quickly.
Sorin Ruse
@sorinr
Jun 20 2016 17:51
@hiltydiggs i can make a debounce for that. i saw myself whats happening when you type quicly but i didn't wont to make it on enter. to change the code its just adding .enter to @keyup like @keyup.enter
Ronique Ricketts
@RoniqueRicketts
Jun 20 2016 17:52
Hello Guys
Dan Logajan
@hiltydiggs
Jun 20 2016 17:52
@RoniqueRicketts hello
Ronique Ricketts
@RoniqueRicketts
Jun 20 2016 17:52
$('#allChan').prepend("<img src='data2.logo'/>"); @hiltydiggs
I wanna print out an image logo on the html but this wont print it. any suggestion
JD Tadlock
@jdtdesigns
Jun 20 2016 17:53
@RoniqueRicketts You have the data value wrapped in quotes
Dan Logajan
@hiltydiggs
Jun 20 2016 17:54
@sorinr or wrap the searchWiki in a 500ms timeout or something
JD Tadlock
@jdtdesigns
Jun 20 2016 17:54
@RoniqueRicketts $('#allChan').prepend("<img src='" + data2.logo + "'/>");
Sorin Ruse
@sorinr
Jun 20 2016 17:55
@hiltydiggs no need vue.js already has a delay function called "debounce" that does same thing
Dan Logajan
@hiltydiggs
Jun 20 2016 17:57
@sorinr got it.
Ronique Ricketts
@RoniqueRicketts
Jun 20 2016 17:57
@jdtdesigns I will come back to you with another concern but for now. Thanks much
CamperBot
@camperbot
Jun 20 2016 17:57
roniquericketts sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 530 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
JD Tadlock
@jdtdesigns
Jun 20 2016 17:57
@sorinr Just clear the timeout before starting the next one
That will fix the content loading over the top of the previous problem
Sorin Ruse
@sorinr
Jun 20 2016 17:59
@jdtdesigns yes yes. that i was talking about with @hiltydiggs
Ronique Ricketts
@RoniqueRicketts
Jun 20 2016 18:08
@jdtdesigns this is the actual thing i want to have
$('#allChan').prepend(<a href='url'><li><img src='" + data2.logo + "'/>+ some text </li></a>);
JD Tadlock
@jdtdesigns
Jun 20 2016 18:13
$('#allChan').prepend(
  '<a href="' + url + '">' +
    '<li><img src="' + data2.logo + '">Some Text</li>' +
  '</a>'
);
@RoniqueRicketts
Ronique Ricketts
@RoniqueRicketts
Jun 20 2016 18:14
nice thanks. I have an issue placing the '' at the correct place @jdtdesigns
CamperBot
@camperbot
Jun 20 2016 18:14
roniquericketts sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: roniquericketts already gave jdtdesigns points
Suzanne Atkinson
@AdventureBear
Jun 20 2016 18:17
Hey guys, good afternoon! Wiki viewer is coming along nicely. I have my wiki api request that seems to be workign but there is no content returned in the json result. I print the request to the console but cannot drill down to the actual page content. Please try it...what am I missing or where should i look?
srishti-learner
@srishti-learner
Jun 20 2016 18:17
hi,i have completed random quote machine and it's working fine but initially there's no quote shown. it starts when the button to get new quote is clicked. it would be nice if anyone helps or any kind of feedback! here-https://codepen.io/srishti-learner/pen/WxrKrr
greg
@wearenotgroot
Jun 20 2016 18:20
@AdventureBear try data["query"]["pages"]
Sorin Ruse
@sorinr
Jun 20 2016 18:20
@jdtdesigns @hiltydiggs can you please retest the pen now: http://codepen.io/sorinr/full/LZVqmJ/
Suzanne Atkinson
@AdventureBear
Jun 20 2016 18:23
@wearenotgroot thanks, you mean when I drill down..."data.query.pages" in the return object? That is there but i'm not getting the "content" that the api seems to refer to.
CamperBot
@camperbot
Jun 20 2016 18:23
adventurebear sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star2: 1143 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
Suzanne Atkinson
@AdventureBear
Jun 20 2016 18:23
check this page of json results...I'm only getting the pge title and some other stuff.
wait...
Marco Mazzeo
@Doko85
Jun 20 2016 18:24
@srishti-learner I used a placeholder text for mine
then I replace it when I click on the button
Suzanne Atkinson
@AdventureBear
Jun 20 2016 18:25
ugh...I'll come back in a few hours with a fresher mind.
srishti-learner
@srishti-learner
Jun 20 2016 18:25
@Doko85 so,there is no way to get it dynamically? but then the first quote will always be same! :worried:
thanks for the reply
Marco Mazzeo
@Doko85
Jun 20 2016 18:26
nope, I used an api and it gets a random quote from the JSON file
greg
@wearenotgroot
Jun 20 2016 18:26
@srishti-learner you got a typo
@srishti-learner line 34 colors instead of colos
srishti-learner
@srishti-learner
Jun 20 2016 18:28
@greg ya..thanks man! that was an error also! :+1:
greg
@wearenotgroot
Jun 20 2016 18:29
@srishti-learner try breaking down this to smaller functions
srishti-learner
@srishti-learner
Jun 20 2016 18:29
@Doko85 okay...but if anyone could tell how to get dynamic quote at first then it would be highly appreciated.
@wearenotgroot okay. thanks
CamperBot
@camperbot
Jun 20 2016 18:30
srishti-learner sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star2: 1144 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
srishti-learner
@srishti-learner
Jun 20 2016 18:32
@wearenotgroot my quote is still not changing the color? can u please tell why?
greg
@wearenotgroot
Jun 20 2016 18:35
@srishti-learner should be color:colors[clr] with lowercase
Amelia Pang
@AMPANG
Jun 20 2016 18:36

Hello! I’m beginning to learn html 5 now. I keep getting an error message that says “expected script to have an attribute src” Here are my link and script tags: ```js

<link rel="stylesheet" href="style.css">

<script src="script.css"></script>
```

<link rel="stylesheet" href="style.css">
<script src="script.css"></script>
greg
@wearenotgroot
Jun 20 2016 18:36
@srishti-learner but personally you should have the same color text with background
Dan Logajan
@hiltydiggs
Jun 20 2016 18:36
@AMPANG script.js
greg
@wearenotgroot
Jun 20 2016 18:37
@srishti-learner it should stay white/light color for contrast
Amelia Pang
@AMPANG
Jun 20 2016 18:37
@hiltydiggs Thanks for responding! Can you expain?
CamperBot
@camperbot
Jun 20 2016 18:37
ampang sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 543 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
Dan Logajan
@hiltydiggs
Jun 20 2016 18:39
@AMPANG .css is the cascading style sheet extension.
Amelia Pang
@AMPANG
Jun 20 2016 18:39
@hiltydiggs Why can’t it be the css extension?
so it should be this?
<link rel="stylesheet" href="style.js">
<script src="script.js"></script>
zomnex
@zomnex
Jun 20 2016 18:41

<link rel="stylesheet" href="style.css">

<script src="script.js"></script>

Amelia Pang
@AMPANG
Jun 20 2016 18:42
Oh right that makes sense, style sheet should be .css
Dan Logajan
@hiltydiggs
Jun 20 2016 18:42
@AMPANG no. A stylesheet usually has .css (cascading style sheet) as an extension. Javascript usually uses the .js extension.
Amelia Pang
@AMPANG
Jun 20 2016 18:42
I’m still getting the same error message though
Dan Logajan
@hiltydiggs
Jun 20 2016 18:42
@AMPANG do these files actually exist?
@AMPANG and are they in the same folder as the HTML?
Amelia Pang
@AMPANG
Jun 20 2016 18:43
I’m actually doing a codecademy exercise. They don’t need to exist at this point.
Dan Logajan
@hiltydiggs
Jun 20 2016 18:44
@AMPANG do you have a link to it?
can someone tell me why the channels are duplicating?
Dan Logajan
@hiltydiggs
Jun 20 2016 18:48
@AMPANG hmm. I see what you mean.
Amelia Pang
@AMPANG
Jun 20 2016 18:49
Maybe it’s just a glitch?
srishti-learner
@srishti-learner
Jun 20 2016 18:50
@greg ya, i didn't changed it either. it was good the same way. just to learn. :smile: thanks again btw!
CamperBot
@camperbot
Jun 20 2016 18:50
srishti-learner sends brownie points to @greg :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for greg
srishti-learner
@srishti-learner
Jun 20 2016 18:50
help
CamperBot
@camperbot
Jun 20 2016 18:50

CamperBot

Hi, I'm CamperBot! I can help you in this chatroom :smile:

Basic Commands:

  • find TOPIC find all entries about topic. e.g. find js
  • wiki TOPIC show contents of topic page
  • thanks @username send brownie points to another user
  • about @username shows info on that user
  • Algorithm BONFIRENAME info on a Algorithm

meet CamperBot in FreeCodeCamp/camperbotPlayground

:pencil: read more about camperbot on the FCC Wiki

srishti-learner
@srishti-learner
Jun 20 2016 18:51
about @wearenotgroot
CamperBot
@camperbot
Jun 20 2016 18:51
:star2: 1144 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
greg
@wearenotgroot
Jun 20 2016 18:52
@srishti-learner np
Dan Logajan
@hiltydiggs
Jun 20 2016 18:52
@AMPANG trying to figure it out
Amelia Pang
@AMPANG
Jun 20 2016 18:54
It’s probably a glitch. In the next exercise they have the exact same code. https://www.codecademy.com/en/courses/web-intermediate-en-R6bnc/0/4#
@hiltydiggs
Dan Logajan
@hiltydiggs
Jun 20 2016 18:56
@AMPANG strange. I tried it in another browser, too. Still no luck.
andreas2249
@andreas2249
Jun 20 2016 19:00

@jdtdesigns or @hiltydiggs, I've placed myself in self-imposed "container vs. row" school... :)

I was instructed earlier: "Go through and make sure all of your content is placed correctly inside of rows/columns. The columns inside a row should always equal to 12 , no matter how much you have in the column."

So does that mean if I want to put another section of content below the 'Row 1' and 'Row 2' boxes (which are 4 columns each), I should put an "empty" div of 4 columns to the right of the 'Row 2' box so that total count in row = 12? Here's my sandbox: http://codepen.io/andreas2249/pen/VjKqVo?editors=1100

Ronique Ricketts
@RoniqueRicketts
Jun 20 2016 19:01
Hello guys can some please take a look at this pen http://codepen.io/Ronique/pen/wWWooj
Tell me what I did wrong why it is duplicating.
Dan Logajan
@hiltydiggs
Jun 20 2016 19:02
@andreas2249 first thing I see is .row and .col-xx-4 should not be on the same element.
@andreas2249 columns should be nested in rows.
Ethan Allison
@ethana99
Jun 20 2016 19:04
Is anyone here able to help me with one of the challenges?
andreas2249
@andreas2249
Jun 20 2016 19:04
Thank you, kindly, @hiltydiggs. Gonna go memorize that page you sent. :)
CamperBot
@camperbot
Jun 20 2016 19:05
andreas2249 sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 544 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
Dan Logajan
@hiltydiggs
Jun 20 2016 19:05
@RoniqueRicketts the pen isn't working for me, but most likely it's an async problem.
Ethan Allison
@ethana99
Jun 20 2016 19:05
I am stuck on trying to give each element a unique ID.
Ronique Ricketts
@RoniqueRicketts
Jun 20 2016 19:05
@hiltydiggs ok will try sendin the link agian
Dan Logajan
@hiltydiggs
Jun 20 2016 19:06
@RoniqueRicketts the link works, but the JS is broken and the preview doesn't load so I can't replicate.
@ethana99 html element?
@andreas2249 documentation is your best friend!
Ethan Allison
@ethana99
Jun 20 2016 19:07
Yes. @RoniqueRicketts This is what I have <button class="btn btn-default target1"></button>
Ronique Ricketts
@RoniqueRicketts
Jun 20 2016 19:07
@ethana99 huh?
Ethan Allison
@ethana99
Jun 20 2016 19:08
@RoniqueRicketts Can I post a link to the challenge?
Dan Logajan
@hiltydiggs
Jun 20 2016 19:08
@ethana99 id is an attribute just like class, so to add an id <button class="btn btn-default target1" id="your-id-name"></button>
Sanne
@sannek
Jun 20 2016 19:08
@RoniqueRicketts Because you have two for-loops inside each other, you call the API / generate your divs way more often than you should
Ronique Ricketts
@RoniqueRicketts
Jun 20 2016 19:09
@ethana99 yes
Ronique Ricketts
@RoniqueRicketts
Jun 20 2016 19:09
@sannek so th entire code is a wack?
Ray Liu
@mania7539
Jun 20 2016 19:10
Hey campers, I just run into issue that using a infinite loop so the freecodecamp walkthru page are stuck, how can I stop the program and make it editable if you have some thoughts?
Sanne
@sannek
Jun 20 2016 19:10
Not really! You just need to take the second for loop out, but then find a way to make sure that you pass i into your callback properly (otherwise it will always be the last value, returning undefined)
@mania7539 You need to delete the answer from that page from your local storage.
Ronique Ricketts
@RoniqueRicketts
Jun 20 2016 19:12
@ethana99
<div class="container-fluid">
  <h3 class="text-primary text-center">jQuery Playground</h3>
  <div class="row">
    <div class="col-xs-6">
      <h4>#left-well</h4>
      <div class="well" id="left-well">
        <button class="btn btn-default" id="target1"></button>
        <button class="btn btn-default" id="target2"></button>
        <button class="btn btn-default" id="target3"></button>
      </div>
    </div>
    <div class="col-xs-6">
      <h4>#right-well</h4>
      <div class="well" id="right-well">
        <button class="btn btn-default" id="target4"></button>
        <button class="btn btn-default" id="target5"></button>
        <button class="btn btn-default" id="target6"></button>
      </div>
    </div>
  </div>
</div>
set each target as an id might help with that challenge.
Ethan Allison
@ethana99
Jun 20 2016 19:13
@RoniqueRicketts @hiltydiggs Thanks. Got it :)
Ronique Ricketts
@RoniqueRicketts
Jun 20 2016 19:13
@sannek shux!! auugh!!!
CamperBot
@camperbot
Jun 20 2016 19:13
ethana99 sends brownie points to @roniquericketts and @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 545 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
:cookie: 299 | @roniquericketts |http://www.freecodecamp.com/roniquericketts
Sanne
@sannek
Jun 20 2016 19:14
I'm trying to remember the best way to do it, so I can help you out
Dan Logajan
@hiltydiggs
Jun 20 2016 19:14
@RoniqueRicketts agree on what @sannek said. This is a very important thing to learn and you'll need it over and over. Take the time to try and understand it.
Ronique Ricketts
@RoniqueRicketts
Jun 20 2016 19:15
@hiltydiggs been fighting this challnge for days and still coming up short. Auugh. frustrated!
Ray Liu
@mania7539
Jun 20 2016 19:17
@sannek so how can i do that? Would be clearing all cookies and data from browser?
Dan Logajan
@hiltydiggs
Jun 20 2016 19:19
@RoniqueRicketts yeah. This concept took me a while to get, as well. Here's a read to start stackoverflow.
andreas2249
@andreas2249
Jun 20 2016 19:21
@hiltydiggs, I agree. I think I'd been there, glossed over it, thought I understood it -- and now know I hadn't... I appreciate your patience with questions. :)
Ronique Ricketts
@RoniqueRicketts
Jun 20 2016 19:21
@hiltydiggs good thanks. I have removed the second loop but as @sannek said its returning undefined but I will work on it. So going forward its best not to use a loop within a loop in cases like this so that we don't encounter a duplication problem?
CamperBot
@camperbot
Jun 20 2016 19:21
roniquericketts sends brownie points to @hiltydiggs and @sannek :sparkles: :thumbsup: :sparkles:
:cookie: 424 | @sannek |http://www.freecodecamp.com/sannek
:cookie: 546 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
Dan Logajan
@hiltydiggs
Jun 20 2016 19:28
@RoniqueRicketts the loops keep going and changing the value of i before the callback occurs. I would copy/paste your javascript or fork or create a new pen and follow the example provided in the stackoverflow solution and see if you can get it working with the twitch api.
Ronique Ricketts
@RoniqueRicketts
Jun 20 2016 19:30
@hiltydiggs I am actually doing that atm I create my pen using a test pen and the original pen
Luke
@lukenetti3
Jun 20 2016 19:30
Can anyone show me how I would go about making the background colors fade in on each click? Here is my code.
http://codepen.io/lukenetti3/pen/rLeXmZ?editors=0010
Anders Rydholm
@anders-rydholm
Jun 20 2016 19:31
There's some doc I'm not sure exactly.
$( "#newQuote" ).click(function() {
$( "#body" ).fadeIn( "slow", function() {
// Animation complete
});
});
something like that in the JS
Dan Logajan
@hiltydiggs
Jun 20 2016 19:34
@lukenetti3 or just .background {transition: background-color 2s;}
@lukenetti3 in your css
Luke
@lukenetti3
Jun 20 2016 19:37
@hiltydiggs Thank you so much! I figured it didn't have to be that complicated but I couldn't get it working correctly. So that is just transitioning my color which I have changing on each click, correct? Want to make sure I understand my own code
CamperBot
@camperbot
Jun 20 2016 19:37
lukenetti3 sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 547 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
Anders Rydholm
@anders-rydholm
Jun 20 2016 19:40
I'm working on my portfolio, almost ready to send it out using jQuery tabs UI, but the content aligns below the menu, not next too it. Any ideas? I think it's something with the .container declaration of the CSS http://codepen.io/DersHolm/pen/jrbadz
Dan Logajan
@hiltydiggs
Jun 20 2016 19:40
@lukenetti3 transition just waits for a change on whatever attribute you pass it. It says experimental on MDN, but if you look at caniuse it's fully supported.
Luke
@lukenetti3
Jun 20 2016 19:43
@hiltydiggs I see what your saying. Thanks
CamperBot
@camperbot
Jun 20 2016 19:43
lukenetti3 sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:warning: lukenetti3 already gave hiltydiggs points
Dan Logajan
@hiltydiggs
Jun 20 2016 19:47
@anders-rydholm if you add display: inline-block; to ul it works.
Tyler Moeller
@TylerMoeller
Jun 20 2016 19:47
@anders-rydholm Small typo: Line 73 of your css should be float instead of loat
Anders Rydholm
@anders-rydholm
Jun 20 2016 19:47
Nice, I went back to the tabs spec here https://jqueryui.com/tabs/#vertical and pasted the head in that also worked.
Manuel Micu
@manu-4216
Jun 20 2016 19:47
Hi. I have a button issue on Chrome on android. When I press my clock (button element), I get this semi-transparent blue rectangle on top: https://goo.gl/photos/4EmQRQi68EDjkocLA
Anyone knows how to get rid of it?
Here is my code: http://codepen.io/manu4216/full/JKKLLp/
Anders Rydholm
@anders-rydholm
Jun 20 2016 19:48
i forked it here to see the difference http://codepen.io/DersHolm/pen/aZmXqo
Dan Logajan
@hiltydiggs
Jun 20 2016 19:48
@TylerMoeller @anders-rydholm good catch
Anders Rydholm
@anders-rydholm
Jun 20 2016 19:48
Thanks @hiltydiggs @TylerMoeller
CamperBot
@camperbot
Jun 20 2016 19:48
anders-rydholm sends brownie points to @hiltydiggs and @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 548 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
:cookie: 613 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Dan Logajan
@hiltydiggs
Jun 20 2016 19:51
@manu-4216 try this
Sundeep
@pidugusundeep
Jun 20 2016 19:54
@pidugusundeep
heyy any one worked with file uploading in php ?
please help me in storing images uploaded by the users, and i need to store the images in a location and then i need to store the temporary location in the database is that so then please let me have some sources to go through
Manuel Micu
@manu-4216
Jun 20 2016 19:55
@hiltydiggs Good try, but that didn't fix it. "outline: none" is for another issue
Dan Logajan
@hiltydiggs
Jun 20 2016 19:55
@manu-4216 how about blur()?
Manuel Micu
@manu-4216
Jun 20 2016 19:56
How? blur: none ?
Dan Logajan
@hiltydiggs
Jun 20 2016 19:56
@manu-4216 no blur() in javascript.
Manuel Micu
@manu-4216
Jun 20 2016 19:58
@hiltydiggs nope...
Dan Logajan
@hiltydiggs
Jun 20 2016 19:58
@manu-4216 do you have a link to it?
Manuel Micu
@manu-4216
Jun 20 2016 19:58
Dan Logajan
@hiltydiggs
Jun 20 2016 20:03
@manu-4216 it would be something like:
$( "*" ).click(function(){
  this.blur();
});
Tyler Moeller
@TylerMoeller
Jun 20 2016 20:03
@manu-4216 Add this to #clock in your CSS: -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
More info: https://groups.google.com/forum/#!topic/phonegap/OmmCuTotZI4
Dan Logajan
@hiltydiggs
Jun 20 2016 20:07
@manu-4216 but I can't replicate the problem on Chrome Beta 52.0/Android 5.1, so I'm not sure.
Manuel Micu
@manu-4216
Jun 20 2016 20:07
@TylerMoeller Yeah, that worked! Thanks
CamperBot
@camperbot
Jun 20 2016 20:07
:cookie: 614 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
manu-4216 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
Tyler Moeller
@TylerMoeller
Jun 20 2016 20:07
Good news! :)
Manuel Micu
@manu-4216
Jun 20 2016 20:07
@hiltydiggs It worked with that -webkit-tap-highlight-color: rgba(255, 255, 255, 0); fix Thank you anyway :)
CamperBot
@camperbot
Jun 20 2016 20:07
manu-4216 sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 549 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
Dan Logajan
@hiltydiggs
Jun 20 2016 20:08
@manu-4216 good! Nice work, @TylerMoeller.
Colin
@finkbeca
Jun 20 2016 20:09
Can some one help me center something I've been trying for a long time. I have caption label "project 1" -"project 4" under picture that are in the bootstrap grid format but I can't get the caption "project 1-4" to become center under it. I've tried text-align: center. If someone could please look it would be so greatly appreciated. http://codepen.io/buddyfinkbear/pen/YWXLPZ
andreas2249
@andreas2249
Jun 20 2016 20:10
@hiltydiggs, I've read here to only use one .container class in a page. On StackOverflow, mixed opinions on using multiple containers (everyone does agree to never nest them). Bootstrap's own websites do use multiple containers. What's your opinion and practice? Single or multiples? Thanks in advance.
CamperBot
@camperbot
Jun 20 2016 20:10
andreas2249 sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 550 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
Luke
@lukenetti3
Jun 20 2016 20:14
So I am trying to get these quotes to be wrapped in quotation marks. I can only get the quotation mark to be above and below the quote, not before and after. It is on line 12. For some reason when I do the "<span" without the ending it works for the first part, pretty sure this isn't right but not sure how to fix it. Here is my code.
http://codepen.io/lukenetti3/pen/rLeXmZ?editors=0010
Tyler Moeller
@TylerMoeller
Jun 20 2016 20:14
@finkbeca The text is centered correctly, but you'll need to use a larger column size, like col-xs-3 to get the text to center under the image. The image is currently overflowing out of the grid, while the text wraps within. To debug, try this in your css:
* {
  border: 1px solid black;
}
Dan Logajan
@hiltydiggs
Jun 20 2016 20:15
@andreas2249 I don't see any problem with it. You can use containers to group related rows. But it seems redundant unless you need to put something outside of a container in between two containers. I don't use bootstrap a ton, so I'm probably not the best to answer.
andreas2249
@andreas2249
Jun 20 2016 20:16
Thank you, @hiltydiggs. :+1:
CamperBot
@camperbot
Jun 20 2016 20:16
andreas2249 sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:warning: andreas2249 already gave hiltydiggs points
Colin
@finkbeca
Jun 20 2016 20:17
@TylerMoeller Thanks so much I'll go try taht
CamperBot
@camperbot
Jun 20 2016 20:17
finkbeca sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 615 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Colin
@finkbeca
Jun 20 2016 20:17
tat*
that* haha
andreas2249
@andreas2249
Jun 20 2016 20:17
@lukenetti3, although not a direct answer to your question, you can use bit.ly or tinyurl.com to shorten those very long links. It'll make your code easier to read...
Tyler Moeller
@TylerMoeller
Jun 20 2016 20:18
@lukenetti3 Wrap your q tags in a paragraph: <p><q><span" + quote.content + "</q></p>
Arsalan Sabir
@aayanqazi
Jun 20 2016 20:19
help me
CamperBot
@camperbot
Jun 20 2016 20:19

:point_right: adding snippets to sublime text [wiki]

Adding Snippets To Your Sublime Text Installation

If you are a user of sublime text (I hope you are, it kicks ass. You can get it here), then you may have already noticed some of the tab completion capabilities. For example, when you are opening an html tag such as <p>, it automatically closes the tag as soon as you type /. You can get similar functionality for pieces of code you end up re-writing over and over, and it's surprisingly easy!

Here's an example, which activates after typing div and then tab:

alt text

:pencil: read more about adding snippets to sublime text on the FCC Wiki

Tyler Moeller
@TylerMoeller
Jun 20 2016 20:20
Np @finkbeca good luck, hope that helped. col-xs-3 seems to work well for getting the text centered.
Arsalan Sabir
@aayanqazi
Jun 20 2016 20:20
I am in wikipedia viewer project but i dont know about how to use wikipedia aPi ?
please Help me
Tyler Moeller
@TylerMoeller
Jun 20 2016 20:21
@aayanqazi Here's a good place to start: https://www.mediawiki.org/wiki/API:Main_page
Luke
@lukenetti3
Jun 20 2016 20:21
@TylerMoeller That makes more sense. Why does the span not have an end to it? The beginning span element I mean.
Tyler Moeller
@TylerMoeller
Jun 20 2016 20:22
@lukenetti3 That is odd - it must be the browser trying to be smart. In this case, it fixed the issue for you :)
Browsers do well at handling incorrect HTML
Dan Logajan
@hiltydiggs
Jun 20 2016 20:23
@lukenetti3 @TylerMoeller yeah. You should definitely add a closing, though.
Luke
@lukenetti3
Jun 20 2016 20:24
@hiltydiggs When I add a closing though it messes up where the quotes are. For some reason this worked.
http://codepen.io/lukenetti3/pen/rLeXmZ?editors=0010
Tyler Moeller
@TylerMoeller
Jun 20 2016 20:24
Agreed, a better fix is needed
Arsalan Sabir
@aayanqazi
Jun 20 2016 20:24
@TylerMoeller I read it but i did'nt understand
recently i used location api and Weather APi in last project ..
Colin
@finkbeca
Jun 20 2016 20:25
@TylerMoeller I have done what you said but I am still having problems. I put the borders around it and I can see the problem , however I have no idea on how to fix it. I have used text-align: center and it just seem to make it more off. Please Help!
Tyler Moeller
@TylerMoeller
Jun 20 2016 20:27
@finkbeca You're very close, remove the offsets you have in the second div of each row. It wouldn't hurt to do a brief review of Bootstrap's grid system again to get a better hang of this: http://getbootstrap.com/css/#grid
@aayanqazi They have an example URL for the API on that page. You can also test different URLs in their sandbox: https://en.wikipedia.org/wiki/Special:ApiSandbox#action=query&titles=Main%20Page&prop=revisions&rvprop=content&format=jsonfm
@aayanqazi Once you get the URL you want, it will be very similar to getting the weather
Colin
@finkbeca
Jun 20 2016 20:29
@TylerMoeller The second offset? then they wont line up in the places I wanted?
Tyler Moeller
@TylerMoeller
Jun 20 2016 20:30
@finkbeca Check out the examples at the bottom of this page and notice how they do the offsets: https://getbootstrap.com/examples/grid/
@finkbeca This is also a great explanation of how offsets work: http://getbootstrap.com/css/#grid-offsetting
Colin
@finkbeca
Jun 20 2016 20:31
@TylerMoeller nothing has changed.
Luke
@lukenetti3
Jun 20 2016 20:31
@TylerMoeller @hiltydiggs I think I will just remove the quotes. Not sure why its doing that. I tried it on google chrome and its doing the same thing.
@TylerMoeller @hiltydiggs Thanks for the help guys
CamperBot
@camperbot
Jun 20 2016 20:32
lukenetti3 sends brownie points to @tylermoeller and @hiltydiggs :sparkles: :thumbsup: :sparkles:
:warning: lukenetti3 already gave hiltydiggs points
:cookie: 616 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Dan Logajan
@hiltydiggs
Jun 20 2016 20:32
@lukenetti3 huh. Yeah working on it now.
Tyler Moeller
@TylerMoeller
Jun 20 2016 20:32
@lukenetti3 Yeah, just add them in manually I guess. I couldn't figure it out lol
Arsalan Sabir
@aayanqazi
Jun 20 2016 20:32
with json apii ... will i use .each for fetching data in html table
?
Luke
@lukenetti3
Jun 20 2016 20:33
@TylerMoeller How would I add them manually?
Colin
@finkbeca
Jun 20 2016 20:34
@TylerMoeller I've followed what you've said. I read the bootstrap guide. I still have no idea why caption and the image won't both center in the images
Dave
@BeingDS
Jun 20 2016 20:35
Hey all. This is my code for Profile Lookup. It's not working, and I wonder why. Any insights?

//Setup
var contacts = [
    {
        "firstName": "Akira",
        "lastName": "Laine",
        "number": "0543236543",
        "likes": ["Pizza", "Coding", "Brownie Points"]
    },
    {
        "firstName": "Harry",
        "lastName": "Potter",
        "number": "0994372684",
        "likes": ["Hogwarts", "Magic", "Hagrid"]
    },
    {
        "firstName": "Sherlock",
        "lastName": "Holmes",
        "number": "0487345643",
        "likes": ["Intriguing Cases", "Violin"]
    },
    {
        "firstName": "Kristian",
        "lastName": "Vos",
        "number": "unknown",
        "likes": ["Javascript", "Gaming", "Foxes"]
    }
];


function lookUpProfile(firstName, prop){
// Only change code below this line
  var entry = 0;
  var record = "";
  var result = "";
  while (entry < contacts.length) {
    if (firstName !== contacts[entry].firstName) {
      if (entry === contacts.length) {
        return "No such contact";
      }
      else {
        entry++;
      }
    }
    else if (firstName === contacts[entry].firstName) {
      if (prop !== contacts[entry][prop]) {
        return "No such property";
      }
      else if (prop === contacts[entry][prop]) {
        result = contacts[entry][prop];
        return result;
      }
    }
  }
// Only change code above this line
}

// Change these values to test your function
lookUpProfile("Akira", "likes");
Dan Logajan
@hiltydiggs
Jun 20 2016 20:35
@lukenetti3 $quotes.html("<p>\"<span>" + quote.content + "</span>\"</p>" + '<b>' + '<p style="color:grey">' + '- ' + quote.title + '</p>'); and .quote p {display: inline;} work
@lukenetti3 even better $quotes.html("<p>&quot;<span>" + quote.content + "</span>&quot;</p>" + '<b>' + '<p style="color:grey">' + '- ' + quote.title + '</p>');
Tyler Moeller
@TylerMoeller
Jun 20 2016 20:39
This message was deleted
Colin
@finkbeca
Jun 20 2016 20:41
@TylerMoeller I understand stand how to center the columns , my question is how Do I center INSIDE the column for the image and caption to both be center. Thanks
CamperBot
@camperbot
Jun 20 2016 20:41
finkbeca sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:warning: finkbeca already gave tylermoeller points
Tyler Moeller
@TylerMoeller
Jun 20 2016 20:41
@finkbeca You'll want to offset by 3 instead of 2, but your CSS also seems to be affecting it. Let me see if I can dive in a little more closely and see
Colin
@finkbeca
Jun 20 2016 20:44
@TylerMoeller Thankyou!
CamperBot
@camperbot
Jun 20 2016 20:44
:warning: finkbeca already gave tylermoeller points
finkbeca sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
Luke
@lukenetti3
Jun 20 2016 20:46
@hiltydiggs Okay I got that working but now my author part is inline as well. In my CSS I have .quote p... Is that right?
Dave
@BeingDS
Jun 20 2016 20:47
anyone?
Dan Logajan
@hiltydiggs
Jun 20 2016 20:48
@lukenetti3 I just noticed you switch from double quote to single quote halfway through this function. Hold on.
Dave
@BeingDS
Jun 20 2016 20:48
Hey all. This is my code for Profile Lookup. It's not working, and I wonder why. Any insights?

//Setup
var contacts = [
    {
        "firstName": "Akira",
        "lastName": "Laine",
        "number": "0543236543",
        "likes": ["Pizza", "Coding", "Brownie Points"]
    },
    {
        "firstName": "Harry",
        "lastName": "Potter",
        "number": "0994372684",
        "likes": ["Hogwarts", "Magic", "Hagrid"]
    },
    {
        "firstName": "Sherlock",
        "lastName": "Holmes",
        "number": "0487345643",
        "likes": ["Intriguing Cases", "Violin"]
    },
    {
        "firstName": "Kristian",
        "lastName": "Vos",
        "number": "unknown",
        "likes": ["Javascript", "Gaming", "Foxes"]
    }
];


function lookUpProfile(firstName, prop){
// Only change code below this line
  var entry = 0;
  var record = "";
  var result = "";
  while (entry < contacts.length) {
    if (firstName !== contacts[entry].firstName) {
      if (entry === contacts.length) {
        return "No such contact";
      }
      else {
        entry++;
      }
    }
    else if (firstName === contacts[entry].firstName) {
      if (prop !== contacts[entry][prop]) {
        return "No such property";
      }
      else if (prop === contacts[entry][prop]) {
        result = contacts[entry][prop];
        return result;
      }
    }
  }
// Only change code above this line
}

// Change these values to test your function
lookUpProfile("Akira", "likes");
Dan Logajan
@hiltydiggs
Jun 20 2016 20:51
@lukenetti3 a simple <br /> would work.
@lukenetti3 $quotes.html('<p>&quot;<span>' + quote.content + '</span>&quot;</p>' + '<br /><b><p style="color:grey">' + '- ' + quote.title + '</b></p>');
Luke
@lukenetti3
Jun 20 2016 20:53
@hiltydiggs Thanks! It works. What should I be using when it comes to single quotes or double. Didn't even realize I did that.
CamperBot
@camperbot
Jun 20 2016 20:53
lukenetti3 sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 551 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
Luke
@lukenetti3
Jun 20 2016 20:53
@hiltydiggs And can you explain a little by what the &quot was doing?
Tyler Moeller
@TylerMoeller
Jun 20 2016 20:55
@finkbeca Here's a fork to show you one way to fix it: http://codepen.io/TylerMoeller/pen/gMwEMz?editors=1100
You had fixed widths for your images which was interfering with responsiveness. To keep them from overlapping, you can use width: 100% in the fork. And, if you like that 250px width, just do this:
.image {
 width: 100%;
 max-width: 250px;
}
BeSaRa
@BeSaRa
Jun 20 2016 20:56
@Dave
you can make a new solution
//Setup
var contacts = [
    {
        "firstName": "Akira",
        "lastName": "Laine",
        "number": "0543236543",
        "likes": ["Pizza", "Coding", "Brownie Points"]
    },
    {
        "firstName": "Harry",
        "lastName": "Potter",
        "number": "0994372684",
        "likes": ["Hogwarts", "Magic", "Hagrid"]
    },
    {
        "firstName": "Sherlock",
        "lastName": "Holmes",
        "number": "0487345643",
        "likes": ["Intriguing Cases", "Violin"]
    },
    {
        "firstName": "Kristian",
        "lastName": "Vos",
        "number": "unknown",
        "likes": ["Javascript", "Gaming", "Foxes"]
    }
];
function LookUp(name , prop){
var items = contacts.filter(function(item){
if(item.firstName === name ){
return item;
}
});

if(item.length){
return item[0][prop];
}
}
@BeingDS
you can make a new solution
//Setup
var contacts = [
    {
        "firstName": "Akira",
        "lastName": "Laine",
        "number": "0543236543",
        "likes": ["Pizza", "Coding", "Brownie Points"]
    },
    {
        "firstName": "Harry",
        "lastName": "Potter",
        "number": "0994372684",
        "likes": ["Hogwarts", "Magic", "Hagrid"]
    },
    {
        "firstName": "Sherlock",
        "lastName": "Holmes",
        "number": "0487345643",
        "likes": ["Intriguing Cases", "Violin"]
    },
    {
        "firstName": "Kristian",
        "lastName": "Vos",
        "number": "unknown",
        "likes": ["Javascript", "Gaming", "Foxes"]
    }
];
function LookUp(name , prop){
var items = contacts.filter(function(item){
if(item.firstName === name ){
return item;
}
});

if(item.length){
return item[0][prop];
}
}
Colin
@finkbeca
Jun 20 2016 20:59
@TylerMoeller Thank you again for taking your time to show me what I was doing wrong. I learned a lot, and I greatly appreciate it.
CamperBot
@camperbot
Jun 20 2016 20:59
finkbeca sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:warning: finkbeca already gave tylermoeller points
Dave
@BeingDS
Jun 20 2016 20:59
@BeSaRa Thanks for responding. But I don't think I understand.
CamperBot
@camperbot
Jun 20 2016 20:59
beingds sends brownie points to @besara :sparkles: :thumbsup: :sparkles:
:cookie: 201 | @besara |http://www.freecodecamp.com/besara
Tyler Moeller
@TylerMoeller
Jun 20 2016 21:00
np, lunch break is over now :) cya fcc
Dan Logajan
@hiltydiggs
Jun 20 2016 21:03
@lukenetti3 you can use either single or double, but just try to be consistent. There are arguments for/against both. &quot; just helps avoid errors from escaping characters and creating valid html. Here's a character chart
Luke
@lukenetti3
Jun 20 2016 21:09
@hiltydiggs Okay, thanks!
CamperBot
@camperbot
Jun 20 2016 21:09
lukenetti3 sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:warning: lukenetti3 already gave hiltydiggs points
BeSaRa
@BeSaRa
Jun 20 2016 21:21
@BeingDS
  // this array of objects 

  var contacts = [
    {
        "firstName": "Akira",
        "lastName": "Laine",
        "number": "0543236543",
        "likes": ["Pizza", "Coding", "Brownie Points"]
    },
    {
        "firstName": "Harry",
        "lastName": "Potter",
        "number": "0994372684",
        "likes": ["Hogwarts", "Magic", "Hagrid"]
    },
    {
        "firstName": "Sherlock",
        "lastName": "Holmes",
        "number": "0487345643",
        "likes": ["Intriguing Cases", "Violin"]
    },
    {
        "firstName": "Kristian",
        "lastName": "Vos",
        "number": "unknown",
        "likes": ["Javascript", "Gaming", "Foxes"]
    }
];

  // this function to return the object or field in object from contacts array 
 // @name : search in firstName in array by this params
 // @prop : that is what you need function to return from found item it is optional if you dont provide it the entire object will return 
  function lookUp(name , prop){
    var found = null;
   // if no name return null  
    if(!name){
      return found;
    }
    // make filter to array and search for item has fristName == name
    // item var it is array 
    var item = contacts.filter(function(iteminArray){
      // if firstname == name return the item in item array
      if(iteminArray.firstName === name) {
        return iteminArray;
      }
    });
    // if item arary has length then waht you search about it is found 
    if(item.length){
       /*

       if(prop ){
         found = item[0][prop];
       }else{
         found = item

       }
       */

      found = (prop) ? item[0][prop] : item[0];
    }
    return found;
  }
  // invoke the function 
  var xx = lookUp('Akira','likes');
console.log(xx);
  // this array of objects 

  var contacts = [
    {
        "firstName": "Akira",
        "lastName": "Laine",
        "number": "0543236543",
        "likes": ["Pizza", "Coding", "Brownie Points"]
    },
    {
        "firstName": "Harry",
        "lastName": "Potter",
        "number": "0994372684",
        "likes": ["Hogwarts", "Magic", "Hagrid"]
    },
    {
        "firstName": "Sherlock",
        "lastName": "Holmes",
        "number": "0487345643",
        "likes": ["Intriguing Cases", "Violin"]
    },
    {
        "firstName": "Kristian",
        "lastName": "Vos",
        "number": "unknown",
        "likes": ["Javascript", "Gaming", "Foxes"]
    }
];


  function lookUp(name , prop){
    var found = null;

    if(!name){
      return found;
    }

    var item = contacts.filter(function(iteminArray){

      if(iteminArray.firstName === name) {
        return iteminArray;
      }
    });

    if(item.length){
       /*
       if(prop ){
         found = item[0][prop];
       }else{
         found = item

       }
       */

      found = (prop) ? item[0][prop] : item[0];
    }
    return found;
  }

  var xx = lookUp('Akira','likes');
@BeingDS
  // this array of objects 

  var contacts = [
    {
        "firstName": "Akira",
        "lastName": "Laine",
        "number": "0543236543",
        "likes": ["Pizza", "Coding", "Brownie Points"]
    },
    {
        "firstName": "Harry",
        "lastName": "Potter",
        "number": "0994372684",
        "likes": ["Hogwarts", "Magic", "Hagrid"]
    },
    {
        "firstName": "Sherlock",
        "lastName": "Holmes",
        "number": "0487345643",
        "likes": ["Intriguing Cases", "Violin"]
    },
    {
        "firstName": "Kristian",
        "lastName": "Vos",
        "number": "unknown",
        "likes": ["Javascript", "Gaming", "Foxes"]
    }
];


  function lookUp(name , prop){
    var found = null;

    if(!name){
      return found;
    }

    var item = contacts.filter(function(iteminArray){

      if(iteminArray.firstName === name) {
        return iteminArray;
      }
    });

    if(item.length){
       /*
       if(prop ){
         found = item[0][prop];
       }else{
         found = item

       }
       */

      found = (prop) ? item[0][prop] : item[0];
    }
    return found;
  }

  var xx = lookUp('Akira','likes');
D.Mills
@millsdee74
Jun 20 2016 21:47
Hello Campers. I have a dilemma. I'm working on the Twitch.tv project. It shows I'm connecting to the api. I also ran loop which displays the number of users, but none of their data is showing from the backend. Can anyone tell me how to get the data to populate? I appreciate the help. https://codepen.io/millsdee42/pen/ZOpPjW?editors=1111
Dan Logajan
@hiltydiggs
Jun 20 2016 21:49
@millsdee74 your ajax call would have to be inside of the each loop with a dynamically created url for each user.
D.Mills
@millsdee74
Jun 20 2016 21:51
@hiltydiggs can you specify when you say "ajax call would have to be inside of the each loop"?
Misti Wolanski
@Carradee
Jun 20 2016 21:51
On that "Build a Tribute Page", am I just supposed to find some historic figure to write about? That's not clear. B/c anybody I'd want to write a tribute to either doesn't have a "Read More" link available or doesn't have any photos licensed in such a way that I could use them.
I have a problem with css positioning
Marco Mazzeo
@Doko85
Jun 20 2016 21:52
you have to talk of anything you want @Carradee
Uğur
@UgurKurt
Jun 20 2016 21:52
can anyone suggest a solution
Marco Mazzeo
@Doko85
Jun 20 2016 21:52
I also have problems trying to find a proper subject.
Misti Wolanski
@Carradee
Jun 20 2016 21:55
@Doko85 That contradicts the defined requirements listed in the instructions. It's defined as a tribute page and state that you need an image, text, and a link to an external website with further information.
Dan Logajan
@hiltydiggs
Jun 20 2016 21:56
@millsdee74 something like:
         $.each(users, function(i, users){
           $.ajax({
          type: 'GET',
          url: 'https://api.twitch.tv/kraken/users/' + user,
          headers: {
            'Client-ID': 'qubvi0p9dicv87g9a4s7etay32x6504'
          },
          success: function(data) {
             use response data here...
         });
Misti Wolanski
@Carradee
Jun 20 2016 21:56
@UgurKurt So your problem is that square that's outside the box?
Uğur
@UgurKurt
Jun 20 2016 21:57
yes
Marco Mazzeo
@Doko85
Jun 20 2016 21:57
@Carradee it's "obvious" that that person\thing has to be "famous" enough
Uğur
@UgurKurt
Jun 20 2016 21:57
now I changed it a little
it is okay when the divs are empty
Misti Wolanski
@Carradee
Jun 20 2016 21:57
@UgurKurt Your .one widths are too big.
Uğur
@UgurKurt
Jun 20 2016 21:57
but when I write anything in my divs
they change their position
Dan Logajan
@hiltydiggs
Jun 20 2016 21:58
@millsdee74 it's not exactly correct, but you have to go through each of the users in your users array and make the request based on that users unique url. Sorry, I wish I could help out more but I have to go.
Uğur
@UgurKurt
Jun 20 2016 21:59
and even I didnt put any margin on that divs
they have some margin
Misti Wolanski
@Carradee
Jun 20 2016 22:02
@UgurKurt I think I have a fix. Now let me figure out how to share it with you.
Uğur
@UgurKurt
Jun 20 2016 22:02
I am waiting
this is my new version
when I type anything in my divs,they change their position
D.Mills
@millsdee74
Jun 20 2016 22:06
@hiltydiggs 'https://api.twitch.tv/kraken/users/' + user, the url is another issue. The api will not communicate when I have "/users/' +user" in the url. And, I appreciate the suggestion but that didn't make a difference. The api is connected. The data for each user is not displaying. it comes back like this on my webpage......name: undefined, logo: undefined
•name: undefined, logo: undefined
•name: undefined, logo: undefined
•name: undefined, logo: undefined
•name: undefined, logo: undefined
•name: undefined, logo: undefined
•name: undefined, logo: undefined
•name: undefined, logo: undefined
Misti Wolanski
@Carradee
Jun 20 2016 22:06

@UgurKurt Old version was a better foundation. You want the wrapper box.

http://codepen.io/Carradee/pen/dXprEK

There are other ways to do it, but that one was the simplest with how you set it up.
Uğur
@UgurKurt
Jun 20 2016 22:08
thanks,I still cant figure out why my version didnt work but thanks ! :)
@Carradee thanks
CamperBot
@camperbot
Jun 20 2016 22:08
ugurkurt sends brownie points to @carradee :sparkles: :thumbsup: :sparkles:
:cookie: 222 | @carradee |http://www.freecodecamp.com/carradee
Uğur
@UgurKurt
Jun 20 2016 22:10
one more question,how can I veritcally center the text inside .one divs ?
D.Mills
@millsdee74
Jun 20 2016 22:12
@hiltydiggs np, appreciate the help.
Hello Campers. I have a dilemma. I'm working on the Twitch.tv project. It shows I'm connecting to the api. I also ran loop which displays the number of users, but none of their data is showing from the backend. Can anyone tell me how to get the data to populate? I appreciate the help. https://codepen.io/millsdee42/pen/ZOpPjW?editors=1111
Arsalan Sabir
@aayanqazi
Jun 20 2016 22:15
i stuck off
how to use api
Uros Tadic
@urketadic
Jun 20 2016 22:16

Hey, i am kinda done with my quote machine for now, i know it looks terrible in comparison to the example but i need help with media queries
http://codepen.io/urketadic/pen/zBKppa

Basically when i lower the screen, the quote box gets messed up. Can someone give me a hand?

Misti Wolanski
@Carradee
Jun 20 2016 22:17
@UgurKurt Ah. You're gonna have to use another method altogether for that.
@Carradee Is there a reason you're not using a table for this?
Dan Logajan
@hiltydiggs
Jun 20 2016 22:27
Tables generally aren't recommended for layout use.
@millsdee74 I'll see if I can get it fixed. Back now.
JD Tadlock
@jdtdesigns
Jun 20 2016 22:32
@sorinr It's still not clearing each timeout. Each time you type, it starts a new timeout that gets results. This causes a stack of timeouts that fire one after another. You need to clear the timeout each time the user starts typing before creating the timeout to get results. ;)
@andreas2249 Did you figure it out?
@urketadic I'd recommend adding another 10 quotes to your array if you're going to do it like that. With only 10, you sometimes get the same quote over and over due to the Math.random() firing the same number. If you have a large list of numbers to choose from, it will have less chance of choosing the same. ;)
Uros Tadic
@urketadic
Jun 20 2016 22:39
yea il add some more later, right now im just trying to fix media querries, but i dont know how
when you resize the window, you will see how quote box just disapears right
Dan Logajan
@hiltydiggs
Jun 20 2016 22:42
@millsdee74 here check this out:
var $users = $('#users');
var users = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"];
var onlineChannels = [];
var offlineChannels = [];
var url = 'https://api.twitch.tv/kraken/streams/jsonp';
$.each(users, function(index, value){
  $.ajax({
    type: 'GET',
    url: 'https://api.twitch.tv/kraken/users/' + value,
    success: function(data) {
      console.log(data);
      $users.append('<li>name: '+ data.name +', logo: '+ data.logo + '</li>'); 
    }
  });
});
JD Tadlock
@jdtdesigns
Jun 20 2016 22:43
@media screen and (max-width: 700px) {
  #quote {
    margin: 50px 100px 0;
  }
}

@media screen and (max-width: 460px) {
  #quote {
    margin: 50px 20px 0;
  }
}
@urketadic just add that below the #quote in the css
Dan Logajan
@hiltydiggs
Jun 20 2016 22:44
@millsdee74 data.logoreturns an image URL, so you'll have to put that into an <img /> element.
JD Tadlock
@jdtdesigns
Jun 20 2016 22:44
@millsdee74 Why is there a random table element in your html?
Matthew Robertson
@mrmatt1877
Jun 20 2016 22:45
Can someone tell me why the responsive navbar is not working in this http://codepen.io/mrmatt1877/pen/rLMjKj?editors=1000
JD Tadlock
@jdtdesigns
Jun 20 2016 22:46
@mrmatt1877 take the jquery-ui out and add twitter-boostrap instead
in the Settings->Javascript Tab
Uros Tadic
@urketadic
Jun 20 2016 22:47
@jdtdesigns Thank you man :D
CamperBot
@camperbot
Jun 20 2016 22:47
urketadic sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 531 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
JD Tadlock
@jdtdesigns
Jun 20 2016 22:48
Welcome ;)
andreas2249
@andreas2249
Jun 20 2016 23:00
John Doe
@codingisfun11
Jun 20 2016 23:02
what does javascript do for a tribute page
3 lines of code html,css,javascript? I am struggling to figure out what else to add to my page I know I need a picture and a quote? https://codepen.io/CodingKaz/pen/ZOpqVN
andreas2249
@andreas2249
Jun 20 2016 23:08

@jdtdesigns: (a) took out all those extra containers; (b) put myself in a full day's worth of Remedial Container-vs.-Column-vs.-Row school; (c) drank a tall glass of chilled vodka and walked the dog; (d) after all that, found the problem: The .wellat the bottom of the 'About' page (above the 'Contact' page) needed to be inside a row.

After that, everything just fit together and started working. Other stuff I couldn't align before, aligned. CSS that wasn't working, started working. The sun came out. Etc., etc. :)

JD Tadlock
@jdtdesigns
Jun 20 2016 23:09
@andreas2249 Nice! Take the <head> stuff out of the html though. The <html><head><body> tags are all added automatically by codepen. To add the css, go into Settings and under the HTML tab, paste the <link> in the 'Stuff for head' box. Also, since you figured out the rows/columns, now go in and use the col classes from Bootstrap to create the responsiveness on the page. For small screens use col-xs-<number> (usually 12 for full width of screen), and for larger use col-md or col-lg. Your column divs will have classes like this: class="col-lg-4 col-md-6 col-xs-12" for the most part.
Jack Lyons
@JackEdwardLyons
Jun 20 2016 23:13
hey guys im having trouble setting up my code for the where art thou algorithm scriping, heres my code

function whereAreYou(collection, source) {
  // What's in a name?
  var arr = [];


for ( var i = 0; i < collection.length; i++ ) {
    for ( var j = 0; j < source.length; j++ ) {
      if ( collection[i].hasOwnProperty(source[j]) ) {
        console.log("testing");
      }
    }

  }
  /*
  var newCollection = Object.keys(collection);
  var newSource = Object.values(source);

  if (newCollection.hasOwnProperty()) {
      console.log("hello");
      }

  console.log(collection);
  console.log(newSource);
*/
  // Only change code above this line
  return arr;
}

whereAreYou([{ first: "Romeo", last: "Montague" }, { first: "Mercutio", last: null }, { first: "Tybalt", last: "Capulet" }], { last: "Capulet" });
any ideas?
the console.log doesnt work
Dan Logajan
@hiltydiggs
Jun 20 2016 23:13
@andreas2249 one more bit is the padding-bottom: 600px; on #main-content
andreas2249
@andreas2249
Jun 20 2016 23:14

You're a Prince, @jdtdesigns. I did learn about your last suggestion in my study today. Even practiced all day in this Sandbox I created: http://codepen.io/andreas2249/pen/VjKqVo/

You're right, I did notice how awful it starts looking at smaller sizes. Gonna make a copy of what I have before I attempt that.

@jdtdesigns thank you again for your considerable time and effort getting me steered back on course. :) :+1:
CamperBot
@camperbot
Jun 20 2016 23:15
andreas2249 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 532 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
andreas2249
@andreas2249
Jun 20 2016 23:16
Ha, there you are, @hiltydiggs. I wanted to thank you, as well, for getting me over this hump. Learned a LOT ! Thank you so much. :) :+1:
CamperBot
@camperbot
Jun 20 2016 23:16
andreas2249 sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 552 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
Jesse Neumann
@Jesse989
Jun 20 2016 23:16
check out my pomodoro counter and let me know what you guys think. there are a couple bugs but the general idea is there. http://codepen.io/Jesse989/full/ezdBvX/
Dan Logajan
@hiltydiggs
Jun 20 2016 23:16
@JackEdwardLyons try source[j].last
@andreas2249 no problem! Glad to help!
@JackEdwardLyons wait, that's not it.
Jack Lyons
@JackEdwardLyons
Jun 20 2016 23:17
ok
andreas2249
@andreas2249
Jun 20 2016 23:18

@hiltydiggs, that 600px was to "push down" the rest of the content to only show the home page image -- the the rest could be scrolled up like a screen to cover that image.

I knew the effect I wanted. Took a shot in the dark that was the way to make it work.

Do you have a better idea on that?

Jack Lyons
@JackEdwardLyons
Jun 20 2016 23:21
what do you reckon @hiltydiggs
JD Tadlock
@jdtdesigns
Jun 20 2016 23:21
@Jesse989 That's pretty cool. I might suggest adding an alarm that goes off when it's break time and when it's time to start a new session. Good job!
Jesse Neumann
@Jesse989
Jun 20 2016 23:22
cool ty @jdtdesigns that was exactly what I was thinking!
CamperBot
@camperbot
Jun 20 2016 23:22
jesse989 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 533 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Dan Logajan
@hiltydiggs
Jun 20 2016 23:23
@andreas2249 min-height: 600px;
@JackEdwardLyons sorry. Looking at it now.
John Doe
@codingisfun11
Jun 20 2016 23:23
@codingisfun11
what does javascript do for a tribute page
3 lines of code html,css,javascript? I am struggling to figure out what else to add to my page I know I need a picture and a quote? https://codepen.io/CodingKaz/pen/ZOpqVN
Ammardinho
@Ammardinho
Jun 20 2016 23:23
guys, anybody know why when I try adding <i class="fa fa-linkedin-square"></i> nothing shows up on my page?
appreciate any help on this, been struggling for a while
JD Tadlock
@jdtdesigns
Jun 20 2016 23:25
@codingisfun11 You have html in the css tab
@Ammardinho You probably haven't added font awesome to Settings->CSS
Ammardinho
@Ammardinho
Jun 20 2016 23:29
hmm possibly, you mind refreshing me as to how to do that?
andreas2249
@andreas2249
Jun 20 2016 23:30

@hiltydiggs, oddly enough, changing that padding to min-height "breaks" the contact page again, i.e., linking to 'Contact' page shows prior section's content. (That section is cursed!)

To use min-height, does that mean I just need more content (or space) in that page? If so, how do I add dummy space to accommodate correctly using min-height?

Marco Mazzeo
@Doko85
Jun 20 2016 23:30
@Ammardinho open the Settings tab in codepen and under CSS paste this link > https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css
and then save
John Doe
@codingisfun11
Jun 20 2016 23:30
@jdtdesigns background color is html code?
Marco Mazzeo
@Doko85
Jun 20 2016 23:30
background-color is css
JD Tadlock
@jdtdesigns
Jun 20 2016 23:31
@codingisfun11 You had a <p> element inside the css
John Doe
@codingisfun11
Jun 20 2016 23:31
@jdtdesigns i dont see it :0
JD Tadlock
@jdtdesigns
Jun 20 2016 23:32
@codingisfun11 You removed it. ;)
John Doe
@codingisfun11
Jun 20 2016 23:32
@jdtdesigns lol!
Ammardinho
@Ammardinho
Jun 20 2016 23:32
you're awesome @Doko85 , thanks!
CamperBot
@camperbot
Jun 20 2016 23:32
ammardinho sends brownie points to @doko85 :sparkles: :thumbsup: :sparkles:
:cookie: 397 | @doko85 |http://www.freecodecamp.com/doko85
Dan Logajan
@hiltydiggs
Jun 20 2016 23:33
@JackEdwardLyons these are the key, values you're looking to compare:
var testKey = Object.keys(source)[0];
console.log(testKey);
var testValue = source[testKey];
console.log(testValue);
JD Tadlock
@jdtdesigns
Jun 20 2016 23:35
@hiltydiggs I believe it's actually Object.keys(source);
Dan Logajan
@hiltydiggs
Jun 20 2016 23:35
Object.keys returns an array
JD Tadlock
@jdtdesigns
Jun 20 2016 23:35
source is an object
your getting all the keys from the object
it could have multiple
Marco Mazzeo
@Doko85
Jun 20 2016 23:36
@jdtdesigns do you know how to actually design an icon like the ones in the right chat menu that have a little circle showing the online status? I want to design that inner circle...
Jack Lyons
@JackEdwardLyons
Jun 20 2016 23:36
thanks @hiltydiggs
CamperBot
@camperbot
Jun 20 2016 23:36
jackedwardlyons sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 553 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
Jack Lyons
@JackEdwardLyons
Jun 20 2016 23:37
ill give it a go !
Dan Logajan
@hiltydiggs
Jun 20 2016 23:37
@jdtdesigns you're right. I see how the problem is now.
Jack Lyons
@JackEdwardLyons
Jun 20 2016 23:41
am I doing something like this ? @hiltydiggs
for ( var i = 0; i < collection.length; i++ ) {
    if ( collection[i].hasOwnProperty(testValue) ) {
      console.log("test");
      }
    }
Dan Logajan
@hiltydiggs
Jun 20 2016 23:41
@JackEdwardLyons use var testKeys = Object.keys(source); as @jdtdesigns said. I'm working through it myself. It's been changed since I did it last.
@JackEdwardLyons sorry. Didn't mean to lead you astray.