These are chat archives for FreeCodeCamp/HelpFrontEnd

14th
Jan 2017
Pieter Stokkink
@forkerino
Jan 14 2017 00:02

check here: https://stackoverflow.com/questions/33686942/javascript-filter-callback-that-uses-arguments
especially this:

If you're not using strict mode, the value of this will always be an Object.
When you provide a primitive value for a thisArg, it will be boxed into its equivalent Object type. In this case, a new Number.

@kbaig
Tyler Moeller
@TylerMoeller
Jan 14 2017 00:07
@bestintown23 As often as you feel the need :)
mazury
@mazury
Jan 14 2017 00:55
Hi! Anybody knows why coordinates con't show here? Geolocation works, I tested it in different code. http://codepen.io/Adam92/pen/egzjNB?editors=1011
Tyler Moeller
@TylerMoeller
Jan 14 2017 01:01
@adamgithub92 navigator.geolocation only works over HTTPS. Check your console for errors:
getCurrentPosition() and watchPosition() no longer work on insecure origins. To use this feature, you should consider switching your application to a secure origin, such as HTTPS. See https://goo.gl/rStTGz for more details.
mazury
@mazury
Jan 14 2017 01:08
it works now, thanks @TylerMoeller
CamperBot
@camperbot
Jan 14 2017 01:08
adamgithub92 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1315 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Robin
@LuckyRabbits
Jan 14 2017 01:34
Hi I need help on lesson 45 "Using an ID Attribute to Style an Element"

<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
  .red-text {
    color: red;
  }

  h2 {
    font-family: Lobster, Monospace;
  }

  p {
    font-size: 16px;
    font-family: Monospace;
  }

  .thick-green-border {
    border-color: green;
    border-width: 10px;
    border-style: solid;
    border-radius: 50%;
  }

  .smaller-image {
    width: 100px;
  }

  .silver-background {
    background-color: silver;

    #cat-photo-element{
      background-color: green;
    }
  }
</style>

<h2 class="red-text">CatPhotoApp</h2>

<p>Click here for <a href="#">cat photos</a>.</p>

<a href="#"><img class="smaller-image thick-green-border" alt="A cute orange cat lying on its back. " src="https://bit.ly/fcc-relaxing-cat"></a>

<div class="silver-background">
  <p>Things cats love:</p>
  <ul>
    <li>cat nip</li>
    <li>laser pointers</li>
    <li>lasagna</li>
  </ul>
  <p>Top 3 things cats hate:</p>
  <ol>
    <li>flea treatment</li>
    <li>thunder</li>
    <li>other cats</li>
  </ol>
</div>

<form action="/submit-cat-photo" id="cat-photo-form" #="cat-photo-element">
  <label><input type="radio" name="indoor-outdoor" checked> Indoor</label>
  <label><input type="radio" name="indoor-outdoor"> Outdoor</label>
  <label><input type="checkbox" name="personality" checked> Loving</label>
  <label><input type="checkbox" name="personality"> Lazy</label>
  <label><input type="checkbox" name="personality"> Energetic</label>
  <input type="text" placeholder="cat photo URL" required>
  <button type="submit">Submit</button>
</form>
Here's my code
I'm not seeing why the background has not been changed to green.
uriznik
@uriznik
Jan 14 2017 01:39
@LuckyRabbits you have the cat-photoelement css inside the silverbackground css
Robin
@LuckyRabbits
Jan 14 2017 01:40
so add an extra }
uriznik
@uriznik
Jan 14 2017 01:40
@LuckyRabbits and in the form you would need to use id="cat-photo-element" as the id is what is used with '#' in css to target id's
@LuckyRabbits move one of the } up
Robin
@LuckyRabbits
Jan 14 2017 01:45
so @uriznik <form action="/submit-cat-photo" id="cat-photo-form" id="cat-photo-element"> </form>
and in CSS <style> #cat-photo-element{
background-color: green;
}
</style>
Like that?
uriznik
@uriznik
Jan 14 2017 01:47
@LuckyRabbits the css is ok but the form should only have one id
@LuckyRabbits ok so stick with the id of cat-photo-form and change the css to use that
Robin
@LuckyRabbits
Jan 14 2017 01:52
@uriznik Thank you for the walkthrough. That worked!
CamperBot
@camperbot
Jan 14 2017 01:52
luckyrabbits sends brownie points to @uriznik :sparkles: :thumbsup: :sparkles:
:cookie: 486 | @uriznik |http://www.freecodecamp.com/uriznik
luckyrabbits sends brownie points to @uriznik :sparkles: :thumbsup: :sparkles:
:warning: luckyrabbits already gave uriznik points
SarrahElle
@SarrahElle
Jan 14 2017 02:30
Anyone ever have any success changing the font of a bootstrap navbar? I'm stumped.
Ethan Rose
@ethanrose
Jan 14 2017 02:36
@SarrahElle you might have to add !important
@SarrahElle well, you shouldn't have to though...... ahmmm... just make sure that your css comes after the bootstrap css
are you doing it in codepen? :) can you post a link?
SarrahElle
@SarrahElle
Jan 14 2017 02:57
Thanks for responding @ethanrose I finally figured out how to target it. Just by styling the body. Derp. So far in the 2 weeks I've been coding. I've found the answer is usually simpler than you think!
CamperBot
@camperbot
Jan 14 2017 02:57
sarrahelle sends brownie points to @ethanrose :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for ethanrose
Ethan Rose
@ethanrose
Jan 14 2017 03:29
@SarrahElle haha! Yes I've found that to be often true! ;)
Nitin Chandran Nair
@NitinNair89
Jan 14 2017 04:29
Hello world!:)
CamperBot
@camperbot
Jan 14 2017 04:29

welcome to FreeCodeCamp @NitinNair89!

buiphuking
@buiphuking
Jan 14 2017 04:30
i want to show div1 after hover div2, how can i do that, guy ??????/
Nitin Chandran Nair
@NitinNair89
Jan 14 2017 04:48
use jquery or javascript
Phillip Kelley-Dotson
@pkdotson
Jan 14 2017 05:04
i need some help with my weather app.
Ezra
@EzraPlato
Jan 14 2017 05:20
Trying to build personal webpage. I don't understand how the example was able to create sections. There is the home section but then how do they create a separate portfolio section with a different background etc. All I can think of is margins?
And then making the navigation bar reference those sections??? Is it this part of the HTML [[[[[ href= "contact.asp"]]]]] that makes it go to that section
Nitin Chandran Nair
@NitinNair89
Jan 14 2017 05:22
@EzraPlato Yes, you are partially right
Tom
@moT01
Jan 14 2017 05:23
@EzraPlato you can give a section an id an jump to that section with an href to the id
Nitin Chandran Nair
@NitinNair89
Jan 14 2017 05:23
also you can use the <section> tags to creation sections.
Ezra
@EzraPlato
Jan 14 2017 05:23
@NitinNair89 thank you. Do I need to id the <section>
CamperBot
@camperbot
Jan 14 2017 05:23
ezraplato sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:cookie: 380 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
Andy McCasland
@andyvague
Jan 14 2017 05:24
:P
Nitin Chandran Nair
@NitinNair89
Jan 14 2017 05:24
Yes @EzraPlato , just like @moT01 said. The section should have an ID - section id="contact" and then you can add an internal page reference with your anchor tag - <a href="#contact">Contact Me</a>
Ezra
@EzraPlato
Jan 14 2017 05:26
@moT01 thanks. okay. I will try that. Trying not to drown
CamperBot
@camperbot
Jan 14 2017 05:26
ezraplato sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 460 | @mot01 |http://www.freecodecamp.com/mot01
Tom
@moT01
Jan 14 2017 05:27
i would try n keep it simple to start, ...you will learn so much more when you do more of the challenges and probly want to go back and redo most of it anyway
Ezra
@EzraPlato
Jan 14 2017 05:29
Yeah... I have that first opening section. THe about. Now trying to make the section below it portfolio. But not sure how to get the header "portfolio" to be below the about section. I put <section id="portfolio> do I use margin... or
The bootstrap grid somehow
@moT01
Tom
@moT01
Jan 14 2017 05:31
"portfolio" - dont forget the other quote
not sure i guess
should be below it, if you create it later in the html
Ezra
@EzraPlato
Jan 14 2017 05:32
hm. Alright I will try fiddling
Tom
@moT01
Jan 14 2017 05:32
do you have it on codepen?
Ezra
@EzraPlato
Jan 14 2017 05:33
Yes
can
can't get temp to show up. although it was just working an hour agao
Tom
@moT01
Jan 14 2017 05:35
@NitinNair89 link to the id's of the elements where you want the page to go using the id selector, #
like @NitinNair89 said
href="#portfolio"
if you want to use bootstrap or other libraries on codepen you need to add them in the codepen settings
click settings then css and at the bottom theres a quick add menu
and another one in the javascript section for javascript libraries
Nitin Chandran Nair
@NitinNair89
Jan 14 2017 05:38
@EzraPlato check the messages just above this one. They are for you! :)
Ezra
@EzraPlato
Jan 14 2017 05:38
thanks guys.
@NitinNair89 @moT01 Thanks
CamperBot
@camperbot
Jan 14 2017 05:38
ezraplato sends brownie points to @nitinnair89 and @mot01 :sparkles: :thumbsup: :sparkles:
:warning: ezraplato already gave mot01 points
:warning: ezraplato already gave nitinnair89 points
Tom
@moT01
Jan 14 2017 05:39
@EzraPlato theres a down arrow at the top right of each section of codepen, you can use it to check your code for errors, ...it might not catch em all, but its showing a few
check with the analyze css, or analyze html
Ezra
@EzraPlato
Jan 14 2017 05:40
O my god. Okay.
:smile:
Tom
@moT01
Jan 14 2017 05:41
like i said to add bootstrap use the quickadd menu, so you can just get rid of that import line
Ezra
@EzraPlato
Jan 14 2017 05:42
O. I didn't get what you meant at first. Thanks
Tom
@moT01
Jan 14 2017 05:42
if you were making it with an editor, you would need to add it like that
Ezra
@EzraPlato
Jan 14 2017 05:43
I think I'm learning on the side too much and getting confused
@moT01 I'm using this example and want to make that second section. https://codepen.io/freeCodeCamp/full/YqLyXB
I used Jamboron in the past to make the top part but this time I imported a image background. Would like to important another background.
The first one I put in the body but it was only so big so I am thinking somehow put another image right below it. Or a Jamboron or something.
Tom
@moT01
Jan 14 2017 05:46
so get on it
Ezra
@EzraPlato
Jan 14 2017 05:46
Believe me I have.
Nitin Chandran Nair
@NitinNair89
Jan 14 2017 05:46
jumbotron
Ezra
@EzraPlato
Jan 14 2017 05:46
right
Tom
@moT01
Jan 14 2017 05:46
you can target your section in css with the id
#portfolio {
    background-image();  }
