These are chat archives for FreeCodeCamp/HelpFrontEnd

21st
Jul 2016
Phil
@mremotoo
Jul 21 2016 00:11

http://codepen.io/mremoto/pen/mExOYR

--can't seem to put the buttons at the right side of the navigation bar. Pls help

Doomflake
@Doomflake
Jul 21 2016 00:19
Why not have your buttons in a list first, makes them easier to manage
Ken Haduch
@khaduch
Jul 21 2016 00:24
@mremotoo - if you use the navbar example from the Bootstrap website, there is a class that puts the buttons on the right...
John Doe
@codingisfun11
Jul 21 2016 00:27
blob
I thought everything was correct?
Rada
@Radascript
Jul 21 2016 00:43
@codingisfun11 you gotta make it start with a little T
Ken Haduch
@khaduch
Jul 21 2016 00:52
@codingisfun11 - yes, case sensitivity is important! Use the test information to help you figure out what's wrong. If the tests say titleCaseOverand you have TitleCaseOver - figure out what doesn't match. The tests are checking for literal information in the code that you provide - spelling, particular names, etc. The failures can help steer you in the right direction, with a little bit of analysis.
Justin Woodward
@jwoo92
Jul 21 2016 00:53
@codingisfun11 your vaiable can not start with a capitalized character.
Elizabeth Fine
@elizabethfinedev
Jul 21 2016 01:00
hey, can anyone please give me a clue on why my toggleClass function isnt working?
$("div").click(function() {
  $(this).toggleClass("itworked");
});
heres the css
div {
width: 100px;
height: 100px;
background-color: black;
};

.itworked  {
  border-radius: 15px;
  opacity: 0.5;
}
and the html
<body>
<div>
</div>
</body>
i click on the div box but its appearance doesnt change. I know the .click() expression works because I tested it with an "alert" instead of toggleClass and it works
Randy Goldsmith
@Dueldrawer8
Jul 21 2016 01:08
@BananaHavana do you have link to codepen?
Elizabeth Fine
@elizabethfinedev
Jul 21 2016 01:08
sure
here you go, thank you for having a look: http://codepen.io/bananahavana/pen/RRrbQa
thanks @Dueldrawer8
CamperBot
@camperbot
Jul 21 2016 01:09
bananahavana sends brownie points to @dueldrawer8 :sparkles: :thumbsup: :sparkles:
:cookie: 416 | @dueldrawer8 |http://www.freecodecamp.com/dueldrawer8
Randy Goldsmith
@Dueldrawer8
Jul 21 2016 01:14
hmm..sorry still looking your right the click event is working
Elizabeth Fine
@elizabethfinedev
Jul 21 2016 01:15
no worries :) its really bothering me cause its so simple...idk why that toggle class expression isnt working
Randy Goldsmith
@Dueldrawer8
Jul 21 2016 01:15
same here.. ill still have a go at it
it may have to do with divs
Nerando Johnson
@Nerajno
Jul 21 2016 01:17
anyone here
i need some help with something
Elizabeth Fine
@elizabethfinedev
Jul 21 2016 01:18
okay, thanks for looking at it @Dueldrawer8 :)
CamperBot
@camperbot
Jul 21 2016 01:18
bananahavana sends brownie points to @dueldrawer8 :sparkles: :thumbsup: :sparkles:
:warning: bananahavana already gave dueldrawer8 points
Elizabeth Fine
@elizabethfinedev
Jul 21 2016 01:18
what do you need help with @Nerajno
Randy Goldsmith
@Dueldrawer8
Jul 21 2016 01:20
@BananaHavana should try helpjavascript room
Elizabeth Fine
@elizabethfinedev
Jul 21 2016 01:20
okay i will @Dueldrawer8 thanks !
CamperBot
@camperbot
Jul 21 2016 01:20
bananahavana sends brownie points to @dueldrawer8 :sparkles: :thumbsup: :sparkles:
:warning: bananahavana already gave dueldrawer8 points
Nerando Johnson
@Nerajno
Jul 21 2016 01:26
hold gimme a bit i am trying to figure it out
Randy Goldsmith
@Dueldrawer8
Jul 21 2016 01:27
lol i wish i could figure it out..kinda annoying but i wanna know
Coy Sanders
@coymeetsworld
Jul 21 2016 01:30
@BananaHavana semicolon
at the end of your div style, try removing that
Ken Haduch
@khaduch
Jul 21 2016 01:32

@BananaHavana - that semicolon that you have after your div CSS rule is causing the problem. Remove that and it should work.

You can run a CSS analysis using the dropdown in the upper right corner of the CSS box in CodePen, "Analyze CSS". It flagged that problem.

Nerando Johnson
@Nerajno
Jul 21 2016 01:34
ok i am gonna describe what i need : i need a background with boxes inside like this ( http://blackrockdigital.github.io/startbootstrap-business-casual/) but i cant figure out the code to get the bacground to stick
Randy Goldsmith
@Dueldrawer8
Jul 21 2016 01:34
ah didnt even see that lol
Phil
@mremotoo
Jul 21 2016 01:40
why is my box-shadow, not working?
http://codepen.io/mremoto/pen/mExOYR
Ken Haduch
@khaduch
Jul 21 2016 01:42
@mremotoo - the browser dev tools claims that you have an invalid property value for box-shadow - no commas should be used, I think?
@mremotoo - there is a tool where you can run a CSS analysis using the dropdown in the upper right corner of the CSS box in CodePen, "Analyze CSS". It flagged that problem.
Phil
@mremotoo
Jul 21 2016 01:44
@khaduch hey, thanks!
CamperBot
@camperbot
Jul 21 2016 01:44
mremotoo sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1459 | @khaduch |http://www.freecodecamp.com/khaduch
Phil
@mremotoo
Jul 21 2016 02:04
how do I put an image from my computer to codepen, it doesn't seem to work?
Ken Haduch
@khaduch
Jul 21 2016 02:40
@mremotoo - you have to upload it to a place where you can access it via the web - with a URL http://www.imagelocation.com/mypicture.jpg or whatever. You can use dropbox (I've heard) or some site like http://postimg.org/. Note: As an example, you cannot use imgur - they don't allow it. Check with the sites terms and conditions.
Phil
@mremotoo
Jul 21 2016 02:45
thanks @khaduch
CamperBot
@camperbot
Jul 21 2016 02:45
mremotoo sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1462 | @khaduch |http://www.freecodecamp.com/khaduch
Luke
@lukenetti3
Jul 21 2016 03:06
Hey guys, I am trying to do the twitch.tv JSON API challenge and have a quick question. How do you differentiate from the offline and online. I was using these two json links and tried using stream == null and it wasn't working. Heres the link I was using for when it was offline (https://api.twitch.tv/kraken/streams/RobotCaleb). Heres the link for when it was online (https://api.twitch.tv/kraken/streams/ESL_SC2). Can anyone help me out?
Nany
@NanyR
Jul 21 2016 03:08
I'm stuck trying to get a twitter button with dynamic data-text message for my random quote machine.. I went to the dev.twitter.com for this but for some reason I can't get the twttr.widgets.load() callback to work. Does anyone know how to do this?
Manish Giri
@Manish-Giri
Jul 21 2016 03:09
@NanyR going through the actual twitter API isn’t really necessary, there are other ways to get around it

@lukenetti3 when you make a call to

https://api.twitch.tv/kraken/streams/RobotCaleb

you’ll get a complete streams object if the channel is online
and null if offline

Luke
@lukenetti3
Jul 21 2016 03:18
@Manish-Giri Okay so I know this is a bit messy, but what I'm trying to do is for the getOffline function I test for null with an if statement, then after that I try and get another json file to then use that to display the logo. Why am I having trouble with this? http://codepen.io/lukenetti3/pen/oLEmYK?editors=0010
Manish Giri
@Manish-Giri
Jul 21 2016 03:21

@lukenetti3 so, you know that offline channels will return you a null streams object, so there’s no real need of this

https://api.twitch.tv/kraken/streams/RobotCaleb

in function getOffline()

Luke
@lukenetti3
Jul 21 2016 03:22
@Manish-Giri How will I test for offline streams then if I don't use that to make the call and then look to see if its null or not?
Manish Giri
@Manish-Giri
Jul 21 2016 03:24
@lukenetti3 before you get to that, replace the if/else inside your $.ajax() with a ternary operator

@lukenetti3 as for your other question, replace the first call in your getOffline() function with this itself

            url: "https://api.twitch.tv/kraken/channels/" + userArr[j],

then you don’t need a check for

        if (data.stream == null) {

just have your code for offline channels in the success block

Luke
@lukenetti3
Jul 21 2016 03:27
@Manish-Giri I'm not sure what you mean by a ternary operator? So I put that url in my $.ajax() for my getOffline function. Why doesn't that need to test for null though?
@Manish-Giri Oh I think I see what you mean. So by doing that url call, it won't return success if it doesn't have a channel. But will that work for when I want to still list the offline channels
Manish Giri
@Manish-Giri
Jul 21 2016 03:29
@lukenetti3 because it wont return null even if the channel is offline? You’re using channels, not streams
Luke
@lukenetti3
Jul 21 2016 03:31
@Manish-Giri I see what your saying...but I want to collect the channels that are not success then for the getOffline function, correct?
Manish Giri
@Manish-Giri
Jul 21 2016 03:31

@lukenetti3 for instance

https://api.twitch.tv/kraken/channels/freecodecamp

will give you

{
mature: false,
status: "@Jackel twitch revamp day 4 #vuejs #programming #javascript #electron #vuex #vueresource ",
broadcaster_language: "en",
display_name: "FreeCodeCamp",
game: "Creative",
language: "en",
_id: 79776140,
name: "freecodecamp",
created_at: "2015-01-14T03:36:47Z",
updated_at: "2016-07-21T03:00:57Z",
delay: null,
logo: "https://static-cdn.jtvnw.net/jtv_user_pictures/freecodecamp-profile_image-d9514f2df0962329-300x300.png",
banner: null,
video_banner: "https://static-cdn.jtvnw.net/jtv_user_pictures/freecodecamp-channel_offline_image-b8e133c78cd51cb0-1920x1080.png",
background: null,
profile_banner: "https://static-cdn.jtvnw.net/jtv_user_pictures/freecodecamp-profile_banner-6f5e3445ff474aec-480.png",
profile_banner_background_color: null,
partner: false,
url: "https://www.twitch.tv/freecodecamp",
views: 156356,
followers: 9846,
_links: {
self: "https://api.twitch.tv/kraken/channels/freecodecamp",
follows: "https://api.twitch.tv/kraken/channels/freecodecamp/follows",
commercial: "https://api.twitch.tv/kraken/channels/freecodecamp/commercial",
stream_key: "https://api.twitch.tv/kraken/channels/freecodecamp/stream_key",
chat: "https://api.twitch.tv/kraken/chat/freecodecamp",
features: "https://api.twitch.tv/kraken/channels/freecodecamp/features",
subscriptions: "https://api.twitch.tv/kraken/channels/freecodecamp/subscriptions",
editors: "https://api.twitch.tv/kraken/channels/freecodecamp/editors",
teams: "https://api.twitch.tv/kraken/channels/freecodecamp/teams",
videos: "https://api.twitch.tv/kraken/channels/freecodecamp/videos"
}
}
@lukenetti3 so you want to have code for channels whose accounts are closed?
Luke
@lukenetti3
Jul 21 2016 03:33
@Manish-Giri Well I still want to collect the name and grab the logo for the accounts that are offline.
Manish Giri
@Manish-Giri
Jul 21 2016 03:34
@lukenetti3 you can do that in the success block for the getOffline function. Not sure what your question is exactly
@lukenetti3
function getOffline() {

  var $resultsSec = $("#results");

  var userArr = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"];

  var counter = 0;

  for (var j = 0; j < userArr.length; j++) {
    $.ajax({
      dataType: 'jsonp',
      url: "https://api.twitch.tv/kraken/channels/" + userArr[j],
      success: function(data) {

              $resultsSec.append("<img src=" + data1.logo + "><h5><strong>" + userArr[counter] + "</strong></h5>")

          })
        }
        //        else {

        //        }      
        counter++;

      }

    })

  }
}
William Cabell
@wbac88
Jul 21 2016 03:35
Hi guys, I was wondering if anyone could take a look at my weather Pen and tell me why the background is covering everything as it loads:
https://codepen.io/William-cabell/pen/WxkajL
Manish Giri
@Manish-Giri
Jul 21 2016 03:35
@lukenetti3 that is roughly what I meant, notwithstanding the } mismatches
Luke
@lukenetti3
Jul 21 2016 03:37
@Manish-Giri Okay I think I understand. But that will just append all the logos with the names correct? Not differentiating between offline and online?
Manish Giri
@Manish-Giri
Jul 21 2016 03:42
@lukenetti3 well yes, that’s the general intent. To differentiate, I would recommend you to style every block of result differently.
Luke
@lukenetti3
Jul 21 2016 03:44
@Manish-Giri I used that code like you said and it works great. But I still can't figure out how to differentiate online between offline. If I look at the json content, is there something that will tell me if its offline or online?
Manish Giri
@Manish-Giri
Jul 21 2016 03:45
@lukenetti3 I mean, the online channels would be styled differenrlt from offline ones, thereby allowing the user to figure out which ones are online and which ones aren’t.
For instance, for online channels you can get the status from the streams object, for offline channels, you just type in “Offline” manually
Luke
@lukenetti3
Jul 21 2016 03:46
@Manish-Giri Yeah I see what your saying...so I guess that was ultimately my question. To check for offline or online I would need to look at the streams object?
Manish Giri
@Manish-Giri
Jul 21 2016 03:48
@lukenetti3 yeah, start with streams, if it returns a null, then you have an offline channel, else an online one.
Also, it’s better to have just 1 function do all this, instead of 2, most of which would have the same code anyway
Luke
@lukenetti3
Jul 21 2016 03:49
@Manish-Giri Okay I see what your saying. I just figured later for the toggling with the buttons, I would need 2 separate functions.
@Manish-Giri Thanks for all the help!
CamperBot
@camperbot
Jul 21 2016 03:49
lukenetti3 sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 1473 | @manish-giri |http://www.freecodecamp.com/manish-giri
Manish Giri
@Manish-Giri
Jul 21 2016 03:49
@lukenetti3
  1. Check for streams
    a. If not null -> online channels -> code for online channels
    b. else -> offline channels
        i. Make call to channels
        ii. Code for offline channels
    c. if err -> account closed
