These are chat archives for FreeCodeCamp/HelpFrontEnd

22nd
Feb 2016
narkeeta
@narkeeta
Feb 22 2016 00:13
Hey, does anyone know how to get the weather icon to display from the OpenWeatherMap api?
Is it built into the api or do I need to create and enter icons?
Caleb Martin
@caleb272
Feb 22 2016 00:43
anyone want to check out my website http://codepen.io/thecoder15/full/EPJMEN/
Pawan
@pawan92
Feb 22 2016 00:53
@caleb272 nice and simple :+1:
Doandes Razvan
@Fuzyon
Feb 22 2016 00:59
does anyone know how I can get info on streamers if they're offline ?(twitch.tv api project)
Anna Tyrrell
@githesp
Feb 22 2016 01:21
@Fuzyon you can use a different request, I think it's 'channel' iirc https://github.com/justintv/Twitch-API/blob/master/v3_resources/channels.md
Joseph Morse
@jnmorse
Feb 22 2016 01:50
@Fuzyon if the person is not streaming the stream part of the streams api responce is null
@Fuzyon if they are offline then you can query the channel like @githesp said
Tony Miri
@TonyMiri
Feb 22 2016 02:01
Hey everybody. When setting a background image, is it possible to detect the size of the browser viewing area and just set the size of the image to that?
Nvm I'm dumb
lol
Otto G
@ottodevs
Feb 22 2016 02:04
Hello, I just started with codepen and freecodecamp, would anyone like to check my tribute page? http://codepen.io/ottodevs/pen/RrzZry
Shahid Foy
@shahidfoy
Feb 22 2016 02:13
@ottodevs awesome work! keep it up
Venutom
@Venutom
Feb 22 2016 02:14
@ottodevs this looks really nice! I'm working on my tribute page right now too so thank you for the inspiration!
CamperBot
@camperbot
Feb 22 2016 02:14
venutom sends brownie points to @ottodevs :sparkles: :thumbsup: :sparkles:
:star: 131 | @ottodevs | http://www.freecodecamp.com/ottodevs
Otto G
@ottodevs
Feb 22 2016 02:15
thank you @shahidfoy @Venutom :) I am very new to this :smile:
CamperBot
@camperbot
Feb 22 2016 02:15
ottodevs sends brownie points to @shahidfoy and @venutom :sparkles: :thumbsup: :sparkles:
:star: 369 | @shahidfoy | http://www.freecodecamp.com/shahidfoy
:star: 131 | @venutom | http://www.freecodecamp.com/venutom
Venutom
@Venutom
Feb 22 2016 02:17
@ottodevs I'm a newb too! Actually from one newb to another, I'm not exactly clear what exactly bootstrap is. Do you only incorporate bootstrap in your HTML code?
Aurelian Spodarec
@AurelianSpodarec
Feb 22 2016 02:18
@ottodevs one thing you could change is ur col-xs-8 to col-sm-8 and put col-xs-12 on both, see if thats cool
Otto G
@ottodevs
Feb 22 2016 02:18
@Venutom I added bootstrap for the grid and styles, font-awesome for the footer icon and google fonts for the text
@AurelianSpodarec thanks for the advice, I will try it ;)
CamperBot
@camperbot
Feb 22 2016 02:19
ottodevs sends brownie points to @aurelianspodarec :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for aurelianspodarec
Brett
@BLayman
Feb 22 2016 02:40
Any ideas on why this doesn't seem to work? I think I have the equations right, but I'm not too familiar with using objects:
var temp = {
   tempprop: $(".temp").html(),

    toFaren: function(){
     return (temp.tempprop * 9 / 5 + 32);

    },
     toCels: function(){
     return ((temp.tempprop - 32) / 9 * 5);  
    } 
  }
here's my full pen if that helps: http://codepen.io/BrettPen/pen/rxgLXW
Brett
@BLayman
Feb 22 2016 03:00
I found a work around not using the object, but I was just curious what I did wrong there, since I want to start using objects more to modularize my code.
Pawan
@pawan92
Feb 22 2016 03:20
so im trying to use this API: http://quotesondesign.com/api-v4-0/ on my quote generator but it is not working..what am i doing wrong?
http://codepen.io/pawan92/pen/zrPwbP
Loren Baca
@vbroskas
Feb 22 2016 03:25
This message was deleted
This message was deleted
This message was deleted
Joseph Morse
@jnmorse
Feb 22 2016 03:37

@pawan92 so I changed this line

$("body").append(a[0].content + "<p>— " + a[0].title + "</p>")

to

$("#quote").append(a[0].content + "<p>— " + a[0].title + "</p>")

and I can see a quote in the box, before it was in the background it looked like and wasn't really readable.

Pawan
@pawan92
Feb 22 2016 03:40
@jnmorse thanks. i messing around with that as well. but theres only one quote and it doesnt change. and also i need to link it to twitter..any ideas.
originally i had an array of quotes and this to tweet var tweet = "https://twitter.com/intent/tweet?text=" + quote1 + " " + author1 + "" ; $('#twitter').attr("href",tweet);
CamperBot
@camperbot
Feb 22 2016 03:40
pawan92 sends brownie points to @jnmorse :sparkles: :thumbsup: :sparkles:
:star: 413 | @jnmorse | http://www.freecodecamp.com/jnmorse
Joseph Morse
@jnmorse
Feb 22 2016 03:42
@pawan92 Yeah the api doesn't allow you to get new quotes all that quickly, seems to return the same quote for awhile I've noticed
@pawan92 I've shown this before but starting to wonder how useful this example is, but here you go anyways http://codepen.io/jnmorse/pen/eJjYrO this is an example I put together for generating the href attribute. Also include the code from twitter that seems to make a link pointing to twitter open in a pop up window.
@pawan92 when you get your quote you would just have to pass the text to where 'hello world' is
Pawan
@pawan92
Feb 22 2016 03:50
thanks i like it just need to generate random quotes now haha
Ziad Sabra
@zeiadwsabra
Feb 22 2016 03:52
Hi everyone, can any one tell me if this working for you: http://codepen.io/zamyka/full/mVZWag/
Joseph Morse
@jnmorse
Feb 22 2016 03:55

@pawan92 yeah I just created an array of quotes for mine instead of using an api, couldn't seem to find one that would work for me, or i liked anyways.

var quotes = [
  { author: 'some author', quote: 'some quote text' },
  [ author: 'another author', quote: 'some other quote'}
];

stuck a bunch of objects in an array, that way I could access them like quotes[0].author, quotes[0].quote

Pawan
@pawan92
Feb 22 2016 03:56
@jnmorse yea i had an array as well and it works fine but with the changed curriculum of them having APIs before this project..im lead to believe they want us to actually generate random quotes rather than an array..and its a nice challenge so trying to figure that out
Joseph Morse
@jnmorse
Feb 22 2016 03:56
@zeiadwsabra works for me
Ziad Sabra
@zeiadwsabra
Feb 22 2016 03:57
@jnmorse thanks, what do you think of it?
CamperBot
@camperbot
Feb 22 2016 03:57
zeiadwsabra sends brownie points to @jnmorse :sparkles: :thumbsup: :sparkles:
:star: 414 | @jnmorse | http://www.freecodecamp.com/jnmorse
Joseph Morse
@jnmorse
Feb 22 2016 03:58
@pawan92 you can't generate random quotes without having a source and a array works fine for that.
@zeiadwsabra I think its alright, don't see wind speed, and looks like your rounding down the temp, which is a bit over 32 here
@zeiadwsabra does the background change based on conditions or anything, or do you just have the rather drab icons from openweathermap?
Ziad Sabra
@zeiadwsabra
Feb 22 2016 04:01
both the background and the icon change
@jnmorse
Joseph Morse
@jnmorse
Feb 22 2016 04:02
@zeiadwsabra just cause, this was mine btw, re-did it a awhile ago in react http://codepen.io/jnmorse/pen/GoJmQq
Ziad Sabra
@zeiadwsabra
Feb 22 2016 04:03
@jnmorse looks great, do you have any tips for me ?
narkeeta
@narkeeta
Feb 22 2016 04:05
Hey everyone, I am working on the weather app zipline and I was wondering if anyone give me advice on better looking icons rather than the ones that come with the API that they recommend you use.
Joseph Morse
@jnmorse
Feb 22 2016 04:07
@zeiadwsabra well I think you need a more visiable way to let a user that they can switch from F to C and vice versa, if I hadn't clicked the temp I wouldn't have known that was a option
@narkeeta you search google for some, but then you need a host that would let you include them on github, could use dropbox or create a resources repo on github and use a raw link from there
github apparently lets you upload files aside from actually using git now apparently
Ziad Sabra
@zeiadwsabra
Feb 22 2016 04:11
@jnmorse should I change the color of C / F , or what do you suggest ?
Joseph Morse
@jnmorse
Feb 22 2016 04:12
@zeiadwsabra I changed the color slightly on mine, hoping that would indicate that they where links, which they are, could also try to come up with some sorta toggle
Ziad Sabra
@zeiadwsabra
Feb 22 2016 04:13
@jnmorse ok , thanks
CamperBot
@camperbot
Feb 22 2016 04:13
zeiadwsabra sends brownie points to @jnmorse :sparkles: :thumbsup: :sparkles:
:warning: zeiadwsabra already gave jnmorse points
h4r1m4u
@h4r1m4u
Feb 22 2016 04:19
@AaronKazah you're asking people to give you their email address without a clear and detailed explanation of what it is they're signing up for. sure, you mentioned it here in your post but without a demo/screenshots of your app, you could easily be making it up. this chat channel is public, anybody can easily sign up. the fact that you're using mailchimp doesn't matter - once you have their email address, you can do whatever you like with it (spam them, sell it to 3rd parties, etc.). now i'm not saying this is what you're doing, and again, i mean no offense, but if you do want to make your project successful and have people sign up, you will need to provide more than 'i'm planning to release a web application that connects creators with their target market'.
perhaps you're getting ahead of yourself? if the MVP is almost finished, why not finish it first and make it available - if only to a limited number of test users whose registration you will need to approve. then start collecting email addresses of potentially interested people, so that you can invite them later when you release the full version or update them on the progress of your project.
the first impression is important and right now my first impression is that you want my email address without me actually knowing why i should be giving it to you. mine is obviously a one man's opinion, but there's a chance that other people will feel similar, so hopefully this feedback will be helpful to you.
best of luck with your project. i hope it's a success and i'm looking forward to learning more about it.
@Penthious you want this:
for (var i = 0; i < computerMoves.length; i++) {
  setTimeout(function () {
     // do something
  }, i * 500);
}
note how on each iteration the timeout length (500ms) is modified by the value of i, meaning that each execution of the code inside the timeout will occur with 500ms gaps
narkeeta
@narkeeta
Feb 22 2016 04:27
Hey guys, I found this website -- http://www.alessioatzeni.com/meteocons/ -- and it has a free set of weather icons I want to use. Could someone look and explain how I would import them into my codepen?
h4r1m4u
@h4r1m4u
Feb 22 2016 04:31