Phillip Kelley-Dotson
@pkdotson
Jan 14 2017 05:50
nevermind looks like the api just stopped working for some reason
Tom
@moT01
Jan 14 2017 05:50
@pkdotson the big space in ur url?
Phillip Kelley-Dotson
@pkdotson
Jan 14 2017 05:53
yup that did it thanks @moT01
CamperBot
@camperbot
Jan 14 2017 05:53
pkdotson sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 461 | @mot01 |http://www.freecodecamp.com/mot01
mazury
@mazury
Jan 14 2017 06:47
Anybody knows why temperature won't show here? http://codepen.io/Adam92/pen/egzjNB?editors=1011
Sorin Ruse
@sorinr
Jan 14 2017 07:16
@adamgithub92 because your lat and long you retrieve with the first getJSON are not available in the second call when you construct the openweather url because they are scoped only withing the first ip-api call. you can move " });" that its closing the first getJSON at the end of the second getJSON call so the lat and lon will be also available into the child function
Muhammad Hasham
@MohammadHasham
Jan 14 2017 07:22
I need some help with simon says i have developed the logic but there is a problem
can anyone help
function callColor(counter) {

    var value = counter;
    var i = 0;
    while (value !== 0) {
      var x = Math.floor((Math.random() * 4) + 1); /**Any number generated between 1 to 4**/

      if (x == 1) {
        //yellow
        function yellowAddition(){
        $('#yellow-btn').addClass('.yellowClass');
         console.log('addition');
        }
        function yellowSubtraction(){
          $('#yellow-btn').addClass('.yellowNewClass');
        }
        setInterval(yellowAddition,1000);
        setInterval(yellowSubtraction,1000);
        //yellow
        arr[i] = x; //arr[0] = x;
        i++;
      } else if (x == 2) {
        //green
         function greenAddition(){
        $('#green-btn').addClass('.greenClass');
           console.log('addition');
        }
        function greenSubtraction(){
          $('#green-btn').addClass('.greenNewClass');
        }
        setInterval(greenAddition,1000);
        setInterval(greenSubtraction,1000);
        //green
        arr[i] = x; // arr[1] = x;
        i++;
      } else {
        //blue
        function blueAddition(){
        $('#blue-btn').addClass('.blueClass');
          console.log('addition');
        }
        function blueSubtraction(){
          $('#blue-btn').addClass('.blueNewClass');
        }
        setInterval(blueAddition,1000);
        setInterval(blueSubtraction,1000);
        //blue
        arr[i] = x; //arr[3] = x;
        i++;
      }

      value--;

    }
  }