@lukenetti3 this is the approach I followed for my twitch
fernando
@zaynsantiago
Jul 21 2016 03:51
hey so im working on the portfolio webpage and i was worndering how do you upload a picture so you can use it as the background or do i have to use img src with a url
Luke
@lukenetti3
Jul 21 2016 03:52
@Manish-Giri Thanks!
CamperBot
@camperbot
Jul 21 2016 03:52
lukenetti3 sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:warning: lukenetti3 already gave manish-giri points
William Cabell
@wbac88
Jul 21 2016 03:52
@zaynsantiago I believe you have to have the src with the URL
Manish Giri
@Manish-Giri
Jul 21 2016 03:53
@lukenetti3 cool!
@zaynsantiago you can save your picture on hosting sites and then use a link from them. My personal fav is Dropbox.
fernando
@zaynsantiago
Jul 21 2016 03:54
how would i go about doing that @Manish-Giri
Manish Giri
@Manish-Giri
Jul 21 2016 03:55
@zaynsantiago create a dropbox account if you don’t have one, upload your picture, click “Share”, that will get you the link for use in codepen
fernando
@zaynsantiago
Jul 21 2016 03:56
awesome thanks @Manish-Giri and you to @wbac88
CamperBot
@camperbot
Jul 21 2016 03:56
zaynsantiago sends brownie points to @manish-giri and @wbac88 :sparkles: :thumbsup: :sparkles:
:cookie: 277 | @wbac88 |http://www.freecodecamp.com/wbac88
:star2: 1474 | @manish-giri |http://www.freecodecamp.com/manish-giri
Manish Giri
@Manish-Giri
Jul 21 2016 04:10
@zaynsantiago welcome!
Elizabeth Fine
@elizabethfinedev
Jul 21 2016 04:27
@coymeetsworld @khaduch Hey guys, thank you SO MUCH. Sorry I had to leave for a bit but I came back and saw your messages. You fixed it and it works now!!! Thank you!!
CamperBot
@camperbot
Jul 21 2016 04:27
bananahavana sends brownie points to @coymeetsworld and @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1262 | @coymeetsworld |http://www.freecodecamp.com/coymeetsworld
:star2: 1463 | @khaduch |http://www.freecodecamp.com/khaduch
Faisal Zulfiqar
@faisal1337
Jul 21 2016 05:01
http://codepen.io/faisal1337/pen/ZOvgNR I get one or two spaces added to my quote when I tweet it. Any idea how does it happen?
Why does it happen?
Sorin Ruse
@sorinr
Jul 21 2016 05:10
@faisal1337 hi. let me look at it
Faisal Zulfiqar
@faisal1337
Jul 21 2016 05:11
@sorinr Thanks.
CamperBot
@camperbot
Jul 21 2016 05:11
faisal1337 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 515 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Jul 21 2016 05:15
@faisal1337 add this quote = quote.trim(); after quote =a[0].content;
Faisal Zulfiqar
@faisal1337
Jul 21 2016 05:19
Aye let me.
It is still coming.
No difference made.
It comes only when I'm tweeting it. Before that there's no space whatsoever
Sorin Ruse
@sorinr
Jul 21 2016 05:21
@faisal1337 but not all the time. just a sec
Faisal Zulfiqar
@faisal1337
Jul 21 2016 05:22
oki
Sorin Ruse
@sorinr
Jul 21 2016 05:32
@faisal1337 change quote = a[0].content to quote = $(a[0].content).text();
Giang Le
@gianghl1983
Jul 21 2016 05:32
My font Awesome not work: https://codepen.io/gianghl1983/full/GqQEKr/
. I embed in setting and code(end of page - About this page Made with and by me. ) : <i class="fa fa-coffee" aria-hidden="true"></i>, however the icon coffee did not show up. Please help!
Faisal Zulfiqar
@faisal1337
Jul 21 2016 05:37
@sorinr now it tweets "undefined". Check this line. $("#share-button").attr("href", 'https://twitter.com/intent/tweet?text=' + "\"" + $('#quote > p').html() + "\" - " + author); I am selecting the quote id which is a p tag and then selecting the p tag inside it. Actually the JSON data I get is something that there are <p> tags surrounding the a[0].contents. And if I directly save it then <p> tags get added.
Sorin Ruse
@sorinr
Jul 21 2016 05:38
@faisal1337 yeah. change also this: $('#quote > p').html() to $('#quote').html()
Faisal Zulfiqar
@faisal1337
Jul 21 2016 05:39
@gianghl1983 open the link again the link should have 'https' in the start while you have 'http' written.
Add the 's' and it should work.
@sorinr nope :( this is being tweeted --- "Accidents often produce the best solutions… only you can recognize the difference between an accident and your original intent. " - Jennifer Morla --
Giang Le
@gianghl1983
Jul 21 2016 05:40
@faisal1337 Thank you so much!
CamperBot
@camperbot
Jul 21 2016 05:40
gianghl1983 sends brownie points to @faisal1337 :sparkles: :thumbsup: :sparkles:
:cookie: 282 | @faisal1337 |http://www.freecodecamp.com/faisal1337
Sorin Ruse
@sorinr
Jul 21 2016 05:41
@faisal1337 so. what is the problem now ?
Faisal Zulfiqar
@faisal1337
Jul 21 2016 05:41
The spaces are still there. :/
@sorinr
Hey. I think I've got the problem.
Sorin Ruse
@sorinr
Jul 21 2016 05:42
@faisal1337 for me there are no spaces
Faisal Zulfiqar
@faisal1337
Jul 21 2016 05:44
@sorinr I accidently removed the quote = quote.trim();
I've added it back and yes finally there are no spaces at all.
@sorinr thanks a lot
CamperBot
@camperbot
Jul 21 2016 05:45
faisal1337 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: faisal1337 already gave sorinr points
Sorin Ruse
@sorinr
Jul 21 2016 05:45
@faisal1337 welcome. it was strange not to work
Faisal Zulfiqar
@faisal1337
Jul 21 2016 05:45
Here check this <p>By far the dominant reason for not releasing sooner was a reluctance to trade the dream of success for the reality of feedback. <\/p>
The spaces come with the JSON data.
I pasted the link in the address bar and checked.
Sorin Ruse
@sorinr
Jul 21 2016 05:46
@faisal1337 thats why i extracted only text without <p> tags and then trimmed it
Faisal Zulfiqar
@faisal1337
Jul 21 2016 05:47
So quote = $(a[0].content).text(); only extracts the text and not the html tags?
Sorin Ruse
@sorinr
Jul 21 2016 05:47
@faisal1337 yes
Faisal Zulfiqar
@faisal1337
Jul 21 2016 05:49
Wow. And one more thing. When I click the tweet button and come back to my page the twitter icon turns blue when cursor comes near it? What's this sorcery. I have this
a:visited {
  color: white;
}
But when I come back to the page and move my cursor near the icon. It turns blue :/
Well its fixed now :)
Sorin Ruse
@sorinr
Jul 21 2016 05:52
@faisal1337 ok
sm-programmer
@sm-programmer
Jul 21 2016 05:58
Hello there! I'm having lots of trouble with the Twitch project, regarding the JSONP requests. It seems they're being resolved too late, as no data is shown in the page, even though it is explicitly instructed to show the collected results. Chrome's network watcher actually tells me they're being resolved, so I suspect the way I collect the data is wrong. Here is the pen where I'm working on: pen. Thanks in advance for any feedback towards the solving of this issue! :smile:
Sorin Ruse
@sorinr
Jul 21 2016 06:03
@sm-programmer if you are calling it with ajax add async= false and .responseText; at the and of the function. take a look here:http://stackoverflow.com/questions/6685249/jquery-performing-synchronous-ajax-requests
@sm-programmer it will make your call sync so the foreach will wait for response
sm-programmer
@sm-programmer
Jul 21 2016 06:06
@sorinr I'll check it right away, and come back to you if something happens. I was using $.getJSON as suggested, but also experimented a bit with $.ajax
Sorin Ruse
@sorinr
Jul 21 2016 06:11
@sm-programmer $.getJSON makes calls only async there is no option like async=false. you should use $.ajax calls
sm-programmer
@sm-programmer
Jul 21 2016 06:12
@sorinr I'll check it. I'm changing the code right now.
Luca
@Pari910
Jul 21 2016 06:17
hi everyone. I'm developping the portfolio project and i have a problem. I want to change the active menu item when i scroll the page. Can anyone help me find a solution? Thanks :smile:
Kenny Huynh
@kennyhuynh125
Jul 21 2016 06:20
Hey guys, I'm on the random quote machine project and I am having trouble figuring out how to design the website. I want to create a table similar to the one in the example. Can anyone help me find a website/solution on how to do this? thanks!
Luca
@Pari910
Jul 21 2016 06:21
@kirbyedy thanks :smile: That's exactly the answer I was looking for. :smile:
CamperBot
@camperbot
Jul 21 2016 06:21
pari910 sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1259 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Faisal Zulfiqar
@faisal1337
Jul 21 2016 06:22
@sorinr its complete but https://s.codepen.io/faisal1337/debug/ZOvgNR now the quotes are not being displayed Strange
I'm worried.
Sorin Ruse
@sorinr
Jul 21 2016 06:23
Faisal Zulfiqar
@faisal1337
Jul 21 2016 06:23
It started working. What sorcery is this :/
So on https it won't work because of that '&_jsonp'
paulnahal
@paulnahal
Jul 21 2016 06:25
Hey! I want to set up a local wordpress dev environment and im running windows. I don't have two machines. Should I just use WAMP and move on or should I look into learning vagrant, or virtual box linux w/ lamp?
Sorin Ruse
@sorinr
Jul 21 2016 06:25
@faisal1337 its because cors problems if you want it to work on https you should add https://crossorigin.me/ in front of your urls
Faisal Zulfiqar
@faisal1337
Jul 21 2016 06:25
I don't know much. But I think by default browsers send 'https:' request no? If yes then they won't see stuff/
Aye.
sm-programmer
@sm-programmer
Jul 21 2016 06:27
@sorinr After making both AJAX requests synchronous, the data is finally showing, but incomplete. :worried: No info apart from the channel name is shown.
Sorin Ruse
@sorinr
Jul 21 2016 06:31
@sm-programmer you forgot to add .responseText; at the and of each ajax calls: http://stackoverflow.com/questions/6685249/jquery-performing-synchronous-ajax-requests
buiphuking
@buiphuking
Jul 21 2016 06:37
anyone has simon game flowchart plz share with me?
Sorin Ruse
@sorinr
Jul 21 2016 06:38
@sm-programmer also take care where you define your vars like chSS ecc
sm-programmer
@sm-programmer
Jul 21 2016 06:39
@sorinr I'll check that. I'm renaming them to be clearer. Let me check what happens if I store the results in an array instead of using them directly.
sm-programmer
@sm-programmer
Jul 21 2016 06:45
@sorinr I see here that also making all the requests at the same time could work. Do you think I can use that? (I've read that async=false is deprecated: hence my proposal.)
Sorin Ruse
@sorinr
Jul 21 2016 06:47
@sm-programmer you can try do that way
sm-programmer
@sm-programmer
Jul 21 2016 06:48
@sorinr I'll see if it works. I'm not sure why it does not work: I've done the Wikipedia one, and that works correctly :worried:
Faisal Zulfiqar
@faisal1337
Jul 21 2016 07:06
I was calling api.openweathermap.org/data/2.5/weather?lat={lat}&lon={lon} with values in the place of parameters and I get "401 Authorization Required"
What's that ?
Greg Duncan
@GregatGit
Jul 21 2016 07:08
@faisal1337 you need a key
Faisal Zulfiqar
@faisal1337
Jul 21 2016 07:08
@GregatGit tell me more.
What key?
Greg Duncan
@GregatGit
Jul 21 2016 07:09
@faisal1337 you have to register at open weather (free) to get a key
@faisal1337 &appid=
Faisal Zulfiqar
@faisal1337
Jul 21 2016 07:10
Oh. Okay. let me.
@GregatGit now I should add the '&appid=theKeyIGot' to the url?
Greg Duncan
@GregatGit
Jul 21 2016 07:12
yes
Faisal Zulfiqar
@faisal1337
Jul 21 2016 07:13
@GregatGit the key should be kept private? :/
And here's the url I'm calling http://api.openweathermap.org/data/2.5/weather?lat={35}&lon={71}?&appid=thekeyIgot But still gettin that error
Greg Duncan
@GregatGit
Jul 21 2016 07:14
@faisal1337 are you doing this in code pen?
Faisal Zulfiqar
@faisal1337
Jul 21 2016 07:15
Yes.
Everyone does this in code pen no?
No wait.
I was just calling the url by placing it in the address bar.
@GregatGit what seems to be the problem if I call it from the address bar?
Greg Duncan
@GregatGit
Jul 21 2016 07:18
@faisal1337 http://api.openweathermap.org/data/2.5/weather?lat=-27.5667&lon=153.1333&units=metric&appid=
try that with your key
Faisal Zulfiqar
@faisal1337
Jul 21 2016 07:19
@GregatGit thanks. Works !!
CamperBot
@camperbot
Jul 21 2016 07:19
faisal1337 sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 702 | @gregatgit |http://www.freecodecamp.com/gregatgit
Greg Duncan
@GregatGit
Jul 21 2016 07:20
@faisal1337 :+1:
sm-programmer
@sm-programmer
Jul 21 2016 07:28
@sorinr I've finally come up with a solution :smile: Feel free to check it out! I realised I had to make the processing inside the ajax call so that once all the entries are processed, only then I could show them to the user. See the pen.
@sorinr Thank you for your help :smile: I needed guidance.
CamperBot
@camperbot
Jul 21 2016 07:28
sm-programmer sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 516 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Jul 21 2016 07:29
@sm-programmer welcome
Faisal Zulfiqar
@faisal1337
Jul 21 2016 07:31
I want the text in #location class to change with the location.
What am I doing wrong. I think the api call is not working. Because I've placed the variables in the place of parameters. Maybe.
buiphuking
@buiphuking
Jul 21 2016 07:32
anyone who understand this, plz explain me
http://creately.com/diagram/example/hcta41g91/the%20simon%20game
kirbyedy
@kirbyedy
Jul 21 2016 07:35
@faisal1337 I am using chrome which does not let use geolocation anymore, but I noticed this in your code
$.getJSON("//api.
you are missing http:
also this: weather?lat={latitude}&
Faisal Zulfiqar
@faisal1337
Jul 21 2016 07:37
Well um that shouldn't be a problem. http or https will get added by default based on how the browser tries to access it.
kirbyedy
@kirbyedy
Jul 21 2016 07:37
this latitude should be loaded from your previous line:
var latitude = position.coords.latitude;
@faisal1337 not really
Faisal Zulfiqar
@faisal1337
Jul 21 2016 07:37
Don't know much.
Alejandro
@alejandroariasag
Jul 21 2016 07:38
Hi guys! I am stuck in 'Build a Personal Portfolio Webpage' There is no way for me to change the background color of a bootstrap nav. I've tried everything :-(
Faisal Zulfiqar
@faisal1337
Jul 21 2016 07:38

@kirbyedy someone answered to my query on SO "instead of using http://x.com or https://x.com use //x.com ... a http page will use http, a https page will use https

in other words, the page will use the same protocol for requests that the page is loaded with (http vs https)"

kirbyedy
@kirbyedy
Jul 21 2016 07:39
@faisal1337 I think that depends from the api you are using
Faisal Zulfiqar
@faisal1337
Jul 21 2016 07:39
:/ and @kirbyedy weather?lat={latitude}& I just want to place the latitude variable I created above
kirbyedy
@kirbyedy
Jul 21 2016 07:39
not that way
Faisal Zulfiqar
@faisal1337
Jul 21 2016 07:40
Then how? Please guide me.
@alejandroariasag show your pen.
kirbyedy
@kirbyedy
Jul 21 2016 07:40
weather?lat=" + latitude + "&
Faisal Zulfiqar
@faisal1337
Jul 21 2016 07:42
Aye.
lemme change
the code
if (navigator.geolocation) {
  navigator.geolocation.getCurrentPosition(function(position) {
    var latitude = position.coords.latitude;
    var longitude = position.coords.longitude;
    $.getJSON("//api.openweathermap.org/data/2.5/weather?lat={" + latitude + "}&lon={" + longitude + "}&units=metric&appid=b0138afdc7117a8dc76b3a0068de17ab", function(a) {

      var location = a[9].name;
      console.log(location);
      $("#location").html(location);
    });
  });
}
Faisal Zulfiqar
@faisal1337
Jul 21 2016 07:48
@kirbyedy check this. Still not working .
kirbyedy
@kirbyedy
Jul 21 2016 07:49
you still did not add http:
Sorin Ruse
@sorinr
Jul 21 2016 07:49
@faisal1337 not $.getJSON("//api but $.getJSON("http://api as @kirbyedy tells u
kirbyedy
@kirbyedy
Jul 21 2016 07:49
and I did not put { } in the code
remove those
Faisal Zulfiqar
@faisal1337
Jul 21 2016 07:53
Waity.
vaibhav sharma
@vaibsharma
Jul 21 2016 07:55
Hello everyone ! Will somebody can help in guiding what to read and what things should I know before staring with the wikipedia viewer project . Considering I have done whether app and random -quote project .
*starting
Faisal Zulfiqar
@faisal1337
Jul 21 2016 07:56
@sorinr @kirbyedy still nothing.
I get this warning also.
getCurrentPosition() and watchPosition() are deprecated 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.
if (navigator.geolocation) {
  navigator.geolocation.getCurrentPosition(function(position) {
    var latitude = position.coords.latitude;
    var longitude = position.coords.longitude;
    $.getJSON("http://api.openweathermap.org/data/2.5/weather?lat=" + latitude + "&lon=" + longitude + "&units=metric&appid=b0138afdc7117a8dc76b3a0068de17ab", function(a) {

      var location = a.name;
      $("#location").html(location);
    });
  });
}
Sorin Ruse
@sorinr
Jul 21 2016 07:57
@faisal1337 then make it $.getJSON("https://crossorigin.me/http://api.openweathermap.org
Faisal Zulfiqar
@faisal1337
Jul 21 2016 07:58
kirbyedy
@kirbyedy
Jul 21 2016 07:59
I dont think that will work in chrome
at least it wont work for me
it will work in firefox dough
Faisal Zulfiqar
@faisal1337
Jul 21 2016 08:00
Um, what should I do? Download firefox?
kirbyedy
@kirbyedy
Jul 21 2016 08:02
well you might try using ip location instead, or different weather api like wunderground which gives you latitude and longitude of the user
Faisal Zulfiqar
@faisal1337
Jul 21 2016 08:04
Umhm. Lets see.
Sorin Ruse
@sorinr
Jul 21 2016 08:05
@faisal1337 first add jquery to your pen. then call your pen over https like https://codepen.io/faisal1337/pen/oLqZzE
kirbyedy
@kirbyedy
Jul 21 2016 08:06
for some reason even mine does not work with geocoding today :S
Faisal Zulfiqar
@faisal1337
Jul 21 2016 08:08
@sorinr when I clicked run pen here in this chat room chrome asked to turn the location on.
kirbyedy
@kirbyedy
Jul 21 2016 08:08
PositionError {code: 1, message: "Only secure origins are allowed (see: https://goo.gl/Y0ZkNV)."} wtf
Faisal Zulfiqar
@faisal1337
Jul 21 2016 08:08
But the samething wont ask to turn the location on when in editor.
Sorin Ruse
@sorinr
Jul 21 2016 08:11
@faisal1337 click the link not run pen
Faisal Zulfiqar
@faisal1337
Jul 21 2016 08:11
I did both.
But when I click run pen. The browser asks to turn the location on .
Just telling
Someone in the other chatroom said that he was having the same problem and he now uses this api :http://ip-api.com/json
I think I should use this one too.
Sorin Ruse
@sorinr
Jul 21 2016 08:13
@faisal1337 have you added jquery?
kirbyedy
@kirbyedy
Jul 21 2016 08:13
I have used that on my other pen and it was working for me, but it was not very accurate
Faisal Zulfiqar
@faisal1337
Jul 21 2016 08:13
@sorinr what jquery?
Sorin Ruse
@sorinr
Jul 21 2016 08:14
@faisal1337 go to settings of your pen. click js tab and pick from the list below jquery. its first option
Faisal Zulfiqar
@faisal1337
Jul 21 2016 08:14
Oh that.
Let me.
Um Just did that.
No difference.
kirbyedy
@kirbyedy
Jul 21 2016 08:16
is this working for you people ?
Faisal Zulfiqar
@faisal1337
Jul 21 2016 08:18
Getting this warning.
getCurrentPosition() and watchPosition() are deprecated on insecure origins
Sorin Ruse
@sorinr
Jul 21 2016 08:19
@kirbyedy for me its reporting in console the lat and lon
kirbyedy
@kirbyedy
Jul 21 2016 08:19
omg
it was for me yesterday as well
but not today
very frustrating
Sorin Ruse
@sorinr
Jul 21 2016 08:19
@kirbyedy but when i run the pen over https not http :)
The-Seth
@The-Seth
Jul 21 2016 08:20
can someone please help me figure out why this is not working? I need help for the lines 20,21,22 in JS. http://codepen.io/The-Seth/pen/Lkdjqg
kirbyedy
@kirbyedy
Jul 21 2016 08:20
@sorinr how about this ?
oh crap
so its a codepen issue then
Sorin Ruse
@sorinr
Jul 21 2016 08:21
@kirbyedy you try this way: https://codepen.io/kirbyedy/pen/vKWjAN
kirbyedy
@kirbyedy
Jul 21 2016 08:22
omg
what a stupidity :D
ty @sorinr that saved me from smashing this computer
CamperBot
@camperbot
Jul 21 2016 08:23
kirbyedy sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 517 | @sorinr |http://www.freecodecamp.com/sorinr
Faisal Zulfiqar
@faisal1337
Jul 21 2016 08:23
The last pen works.
How?
Please guide me also.
Alain
@apjunior770
Jul 21 2016 08:23
hello
is this room for advanced help?
Phil
@mremotoo
Jul 21 2016 08:25

how do i fill the whole div with the background color? It seems just coloring a block?

http://codepen.io/mremoto/pen/NAYjRd

Sorin Ruse
@sorinr
Jul 21 2016 08:25
@faisal1337 its because if you run your codepen like http://codepen.io/yourusername/pen/penname and you are calling inside js https url its not working due to cross origin problems but when you run same pen over https its working
Faisal Zulfiqar
@faisal1337
Jul 21 2016 08:26
Strange. :o
kirbyedy
@kirbyedy
Jul 21 2016 08:28
@mremotoo make your container 100% width
wait is that the question ?
or you want the whole body to be the same colour ?
Faisal Zulfiqar
@faisal1337
Jul 21 2016 08:33
@kirbyedy would it be a problem if I get the latitude and longitude the way you're doing?
kirbyedy
@kirbyedy
Jul 21 2016 08:34
not really
I did not invented that :D
The-Seth
@The-Seth
Jul 21 2016 08:34
Hi guys, need a little help. Can someone please help me figure out why this is not working? I need help for the lines 20,21,22 in JS. I am trying to add a <p> tag with some text but it is not showing up in my page. to check, please enter 6 in the text box and click Submit. Thank you! http://codepen.io/The-Seth/pen/Lkdjqg
kirbyedy
@kirbyedy
Jul 21 2016 08:35
actually I saw that in the @sorinr code if I remember well
Promise Tochi
@Promhize
Jul 21 2016 08:35
guys, check out my wikipedia viewer, super proud of this. http://codepen.io/Promhize/full/zBWkLP/
Faisal Zulfiqar
@faisal1337
Jul 21 2016 08:35
@sorinr can I?
kirbyedy
@kirbyedy
Jul 21 2016 08:35
@faisal1337 and this is the link I gave you before, its described in this article
Sorin Ruse
@sorinr
Jul 21 2016 08:36
@faisal1337 what are u asking for?
Faisal Zulfiqar
@faisal1337
Jul 21 2016 08:37
Copy the latitude longitude finding thingy
:D
Sorin Ruse
@sorinr
Jul 21 2016 08:37
@faisal1337 if its about getting the coordinates go on its public code
Faisal Zulfiqar
@faisal1337
Jul 21 2016 08:37
yeah the coordinates
@kirbyedy so briefly this googlegeoapi gets the latitude and longitude and does what?
kirbyedy
@kirbyedy
Jul 21 2016 08:38
gets the user location
Faisal Zulfiqar
@faisal1337
Jul 21 2016 08:39
Alright.
kirbyedy
@kirbyedy
Jul 21 2016 08:39
then you pass those latitude and longitude to the weather api, and you get the response from it... the actual weather for that specific location
Sorin Ruse
@sorinr
Jul 21 2016 08:39
@faisal1337 actually i'm using that google api not to retrieve the coordinates (these are coming from navigator) but to retrieve the location name like (city, country, street, ecc) based on lat and lon
Faisal Zulfiqar
@faisal1337
Jul 21 2016 08:40
I understand. so this if (navigator.geolocation) { the code inside is going to execute when navigator.geolocation == true
now what does navigator.geolocation being true means?
Does it mean that its working?
Sorin Ruse
@sorinr
Jul 21 2016 08:42
@faisal1337 yes. if you don't allow your browser to show your location it will not work. at least its a user privacy option. its up to him/her
kirbyedy
@kirbyedy
Jul 21 2016 08:43
as long as you use https:// for your codepen link :satisfied:
Sorin Ruse
@sorinr
Jul 21 2016 08:46
@kirbyedy yep. i have a sign here on my wall that says "smashing head place". i've used it a lot of times :)
kirbyedy
@kirbyedy
Jul 21 2016 08:59
:D
Muhammad Hasham
@MohammadHasham
Jul 21 2016 09:00
@MohammadHasham
can anyone help me with my codepen for Javascript!
http://codepen.io/Mohammad_Hasham/pen/QEQzjw
Faisal Zulfiqar
@faisal1337
Jul 21 2016 09:09
check this
I am getting the location now.
Works on your side or not? Tell me. I am using the same method.
kirbyedy
@kirbyedy
Jul 21 2016 09:11
:thumbsup:
Sorin Ruse
@sorinr
Jul 21 2016 09:12
@faisal1337 yes. its working
Dany Din
@danydin
Jul 21 2016 09:15
hey guys
what's exactly the purpose of col-sm-offset-*? I know the purpose of col without the offset. but with no idea. thanks guys!
Sorin Ruse
@sorinr
Jul 21 2016 09:18
@danydin if you have for example a row and you want to place a column in the middle of screen you can use <div class="col-md-6 col-md-offset-3"> that will add 3 empty cols before col-md-6 and 3 after and that will make a full row
Faisal Zulfiqar
@faisal1337
Jul 21 2016 09:20
@sorinr your pen has an immense amount of JS code in it. When I finish the project, I sure will have little code. Does that make my project less robust?
kat-mag
@kat-mag
Jul 21 2016 09:20
@MohammadHasham U're mixing up strings with calculations at the end of your JS, it won't get processed the way you want. And don't do inline styles if you don't have to ^^ Aaaand just btw... If you do <div class="whatever">, don't put spaces in between class, eq sign and "". Looks not so good and nobody types like that
Sorin Ruse
@sorinr
Jul 21 2016 09:22
@faisal1337 are you talinkg about twitch app?
Faisal Zulfiqar
@faisal1337
Jul 21 2016 09:22
@sorinr this weather app
the pen I think @kirbyedy shared
Muhammad Hasham
@MohammadHasham
Jul 21 2016 09:22
@kat-mag so how can i compute then
The-Seth
@The-Seth
Jul 21 2016 09:22
Hi guys, need a little help again. Can someone please help me figure out why this is not working? It seesm whenever I click submit, my guesses variable gets reset to 1. How do I prevent that from happening? Thank you! http://codepen.io/The-Seth/pen/Lkdjqg
Faisal Zulfiqar
@faisal1337
Jul 21 2016 09:23
@sorinr he said that you used the method he had in that pen
kirbyedy
@kirbyedy
Jul 21 2016 09:23
@faisal1337 that pen of mine is just a playground
my project is actually this one: https://s.codepen.io/kirbyedy/debug/zBBXGW
Faisal Zulfiqar
@faisal1337
Jul 21 2016 09:24
Its not a good thing. Because my code will be less functional. And also that I don't even understand that code fully
@kirbyedy holy mother of beautiful JS :o
Muhammad Hasham
@MohammadHasham
Jul 21 2016 09:24
@faisal1337 same here
Faisal Zulfiqar
@faisal1337
Jul 21 2016 09:24
@kirbyedy looks beautifuuul!!!
kirbyedy
@kirbyedy
Jul 21 2016 09:24
@faisal1337 ty
CamperBot
@camperbot
Jul 21 2016 09:24
kirbyedy sends brownie points to @faisal1337 :sparkles: :thumbsup: :sparkles:
:cookie: 283 | @faisal1337 |http://www.freecodecamp.com/faisal1337
Faisal Zulfiqar
@faisal1337
Jul 21 2016 09:25
So does it matter if I have short code? Like with not so many checks?
kirbyedy
@kirbyedy
Jul 21 2016 09:25
no
Faisal Zulfiqar
@faisal1337
Jul 21 2016 09:25
Because I don't know much JS.
kirbyedy
@kirbyedy
Jul 21 2016 09:26
I did all this, just because I wanted to practice
and learn
Dany Din
@danydin
Jul 21 2016 09:26
@sorinr hey so it will always fill the row to full from both size?
Faisal Zulfiqar
@faisal1337
Jul 21 2016 09:27
@kirbyedy did you read books of JS?
kirbyedy
@kirbyedy
Jul 21 2016 09:27
some of them yes
but mainly searching the internet for solving the specific problems
watched some tutorials as well
Dany Din
@danydin
Jul 21 2016 09:27
@kirbyedy what's exactly the purpose of col-sm-offset-*? I know the purpose of col without the offset. but with no idea.
Sorin Ruse
@sorinr
Jul 21 2016 09:28
@danydin you can play with md sm xs as you wish. depends on how do you want it looks both on mobile and desktop
Dany Din
@danydin
Jul 21 2016 09:28
ya but i dont get really the purpose of it yet honestly @sorinr
if you want center you can use text-center
or pull-center :)
Faisal Zulfiqar
@faisal1337
Jul 21 2016 09:28
@kirbyedy how did you made that box? JS?
Sorin Ruse
@sorinr
Jul 21 2016 09:28
@danydin play with it to understand. give different values
Dany Din
@danydin
Jul 21 2016 09:29
ya good idea
and ill put borders to see the difernce
kirbyedy
@kirbyedy
Jul 21 2016 09:29
@faisal1337 no thats html and css
Dany Din
@danydin
Jul 21 2016 09:29
@sorinr thanks tho
CamperBot
@camperbot
Jul 21 2016 09:29
danydin sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 518 | @sorinr |http://www.freecodecamp.com/sorinr
Faisal Zulfiqar
@faisal1337
Jul 21 2016 09:29
Any specific tuts to style like that?
And also please tell me the source from where you got that nice background.
Dany Din
@danydin
Jul 21 2016 09:30
@faisal1337 style like what give link please
kirbyedy
@kirbyedy
Jul 21 2016 09:30
@faisal1337 I made it
Dany Din
@danydin
Jul 21 2016 09:31
show me ..
kirbyedy
@kirbyedy
Jul 21 2016 09:31
thats photoshop
Faisal Zulfiqar
@faisal1337
Jul 21 2016 09:31
magnificent work :+1:
kirbyedy
@kirbyedy
Jul 21 2016 09:32
you can use gradient generator for the background for example, like this
Dany Din
@danydin
Jul 21 2016 09:32
@faisal1337 wow
i like it becasue al the others
force me to approve some things
this is get it auto
and the design is also great
Faisal Zulfiqar
@faisal1337
Jul 21 2016 09:33
improve yeah.
@kirbyedy I will use it.
kirbyedy
@kirbyedy
Jul 21 2016 09:36
its easy to use that site, just play with colours
Faisal Zulfiqar
@faisal1337
Jul 21 2016 09:39
@kirbyedy looks good.Here I don't even know how to use the gradient tool.
:D
Like this:
background: linear-gradient(135deg, #45484d 0%,#000000 100%);
Dan Stockham
@DanStockham
Jul 21 2016 09:41
hey all
Faisal Zulfiqar
@faisal1337
Jul 21 2016 09:41
It has a blind like effect.
Not smooth.
@DanStockham welcome
Sorin Ruse
@sorinr
Jul 21 2016 09:47
@kirbyedy btw. if i want to color partially the background of a cell like 60%green 40%white. what would be the best way to do it?
Muhammad Hasham
@MohammadHasham
Jul 21 2016 09:57
anyone for JS stuff?
J Sanderson
@J-Sanderson
Jul 21 2016 10:00
this pomodoro clock is driving me mad, hah. I can get it to count down until the end of the work session but not go on to break or keep looping until the user clicks stop. got a really rudimentary thing here... https://codepen.io/jsanderson/pen/KMWXBX
(don't mind the timer display, I'll fix it up with something more readable when the guts are done... it's still pretty raw)
I guess I'm just having one of those moments where I know what has to be done but not so much how.
kirbyedy
@kirbyedy
Jul 21 2016 10:04
@sorinr maybe with a gradient
brb
Chris Wilson
@blockbeard
Jul 21 2016 10:05

I'm working on the tic tac toe game, but I'm having an issue with one of my functions:

function evaluateRow(first, second, third) {
    var arrayToEval = [[humanMoves[first], humanMoves[second], humanMoves[third]], [compMoves[first], compMoves[second], compMoves[third]]],
        evaluated = [arrayToEval[0].reduce(add, 0), arrayToEval[1].reduce(add, 0)],
        evaluatedArr = [];
console.log("evaluate row fired");
    console.log("array to eval = " + arrayToEval);
    console.log("evaluated = " + evaluated);
    function add(a, b) {
        return a + b;
    }

    if (evaluated == [0, 2]) {
        evaluatedArr.push([5, arrayToEval[1].indexOf(0)]);
        console.log("if for [0, 2] fired pushing" + arrayToEval[1].indexOf(0));
    }
    else if (evaluated == [2, 0]) {
        evaluatedArr.push([4, arrayToEval[0].indexOf(0)]);
        console.log("if for [2, 0] fired pushing" + arrayToEval[0].indexOf(0));
    }
    else if (evaluated == [0, 1]) {
        evaluatedArr.push([3, arrayToEval[1].indexOf(0)], [1, arrayToEval[1].lastIndexOf(0)]);
        console.log("if for [0, 1] fired pushing" + [3, arrayToEval[1].indexOf(0)], [1, arrayToEval[1].lastIndexOf(0)]);
    }
    else if (evaluated == [0, 0]) {
        evaluatedArr.push([2, second]);
        console.log("if for [0, 0] fired pushing" + [2, second]);
    }
    else if (evaluated == [1, 0]) {
        console.log("if for [1, 0] fired pushing" + [1, arrayToEval[1].indexOf(0)], [1, arrayToEval[1].lastIndexOf(0)]);
        evaluatedArr.push([1, arrayToEval[1].indexOf(0)], [1, arrayToEval[1].lastIndexOf(0)]);
        console.log("if for [1, 0] fired pushing" + [1, arrayToEval[1].indexOf(0)], [1, arrayToEval[1].lastIndexOf(0)]);
    }
    else if (evaluated == [1, 1]) {
        evaluatedArr.push([0, arrayToEval[1].indexOf(0)]);
        console.log("if for [1, 1] fired pushing" + arrayToEval[1].indexOf(0));
    }
    else{
        console.log("no ifs fired");
    }
    console.log("evaluatedArr = " + evaluatedArr);
    return evaluatedArr;


}

It doesn't seem to matter what the evaluated variable comes out as it won't trigger any of the if/else if. Can anyone see anything obvious I'm doing wrong?

jpandd
@jpandd
Jul 21 2016 10:14
Hi Guys, trying to walkthrough tribute page following Quincy's code just to get my feet wet. However, I can't reduce the size of my timeline (ul) as Quincy seems to have without CS?
http://codepen.io/jpandd/pen/EybmoV?editors=1100
nive29
@nive29
Jul 21 2016 10:51
http://codepen.io/nive29/full/dXpBeJ/
the bottom of the search result is cut off. Can anyone tell why?
kirbyedy
@kirbyedy
Jul 21 2016 10:54
@sorinr http://codepen.io/kirbyedy/pen/RRrLJA maybe like this ?
it is a bit visible dough, so maybe to make two separate divs then
Muhammad Hasham
@MohammadHasham
Jul 21 2016 11:05
can anyone help me with my button toggle
Muhammad Hasham
@MohammadHasham
Jul 21 2016 11:16
toggle button not working properly? sort of JS issue can anyone help me out?
Dany Din
@danydin
Jul 21 2016 11:37
hey, in css when you u use :after it will show just when the button is on it like hover? whats the differnce
Pete
@petegarvin1
Jul 21 2016 11:37
anyone looking to hone their javascript skills i can highly recommend codewars... it's very addictive!! www.codewars.com/r/yfzYFQ
Dany Din
@danydin
Jul 21 2016 11:37
@MohammadHasham share code
@petegarvin1 ty for sharing
CamperBot
@camperbot
Jul 21 2016 11:38
danydin sends brownie points to @petegarvin1 :sparkles: :thumbsup: :sparkles:
:cookie: 430 | @petegarvin1 |http://www.freecodecamp.com/petegarvin1
Dany Din
@danydin
Jul 21 2016 11:38
@petegarvin1 what level is it for there?
Pete
@petegarvin1
Jul 21 2016 11:39
@danydin it caters to most levels, thousands of challenges, right from 'multiply x by y' upwards
takes a little getting used to at first, but once you've done a couple you'll never look back
seriously... i just finished my 433rd... maybe i need a life!
Dany Din
@danydin
Jul 21 2016 11:39
ya i tried now looks really good honestly :smile:
haha ur pro
if you stuck how you find a soution tho
John Doe
@codingisfun11
Jul 21 2016 11:40
blob
what did I do wrong?
Pete
@petegarvin1
Jul 21 2016 11:40
@danydin you can ask questions on the challenges, some people are responsive... others not
@danydin google is my friend :D
Stephen James
@sjames1958gm
Jul 21 2016 11:42
@codingisfun11 Need help?
Dany Din
@danydin
Jul 21 2016 11:42
@petegarvin1 ya but its hard to find a name for the questino sometimes ::D
@sjames1958gm whats :after used for is it like hover less or more?
Pete
@petegarvin1
Jul 21 2016 11:43
@danydin true. You can always unlock the solution and learn from it
J Sanderson
@J-Sanderson
Jul 21 2016 11:43
@codingisfun11 you shouldn't need to use the =, note the example on the side.
Stephen James
@sjames1958gm
Jul 21 2016 11:43
@danydin I have seen that - have not done the research - I see that a lot with bootstrap stuff
@codingisfun11 See the code on the left where i = i + 1 is replaced by i++ - the same can be done for myVar = myVar + 1
Dany Din
@danydin
Jul 21 2016 11:44
yes true im really suck at such a questions i really need to train on this site! :
@sjames1958gm i see you should come here a bit more tho :smile:
and leave js
Stephen James
@sjames1958gm
Jul 21 2016 11:44
lol
Ken Haduch
@khaduch
Jul 21 2016 11:47

@nive29 - I don't know the reason wh this is set up this way, but in Bootstrap, there is a CSS rule that is affecting your last item in the list:

.list-group-item:last-child {
    margin-bottom: 0;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
}

I think that they are just styling the first item and last item in the .list-group-item list, probably all of the intermediate items do not have any border radius. So you are just running into that in your use of that class.

Sorin Ruse
@sorinr
Jul 21 2016 11:49
@kirbyedy its ok like that. i need it for setting the background of a table cell based on its value only i will change it for horizontal. thank you
CamperBot
@camperbot
Jul 21 2016 11:49
sorinr sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1262 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
J Sanderson
@J-Sanderson
Jul 21 2016 11:53
aha I think I have something on this pomodoro, another raw version, this time decrements a counter every second rather than using dates. Not how I'd seen everyone else do it though so dunno how legit it is. Seems to work though? Gotta make it pretty still. https://codepen.io/jsanderson/pen/qNoXZJ
Stephen James
@sjames1958gm
Jul 21 2016 11:54
@rustydragonfly Counting down seconds seems to be the most logical to me, it is what I did so seems legit to me.
Pete
@petegarvin1
Jul 21 2016 12:04
@rustydragonfly thats the way i did it too. As long as it's timed right then i think its legit :D
the doer
@ewathedoer
Jul 21 2016 12:12
I’m currently working on date format in history, but besides that what do you think about my pomodoro? http://theonewhodo.es/pomodoro/ Any suggestions more than welcomed :)
Shivam Mehta
@shivam13
Jul 21 2016 12:34
can any one tell me how to make design that looks same in mobile as well pc?
kirbyedy
@kirbyedy
Jul 21 2016 12:42
look into bootstrap
Shivam Mehta
@shivam13
Jul 21 2016 12:48
i used bootstrap but it not make the elements responsive @kirbyedy
Shivam Mehta
@shivam13
Jul 21 2016 12:55
i cant get the all information of all channel i only get one channels information i cant understand why it happens???
kirbyedy
@kirbyedy
Jul 21 2016 13:02
@shivam13 first you load the jquery then bootstrap
Shivam Mehta
@shivam13
Jul 21 2016 13:02
ok
kirbyedy
@kirbyedy
Jul 21 2016 13:03
its ok up till 768px
then it falls apart
then you should add some media queries yourself and you are done
Shivam Mehta
@shivam13
Jul 21 2016 13:05
can you help me in twitch tv app @kirbyedy
kirbyedy
@kirbyedy
Jul 21 2016 13:06
also bootstrap is a 12 column grid system, I dont think you followed it properly
Shivam Mehta
@shivam13
Jul 21 2016 13:07
at which point can you tell me??
kirbyedy
@kirbyedy
Jul 21 2016 13:09
well your first row sum is 11 for example
second one is 13
actually no
second one is 7
third is 6
then the fourth is 11
Shivam Mehta
@shivam13
Jul 21 2016 13:11
ok so its compulsory to give all 12 columns?
in all raw?
kirbyedy
@kirbyedy
Jul 21 2016 13:22
in order to work properly I would suggest so
CK Wijesundara
@Yuerno
Jul 21 2016 13:22
Hello guys! I'm having an issue with the border of a button not changing color after it's clicked. Right now if I click and hold the button, the border changes color to white, but if I release, the border goes back to the default color (this is with the navbar link buttons). Any suggestions would be appreciated! Codepen: http://codepen.io/Yuerno/pen/KMaeXX
Shivam Mehta
@shivam13
Jul 21 2016 13:22
ok @kirbyedy
can any one help me??
i cant get the all information of all channel i only get one channels information i cant understand why it happens???
https://codepen.io/shivam13/pen/OXvNvp?editors=0011
John Doe
@codingisfun11
Jul 21 2016 13:28
i know this is not a project but i need help on java.
blob
kirbyedy
@kirbyedy
Jul 21 2016 13:29
This message was deleted
This message was deleted
Dora
@DoraEx
Jul 21 2016 13:30
Is there anyone around here that is reeeaaallly good with jQuery that I could bother for a minute?
Stephen James
@sjames1958gm
Jul 21 2016 13:31
@codingisfun11 You need to assign (remainder =) the remainder of 11 divided by 3
CK Wijesundara
@Yuerno
Jul 21 2016 13:31
@kirbyedy Thanks for the suggestion! I actually tried that one myself yesterday, but the issue ends up being that it keeps the white border when you click across multiple buttons, rather than the border appearing only for one button at a time as you click on each one.
CamperBot
@camperbot
Jul 21 2016 13:31
yuerno sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1264 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
kirbyedy
@kirbyedy
Jul 21 2016 13:32
yep
not working properly
where did you get that fader from ?
CK Wijesundara
@Yuerno
Jul 21 2016 13:33
Looked up how to make hover effects on W3 schools and kind of worked backwards to make it myself
Weirdly enough, this worked fine when I was fiddling around with Bootstrap 4's navbar, but this issue came up when I went back to using Bootstrap 3's navbar.
kirbyedy
@kirbyedy
Jul 21 2016 13:34
ah ok, thought its some kind of library
abhijith shenoy
@shenoyabhijith
Jul 21 2016 14:21
guys having trouble aligning images with equal space need help
Shivam Mehta
@shivam13
Jul 21 2016 14:30
hello world
CamperBot
@camperbot
Jul 21 2016 14:30

welcome to FreeCodeCamp @shivam13!

Shivam Mehta
@shivam13
Jul 21 2016 14:31
any one help me??
Iulian Crudu
@IulianCrudu
Jul 21 2016 15:06
Hello , http://prntscr.com/bvq3wa , why doesn.t this work? i checked every number and it gives the right answer
Shivam Mehta
@shivam13
Jul 21 2016 15:08
why you use array for this program?? @IulianCrudu
Iulian Crudu
@IulianCrudu
Jul 21 2016 15:15
@shivam13 i don't know , this was the first algorithm that came to my mind :D
But what doesn't work here? i checked all the strings
Muhammad Hasham
@MohammadHasham
Jul 21 2016 15:22
Does anyone know that how can i get corresponding image of weather at a place by yahoo weater api.
abhijith shenoy
@shenoyabhijith
Jul 21 2016 15:24
guys have any idea web development project for my engineering
Muhammad Hasham
@MohammadHasham
Jul 21 2016 15:59
when an image is returned by an api how can i display it i.e: weather.
what changes i need to make in html
Uzma Khan
@meow414
Jul 21 2016 16:18
pleaaaaaaaaaase help I hve no idea how to make it work.
Reggie
@Reggie01
Jul 21 2016 16:56

@MohammadHasham It's a three step process.

  1. Create an image element and assign to a variable. docs for creating an element in javascript

  2. Assign image element's src attribute the web address of the image. I'm not 100% sure what the api you are using is returning but it's most likely a web address where the image is located. some image tag attributes

  3. Get a reference to the dom element where you want to append the image element and append image element.

Some example code you can put in codepen and try yourself

// html section
<div id="imageContainer"></div>

// js section
var imgOfCat = document.createElement("img"); //Step 1

imgOfCat.src = "https://i.ytimg.com/vi/tntOCGkgt98/maxresdefault.jpg"; // Step 2

var imageContainer = document.getElementById("imageContainer"); // Step 3
imageContainer.appendChild( imgOfCat ); // Step 3
abhijith shenoy
@shenoyabhijith
Jul 21 2016 17:06
i used class="pull right" for icons in navigation bar they are not going to the very end
need help
Uzma Khan
@meow414
Jul 21 2016 17:09
please help with Tic Tac project
Sorin Ruse
@sorinr
Jul 21 2016 17:39
@shenoyabhijith add width:100%; to your .portfolio class
Muhammad Hasham
@MohammadHasham
Jul 21 2016 17:42
@Reggie01 Thanks
CamperBot
@camperbot
Jul 21 2016 17:42
mohammadhasham sends brownie points to @reggie01 :sparkles: :thumbsup: :sparkles:
:cookie: 351 | @reggie01 |http://www.freecodecamp.com/reggie01
Muhammad Hasham
@MohammadHasham
Jul 21 2016 17:43
why does my background image not changing i am using the url
https://unsplash.com/photos/QaJVl5qGoIw
Coy Sanders
@coymeetsworld
Jul 21 2016 17:46
thats not an image url @MohammadHasham
thats a webpage
Mimi
@mimi26
Jul 21 2016 17:53
been really blocked on how to get the specific quote to pre populate the twitter window for the quote generator. Could use some help.
JT
@Jerseykid
Jul 21 2016 17:54
Hello everyone. could you take a look at my tribute page and provide feedback
Stephen
@stephepush
Jul 21 2016 17:57

Hi,
I'm trying to cleanup my quote generator app's code. Here is the original version:

http://codepen.io/stephepush/pen/dXmKYA

I have two doc ready's in there and I doubt thats the best way to get things to work, but it does work. I'm trying to clean up my code here:

http://codepen.io/stephepush/pen/XKpxxy

but it isn't working. How do I get two event handelrs(?) to work in the same function?

William Cabell
@wbac88
Jul 21 2016 18:02
@Jerseykid Looking good! You might want to add some padding around the whole thing so that the text isn't running up to the edge of the background.
Sorin Ruse
@sorinr
Jul 21 2016 18:03
@stephepush here: var tweetQuote = data.quoteText + " " + data.quoteAuthor; you are defining data.quoteText and data.quoteAuthor you will probablyget them later in your code. its better to have var tweetQuote = ""; globaly and compose it when you get data
@stephepush and here: var tweetQuote = twitterLinkRoot + tweetQuote.split(" ").join('%20'); you are redefining same var based on first that will not work
Reggie
@Reggie01
Jul 21 2016 18:09
@MohammadHasham the image url is here
I just right clicked on the webpage, clicked inpsect and looked up the image tag. Then I looked for the image src attribute. You should be able to inspect/inspect element in Chrome, Firefox or IE browser
help me plse
CamperBot
@camperbot
Jul 21 2016 18:15
no wiki entry for: me plse
Shivam Mehta
@shivam13
Jul 21 2016 18:15

https://codepen.io/shivam13/full/OXvNvp/

my twitch tv application finally done :smile:

abhijith shenoy
@shenoyabhijith
Jul 21 2016 18:15
need to make education lists
centerd
even the bullets
Shivam Mehta
@shivam13
Jul 21 2016 18:17
ul{
ul{align:center;}
@shenoyabhijith
abhijith shenoy
@shenoyabhijith
Jul 21 2016 18:18
ok ty
@shivam13
not working @shivam13
Shivam Mehta
@shivam13
Jul 21 2016 18:20
are you using bootstrap?? @shenoyabhijith
abhijith shenoy
@shenoyabhijith
Jul 21 2016 18:21
yeap
Chris Rutherford
@cjrutherford
Jul 21 2016 18:22
So.... I'm working on the Pomodoro clock, and I really would like a slider bar to set the time for the pomodoro and the break, but I'm not sure what to do to make that.... anyone know if there's one that makes sense to use?
Shivam Mehta
@shivam13
Jul 21 2016 18:22
than put your list in div and try it @shenoyabhijith
abhijith shenoy
@shenoyabhijith
Jul 21 2016 18:24
@shivam13 not working bro
i thnink ill center-text and use font awesome bullets
Tyler Moeller
@TylerMoeller
Jul 21 2016 18:25
@cjrutherford This may give you some ideas: http://bootstrapmaster.com/live/simpliq2/ui-sliders-progress.html
Shivam Mehta
@shivam13
Jul 21 2016 18:26
than i dont know @shenoyabhijith
GL @shenoyabhijith
abhijith shenoy
@shenoyabhijith
Jul 21 2016 18:27
you frm india? @shivam13
Shivam Mehta
@shivam13
Jul 21 2016 18:27
yes @shenoyabhijith
abhijith shenoy
@shenoyabhijith
Jul 21 2016 18:27
nice @shivam13
Shivam Mehta
@shivam13
Jul 21 2016 18:28
yup :+1: @shenoyabhijith
Chris Rutherford
@cjrutherford
Jul 21 2016 18:28
@TylerMoeller do they have documentation on how to implement these?
Shivam Mehta
@shivam13
Jul 21 2016 18:28
Gud ni8 bro n gud luck for your task :smile: @shenoyabhijith
abhijith shenoy
@shenoyabhijith
Jul 21 2016 18:30
thank you @shivam13 see ya tommo
CamperBot
@camperbot
Jul 21 2016 18:30
shenoyabhijith sends brownie points to @shivam13 :sparkles: :thumbsup: :sparkles:
:cookie: 32 | @shivam13 |http://www.freecodecamp.com/shivam13
Tyler Moeller
@TylerMoeller
Jul 21 2016 18:30
@cjrutherford You'll need to right-click -> Inspect to see how to implement.
Shivam Mehta
@shivam13
Jul 21 2016 18:30
yes gn bro @shenoyabhijith
abhijith shenoy
@shenoyabhijith
Jul 21 2016 18:31
gn @shivam13
Justin
@jhadams82
Jul 21 2016 18:32
hey, who's done the twitch project?
i'm confused on what i should be doing.
labanch
@labanch
Jul 21 2016 18:38
hello all! can anyone help me with the random quote machine? I got my api working now I just need to know how I can change the background color every time the "New Quote" is clicked.
Coy Sanders
@coymeetsworld
Jul 21 2016 18:40
@labanch try looking into the jQuery css function
labanch
@labanch
Jul 21 2016 18:41
@coymeetsworld cool thanks!
CamperBot
@camperbot
Jul 21 2016 18:41
labanch sends brownie points to @coymeetsworld :sparkles: :thumbsup: :sparkles:
:star2: 1265 | @coymeetsworld |http://www.freecodecamp.com/coymeetsworld
Coy Sanders
@coymeetsworld
Jul 21 2016 18:41
no problem
Justin
@jhadams82
Jul 21 2016 18:42
i set up a quick pen and made the API call in the github example, but there's not much data in the response I got. and who are all these other users?
I'm not looking for someone to do it for me. Just a little direction.
Stephen
@stephepush
Jul 21 2016 18:44
thanks @sorinr
CamperBot
@camperbot
Jul 21 2016 18:44
stephepush sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 520 | @sorinr |http://www.freecodecamp.com/sorinr
vaibhav sharma
@vaibsharma
Jul 21 2016 18:46
hello ! can anyone please tell me that how I can insert a font awesome icon inside a input field?
Chris Rutherford
@cjrutherford
Jul 21 2016 18:57
so I'm done making the visual design of the pomodoro clock, now I just want to get feedback on the design.http://codepen.io/christopherrutherford/pen/dXdVZG?editors=1100
greg
@wearenotgroot
Jul 21 2016 19:05
@cjrutherford looks good. not sure about that color green on though(try something lighter, #00faa2). also the start and stop toggle needs to be bigger
njhudd
@njhudd
Jul 21 2016 19:08
I just finished my very first Front End project: Tribute Page. Any comments or suggestions on improving this? http://codepen.io/njhudd/pen/zBRZZV
gahenderson85
@gahenderson85
Jul 21 2016 19:08
@cjrutherford I took a quick look at your pomodoro clock and I like the overall design, semi transparent clock looks sharp. I agree with @wearenotgroot I would change the green to something more neutral. Only other mention is scaling/zooming the background image should be fixed.
Muhammad Hasham
@MohammadHasham
Jul 21 2016 20:11
why is my cloud image not moving thorough bootstrap grid system?
http://codepen.io/Mohammad_Hasham/pen/QEQzjw
Jesus Vega
@ParagonChuy
Jul 21 2016 20:24
Who here has done the Wikipedia viewer?
Ken Haduch
@khaduch
Jul 21 2016 20:25
@MohammadHasham - I don't understand your question? :point_up: July 21, 2016 4:11 PM
just finished my portfolio
give feedbacks plse
Elbert Cortez
@trip16661
Jul 21 2016 20:47
@shenoyabhijith look really good but i would recomend to not use an inline form on the bottom
@shenoyabhijith also the nav doesnt work
neither any of the icons redirect to anything
or are even click like things
abhijith shenoy
@shenoyabhijith
Jul 21 2016 20:49
i did not add href
@trip16661
because its just a project
Elbert Cortez
@trip16661
Jul 21 2016 20:49
@shenoyabhijith you can use empty href
abhijith shenoy
@shenoyabhijith
Jul 21 2016 20:50
href="#"?
Elbert Cortez
@trip16661
Jul 21 2016 20:50
also the nav is a huge part of the portfolio project
so you need to do it right
at least that one
abhijith shenoy
@shenoyabhijith
Jul 21 2016 20:50
ohk dude
and can you expand on inline form>?
Elbert Cortez
@trip16661
Jul 21 2016 20:51
name email phone text box and are submit button
so i guess its a form
you shouldnt put it inline (in the same line)
can anybody help me?
the thumbnail keep staying on top while scrolling the web page
thumbnails*
Anthony Ho
@chiho13
Jul 21 2016 21:10
im playing around with React
this is not working
class Component extends React.Component {

  constructor() {
    this.state = {
      name: 'Daniel'
    }
  }

  handleInput(e) {
    this.setState({ name: e.target.value })
  }

  render() {
    return (
      <div>
        <input type="text" value={this.state.name} onChange={this.handleInput.bind(this)} />
        <NameDisplay name={this.state.name} />
      </div>
    )
  }
}
Elbert Cortez
@trip16661
Jul 21 2016 21:12
@lpy1994 z index
Reggie
@Reggie01
Jul 21 2016 21:12

@lpy1994

.header .container {
  ...
  z-index: 1;
}

You can read about z-index positioning at w3schools.com

john94
@lpy1994
Jul 21 2016 21:13
be back soon
I just notice the whole #project section is fixed
kat-mag
@kat-mag
Jul 21 2016 21:14
@lpy1994 and you have way too many classes and unnecessary ids assigned.
Jesse
@jeko54
Jul 21 2016 21:32
hello world!!! my name is JESSE and i am from Ghana.......i am inexperienced in programming and i hope that my life in freecodecamp chat room for front end development will be most rewarding .....thanks
CamperBot
@camperbot
Jul 21 2016 21:32

welcome to FreeCodeCamp @jeko54!

Jesse
@jeko54
Jul 21 2016 21:33
thanks bunch
Promise Tochi
@Promhize
Jul 21 2016 21:38
you are welcome @jeko54
Jesse
@jeko54
Jul 21 2016 21:38
thanks....
john94
@lpy1994
Jul 21 2016 21:39
@kat-mag I need those Ids for Js function
Jesse
@jeko54
Jul 21 2016 21:41
hello....all.....where do the greens start......????
Reggie
@Reggie01
Jul 21 2016 21:47
@jeko54 you can follow the map and start with the first exercises.
Adam
@Adam-Collier
Jul 21 2016 22:11
looking to get the buttons to move up slightly and increase in scale when hovered on, I cant figure out why it isnt working. Please help https://codepen.io/AdamCollier/pen/OXvwAw
Reggie
@Reggie01
Jul 21 2016 22:19
@Adam-Collier you misspelled transform
Adam
@Adam-Collier
Jul 21 2016 22:21
ah, well now I look stupid. Its crazy how long I’d been looking at it trying to figure it out. Thank you very much @Reggie01
CamperBot
@camperbot
Jul 21 2016 22:21
adam-collier sends brownie points to @reggie01 :sparkles: :thumbsup: :sparkles:
:cookie: 353 | @reggie01 |http://www.freecodecamp.com/reggie01
Paul Borawski
@iAmNawa
Jul 21 2016 23:03
@Adam-Collier You can make a jaavscript element equal to a button and replicate it rather than having to pate all that image code so many times
paste*
Tomás G. Martínez
@TomGM
Jul 21 2016 23:04
Hello, could anyone tell me why this code doesn't populate my "temp" span with the data from the query? I know the thing is a mess, will rewrite the html and style it when I'm done with functionality http://codepen.io/GMATom/pen/BzAOQE
Sean DiSanti
@badc0ded
Jul 21 2016 23:05
sure one sec @TomGM
it's throwing an error into the console that lat is not defined
basically, you're firing another $.getJson before the first one is returned
Adam
@Adam-Collier
Jul 21 2016 23:07
@iAmNawa I intended to use the buttons as hyperlinks to other pages, would I be able to do that whilst using Javascript to replicate?
Sean DiSanti
@badc0ded
Jul 21 2016 23:07
and it is referencing a variable that no longer exists
lon and lat are declared within the scope of the .done function
before it runs they don't exist
and after
Elbert Cortez
@trip16661
Jul 21 2016 23:08
guys i want a way to get good quality screenshots from my projects to resize them later, does anyone know a way to do it?
Tomás G. Martínez
@TomGM
Jul 21 2016 23:09
oh I see, thanks, figured it had something to do with the scope but I just kept looking at the rest of the code
Sean DiSanti
@badc0ded
Jul 21 2016 23:09
no problem, i'm glad i could help
Tomás G. Martínez
@TomGM
Jul 21 2016 23:10
I'm confused still though, I'm guessing I can't set them to the needed values outside of the function that takes the query result either , right?
how should I go about fixing this? >.<
Sean DiSanti
@badc0ded
Jul 21 2016 23:11
there are a few ways
probably the easiest is to move the second ajax into a function that is called from within the .done on the first
can pass the lat/lon in that way, and don't have to worry about it being called early etc
Tomás G. Martínez
@TomGM
Jul 21 2016 23:12
thanks
Sean DiSanti
@badc0ded
Jul 21 2016 23:13
that's way easier than setting up an interval to keep checking until the first is done
no problem
Carole Nissen
@callyb
Jul 21 2016 23:15
Hi there, can anyone help me work out why I get '400' errors from all the channels in the array when I try this API call - I'm just trying to get it to bring in data for each of the channels in the array...I misunderstood the question and had the app half built with random channels b4 I realised to use the given array of channels....:-/
$(document).ready(function() {
    var streamers = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas","brunofin","compster404"]

    for (var i = 0; i < streamers.length; i++) {

        $.ajax({
            url: "https://api.twitch.tv/kraken/streams/" + streamers[i] + "?callback=?",
            dataType: "jasonp",

            success: function (data) {
            console.log(data);
}
oops - missed off the last closing brackets:
});
}
});
Sean DiSanti
@badc0ded
Jul 21 2016 23:17
what is the output of the console.log @callyb ?
or do you have it in a pen?
Tyler Moeller
@TylerMoeller
Jul 21 2016 23:17
@callyb Try changing dataType: "jasonp" to dataType: "jsonp"
Carole Nissen
@callyb
Jul 21 2016 23:18
GET file:///Users/carolenissen/PIXELIST%20DESIGN/code%20library/freecodecamp%20exercises/tv%20portal/css/animate.min.css net::ERR_FILE_NOT_FOUND
jquery.js:4 GET https://api.twitch.tv/kraken/streams/ESL_SC2?callback=? 400 (Bad Request)send @ jquery.js:4ajax @ jquery.js:4(anonymous function) @ main.js:7j @ jquery.js:2fireWith @ jquery.js:2ready @ jquery.js:2J @ jquery.js:2
jquery.js:4 GET https://api.twitch.tv/kraken/streams/OgamingSC2?callback=? 400 (Bad Request)send @ jquery.js:4ajax @ jquery.js:4(anonymous function) @ main.js:7j @ jquery.js:2fireWith @ jquery.js:2ready @ jquery.js:2J @ jquery.js:2
jquery.js:4 GET https://api.twitch.tv/kraken/streams/cretetion?callback=? 400 (Bad Request)send @ jquery.js:4ajax @ jquery.js:4(anonymous function) @ main.js:7j @ jquery.js:2fireWith @ jquery.js:2ready @ jquery.js:2J @ jquery.js:2
jquery.js:4 GET https://api.twitch.tv/kraken/streams/freecodecamp?callback=? 400 (Bad Request)send @ jquery.js:4ajax @ jquery.js:4(anonymous function) @ main.js:7j @ jquery.js:2fireWith @ jquery.js:2ready @ jquery.js:2J @ jquery.js:2
jquery.js:4 GET https://api.twitch.tv/kraken/streams/storbeck?callback=? 400 (Bad Request)send @ jquery.js:4ajax @ jquery.js:4(anonymous function) @ main.js:7j @ jquery.js:2fireWith @ jquery.js:2ready @ jquery.js:2J @ jquery.js:2
jquery.js:4 GET https://api.twitch.tv/kraken/streams/habathcx?callback=? 400 (Bad Request)send @ jquery.js:4ajax @ jquery.js:4(anonymous function) @ main.js:7j @ jquery.js:2fireWith @ jquery.js:2ready @ jquery.js:2J @ jquery.js:2
jquery.js:4 GET https://api.twitch.tv/kraken/streams/RobotCaleb?callback=? 400 (Bad Request)send @ jquery.js:4ajax @ jquery.js:4(anonymous function) @ main.js:7j @ jquery.js:2fireWith @ jquery.js:2ready @ jquery.js:2J @ jquery.js:2
jquery.js:4 GET https://api.twitch.tv/kraken/streams/noobs2ninjas?callback=? 400 (Bad Request)send @ jquery.js:4ajax @ jquery.js:4(anonymous function) @ main.js:7j @ jquery.js:2fireWith @ jquery.js:2ready @ jquery.js:2J @ jquery.js:2
jquery.js:4 GET https://api.twitch.tv/kraken/streams/brunofin?callback=? 400 (Bad Request)send @ jquery.js:4ajax @ jquery.js:4(anonymous function) @ main.js:7j @ jquery.js:2fireWith @ jquery.js:2ready @ jquery.js:2J @ jquery.js:2
jquery.js:4 GET https://api.twitch.tv/kraken/streams/compster404?callback=? 400 (Bad Request)send @ jquery.js:4ajax @ jquery.js:4(anonymous function) @ main.js:7j @ jquery.js:2fireWith @ jquery.js:2ready @ jquery.js:2J @ jquery.js:2
Sean DiSanti
@badc0ded
Jul 21 2016 23:18
i'm pretty sure @TylerMoeller nailed it
about the typo
CamperBot
@camperbot
Jul 21 2016 23:18
you need to ask about @someone!
Sean DiSanti
@badc0ded
Jul 21 2016 23:19
did you see his response before your paste @callyb ?
Carole Nissen
@callyb
Jul 21 2016 23:19
Sorry @badc0ded - am on local for now...and OOPS! You're right, @TylerMoeller - it's been a long day - will fix that now...
Tyler Moeller
@TylerMoeller
Jul 21 2016 23:20
@callyb I'd also recommend ditching the for loop for a forEach. You typically don't want to do API calls or call any functions in a for loop. Too fast for asynch code :)
Carole Nissen
@callyb
Jul 21 2016 23:21
OMG....it's working!!! Thanks @TylerMoeller & thanks @badc0ded - phew!!! I couldn't see it for looking at it! And I know - a forEach was my first stop but I don't know it as well as the for loop so went for the 'easy' option to get it working - I'll have another go now Ive got the basics...thanks again guys!
CamperBot
@camperbot
Jul 21 2016 23:21
callyb sends brownie points to @tylermoeller and @badc0ded :sparkles: :thumbsup: :sparkles:
:cookie: 684 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
:cookie: 423 | @badc0ded |http://www.freecodecamp.com/badc0ded
Sean DiSanti
@badc0ded
Jul 21 2016 23:22
good job, always glad to help
Tyler Moeller
@TylerMoeller
Jul 21 2016 23:22
Good luck with the rest :clap:
Phil
@mremotoo
Jul 21 2016 23:24

help, I can't make my grey background color to fill up to the top sticking to the navigation bar like this one,

https://codepen.io/FreeCodeCamp/full/YqLyXB/

and, this is my work,

http://codepen.io/mremoto/pen/NAYjRd

CamperBot
@camperbot
Jul 21 2016 23:24
no wiki entry for: i cant make my grey background color to fill up to the top sticking to the navigation bar like this onehttpscodepeniofreecodecampfullyqlyxband this is my workhttpcodepeniomremotopennayjrd
Sean DiSanti
@badc0ded
Jul 21 2016 23:26
@mremotoo have you tried setting a background-color on your body?
Phil
@mremotoo
Jul 21 2016 23:27
yes but it filled the whole page with grey
Sean DiSanti
@badc0ded
Jul 21 2016 23:27
it sounded like that's what you wanted?
Phil
@mremotoo
Jul 21 2016 23:28
nope, check out the first pen. I just want to fill the div, not the whole body
Sean DiSanti
@badc0ded
Jul 21 2016 23:28
in the first pen, the body has a background color
so do the other divs
Adam
@Adam-Collier
Jul 21 2016 23:29
@mremotoo I think it might be because you have 160 padding-top on the body, maybe put that on the div instead?
Phil
@mremotoo
Jul 21 2016 23:31
@badc0ded @Adam-Collier yep the body also has a grey background but i want to point out that the div can be a different color than the body.. Also , I'll try the padding thing...
Sean DiSanti
@badc0ded
Jul 21 2016 23:31
yes, that will increase the size of the element with the background color and scoot it up towards the nav bar
sorry i had misunderstood the original question because of the grey background on the example
Phil
@mremotoo
Jul 21 2016 23:33
@Adam-Collier @badc0ded hey, know what, the padding on the div did the trick thanks!
CamperBot
@camperbot
Jul 21 2016 23:33
mremotoo sends brownie points to @adam-collier and @badc0ded :sparkles: :thumbsup: :sparkles:
:cookie: 99 | @adam-collier |http://www.freecodecamp.com/adam-collier
:cookie: 424 | @badc0ded |http://www.freecodecamp.com/badc0ded
Sean DiSanti
@badc0ded
Jul 21 2016 23:33
good catch on that one @Adam-Collier
Phil
@mremotoo
Jul 21 2016 23:33
true
and that was fast. I was trying to figure it out since yesterday
Sean DiSanti
@badc0ded
Jul 21 2016 23:34
good job sticking with it
one thing that can be helpful on that type of situation is to inpsect element and go to the box model tab
it will show how padding, margins, and border around the element are affecting placement
Sam Griffen
@ssgriffen
Jul 21 2016 23:35
Can anyone give me feedback on the fundamentals of my tribute page...I know the design sucks. http://codepen.io/ssgriffen/pen/zBWmkL
Phil
@mremotoo
Jul 21 2016 23:36
oh yeah, forgot about that inspect element thing. So it's helpful on these kind of situations @badc0ded
Sean DiSanti
@badc0ded
Jul 21 2016 23:36
yes, you wouldn't have seen it inspecting the grey div but on the body it would have shown the padding
it looks good @ssgriffen
i would capitalize 'who' in the title
and decrease the text size of the reference to the wikipedia page
Sam Griffen
@ssgriffen
Jul 21 2016 23:38
@badc0ded thanks for the feedback!
CamperBot
@camperbot
Jul 21 2016 23:38
ssgriffen sends brownie points to @badc0ded :sparkles: :thumbsup: :sparkles:
:cookie: 425 | @badc0ded |http://www.freecodecamp.com/badc0ded
Sean DiSanti
@badc0ded
Jul 21 2016 23:38
no problem
Phil
@mremotoo
Jul 21 2016 23:39
@badc0ded and I was having a hard time composing my question in order for it to be understood whew*
Sean DiSanti
@badc0ded
Jul 21 2016 23:40
no worries
the terminology comes with exposure
that's one thing searching for answers is great for, teaching you the words to use
Phil
@mremotoo
Jul 21 2016 23:45

@badc0ded another thing though, how do I make the elements to center? it's like justified at the left side?

http://codepen.io/mremoto/pen/NAYjRd @Adam-Collier

Sean DiSanti
@badc0ded
Jul 21 2016 23:45
there are lots of ways to move to center
1) explicit width, then set margin-left and margin-right to auto
2) set margin-left to 50% and then transform with translate to be -50%
3) in boot strap, add an offset class (a div you want to center that's col-md-4 for example could also be given col-md-offset-4)
there are a couple ways
Phil
@mremotoo
Jul 21 2016 23:50
I'm on bootstrap so I'll try the 3rd part @badc0ded
Sean DiSanti
@badc0ded
Jul 21 2016 23:50
also if you're just talking about text elements, you can add class text-center
to the parent
for bootstrap
Phil
@mremotoo
Jul 21 2016 23:52

@badc0ded I tried offseting my column but it like ruined it,

http://codepen.io/mremoto/full/NAYjRd/

Sean DiSanti
@badc0ded
Jul 21 2016 23:54
you're offseting an 8 with an 8
remember total grids are 12
so to center you want to offset by (12 - width) / 2
so change your offset to 2
shoot me a pm if you're still having issues and i can explain, getting ready to do some pairing though so won't be watching the channels as much
Phil
@mremotoo
Jul 21 2016 23:58
@badc0ded my bad haha so that's how it works. i'm also trying to figure bootstrap grids out. and you just shed light there
Tomás G. Martínez
@TomGM
Jul 21 2016 23:58
How can I see the js console in codepen?
NVM found it