These are chat archives for FreeCodeCamp/HelpFrontEnd

9th
Aug 2016
Nicolas Crumrine
@CrumrineCoder
Aug 09 2016 00:01
This message was deleted
This message was deleted
NEVERMIND
It was word-wrap: break-word
Everytime I research something for 30 minutes, and I ask a question, I immediately find the answer when I continue searching, every goddamn time
Stephen James
@sjames1958gm
Aug 09 2016 00:06
@CrumrineCoder :)
Drew Dusang
@dmdusang
Aug 09 2016 00:50
@dmdusang
hello all
http://codepen.io/dmdusang/pen/akaNrE
any reason you can see why my offset().top in my javascript for my element id #header-main doesn't return the correct value?
it seems to be too small
and not the appropriate distance to the element
I'm not sure if this is a problem with my css or not
Drew Dusang
@dmdusang
Aug 09 2016 00:57
actually... it was giving me the right height. Figured it out.
Kevin Mulligan
@kmulligan
Aug 09 2016 01:18
Can someone help me with the "Account Closed" and status on the Twitch stream project?
Jaren Escueta
@jarenescueta731
Aug 09 2016 01:29
@kmulligan how can we help?
Nicolas Crumrine
@CrumrineCoder
Aug 09 2016 01:30
Kevin, if you console.log the json call you can find all you need
If you console.log a json call for a banned account, you'll find something that will identify it
You can use THAT to change the html for the banned account's section
Kevin Mulligan
@kmulligan
Aug 09 2016 01:32
@jarenescueta731 @CrumrineCoder I know, I've been trying .status == 422... but not getting anything
Jacob Stewart
@JacobStewart1
Aug 09 2016 01:33
does anybody want to pair for the wikipedia viewer project
Jaren Escueta
@jarenescueta731
Aug 09 2016 01:33
@kmulligan have you tried strict equality ===
Kevin Mulligan
@kmulligan
Aug 09 2016 01:34
yes
Jaren Escueta
@jarenescueta731
Aug 09 2016 01:34
@kmulligan and what's your api request url?
Kevin Mulligan
@kmulligan
Aug 09 2016 01:35
Let me just show you my codepen. Everything else is working, just not getting the account closed to pop up
Jaren Escueta
@jarenescueta731
Aug 09 2016 01:45
@kmulligan the problem is that, since the json data is of existing streamers with the streamApiUrl, it won't have any info for those that don't exist like comster404. to get around that for mine, i only used the channel object. at least non-existent accounts you include will show up that way.
Kevin Mulligan
@kmulligan
Aug 09 2016 01:47
ahh
so do two different api calls? 1. stream 2. channel
Jaren Escueta
@jarenescueta731
Aug 09 2016 01:48
@kmulligan i'd suggest just using channel
Jaren Escueta
@jarenescueta731
Aug 09 2016 01:54
@kmulligan look at https://github.com/justintv/Twitch-API/blob/master/v3_resources/channels.md if you haven't already, i think data is nested differently from the streams.md. how's it going?
Kevin Mulligan
@kmulligan
Aug 09 2016 01:57
Well I tried switching it to channel.. which gets the comster404 to show up, but none of the other items work
(e.g. online, about, highlighting green)
Jaren Escueta
@jarenescueta731
Aug 09 2016 02:00
@kmulligan did you look at the documentation for using channels? accessing the data is different from streams. i'm working on yours too to get things working
Jaren Escueta
@jarenescueta731
Aug 09 2016 02:06
@kmulligan do you understand yet? for example, checking stream.stream == null won't work to see if a channel is offline because stream doesn't exist in the channels object
use stream.game instead
Kevin Mulligan
@kmulligan
Aug 09 2016 02:06
right
Stephen James
@sjames1958gm
Aug 09 2016 02:06
@kmulligan You added code for account closed that is the same check for offline.
You need to handle the error for the account closed. You can add this to the end of your $.getJSON
$.getJSON(url, function() {})
.error(function() { 
      $("#insertHere").append("<tr><td>" + name + "</td><td>Account Closed</td><td>Account Closed</td></tr>");
    });
Kevin Mulligan
@kmulligan
Aug 09 2016 02:10
@sjames1958gm ...added that in and not working
Sorry, I'm burnt out
@sjames1958gm Oh... I see. I was adding it into the inside of the .json
.getJSON
Jaren Escueta
@jarenescueta731
Aug 09 2016 02:12
@kmulligan do all the channels appear with the correct status now?
Kevin Mulligan
@kmulligan
Aug 09 2016 02:13
@jarenescueta731 Yes
@sjames1958gm more to read! o_0 :)
Thanks @jarenescueta731 @sjames1958gm
CamperBot
@camperbot
Aug 09 2016 02:16
kmulligan sends brownie points to @jarenescueta731 and @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 2435 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
:cookie: 350 | @jarenescueta731 |http://www.freecodecamp.com/jarenescueta731
Stephen James
@sjames1958gm
Aug 09 2016 02:20
@kmulligan :+1:
Kevin Mulligan
@kmulligan
Aug 09 2016 02:20
Literally sat that project aside for 3 months
Well, life set it aside, but frustration was part of it
William Cross
@williamtech814
Aug 09 2016 02:25
I'm not sure what I did wrong here
Stephen James
@sjames1958gm
Aug 09 2016 02:26
@williamtech814 right-wall or right-well?
William Cross
@williamtech814
Aug 09 2016 02:26
I see what I did wrong.. simple mistake your right
thanks @sjames1958gm
CamperBot
@camperbot
Aug 09 2016 02:26
williamtech814 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 2437 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Stephen James
@sjames1958gm
Aug 09 2016 02:26
The simplest errors are sometimes the hardest to see.
William Cross
@williamtech814
Aug 09 2016 02:26
True that
Will Khaine
@mankaine
Aug 09 2016 04:11
hi ya'll, anyone used codepen.io and imported images from their hard drive before?
Will Khaine
@mankaine
Aug 09 2016 04:22
never mind; got it!
PattyCreates
@PattyCreates
Aug 09 2016 04:38
Hi guys. I'm struggling with a Mailchimp HTML email.
Mailchimp support is really surface level and I can't find what's causing my bug. Was wondering if anyone here happens to have experience with mailchimp tags?
ethanostrow
@ethanostrow
Aug 09 2016 05:23
hi guys, I'm working on the random quote machine, and trying to have it select a random array with a quote and pull from it. Kinda stuck, as only 2/3 of the quotes actually show up when you click the button on the left. Would be much appreciated- http://codepen.io/ethanostrow/pen/YWRWKL
not responsive
at all
DJ
@qualitymanifest
Aug 09 2016 05:34
@ethanostrow array indexes start at 0. by adding 1 to your random number every time, you're making quoteNumber equal either 1, 2, or 3.. since you only have 3 quotes, array index 3 doesn't exist, and you're never touching array index 0
Sorin Ruse
@sorinr
Aug 09 2016 05:50
@ethanostrow yes because the probability for Math.random() to return 0 is low so you get only second and third quote and as @ethanostrow said the max array index is 2 in your case
ethanostrow
@ethanostrow
Aug 09 2016 05:53
@qualitymanifest @sorinr thanks guys wow that was a stupid mistake. I should've seen that one
CamperBot
@camperbot
Aug 09 2016 05:53
ethanostrow sends brownie points to @qualitymanifest and @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1338 | @qualitymanifest |http://www.freecodecamp.com/qualitymanifest
:cookie: 641 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Aug 09 2016 06:00
This message was deleted
Muhammad Osama Arshad
@asamolion
Aug 09 2016 06:13
jfjlaksdfjklasdjflasd
jrandallhansen
@jrandallhansen
Aug 09 2016 07:03
can anyone take a lot of the jQuery function i have tried to write for my random quote generator? it is broken somehow but i dont know how
take a look at*
Mostofa kamal
@MK-Emon
Aug 09 2016 07:09
how can i change the color of horizontal line?
jrandallhansen
@jrandallhansen
Aug 09 2016 07:10
@MK-Emon by applying a class and styling that class in CSS
Mostofa kamal
@MK-Emon
Aug 09 2016 07:11
i did that but it is not showing that color
jrandallhansen
@jrandallhansen
Aug 09 2016 07:12
look for typos or errors in your code. or another style rule that is over-ruling your class rule
Mostofa kamal
@MK-Emon
Aug 09 2016 07:12
.hr-line{
color:blue;}
<hr class="hr-line">
@jrandallhansen isn't it?
jrandallhansen
@jrandallhansen
Aug 09 2016 07:14
color:blue; would style the font color
look up the CSS documentation on it
it would probably be something like 'style: solid, 2px, blue;'
Mostofa kamal
@MK-Emon
Aug 09 2016 07:17
@jrandallhansen thank you
CamperBot
@camperbot
Aug 09 2016 07:17
mk-emon sends brownie points to @jrandallhansen :sparkles: :thumbsup: :sparkles:
:cookie: 315 | @jrandallhansen |http://www.freecodecamp.com/jrandallhansen
Mostofa kamal
@MK-Emon
Aug 09 2016 07:19
@jrandallhansen can you take a look at my pen?
in my first photo the subtitle is away from the photo . how can i fix it?
https://codepen.io/MK-Emon/pen/WxYbEk?editors=1100
Sorin Ruse
@sorinr
Aug 09 2016 07:54
@MK-Emon its because you have a margin of 70px around the img. try to make it margin: 70px 70px 10px 70px; in your class .right-img1
the doer
@ewathedoer
Aug 09 2016 07:58
@MK-Emon I think that for the next pens it would be more useful for you to keep css separately, it’s more maintanable then
Mostofa kamal
@MK-Emon
Aug 09 2016 08:58
@sorinr thank you @ewathedoer
CamperBot
@camperbot
Aug 09 2016 08:58
mk-emon sends brownie points to @sorinr and @ewathedoer :sparkles: :thumbsup: :sparkles:
:cookie: 642 | @sorinr |http://www.freecodecamp.com/sorinr
:cookie: 432 | @ewathedoer |http://www.freecodecamp.com/ewathedoer
Olivier Maes
@oli4maes
Aug 09 2016 09:03
Hi guys! I'm doing the Twitch API project but I've got a big problem and have no clue how to resolve it.
The issues I'm having:
  • Only displays the first streamers name in the array
  • Streamers URL = undefined
  • Streamers logo = undefined
  • I'm using a online and offline class to each streamer so that it displays a green and red border-left to each streamer but for some reason they get both classes and the last streamer doesn't get any class.
    Twitch API
    https://codepen.io/oli4maes/pen/qNJkgV