@narkeeta you can download the meteocons font, host the font files somewhere (e.g. dropbox) and then import the font into your codepen in your CSS:

@font-face {
    font-family: 'MeteoconsRegular';
    src: url('meteocons-webfont.eot');
    src: url('meteocons-webfont.eot?#iefix') format('embedded-opentype'),
         url('meteocons-webfont.woff') format('woff'),
         url('meteocons-webfont.ttf') format('truetype'),
         url('meteocons-webfont.svg#MeteoconsRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

the URLs in the snippet above will need to lead to where you're actually hosting the font files

narkeeta
@narkeeta
Feb 22 2016 04:32
okay, thank you
try moves 1, 2, 3
not sure why my if(userMoves == wins[0]){ isnt running
h4r1m4u
@h4r1m4u
Feb 22 2016 04:52
@valmassoi you're comparing two arrays and unlike for example strings or numbers, arrays in javascript are equal only if they reference the same instance (i.e. they point to the same location in memory). you'll need to iterate over the arrays and compare the individual elements.
Robert Valmassoi
@valmassoi
Feb 22 2016 04:54
cool thanks. do you happen to know if thats true for obj-c?
h4r1m4u
@h4r1m4u
Feb 22 2016 04:57
i'm not sure as i'm not familiar with obj-c, but i'd venture that it might be the same. i think python works this way as well, so it's not a unique feature to JS
Marek Slabicki
@thaniri
Feb 22 2016 05:15

When I test this site locally, my layout breaks the <hr /> tags and spills over vertically, however, if I test on codepen.io it does not do that. Anyone have an idea as to why? Should I base my results on local testing or codepen testing?

http://codepen.io/thaniri/full/MKPEXm/

h4r1m4u
@h4r1m4u
Feb 22 2016 05:53
@thaniri the only thing i can think of is: did you correctly import the bootstrap.css library in your local version?
Dulshani Gunawardhana
@dshgna
Feb 22 2016 06:10
Hi!!
Any JS libraries I can use to get the doughnut shape in Simon game?
h4r1m4u
@h4r1m4u
Feb 22 2016 06:14
@dshgna no need for libraries. it's quite simple to do it with pure CSS. border-radius property is your friend
Catalin Scripcariu
@CatalinScr
Feb 22 2016 06:15
Hi, can someone help me with the Api from wikipedia. Why this is not working with JSON?
h4r1m4u
@h4r1m4u
Feb 22 2016 06:18
@CatalinScr because the wikipedia server is not configured to support JSON requests. you need JSONP instead. try adding callback=? as one of the parameters in the API URL you're trying to call
Catalin Scripcariu
@CatalinScr
Feb 22 2016 06:18
Testing now ...
Karthik Jagadeesha
@karthikJagadeesh
Feb 22 2016 06:57
@karthikJagadeesh
Can somebody help me with bootstrap navbar? The collapsed navbar isn't showing if click on the icon.
<nav class="navbar navbar-default">
  <div class="container-fluid">

    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" 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="#">Karthik Jagadeesh</a>
    </div>

    <div class="collapse navbar-collapse" id="myNavbar" >
      <ul class="nav navbar-nav navbar-right">
        <li class="active"><a href="#">About</a></li>
        <li><a href="#">Portfolio</a></li>
        <li><a href="#">Contact</a></li>
      </ul>
    </div>

  </div>
</nav>
h4r1m4u
@h4r1m4u
Feb 22 2016 07:01
@karthikJagadeesh my guess is you didn't import bootstrap.min.js into your project
the code itself looks ok
Jan Dahl-Madsen
@jsdm
Feb 22 2016 07:06
Hi, does anybody know where @media queries in the CSS file goes? I mean, is it ok for me to put everything at the end of the file? (I just spend an hour trying to figure out why it didn’t work, just to findout that it needs to go AFTER the initial rule, ie. changing the size of h1 on phone screens. Or is there a defined standard? (have not been able to find out). Cheers
h4r1m4u
@h4r1m4u
Feb 22 2016 07:10
@jsdm it largely boils down to personal preference. i used to put all media queries at the end of the main CSS file. now i divide my CSS into logical sections (e.g. typography, header, main content, etc.) and put the relevant media queries at the end of these sections. some people like to split their CSS files into multiple files and keep media queries in their own dedicated CSS file.
so as to your question, yes, it's fine to put all your media queries at the end of your CSS.
Jan Dahl-Madsen
@jsdm
Feb 22 2016 07:14
ok. thanks. Yes i was trying to do the logical section thing (seems more natural when debugging afterwards…) but tried to edit something that came after the media rule and thus was overwritten… Probably shouldnt edit <h1> anyway… But thanks!
h4r1m4u
@h4r1m4u
Feb 22 2016 07:16
yw
Brian Kilrain
@bkilrain
Feb 22 2016 07:19
Ahhhh - my fellow campers. Please help. I can’t get my scrollspy to work :worried: Can someone see if they can spot the problem. Here is my pen: http://codepen.io/bkilrain/pen/vLqdOM
I’ve tried writing the code by myself using the getBootstrap site. I’ve copy and pasted code I’ve found on stack overflow. I can’t figure out what’s wrong
h4r1m4u
@h4r1m4u
Feb 22 2016 07:23
@bkilrain right off the bat - you didn't import the bootstrap.js library into your project
give that a shot and see if that fixes the problem
Brian Kilrain
@bkilrain
Feb 22 2016 07:24
ok… I thought codepen did that for me. I shall give that a go. thanks @h4r1m4u
CamperBot
@camperbot
Feb 22 2016 07:24
bkilrain sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1454 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 22 2016 07:25
@bkilrain no, it doesn't do that automatically. just add it as a resources in the JS settings of the pen (after jquery)
Liu Dongqing
@liudongqing
Feb 22 2016 07:25
hi, can someone help me on bootstrap grid system?
h4r1m4u
@h4r1m4u
Feb 22 2016 07:26
what's the issue @liudongqing
Liu Dongqing
@liudongqing
Feb 22 2016 07:26
I have a very simple start, with code like this http://codepen.io/liudongqing/pen/obbYVR
once I added the class=row into the div, the content will extend to out of the view, I am not sure why? it will come back to normal after remove the class=row.
h4r1m4u
@h4r1m4u
Feb 22 2016 07:29
@liudongqing it's because bootstrap expects this HTML structure: container > row > col. you want this:
<div class="container-fluid">
  <div class="row">
    <div class="page-header span4 offset2">
      <h1>Fearless Design Studio</h1>
    </div>
  </div>
</div>
Liu Dongqing
@liudongqing
Feb 22 2016 07:29
OK, got it, everything should be in a container, right?
h4r1m4u
@h4r1m4u
Feb 22 2016 07:30
yup. rows need to be direct children of containers and cols direct children of rows
on that note, span4 and offset2 are not bootstrap classes. where did you get that from?
Brian Kilrain
@bkilrain
Feb 22 2016 07:31
@h4r1m4u no love. I linked it at the top of my html… and added it as a resource to both my css and js settings. I’m just gonna copy and paste a working example of a navbar and then add my page on top of it :(
Liu Dongqing
@liudongqing
Feb 22 2016 07:31
h4r1m4u
@h4r1m4u
Feb 22 2016 07:32
@liudongqing oh. that's a very outdated version of bootstrap. you should be using the bs 3. http://getbootstrap.com/css/#grid
Liu Dongqing
@liudongqing
Feb 22 2016 07:32
ok, thanks!
h4r1m4u
@h4r1m4u
Feb 22 2016 07:32
np
@bkilrain it's working properly for me once you've imported the library
Brian Kilrain
@bkilrain
Feb 22 2016 07:34
Just got it… I had some old code from a fix attempt in the js file that was screwing things up
Hooray!
h4r1m4u
@h4r1m4u
Feb 22 2016 07:35
cool :)
kirbyedy
@kirbyedy
Feb 22 2016 07:42
how can make my search better, by disabling user typing in bullshit in the search field
for example this aksjdgfaljshdgkjashdgf should return "not funny"
h4r1m4u
@h4r1m4u
Feb 22 2016 07:45
@kirbyedy hmmm, that's tough. the only thing i can think of is either a) regex (challenging though as the 'bullshit' typed by the user can be of multiple patterns), or b) utilizing some dictionary/spellchecking api to ensure that the typed word is an actual english word
kirbyedy
@kirbyedy
Feb 22 2016 07:45
since I am stupid to do that, I guess I should just leave it the way it is
h4r1m4u
@h4r1m4u
Feb 22 2016 07:46
lol. or step up to the challenge and figure it out :)
kirbyedy
@kirbyedy
Feb 22 2016 07:46
well my brain is limited :D
I might use some google foo, and see what comes up
h4r1m4u
@h4r1m4u
Feb 22 2016 07:46
how's your google-fu? :D
hahaha
kirbyedy
@kirbyedy
Feb 22 2016 07:46
yea LOL
faraz
@silentarrowz
Feb 22 2016 07:58
hi, having problems showing the weather with my weather app. could you tell what's wrong?? here's the link to codepen - http://codepen.io/silentarrowz/pen/YwoGMB
could you guys help @kirbyedy @h4r1m4u
h4r1m4u
@h4r1m4u
Feb 22 2016 08:04

@silentarrowz geolocation doesn't work properly in my browser so it's a little difficult for me to troubleshoot, but one issue i can spot is that you're doing:

apiOpenWeatherUrl = baseOpenWeatherUrl + "?lat=" + position.coords.latitude + "&lon=" + position.coords.longitude + "&APPID=" + apiKey;

outside of the the getLocation() function. the position object that you get from geolocation is limited to the scope of the getLocation() function. if you try to use access the object outside of it (as you do with + position.coords.longitude +) it'll fail. you should be setting the apiOpenWeatherUrl as part of the getLocation() callback function

faraz
@silentarrowz
Feb 22 2016 08:05
@h4r1m4u - well, actually this was separate. I mean I used the navigator.geoposition to get the location and then I tried to use the openweather api to get the weather so they are not related I think
but actually, I am getting kinda lost on this. why doesnt anything show up in the weather div when the location is showing in the location div
h4r1m4u
@h4r1m4u
Feb 22 2016 08:07
i think you're misunderstanding me. what you're doing, in nutshell, is this:
var myName = "silent" + lastName;

function test() {
  var lastName = 'arrows';
}
this won't work, because lastName is limited to the scope of test()
you don't have access to that variable outside of the test() function
it's the same with the position object in your code

if you check the console, you'll see you're getting these two errors:
pen.js:46 Uncaught ReferenceError: position is not defined
pen.js:55 Uncaught TypeError: Cannot read property 'coords' of undefined

which is the result of what i'm describing above

faraz
@silentarrowz
Feb 22 2016 08:13
@h4r1m4u ok, let me check the console
@h4r1m4u - yes, I can see those errors and it shows pen.js:46 and pen.js:55 - I dont think these are the line numbers because the line numbers 46 and 55 have nothing on them
@h4r1m4u so , how do I correct this
greg
@wearenotgroot
Feb 22 2016 08:19
@silentarrowz btw you dont have to call showPosistion again because you already put it as a callback for getCurrentPosition
faraz
@silentarrowz
Feb 22 2016 08:20
@wearenotgroot ah, yes. I removed the showPosition and the weather is still showing. By the way, could you tell what is wrong with my getjson command
greg
@wearenotgroot
Feb 22 2016 08:21
@silentarrowz put this guys into showPosition
apiOpenWeatherUrl = baseOpenWeatherUrl + "?lat=" + position.coords.latitude + "&lon=" + position.coords.longitude + "&APPID=" + apiKey;

   $.getJSON(apiOpenWeatherUrl, function(json) {
      $("#weather").html(json.main.temp);
    });
h4r1m4u
@h4r1m4u
Feb 22 2016 08:21
@silentarrowz yeah, the line numbers are not correct due to how codepen embeds the pen in their own site. as to the fix - like i described above: you need to construct the URL as part of the getLocation() callback. you should then also call the API from the callback of the getLocation() function (to deal with the async nature of the geolocation function). something along these lines:
function getLocation() {
    if (navigator.geolocation) {
        var apiOpenWeatherUrl = "";
        apiOpenWeatherUrl = baseOpenWeatherUrl + "?lat=" + position.coords.latitude + "&lon=" + position.coords.longitude + "&APPID=" + apiKey;       
        $.getJSON(apiOpenWeatherUrl, function(json) {
               $("#weather").html(json.main.temp);
         });        
    } else {
        $("#location").html("Geolocation is not supported by this browser.");
    }
}
greg
@wearenotgroot
Feb 22 2016 08:22

@silentarrowz or have a separate method like

function getWeather(position){
apiOpenWeatherUrl = baseOpenWeatherUrl + "?lat=" + position.coords.latitude + "&lon=" + position.coords.longitude + "&APPID=" + apiKey;

   $.getJSON(apiOpenWeatherUrl, function(json) {
      $("#weather").html(json.main.temp);
    });
}

then call it inside showPosition

faraz
@silentarrowz
Feb 22 2016 08:26
@wearenotgroot @h4r1m4u , so I have to include the json inside the location function?? but why is that??
greg
@wearenotgroot
Feb 22 2016 08:26
@silentarrowz because of its async nature
@silentarrowz meaning the program doesnt wait for the response from api calls
@silentarrowz the code below the api calls executes immediately after
faraz
@silentarrowz
Feb 22 2016 08:27
but if it doesnt wait for the response, then how does it get the data?? @wearenotgroot
greg
@wearenotgroot
Feb 22 2016 08:28
@silentarrowz you can use promises if you dont like having this
@silentarrowz it gets the data but later
faraz
@silentarrowz
Feb 22 2016 08:28
@wearenotgroot - no, it's not about me liking it. I am here to learn this
greg
@wearenotgroot
Feb 22 2016 08:28
@silentarrowz here is what happening the getCurrentPosition gets executed
faraz
@silentarrowz
Feb 22 2016 08:29
@wearenotgroot but how does it show the data then, without getting it first??
h4r1m4u
@h4r1m4u
Feb 22 2016 08:29
the callback function gets invoked only when you receive the response from the API. which is why the callback function has access to the response object from the API
greg
@wearenotgroot
Feb 22 2016 08:29
@silentarrowz then the request is sent now the program does wait for the returned result. it just continues on
@silentarrowz when the result is ready then the callback showPosition is fired then it show the position
faraz
@silentarrowz
Feb 22 2016 08:31
@h4r1m4u I couldnt understand what you said. could you make it a little more simple
greg
@wearenotgroot
Feb 22 2016 08:31
@silentarrowz asyncs(request to api) <------doesnt lock up the rest of the program, the callback are called when the results are ready(api response)
faraz
@silentarrowz
Feb 22 2016 08:34
@wearenotgroot so, what is happening is getCurrentPosition gets executed, it calls showPosition and what showPosition does is to show us the location and then call response from api. is this what you are saying??
h4r1m4u
@h4r1m4u
Feb 22 2016 08:35
@silentarrowz consider this code:
var saveResponse;

// getJSON is asynchronous
$.getJSON(apiOpenWeatherUrl, function(json) {
    // this callback function gets invoked only after you receive the response from the API and as such has access to the response object, in this case called json
    console.log(json);
   // let's now save the json to saveResponse
  saveResponse = json;
});

console.log(json); // won't work, because json is limited to the scope of the getJSON callback function
console.log(saveResponse); // this will return undefined despite the fact that we're saving the json into the variable inside the callback above. the reason it is undefined is that this code doesn't wait for the response from the API, it gets run immediately, before you receive the response
greg
@wearenotgroot
Feb 22 2016 08:35
@silentarrowz yes if and only if the api call to the openweather api is inside the showPosition does it get triggered
@silentarrowz or else the call to openweather will happen before the showPosition is ready
faraz
@silentarrowz
Feb 22 2016 08:36
@wearenotgroot and so the problem was that in my code the call to openweather api was not getting trigerred?
greg
@wearenotgroot
Feb 22 2016 08:36
@silentarrowz it is getting triggered, but too early
@silentarrowz so no lan and lat values are being used
@silentarrowz also you had the scope problem as stated earlier by @h4r1m4u
faraz
@silentarrowz
Feb 22 2016 08:38
@h4r1m4u ok, saw the code. so the thing is that callback was too early, but isnt that what we wanted from the async nature?? that it shouldnt wait for the response??
h4r1m4u
@h4r1m4u
Feb 22 2016 08:39
well if you want to do something with the data you receive from the API, you have to wait until you get it. which is what the callback function is for
faraz
@silentarrowz
Feb 22 2016 08:40
ah, yes. so the ideal thing should be that it should wait for the response to the api and then only proceed??
h4r1m4u
@h4r1m4u
Feb 22 2016 08:40
you cannot do anything with it before you receive it from the API
faraz
@silentarrowz
Feb 22 2016 08:41
@wearenotgroot and putting the getjson inside showposition makes sure that lat and long values are ready and then only we send the request for response from api??
@h4r1m4u
greg
@wearenotgroot
Feb 22 2016 08:41
@silentarrowz yes
h4r1m4u
@h4r1m4u
Feb 22 2016 08:42
yes. if you want to do something with the data from the API, you have to wait until you get it. the async nature of the getJSON call just means that you can also do something else in the meantime. for example you could call another API, calculate factorial of 100, or anything else. but any code that manipulates the data from the API needs to wait for the response
and the response from the API is available to you inside the callback function
faraz
@silentarrowz
Feb 22 2016 08:43
ah, I think I understand, but I think i need to read this a few more times before it really sinks in.
One more thing though I am using json.main.temp and it is showing me the temperature but it doesnt show anything when i use json.weather. why is that happening?
according to their response, it should be
{"coord":{"lon":139,"lat":35},
"sys":{"country":"JP","sunrise":1369769524,"sunset":1369821049},
"weather":[{"id":804,"main":"clouds","description":"overcast clouds","icon":"04n"}],
"main":{"temp":289.5,"humidity":89,"pressure":1013,"temp_min":287.04,"temp_max":292.04},
"wind":{"speed":7.31,"deg":187.002},
"rain":{"3h":0},
"clouds":{"all":92},
"dt":1369824698,
"id":1851632,
"name":"Shuzenji",
"cod":200}
greg
@wearenotgroot
Feb 22 2016 08:44
@silentarrowz weather is an array
@silentarrowz reason is other location on earth has some weird weather pattern
@silentarrowz main weather is typically at ['weather'] [0]
faraz
@silentarrowz
Feb 22 2016 08:46
ah, yes. now it shows up. Is there a way I could show temp and weather description together?? @wearenotgroot
greg
@wearenotgroot
Feb 22 2016 08:47
@silentarrowz sure just access it and display
h4r1m4u
@h4r1m4u
Feb 22 2016 08:47
json.weather[0].description should do the trick
greg
@wearenotgroot
Feb 22 2016 08:47
@silentarrowz temp is at main
faraz
@silentarrowz
Feb 22 2016 08:48
so I want main. temp and weather0.description - should I use 2 commands then??
greg
@wearenotgroot
Feb 22 2016 08:48
@silentarrowz yeah
faraz
@silentarrowz
Feb 22 2016 08:48
and 2 separate divs?? or can it be displayed in one div
greg
@wearenotgroot
Feb 22 2016 08:49
@silentarrowz well that is up to you, just aesthetics right now
:smile:
faraz
@silentarrowz
Feb 22 2016 08:49

I mean can I write it like

$("#weather").html(json.weather[0].description);
$("#weather").html(json.main.temp);

or is there another way too??

greg
@wearenotgroot
Feb 22 2016 08:50
@silentarrowz append is what you want
@silentarrowz if you want to add things if you do it like that, it will just override the first one
idietmoran
@idietmoran
Feb 22 2016 08:51
@silentarrowz if weather is a <p> element you could do something like this
$('#weather').text(json.weather[0].description);
greg
@wearenotgroot
Feb 22 2016 08:51
@silentarrowz but if you want more control then just have separate divs for each info
h4r1m4u
@h4r1m4u
Feb 22 2016 08:51
this would probably work too $("#weather").html(json.weather[0].description + " " + json.main.temp);
faraz
@silentarrowz
Feb 22 2016 08:52
@h4r1m4u aha! this looks good.
idietmoran
@idietmoran
Feb 22 2016 08:53

@silentarrowz so you could do

$('#temp').text(json.main.temp);
$('#city').text(json.main.city);
$('#high).text(json.main.hitemp);

those are made up calls but you get what i'm getting at

faraz
@silentarrowz
Feb 22 2016 08:53
well, thank you so much both of you @h4r1m4u @wearenotgroot . you were a lot of help. this thing was driving me crazy and now I think I have got the gist of this thing. will need to read up this chat a few more times though. Is there a way to save this chat or do I just copy and paste it into notepad??
CamperBot
@camperbot
Feb 22 2016 08:54
silentarrowz sends brownie points to @h4r1m4u and @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star: 925 | @wearenotgroot | http://www.freecodecamp.com/wearenotgroot
:star: 1455 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
faraz
@silentarrowz
Feb 22 2016 08:54
thanks @h4r1m4u @wearenotgroot
CamperBot
@camperbot
Feb 22 2016 08:54
silentarrowz sends brownie points to @h4r1m4u and @wearenotgroot :sparkles: :thumbsup: :sparkles:
:warning: silentarrowz already gave h4r1m4u points
:warning: silentarrowz already gave wearenotgroot points
greg
@wearenotgroot
Feb 22 2016 08:54
@silentarrowz YW
faraz
@silentarrowz
Feb 22 2016 08:54
Yw??
greg
@wearenotgroot
Feb 22 2016 08:55
you're welcome :smile:
faraz
@silentarrowz
Feb 22 2016 08:55
@idietmoran yeah, I get it. thanks for this
CamperBot
@camperbot
Feb 22 2016 08:55
silentarrowz sends brownie points to @idietmoran :sparkles: :thumbsup: :sparkles:
:star: 312 | @idietmoran | http://www.freecodecamp.com/idietmoran
h4r1m4u
@h4r1m4u
Feb 22 2016 08:55
@silentarrowz there's the archives: https://gitter.im/FreeCodeCamp/HelpFrontEnd/archives/all. so if you remember today's date, you can look up the conversation later
faraz
@silentarrowz
Feb 22 2016 08:56
@wearenotgroot YW??
greg
@wearenotgroot
Feb 22 2016 08:56
@silentarrowz YW ------------> You are Welcome :smile:
faraz
@silentarrowz
Feb 22 2016 08:57
@h4r1m4u thanks again. will do that
CamperBot
@camperbot
Feb 22 2016 08:57
silentarrowz sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:warning: silentarrowz already gave h4r1m4u points
h4r1m4u
@h4r1m4u
Feb 22 2016 08:57
np
kirbyedy
@kirbyedy
Feb 22 2016 09:06
@h4r1m4u whats that thing on your avatar?
always freaks me out :D
h4r1m4u
@h4r1m4u
Feb 22 2016 09:07
lol. it's a honey badger
one friggin' badass of the animal kingdom
kirbyedy
@kirbyedy
Feb 22 2016 09:09
oooh
i will look up for more info, cause I did not know the name of that creature :)
h4r1m4u
@h4r1m4u
Feb 22 2016 09:12

@kirbyedy ok, let me do you a favor and enlighten you on the subject of honey badgers. watch these two classic pieces:
the first one is tongue in cheek
https://www.youtube.com/watch?v=4r7wHMg5Yjg

the second one actually shows how smart the badgers are
https://www.youtube.com/watch?v=c36UNSoJenI

(sorry for offtopic everyone)
kirbyedy
@kirbyedy
Feb 22 2016 09:12
LOL
sweet mother of jesus :D
@h4r1m4u thanks
CamperBot
@camperbot
Feb 22 2016 09:12
kirbyedy sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1456 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 22 2016 09:12
:D
kirbyedy
@kirbyedy
Feb 22 2016 09:13
do you own one ? :D
h4r1m4u
@h4r1m4u
Feb 22 2016 09:13
lol no. i'm not a huge fan of keeping wild animals as pets. i just like what a badass the badger is
kirbyedy
@kirbyedy
Feb 22 2016 09:14
hehehe
kangyao
@kay78
Feb 22 2016 09:27

hi guys, i need some help on how to extract info from a JSON

here's my code, but i got no idea how to loop through the different IDs in pages
$.getJSON(url, function(d) { var data2 = d.query.pages; data2.forEach(function(x) { var wiki = '<div id="result">' + '<p id="result-title">' + x.title + '</p>' + '<p id="description">' + x.extract + '</p></div>'; $("#resultList").text("hellow"); }); // close function $("#searchbox").val(''); }); //close getJSON

$.getJSON(url, function(d) {
    var data2 = d.query.pages;
    data2.forEach(function(x) {
      var wiki = '<div id="result">' + '<p id="result-title">' + x.title + '</p>' + '<p id="description">' + x.extract + '</p></div>';
      $("#resultList").text("hellow");
    }); // close function
    $("#searchbox").val('');
  }); //close getJSON
Ashraful Islam
@iashraful
Feb 22 2016 09:28
@kay78 I see its fine what seems to be the problem?
kangyao
@kay78
Feb 22 2016 09:33
my script doesnt seems to be able to get the data, i was suspecting if its due to the data i want to get from comes from different ids under pages, and the forEach wasn't able to read into them due to id
"query": {
"pages": {
"13243925": {} ,
"4039865":{},
}
}
kirbyedy
@kirbyedy
Feb 22 2016 09:48
@kay78 says click enter, but it does not work :(
cannelflow
@cannelflow
Feb 22 2016 09:51
This message was deleted
This message was deleted
cannelflow
@cannelflow
Feb 22 2016 09:59
kik.PNG
@kay78 you need to use jsonp
kangyao
@kay78
Feb 22 2016 09:59
@kirbyedy yup. i can't fingure out whats wrong with the script. if i used back the script below it, it works....
kangyao
@kay78
Feb 22 2016 10:08
@cannelflow i changed the format=jsonp but page can't load anything out.
@cannelflow i change to format=json, it loads in http, but doesnt load anything in the codeio page
even i change the code to just write a text instead from the json, it failed....:(
```
$.getJSON(url, function(d) {
    var data2 = d.query.pages;
    data2.forEach(function(x) {
      var wiki = '<div id="result">' + '<p id="result-title">' + x.title + '</p>' + '<p id="description">' + x.extract + '</p></div>';
      //$("#resultList").append(wiki);
      $("#resultList").text("Hello");
    }); // close function
    $("#searchbox").val('');
  }); //close getJSON
cannelflow
@cannelflow
Feb 22 2016 10:10
@kay78 can you give updated link
kangyao
@kay78
Feb 22 2016 10:11
@canneflow updated link
kirbyedy
@kirbyedy
Feb 22 2016 10:12
still does not work for me
cannelflow
@cannelflow
Feb 22 2016 10:14
@kay78 you are still using getJson method so error is still XMLHttpRequest cannot load https://en.wikipedia.org/w/api.php?action=query&format=jsonp&prop=extracts%…limit=10&exintro=1&explaintext=1&inprop=url&gsrlimit=10&gsrsearch=football. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://s.codepen.io' is therefore not allowed access.
use $ajax method instead
kirbyedy
@kirbyedy
Feb 22 2016 10:16
I have a strange problem now, although it was working until this morning... when I hover over the links, or try to click them, instead of taking me to the link and open that link in the new window, it boomerangs me back to codepen
every fckn link :D
// Using jQuery
$.ajax( {
    url: remoteUrlWithOrigin,
    data: queryData,
    dataType: 'json',
    type: 'POST',
    headers: { 'Api-User-Agent': 'Example/1.0' },
    success: function(data) {
       // do something with data
    }
} );
kangyao
@kay78
Feb 22 2016 10:17
@cannelflow i used the list=search instead of generator=search suing another script, yet it works , working link
ops. i mean "using another"
Robert Uivarosi
@URobert
Feb 22 2016 10:19
@kay78 what is the matter?
cannelflow
@cannelflow
Feb 22 2016 10:19
@kay78 :+1:
kangyao
@kay78
Feb 22 2016 10:21
@cannelflow i think its due to there's a call back added into url, thats why it works, i eed to try few more times, thanks a lot for help
CamperBot
@camperbot
Feb 22 2016 10:21
kay78 sends brownie points to @cannelflow :sparkles: :thumbsup: :sparkles:
:star: 820 | @cannelflow | http://www.freecodecamp.com/cannelflow
how do i animate one button when i click on another?
Joel Bemis
@jbemis
Feb 22 2016 10:27
why am i having trouble with my start button?
the alert executes on page load, but not on click
kangyao
@kay78
Feb 22 2016 10:28
@cannelflow whats the dfiference between ajax and getjson method? in my previous assignment, i use getJSON, it works link here
Ilan Kosteniov
@ikosteniov97
Feb 22 2016 10:32
how do iuse open wheather api?
Medha Bobbili
@medhatrinky
Feb 22 2016 10:34

$(#target1").parent().css("background-color","red");

your left well elemnet should have red background
??

@ikosteniov97
@kay78
@cannelflow
@Venutom
cla63
@cla63
Feb 22 2016 10:39
@jbemis $('#start').click(timerFunction);
Joel Bemis
@jbemis
Feb 22 2016 10:40
the main thing i’m tryign to do is play with different timer functions (i.e. setTimeout
i should be able to call setTimeout repeatedly again by clicking on start
kangyao
@kay78
Feb 22 2016 10:41
@medhatrinky what's your question?
cla63
@cla63
Feb 22 2016 10:43
@jbemis yesI think the function should be something like this setTimeout(function(){ alert("Hello"); }, 3000);
Joel Bemis
@jbemis
Feb 22 2016 10:44
why wouldn’t i be able to call it from outside
Joel Bemis
@jbemis
Feb 22 2016 10:47
even trying what you had suggested isn’t working
Medha Bobbili
@medhatrinky
Feb 22 2016 10:47
target the parent using jquery @kay78
Joel Bemis
@jbemis
Feb 22 2016 10:47
will read the article
Christian-Peter
@cpheimbach
Feb 22 2016 10:49
Good morning campers
Robert Uivarosi
@URobert
Feb 22 2016 10:50
@jbemis @cla63 setTimeout(function(){ alert("Hello"); }, 1000); works fine. You just have to include jquery
in codepen, if that is where you are coding
@cpheimbach good morning
cla63
@cla63
Feb 22 2016 10:50

@jbemis $(document).ready(function() {

$('#start').bind('click', function() {
  FadeOut();

});

function FadeOut(){
setTimeout(function() {
$('p').fadeOut();}, 2000);
}
});

That work
Pete
@petegarvin1
Feb 22 2016 11:17
Hi all, hope everyone is in the zone today! :D
long day coding yesterday - proper head banging day
i hear it gets better...
hoping someone can help me with a toggle function - I'm halfway through my weather app, I have it so that when you search location, it brings in the temperature in celsius. I also have it so if you click the 'C' it will change the temperature to farenheight. But, I can't change it back with another click! any ideas... http://codepen.io/petegarvin1/pen/qbzaQK
kangyao
@kay78
Feb 22 2016 11:28
@medhatrinky i think your script is right, it targets parent one level up
h4r1m4u
@h4r1m4u
Feb 22 2016 11:47
@Spacecamel100
    //unit toggle
   $("#unit").on("click", function() {
     if ($(this).text() == "F") {
        var temp = jsonData.main.temp - 273.15;
        var celc = temp.toFixed(1);
        $(".temp").html(celc + "o".sup());
        $("#unit").html("C");
     } else {
        var temp2 = jsonData.main.temp - 241.15;
        var far = temp2.toFixed(1);
        $(".temp").html(far + "o".sup());
        $("#unit").html("F");       
     }
KacperPorembski
@KacperPorembski
Feb 22 2016 11:52
guys. I have a problem with my codepen. I reloaded the page and after that in my editor view i can't see the project insted there is just "loading..." sinage. Maybe you had it, maybe you know sth ?
h4r1m4u
@h4r1m4u
Feb 22 2016 11:54
@KacperPorembski that sounds like a possible syntax issue in your JS
KacperPorembski
@KacperPorembski
Feb 22 2016 11:54
@h4r1m4u true. Thank you ;)
CamperBot
@camperbot
Feb 22 2016 11:54
kacperporembski sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1457 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 22 2016 11:55
np
Pete
@petegarvin1
Feb 22 2016 11:56
amazing, thanks so much @h4r1m4u
CamperBot
@camperbot
Feb 22 2016 11:56
spacecamel100 sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1458 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 22 2016 11:56
@Spacecamel100 np. do you understand why it works?
Pete
@petegarvin1
Feb 22 2016 11:57
was just going to ask - for the most part i think i do.. but how does the $(this) bit work
what is that referencing?
h4r1m4u
@h4r1m4u
Feb 22 2016 11:57
if ($(this).text() == "F") { this here stands for the DOM element you click on. text() gets its value
Pete
@petegarvin1
Feb 22 2016 11:58
ah ok, that makes sense, i've seen 'this' used before. Good to know it refs what you click on
although how does that work when there are multiple buttons on a page?
h4r1m4u
@h4r1m4u
Feb 22 2016 11:59
so we're checking if the value of your temp toggle button is 'F'. if yes, we make it display the Celsius temp and change the text of the button to C. if it's not F (meaning it's C), we display the Fahrenheit temp and change the button to F.
Pete
@petegarvin1
Feb 22 2016 11:59
ie, if you clicked the get weather button, would it change this part?
h4r1m4u
@h4r1m4u
Feb 22 2016 11:59
it refers to the object that the click handler is bound to
Pete
@petegarvin1
Feb 22 2016 11:59
the text would not be 'F', and so it would try to change the temp unit to F?
h4r1m4u
@h4r1m4u
Feb 22 2016 11:59
so in your case "#unit"
Pete
@petegarvin1
Feb 22 2016 11:59
ahh, ok
gotcha
h4r1m4u
@h4r1m4u
Feb 22 2016 11:59
cool
Pete
@petegarvin1
Feb 22 2016 11:59
yep, it all makes sense. Appreciate the help
h4r1m4u
@h4r1m4u
Feb 22 2016 12:00
no worries
Pete
@petegarvin1
Feb 22 2016 12:00
also, love the picture :D
h4r1m4u
@h4r1m4u
Feb 22 2016 12:00
thanks! :D
Pete
@petegarvin1
Feb 22 2016 12:01
can i also ask
do we need to re-specify the temp and cell variables in the toggle function, given that the toggle function sits within the get weather function and as such would be able to use it's local variables?
celc, not cell*
Pragya
@Rispledente
Feb 22 2016 12:03
How do I add the image so that I can add it to the pen?? I mean, does it need to be a web image, if not where and how do I need to upload a new image?
h4r1m4u
@h4r1m4u
Feb 22 2016 12:04
you probably could do that but generally it's not a great idea. generally, you want variables to be limited to the scope of the function. but yes, it would be possible.
Pete
@petegarvin1
Feb 22 2016 12:04
ok great - just for my understanding
thanks again!
h4r1m4u
@h4r1m4u
Feb 22 2016 12:04
@Rispledente you could use dropbox or http://postimage.org to host your images
@Spacecamel100 my pleasure
Pragya
@Rispledente
Feb 22 2016 12:05
@h4r1m4u Thank You!! :)
CamperBot
@camperbot
Feb 22 2016 12:05
rispledente sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1459 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
Marius Brad
@mbrad26
Feb 22 2016 12:06
hello world
CamperBot
@camperbot
Feb 22 2016 12:06

welcome to FreeCodeCamp @mbrad26!

Marius Brad
@mbrad26
Feb 22 2016 12:08
Could someone give me a bit of advice on how to center my Weather app on page? http://codepen.io/mbrad26/pen/eJaGRL?editors=0011
Marius Brad
@mbrad26
Feb 22 2016 12:16
Managed to do it myself. Thanks guys.
Pete
@petegarvin1
Feb 22 2016 12:16
@mbrad26 does setting margin-left and margin-right to auto help?
ah, just seen that, glad you've solved :D
Marius Brad
@mbrad26
Feb 22 2016 12:19
All i did was to apply margin and width to the row div (parrent div).
Pete
@petegarvin1
Feb 22 2016 12:20
cool
Thabani Manzini
@ThabaniM
Feb 22 2016 12:30
Hello everyone, I am having troubling toggling between degrees and celsius on weather app. It only changes unit on the first click then remains the same
greg
@wearenotgroot
Feb 22 2016 12:49
@ThabaniM did you figured it out yet?
@ThabaniM try and use .innerHTML instead of .text
@ThabaniM also you can do this to get access to the button
Dulshani Gunawardhana
@dshgna
Feb 22 2016 12:50
thanks @h4r1m4u
CamperBot
@camperbot
Feb 22 2016 12:50
dshgna sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1460 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
Thabani Manzini
@ThabaniM
Feb 22 2016 12:50
@wearenotgroot nope, i have used both and still only works once
greg
@wearenotgroot
Feb 22 2016 12:50
@ThabaniM
$('#convert').click(function(e) {
         var btn = e.target;
         });
@ThabaniM try this then
$('#convert').click(function(e) {
          if (e.target.innerHTML === "C") {
             e.target.innerHTML="F";
            console.log(e.target.innerHTML);

            }
            else
           {
               e.target.innerHTML ="C";
                console.log(e.target.innerHTML);
             }
         });
Thabani Manzini
@ThabaniM
Feb 22 2016 12:52
@wearenotgroot this is what I have for a closer look
Thabani Manzini
@ThabaniM
Feb 22 2016 13:01
@wearenotgroot thank you it seems your way works not sure why though
CamperBot
@camperbot
Feb 22 2016 13:01
thabanim sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star: 926 | @wearenotgroot | http://www.freecodecamp.com/wearenotgroot
greg
@wearenotgroot
Feb 22 2016 13:02
@ThabaniM well if you add an argument to the function/callback on the click, you get access to the element that was triggered by that event
@ThabaniM with $(this) can sometime be tricky to use cause it change on the context on where and how it is access
Dave
@db001
Feb 22 2016 13:07
@kay78 Have you got a browser extension such as HTTPS everywhere? If so you need to disable it, that's the problem I had.
Christian-Peter
@cpheimbach
Feb 22 2016 14:31
hello all
I try to find a way to prevent a bug in my pomodoroclock
I like to prevent the breakpoints of certain pixel width and elements
for example I dont' want that the + and - buttons behave independently in the pomodoro time and pause time section
at 990px width the plus button of pomodoro goes to the second row breaking the layout
h4r1m4u
@h4r1m4u
Feb 22 2016 14:39
@cpheimbach it happens because there's simply not enough space in the column to accommodate the button. but you can change your col-sm-6 divs to col-md-6
that way they'll stack under each other on the md screens already
Nicolas S.
@Nic48
Feb 22 2016 14:40
hey guys ive got a question concerning the front end exercises
h4r1m4u
@h4r1m4u
Feb 22 2016 14:41
@cpheimbach i like your choice of colors and fonts, btw, it's looking great
Nicolas S.
@Nic48
Feb 22 2016 14:42
1 eye for of 1 eye. is a palindrome right ?
Christian-Peter
@cpheimbach
Feb 22 2016 14:42
that is great
is there as well a way to make font sizes small globally?
let's say make the fonts and symbols smaller
I used em values in the ope that would work
h4r1m4u
@h4r1m4u
Feb 22 2016 14:46
@cpheimbach you'll have to use media queries for that. the em units only scale the font in relation to the font size of the element's parent element
Christian-Peter
@cpheimbach
Feb 22 2016 14:46
@h4r1m4u Thank you !
CamperBot
@camperbot
Feb 22 2016 14:46
cpheimbach sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1461 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
Christian-Peter
@cpheimbach
Feb 22 2016 14:46
I will keep that for now and tweak the design
h4r1m4u
@h4r1m4u
Feb 22 2016 14:46
@Nic48 it depends on the definition. if you allow numbers in your palindroms, it's not. if you only allow letters, it is
Christian-Peter
@cpheimbach
Feb 22 2016 14:46
I want to ship now the timer :)
h4r1m4u
@h4r1m4u
Feb 22 2016 14:46
@cpheimbach my pleasure. it's looking very pretty
@Nic48 if i remember correctly, the palindrome challenge on FCC does take both letters and numbers into account, so your example wouldn't be a palindrome for the purpose of the challenge
(unless they changed it, it's been a while since i did it)
Kevin
@kevinandr
Feb 22 2016 14:59
hello :smile: , anyone could help me whit my code?
this is my code: http://codepen.io/kevin_andr/pen/gPNKXa
and i want to make the thumbnail looks like this: http://codepen.io/FreeCodeCamp/full/wMQrXV
but i don't know how :confused:
Aqsa
@AqsaJaved
Feb 22 2016 15:03
Hi everyone. Please review my basic front end project on Portfolio.http://codepen.io/Aqsa-Javed/pen/OMYomY
Andrea Stringham
@astringham
Feb 22 2016 15:03
@kevinandr I’m not sure exactly what you want to change. are you wanting to remove the background color from behind the pic?
Kevin
@kevinandr
Feb 22 2016 15:04
@astringham it's because when i go to the full page, has a big blank space between the pic and the margin
i don't want it
Andrea Stringham
@astringham
Feb 22 2016 15:06
oh do you mean between the pic and where it says “the physics genius”?
Kevin
@kevinandr
Feb 22 2016 15:06
it's the blank space in the sides
Andrea Stringham
@astringham
Feb 22 2016 15:07
oh ok gotcha
I think the issue you’re seeing is that the size of the picture is maxed out, so it stops expanding
it’s a larger file and should fix the problem
Kevin
@kevinandr
Feb 22 2016 15:12
Thanks @astringham
CamperBot
@camperbot
Feb 22 2016 15:12
kevinandr sends brownie points to @astringham :sparkles: :thumbsup: :sparkles:
:star: 137 | @astringham | http://www.freecodecamp.com/astringham
Pete
@petegarvin1
Feb 22 2016 15:13
hey all, i'm 99% done on my weather app :D. Can anyone help me with a last issue - when i first enter a city and click 'get weather ' everything pulls through fine, and you can toggle the temp units by clicking the letter fine. BUT, if i then click the 'get weather' button again (to search a new city, or check the same one), it pulls the data in but stops the temp units toggle working... Interestingly, if I click the 'get weather ' button a third time, the toggle works again. Any ideas? http://codepen.io/petegarvin1/pen/qbzaQK
Franco Zapata
@Francozt01
Feb 22 2016 15:25
@kevinandr u should add some padding to ur container-fluid
David Weedmark
@DavidWeedmark
Feb 22 2016 15:27
just digging into the twitch.tv project. there must be a more elegant way to do this using jquery .each() or forEach, but it's eluding me this morning http://codepen.io/weedmark/pen/yedyoO?editors=1111
Franco Zapata
@Francozt01
Feb 22 2016 15:30
@kevinandr way better! :+1: play with the screen size to see what else needs some padding
like quote at the end
Kevin
@kevinandr
Feb 22 2016 15:30
Kay :smile_cat:
Franco Zapata
@Francozt01
Feb 22 2016 15:31
just a litle :D
David Weedmark
@DavidWeedmark
Feb 22 2016 15:31
@kevinandr looks good. the only thing is the iframe isn't scaling well when I reduce the window. maybe try making the height: auto?
Kevin
@kevinandr
Feb 22 2016 15:32
@DavidWeedmark That's what I was going to say, but when i put auto, it is very small
David Weedmark
@DavidWeedmark
Feb 22 2016 15:33
have you tried setting the width to whatever percent you need? like 90% and then height at auto?
Franco Zapata
@Francozt01
Feb 22 2016 15:35
also ur col-xs-6 should be col-xs-12 so it changes to 1 col when the screen is x-small (mobile) u can use 2 classes like col-sm-6 and col-xs-12 and fix how it looks when the screen change to mobile 1 col over the other to be centered
Kevin
@kevinandr
Feb 22 2016 15:37
Thanks @Francozt01 ^^
CamperBot
@camperbot
Feb 22 2016 15:37
kevinandr sends brownie points to @francozt01 :sparkles: :thumbsup: :sparkles:
David Weedmark
@DavidWeedmark
Feb 22 2016 15:37
@kevinandr I recently put a couple iframes on a client site for youtube vids if you want to take a look at the code http://nicole-deschamps.com/
CamperBot
@camperbot
Feb 22 2016 15:37
:star: 553 | @francozt01 | http://www.freecodecamp.com/francozt01
Franco Zapata
@Francozt01
Feb 22 2016 15:37
a part of the video player disappear from the screen when the screen get smaller
Kevin
@kevinandr
Feb 22 2016 15:37
@DavidWeedmark , i did what u told me but now he is to large and small :P
Michael Nazari
@mikenaza
Feb 22 2016 15:39
Can someone critique my portfolio?http://s.codepen.io/mikenaza/debug/yeWZZx#
Franco Zapata
@Francozt01
Feb 22 2016 15:39
@DavidWeedmark its ok if i ask how much did that site cost? :D
Pete
@petegarvin1
Feb 22 2016 15:40
hey @mikenaza - looks great! One comment if I'm being picky is that your name doesn't stand out too well on the main page as it is sitting over the keyboard and the colours are similar
@mikenaza love the page to store your projects :+1:
Michael Nazari
@mikenaza
Feb 22 2016 15:41
@Spacecamel100 thanks
CamperBot
@camperbot
Feb 22 2016 15:41
mikenaza sends brownie points to @spacecamel100 :sparkles: :thumbsup: :sparkles:
:star: 301 | @spacecamel100 | http://www.freecodecamp.com/spacecamel100
David Weedmark
@DavidWeedmark
Feb 22 2016 15:41
@Francozt01 she was getting quotes for exactly what's there. one page with an audio player and youtube links for $800 to $1200.
Michael Nazari
@mikenaza
Feb 22 2016 15:41
I tried to put a shadow on a name to make it pop a little
Franco Zapata
@Francozt01
Feb 22 2016 15:42
@mikenaza if u are using bootstrap make ur image responsive with the classes "img" and "img-responsive"
@DavidWeedmark good to know thanks :D
CamperBot
@camperbot
Feb 22 2016 15:42
francozt01 sends brownie points to @davidweedmark :sparkles: :thumbsup: :sparkles:
:star: 350 | @davidweedmark | http://www.freecodecamp.com/davidweedmark
Michael Nazari
@mikenaza
Feb 22 2016 15:42
@Francozt01 even for background images?
Franco Zapata
@Francozt01
Feb 22 2016 15:43
@mikenaza also play with the screen size and check the sites response
no just for ur profile picture
Michael Nazari
@mikenaza
Feb 22 2016 15:43
@okay thanks
CamperBot
@camperbot
Feb 22 2016 15:43
mikenaza sends brownie points to @okay :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for okay
Michael Nazari
@mikenaza
Feb 22 2016 15:43
@Francozt01 thanks, I'll try it out
CamperBot
@camperbot
Feb 22 2016 15:43
mikenaza sends brownie points to @francozt01 :sparkles: :thumbsup: :sparkles:
:star: 554 | @francozt01 | http://www.freecodecamp.com/francozt01
Franco Zapata
@Francozt01
Feb 22 2016 15:46
ur background images add this
 #Home {
  background: url( "image link goes here") no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
@mikenaza
Michael Nazari
@mikenaza
Feb 22 2016 15:47
@Francozt01 Should I add it to the existing code? Or replace the existing code with this
Franco Zapata
@Francozt01
Feb 22 2016 15:49
@mikenaza u can change the background-image and add the -o-background-size -webkit-back and -moz-back u already have background-size:cover;

@mikenaza use this one without "fixed"

background: url( "image link goes here") no-repeat center center;

Michael Nazari
@mikenaza
Feb 22 2016 15:52
@Francozt01 Okay, so this makes the image more responsive I assume?
Franco Zapata
@Francozt01
Feb 22 2016 15:53
when u resize the screen it keeps the image centered
otherwise the image starts hidding to the right
Michael Nazari
@mikenaza
Feb 22 2016 15:54
@Francozt01 Ahh good to know, thanks again!
CamperBot
@camperbot
Feb 22 2016 15:54
mikenaza sends brownie points to @francozt01 :sparkles: :thumbsup: :sparkles:
:warning: mikenaza already gave francozt01 points
Franco Zapata
@Francozt01
Feb 22 2016 15:54
and the no-repeat keeps that with only 1 image instead of adding again the same imag to fill the extra pixels of the screen
Michael Nazari
@mikenaza
Feb 22 2016 15:56
awesome, I noticed that was happening to the images so I stretched them to fit with width/height
Franco Zapata
@Francozt01
Feb 22 2016 15:56
@mikenaza search about mobile bootstrap menu because when ur screen get smaller ur menu change
Michael Nazari
@mikenaza
Feb 22 2016 15:56
I knew it wasn't a sustainable way to fix the issue but I just went with it
Will do, yea a menu will be much better rather than the item stacking
Franco Zapata
@Francozt01
Feb 22 2016 15:58
good luck
:+1:
Kevin
@kevinandr
Feb 22 2016 16:01
yeah, finally finished ^^
Thanks guys for the help
Michael Nazari
@mikenaza
Feb 22 2016 16:08
@kevinandr Looks great! "Coded" at the very bottom is mispelled
Kevin
@kevinandr
Feb 22 2016 16:13
Thanks, I corrected
rodascesar
@cesarrodas
Feb 22 2016 16:20
hey guys i am trying to implement a gallery for my portfolio website using bootstrap, but i cant get the thumbnails and descriptions in the row to be the same height. any advice?
@kevinandr Wow, I really like yours! I did mines on einstein as well. I will probably watch that documentary lol
Granit Hajdini
@nitiblack
Feb 22 2016 16:29
function telephoneCheck(str) {
  var regex = /^(1\W)?(\(\d{3}\)|\d{3})\W?\d{3}\W?\d{4}$/;
  return regex.test(str);
}

if (str ==="1 555)555-555") {
  return false;
}
telephoneCheck("1 555)555-5555") should return false.
can anybody help
Vincent Lingle-Munos
@valmunos
Feb 22 2016 16:35
I can help
Granit Hajdini
@nitiblack
Feb 22 2016 16:36
what to do
Vincent Lingle-Munos
@valmunos
Feb 22 2016 16:36
it's returning your second line of code (ie return regex.test(str);)
h4r1m4u
@h4r1m4u
Feb 22 2016 16:37
@nitiblack you closed the function before the if statement:
```
function telephoneCheck(str) {
  var regex = /^(1\W)?(\(\d{3}\)|\d{3})\W?\d{3}\W?\d{4}$/;
  return regex.test(str);

  if (str ==="1 555)555-555") {
    return false;
  }

}
Vincent Lingle-Munos
@valmunos
Feb 22 2016 16:37
if you're trying to get it to run the if statement you wrote, you'll need to comment out your first return statement
and, yes, place it within the brackets
As @h4r1m4u said
Granit Hajdini
@nitiblack
Feb 22 2016 16:38
@h4r1m4u don't work this
h4r1m4u
@h4r1m4u
Feb 22 2016 16:39
sorry, it's because you're returning the regex first, you need to reorder it:
function telephoneCheck(str) {

  if (str ==="1 555)555-555") {
    return false;
  }

  var regex = /^(1\W)?(\(\d{3}\)|\d{3})\W?\d{3}\W?\d{4}$/;
  return regex.test(str);

}
Granit Hajdini
@nitiblack
Feb 22 2016 16:41
@h4r1m4u this should telephoneCheck("1 555)555-5555") should return false.
h4r1m4u
@h4r1m4u
Feb 22 2016 16:41
1 555)555-555 or 1 555)555-5555?
Granit Hajdini
@nitiblack
Feb 22 2016 16:42
thanks @h4r1m4u
CamperBot
@camperbot
Feb 22 2016 16:42
nitiblack sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1462 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 22 2016 16:42
:thumbsup:
Granit Hajdini
@nitiblack
Feb 22 2016 16:44
function singleMode(x) {

  cum += x;
  if (cum === x) {
      return add;
  }
  else {
      return cum;
  }
}
var cum = 0;
function add() {

    if (arguments[0] === Number(arguments[0])) {

        if (arguments[1] === undefined) {
            return singleMode(arguments[0]);
        }
        if (arguments[1] !== Number(arguments[1])) {      
            return undefined;
        }
        if (arguments[1] == Number(arguments[1])) {
            console.log('hi');
            var sum = arguments[0] + arguments[1];
            return sum;
        }        
    }

    else {
        return undefined;
    }  
}



add(2)(3);
add(2, 3) should return 5.
add(2)(3) should return 5.
add("http://bit.ly/IqT6zt") should return undefined.
add(2, "3") should return undefined.
add(2)([3]) should return undefined.
can anybody help\
Sujit Karki
@Swoozeki
Feb 22 2016 16:59
@nitiblack your variable "cum" :clap: should be defined before singleMode()
greg
@wearenotgroot
Feb 22 2016 17:00
0_0
rodascesar
@cesarrodas
Feb 22 2016 17:02
can someone help me make the gallery elements the same height? I have been trying for a while.
h4r1m4u
@h4r1m4u
Feb 22 2016 17:05
@cesarrodas you could force them to be the same height, but they'll be sorted. you should resize the troll image in photoshop or gimp first
CamperBot
@camperbot
Feb 22 2016 17:05
:trollface: troll problems? notify admins here
h4r1m4u
@h4r1m4u
Feb 22 2016 17:05
quiet, camperbot
rodascesar
@cesarrodas
Feb 22 2016 17:08
@h4r1m4u I tried that yesterday, but with the einstein image. instead of fitting perfectly the thing put white borders on it. :/ I will try with both this time. not very good at image manipulation though. do you know a place where to upload my pictures and use them with codepen? I did it with flickr.
h4r1m4u
@h4r1m4u
Feb 22 2016 17:09
@cesarrodas you can use dropbox or http://postimage.org to host your images. if you did want to force the image to be the same height, you could do something like this:
.portfolio-row-1 img {
  min-height: 194px;
}
but yeah, it's better to photoshop the images first and make sure they both have the same dimensions. then you won't have these issues
the min-height will work, but since the entire page rescales at different resolutions, you'll have to set the min-height for all your different breakpoints
rodascesar
@cesarrodas
Feb 22 2016 17:13
you can use dropbox for that? awesome. I had no idea. I see what you are saying. damn. xD I have wasted so much time on this project lol
@h4r1m4u Thanks a bunch man, can I message you if it doesn't work again?
CamperBot
@camperbot
Feb 22 2016 17:13
cesarrodas sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1463 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 22 2016 17:15
@cesarrodas time spent learning is not wasted ;) yeah, dropbox works fine. you just need to share the file and then use its url. you can post here in the channel, i frequent it here quite a bit, so i'm likely to reply to you (though i'm about to go to bed now). if not me, there's always someone helpful here
rodascesar
@cesarrodas
Feb 22 2016 17:15
alright awesome.
theone
@theoneinskane
Feb 22 2016 17:16
hi all, still plugging away at my portfolio page, one last issue I need help with...
When I resize the window to small to check the responsiveness the text decoration of underline when hovering over some links comes back.
I have tried ```
I have tried text-decoration: none;
but it doesn't seem to go away, anyone have some ideas how to fix this? I am guessing it is in bootstrap somewhere..... maybe inline css is the only way?
Valérian Fauqueur
@valerianfauqueur
Feb 22 2016 17:24
Hello guys ! :)
Alex Gaudiosi
@alexgaudiosi
Feb 22 2016 17:27
@theoneinskane you could use !important, not usually recommended but sometimes a quick fix
Aaron Kazah
@AaronKazah
Feb 22 2016 17:29
@h4r1m4u dude, you're awesome man
thanks for the reply
I'll go with your advice
really makes more sense
Sorry for the initial confusion, I just wanted a few people to test it out heavily for bugs, before I even released an MVP to a select public
Valérian Fauqueur
@valerianfauqueur
Feb 22 2016 17:30
I have a problem with routing with Angular, no error but my template doesn't load in my div which contain ng-view someone can help ?
please
theone
@theoneinskane
Feb 22 2016 17:33
@alexgaudiosi tried that, didn't work :(
Aaron Kazah
@AaronKazah
Feb 22 2016 17:33
@theoneinskane
post your code here
@AaronKazah its the text with the project thumbnails that highlights with the line underneath it when I hover. And only on the smaller screen. Weird
Aaron Kazah
@AaronKazah
Feb 22 2016 17:37
I just went throuh your project
Vincent Lingle-Munos
@valmunos
Feb 22 2016 17:37

working on the weather app... does anybody have any advice for converting the JSON data to imagery??

http://codepen.io/valmunos/pen/zrVMLx

Aaron Kazah
@AaronKazah
Feb 22 2016 17:39
@theoneinskane
fixed it
theone
@theoneinskane
Feb 22 2016 17:39
@AaronKazah how?
Aaron Kazah
@AaronKazah
Feb 22 2016 17:39
a:hover {
color: #383838;
text-decoration:none;
}
theone
@theoneinskane
Feb 22 2016 17:39
:)
Aaron Kazah
@AaronKazah
Feb 22 2016 17:39
on line 38
swap my code
with the existing ones
also for listing your projects
I'd suggest you look into nth-of-child
and consider using classes instead of Id's
greg
@wearenotgroot
Feb 22 2016 17:41
@valmunos just access it like an object
theone
@theoneinskane
Feb 22 2016 17:42
@AaronKazah many thanks, although I was sure I tried that but now it works! Very weird!
CamperBot
@camperbot
Feb 22 2016 17:42
theoneinskane sends brownie points to @aaronkazah :sparkles: :thumbsup: :sparkles:
:star: 253 | @aaronkazah | http://www.freecodecamp.com/aaronkazah
greg
@wearenotgroot
Feb 22 2016 17:42
@valmunos for temperature, in your case json.main.temp for example
theone
@theoneinskane
Feb 22 2016 17:42
What do you mean the nth child? It's not a list.... it's a row of divs....
Aaron Kazah
@AaronKazah
Feb 22 2016 17:43
@theoneinskane thanks
CamperBot
@camperbot
Feb 22 2016 17:43
aaronkazah sends brownie points to @theoneinskane :sparkles: :thumbsup: :sparkles:
:star: 137 | @theoneinskane | http://www.freecodecamp.com/theoneinskane
Aaron Kazah
@AaronKazah
Feb 22 2016 17:43
and using nth of child
say
Vincent Lingle-Munos
@valmunos
Feb 22 2016 17:44
ok
Aaron Kazah
@AaronKazah
Feb 22 2016 17:44
you create one row of div
so an image
for your portfolio
using nth of child, with every new class or every new row
you don't type out everything again
you just add the image to the class in css
instead of typing out width
height
greg
@wearenotgroot
Feb 22 2016 17:44
@valmunos try this $(".message").html(json.main.temp);
Aaron Kazah
@AaronKazah
Feb 22 2016 17:44
margins
etc
theone
@theoneinskane
Feb 22 2016 17:45
hmmmm... I think I sort of understand what you mean.
I went to using id's because I tried applying the css to the overall div and of course it didn't work. So this is how I would get that to work. But what do you mean add the image in the CSS?
I will look it back up in the exercises as I remember seeing it. So it would really make my code much slicker in that section!
thanks! got to run :)
Jas K
@jask84
Feb 22 2016 18:04

Hi everyone. Hope all is good. Wondering if anyone is on the Build a Wikipedia Viewer project or could help me? It has taken me a long time to even begin to understand the mediawiki api and how to call it. I have eventually been able to call up results in a list to the console but still need to figure out how to get page id's for linking etc. I read up that generator could be useful but not sure how to use it
http://codepen.io/jask/pen/bEPzqe?editors=0010

My main issue right now is when I begin to write the code and define my searchWiki function separately like in the weather project, it causes issues and doesnt work at all.
http://codepen.io/jask/pen/xZNbQa

Any tips would be very much appreciated. Apologies for the long request.

h4r1m4u
@h4r1m4u
Feb 22 2016 18:13
@AaronKazah you're most welcome. i'm sure that if you make the MVP semi-private and tell people here that you're looking for test users and send them directly to the signup page (as opposed to newsletter signup form), you'll have some takers. that way you can test it with a limited audience before making it available to the public.
Jas K
@jask84
Feb 22 2016 18:36
hi @h4r1m4u haven't spoken in a while. Hope youre well...
greg
@wearenotgroot
Feb 22 2016 18:50
@jask84 did you resolve the issue?
greg
@wearenotgroot
Feb 22 2016 18:57
@jask84 check your private message!!
h4r1m4u
@h4r1m4u
Feb 22 2016 18:59
@jask84 i'm doing great, how about yourself? how're the challenges going?
Catalin Scripcariu
@CatalinScr
Feb 22 2016 19:27
@GregatGit Thanks man is working finally :)
CamperBot
@camperbot
Feb 22 2016 19:27
catalinscr sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:star: 372 | @gregatgit | http://www.freecodecamp.com/gregatgit
casadaro
@Casadaro
Feb 22 2016 19:35
How should I markup a list of dates and what happened on those day
for example
1914 - Morn in Cresco, Iowa
1933 - Leaves his Family’s farm to attend the University of Minnesota, Thans to a Drpression era program known as the National Youth Administration”
Catalin Scripcariu
@CatalinScr
Feb 22 2016 19:38
Where do you want to markup?
Lanitta
@DivaWeb
Feb 22 2016 19:46
http://codepen.io/DivaWeb/pen/XXOdEX here is a rough draft of my portfolia could you please give any feedback
Sara L
@Sciencesara
Feb 22 2016 19:46
Create an unordered list? @Casadaro
<ul>
<li>A</li>
<li>B</li>
</ul>
Amir Ghafouri
@amirghafouri
Feb 22 2016 19:47
Apparently the photos of my projects don't work: http://codepen.io/amirghafouri/full/pgYyxm/
Can anyone explain why? I took screenshots with snipping tool on windows, saved as png, and uploaded to imgur. They work for me but not on other browsers or for other people
casadaro
@Casadaro
Feb 22 2016 19:47
@CatalinScr something like what is going on here
Sara L
@Sciencesara
Feb 22 2016 19:48
@Casadaro create an unordered list
casadaro
@Casadaro
Feb 22 2016 19:50
Thats what I was thinking @Sciencesara but, i feel like there is a better way. There are some other elements I recall like dictionary, or time, that would enable me to aply CSS to one element and style everything. Or would I just put a span with a class around the date and style the span?
Amir Ghafouri
@amirghafouri
Feb 22 2016 19:50

@Casadaro wrap each date in a span element and give span elements font-weight: bold; in your css

EDIT - probably faster ways, not sure

casadaro
@Casadaro
Feb 22 2016 19:55
@amirghafouri I think your way is the fastest and would seem to be the simplest. I am also thinking about the SEO implication down the road also. I figure if I get in the habbit of using the write atributes now, it will be second nature later. Then I don’t find myself combing over code trying to optimize it for search. For instance their is a email atribute that when used brings up the @ symbol in the keyboard on mobile devices. Some dont use us it, and an etra step is added for the user.
Amir Ghafouri
@amirghafouri
Feb 22 2016 20:01
Where do you guys host your photos? and in what formats do you upload them?
casadaro
@Casadaro
Feb 22 2016 20:07
@amirghafouri I host them on Amazon S3 in either JPG or PNG format
Matthew Bailin
@mdbailin
Feb 22 2016 20:07
Hey I am having trouble referring to the weather's "condition" (clear, sunny, etc.) from the openweathermap API
here is the url
Alex Dobre
@Zerelt
Feb 22 2016 20:08
you mean you want to access the weather values and don;t know how ?
@mdbailin
Matthew Bailin
@mdbailin
Feb 22 2016 20:09
Yes

$(document).ready(function(){

$.getJSON("http://api.openweathermap.org/data/2.5/weather?q=Las%20Vegas&APPID=3ba5a877bb6f03f3cdf17a20f6a425ea", function(data) {
var temp = parseInt(data.main["temp"] -275.15);
var tempName = "C"
$("#weather").append("<h1>"+data.name+"</h1") $("#weather").append("<h2>"+ temp +"\xB0" + tempName +"</h2>")
$("#weather").append("<h2>"+data[1][1])
});

});

Alex Dobre
@Zerelt
Feb 22 2016 20:09
try weather[0].description
Matthew Bailin
@mdbailin
Feb 22 2016 20:09
ok
Alex Dobre
@Zerelt
Feb 22 2016 20:10
that should give you "clear sky" from the link you posted
Matthew Bailin
@mdbailin
Feb 22 2016 20:10
works
Alex Dobre
@Zerelt
Feb 22 2016 20:10
awesome
Matthew Bailin
@mdbailin
Feb 22 2016 20:10
thanks @Zerelt
CamperBot
@camperbot
Feb 22 2016 20:10
mdbailin sends brownie points to @zerelt :sparkles: :thumbsup: :sparkles:
:star: 367 | @zerelt | http://www.freecodecamp.com/zerelt
Alex Dobre
@Zerelt
Feb 22 2016 20:11
can anybody tell me how wrong am i trying to do this ? ... am I on the right track at least ?
http://codepen.io/Zerelt/pen/GobMwq?editors=1010
the Order component isn't rendering anything :/
Mooli
@Mooli88
Feb 22 2016 20:28
hi guys, when building a website with the help of bootstrap or any other framework , should i use Sass to conceal the classes like row, .btn, navbar etc ?
Alex Dobre
@Zerelt
Feb 22 2016 20:31
Sass is necessary only in the react ziplines .. if you want to use scss/sass instead of pure css in other ziplines i guess that's your choice
Jared Abel
@jaredabel
Feb 22 2016 20:36
Can anyone give me a hand working with the wiki json?
Andrew Vanboxel
@avanbox
Feb 22 2016 20:38
i have something small i need help with. I want the subheading <h2> elements to stack on a small screen. When I resize They jumble together. I thought I had it right but i guess not.
Zerka1982
@Zerka1982
Feb 22 2016 20:45
Hello guys, anybody knows well CSS
I need help
Andrew Vanboxel
@avanbox
Feb 22 2016 20:46
Whats up @Zerka1982 Zerka
Zerka1982
@Zerka1982
Feb 22 2016 20:46
I have a problem in the footer side.
after the footer it shows a white rectangle
if anybody could come in private please
Chris
@chrisdav6
Feb 22 2016 20:50
@avanbox just a simple list will do <ul>
<li>Innovator</li>
<li>Entrepreneur</li>
<li>Visionary</li>
</ul>
Andrew Vanboxel
@avanbox
Feb 22 2016 20:51
@chrisdav6 well yeah, but on a large screen id like them on a single line. just on a phone screen I want them to stack
@Zerka1982 can you post a lnk
Zerka1982
@Zerka1982
Feb 22 2016 20:56
it is mixed with php
:(
is that ok ?
Juan Diaz
@LugDroid
Feb 22 2016 21:02
Hello, anyone had problems with cross origin request with the wikipedia project?
I'm getting this error:
XMLHttpRequest cannot load https://en.wikipedia.org/w/api.php?action=query&format=json&list=search&srsearch=london. Origin http://s.codepen.io is not allowed by Access-Control-Allow-Origin.
Jared Abel
@jaredabel
Feb 22 2016 21:04
@LugDroid I am running into the same error in my console
I just can't figure out how to grab my data
Juan Diaz
@LugDroid
Feb 22 2016 21:05
@jaredabel I have the same error on Firefox with local files, but on safari it works ok
I've been searching on google but didn't find any clear solution
Zerka1982
@Zerka1982
Feb 22 2016 21:06
Could anybody suggest a solution, why I have an extra space under my footer ?
my footer is with the black color, and under that there is a white rectangle
blob
As you see the background color of my footer is with the black color
Juan Diaz
@LugDroid
Feb 22 2016 21:10
@jaredabel If I try your search query directly on firefox it works, at least it goes to a JSON file, so the problem is not on the query
Zerka1982
@Zerka1982
Feb 22 2016 21:10
I got an extra white color in the bottom
Jared Abel
@jaredabel
Feb 22 2016 21:14
@LugDroid yeah i am just having an issue actually working with my json, I've taken too long of a break from fcc
ehekatlOf
@ehekatlOf
Feb 22 2016 21:15
hey can someone help me on the wikipedia bonfire?
CamperBot
@camperbot
Feb 22 2016 21:15
type bonfire name to get some info on that bonfire. And check HelpBonfires chatroom
ehekatlOf
@ehekatlOf
Feb 22 2016 21:15
I can't get my script to pass me JSON data to save my life
bonfire wikipedia
CamperBot
@camperbot
Feb 22 2016 21:18
Sorry, can't find a bonfire called wikipedia. [ Check the map? ]
ehekatlOf
@ehekatlOf
Feb 22 2016 21:18
bonfire build
CamperBot
@camperbot
Feb 22 2016 21:18
Sorry, can't find a bonfire called build. [ Check the map? ]
Jared Abel
@jaredabel
Feb 22 2016 21:19
@ehekatlOf I am having the same problem
ehekatlOf
@ehekatlOf
Feb 22 2016 21:19
yeah I'm not sure why
the weather API passed me JSON data just fine
Jared Abel
@jaredabel
Feb 22 2016 21:19
yup, me too
Rafael J. Rodriguez
@Rafase282
Feb 22 2016 21:20
im workign with json data and front end http://www.twitch.tv/rafase282 feedback while I struggle is appreciated
Kevin
@kevinandr
Feb 22 2016 21:42
hello friends ^^
could you please see my code and tell me what you think?
Maddah Anass
@unlimiworks
Feb 22 2016 21:52
Hello guys, i was checking my Random quote generator after some modifications, and I now have a problem with font awesome icons not displaying...
http://codepen.io/UnlimiWorks/pen/GoGLRX
@kevinandr You're using a .container-fluid before your body, which shouldn't be the case.
Also, codepen has an html head already in settings > html
Sujit Karki
@Swoozeki
Feb 22 2016 21:52
@kevinandr Hi, it looks good. However, when the window is resized, the block fixed navigation bar is not responsive
@kevinandr and also, the contents in your portfolio are not easy on the eyes due to the background-colors and your plain black text color
Maddah Anass
@unlimiworks
Feb 22 2016 21:55
@kevinandr Also, you're missing a body closing tag
Sujit Karki
@Swoozeki
Feb 22 2016 21:55
@kevinandr actually, a lot of the website is not very responsive on mobile or tablet size
Kevin
@kevinandr
Feb 22 2016 21:57
Thanks guys ^^ i will work to fix this things
Sujit Karki
@Swoozeki
Feb 22 2016 21:57
@UnlimiWorks which icons are not displaying?
Maddah Anass
@unlimiworks
Feb 22 2016 21:58
@Swoozeki The font awesome icons (i have 3: a blockquote, a twitter icon and a 'reload' icon
Sujit Karki
@Swoozeki
Feb 22 2016 21:58
it all displays on my end
@UnlimiWorks
Maddah Anass
@unlimiworks
Feb 22 2016 21:59
I see. it must be a cache problem.
@kevinandr Alright. Also, design wise, the text is hard to read in some parts
Caleb Martin
@caleb272
Feb 22 2016 22:11
for the quote generator are we expected to us a api?
Maddah Anass
@unlimiworks
Feb 22 2016 22:11
@caleb272 After the projects update, yes
Caleb Martin
@caleb272
Feb 22 2016 22:11
what do you mean
@UnlimiWorks
drdaveg
@drdaveg
Feb 22 2016 22:12
Hi. I am have been stuck on a CORS issue for weeks. Trying to to do the Wikipedia assignment. Adding xhr.setRequestHeader('Access-Control-Allow-Origin','https://s.codepen.io') in Javascript doesn't help and we can't reconfigure codepen - so what do I do? Do I really need to embed JSONP to do this? Does someone have a GOOD tutrial for JSONP?
Maddah Anass
@unlimiworks
Feb 22 2016 22:12
@caleb272 Before, the quote generator was suggested before the JSON APIs andAJAX section. But now it's suggested after that
Caleb Martin
@caleb272
Feb 22 2016 22:13
ya i did the AJAX stuff i was just wondering
i will use the ap
i guess i will find a api to use
Maddah Anass
@unlimiworks
Feb 22 2016 22:14
@caleb272 Alright :) There is the forismatic api, and also the internet chuck norris database API
These are what I found to be the least limitating
Caleb Martin
@caleb272
Feb 22 2016 22:14
k thanks
Sujit Karki
@Swoozeki
Feb 22 2016 22:14
@caleb272 yup, what I did was declare a variable to an array to 15 different quotes, and chose random ones from there. So much easier, haha :D
Caleb Martin
@caleb272
Feb 22 2016 22:15
ya i may do that because i want to have controll over the quotes i show
i have some really good noes
ones
Maddah Anass
@unlimiworks
Feb 22 2016 22:15
what @Swoozeki said is very relevant, I did that for starters, then i introduced the API calls after that
Caleb Martin
@caleb272
Feb 22 2016 22:15
k i will just make an array of quotes and go from there
Richard Corbett
@reacorbett
Feb 22 2016 22:16

var arr =[[1,2],[3,4],[5,6]];

what is the arr.lenght? is it 5?

Maddah Anass
@unlimiworks
Feb 22 2016 22:16
3
Caleb Martin
@caleb272
Feb 22 2016 22:16
3
Maddah Anass
@unlimiworks
Feb 22 2016 22:16
@drdaveg I wish I can help you. I'm just beginning that project. I'll be sure to inform you if i ever bump into that problem and fix it.
Caleb Martin
@caleb272
Feb 22 2016 22:17
are there any good places to get flat icons that i can just link into my project instead of downloading them
drdaveg
@drdaveg
Feb 22 2016 22:17
thx. been stuck on it for WEEKS
Caleb Martin
@caleb272
Feb 22 2016 22:18

so is this jquary code ```
$(document).ready(function (){

})

or is that JS
and can you explain the difference
Maddah Anass
@unlimiworks
Feb 22 2016 22:20
@caleb272 You can use font awesome, or bootstrap's glyphicons
Caleb Martin
@caleb272
Feb 22 2016 22:20
k thanks @UnlimiWorks
CamperBot
@camperbot
Feb 22 2016 22:20
caleb272 sends brownie points to @unlimiworks :sparkles: :thumbsup: :sparkles:
:star: 310 | @unlimiworks | http://www.freecodecamp.com/unlimiworks
Maddah Anass
@unlimiworks
Feb 22 2016 22:21
Also, that's jquery. You can see the usage of the $. That's specific to jquery
Caleb Martin
@caleb272
Feb 22 2016 22:21
how do i use font awesome
Maddah Anass
@unlimiworks
Feb 22 2016 22:22
Check out 'responsive design with bootstrap' on FCC. there's a font awesome tutorial there
Maddah Anass
@unlimiworks
Feb 22 2016 22:23
Also, check out their website
Billy
@billywaite
Feb 22 2016 22:24
paste the stylesheet in your css
*html
does anyone know how to share quotes to twitter in teh random quote project? I used an ajax api to get random quotes and all I can figure out is how to twee tthe link to my project
ehekatlOf
@ehekatlOf
Feb 22 2016 22:30
anybody do the wikipedia API project successfully?
Andrew Charlebois
@andrewchar
Feb 22 2016 22:30
anyone here use Heroku and Firebase
Caleb Martin
@caleb272
Feb 22 2016 22:33
can someone tell me why this wont change the text
o i got it. i didn’t have JQURY enabled
Jonathan
@jxvo92
Feb 22 2016 22:48
http://codepen.io/jxvo/pen/gPEpYW Local Weather App: need help switching (from F-C or C-F units) after clicking on the <a> to the right of the temperature. the .click function doesn't seem to be working
(Opening the link in a new tab should get the location info
Caleb Martin
@caleb272
Feb 22 2016 22:52
can someone test out my quote machine http://codepen.io/thecoder15/full/JGQVJJ
its still in the early stakes
stages
Pawan
@pawan92
Feb 22 2016 23:07
@caleb272 it sucks did you try turning it on and off
Caleb Martin
@caleb272
Feb 22 2016 23:40
haha
Dustin Frank
@DustInCompetent
Feb 22 2016 23:41
@caleb272 It works but it's hurting my eyes.
Caleb Martin
@caleb272
Feb 22 2016 23:41
did you look at it when it said “get to work . you thought you where going to get a quote"
how do you open a twitter thing
?
brb
Billy
@billywaite
Feb 22 2016 23:47
i can't figure the twitter api out, i can get it to tweet, but not tweet the quote/author