why is the function running infinitely ?
it displays console.log(addition) afer each second and it is not stopping
@sorinr
Nitin Chandran Nair
@NitinNair89
Jan 14 2017 07:25
display the 'x' value as well and check
Muhammad Hasham
@MohammadHasham
Jan 14 2017 07:25
in log ?
@NitinNair89
x is okay i have checked that is between the range 1-4
Nitin Chandran Nair
@NitinNair89
Jan 14 2017 07:26
and the setInterval is calling your function each second.. why'd you do that?
Muhammad Hasham
@MohammadHasham
Jan 14 2017 07:26
i want the game to change the color to notify user and then return back to original state
@NitinNair89
so i have used two classes in css
any idea ? @NitinNair89
Sorin Ruse
@sorinr
Jan 14 2017 07:32
@MohammadHasham it seems for some logic reason the while (value !== 0) always evaluates true
Muhammad Hasham
@MohammadHasham
Jan 14 2017 07:32
but i have checked the value it eventually reaches zero console.log(value);
@sorinr
can you please see my pen?
actuallt the problem might be with the setinterval ? i am not sure and i am finding it really hard to figure that out!
@sorinr
mazury
@mazury
Jan 14 2017 07:39
@sorinr i figured it myself, but thanks anyway
CamperBot
@camperbot
Jan 14 2017 07:39
adamgithub92 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1076 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Jan 14 2017 07:43
@adamgithub92 welcome. :+1:
Muhammad Hasham
@MohammadHasham
Jan 14 2017 07:48
@sorinr any idea?
what i am doing wrong
Sorin Ruse
@sorinr
Jan 14 2017 07:49
@MohammadHasham can re share the pen link?
@sorinr
surya rawat
@suryarawat
Jan 14 2017 08:05
how to use wikimedia api?
MacGuffin
@MacGuffin1990
Jan 14 2017 08:30
hello every..... what is wrong with my lat&lon/http://codepen.io/MacGuffin1990/pen/pRgOKB?editors=0010
Utkarsh Agarwal
@greenutkarsh
Jan 14 2017 08:36
what is json and what is the use ??
no proper lessons are provided with json
MacGuffin
@MacGuffin1990
Jan 14 2017 08:37
sorry i can not understanding...
Sorin Ruse
@sorinr
Jan 14 2017 08:37
@MacGuffin1990 in order to use geolocation you must load your pen over https but you will have a problem with the openweather api that works only on http
MacGuffin
@MacGuffin1990
Jan 14 2017 08:38
@sorinr thanks
CamperBot
@camperbot
Jan 14 2017 08:38
macguffin1990 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1077 | @sorinr |http://www.freecodecamp.com/sorinr
MacGuffin
@MacGuffin1990
Jan 14 2017 08:38
so maybe i should use the weather underground
Sorin Ruse
@sorinr
Jan 14 2017 08:38
@MacGuffin1990 yes. or apixu.com
MacGuffin
@MacGuffin1990
Jan 14 2017 08:39
@sorinr thank u i will make a try
CamperBot
@camperbot
Jan 14 2017 08:39
macguffin1990 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: macguffin1990 already gave sorinr points
Utkarsh Agarwal
@greenutkarsh
Jan 14 2017 08:40
@greenutkarsh
what is json and what is the use ??
no proper lessons are provided with json
Sorin Ruse
@sorinr
Jan 14 2017 09:14
@MacGuffin1990 to the openweather url you need to add &callback=? and it work with hard-coded location
MacGuffin
@MacGuffin1990
Jan 14 2017 10:00
if i also want to use the openweather what should i do @sorinr
Sorin Ruse
@sorinr
Jan 14 2017 10:04
@MacGuffin1990 you have to use an ip location api like http://ip-api.com/docs/api:json
MacGuffin
@MacGuffin1990
Jan 14 2017 10:09
@sorinr get the location via ip????
Sorin Ruse
@sorinr
Jan 14 2017 10:10
@MacGuffin1990 yes but if the user has a dynamic ip the location its not so accurate
@MacGuffin1990 try this link: http://ip-api.com/json
MacGuffin
@MacGuffin1990
Jan 14 2017 10:12
ok thanks @sorinr
CamperBot
@camperbot
Jan 14 2017 10:12
macguffin1990 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1078 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Jan 14 2017 10:12
@MacGuffin1990 welcome
Sander Berntsen
@sbxn14
Jan 14 2017 12:49
guys margin: auto; wont center my div. what am I doing wrong?
MaxLAB
@Max-LAB
Jan 14 2017 12:50
@sbxn14 you can use text-align:center;
if that is desired behavior you want
Sander Berntsen
@sbxn14
Jan 14 2017 12:50
yea but I want the text to remain aligned to the left as it looks better than the centered one for quotes
else I would've
Ghulam Shabir
@ghulamshabir
Jan 14 2017 12:52
@sbxn14 make sure you have set element's width less than to that of the page and set left and right margins to auto
Sander Berntsen
@sbxn14
Jan 14 2017 12:52
ah ill try that! @ghulamshabir
abhijith shenoy
@shenoyabhijith
Jan 14 2017 12:53
need help on the weather app
Sander Berntsen
@sbxn14
Jan 14 2017 12:53
@ghulamshabir setting the width to 60% did the trick! thanks!!
CamperBot
@camperbot
Jan 14 2017 12:53
sbxn14 sends brownie points to @ghulamshabir :sparkles: :thumbsup: :sparkles:
:star2: 1672 | @ghulamshabir |http://www.freecodecamp.com/ghulamshabir
abhijith shenoy
@shenoyabhijith
Jan 14 2017 12:53
how do i merge key with api
Ghulam Shabir
@ghulamshabir
Jan 14 2017 12:53
@sbxn14 :smile:
Sander Berntsen
@sbxn14
Jan 14 2017 12:54
god I cant wait for the javascript part of this project >__> im so bad at it
abhijith shenoy
@shenoyabhijith
Jan 14 2017 12:54
@ghulamshabir
Ghulam Shabir
@ghulamshabir
Jan 14 2017 12:55
@shenoyabhijith what do you mean
abhijith shenoy
@shenoyabhijith
Jan 14 2017 12:55
the api needs a key
right
im confused about implementation
Ghulam Shabir
@ghulamshabir
Jan 14 2017 12:56
you need to sign up an account for that
you have the key ?
abhijith shenoy
@shenoyabhijith
Jan 14 2017 12:57
yes
i just signed up and got a key
Ghulam Shabir
@ghulamshabir
Jan 14 2017 12:58
i think its APPID=key query parameter
so it goes in to the api url with &
abhijith shenoy
@shenoyabhijith
Jan 14 2017 12:59
i need to manually add it?
in the url
?
Ghulam Shabir
@ghulamshabir
Jan 14 2017 13:01
yes
Sander Berntsen
@sbxn14
Jan 14 2017 13:04
is there a way to make a button change the background color but also change the text color (they can never be the same and it must always be easy to read so no colors that are too similar) is something like this possible with javascript or jquery?
Ghulam Shabir
@ghulamshabir
Jan 14 2017 13:09
@sbxn14 yes but you will need to change color and background-color separately
i mean you can not just change background-color to get fore-ground color changed
MaxLAB
@Max-LAB
Jan 14 2017 13:11
@sbxn14 you can create different classes in css, and apply them with javascript or jQuery
Muhammad Hasham
@MohammadHasham
Jan 14 2017 13:11
i want to store all the user input generated from clicks on my simon says game in a separate array and compare with the computer generated pattern.Do i need to call the function for comparison every time the user enters something
MaxLAB
@Max-LAB
Jan 14 2017 13:11
    .yellow {
        color: darkkhaki;
        background-color: yellow;
    }

    .aqua {
        color: mediumaquamarine;
        background-color: aqua;
    }

    .blue {
        color: lightblue;
        background-color: blue;
    }