d1sr3
@d1sr3
Aug 09 2016 09:10
Hello how can I bend objects like in the example for the simon game around the circle?
Sorin Ruse
@sorinr
Aug 09 2016 09:52
@oli4maes dont use for(var i = 0; i < streamers.length; i++) because for is looping ahead and does not wait for your response from the $.get call. you can use instead $.each or if you want to use for you should change the $.getJSON call to $.ajax and make it a synchronous call that will make the for loop to wait until you get the response
softeyes
@softeyes-xl
Aug 09 2016 10:11
blob
who can help me!!!
Stephen James
@sjames1958gm
Aug 09 2016 10:13
@MineMoon You will need a loop around the slice, the slice will need to select parts of the array and save in new array to return.
softeyes
@softeyes-xl
Aug 09 2016 10:15
@sjames1958gm ok,I will try it , thanks
CamperBot
@camperbot
Aug 09 2016 10:15
minemoon sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 2440 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
laststand0810
@laststand0810
Aug 09 2016 10:23
hey guys I got a silly problem:
Stephen James
@sjames1958gm
Aug 09 2016 10:23
@laststand0810 Which is?
laststand0810
@laststand0810
Aug 09 2016 10:24
sorry, accident enter
Stephen James
@sjames1958gm
Aug 09 2016 10:25
@oli4maes Here is an article about using for loops and closure (callbacks). http://stackoverflow.com/questions/750486/javascript-closure-inside-loops-simple-practical-example
@oli4maes Don't use synchronous calls, learn how to handle async correctly.
laststand0810
@laststand0810
Aug 09 2016 10:39

Suppose I have a click object(Obj1)( click it then it and another object (Obj2) will fadeOut then fadeIn back as follow:

Obj1.fadeOut,Obj2.fadeOut -> Obj2.fadeIn(1000), Obj1.fadeIn(1500)

the process works fine as long as I wait the objects to fadeIn completely to have the next click but in the case when I jamming the Obj1, then the process would go nuts for Obj1 will be clickeble as long as it appear(even when it just starts to be visible). So how can I make it unable to click until it appear completely?

Olivier Maes
@oli4maes
Aug 09 2016 10:53
@sjames1958gm Thank you!
CamperBot
@camperbot
Aug 09 2016 10:53
oli4maes sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 2442 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Olivier Maes
@oli4maes
Aug 09 2016 10:54
@sorinr Thanks, I’m redoing the whole thing and it’s working!
CamperBot
@camperbot
Aug 09 2016 10:54
oli4maes sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 643 | @sorinr |http://www.freecodecamp.com/sorinr
Stephen James
@sjames1958gm
Aug 09 2016 10:54
@laststand0810 Do fadeIn / fadeOut allow a callback function on completion? You could set a flag (boolean) indicating fadeIn/Out in progress and your click handler doesn't try
to do another fadeIn/Out until the previous is done (reset the flag in the callback function)
laststand0810
@laststand0810
Aug 09 2016 10:59
@sjames1958gm ohh, thanks for the advice. lol can't believe I don't think of that :V
CamperBot
@camperbot
Aug 09 2016 10:59
laststand0810 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 2443 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Sorin Ruse
@sorinr
Aug 09 2016 11:29
@sjames1958gm good advice on not using sync calls
Joakim Bajoul Kakaei
@Todai88
Aug 09 2016 11:53

Hi guys, me again.
Does anyone know how to remove a :focus eftect when :active is fired?
I have a navbar which has a few anchors in it that toggles when the user scrolls and hits the anchor's hrefs, meaning the anchor's :active gets fired.

If the user clicks any of the anchors (:focus) I want the focus to be removed when the :active hits it. So if I would click the anchor that has href #3 the navbar would toggle (:active) 1,2 and 3. If I then scroll myself the anchor with 3 will still be in :focus. How would I remove that :focus when the :active has hit it?

Malik Samuel
@malikdeniro1
Aug 09 2016 12:01
Hi it's my first day
Akansha
@akansha-dev
Aug 09 2016 12:04
This message was deleted
Spyrantis Theodoros
@thodorisanta
Aug 09 2016 12:09

http://codepen.io/oshikurou/pen/RRxdpr

why in my "shrink-navbar" when i scroll down the right buttons down take the full length of the bottom side of the navbar?

Sorin Ruse
@sorinr
Aug 09 2016 12:17
@thodorisanta first. change order of loading in your settings-js and load first jquery and after bootstrap.js
Spyrantis Theodoros
@thodorisanta
Aug 09 2016 12:18
@sorinr ok i did it, but still same problem.
Ken Haduch
@khaduch
Aug 09 2016 12:22
@thodorisanta - It doesn't look like you have the code in there to make the three-line "hamburger" icon when the bar collapses. The bootstrap site has that in their example code.
@thodorisanta - and when you load jquery.js, and bootstrap.js, jquery has to be first on the list, because bootstrap.js requires it. But that will not solve the problem with the "hamburger" icon - you have to add some HTML code for that.
@thodorisanta - you need this code in your HTML (just after your navbar-header div)
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">Brand</a>
Sorin Ruse
@sorinr
Aug 09 2016 12:26
@thodorisanta probably you made that changes on and edit version of your pen and we don't see that changes as you posted the normal pen
Ken Haduch
@khaduch
Aug 09 2016 12:28
@thodorisanta - and your div with the "collapse" has to have an ID on it, like this: <div class="collapse navbar-collapse navbar-right" id="myNavbar"> - where the myNavBar has to match the value in the data-target="#myNavbar" as I put in my example code above...
Spyrantis Theodoros
@thodorisanta
Aug 09 2016 12:31
@sorinr http://www.bootply.com/109943 this is where i found the code, and i deleted the <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="#">Brand</a>
Spyrantis Theodoros
@thodorisanta
Aug 09 2016 12:36
@khaduch Thanks, i deleted the example code you send above cause i didnt want the icon-bars. I only want the navbar with the list atributes and i thought that this part wasnt needed for that.
CamperBot
@camperbot
Aug 09 2016 12:36
thodorisanta sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1525 | @khaduch |http://www.freecodecamp.com/khaduch
Spyrantis Theodoros
@thodorisanta
Aug 09 2016 12:37
@khaduch i just wanted to make a shrink navbar in the most easy way possible and i got stuck in this.
Wesley
@Wesley-Jzy
Aug 09 2016 13:02
class="col-xs-12 col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2” i want to know what that means for using so much ‘col’ setting
Sorin Ruse
@sorinr
Aug 09 2016 13:09
@thodorisanta here is your solution: nav.shrink .navbar-brand { font-size: 25px; height: 100%; }
Chris Rutherford
@cjrutherford
Aug 09 2016 13:33
can I get a design critique?
Joakim Bajoul Kakaei
@Todai88
Aug 09 2016 13:35
Does anyone know how to override twitter-bootstrap's default CSS?
Sorin Ruse
@sorinr
Aug 09 2016 13:38
@Todai88 hi. all of it? :)
Joakim Bajoul Kakaei
@Todai88
Aug 09 2016 13:38
@sorinr Nah, been battling with how to display my navbar's events (:hover, :focus mainly)
Sorin Ruse
@sorinr
Aug 09 2016 13:40
@Todai88 on the same project?
Lanitta
@DivaWeb
Aug 09 2016 13:47
ok I am feeling very stupid at the moment. but is my css not making chaninges? https://codepen.io/DivaWeb/pen/BKoEZj
Sorin Ruse
@sorinr
Aug 09 2016 13:53
@DivaWeb first. delete all <head> part in html and add in settings->css bootstrap and in settings->javascript first jquery and then bootrap.js
Chris Rutherford
@cjrutherford
Aug 09 2016 14:04
@Todai88 in your CSS define a rule for the elements/ID's/classes you wish to override, and then define properties to be overritdden
Chris Rutherford
@cjrutherford
Aug 09 2016 14:22
@Todai88 for example:
.btn { //defines the button class in bootstrap
  background: #fff; //sets the background of the button to black(? not sure on the color)
  height: 150px; //makes the button tall
}
Norvin Burrus
@ndburrus
Aug 09 2016 14:40
@malikdeniro1 it's your first day with fcc?
jrandallhansen
@jrandallhansen
Aug 09 2016 14:46
could anyone look at my jQuery for the Random Quote Machine I am building? It has not functionality and I am lost on the problem
jwpincus
@jwpincus
Aug 09 2016 14:47
Working on tribute page and having trouble targetting classes to make style changes. http://codepen.io/Jwpincus/pen/XKyWQE
Why isn't my text green here?
Anna
@Anntol
Aug 09 2016 14:49
@jwpincus did you include jquery in settings?
Darth Skywalker
@adityaparab
Aug 09 2016 14:50
That should do it
@jwpincus : Move your $(document).ready from script tag inside html section to js section.
Sorin Ruse
@sorinr
Aug 09 2016 14:50

@jwpincus move this: `<script>
$(document).ready(function() {

$(".text").css("color", "green");
});
</script>` into your js part of the codepen and get rid of <script></script> tags. no need for them

jrandallhansen
@jrandallhansen
Aug 09 2016 14:50
ya they have all identified the issue
Darth Skywalker
@adityaparab
Aug 09 2016 14:50
This way you're loading your <script></script> before your jQuery is loaded
jrandallhansen
@jrandallhansen
Aug 09 2016 14:51
you would need to load the jquery CDN first into your HTML file to run it with a script tag. best to just place in the JS file. really best to just style with basic CSS
Anna
@Anntol
Aug 09 2016 14:51
@jwpincus place your script in js tab, not html
jwpincus
@jwpincus
Aug 09 2016 14:51
@Anntol @sorinr moving to JS section solve the problem. Is that a feature unique to codepen?
if I ran that code in a regular browser would it work like it does in the FCC editor?
Anna
@Anntol
Aug 09 2016 14:52
@jwpincus it depends
jrandallhansen
@jrandallhansen
Aug 09 2016 14:52
@jwpincus it is 'unique' to codepen because you have the CDN loaded only on the JS file so in this case it is running your <script> tags before loading the CDN
Anna
@Anntol
Aug 09 2016 14:52
@jwpincus each editor has its own compilation rules
jrandallhansen
@jrandallhansen
Aug 09 2016 14:52
you have to make sure that jquery loads first
anyone want to take a look at my broken jquery function in this random quote machine assignment?? I am really stuck http://codepen.io/jrandall/pen/ZOqKxQ
Darth Skywalker
@adityaparab
Aug 09 2016 14:53

@jwpincus :

If you have

<script>
  $(document).on('ready', function(){
  });
</script>

<script src="path/to/jquery.min.js"></script>

it won't work

but if you have

<script src="path/to/jquery.min.js"></script>
<script>
  $(document).on('ready', function(){
  });
</script>

it will work

jwpincus
@jwpincus
Aug 09 2016 14:54
Ok cool, so if I include jquery directly in my HTML section then I won't need to split it out to the other editor
Darth Skywalker
@adityaparab
Aug 09 2016 14:54
so that's got nothing to do with code pen. When you put your JS code in JS section, it ensures that you're code is executed after all the external scripts are loaded

@jwpincus

Ok cool, so if I include jquery directly in my HTML section then I won't need to split it out to the other editor

Correct.

jwpincus
@jwpincus
Aug 09 2016 14:55
Ok. Thanks. Understand something new every minute it feels like!
jrandallhansen
@jrandallhansen
Aug 09 2016 14:56
@jwpincus that is good you got that cleared up. is there a reason you are using such a complicated method to style such a simple thing?
Darth Skywalker
@adityaparab
Aug 09 2016 14:56
but it will only ONLY if you put your script tag to include jquery BEFORE your script tag that has $(document).ready
@jrandallhansen : Yours is not broken per say. You just have a minor error

your

Math.floor(Math.random*quotesArray.length);

should be