@sbxn14
Sander Berntsen
@sbxn14
Jan 14 2017 13:12
@Max-LAB @ghulamshabir ah got it. ill try some stuff eventually, if it doesnt work out ill try to find a code online and learn to understand it and just use that.
thanks
MaxLAB
@Max-LAB
Jan 14 2017 13:13
@sbxn14 go for it :+1:
Sander Berntsen
@sbxn14
Jan 14 2017 13:18
I want to use font awesome and I got this code for it
<script src="https://use.fontawesome.com/ce1c8a4e40.js"></script>
do I paste this on top or add it to the javascript thing
as its a js
badalsaibo
@heyDante
Jan 14 2017 13:18
@sbxn14 top of the html code
Sander Berntsen
@sbxn14
Jan 14 2017 13:19
@heyDante okay thanks
CamperBot
@camperbot
Jan 14 2017 13:19
sbxn14 sends brownie points to @heydante :sparkles: :thumbsup: :sparkles:
:cookie: 239 | @heydante |http://www.freecodecamp.com/heydante
Muhammad Hasham
@MohammadHasham
Jan 14 2017 13:19
@sbxn14 Place that in <head> tag
Sander Berntsen
@sbxn14
Jan 14 2017 13:19
@MohammadHasham does it HAVE to be in the head? as I dont have one right now and I dont need one so yea
Muhammad Hasham
@MohammadHasham
Jan 14 2017 13:20
@sbxn14 it is a good practice to make head and body separate
Sander Berntsen
@sbxn14
Jan 14 2017 13:20
yea but Im not having a title or anything so I thought it wouldnt be necessary to have a head.
Muhammad Hasham
@MohammadHasham
Jan 14 2017 13:20
i recommend you to do so.It would contain the title of your page and libraries.
okay that's your choice.You can add in html then
@sbxn14
no worries.
Sander Berntsen
@sbxn14
Jan 14 2017 13:21
okay thanks @MohammadHasham
CamperBot
@camperbot
Jan 14 2017 13:21
sbxn14 sends brownie points to @mohammadhasham :sparkles: :thumbsup: :sparkles:
:cookie: 338 | @mohammadhasham |http://www.freecodecamp.com/mohammadhasham
Muhammad Hasham
@MohammadHasham
Jan 14 2017 13:21
:+1
DarylKnapp
@DarylKnapp
Jan 14 2017 13:21
Good Morning Devs!
Sander Berntsen
@sbxn14
Jan 14 2017 13:21
now to figure out how to make a twitter icon of font awesome into a button..
@DarylKnapp morning!
Muhammad Hasham
@MohammadHasham
Jan 14 2017 13:21
just add a href @sbxn14
if you want to link that somewhere
Sander Berntsen
@sbxn14
Jan 14 2017 13:22
i want it to go straight to twitter so you can tweet the quote
as its something thats a must for the profject
Muhammad Hasham
@MohammadHasham
Jan 14 2017 13:22
yeah if you are doing that fcc project make sure to use their api
@sbxn14
you need to get the link
Sander Berntsen
@sbxn14
Jan 14 2017 13:22
twitter api?
alright ill google it
Muhammad Hasham
@MohammadHasham
Jan 14 2017 13:22
yeah :D
Sander Berntsen
@sbxn14
Jan 14 2017 13:24
@MohammadHasham ```
<a target="_blank" class="tweet"
  href="https://twitter.com/intent/tweet">
Tweet</a>
that was easy
xD
badalsaibo
@heyDante
Jan 14 2017 13:25
lol
@sbxn14 you wanna add icons too
Muhammad Hasham
@MohammadHasham
Jan 14 2017 13:26
yeah! Happy coding @sbxn14
Sander Berntsen
@sbxn14
Jan 14 2017 13:26
@heyDante was working on that ;D
Muhammad Hasham
@MohammadHasham
Jan 14 2017 13:26
you can add the <button> to make it a button and to make it cool add some border radius as well
@sbxn14
Sander Berntsen
@sbxn14
Jan 14 2017 13:30
@MohammadHasham around the anchor? or replace the anchor entirely?
Muhammad Hasham
@MohammadHasham
Jan 14 2017 13:31
around the anchor just nest you anchor
@sbxn14
Sander Berntsen
@sbxn14
Jan 14 2017 13:34
okay!
http://codepen.io/sbxn14/pen/qRNKOZ how do I get rid of that weird border on my new quote button?
it looks 3d-y but it looks crap
DarylKnapp
@DarylKnapp
Jan 14 2017 13:35
@sbxn14 padding?
Muhammad Hasham
@MohammadHasham
Jan 14 2017 13:36
@sbxn14 which margin
abhijith shenoy
@shenoyabhijith
Jan 14 2017 13:36
need help
Sander Berntsen
@sbxn14
Jan 14 2017 13:36
ooh is it padding
abhijith shenoy
@shenoyabhijith
Jan 14 2017 13:36
in parsing api
Sander Berntsen
@sbxn14
Jan 14 2017 13:36
@DarylKnapp nope it aint padding
@MohammadHasham it has a margin of 10px on the top
abhijith shenoy
@shenoyabhijith
Jan 14 2017 13:36
i just want
DarylKnapp
@DarylKnapp
Jan 14 2017 13:36
@sbxn14 margin?
Sander Berntsen
@sbxn14
Jan 14 2017 13:36
but the border is all around
@DarylKnapp 10px on top
abhijith shenoy
@shenoyabhijith
Jan 14 2017 13:36
weather ,degree , temp from api
how do i get only required info from api
Muhammad Hasham
@MohammadHasham
Jan 14 2017 13:37
i can't see any borders? @sbxn14
DarylKnapp
@DarylKnapp
Jan 14 2017 13:37
@shenoyabhijith You need be asking a proper question please. Thanks!
CamperBot
@camperbot
Jan 14 2017 13:37
darylknapp sends brownie points to @shenoyabhijith :sparkles: :thumbsup: :sparkles:
:cookie: 264 | @shenoyabhijith |http://www.freecodecamp.com/shenoyabhijith
Sander Berntsen
@sbxn14
Jan 14 2017 13:37
@MohammadHasham well it aint an actual border more like a shadow/3d effect or sth
it shows for me pretty clearly
on the right button (not the twitter one)
abhijith shenoy
@shenoyabhijith
Jan 14 2017 13:38
@DarylKnapp i want to know how to get weather and temparature
from api
Muhammad Hasham
@MohammadHasham
Jan 14 2017 13:38
@sbxn14 i see! just add some padding
padding:2px 2px 2px 2px
Sander Berntsen
@sbxn14
Jan 14 2017 13:38
I already got 10px of padding all around tho @MohammadHasham
Muhammad Hasham
@MohammadHasham
Jan 14 2017 13:39
do like this
padding: 10px 10px 10px 10px;
instead of
padding:10px 10px
Sander Berntsen
@sbxn14
Jan 14 2017 13:40
got that atm :P nothing changed
Muhammad Hasham
@MohammadHasham
Jan 14 2017 13:40
it has changed now at my side
in .new-quote (css)
delete that line and replace by this i sent to you
@sbxn14
Sander Berntsen
@sbxn14
Jan 14 2017 13:41
still the same
Muhammad Hasham
@MohammadHasham
Jan 14 2017 13:41
save and refresh
Sander Berntsen
@sbxn14
Jan 14 2017 13:41
and still the same :P
Muhammad Hasham
@MohammadHasham
Jan 14 2017 13:42
blob
Sander Berntsen
@sbxn14
Jan 14 2017 13:42
idk wtfs goin on xD
yea thats the border I mean
the 3d effect thingy
@DarylKnapp
Tyler Moeller
@TylerMoeller
Jan 14 2017 13:42
@sbxn14 border-style: none;
Sander Berntsen
@sbxn14
Jan 14 2017 13:43
@TylerMoeller that did it thanks!
CamperBot
@camperbot
Jan 14 2017 13:43
sbxn14 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1317 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
not working
any 1 please check my js
FL8Liew
@FL8Liew
Jan 14 2017 13:46
hey guys
my image will appear in pc but not in mobile
may I know what is the problem??
Sorin Ruse
@sorinr
Jan 14 2017 13:49
@shenoyabhijith do not stringify the json response. use it as it is. example
abhijith shenoy
@shenoyabhijith
Jan 14 2017 13:50
okay
how do i figure out the geo location
Sorin Ruse
@sorinr
Jan 14 2017 13:52
@shenoyabhijith if wunderground supports also calls over https you can use navigator geolocation. if not u can use some ip location service
abhijith shenoy
@shenoyabhijith
Jan 14 2017 13:54
ohhk
i guess it uses http
how do you determine that
Sorin Ruse
@sorinr
Jan 14 2017 13:57
@shenoyabhijith try to change the api call to https and load also the pen over https and if you get results it means its working and you can use navigator geolocation
abhijith shenoy
@shenoyabhijith
Jan 14 2017 13:57
how to load pen to https
?
Sorin Ruse
@sorinr
Jan 14 2017 13:58
@shenoyabhijith its working. like this https://codepen.io/sorinr/pen/WRxmbe?editors=1010
abhijith shenoy
@shenoyabhijith
Jan 14 2017 13:59
how you did that
just added https before url?
Sorin Ruse
@sorinr
Jan 14 2017 14:00
@shenoyabhijith do what? i've change the codepen.io/...... url in the browser bar with https:/codepen.io......
@shenoyabhijith and also in the api call. changed http to https
abhijith shenoy
@shenoyabhijith
Jan 14 2017 14:01
thats what i told
now i can use navigator.geolocation
Sorin Ruse
@sorinr
Jan 14 2017 14:02
@shenoyabhijith yes
abhijith shenoy
@shenoyabhijith
Jan 14 2017 14:02
i get latitude and logitude
then pass that to call i get temparature?
thats how it workss
?
Sorin Ruse
@sorinr
Jan 14 2017 14:02
@shenoyabhijith yes
Icah Banton
@remdata
Jan 14 2017 14:04
Hello. Help!!! I am trying to get my Random Quote Machine to work but can't seem to get my "quoteButton" to work. Would someone please take at look at my code to see what I am doing wrong? http://codepen.io/ibanton/pen/jyrNLj
Sorin Ruse
@sorinr
Jan 14 2017 14:06
@remdata in pen settings->javascript quickadd jquery library
MacGuffin
@MacGuffin1990
Jan 14 2017 14:10
@sorinr i can not get what i want .can u tell me why?http://codepen.io/MacGuffin1990/pen/MJKqXM?editors=1010
Sorin Ruse
@sorinr
Jan 14 2017 14:16
@MacGuffin1990 your call to openweather should be like:
$.getJSON("http://api.openweathermap.org/data/2.5/weather?lat="+lt+"&lon="+ln+"&appid=fee562ea07bcf56b0d00d56f4a4e5874&callback=?",function(respond)
samsmith453
@samsmith453
Jan 14 2017 14:20
Hi guys, I'm having an issue with the Twitch challenge. The API stuff is fine, but I am trying to loop through getJSON to get different info about each channel. Whenever I do this, it prints info for the last channel in the array multiple times instead. Does getJSON not work within a for loop?
Sorin Ruse
@sorinr
Jan 14 2017 14:20
@MacGuffin1990 you need to concatenate the coordinates you get from freegeoip when you compose the url for the weather call
@samsmith453 do not use for loop as the calls are made asynchronous you get the responses from the api later and the loop doesn wait for it. use https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach
samsmith453
@samsmith453
Jan 14 2017 14:25
@sorinr could you explain asynchronous please? I'm a complete beginner!
MacGuffin
@MacGuffin1990
Jan 14 2017 14:25
@sorinr i also need u help because i failed again
Icah Banton
@remdata
Jan 14 2017 14:27
@sorinr. Thanks.
CamperBot
@camperbot
Jan 14 2017 14:27
remdata sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1079 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Jan 14 2017 14:28
@MacGuffin1990 just copy paste in :point_up: January 14, 2017 4:16 PM what you have in fron of function(respond)
Sorin Ruse
@sorinr
Jan 14 2017 14:34
@samsmith453 the for loop will iterate your array and make some calls to the api but these calls are made asynchronous that means the program execution its not stopping so your loop will send api calls only it receive the responses after a while. so a forEach or each will introduce a callback function that will take care of the responses no matter when they arrive. a synchronous call will make the api call and wait for the response until passing to the next loop. the synchronous calls are bad because if for some reason the api don't respond all your program will stop working
Muhammad Hasham
@MohammadHasham
Jan 14 2017 14:50
@sorinr i need your help
Tom
@moT01
Jan 14 2017 15:00
@MohammadHasham whats the problem
@MohammadHasham i dont think your flag variable is available to the rest of the functions, make it global
Muhammad Hasham
@MohammadHasham
Jan 14 2017 15:01
it jump to the else case in click handlers when ever i click the colored boxes.What i want is to compare the user input and the computer generated input
@moT01
Tom
@moT01
Jan 14 2017 15:19
i dunno, i see it going to the if when i click the green button
Muhammad Hasham
@MohammadHasham
Jan 14 2017 15:20
open console.log and see there is 'out' being displayed
@moT01
this shows that else has been called
open console
sithvalentine
@sithvalentine
Jan 14 2017 15:22
Hello. I'm trying to build a webpage
Tom
@moT01
Jan 14 2017 15:22
im looking at the green button click, it console.logs an out right away before the else
sithvalentine
@sithvalentine
Jan 14 2017 15:23

Html
<!-- One page HTML -->

<title>Dynamic Crouton</title>

<div class="container fluid">
<div class="row">

<h1 class="text-center">Dynamic Crouton</h1>

<h2 class="text-center"><strong>Wilkommen!</strong></h2>

<h3 class="text-center">About</h3>
<div class="TextWrap">
<p><strong>Hello. I am James and you have landed in the world of Dynamic Crouton. Here, you can find creations and such. With new creations added all the time, I hope you will find enjoyment here. A tout a leure!</strong>
</p>
</div>
<h3 class="text-center"> Portfolio</h3>
<a href </div>
CSS
/ css /
body {
background:#999;
}
.TextWrap {
float: center;
margin: 10px;

I want three column and a footer
Tom
@moT01
Jan 14 2017 15:23
@MohammadHasham and the yellow button is not getting to the out for me
and neither is the red button
or blue
arshel
@arshel
Jan 14 2017 15:28
how do i make my navbar responsive. so that when i click on "about" it goes there
Sorin Ruse
@sorinr
Jan 14 2017 15:30
@arshel in the navbar you have <a href="#about"> and you need a corresponding <div id="about"> to navigate there
Sorin Ruse
@sorinr
Jan 14 2017 15:35
@jump020305 when you hit enter into an input field will try to submit your form. so you need to preventDefault() this behaviour
arshel
@arshel
Jan 14 2017 15:36
jump020305
@jump020305
Jan 14 2017 15:36
@sorinr I speaking with respect to accessibility
arshel
@arshel
Jan 14 2017 15:39
why does my code look so weird when i post it on here
Robin
@LuckyRabbits
Jan 14 2017 15:42
@arshel You would need to read this article on Markdown Code Formatting: https://forum.freecodecamp.com/t/markdown-code-formatting/18391
Sorin Ruse
@sorinr
Jan 14 2017 15:47
@arshel get rid of this <font size="5" class="p" and add to te tag <p> the id="about" and it will work.
@arshel i would move all the inline styling into the codepen css panel. its bad to use inline styling unless absolutely necessary
samsmith453
@samsmith453
Jan 14 2017 16:04
@sorinr thank you!
CamperBot
@camperbot
Jan 14 2017 16:04
samsmith453 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1080 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Jan 14 2017 16:06
@samsmith453 welcome
Karen Curry
@krcurry
Jan 14 2017 16:09
I'm trying to build my local weather map and I am getting this error: getCurrentPosition() and watchPosition() no longer work on insecure origins. To use this feature, you should consider switching your application to a secure origin, such as HTTPS. See https://goo.gl/rStTGz for more details. I thought we were working under a secured server. Has anyone else had this problem and how did you fix it?
Sorin Ruse
@sorinr
Jan 14 2017 16:10
@krcurry that means you have to load your pen over https not http
Karen Curry
@krcurry
Jan 14 2017 16:11
I thought codepen was under https
Sorin Ruse
@sorinr
Jan 14 2017 16:12
@krcurry you can load your pen like http://codepen.io/your username/.... or https://codepen.io/.....
Karen Curry
@krcurry
Jan 14 2017 16:12
thanks
Sorin Ruse
@sorinr
Jan 14 2017 16:12
welcome
samsmith453
@samsmith453
Jan 14 2017 16:17
Is there any reason that I can't do 2 forEach loops on the same array?
Rahul Yedida
@yrahul3910
Jan 14 2017 16:18
How do you delay the next animation in the Simon game? They all end up animating at the same time
samsmith453
@samsmith453
Jan 14 2017 16:19
I am receiving an JQuery deferred exception error on the second
Unable to find variable 'Index'
Tyler Moeller
@TylerMoeller
Jan 14 2017 16:32
@yrahul3910 You can use jQuery .queue or setTimeout
Muhammad Hasham
@MohammadHasham
Jan 14 2017 16:35
Why is my bootstrap not working?
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="css/bootstrap.min.css" type="text/css" media="screen,projection" />
<title>Wix template One</title>
</head>

<body>
<h1 class="text-center"> Hello World </h1>
<script type="text/javascript" src="js/jquery-3.3.7-dist.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
</body>
</html>
am i using the correct scripts and link?
Rahul Yedida
@yrahul3910
Jan 14 2017 16:36
Thanks @TylerMoeller :)
CamperBot
@camperbot
Jan 14 2017 16:36
yrahul3910 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1318 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Sander Berntsen
@sbxn14
Jan 14 2017 16:37
http://codepen.io/sbxn14/pen/qRNKOZ why do my quotes not show up? what did I do wrong?
Tyler Moeller
@TylerMoeller
Jan 14 2017 16:38
@sbxn14 Check your console :)
Uncaught TypeError: document.getElementbyId is not a function
    at newQuote (pen.js:40)
    at HTMLButtonElement.onclick (index.html:90)
JavaScript is case-sensitive
Sander Berntsen
@sbxn14
Jan 14 2017 16:40
what is wrong then?
i just looked it over and it is all the same?
or am I just missing someting
Ghulam Shabir
@ghulamshabir
Jan 14 2017 16:40
@sbxn14 and also you never called your function
Sander Berntsen
@sbxn14
Jan 14 2017 16:40
also how do I open a console
Ghulam Shabir
@ghulamshabir
Jan 14 2017 16:41
f12 in chrome
Tyler Moeller
@TylerMoeller
Jan 14 2017 16:41
@sbxn14 Ctrl+Shift+J
(Option+Shift+J on a Mac, I believe)
Sander Berntsen
@sbxn14
Jan 14 2017 16:41
oh yea (thanks for the mac option haha)
but what should I add then?
i forgot how to call it..
lmao
Tyler Moeller
@TylerMoeller
Jan 14 2017 16:42
getElementbyId should be getElementById
Sander Berntsen
@sbxn14
Jan 14 2017 16:42
O
Tyler Moeller
@TylerMoeller
Jan 14 2017 16:42
For starters anyway :)
Sander Berntsen
@sbxn14
Jan 14 2017 16:43
now it says randomNumber isnt defined
javascript is so confusing q.q
Tyler Moeller
@TylerMoeller
Jan 14 2017 16:44
Looks like you got it ;)
Sander Berntsen
@sbxn14
Jan 14 2017 16:44
doesnt work for me?
Tyler Moeller
@TylerMoeller
Jan 14 2017 16:44
It works for me...I'll refresh

@sbxn14 You changed your function...

function newQuote() {
var randomNumber = Math.floor(Math.random() * (quotes.length));
}
document.getElementById('quotehere').innerHTML = quotes[randomNumber];

Why do you think randomNumber is not defined?

Sander Berntsen
@sbxn14
Jan 14 2017 16:45
still just tells me randomNumber isnt defined
oo
now it works :D
sweett
Tyler Moeller
@TylerMoeller
Jan 14 2017 16:46
:)
Sander Berntsen
@sbxn14
Jan 14 2017 16:46
now to make the buttons stationary so they dont keep shifting everytime you click.. xD
Tyler Moeller
@TylerMoeller
Jan 14 2017 16:49
Have fun!
Sander Berntsen
@sbxn14
Jan 14 2017 16:51
@TylerMoeller thanks for the help!
CamperBot
@camperbot
Jan 14 2017 16:51
sbxn14 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1319 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Sander Berntsen
@sbxn14
Jan 14 2017 17:00
how do I make it so if I press the twitter button it automatically puts in the quote?
Ghulam Shabir
@ghulamshabir
Jan 14 2017 17:03
@Robertb4 for example if you have form submit button then using e.preventDefault for that will stop browser to request a page from server mentions action attribute of the form
John Alcher
@alchermd
Jan 14 2017 17:04

Hey mates. How would I go about doing a setInterval of addClass and removeClass loops? I'm currently doing this

let timer = window.setInterval(function(){
            $(".box").addClass("highlighted");
            $(".box").removeClass("highlighted");
        }, 1000)

which I guess is wrong since the add -> remove loop happens immediately. Any ideas?

Muhammad Hasham
@MohammadHasham
Jan 14 2017 17:06
is it okay to forget different syntax and then using w3school.com or internet to see that again?is this common for a developer?because at time i forget things such as navbar
Rahul Yedida
@yrahul3910
Jan 14 2017 17:07
@TylerMoeller Sorry, it still won't delay. I even tried using jQuery UI's addClass to change the background color, like this:
function flash(selector) {
        $(selector).stop(true, true).delay(1000).addClass('light', 500, function() {
            $(this).stop(true, true).removeClass('light', 500);
        });
    }
flash is the function I call to animate the div
@alchermd Are you working on the Simon game too?
John Alcher
@alchermd
Jan 14 2017 17:09
@yrahul3910 Oh, yes I am!
Rahul Yedida
@yrahul3910
Jan 14 2017 17:09
@alchermd I'm stuck at the same problem then. They all animate at the same time :(
alpox
@alpox
Jan 14 2017 17:11
@alchermd @yrahul3910 You should consider not to add and remove the class at the same time ;-)
John Alcher
@alchermd
Jan 14 2017 17:12
@yrahul3910 I guess you're already at the game? I'm planning to add a 3 second delay after the player hit start where all the buttons pop up for a bit.
Rahul Yedida
@yrahul3910
Jan 14 2017 17:13
@alchermd I tried adding delays, but even then all of them animate at the same time. @alpox You mean add a setTimeout call inside the addClass call?
alpox
@alpox
Jan 14 2017 17:15
@yrahul3910 I'm not exactly sure what you try to achieve, so i cannot answer properly to that. Do you want something to light up for about 1s, then stop for some time and do it again?
@yrahul3910 Well all of them animate the same time because you use a .box selector which simultaniously selects all boxes
John Alcher
@alchermd
Jan 14 2017 17:16
This is basically what I want to do:
1. User press start
2. All the boxes turns on, then turns off.
3. This happens for 3 seconds.
Rahul Yedida
@yrahul3910
Jan 14 2017 17:16
@alpox Suppose there are 2 divs, one is supposed to light up after another. Right now they light up at the same time. And no, that's @alchermd 's code. I pass the div's id selector to the flash function
John Alcher
@alchermd
Jan 14 2017 17:18
Anyways, I think I'm done for the night (already morning in here). Good luck to your project @yrahul3910 !
Rahul Yedida
@yrahul3910
Jan 14 2017 17:19
Thanks, you too @alchermd :)
CamperBot
@camperbot
Jan 14 2017 17:19
yrahul3910 sends brownie points to @alchermd :sparkles: :thumbsup: :sparkles:
:cookie: 305 | @alchermd |http://www.freecodecamp.com/alchermd
Purcea Robert
@RobertPurcea
Jan 14 2017 17:24
Hi people, I saw a lot of responses around the internet where, when somebody adds an event listener to something, they often set the third parameter to false.
Like this: windows.addEventListener("click",myFunction,false).
Anybody knows the reason behind that?(as far as I know it is defaulted to false)
Philipp Scholz
@philipp32
Jan 14 2017 17:27
hey, my API sends this as the time format: "sunsetTime": 1453424361,. How can I convert that into the normal time? And how to I read the time 1453424361?
Naman
@namanyash
Jan 14 2017 17:31
@namanyash
hello i need to load an API onto my page using javascript
$.ajax({
url : weather,//weather is a variable that has url for the api
dataType : "jsonp",
success : function(data) {
the function doesn't run
vínαч puppαl
@vinaypuppal
Jan 14 2017 18:00

@philipp32 You can use javascript Date object to convert it to time

var sunSet = new Date(1453424361 * 1000); // multiplied by 1000 to convert timestamp in to milliseconds format
console.log(sunSet.toLocaleTimeString()) // 6:29:21 AM

Read More here https://mdn.io/date

Philipp Scholz
@philipp32
Jan 14 2017 18:00
thank you. I have found a way by now. :) Just didn't know that this was called UNIX time. :)
vínαч puppαl
@vinaypuppal
Jan 14 2017 18:02
@namanyash do you see any errors in browser console (in chrome ctrl+shift+j)
@philipp32 :smile: yes its called UNIX timestamp.
Naman
@namanyash
Jan 14 2017 18:04
@vinaypuppal yes this is the error........................... jquery.min.js:4 Mixed Content: The page at 'https://codepen.io/naman_yash/pen/YNWBwZ' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://api.wunderground.com/api/af9bc06c42899316/forecast/geolookup/conditions/q/30.3525662,76.36438079999999.json'. This request has been blocked; the content must be served over HTTPS.
Spyrantis Theodoros
@thodorisanta
Jan 14 2017 18:07
so the for loop is suppose to do this spinalCase("thisIsSpinalTap") should return "this-is-spinal-tap".
But for some reason it doesn't work. Can you tell me why?

function spinalCase(str) {
  // "It's such a fine line between stupid, and clever."
  // --David St. Hubbins
  str = str.replace(/\s+/g, '-');
  str = str.replace(/_/g, '-');
  str = str.split("");
  for(var i=1;i<str.length;i++){
    if(str[i].charCodeAt(i)>64 && str[i].charCodeAt(i)<91){
      str[i-1].push('-');
    }
  }


  return str.toLowerCase();
}

spinalCase('This Is Spinal Tap');
vínαч puppαl
@vinaypuppal
Jan 14 2017 18:07

@namanyash change your weather API url to https then it will work

var weather="https://api.wunderground.com/api/af9bc06c42899316/forecast/geolookup/conditions/q/" + lat + "," + lon + ".json";

Since you loaded your pen over https and making API request over http browser is blocking it

@thodorisanta str is array so u need to return at the end of function this
return str.join('').toLowerCase();
Naman
@namanyash
Jan 14 2017 18:11
it did ....... thank you sooooooooo much @vinaypuppal
CamperBot
@camperbot
Jan 14 2017 18:11
namanyash sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 651 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
vínαч puppαl
@vinaypuppal
Jan 14 2017 18:12
@namanyash :+1:
Spyrantis Theodoros
@thodorisanta
Jan 14 2017 18:14
@vinaypuppal
still doesnt work...

function spinalCase(str) {
  // "It's such a fine line between stupid, and clever."
  // --David St. Hubbins
  str = str.replace(/\s+/g, '-');
  str = str.replace(/_/g, '-');
  str = str.split("");
  for(var i=1;i<str.length;i++){
    if(str[i].charCodeAt(i)>64 && str[i].charCodeAt(i)<91){
      str[i-1].push('-');
    }
  }


  return str.join("").toLowerCase();
}

spinalCase('thisIsSpinalTap');
asafofer
@asafofer
Jan 14 2017 18:18
i cant seem to get the location function to work
chrome blocks it
Stoica Valentin
@stoicavali91
Jan 14 2017 18:18
Hi!I am currently trying to do the Twitchtv and i get as a result only online streamers.I am using this URL: https://wind-bow.gomix.me/twitch-api/streams/featured . Can someone help me with this problem?Thanks
asafofer
@asafofer
Jan 14 2017 18:18
can anyone help?
Stoica Valentin
@stoicavali91
Jan 14 2017 18:19
i completed that task with mozzila @asafofer
asafofer
@asafofer
Jan 14 2017 18:19
isnt there a way on chrome?
because i can see working examples
Utkarsh Agarwal
@greenutkarsh
Jan 14 2017 18:23
random quote generator error
i need help
vínαч puppαl
@vinaypuppal
Jan 14 2017 18:23
@thodorisanta your logic seems incorrect
@asafofer load your pen over https then it will work
Utkarsh Agarwal
@greenutkarsh
Jan 14 2017 18:24
@vinaypuppal the data from json is not coming
vínαч puppαl
@vinaypuppal
Jan 14 2017 18:26
@greenutkarsh see chrome console you will find error
Since you loaded your pen over https and making API request over http browser is blocking it
Load your pen over http it will work
Utkarsh Agarwal
@greenutkarsh
Jan 14 2017 18:26
@vinaypuppal no its not blocking
i tried opening the link directly
its opening normally
@vinaypuppal please help, i m stuck from a long time
vínαч puppαl
@vinaypuppal
Jan 14 2017 18:28
@greenutkarsh yeah that will work but browsers will block http calls when origin url is loaded over https
just load your pen over http it will work or open below link it will work
http://codepen.io/greenutkarsh/full/ggMqjj/
Ghulam Shabir
@ghulamshabir
Jan 14 2017 18:29
@greenutkarsh if you are using chrome
Utkarsh Agarwal
@greenutkarsh
Jan 14 2017 18:29
@ghulamshabir @vinaypuppal yes i am using chrome
what should i use ??
Ghulam Shabir
@ghulamshabir
Jan 14 2017 18:30
@greenutkarsh open your pen over http not https
@greenutkarsh always see browser console for errors
vínαч puppαl
@vinaypuppal
Jan 14 2017 18:30
@greenutkarsh this link is working for me just change https to http in your addressbar like this url http://codepen.io/greenutkarsh/full/ggMqjj/
Utkarsh Agarwal
@greenutkarsh
Jan 14 2017 18:31
@vinaypuppal @ghulamshabir thnx alot
CamperBot
@camperbot
Jan 14 2017 18:31
greenutkarsh sends brownie points to @vinaypuppal and @ghulamshabir :sparkles: :thumbsup: :sparkles:
:cookie: 652 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
:star2: 1675 | @ghulamshabir |http://www.freecodecamp.com/ghulamshabir
Ghulam Shabir
@ghulamshabir
Jan 14 2017 18:31
@greenutkarsh otherwise you will waste alot of your time just for little mistakes
Stoica Valentin
@stoicavali91
Jan 14 2017 18:33
http://codepen.io/stoicavali91/pen/ZLONPb?editors=1111 i don't understand what in the mistake with this function...it doesn't return what i need
can someone help me please?
vínαч puppαl
@vinaypuppal
Jan 14 2017 18:36
@stoicavali91 you need to call onoff1 like this console.log(onoff1())
Stoica Valentin
@stoicavali91
Jan 14 2017 18:36
I'm so stupid.Thank you
vínαч puppαl
@vinaypuppal
Jan 14 2017 18:37
@stoicavali91 no problem, it happens to all :smile:
Stoica Valentin
@stoicavali91
Jan 14 2017 18:58
I am currently trying to do the Twitchtv and i get as a result only online streamers.I am using this URL: https://wind-bow.gomix.me/twitch-api/streams/featured . Can someone help me with this problem?Thanks
vínαч puppαl
@vinaypuppal
Jan 14 2017 19:11
@stoicavali91
you have to pass each channel name to https://wind-bow.gomix.me/twitch-api/streams/
like https://wind-bow.gomix.me/twitch-api/streams/freecodecamp and then check if data.streams is present if it is null then channel is offline.
You can get channel names from user stories in challenge description in FCC
Store channels in Array and loop through them and fetch stream info for each channel like above
Stoica Valentin
@stoicavali91
Jan 14 2017 19:18
@vinaypuppal if you run this code, you will see that the API response is for every user from the list, but if you remove the comment for "name" and "icon", in the console you will find only the online users and this is bothering me : http://codepen.io/stoicavali91/pen/ZLONPb?editors=1111
vínαч puppαl
@vinaypuppal
Jan 14 2017 19:23
@stoicavali91 oh for offline usersname and icon you need to make another request to
https://wind-bow.gomix.me/twitch-api/users/[channel-name] like
https://wind-bow.gomix.me/twitch-api/users/freecodecamp
Tyler Moeller
@TylerMoeller
Jan 14 2017 19:24

@yrahul3910 Sorry I missed your message earlier. The basic way to add a class, wait 1sec, and then remove a class would be like:

$('selector').addClass('className').delay(1000).queue(function() {
  $('selector').removeClass('className').dequeue();
})

You could also use .promise():

$('selector').addClass('className').delay(1000).promise().done(function() {
  $('selector').removeClass('className');
})
See this pen for an example of passing an array of classes to be added/removed on a single element: http://codepen.io/TylerMoeller/pen/vgYdwg?editors=1010
It gives the option of using setTimeout() or .queue() as I had mentioned as options earlier
Tyler Moeller
@TylerMoeller
Jan 14 2017 19:29
@alchermd From reading above, this might also be of use to you ^^^ see my comment directly above
Rahul Yedida
@yrahul3910
Jan 14 2017 19:34
Thanks @TylerMoeller :)
CamperBot
@camperbot
Jan 14 2017 19:34
yrahul3910 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1320 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Marios Papamanolis
@Papamakis
Jan 14 2017 19:45
Hello everyone i have a question to make, am i the only one struggling with the portofolio project although i finished all the challenges or is just a difficult project where everyone need to spend MANY hours; I feel that i need many hours of learning how to code before try to do this task .Also i dont want to use bootstrap without knowing what i exacly doing!
Any advice?
Igor Amidzic
@igoramidzic
Jan 14 2017 19:51

I have a bootstrap question. Does anyone know how to make an image do what this image in doing on:
http://www.botaiusti.com/
If you size down the window, it gets smaller to fit the screen. Help!

Edit: Maybe not a bootstrap question, but I am using bootstrap if that helps

Tyler Moeller
@TylerMoeller
Jan 14 2017 19:56
@igoramidzic It's a responsive image - you may want to revisit this challenge: https://www.freecodecamp.com/challenges/make-images-mobile-responsive
Igor Amidzic
@igoramidzic
Jan 14 2017 19:57
@TylerMoeller I see what my problem was. I added "max-width" and that negates the responsiveness?
Tyler Moeller
@TylerMoeller
Jan 14 2017 19:57
@Papamakis Yes, it will take many hours. I think I spent close to 20 hours on my first portfolio project. Read the bootstrap docs, get familiar with bootstrap, and do some planning first. It will save you a lot of time in the end
@igoramidzic Yes, max-width will limit the width to a certain size. You don't need any CSS. See this pen for an example: http://codepen.io/TylerMoeller/pen/YNWoBM
It will get as large as the image can get, which is 1600px in this case
Igor Amidzic
@igoramidzic
Jan 14 2017 19:58
@TylerMoeller Thank you :)
CamperBot
@camperbot
Jan 14 2017 19:58
igoramidzic sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1321 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Marios Papamanolis
@Papamakis
Jan 14 2017 19:59
thank you @TylerMoeller for the anwser apreciated!
CamperBot
@camperbot
Jan 14 2017 19:59
papamakis sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1322 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Igor Amidzic
@igoramidzic
Jan 14 2017 19:59
@TylerMoeller Any way to do that with text?
@TylerMoeller Is there a text-responsive?
Tyler Moeller
@TylerMoeller
Jan 14 2017 20:00
@igoramidzic It's more difficult with text, you will need to use lots of CSS. Here's another pen I created that does that if you want to see how: http://codepen.io/TylerMoeller/pen/LbJYpO
Muhammad Hasham
@MohammadHasham
Jan 14 2017 20:00
why is navbar not inside the container in bootstrap?
@TylerMoeller
Tyler Moeller
@TylerMoeller
Jan 14 2017 20:00
@MohammadHasham If you put the navbar in a container, it won't touch the edges of the screen
Muhammad Hasham
@MohammadHasham
Jan 14 2017 20:01
won't that be only in case of container-fluid?
@TylerMoeller
Tyler Moeller
@TylerMoeller
Jan 14 2017 20:01
No, there's 15px of padding for both.
.container {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
@media (min-width: 768px) {
  .container {
    width: 750px;
  }
}
@media (min-width: 992px) {
  .container {
    width: 970px;
  }
}
@media (min-width: 1200px) {
  .container {
    width: 1170px;
  }
}
.container-fluid {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
Muhammad Hasham
@MohammadHasham
Jan 14 2017 20:02
and just one last thing what is the difference between container and container-fluid?the basic one?
@TylerMoeller
Tyler Moeller
@TylerMoeller
Jan 14 2017 20:02
See the CSS above :)
Muhammad Hasham
@MohammadHasham
Jan 14 2017 20:02
@TylerMoeller Thanks alot!
CamperBot
@camperbot
Jan 14 2017 20:02
mohammadhasham sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1323 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Jan 14 2017 20:03
main difference is that .container has a fixed width where container-fluid will expand as wide as you need
Tom
@moT01
Jan 14 2017 20:03
i came across an easy way for responsive text on my last project, ..used it once, not sure how well it will work in other situation
Muhammad Hasham
@MohammadHasham
Jan 14 2017 20:03
@TylerMoeller thanks alot! my concepts are clear now!!!.
CamperBot
@camperbot
Jan 14 2017 20:03
mohammadhasham sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:warning: mohammadhasham already gave tylermoeller points
Tom
@moT01
Jan 14 2017 20:04
use viewport sizes as text size units -- vw, vh, vmin, vmax
Utkarsh Agarwal
@greenutkarsh
Jan 14 2017 20:19
send me brownie pts plz
nheyse89
@nheyse89
Jan 14 2017 20:52
I need help.
Im having problems with my portfolio page. I am trying to implement a navbar in a single row. But the search box is separating to s separate row
can anyone hlep me
alpox
@alpox
Jan 14 2017 20:53
@nheyse89 If you post a pen with your portfolio we gan help :-)
nheyse89
@nheyse89
Jan 14 2017 20:59
My search box is very long and I want it in the same navbar along with the submit button as all of the other buttons
alpox
@alpox
Jan 14 2017 21:01
@nheyse89 Change navbar-default to navbar-nav in the ul element for your link list. Also, your form is outside of the <div class="row">. You will want to put it in there.
Also, i don't think its a good idea to have a jumbotron div in the header ;-) you may want to remove that one too. (Go sure to also remove the closing tag)
nheyse89
@nheyse89
Jan 14 2017 21:02
@alpox Dude you rock!
that fixed it
William Cross
@williamtech814
Jan 14 2017 21:43
I'm attempting to build a simple hangman game but I'm getting an "Unexpected end of input" error in the JS console http://codepen.io/williamtech814/pen/jyrgQx
Reggie
@Reggie01
Jan 14 2017 22:00
@williamtech814 Double check updateGameArray function and checkRemainingLetters function and make sure your braces are correct.
Robin
@LuckyRabbits
Jan 14 2017 22:19
Thanks @nheyse89
CamperBot
@camperbot
Jan 14 2017 22:19
luckyrabbits sends brownie points to @nheyse89 :sparkles: :thumbsup: :sparkles:
:cookie: 121 | @nheyse89 |http://www.freecodecamp.com/nheyse89
jackclairmont1
@jackclairmont1
Jan 14 2017 22:20
Hi Guys, Im having issues when i download my code form codePen.io, it looks completely different. Maybe Its an issue with my href to style.css? Anyways here is the link to my codpen:
Btw the sites not fully complete!
Robin
@LuckyRabbits
Jan 14 2017 22:23
@williamtech814 analyze js says that you are missing semicolon on line 64 and line 66.
jackclairmont1
@jackclairmont1
Jan 14 2017 22:27
one the things that doesn't work when i open the files from my desktop is all the btn classes. So possibly i didnt reference bootstrap properly?
Reggie
@Reggie01
Jan 14 2017 22:28
@jackclairmont1 you can include bootstrap in css setting. In editor view, on the css section click on the settings button.
jackclairmont1
@jackclairmont1
Jan 14 2017 22:29
@Reggie01 I tried that. Didnt work
Reggie
@Reggie01
Jan 14 2017 22:30
@jackclairmont1 It works. Remove your link button that is calling css file.
Robin
@LuckyRabbits
Jan 14 2017 22:30
@jackclairmont1 I haven't gotten to the responsive design part so Idk about Bootstrap yet. :shipit:
jackclairmont1
@jackclairmont1
Jan 14 2017 22:31
ok I'll try that. I think i have 2 in my html haha @Reggie01
Reggie
@Reggie01
Jan 14 2017 22:32
@jackclairmont1 That will still give you the same result. I don't know what your css is suppose to look like. Do you have any more additonal css files you did'nt include?
Sabrina Ferguson
@itsacoyote
Jan 14 2017 22:32
@jackclairmont1 yep, Reggie is correct on that. Also you're not referencing the link properly, add http://
@jackclairmont1 Since you downloaded it and are trying to serve it from your local desktop, you don't have a server processing and returning the file. So when you load the page, you're not loading it like an html file from a server, you're loading it as a file. It sees //max.cdn... and assumes file://max.cdn. Change it to the direct full URL http://max.cdn and it should work
Robin
@LuckyRabbits
Jan 14 2017 22:35
^ 🔥
jackclairmont1
@jackclairmont1
Jan 14 2017 22:35
@itsacoyote ok ill try it. Thanks in advanced
Reggie
@Reggie01
Jan 14 2017 22:35
@jackclairmont1 Also, your pdf file will not be served due to this. ^
CamperBot
@camperbot
Jan 14 2017 22:35
jackclairmont1 sends brownie points to @itsacoyote :sparkles: :thumbsup: :sparkles:
:cookie: 394 | @itsacoyote |http://www.freecodecamp.com/itsacoyote
jackclairmont1
@jackclairmont1
Jan 14 2017 22:35
*advance
Icah Banton
@remdata
Jan 14 2017 22:37
Hello. Help!!!. I am trying to complete the Local Weather Zipline. Where do I start to the weather data?
jackclairmont1
@jackclairmont1
Jan 14 2017 22:43
@itsacoyote sorry, i'm a little confused. you're saying that I need to reference http://max.cdn/ or just add to my search engine when viewing the code from my desktop?
Sabrina Ferguson
@itsacoyote
Jan 14 2017 22:44
@jackclairmont1 so you have a few errors that are causing some of this issue, lemme go through them
You have <link href=""> in various places in your HTML, I suggest taking out the links and putting them in the CSS tab under settings so CodePen properly injects them.
Use full http:// URLs as you reference external stylesheets and javascript
jackclairmont1
@jackclairmont1
Jan 14 2017 22:45
Ok, Can we discuss this on email? jack.clairmont@outlook.com I would really appreciate it!
Sabrina Ferguson
@itsacoyote
Jan 14 2017 22:45
sure, I can do that. Or is private message on Gitter alright?
jackclairmont1
@jackclairmont1
Jan 14 2017 22:45
Whatever works better for you!
Sabrina Ferguson
@itsacoyote
Jan 14 2017 22:46
@jackclairmont1 Sending via PM then!
jamesjd54
@jamesjd54
Jan 14 2017 23:02

hey guys, i got it! is this an efficient solution or would there have been something better?

function nextInLine(arr, item) {
// Your code here
arr.push(item);
var shifted = arr.shift();

return shifted; // Change this line
}

// Test Setup
var testArr = [1,2,3,4,5];

jackclairmont1
@jackclairmont1
Jan 14 2017 23:02
Thanks @itsacoyote You were a huge help!
CamperBot
@camperbot
Jan 14 2017 23:02
jackclairmont1 sends brownie points to @itsacoyote :sparkles: :thumbsup: :sparkles:
:warning: jackclairmont1 already gave itsacoyote points
DarylKnapp
@DarylKnapp
Jan 14 2017 23:03
Hey Good Afternoon Dev's
http://i65.tinypic.com/331lzd2.png
Just wanted to ask a question how would I bring the arrow's in the picture up above the about header? is there some in HTML that I have to declare to anything?
Sabrina Ferguson
@itsacoyote
Jan 14 2017 23:07
@DarylKnapp You could put the img tag before the h2? If you want them closer to the h2, you may want to style the margins on the header tag to minimize the spacing around it.
aRtoo
@artoodeeto
Jan 14 2017 23:09
hey fam how do you use jquery on code pen. i tried this nothing happens. http://codepen.io/artoo/pen/MJjgqW
sennator
@sennator2
Jan 14 2017 23:10
can i import fonts from my pc to codepen?
@artoodeeto go to js settings- quick add- jQuery
@artoodeeto and write you js in js box
your*
aRtoo
@artoodeeto
Jan 14 2017 23:12
@sennator2 im gonna try thanks man
CamperBot
@camperbot
Jan 14 2017 23:12
artoodeeto sends brownie points to @sennator2 :sparkles: :thumbsup: :sparkles:
:cookie: 264 | @sennator2 |http://www.freecodecamp.com/sennator2
Reggie
@Reggie01
Jan 14 2017 23:15
@sennator2 I don't think you can. Maybe the pro version of codepen allows you to store resources. You can see if google has the font and import the font in css setting.
Sabrina Ferguson
@itsacoyote
Jan 14 2017 23:25
@sennator2 You can't import fonts from your PC into CodePen, you need a URL to point to grab the font from. If the font is free or is a standard PC font, you could just reference it and people who view your page will see it in the font you specify if they have it. If your font is unique, you could find a font URL to use for importing the font. Google fonts have quick and easy font URLs. If it's not free or available online, you could host it up somewhere so you can access it via URL.
Daniel Lopez
@bigerboy654
Jan 14 2017 23:43
tell me what you guys think
https://codepen.io/bigerboy654/pen/YNGKdY
Ashvini Pandian
@Pabduab
Jan 14 2017 23:49
@bigerboy654 looks pretty good to me
:)
Sara Soliman
@solimansara
Jan 14 2017 23:54
Hi, how to take an image of projects completed to use in the portfolio webpage?