Math.floor(Math.random()*quotesArray.length);
jrandallhansen
@jrandallhansen
Aug 09 2016 14:58
@adityaparab I was imagining it was a minor error i cant find.
Darth Skywalker
@adityaparab
Aug 09 2016 14:58
you missed the call on Math.random.
jrandallhansen
@jrandallhansen
Aug 09 2016 14:58
@adityaparab argh!!!! you have no idea and it is really embarrassing how long i have been trying to find my error
it has been hours and hours man. i am so stupid sometimes. thank you!!
thank you @adityaparab
CamperBot
@camperbot
Aug 09 2016 14:58
jrandallhansen sends brownie points to @adityaparab :sparkles: :thumbsup: :sparkles:
:cookie: 534 | @adityaparab |http://www.freecodecamp.com/adityaparab
Darth Skywalker
@adityaparab
Aug 09 2016 14:59
@jrandallhansen : Welcome to programming :D When you stare down a piece of code for too long, after a while everything starts looking exactly the same
Artis Raudive
@ar14059
Aug 09 2016 14:59
Hi everyone! Is it a way to chain two elements events to one function(events are different) in jQuery, something like this:
$(".search_input").keypress,$(".search_btn").click(function(e){
Darth Skywalker
@adityaparab
Aug 09 2016 14:59
@ar14059 : No that's not how you chain.
You chaing things on the same object.
Artis Raudive
@ar14059
Aug 09 2016 15:01
Than how should i do that?
Evariste Musekwa Iguna
@musekwa
Aug 09 2016 15:01
Hello verybody, can someone instruct me how I can insert an image from my PC to my webpage (I want this image to been visible from any pc's browser)
Darth Skywalker
@adityaparab
Aug 09 2016 15:01
You have different elements. so you have to write them separately.
Paula
@pwbabydoll
Aug 09 2016 15:02
Hi everyone, I need a little help with something that I should know but I've been at it for a long time and everything is a blur. I have completed my portfolio challenge and submitted but it doesn't submit, no errors nothing. I figure I have link wrong but I copied it from my browser, any suggestions?
Darth Skywalker
@adityaparab
Aug 09 2016 15:02
@ar14059
$(".search_input").keypress(function(){});

$(".search_btn").click(function(e){});
Artis Raudive
@ar14059
Aug 09 2016 15:02
@adityaparab Ok, thanks for help!
CamperBot
@camperbot
Aug 09 2016 15:02
ar14059 sends brownie points to @adityaparab :sparkles: :thumbsup: :sparkles:
:cookie: 535 | @adityaparab |http://www.freecodecamp.com/adityaparab
Emil Björnlinger
@emilbjornlinger
Aug 09 2016 15:02
Hi all! I'm on my Portfolio project in the first Front End Challenge. I have tried to link from my Portfolio page to my Twitter, Github and Google +. But none of them are working and I can't figure out why? Is it some kind of security from Twitter etc. and how can i solve it in that case?
Darth Skywalker
@adityaparab
Aug 09 2016 15:03
@pwbabydoll : Post your link here
Paula
@pwbabydoll
Aug 09 2016 15:03
Hi Emil, I just completed that did you put the target blank?
Darth Skywalker
@adityaparab
Aug 09 2016 15:03

@pwbabydoll : Try posting the full page view link

https://codepen.io/phbabydoll/full/BzzaZX/

Paula
@pwbabydoll
Aug 09 2016 15:04
thank you Darth, I'll try that
Sorin Ruse
@sorinr
Aug 09 2016 15:05
@jrandallhansen the problem using Math.random() is that you will see very rarely your quotesArray with the index zero
Paula
@pwbabydoll
Aug 09 2016 15:06
Hi Darth, maybe you can see what I have done wrong,
lackodan
@lackodan
Aug 09 2016 15:06
Okay, apparently I already need help with my very first project, the Tribute page... I was trying to set the maximum with of the image by specifying max-width for all img elements in CSS, but that doesn't work. However, if I use JQuery: ("img").css(...) it does work. Can someone help me understand why?
Emil Björnlinger
@emilbjornlinger
Aug 09 2016 15:06
No i didn't. But where do i put the blank
Paula
@pwbabydoll
Aug 09 2016 15:08
After you put the link in your html
Emil Björnlinger
@emilbjornlinger
Aug 09 2016 15:08
Okay I'll try that! Thanks!
KD
@Annallon
Aug 09 2016 15:08
@pwbabydoll why does your navbar repeat? is that intentional?
Paula
@pwbabydoll
Aug 09 2016 15:09
<a href="http://www.freecodecamp.com/pwbabydoll" target="_blank">FreeCodeCamp</a> like this
Emil Björnlinger
@emilbjornlinger
Aug 09 2016 15:09
That helped! Thank you so much!
Paula
@pwbabydoll
Aug 09 2016 15:09
Not sure, not seeing it on this end but I did reuse a code block
Tyler Moeller
@TylerMoeller
Aug 09 2016 15:11

@lackodan If you have set up the "img-responsive" class on the image, you need to apply the max width to that class or it will override any css you apply to img.

.img-responsive {
    max-width: 100px;
}

But that directly overrides the whole purpose of having a responsive image. To control the size for this project, use the bootstrap grid system instead - put it in a column sized appropriately for the screen resolution: http://getbootstrap.com/css/#grid-media-queries

KD
@Annallon
Aug 09 2016 15:11
could be just me :-)
Paula
@pwbabydoll
Aug 09 2016 15:12
I think I know what you mean, It's the one page portfolio that has to have a repeating nav bar on all the pages, I think lol
Maybe I put too much code for the challenge to handle? Could this be the reason it will not submit?
lackodan
@lackodan
Aug 09 2016 15:15
@TylerMoeller, thanks alot, that works!
CamperBot
@camperbot
Aug 09 2016 15:15
lackodan sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 723 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Aug 09 2016 15:18

@pwbabydoll Your columns aren't all in rows and some of them are in a row-fluid class that doesn't exist in the version of bootstrap you are using. To use the grid, everything needs to be in a container->row->column:

<div class="container">
  <div class="row">
    <div class="col-xs-6"></div>
    <div class="col-xs-6"></div>
  </div>
</div>

http://getbootstrap.com/css/#grid

TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 15:19
Can someone help me with codepen?
How do I view what I just coded?
Like in a separate webpage
Paula
@pwbabydoll
Aug 09 2016 15:20
Yea, I realize I need to clean the containers up, lol but it did go through. I know it's a little sloppy on the code but I will go back and fix it
Sorin Ruse
@sorinr
Aug 09 2016 15:21
@TasmaniaKrama change view to debug
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 15:21
Ahh thank you.
Sorin Ruse
@sorinr
Aug 09 2016 15:22
welcome
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 15:22
Well I am not 30 minutes into my first tribute project and I am stuck.
I am trying to figure out how to make it so that the background of h1 element sticks margins so that it is aligned to the child element.
Paula
@pwbabydoll
Aug 09 2016 15:23
What are you stuck on Tas?
Tyler Moeller
@TylerMoeller
Aug 09 2016 15:23
@pwbabydoll All of the completed projects you submit are reviewed manually, they'll always go through :) but may come back to bite you later. Definitely clean up the code if you know there are bugs.
KD
@Annallon
Aug 09 2016 15:23
@TylerMoeller they're all reviewed manually? how do they have time to look through them all
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 15:24
I know bootstrap has some kind of trick. I just can't remember which one.
Tyler Moeller
@TylerMoeller
Aug 09 2016 15:24
@Annallon I'm sure they have some automation to check for common things, like plagiarism, but yeah, it's a lot to review.
Paula
@pwbabydoll
Aug 09 2016 15:25
I know, I will thank you Tyler they will bite me for sure. My grid system is out of whack, this I know I was shooting for content first which I know is wrong. I will clean this up.
Hi Tas, are you running Bootstrap?
Bootstrap will help with margins, I believe and all you will have to do is add a class to align your elements
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 15:27

<p data-height="265" data-theme-id="0" data-slug-hash="GqwPEp" data-default-tab="html,result" data-user="TasmaniaKrama" data-embed-version="2" class="codepen">See the Pen <a href="https://codepen.io/TasmaniaKrama/pen/GqwPEp/">GqwPEp</a> by Filip (<a href="http://codepen.io/TasmaniaKrama">@TasmaniaKrama</a>) on <a href="http://codepen.io">CodePen</a>.</p>

<script async src="//assets.codepen.io/assets/embed/ei.js"></script>

darn it. How do I paste this?
im so lost
Paula
@pwbabydoll
Aug 09 2016 15:28
Which challenge are you on?
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 15:28
tribute page
Paula
@pwbabydoll
Aug 09 2016 15:28
Are you trying to link to your tribute?
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 15:29
I am writing a code on
codepen
KD
@Annallon
Aug 09 2016 15:29
just link it to us directly
Paula
@pwbabydoll
Aug 09 2016 15:29
So, your setting up your page?
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 15:29
yea
I already wrote something but I am stuck
Paula
@pwbabydoll
Aug 09 2016 15:29
Your having trouble viewing? starting the page?
Darth Skywalker
@adityaparab
Aug 09 2016 15:29
Force works in mysterious ways, especially in bootstrap
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 15:29
linking here
clicked on embed
and copied the script that links to my code
idk how to paste it here
Darth Skywalker
@adityaparab
Aug 09 2016 15:30
@TasmaniaKrama Just paste the link here. embedding will take care of itself
Paula
@pwbabydoll
Aug 09 2016 15:30
ahhh, mac or pc?
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 15:30

<p data-height="265" data-theme-id="0" data-slug-hash="GqwPEp" data-default-tab="html,result" data-user="TasmaniaKrama" data-embed-version="2" class="codepen">See the Pen <a href="https://codepen.io/TasmaniaKrama/pen/GqwPEp/">GqwPEp</a> by Filip (<a href="http://codepen.io/TasmaniaKrama">@TasmaniaKrama</a>) on <a href="http://codepen.io">CodePen</a>.</p>

<script async src="//assets.codepen.io/assets/embed/ei.js"></script>

doesn't work
Darth Skywalker
@adityaparab
Aug 09 2016 15:31

@TasmaniaKrama : All you needed is this

https://codepen.io/TasmaniaKrama/pen/GqwPEp/

TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 15:31
ohh
anyways. I am stuck on the purple background thing. I want the element background to match the width of the image below it
Ash Roulston
@AshRoulston
Aug 09 2016 15:32
Hi, I'm looking for help with clipping polygons from images. is anyone experienced enough with it to help me?
Darth Skywalker
@adityaparab
Aug 09 2016 15:32
@TasmaniaKrama : Next, you CSS should go inside your CSS section of codepen
@AshRoulston : Code please..
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 15:33
@adityaparab I am not following.
@adityaparab I am a total noob here. Just finished the lessons to tribunal lesson.
We only wrote in one window in the lessons
Ash Roulston
@AshRoulston
Aug 09 2016 15:34
@adityaparab That isn't what I need, there isn't specific code to be edited.
Darth Skywalker
@adityaparab
Aug 09 2016 15:35
@AshRoulston : Yeah, that's what I meant. paste the code here that you need help with
@TasmaniaKrama : First, you need some refactoring in your code
Ash Roulston
@AshRoulston
Aug 09 2016 15:36
There is not specific code. @adityaparab I am asking for help finding a general understanding of how it works. Please stop asking for the code. There is no code.
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 15:36
@adityaparab There was no mentioning of "refactoring" in the lessons.
Darth Skywalker
@adityaparab
Aug 09 2016 15:37
@TasmaniaKrama : Okay. In programming, The term refactoringmeans, you need to change some code.
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 15:37
Like honestly, I spent days passing this lessons. Now that I have to write my own project I feel useless. Like I learned nothing.
Darth Skywalker
@adityaparab
Aug 09 2016 15:39

@TasmaniaKrama : Is this how you wanted it to look?

https://codepen.io/AdityaParab/pen/wWQOGO?editors=1100

TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 15:40
No just the background on military organization
Like I did it but the purple should be aligned to the image below
Also I don't write <style> but simply write in CSS part right
Darth Skywalker
@adityaparab
Aug 09 2016 15:43

@TasmaniaKrama :

  margin-right: 495px;
  margin-left: 495px;

Should do it

TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 15:43
It doesn't look good.. also the purple is somehow lost :O
this is beyond me
Sabrina Ferguson
@itsacoyote
Aug 09 2016 15:48
What's the issue you're having @TasmaniaKrama ?
So, I can't figure how to edit the background , purple one.
So that it's margins match the width of the image below it
But it must stay like that even if someone is resizing the browser window.
If I just put margin-left/right and amount of px it looks good but as soon as dimensions of screen get changed like someone views it from mobile phone everything breaks down.
Tyler Moeller
@TylerMoeller
Aug 09 2016 16:13
@TasmaniaKrama Use a jumbotron and make that purple by changing your .my-class in your css to .jumbotron: http://getbootstrap.com/components/#jumbotron
Also add the img-responsive class to your <img> so it resizes inside the jumbotron.
Sabrina Ferguson
@itsacoyote
Aug 09 2016 16:16
@TasmaniaKrama trying to understand what you're saying here. So you want the spacing between the image and the edges of the purple container to stay the same as you resize the screen? So probably make the image smaller to fit fully on a mobile phone?
Or are you going for something like this? http://codepen.io/itsacoyote/pen/akQrPq
Drew Dusang
@dmdusang
Aug 09 2016 16:24
@TasmaniaKrama also trying to help you out
something like this?
if you un comment out the padding in the body you can have what you perceive as a margin around your container-fluid
which by the way in your original codepen you had "container fluid"
it should be "contianer-fluid"
also if you want your image to resize within your container, you need to attach the bootstrap class "img-responsive" so that it resizes and stays within the container when your screen gets smaller
Drew Dusang
@dmdusang
Aug 09 2016 16:32
though looking through @itsacoyote 's work, that may be what you're trying to go for
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 17:14
@TylerMoeller @itsacoyote sorry I took a break. I will read your responses shortly
@itsacoyote So, yes but without resizing of the image. So image stays like it is and the above purple background should match it's borders no matter the device.
Sabrina Ferguson
@itsacoyote
Aug 09 2016 17:22
@TasmaniaKrama hmm
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 17:23
So while I watch the webpage and resize the browser image should stay the same dimensions and purple box should be aligned with the image borders like it's all in one column.
And as I resize the browser it should all stay like that
KD
@Annallon
Aug 09 2016 17:25
hmm, how do you use the scrollspy for the portfolio site
Sabrina Ferguson
@itsacoyote
Aug 09 2016 17:25
@TasmaniaKrama ah, so like this?
Wait fixing,
KD
@Annallon
Aug 09 2016 17:25
ive been using the id tags and still no success
:(
Sabrina Ferguson
@itsacoyote
Aug 09 2016 17:26
@TasmaniaKrama here we go: http://codepen.io/itsacoyote/pen/akQrPq
@Annallon code?
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 17:26
Yesss
@itsacoyote Looks like it works.
Let me snoop the code to see what you did :D
KD
@Annallon
Aug 09 2016 17:27
oh doh, I forgot to include it :)
Sabrina Ferguson
@itsacoyote
Aug 09 2016 17:27
@TasmaniaKrama I removed the container and responsive class from the parent div and added a display table and margin 0 auto to the .my-class
Drew Dusang
@dmdusang
Aug 09 2016 17:29
@kd first you need to add bootstrap.js and jquery to your javascript
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 17:30
I got to check what display table is
thanks @itsacoyote
CamperBot
@camperbot
Aug 09 2016 17:30
tasmaniakrama sends brownie points to @itsacoyote :sparkles: :thumbsup: :sparkles:
:cookie: 336 | @itsacoyote |http://www.freecodecamp.com/itsacoyote
Sabrina Ferguson
@itsacoyote
Aug 09 2016 17:30
@Annallon I'm having a look through it
KD
@Annallon
Aug 09 2016 17:32
@itsacoyote oh, I think I literally just fixed it.. see what you think though :smile:
wait no i havent
Joakim Bajoul Kakaei
@Todai88
Aug 09 2016 17:39
@cjrutherford I'm not really sure if I explained myself correctly. I somehow need to override the properties that are defined in bootstrap's navbar. In my case it's not as easy as redefining the triggers, but I seem to be required to define them with an !important tag as well as handling the z-index somehow as for some reason my page won't allow the :focus to be beneath the :active. Meaning that if an anchor is in focus but not active the focus should be applied (focus being the bg being transparent), but if the anchor is both active and in focus then the active should be on top (bg should be white, not transparent)
Drew Dusang
@dmdusang
Aug 09 2016 17:39
@Annallon first you need to add jquery and bootstrap.js
then you need to delete your jquery you wrote as you've already added scrollspy to the body in your html
then I'm pretty sure your div with id="About" needs to be on the same level as your portfolio and contact divs
though that last part I'm not too sure about, but I've got it to scroll and recognize portfolio and contact but not about
Sorin Ruse
@sorinr
Aug 09 2016 17:42
@Todai88 did you had the chance to look what i pm-ed u?
KD
@Annallon
Aug 09 2016 17:43
@dmdusang deleted my jquery- thanks for that
CamperBot
@camperbot
Aug 09 2016 17:43
annallon sends brownie points to @dmdusang :sparkles: :thumbsup: :sparkles:
:cookie: 122 | @dmdusang |http://www.freecodecamp.com/dmdusang
KD
@Annallon
Aug 09 2016 17:43
let me look at the code and ill get back to you about the levels of ids
Drew Dusang
@dmdusang
Aug 09 2016 17:44
sweet @Annallon
KD
@Annallon
Aug 09 2016 17:49
@dmdusang I had two IDs nested within the same div. however, I'm still not getting it to recognise which section it is in by scrolling
@dmdusang does it still work for you?
Drew Dusang
@dmdusang
Aug 09 2016 17:52
@Annallon in your javascript add ons
add bootstrap
it's seperate from the css
separate
so you have to add that as well to use bootstrap js plugins like scrollspy
once you add it, everything should work
KD
@Annallon
Aug 09 2016 17:55
ahhhhhh!!!
it works beautifully now :D
Drew Dusang
@dmdusang
Aug 09 2016 17:55
awesome!! @Annallon
KD
@Annallon
Aug 09 2016 17:55
how come it worked from your end though?
Drew Dusang
@dmdusang
Aug 09 2016 17:56
I kept adding the bootstrap.js but wasn't saying it clear enough for you to get that is what I was doing haha @Annallon
so that was my bad
but glad it works now!
KD
@Annallon
Aug 09 2016 17:57
@dmdusang ohhh haha! no worries, thank you anyhow! :smile:
CamperBot
@camperbot
Aug 09 2016 17:57
annallon sends brownie points to @dmdusang :sparkles: :thumbsup: :sparkles:
:warning: annallon already gave dmdusang points
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 18:00
Problem is margin-right isn't working :O
JozoJozo
@JozoJozo
Aug 09 2016 18:02
hey guys! my next task is to build a CodePen.io app..i am not sure how to even start..anybody to help?
Sabrina Ferguson
@itsacoyote
Aug 09 2016 18:04
@Annallon sorry I wasn't able to get to it, though glad that @dmdusang figured it out! Had to run off to lunch real quick :<
When working with Bootstrap it works great to just use the quick import on the settings in CodePen.
KD
@Annallon
Aug 09 2016 18:06
@itsacoyote Not to worry.. food is much more important!!! :smile: and thanks for that lil tip
CamperBot
@camperbot
Aug 09 2016 18:06
annallon sends brownie points to @itsacoyote :sparkles: :thumbsup: :sparkles:
:cookie: 337 | @itsacoyote |http://www.freecodecamp.com/itsacoyote
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 18:07
Honestly I have no idea why margin-right won't work with the table? left and top work just fine
Eric Weiss
@eweiss17
Aug 09 2016 18:11
@TasmaniaKrama you using bootstrap?
Eric Weiss
@eweiss17
Aug 09 2016 18:17
@TasmaniaKrama I fixed it.
width: 80% !important;
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 18:20
It doesn't work with 80%
Eric Weiss
@eweiss17
Aug 09 2016 18:21
table {
  position: absolute;
  width: 80% !important;
  margin-left: 10%;
  margin-right: 10%;

  margin-top: 20px;
}
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 18:22
Ahh let me see
Eric Weiss
@eweiss17
Aug 09 2016 18:22
you don't need position though just ignore that
basically the bootstrap was overriding your css. The important makes it so that it does not
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 18:22
holy moly
it works :D
@eweiss17 thanks
CamperBot
@camperbot
Aug 09 2016 18:24
tasmaniakrama sends brownie points to @eweiss17 :sparkles: :thumbsup: :sparkles:
:cookie: 252 | @eweiss17 |http://www.freecodecamp.com/eweiss17
David
@davidpetric
Aug 09 2016 18:26
Hello, can someone help me with a clue... I can t figure how to solve Only add one class with each of your three selectors. on 104 chalange
challange
Stephen James
@sjames1958gm
Aug 09 2016 18:26
@davidpetric The number 104 is your progress counter - what is the name of the challenge.
David
@davidpetric
Aug 09 2016 18:27
target-the-same-element-with-multiple-jquery-selectors
@sjames1958gm
Stephen James
@sjames1958gm
Aug 09 2016 18:28
@davidpetric What code have you added?
David
@davidpetric
Aug 09 2016 18:29

@sjames1958gm

<script>
$(document).ready(function() {
$("button")
$(".btn")
$("#target1").addClass("animated shake btn-primary");

});
</script>

<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 target" id="target1">#target1</button>
<button class="btn btn-default target" id="target2">#target2</button>
<button class="btn btn-default target" id="target3">#target3</button>
</div>
</div>
<div class="col-xs-6">
<h4>#right-well</h4>
<div class="well" id="right-well">
<button class="btn btn-default target" id="target4">#target4</button>
<button class="btn btn-default target" id="target5">#target5</button>
<button class="btn btn-default target" id="target6">#target6</button>
</div>
</div>
</div>
</div>

Stephen James
@sjames1958gm
Aug 09 2016 18:30
@davidpetric There should be three addClass class one for each selector with the corresponding class.
David
@davidpetric
Aug 09 2016 18:32
@sjames1958gm It doesn t work
Stephen James
@sjames1958gm
Aug 09 2016 18:32
@davidpetric repost, only the lines that you have added.
David
@davidpetric
Aug 09 2016 18:34
$("button").addClass("animated shake")
$(".btn").addClass("btn-primary")
$("#target1").addClass("animated shake btn-primary btn-primary");
@sjames1958gm
Stephen James
@sjames1958gm
Aug 09 2016 18:35
@davidpetric Only add one class with each of your three selectors.
David
@davidpetric
Aug 09 2016 18:38
@sjames1958gm i will figure it another time, thanks for trying to help me, have a nice day @sjames1958gm
CamperBot
@camperbot
Aug 09 2016 18:38
davidpetric sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 2454 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Mariya
@mariyadiminsky
Aug 09 2016 18:38
Anyone know how to store react store to localStorage? I have code I can paste in(my attempt).
Islam Ibakaev
@dagman
Aug 09 2016 18:51
hey guys why i get 1-0 : 1-0 istead 5 when break begins? http://codepen.io/dagman/pen/oxqzLx
Ajay Tanwar
@ajayt365
Aug 09 2016 18:52
https://codepen.io/ajayt365/pen/RRYOdk Json request not working. also console.log(longi) returns undefined . why ? please help .
Stephen James
@sjames1958gm
Aug 09 2016 18:55
@ajayt365 get position returns before running your callback, so longi is not set yet, add your getJSON to your get position callback.
Alique Williams
@AliqueWilliams
Aug 09 2016 18:59
class BugTable extends React.Component{
  render(){
    function() {
      console.log('test...')
    }

    return( <div>testing</div> )

  }
}
Does anyone know the syntax error here?
says I can't even write function inside the render function
SyntaxError: C:/Users/Alique/desktop/mern/src/App.js: Unexpected token (19:12)
  17 | class BugTable extends React.Component{
  18 |   render(){
> 19 |     function() {
strange
wait I meant to click backend
damn
but w/e
Garrus Napp
@GarrusNapp
Aug 09 2016 19:02
@AliqueWilliams I have no idea, maybe put it inside () of render? I didnt take js yet
Ajay Tanwar
@ajayt365
Aug 09 2016 19:06
```
$(document).ready(function(){
  getValue();
});

var getValue = function(){
  var longi;
  var lati;
  if(navigator.geolocation){
    navigator.geolocation.getCurrentPosition(function(position){
     // getting longitude and latitude values
      longi=position.coords.longitude;
      lati=position.coords.latitude;
         var url="https://crossorigin.me/http://api.openweathermap.org/data/2.5/weather?lat="+lati+"&lon="+longi+"";
   $.getJSON(url,function(data){
     console.log(data);
   });
      });
  }
  else{
    console.log("location could not be detected");
  }
  console.log(longi); // returns undefined . please help.



};
@sjames1958gm console.log() still returns undefined. longi is in scope but why it's undefined in the console?
Stephen James
@sjames1958gm
Aug 09 2016 19:09
@ajayt365 longi is not set when the code gets there because getCurrentPositionis asynchronous and the callback has not yet executed.
put a console.log inside of the callback and see which happens first
Ajay Tanwar
@ajayt365
Aug 09 2016 19:14
undefined is return first and then value of longi is printed . i think latter console.log is printing undefined . isn't it? @sjames1958gm
@sjames1958gm is there any way i can print value instead of undefined with console.log() present outside getCurrentPos.. function?
Julie Broach
@jbroac01
Aug 09 2016 19:18

http://www.juliebroach.com/MovemeNow/#services https://codepen.io/mswilson/pen/bZQpgj?editors=1010
CodePen
bZQpgj
...

but the code pen site looks completely different from my uploaded site

when the screen is at it widest I lose my bottom images. What do you suggest for this:nerd_face:

Stephen James
@sjames1958gm
Aug 09 2016 19:19
@ajayt365 Not without some sort of wait to ensure the getCurrentPosition has completed.
Ajay Tanwar
@ajayt365
Aug 09 2016 19:20
and how can i appy that ? is there any function to ensure that? @sjames1958gm
apply*
Stephen James
@sjames1958gm
Aug 09 2016 19:22
@ajayt365 I'm not sure you should spend time on that. Your code will operate mostly in callbacks, that is the js way.
Ajay Tanwar
@ajayt365
Aug 09 2016 19:27
hey can i use .done method like we have with ajax on getcurrentPos.. function? @sjames1958gm
Stephen James
@sjames1958gm
Aug 09 2016 19:33
@ajayt365 I wouldn't think so, only way to find out is to try.
Ajay Tanwar
@ajayt365
Aug 09 2016 19:34
if i have another query i will ask u man . thanks :) @sjames1958gm
CamperBot
@camperbot
Aug 09 2016 19:34
ajayt365 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 2456 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Nobuyuki Fujioka
@nfabacus
Aug 09 2016 19:36
hello, I want to start working on weather app challenge. But, google Chrome does not seem to support geolocation anymore. How do I go around it? Your help is highly appreciated.
Joakim Bajoul Kakaei
@Todai88
Aug 09 2016 19:38
@nfabacus What seems to be the problem? What has been depricated?
If you just need coordinates then I think there is a geolocation jquery library
Stephen James
@sjames1958gm
Aug 09 2016 19:39
@ajayt365 good luck
Joakim Bajoul Kakaei
@Todai88
Aug 09 2016 19:39
@nfabacus http://www.w3schools.com/html/html5_geolocation.asp that's a html5 example
Stephen James
@sjames1958gm
Aug 09 2016 19:39
@nfabacus You cannot use geolocation from http:// sites any more - you can use ip-api.com/json for an ip based location
Joakim Bajoul Kakaei
@Todai88
Aug 09 2016 19:40
@nfabacus And also it seems like google's geolocation should work? https://developers.google.com/maps/documentation/geolocation/intro
You might just need to get yourself a developer API
Nobuyuki Fujioka
@nfabacus
Aug 09 2016 19:41
@sjames1958gm @Todai88 Thank you guys. I will try google's api.
CamperBot
@camperbot
Aug 09 2016 19:41
:cookie: 126 | @todai88 |http://www.freecodecamp.com/todai88
nfabacus sends brownie points to @sjames1958gm and @todai88 :sparkles: :thumbsup: :sparkles:
:star2: 2457 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Joakim Bajoul Kakaei
@Todai88
Aug 09 2016 19:41
@nfabacus Or you could use Stephen's example, though that might not teach you as much about relevant API's as you simply might just be parsing JSON data.
Nobuyuki Fujioka
@nfabacus
Aug 09 2016 19:43
@sjames1958gm Also, the one you suggested http://ip-api.com/json seems to work. Just location is not too accurate, though.
But, it is very easy to use.
Tyler Moeller
@TylerMoeller
Aug 09 2016 19:47
@nfabacus I'd recommend Weather Underground. It supports both HTTP/HTTPS and you can get location + weather all with a single API Call: https://www.wunderground.com/weather/api/d/docs?d=data/geolookup
Use the autoip.json link: http://api.wunderground.com/api/Your_Key/geolookup/q/autoip.json
Joakim Bajoul Kakaei
@Todai88
Aug 09 2016 19:50
Yo guys.
Have had this question up here previously, but I need someone to help me with my navbar (bootstrap).
It navigates (toggles the activate) fine, but for some reason the :focus isn't removed if you toggle (scroll) past the focused anchor. The goal is that the anchor's :hover should be gray (as it is), the scrolling :activate should be white (as it is), but the :focus (click) should be transparent.
Whenever I set the :focus to be transparent it overrides the white :active background - meaning that the user gets no visual feedback when the navbar has activated the anchor.
Here is a pen:
https://codepen.io/sorinr/pen/RRqdWJ
Nobuyuki Fujioka
@nfabacus
Aug 09 2016 19:52
@TylerMoeller Thank you I will try that. The only issue remaining for me on this is for this challenge, actually I need to use my api keys for both open weather and geolocation. Using personal keys is not a very safe thing to do? or is it okay in terms of this usage?
CamperBot
@camperbot
Aug 09 2016 19:52
:cookie: 724 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
nfabacus sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
Tyler Moeller
@TylerMoeller
Aug 09 2016 19:53
@nfabacus Yeah, you shouldn't expose API keys, but for this project, there's really no choice. Everyone is doing it. You can easily search for your API key in codepen to see if anyone else is using it and you can change it whenever needed.
Nobuyuki Fujioka
@nfabacus
Aug 09 2016 19:55
@TylerMoeller Ok, thank you for your input. I will use them only for this project.
CamperBot
@camperbot
Aug 09 2016 19:55
nfabacus sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:warning: nfabacus already gave tylermoeller points
Islam Ibakaev
@dagman
Aug 09 2016 19:58
yo guys looks like i finished my pomodoro
check it out and test please
Tyler Moeller
@TylerMoeller
Aug 09 2016 19:59
@Todai88 It's likely a matter of figuring out which class to apply your transparent background to. You could also use jQuery to remove focus:
$('.nav li a').click(function() {
  $(this).blur();
});
the doer
@ewathedoer
Aug 09 2016 20:00
@dagman I like this minimalistic design. Not sure whether 15 for real users should be the minimum set. I may want to use it and set it up for 10 min or less e.g.
Rasmunis
@Rasmunis
Aug 09 2016 20:01
Hey, I am trying to make some text change when I click a button (on the random quote generator project) using jquery, and I've basically done exactly the same as in the "Change text with click events"-course. But for me the text just won't change.. Is this different when doing it in codepen?
Islam Ibakaev
@dagman
Aug 09 2016 20:01
@ewathedoer 15 looks like average set up
Joakim Bajoul Kakaei
@Todai88
Aug 09 2016 20:01
@TylerMoeller Thanks, man. Can't believe a jQuery question on SO that has nearly 100 views gave no results
CamperBot
@camperbot
Aug 09 2016 20:01
todai88 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 725 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Jason Luboff
@JLuboff
Aug 09 2016 20:03
@Rasmunis can you post your codepen?
Rasmunis
@Rasmunis
Aug 09 2016 20:05
@JLuboff The link?
Jason Luboff
@JLuboff
Aug 09 2016 20:05
Yes
Jason Luboff
@JLuboff
Aug 09 2016 20:08
@Rasmunis Ok, a couple of things. 1. Move your Jquery to the JS section of Codepen and there is no need for the <script></script>. 2. Load jQuery by clicking the gear next to JS and quick-adding jQuery
See what happens
Rasmunis
@Rasmunis
Aug 09 2016 20:09
@JLuboff That worked, thanks! So much research, and the code was right all along...
CamperBot
@camperbot
Aug 09 2016 20:09
rasmunis sends brownie points to @jluboff :sparkles: :thumbsup: :sparkles:
:cookie: 268 | @jluboff |http://www.freecodecamp.com/jluboff
Jason Luboff
@JLuboff
Aug 09 2016 20:12
@Rasmunis Ya...Codepen is a little tricky at first. FCC doesn't really explain how you need to use it necessarily heh
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 20:18
Ok guys I think my first tribute project is over. https://codepen.io/TasmaniaKrama/pen/GqwPEp
I know it's bad and looks like a kid did it, but hey it's better than nothing.
the doer
@ewathedoer
Aug 09 2016 20:33
@TasmaniaKrama looks well on mobile.
You can always iterate later if you still want to change sth. It's fair enough to go (at least when it comes to mobile)
laststand0810
@laststand0810
Aug 09 2016 21:02

https://s.codepen.io/laststand0810/debug/bZxGkA

my 2nd inter project, in addition with the use cases, I put some effort on data load restriction, for it would be a waste on data usage if it would reload every 5s, so beside 5s check, it would check if the user have gone out of an area 500 meters from the point they were at on the last successful update, otherwise, it will automatically update every 15min..... haven't check that feature out though (rarely out of my house :v), would be nice if anybody could help me that

Daniel Parvin
@danielparvin
Aug 09 2016 21:07
Would you please critique my random quotes app?
http://codepen.io/danielparvin/pen/QErbzj
AzeddineDev
@AzeddineDev
Aug 09 2016 21:14
@danielparvin Good work Daniel, keep going on!
Daniel Parvin
@danielparvin
Aug 09 2016 21:15
@AzeddineDev Thank you!
CamperBot
@camperbot
Aug 09 2016 21:15
danielparvin sends brownie points to @azeddinedev :sparkles: :thumbsup: :sparkles:
:cookie: 148 | @azeddinedev |http://www.freecodecamp.com/azeddinedev
TasmaniaKrama
@TasmaniaKrama
Aug 09 2016 21:17
@ewathedoer thanks. Now I have to build a portfolio, which needs to be more complex and sadly blank since I have nothing to put in it :/
CamperBot
@camperbot
Aug 09 2016 21:17
tasmaniakrama sends brownie points to @ewathedoer :sparkles: :thumbsup: :sparkles:
:cookie: 438 | @ewathedoer |http://www.freecodecamp.com/ewathedoer
Mark Marchant
@jtla3
Aug 09 2016 21:24
Hello, I am very new to free code camp and completed all the challenges and finished my tribute page but I'm stuck on "build my own portfolio page". Can anyone help me get started?
Rada
@Radascript
Aug 09 2016 21:40
@jtla3 don't worry about that project too too much because you will want to redo it completely when you are done. For now, I would break it up into little parts. Start with reading on about how to make bootstrap navbar
claytonidus
@claytonidus
Aug 09 2016 21:40
quick question what class to center an img?
Rada
@Radascript
Aug 09 2016 21:41
@claytonidus I still just jam <center></center> tags around most things I want centered
claytonidus
@claytonidus
Aug 09 2016 21:43
@Radascript lol that was super easy... I was trying to come up with a solution that i learned so far in this program. Thank you
CamperBot
@camperbot
Aug 09 2016 21:43
claytonidus sends brownie points to @radascript :sparkles: :thumbsup: :sparkles:
:cookie: 383 | @radascript |http://www.freecodecamp.com/radascript
Rada
@Radascript
Aug 09 2016 21:45
@claytonidus yw! Also you say - "I was trying to come up with a solution that i learned so far in this program." I did this for a very big part of the front-end cert, and looking back I wish I didn't feel so constrained. Don't be afraid to google around and implement solutions they haven't used in lessons, trust me it will serve you better.
D. Gonzalez
@younglionking
Aug 09 2016 22:01
I am trying to get my image in the center of the page for my portfolio, can someone look at my code and see whats wrong?
<div id="who" class"container-fluid">
<h1 class="margin text-center">Who Am I?</h1>
<img src="http://www.parkourlinz.at/blog/wp-content/uploads/2013/02/anonym.jpg" class="img-circle margin" width="250" height="350" align="middle">
<h2 class="text-center">I am David Andres, and I a coding student at FreeCodeCamp.com</h2>
</div>
<br>
<br>
i put an align="middle" on the img tag
but it stays off to the left
@Radascript i just jammed a <center></center> tag on my image lol, thats for unknowingly helping me with this
Rada
@Radascript
Aug 09 2016 22:09
@younglionking haha you are welcome. I don't know if it's the best practice since it doesn't separate style from HTML but it does the job well
terra43110
@terra43110
Aug 09 2016 22:13
maybe you need to add something like:
<img src="http....jpg" class"text-center">
@younglionking you have text-center classes on your h1 & h2, but not your img
Artis Raudive
@ar14059
Aug 09 2016 22:39
Hi, everyone! I have a problem with Wikipedia Viewer - can't understand, why can't i remove content of $("#search_result"): http://codepen.io/artisraudive/pen/JKkWXR?editors=0010 - in line 39 in JS code? I have a function (getContent) , that displays certain amount of results. Please help!
Alec Davila
@FullPint
Aug 09 2016 22:39
This message was deleted
@younglionking you've got a few things wrong with your code. First you have <div id="who" class"container-fluid"> That needs to be <div id="who" class="container-fluid">. It is important to use the correct syntax when using classes. Next <h1 class="margin text-center">Who Am I?</h1> ... </h2> needs to be wrapped with <div class="row"></div>
Alec Davila
@FullPint
Aug 09 2016 22:45
@younglionking Now when you've got that setup correctly you can use <img src="..." alt="..." target="_blank" class="img-responsive center-block" /> While @terra43110 is correct and that it'll center, you'll be doing it in the non-preferred way. The big thing is to allow bootstrap to maintain your image's responsiveness. Also center-block because useful for all non-text blocks.
greg
@wearenotgroot
Aug 09 2016 22:47
@ar14059 have you tried using empty()
remove ----->https://api.jquery.com/remove/
empty------->https://api.jquery.com/empty/
Artis Raudive
@ar14059
Aug 09 2016 22:49
Yes, but it didn't work
At least, .empty
Harindu Dilshan
@harindu95
Aug 09 2016 23:47
hey
can guys review my page ?
http://codepen.io/harindu95/pen/NAZKAY
Jason Luboff
@JLuboff
Aug 09 2016 23:55
@harindu95 Functionally speaking, works great. I would perhaps add some more color or Pop to it though. Make it stand out some