These are chat archives for FreeCodeCamp/HelpFrontEnd

8th
Aug 2016
soroush behmardi
@soori8
Aug 08 2016 00:05
@ndburrus they are what i looking for. so so thanks
CamperBot
@camperbot
Aug 08 2016 00:05
soori8 sends brownie points to @ndburrus :sparkles: :thumbsup: :sparkles:
:star2: 1433 | @ndburrus |http://www.freecodecamp.com/ndburrus
Norvin Burrus
@ndburrus
Aug 08 2016 00:05
@soori8 you're welcome! enjoy! :palm_tree:
Vince
@Vince33
Aug 08 2016 00:11
hey so any webpack config ninjas around
?
Norvin Burrus
@ndburrus
Aug 08 2016 01:32
Juan Moraza
@Morazajuan
Aug 08 2016 02:21
how can i run this first
var city;
  var state;
  var tem = "c";  
  var tem2 = "f";




  function locator (){
$.getJSON('http://ipinfo.io', function(data){
console.log(data);
city = JSON.stringify(data.city);
alert(city);
});
}

  function myFunction() {
    var x = document.getElementById("myText").value;
    document.getElementById("demo").innerHTML = x;

}


  $('#btnChoos').click(function( ){
    city = prompt("Type City name");
    state = prompt("Type State name");
    $("#img1").remove();

     $("#btnChoos").empty().append("Choose a different location");  

      $("#contianer1").empty();



      $.simpleWeather({
    location: city + ","+state,
    woeid: '',
    unit: "c",
    success: function(weather) {
      $("#container1").empty();

      $(".weather").empty().append('</li></ul>'+'<i class="icon-'+weather.code+'"></i>'+"<div class='hey' id='tempe'>"+"<div class='tempc'>"+"<h2 >" + weather.temp+"&deg;"+weather.units.temp+"</h2>"+"</div>"+"</div>"+'<button id="btnCF">Celcius/Farhenghit</button>'+'<ul><li>'+weather.city+', '+weather.region+'</li>'+'<li class="currently">'+weather.currently+'</li>'+ '<li>'+weather.wind.direction+' '+weather.wind.speed+' '+weather.units.speed);



      $("#weather").html(html);
    },


    error: function(error) {
      $("#weather").html('<p>'+error+'</p>');
    }
  });  
        $.simpleWeather({
    location: city + ","+state,

    unit:'f',
         success: function(weather) {

      $("#tempe").append("<div class='tempf'>"+"<h2>" + weather.temp+"&deg;"+weather.units.temp+"</h2>"+"</div>");


    }});


  });
then this
$(window).load(function(){
    $('.hey').hide();

$('.btnn').click(function(){
        $('.btnn').hide();
        $('.btnn2').show();

});
  $('.btnn2').click(function(){
        $('.btnn2').hide();
        $('.btnn').show();

});
   });
Eternalink
@Eternalink
Aug 08 2016 03:31
Hey everyone
I'm trying to complete the Build a Tribute Page challenge
can you tell me why multiple col-sm- and col-md- .... is used on line ten? like below:
<div class="col-xs-12 col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2">
Joel Santos
@St3ps
Aug 08 2016 03:51
@Eternalink
here's wht i think.
First, this is bootstrap framework, so, when you place bootstrap in your site, it gives these new nifty classes you can use to structure your html in a simple grid-like fashion. in short. I guess. The bootstrap classes used in that div are trying to make a grid. That div is nothing but a row, of sorts. A very responsive div.
So, in that line, you have a div which have multiple classes:
col-xs-12, ("if it's a cellphone, this div will totally occupy the row
col-sm-10("if it's a tablet, (i think?), it will almost occupy the row, leaving 2 cells
col-sm-offset-1("if it's a tablet, push the row 1 cell
col-md-8 ("If its a ...screen maybe?...occupy 8 cells of row
col-md-offset-2("occupy 2 cell rows, not sure if it pushes to one side, or if it tries to take cell space evenly
i'm probably not explaining this very well -- I recommend you go to the bootstrap homepage
or watch tutorials on youtube
Eternalink
@Eternalink
Aug 08 2016 03:56
Thank you. You gave some ideas. I was blankxD
Sabrina Ferguson
@itsacoyote
Aug 08 2016 03:59
@Eternalink the sm, md, xs make the layout change as you make the window smaller or larger.
@Eternalink if I gave a container col-xs-12 and col-lg-6, that container will be half the size on a desktop wide screen and it will be full width on a small screen like a mobile phone.
Juan Moraza
@Morazajuan
Aug 08 2016 04:06
can you please give me some feedback in my final project? I will appriciate it Thank you! :)
http://codepen.io/morazajuan/full/ZOrzyp
Ryan Williams
@Ryanwfile
Aug 08 2016 04:08
Can someone help me with the simon project. I am able to create the randomly generated light sequence but I am having difficulty in figuring out how to have the user click a button for each sequence of lights. Any help would be greatly appreciated, thank you. I can link to codepen if it helps.
DJ
@qualitymanifest
Aug 08 2016 04:11
@Ryanwfile store the index of the randomly light generations in an array. make a click function for the lights and store the users clicks in another array. make sure the two arrays are the same.
Ryan Williams
@Ryanwfile
Aug 08 2016 04:12
@qualitymanifest Thank you, that is sort of what I've been doing but I can't seem to force the game to stop running the light sequence so that the user can click
CamperBot
@camperbot
Aug 08 2016 04:12
ryanwfile sends brownie points to @qualitymanifest :sparkles: :thumbsup: :sparkles:
:star2: 1335 | @qualitymanifest |http://www.freecodecamp.com/qualitymanifest
DJ
@qualitymanifest
Aug 08 2016 04:13
@Ryanwfile as in the light sequence is looping indefinitely?
Ryan Williams
@Ryanwfile
Aug 08 2016 04:13
yes, until 20
DJ
@qualitymanifest
Aug 08 2016 04:14
@Ryanwfile so even on the first level you are getting 20 lights?
Ryan Williams
@Ryanwfile
Aug 08 2016 04:15
In my current code that is how it works yes, the best I have gotten was to have the light sequence work perfectly, then I click the appropriate button but then the next light sequence generates 2 buttons but after I click the first button the 3rd light sequence initiates
my function isn't stopping to wait user response which is where I am struggling I think
DJ
@qualitymanifest
Aug 08 2016 04:17
@Ryanwfile paste your codepen im having a hard time understanding exactly what issue youre having
DJ
@qualitymanifest
Aug 08 2016 04:51
@Ryanwfile as far as i can tell you aren't keeping track of the user's clicks anywhere, just running the sector click function every time. in your sector click function you are looping through the entire randomly generated array every single time, and running your round function which is checking the current single click against every part of the randomly generated array. then regardless of the outcome you run beeper() which pushes another light to the array and runs through the random array all over again
DJ
@qualitymanifest
Aug 08 2016 04:56
my idea is the same as before: arrays for the random generator, and for the user's clicks. ditch the for loop in the click function. just compare the index of the last click with the same index of the random generator array. if they match, let the user continue. if they don't match, run the beeper function to show them the sequence but don't add another light to the array (you should find another place to add another light to the array rather than the end of that function. maybe add the light when the user has sucessfully matched everything in the array).
Ryan Williams
@Ryanwfile
Aug 08 2016 04:57
@qualitymanifest Thank you so much for the help. I will make the player have it's own array, I don't know how to have the game stop after each sequence for the user to click through a sequence.
CamperBot
@camperbot
Aug 08 2016 04:57
ryanwfile sends brownie points to @qualitymanifest :sparkles: :thumbsup: :sparkles:
:warning: ryanwfile already gave qualitymanifest points
DJ
@qualitymanifest
Aug 08 2016 04:58
@Ryanwfile just don't run the beeper function again unless the user has successfully matched the entire array
the beeper function is what makes the game "run", right?
Ryan Williams
@Ryanwfile
Aug 08 2016 04:59
correct
I imagine something like players array = [], then in the sector click function I players.push(this.id) and then check to see if the light sequence and player sequence match but I still don't know how to have the beeper function pause so that the user can click through each sequence
DJ
@qualitymanifest
Aug 08 2016 05:07
@Ryanwfile what do you mean pause? the beeper function shouldn't ever have to pause, and it will only run when you tell it to
Ryan Williams
@Ryanwfile
Aug 08 2016 05:10
I guess pause is not the correct term, I am just not sure how to have one user click force another user click until they finish the sequence.
@qualitymanifest if I put the click function into a for loop, then an if (players[i] == order[i]) then I need to have the user click the next light in the sequence but I'm not sure how to code that
DJ
@qualitymanifest
Aug 08 2016 05:18
@Ryanwfile why would you put the click function into a for loop?? that would make the click function unusable, and you shouldn't use a for loop for comparing them anyway. you only need to compare once per click
Ryan Williams
@Ryanwfile
Aug 08 2016 05:19
@qualitymanifest Ok, I will try that. Thank you so much for all of the help I really appreciate it
CamperBot
@camperbot
Aug 08 2016 05:19
ryanwfile sends brownie points to @qualitymanifest :sparkles: :thumbsup: :sparkles:
:star2: 1336 | @qualitymanifest |http://www.freecodecamp.com/qualitymanifest
Greg Duncan
@GregatGit
Aug 08 2016 05:23
@Ryanwfile You could instead of having an array for the user have a running count of where the user is up to - when they click it has to match the computer - if its wrong the count goes back to 0
Ryan Williams
@Ryanwfile
Aug 08 2016 05:24
@GregatGit That is also a great idea, thank you for the advice, I will test it out
CamperBot
@camperbot
Aug 08 2016 05:24
ryanwfile sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 728 | @gregatgit |http://www.freecodecamp.com/gregatgit
Greg Duncan
@GregatGit
Aug 08 2016 05:25
@Ryanwfile all the code following this line on 66 order.forEach(function(el,idx){
the code is repeated
Ryan Williams
@Ryanwfile
Aug 08 2016 05:29
@GregatGit Ok, I've erased a lot of the code now to simplify it until I get the click handler to work properly, really appreciate the help
Mohammad Zahrawi
@MohammadZahrawi
Aug 08 2016 07:15
This message was deleted
This message was deleted
This message was deleted
This message was deleted
This message was deleted
Mohammad Zahrawi
@MohammadZahrawi
Aug 08 2016 07:22

can anyone solve this issue?

<script $(document).ready(function() { }); >

</script>
and here is issue Create a script element making sure it is valid and has a closing tag

Coy Sanders
@coymeetsworld
Aug 08 2016 07:23
javascript goes between the tags @MohammadZahrawi
not inside of one of them
<script>
  /* js code goes here */
</script>
Darth Skywalker
@adityaparab
Aug 08 2016 07:23
@MohammadZahrawi :
It should be
<script>
    $(document).ready(function() {
    }); 
</script>
Mohammad Zahrawi
@MohammadZahrawi
Aug 08 2016 07:24
thank you @coymeetsworld @adityaparab very much
CamperBot
@camperbot
Aug 08 2016 07:24
mohammadzahrawi sends brownie points to @coymeetsworld and @adityaparab :sparkles: :thumbsup: :sparkles:
:cookie: 519 | @adityaparab |http://www.freecodecamp.com/adityaparab
:star2: 1303 | @coymeetsworld |http://www.freecodecamp.com/coymeetsworld
Coy Sanders
@coymeetsworld
Aug 08 2016 07:25
np @MohammadZahrawi
Artis Raudive
@ar14059
Aug 08 2016 07:27
Hi, everyone! I have problem in my wipipedia viewer project: http://codepen.io/artisraudive/pen/JKkWXR?editors=0010 When i try to use getJSON function, browser(Chrome) console show message: "Refused to execute script from 'https://en.wikipedia.org/w/api.php?action=query&prop=revisions&rvprop=conte…t=jsonfm&callback=jQuery22408875772018015624_1470640279372&_=1470640279373' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled. " How can i fix this?
Muhammad Hasham
@MohammadHasham
Aug 08 2016 07:37
can anyone help me with finding keepers please
Michał Latus
@Quenbir
Aug 08 2016 07:53
hello! I've got a problem with my website http://bothouse.co/ there is a problem with RWD here. You can open it in dev tools in chrome and then choose mobile version, and resize to around 300 px, there is a small white stripe on the right. How to fix it?
pipzpadilla
@pipzpadilla
Aug 08 2016 07:54
someone can i ask for??
help
CamperBot
@camperbot
Aug 08 2016 07:54

CamperBot

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

Basic Commands:

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

meet CamperBot in FreeCodeCamp/camperbotPlayground

:pencil: read more about camperbot on the FCC Wiki

pipzpadilla
@pipzpadilla
Aug 08 2016 08:03
sample.jpg
how to make this or what do you call this one???
Sorin Ruse
@sorinr
Aug 08 2016 08:40
@ar14059 change &format=jsonfm to &format=json and make console.log(data) instead of alert(data) to see the response into the console
Islam Ibakaev
@dagman
Aug 08 2016 08:40
hey guys why pomodoro timer doesn't start immidiately?
Manar Kurmanov
@manar-mk
Aug 08 2016 08:42

hi) Can anyone help me?
I'm using angular1 and restangular for my project and faced a problem.

Need to submit POST-params to an external URL and redirect to it. Any ideas?

Michał Latus
@Quenbir
Aug 08 2016 08:47
hello! I've got a problem with my website http://bothouse.co/ there is a problem with RWD here. You can open it in dev tools in chrome and then choose mobile version, and resize to around 300 px, there is a small white stripe on the right. How to fix it?
Manar Kurmanov
@manar-mk
Aug 08 2016 08:49
@Quenbir can you make a screenshot? There is no any stripes on my machine
Michał Latus
@Quenbir
Aug 08 2016 08:50
 Screen Shot 2016-08-07 at 21.30.15.jpg
 Screen Shot 2016-08-07 at 21.30.05.jpg
Manar Kurmanov
@manar-mk
Aug 08 2016 08:55
@Quenbir actually it appears cause of your hi@bothouse.com link, make it smaller or wrap the text to next line and it will be okay.
Michał Latus
@Quenbir
Aug 08 2016 08:56
no, all of the site content looks like that when i resize to 280 px
Manar Kurmanov
@manar-mk
Aug 08 2016 08:58
@Quenbir firstly try) this white stripe appears only if the elements are larger than container, check if there is some other elements with longer width.
kat-mag
@kat-mag
Aug 08 2016 09:02
what @manar-mk said; and @Quenbir col-lg <- LARGE display. col-sm / col-xs <- SMALL u still did no work, m8 :D (powaga ;o)
Your images don't get resized too well, that also can make it overflow.
Michał Latus
@Quenbir
Aug 08 2016 09:02
<section id="contact">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<h2 class="section-heading">Contact Us</h2>
</div>
</div>
<div class="row text-primary">
<!--<div class="col-xs-6" style="display:none;">-->
<!--<i class="fa fa-4x fa-phone"></i>-->
<!--<h4>+48 506 385 459</h4>-->
<!--<h4>+48 515 122 301</h4>-->
<!--</div>-->

<div class="brainstorm-container">
<a href="https://calendly.com/bothousemariusz/chat" target="_blank">
<div class="icon"></div>
<span class="teaser">Let's brainstorm together!</span>
</a>
<br />
<a href="https://calendly.com/bothousemariusz/chat" class="btn btn-primary">Schedule a call</a>
</div>

<a class="col-xs-6" href="mailto:hi@bothouse.co">
<i class="fa fa-4x fa-envelope"></i>
<span class="email-us-link" ><h4>hi@bothouse.co</h4></span>
</a>
</div>
</div>
</section>
Artis Raudive
@ar14059
Aug 08 2016 09:03
@sorinr Thanks for help, there is one more problem - i try to use another wiki api link, that would be more usable for me: https://en.wikipedia.org/w/api.php?format=json&action=query&generator=search&gsrnamespace=0&gsrlimit=10&prop=pageimages|extracts&pilimit=max&exintro&explaintext&exsentences=1&exlimit=max&gsrsearch=dog?callback=? , but i got same error message from console, what problem can it be?
CamperBot
@camperbot
Aug 08 2016 09:03
ar14059 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 628 | @sorinr |http://www.freecodecamp.com/sorinr
Muhammad Sirajuddeen
@sirajtechy
Aug 08 2016 09:07
In IE11 Angular code works only when developer console has been opened. Why ????
pls give solution for the above question ?
Sorin Ruse
@sorinr
Aug 08 2016 09:30
@ar14059 it is +sch_word+'&callback=?' not +sch_word+'?callback=?'
Artis Raudive
@ar14059
Aug 08 2016 09:41
@sorinr Ups, my mistake, all works now, thanks! ;)
CamperBot
@camperbot
Aug 08 2016 09:41
ar14059 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: ar14059 already gave sorinr points
Ben Hoffman
@bahoffman
Aug 08 2016 09:48
find php
CamperBot
@camperbot
Aug 08 2016 09:48

find php

:zero: php loops
:one: php variables
:two: php

Ben Hoffman
@bahoffman
Aug 08 2016 09:49
find tribute
Ben Hoffman
@bahoffman
Aug 08 2016 09:53
find slack
CamperBot
@camperbot
Aug 08 2016 09:53

find slack

:zero: slack

Yaroslav
@YVeselovskyi
Aug 08 2016 10:32
hello
how to convert date like 4 May 2016 to milliseconds?
mirkolgt
@mirkolgt
Aug 08 2016 10:48
Hello everyone, found an error as I was building the weather app... unexpected token < ... anyone knows why is that and how to fix it? Thanks!
Martynas
@Marjanus
Aug 08 2016 10:49
@mirkolgt show your codepen, otherwise we cannot help you
Sorin Ruse
@sorinr
Aug 08 2016 10:51
@YVeselovskyi var mydate = new Date("2016-05-04").getMilliseconds();
mirkolgt
@mirkolgt
Aug 08 2016 10:56
<script>
$(document).ready(function() {
$("#getMessage").on("click", function(){
$.getJSON('http://api.openweathermap.org/data/2.5/find?q=Rome&units=metric&appid=KEY, function(json) {
$(".message").html(JSON.stringify(json));
});
});
});
</script>
Sorin Ruse
@sorinr
Aug 08 2016 11:00
@mirkolgt you have 'http://api.openweathermap.org/data/2.5/find?q=Rome&units=metric&appid=KEY and should be: 'http://api.openweathermap.org/data/2.5/find?q=Rome&units=metric&appid=KEY', function....
Martynas
@Marjanus
Aug 08 2016 11:00
@mirkolgt $.getJSON(' << this single comma does not have a closing comma.
mirkolgt
@mirkolgt
Aug 08 2016 11:01
wow @Marjanus good catch!
@Marjanus I just realised I left out when I typed "KEY" instead of the my KEY... so that isn't the problem :(
Sorin Ruse
@sorinr
Aug 08 2016 11:04
@mirkolgt have u loaded jquery lib?
mirkolgt
@mirkolgt
Aug 08 2016 11:05
mmhm nope
@sorinr just did that in JS ...

<script>
$(document).ready(function() {

$("#getMessage").on("click", function(){
$.getJSON('http://api.openweathermap.org/data/2.5/find?q=Rome&units=metric&appid=key', function(json) {
$(".message").html(JSON.stringify(json));
});
});
});
</script>

<div class="container-fluid">
<div class = "row text-center">
<h2>Weather App</h2>
</div>
<div class = "row text-center">
<div class = "col-xs-12 well message">
The weather data will go here
</div>
</div>
<div class = "row text-center">
<div class = "col-xs-12">
<button id = "getMessage" class = "btn btn-primary">
Get data
</button>
</div>
</div>
</div>

So my idea was to get started very simply in getting data from the API by pushing the button, however seems that it does work...
At the same time, if I run the script in google console, i can retrieve the data
Janine vN
@janine9vn
Aug 08 2016 11:14
@mirkolgt I'm assuming key is your actual key?
Sorin Ruse
@sorinr
Aug 08 2016 11:14
@mirkolgt take a look at this into the console: demo
@mirkolgt probably you didn't replaced the KEY with your own api key that you can obtain for free from them :)
Muhammad Hasham
@MohammadHasham
Aug 08 2016 11:21
why is my paragraph color not being changed
Sorin Ruse
@sorinr
Aug 08 2016 11:23
@MohammadHasham color:"orange"; not color:"orange". sorry it is color: orange;
Stephen James
@sjames1958gm
Aug 08 2016 11:23
@MohammadHasham don't use string in CSS
Muhammad Hasham
@MohammadHasham
Aug 08 2016 11:26
@sjames1958gm Thanks
CamperBot
@camperbot
Aug 08 2016 11:26
mohammadhasham sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:warning: mohammadhasham already gave sjames1958gm points
Muhammad Hasham
@MohammadHasham
Aug 08 2016 11:26
@sorinr Thanks
CamperBot
@camperbot
Aug 08 2016 11:26
mohammadhasham sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 631 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Aug 08 2016 11:39
@sjames1958gm any idea how to fix this situation(not my pen): test actually, if you add more labels and data into the programming graph all labels rotate according to a formula to be more readable and the widths of the bars are recalculated to accomodate the general canvas width (i've seen it in the code of the lib what is going on but i don't want to change the lib).
mirkolgt
@mirkolgt
Aug 08 2016 11:46
thanks @sorinr so basically you don't put <script> in the JS section...
CamperBot
@camperbot
Aug 08 2016 11:46
mirkolgt sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 632 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Aug 08 2016 11:47
@mirkolgt there is no need. codepen adds it automatically
Mostofa kamal
@MK-Emon
Aug 08 2016 11:51
<h1 class="text-center"> Written and coded by
</h1>
i am writing this line and it becomes a link
but why?
Sorin Ruse
@sorinr
Aug 08 2016 11:52
@MK-Emon do you have it within an <a> tag?
Mostofa kamal
@MK-Emon
Aug 08 2016 11:53
no . i just wrote this
@sorinr
Sorin Ruse
@sorinr
Aug 08 2016 11:55
just right click on that h1 tag and choose inspect element and let me know his parrent
or can you post the link to your pen?
Sorin Ruse
@sorinr
Aug 08 2016 12:01
@MK-Emon its because ur not closing </a> the a tag in here: <h3 style="color:rgb(45,78,90)">You can learn more about this Human being on his<a href="https://en.wikipedia.org/wiki/Muhammad_Yunus#Early_life_and_education" target="_blank"> Wikipedia Entry</h3>
Mostofa kamal
@MK-Emon
Aug 08 2016 12:02
@sorinr thanks
i got it.
Sorin Ruse
@sorinr
Aug 08 2016 12:03
@MK-Emon welcome
Darnetta
@NettyBetty
Aug 08 2016 12:46
Good morning all.
Janita Top
@janitatop
Aug 08 2016 12:51
hi all, I'm trying to build the quote generator, but I'm not getting the right output of the object. How can I get 2 levels deeper? http://codepen.io/sigvi/pen/jAQyBb?editors=1010
Sorin Ruse
@sorinr
Aug 08 2016 13:01
@janitatop what do you want to achive calling this ?: $.each(data.contents, function(val, data) {
Manar Kurmanov
@manar-mk
Aug 08 2016 13:01
@janitatop you need something like this?
http://codepen.io/manar_mk/pen/PzxpaW?editors=1010
Janita Top
@janitatop
Aug 08 2016 13:05
@manar-mk yes! I already tried data.contents.quotes but didn't refer to it later on with quote.title
Manar Kurmanov
@manar-mk
Aug 08 2016 13:06
@janitatop you're welcome)
Janita Top
@janitatop
Aug 08 2016 13:08
thx, your code is also much more readable and understandable :-)
Sorin Ruse
@sorinr
Aug 08 2016 13:10
@janitatop first you don't need that $.each function because the api returns you an object with only one quote
@janitatop just use data.contents.quotes[0].author or data.contents.quotes[0].quote ecc from your first response $.getJSON('http://quotes.rest/qod.json', function(data) {
Janita Top
@janitatop
Aug 08 2016 13:16
ah ok. the each originated from when I was still looking for a feed with many random quotes, but I could only find this. good to know the other possibilities
Vipul Basapati
@bvipul
Aug 08 2016 13:46
@bvipul
I am doing this Twitch.tv API project on freecodecamp and when I create a dynamic link from my script and add it to html. I am not able to click on the link, I mean the cursor doesnt change and it doesnt clicks but when I inspect element on the page, it shows a link is created but it is not clickable.
any help would be appreciated...
Janine vN
@janine9vn
Aug 08 2016 13:49
@bvipul link to your code?
Vipul Basapati
@bvipul
Aug 08 2016 13:53
Sorin Ruse
@sorinr
Aug 08 2016 13:58
@bvipul take a look here: var link = '<a href="https://www.twitch.tv/'+user+'" target="_blank">'; what its wrong regarding ' or " ?
andrewvazquez
@andrewvazquez
Aug 08 2016 13:58
Hi Guys
I'm working on the challenge that has to do with building a tribute page
I'm stuck on trying to get my main image aligned center and somehow getting spacing around my jumbotron
This is what I have so far: https://codepen.io/avazquez1/full/pbQgoA/
I did add the bootstrap center-block class to my image and it didn't align center as I had expected it to.
Vipul Basapati
@bvipul
Aug 08 2016 14:05
@sorinr Sorry but that is not the problem. I have tried it with both ' and ". Its just that If I create a static link inside the .twitch div ... It doesnt work as a link
Baku
@musiqe31
Aug 08 2016 14:07
Why is there no mobile app for freecodecamp?
andrewvazquez
@andrewvazquez
Aug 08 2016 14:21
Anyone have a second to answer a quick question for me>?
I'm trying to make a narrow jumbotron
I'm trying to emulate this: https://codepen.io/FreeCodeCamp/full/NNvBQW/
I can't for the life of me figure out how the space on the top and sides of the jumbotron got there
I've googled the crap out of boostrap and nothiong
Darth Skywalker
@adityaparab
Aug 08 2016 14:22
@andrewvazquez : Share your code
They have padding to the container. that is how the space is created.
Muhammad Hasham
@MohammadHasham
Aug 08 2016 14:22
is there a way in bootstrap/html to have horizontal space between two elements
such that the page remains responsive
@adityaparab
@sorinr
andrewvazquez
@andrewvazquez
Aug 08 2016 14:23
<div class="jumbotron">
<h1>Test</h1>


</div>
@adityaparab I tried adding padding earlier and it didn't budge
I tried using clockwise notation for it
I also tried mickey-mousing it by adding a blank div at the top which worked, but that didn't help with the sides.
Darth Skywalker
@adityaparab
Aug 08 2016 14:24
@MohammadHasham : add a margin: 0 10px; on your elements
Janine vN
@janine9vn
Aug 08 2016 14:25
@bvipul From what I can tell it has to do you with you adding the custom class name for each user. If I remove that, it does break some of the formatting, but it brings back the links. Is there any reason why each individual user gets its own class?
Sorin Ruse
@sorinr
Aug 08 2016 14:28
@MohammadHasham you can use @media queries to modify the look between desk and mobile or specify the padding or margin between elements in %
Muhammad Hasham
@MohammadHasham
Aug 08 2016 14:32
@sorinr @adityaparab does adding margins decrease the responsiveness of the webpage? on mobiles and desktop/laptops
Darth Skywalker
@adityaparab
Aug 08 2016 14:35
@MohammadHasham No it doesn't
basically, it depends how much margin you set
Muhammad Hasham
@MohammadHasham
Aug 08 2016 14:36
@adityaparab and can you help me that how would i use media queries and what are they
Darth Skywalker
@adityaparab
Aug 08 2016 14:36
@MohammadHasham : Do you have some code you need help with ? Or you want to understand what the heck is a media query?
Muhammad Hasham
@MohammadHasham
Aug 08 2016 14:36
no i want to understand media query
@adityaparab
Chase
@Belax8
Aug 08 2016 14:37
@MohammadHasham Here is a good article about them https://css-tricks.com/css-media-queries/
Muhammad Hasham
@MohammadHasham
Aug 08 2016 14:38
@Belax8 i'll look forward to it
Sorin Ruse
@sorinr
Aug 08 2016 14:38
@MohammadHasham using @media queries it lets you completly change the css of the site. put your top navigation at the bottom if u like, ecc
Muhammad Hasham
@MohammadHasham
Aug 08 2016 14:38
@\
@sorinr how do i use them?
Sorin Ruse
@sorinr
Aug 08 2016 14:40
@MohammadHasham google search "css media queries" there are a lot of articles u can learn. then its also try and error mother of learning :)
Muhammad Hasham
@MohammadHasham
Aug 08 2016 14:40
@sorinr okay
@sorinr @adityaparab @Belax8 Thanks
CamperBot
@camperbot
Aug 08 2016 14:40
mohammadhasham sends brownie points to @sorinr and @adityaparab and @belax8 :sparkles: :thumbsup: :sparkles:
:cookie: 426 | @belax8 |http://www.freecodecamp.com/belax8
:cookie: 524 | @adityaparab |http://www.freecodecamp.com/adityaparab
:cookie: 635 | @sorinr |http://www.freecodecamp.com/sorinr
sfmajors373
@sfmajors373
Aug 08 2016 15:04
Hello all!
I have been working on my tribute page and have some problems that I haven't been able to quite figure out what I am doing wrong yet. Does anyone have a bit of time and patience?
Darth Skywalker
@adityaparab
Aug 08 2016 15:06
@sfmajors373 Code please?
sfmajors373
@sfmajors373
Aug 08 2016 15:07

Here is where I tried to bring in a google font: <link href="https://fonts.googleapis.com/css?family=Kite+One|Open+Sans" rel="stylesheet">

<link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">

<style>
.smaller-image{
width: 300px;
}
h1, h2, h3 {
font-family: 'Kite+One|Open+Sans', Monospace;
}
</style>

Manar Kurmanov
@manar-mk
Aug 08 2016 15:12
@sfmajors373 what's the problem?
sfmajors373
@sfmajors373
Aug 08 2016 15:13
The font doesn't actually change when I use the code
It behaves as if I haven't altered the code from the original font
Manar Kurmanov
@manar-mk
Aug 08 2016 15:14
@sfmajors373 you should use Kite One or Open Sans in your font-family
sfmajors373
@sfmajors373
Aug 08 2016 15:15
@manar-mk Ok, I'll try that, thanks!
CamperBot
@camperbot
Aug 08 2016 15:15
sfmajors373 sends brownie points to @manar-mk :sparkles: :thumbsup: :sparkles:
:cookie: 16 | @manar-mk |http://www.freecodecamp.com/manar-mk
Sorin Ruse
@sorinr
Aug 08 2016 15:15
@ndburrus yep
@ndburrus good package of info
sfmajors373
@sfmajors373
Aug 08 2016 15:19

I also have one more problem. I am trying to make a row of 4 side by side buttons with an icon and a word in them but I have 4 very long buttons stacked on top of each other with a word, no icon. <div class="row">
<div class="col-md-3">

<button class= "btn btn-block"><i class="fa fa-dropbox" aria-hidden="true"></i>Dropbox</button>
</div>
<div class="col-md-3">

<button class= "btn btn-block"><i class="fa fa-get-pocket" aria-hidden="true"></i>Pocket</button>
</div>
<div class="col-md-3">

<button class= "btn btn-block"><i class="fa fa-pinterest-p" aria-hidden="true"></i> Pinterest</button>
</div>
<div class="col-md-3">

<button class= "btn btn-block"><i class="fa fa-share-alt" aria-hidden="true"></i>Share</button>
</div>
</div>

Sorin Ruse
@sorinr
Aug 08 2016 15:20
@sfmajors373 what is trying @manar-mk to say is that here font-family: 'Kite+One|Open+Sans', Monospace; you are calling wrong your fonts. go back to google fonts and they already provide you instructions on how to use them not how to load them :)
sfmajors373
@sfmajors373
Aug 08 2016 15:21
@sorinr Ohhh, Ok, I'll go back and check that again! Thanks
CamperBot
@camperbot
Aug 08 2016 15:21
sfmajors373 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 636 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Aug 08 2016 15:25
@sfmajors373 if you haven't find it is: font-family: 'Kite One', open-sans, sans-serif;
andrewvazquez
@andrewvazquez
Aug 08 2016 15:28
Does anyone know how to move an entire bulleted list with bootstrap?
I've been looking into offsetting columns but I don't know if that's the best way of going about this.
sfmajors373
@sfmajors373
Aug 08 2016 15:29
@sorinr Thanks! I did find that and it looks much better now! :D
CamperBot
@camperbot
Aug 08 2016 15:29
sfmajors373 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: sfmajors373 already gave sorinr points
sfmajors373
@sfmajors373
Aug 08 2016 15:30
Do you by chance know how to fix my buttons and icons as well?
Adam Jacks
@AdamHJ123
Aug 08 2016 15:33
Guys any idea how I can change which div appears in the center green block using only CSS and HTML? http://s.codepen.io/AdamHJacks/debug/jAQbJy/#main
Sorin Ruse
@sorinr
Aug 08 2016 15:37
@AdamHJ123 what do u mean? you have a bunch of divs with diff ids for each of your sections
@AdamHJ123 do you mean how to scroll to that section?
Adam Jacks
@AdamHJ123
Aug 08 2016 15:39
@sorinr No I mean make the appropriate one appear
I think I've thought up an idea which can work
Janine vN
@janine9vn
Aug 08 2016 15:42
@AdamHJ123 Why only CSS and HTML?
Adam Jacks
@AdamHJ123
Aug 08 2016 15:44
@janine9vn Because I want to work on my CSS skills
Manar Kurmanov
@manar-mk
Aug 08 2016 15:56
@AdamHJ123 could you please make a link to forkable codepen? I have an idea)
Sorin Ruse
@sorinr
Aug 08 2016 16:00
@AdamHJ123 i think i got what you want. just search for lazy loading
Adam Jacks
@AdamHJ123
Aug 08 2016 16:01
Ok
Manar Kurmanov
@manar-mk
Aug 08 2016 16:05
@AdamHJ123 You can use flexbox. http://codepen.io/manar_mk/pen/wWQqGz
Read this article for a better understanding https://css-tricks.com/snippets/css/a-guide-to-flexbox/
Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:06
how can i increase my jumbotron size to the whole page i mean the height is just limited till the elements
@sorinr
@manar-mk
Manar Kurmanov
@manar-mk
Aug 08 2016 16:08
@MohammadHasham you can try using vh measurement.
.jumbotron{
height:100vh;
min-height:100vh;
}
Sorin Ruse
@sorinr
Aug 08 2016 16:08
@MohammadHasham what do you mean by "whole page"? visible page or what
Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:09
@manar-mk your resume is awesome just watching it the effects are awesome
@sorinr visible one
@manar-mk Thanks
CamperBot
@camperbot
Aug 08 2016 16:09
mohammadhasham sends brownie points to @manar-mk :sparkles: :thumbsup: :sparkles:
:cookie: 17 | @manar-mk |http://www.freecodecamp.com/manar-mk
Manar Kurmanov
@manar-mk
Aug 08 2016 16:10
@MohammadHasham I used this tool https://github.com/alvarotrigo/fullPage.js
Adam Jacks
@AdamHJ123
Aug 08 2016 16:12
@manar-mk I didn't need help centering it haha
Manar Kurmanov
@manar-mk
Aug 08 2016 16:13
@AdamHJ123 what did you do? added a new elements?)
Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:17

i am using

$("#add").on("click",function(d){

      $("#add").toggle();


    });

on bootstrap button can anyone tell me why it is not working?

Manar Kurmanov
@manar-mk
Aug 08 2016 16:21
@MohammadHasham what are you trying to do?)
Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:21
i am trying to do any effect upon click of a button
like fading
hiding toggle or whatever
@manar-mk
Keith
@Penderis
Aug 08 2016 16:22
@MohammadHasham let the button you use to toggle not be the one thats get hidden , how will you get it back?
Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:22
@Penderis it is not even being toggled :worried:
Keith
@Penderis
Aug 08 2016 16:23
This message was deleted
Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:23
ok
Keith
@Penderis
Aug 08 2016 16:23
Sorry my bad, that not the issue, do you have a div with id or element with is #add?
Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:24
yes my button actually
Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:24
<div class = "col-md-12">
    <button class = "btn btn-info btn-lg" id="add">Add/Insert</button>
  </div>
@Penderis
Keith
@Penderis
Aug 08 2016 16:25
updated the codepen.
Baku
@musiqe31
Aug 08 2016 16:25
@MohammadHasham what is it that you want the effect to happen to?
Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:26
working now
@Penderis Thanks
CamperBot
@camperbot
Aug 08 2016 16:26
mohammadhasham sends brownie points to @penderis :sparkles: :thumbsup: :sparkles:
:cookie: 262 | @penderis |http://www.freecodecamp.com/penderis
Keith
@Penderis
Aug 08 2016 16:26
What was the issue? @MohammadHasham
Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:27
i was using it within another function
now i made it apart from others
are there any good functions for buttons
Adam Jacks
@AdamHJ123
Aug 08 2016 16:28
@manar-mk I'm trying to do this kind of thing to make the appropriate div appear on button click
Keith
@Penderis
Aug 08 2016 16:29
functions for buttons? a function does what you tell it so depends what you need. Or do you mean the more general use of why have a button? it just a default indicator that this can be interacted with
@AdamHJ123 you will do what @MohammadHasham has her eis a quick pen to help http://codepen.io/Penderis/pen/ZOmJOx?editors=1111
Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:30
 $("#add").on("click",function(d){

      $("#add").hover();
   });
i have made this apart! @Penderis
Keith
@Penderis
Aug 08 2016 16:30
Use javascript to hide or show the div as needed
Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:30
how can i toggle between two effects
@Penderis
like hide and show
Keith
@Penderis
Aug 08 2016 16:31
Why do you have a toggle and hover on the same item? also that can all be done using only css
Baku
@musiqe31
Aug 08 2016 16:31
Jquery my friend
Hover can easily be used with css
Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:31
@Penderis @musiqe31 Okay !
Thanks
@Penderis just one more thing please
Keith
@Penderis
Aug 08 2016 16:32
...
Sorin Ruse
@sorinr
Aug 08 2016 16:34
@AdamHJ123 you should change all like this:<button class='lined thick' id="artworkbtn">my artwork</button> to <a class='lined thick' href="#infobox">my artwork</a> and when you click that link it will go to the <div id="infobox">. this is what u want?
Keith
@Penderis
Aug 08 2016 16:35
Looking at what everyone busy with I should likely start doing some challenges myself, damn I am lazy.
Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:35
is there anyway that i can set('') the text of my inputbox after entering data to the page
@Penderis
Baku
@musiqe31
Aug 08 2016 16:35
@msambolah but he wants a button, not a link. He's looking for a event after the button click
abtak mustapha
@mustapha88
Aug 08 2016 16:35
hello every one
i just finish (i guess) SIMON game if any one test it and tell me what he or she think and welcome to any instruction to make it better
Baku
@musiqe31
Aug 08 2016 16:36
Lol I'm with you @Penderis
Keith
@Penderis
Aug 08 2016 16:36
@MohammadHasham do you want to change the input after or remove the input after form submission? not sure what you mean
Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:38
@Penderis i want to clear the input box once the input has been submitted tried doing txtarea.val(''); but nothing happened
@musiqe31
Keith
@Penderis
Aug 08 2016 16:40
@MohammadHasham
$("input[type='text']").val('');
Baku
@musiqe31
Aug 08 2016 16:41

<form>
<input type="text" placeholder="user-name" /><br>
<input type=submit value="submit" id="submit" /> <br>
</form>

<script>
$(window).load(function() {
$('form').children('input:not(#submit)').val('')
}
</script>

Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:42
@Penderis @musiqe31 Thanks
CamperBot
@camperbot
Aug 08 2016 16:42
mohammadhasham sends brownie points to @penderis and @musiqe31 :sparkles: :thumbsup: :sparkles:
:cookie: 39 | @musiqe31 |http://www.freecodecamp.com/musiqe31
:warning: mohammadhasham already gave penderis points
Keith
@Penderis
Aug 08 2016 16:42
@MohammadHasham
$("#add").on("click",function(d){

  $("#toggle").toggle();
  $("input[type='textarea']").val('');

    });
Baku
@musiqe31
Aug 08 2016 16:42
This should clear it after submission using normal java
Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:42
you guys are great
Baku
@musiqe31
Aug 08 2016 16:42
@Penderis way is correct as well
Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:42
done that!
Keith
@Penderis
Aug 08 2016 16:42
9 ways to skin a cat
Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:43
@Penderis
Thanks
Baku
@musiqe31
Aug 08 2016 16:43
9 ways for 9 lives haha
Keith
@Penderis
Aug 08 2016 16:43
@MohammadHasham if something does not work as you expect try to find the root cause sometimes it as simple as forgetting an apostrophe other times it just the order of things
Muhammad Hasham
@MohammadHasham
Aug 08 2016 16:45
Okay!
i;ll remember these things
http://codepen.io/Mohammad_Hasham/pen/VjEBqN?editors=1010
Please give your feedback @Penderis @musiqe31 @sorinr
Manar Kurmanov
@manar-mk
Aug 08 2016 16:47
@AdamHJ123 did I get you now?
http://codepen.io/manar_mk/pen/wWQqGz
Keith
@Penderis
Aug 08 2016 17:03
@MohammadHasham looks good add clearfix to jumbotron to make it contain the body, remove the height then it will grow with the list, try to move all css into the css using classes and only add the css class to the item instead of doing it via jquery , like when you color the new items added.
Adding css via classes will help keep the muck out of your javascript
@MohammadHasham you will see how I just use padding to give the second border between jumbotron and container then again inside container padding to keep content off the container sides. I like the simplicity of your code , unlike me I have a tendency to over engineer
Sorin Ruse
@sorinr
Aug 08 2016 17:06
@MohammadHasham i would make my clicks on todos to toggle the strike through line(what if by mistake i click the wrong one) and i would make a new button to clear all accomplished todos
Keith
@Penderis
Aug 08 2016 17:07
Yeah that would make it todo level 2.
Sorin Ruse
@sorinr
Aug 08 2016 17:08
@Penderis what do u meanby todo level 2?
Keith
@Penderis
Aug 08 2016 17:10
@sorinr will take it to the next level, especially he would need to be able to figure out how to track accomplished todos.
Sorin Ruse
@sorinr
Aug 08 2016 17:18
@MohammadHasham to un <strike> a to do just add some more logic here: $("#wer").on('click', function(b) {
@Penderis he is a smart guy. he will figure it out and he is one that don't give up.
Keith
@Penderis
Aug 08 2016 17:21
@sorinr no doubt , just mean that how things go. basic -> improve -> and keep improving by adding features
Sorin Ruse
@sorinr
Aug 08 2016 17:23
@Penderis think the things are going basic->improve->more improve->even more improve-> even even more trial and error-> and keep going :)
Carlos Vigil
@carlosvigil
Aug 08 2016 17:25
Hello, trying to start the random quote machine. I'm using a book, Tao Te Ching, for the quotes. I have the book in a simple html file with h2s and anchors for chapters. How would I use this for the quote machine? I was thinking I could use the text in a json but that would be inefficient editing out the anchors and replacing them with keys.
I'm trying to reserch import and document but i can't seem to put it together
Ray Nobles
@ds863
Aug 08 2016 17:26
im stuck
Peter Kenward
@PeterKenward
Aug 08 2016 17:27
I am stuck trying to access a pair of variables. It's my 'tweetQuote' function. http://codepen.io/Kontact/pen/vKWZVW?editors=0010
Keith
@Penderis
Aug 08 2016 17:27
:+1: @sorinr as for the strike thing this is the quickest I think, use a css class then
$(b.target).closest('li').toggleClass('strike');
@carlosvigil do you have any links or code to review? Think need to see the html structure
Carlos Vigil
@carlosvigil
Aug 08 2016 17:29
I'll paste a snippet @Penderis
Keith
@Penderis
Aug 08 2016 17:29
@PeterKenward which variables? the generator seems to work.
Peter Kenward
@PeterKenward
Aug 08 2016 17:30
The success argument of the jQuery g etJSON method is an anonymous function containing the local variables quoteHtml and authorHtml. These are the variables I am stuck trying to access.
Keith
@Penderis
Aug 08 2016 17:30
banana author
Carlos Vigil
@carlosvigil
Aug 08 2016 17:30
@Penderis
<A NAME="1"></A>
<H2><B>1</B></H2>
The tao that can be told<BR>
is not the eternal Tao<BR>
The name that can be named<BR>
is not the eternal Name.<BR>
<BR>
// . . .
<HR>
<A NAME="2"></A>
<H2><B>2</B></H2>
When people see some things as beautiful,<BR>
other things become ugly.<BR>
When people see some things as good,<BR>
other things become bad.<BR>
<BR>
Sorin Ruse
@sorinr
Aug 08 2016 17:30
@Penderis he is using .wrapInner('<strike>'); so in this case toggleClass its not working but he has other methods to do it
Peter Kenward
@PeterKenward
Aug 08 2016 17:31
I want tp substitute banana and author for the variables 'quoteHtml and authorHtml.
Carlos Vigil
@carlosvigil
Aug 08 2016 17:32
I'm working on making it all json in case there's no other way
Keith
@Penderis
Aug 08 2016 17:32
@sorin he may be using it like that but can just change it
@carlosvigil if you can trust the html structure you will be able to define the pattern to find what you need
@PeterKenward give me a moment I am checking now
Peter Kenward
@PeterKenward
Aug 08 2016 17:35
Thanks. (Related to the same question, I don't understand the output I get from line 4 of my JS: console.log(quoteHtml+authorHtml); which is [object Object]undefined ?)
Sorin Ruse
@sorinr
Aug 08 2016 17:37
@Penderis sure. it can be done many other ways but the idea is not make someone change his already working code but just to figure out how to add functionality to it. afterwards he can look into the code and see how he can improve it. this is learning
Keith
@Penderis
Aug 08 2016 17:40
@PeterKenward it just says your quoteHtml is undefined as in has no value since you have the quoteHtml as a local variable and the other functions do not have access to it
Peter Kenward
@PeterKenward
Aug 08 2016 17:42
Thanks.
I am really not sure how to solve this: been stuck on this for a while.
What is confusing me is that the local variables I want are local to an anonymous function which is itself an argument of a method...
greg
@wearenotgroot
Aug 08 2016 17:43
@PeterKenward what you can do is add an id on the h3 for the quote and id for the h6 of the author, so that you can access the text you appended to them
Peter Kenward
@PeterKenward
Aug 08 2016 17:44
Thanks greg, yes I could do that. I want to figure out if I can access those local variables from another function...
Sorin Ruse
@sorinr
Aug 08 2016 17:45
@PeterKenward when you have doubts about how your vars are working(read it scope) just declare them outside of everything to make them global
Peter Kenward
@PeterKenward
Aug 08 2016 17:45
I figured this out... http://codepen.io/Kontact/pen/GqBWxQ
@sorinr how could I declare these variables globally?
If I return the variables I want from within the anonymous function, I don't think they'll be available in the global scope?
I should probably take Greg's suggestion and move on to something else...
Keith
@Penderis
Aug 08 2016 17:51
@PeterKenward you are running in to jquery asynchronous call issues, rather have the content update then extract the data from the content on page to use for tweets.
lol sorry see you guys figured that out.
Peter Kenward
@PeterKenward
Aug 08 2016 17:52
thanks y'all :)
Sorin Ruse
@sorinr
Aug 08 2016 17:53
@PeterKenward somethinglike this is what you want? test
Peter Kenward
@PeterKenward
Aug 08 2016 17:56
@Penderis I don't think this has anything to do with asynchronous call issues? Surely the issue is scope?
I am not sure what you're asking me @sorinr ? :)
Peter Kenward
@PeterKenward
Aug 08 2016 17:57
@sorinr Now I opened the console.log and looked at what you're doing: yes, that's the issue: scope.
Sorin Ruse
@sorinr
Aug 08 2016 17:58
@PeterKenward told you
Peter Kenward
@PeterKenward
Aug 08 2016 17:59
Thanks @Penderis there's some interesting reading there
CamperBot
@camperbot
Aug 08 2016 17:59
peterkenward sends brownie points to @penderis :sparkles: :thumbsup: :sparkles:
:cookie: 263 | @penderis |http://www.freecodecamp.com/penderis
Keith
@Penderis
Aug 08 2016 18:02
@PeterKenward glad you solved the private variable thing though, @sorinr nice work on that , here the method I ended up just avoiding it completely. http://codepen.io/Penderis/pen/xOQXWO?editors=0011
Sorin Ruse
@sorinr
Aug 08 2016 18:08
@Penderis yes but its not the same. coz you cannot use tweet var in your function getQuote
Keith
@Penderis
Aug 08 2016 18:09
You mean in my version?
Sorin Ruse
@sorinr
Aug 08 2016 18:10
@Penderis yes
Keith
@Penderis
Aug 08 2016 18:10
getQuote does one thing - loading the quote, tweet just grabs what is on the page and tweets it
Single responsibility
My naming maybe wrong should call it quote instead.
or quoteText since that is what it is taking
Sorin Ruse
@sorinr
Aug 08 2016 18:13
@Penderis yes. i know. but if you declare for example var tweet = $('.quote'); above all then in your getQuote function and every other functions you can simply write: tweet.html("<h3>" + quoteHtml + "</h3>");
Keith
@Penderis
Aug 08 2016 18:18
Oh ok so setting up the variable already so you do not have to go back into the DOM each time?
Peter Kenward
@PeterKenward
Aug 08 2016 18:19
@Penderis in your code I understand the first part of assigning the variables (targetting classes with jQuery), but the first() and text() portions confuse me: woudl you please explain? Are these jQuery methods? var tweet = $('.quote>h3').first().text();
var author = $('.author>h6').first().text();
/// var tweet = $('.quote>h3').first().text();
var author = $('.author>h6').first().text();
///
Peter Kenward
@PeterKenward
Aug 08 2016 18:21
Thanks @wearenotgroot
CamperBot
@camperbot
Aug 08 2016 18:21
peterkenward sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star2: 1306 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
Keith
@Penderis
Aug 08 2016 18:22
@PeterKenward I just used first because you had a class so incase there another class it grabs the first instance then it converts the content to text. dropping html. as @wearenotgroot has so kindly provided the docs
as @sorinr says I can clean up my approach a lot though
Peter Kenward
@PeterKenward
Aug 08 2016 18:22
thanks @Penderis
CamperBot
@camperbot
Aug 08 2016 18:22
peterkenward sends brownie points to @penderis :sparkles: :thumbsup: :sparkles:
:warning: peterkenward already gave penderis points
Keith
@Penderis
Aug 08 2016 18:23
do not think I have given you any thank you @sorinr
CamperBot
@camperbot
Aug 08 2016 18:23
:cookie: 637 | @sorinr |http://www.freecodecamp.com/sorinr
penderis sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
Peter Kenward
@PeterKenward
Aug 08 2016 18:25
Now I just have to get a smooth visual transition from one quote to the next.
Sorin Ruse
@sorinr
Aug 08 2016 18:25
@Penderis welcome. it makes sense to use that approach only if you are going to use them traversing more functions. there is no sense in making a var global scope to use it in only one function unless necessary
Dustin
@Key-Banger
Aug 08 2016 18:27
Hey guys, I have just a general front end question. I have 5 different images I want to load on the page and just display one at a time. What is the best way to load images and just toggle between them?
Keith
@Penderis
Aug 08 2016 18:28
Do you want the display only to change if click current image or have navigation?
Sorin Ruse
@sorinr
Aug 08 2016 18:29
@Key-Banger you mean to display them like a carousel?
Dustin
@Key-Banger
Aug 08 2016 18:31
@sorinr Here is a little bit of context. I have different images for the simon board that I want to swap between to simulate the corners lighting up.
Sorin Ruse
@sorinr
Aug 08 2016 18:31
@Key-Banger yea. i highly recommend on looking on that. Jeffry Way its very good on explaining
Keith
@Penderis
Aug 08 2016 18:31
@Key-Banger going to steal you name as my job title, so what do you do? Well I am a key banger. awesome
Dustin
@Key-Banger
Aug 08 2016 18:33
@sorinr @Penderis I'll check that out. Thanks for the video.
CamperBot
@camperbot
Aug 08 2016 18:33
key-banger sends brownie points to @sorinr and @penderis :sparkles: :thumbsup: :sparkles:
:cookie: 638 | @sorinr |http://www.freecodecamp.com/sorinr
:cookie: 264 | @penderis |http://www.freecodecamp.com/penderis
Keith
@Penderis
Aug 08 2016 18:33
@Key-Banger think simplest would be to set it up using css so it looks just right then just add remove css when ever it the one that needs to light up.
That video not so applicable now
Dustin
@Key-Banger
Aug 08 2016 18:38
@Penderis care to elaborate? Ive tried having multiple classes and using display none and it just disappears.
Anthony Ho
@chiho13
Aug 08 2016 18:39
anyone know how to do unit testing for click events? the click event who show a panel like this
  $('.tab').find('.brands-view-all').click(function () {
        $('.tabs').find('.tabs-content .panel').show().end();
      });
Keith
@Penderis
Aug 08 2016 18:40
@Key-Banger are the images in your code yet then I can see, that was exactly my idea also, but since I see you have a big image just for the board you would replace the board background image with a different state image, and just control that via javascript I think that the quick dirty way, other way is drawing it all with css
Sorin Ruse
@sorinr
Aug 08 2016 18:41
@Key-Banger your div class="board" has the all img bg but you want each slice(button) to high lite that portion of "margins" of the background?
Keith
@Penderis
Aug 08 2016 18:43
@chiho13 closest I get to unit testing is console.log() sorry
@chiho13 does that .end() mean select all panels then revert selection back to just .tabs-content?
Sorin Ruse
@sorinr
Aug 08 2016 18:45
@chiho13 .find() gets all descendants of the elements that have the class .tab if you want to narrow that search i would use $('.tabs').find(this).closest('.tabs-content .panel').show().end();
Anthony Ho
@chiho13
Aug 08 2016 18:47
@sorinr cool thanks
CamperBot
@camperbot
Aug 08 2016 18:47
chiho13 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 639 | @sorinr |http://www.freecodecamp.com/sorinr
Dustin
@Key-Banger
Aug 08 2016 18:49
@Penderis @sorinr updated pen. I added classes in css and jquery button to try and toggle between a couple not quite working.
http://codepen.io/Key-Banger/pen/XKxNVK
Sorin Ruse
@sorinr
Aug 08 2016 18:50
@chiho13 welcome
Artis Raudive
@ar14059
Aug 08 2016 18:50
Hi everyone! How can i display object values in ascending order in "$.each" function? : http://codepen.io/artisraudive/pen/JKkWXR?editors=0010
Sorin Ruse
@sorinr
Aug 08 2016 18:54
@ar14059 try to make an array from your data first, sort it asc or desc as you wish and then update the dom
Keith
@Penderis
Aug 08 2016 18:59
@Key-Banger think you were missing the "." when selecting a class and assign the new css class over your base instead then it runs. http://codepen.io/Penderis/pen/akQVBy
mzedlach
@mzedlach
Aug 08 2016 19:00
Hello everyone!
Sorin Ruse
@sorinr
Aug 08 2016 19:01
@mzedlach hi
mzedlach
@mzedlach
Aug 08 2016 19:02
I just finished the first project! Woo! If someone is able to provide some feedback, I would greatly appreciate it! The more the better, don't hold back :) https://codepen.io/mzedl/full/JKvzyj/
Hello @sorinr :)
Cascada1
@Cascada1
Aug 08 2016 19:06
@mzedlach I liked the appearance of of your page very much. When I clicked the Wiki it did not go to the top of the Wikipedia page. Overall nice page.
Sorin Ruse
@sorinr
Aug 08 2016 19:06
@mzedlach why do you want your h2 with the life time to be left and not centered? after i will give to the bottom buttons some margin-top:20px to detach them from the text above
Dustin
@Key-Banger
Aug 08 2016 19:07
@Penderis Thanks. Ive got the code from that pen if you need to delete.
CamperBot
@camperbot
Aug 08 2016 19:07
key-banger sends brownie points to @penderis :sparkles: :thumbsup: :sparkles:
:warning: key-banger already gave penderis points
Sorin Ruse
@sorinr
Aug 08 2016 19:12
@mzedlach the above mentions are just improvements i will make but the page its realy nice and i saw you have generally used the bootstrap grid the right way. it looks ok also on mobile except the part of cronology and the quotes text that you should resize for mobile
Marcus McKenzie
@NCATrumpet
Aug 08 2016 19:14
Hi, I'm pretty new to web development. I made it as far as project #2 Build a Personal Portfolio Webpage with functionality similar to the webpage built by Justin Sane but i'm stuck already. I'm not sure how to get started. Is there template I can use to help me get started? If so where might I find it?
Dustin
@Key-Banger
Aug 08 2016 19:17
@ndburrus thanks!
CamperBot
@camperbot
Aug 08 2016 19:17
key-banger sends brownie points to @ndburrus :sparkles: :thumbsup: :sparkles:
:star2: 1460 | @ndburrus |http://www.freecodecamp.com/ndburrus
Norvin Burrus
@ndburrus
Aug 08 2016 19:18
@Key-Banger you're welcome! enjoy! :palm_tree:
mzedlach
@mzedlach
Aug 08 2016 19:22
@Cascada1 I noticed that too! And I thought it had something to do with my cookies or cache. Thanks for pointing it out! I'll try to remedy the issue :)
CamperBot
@camperbot
Aug 08 2016 19:22
mzedlach sends brownie points to @cascada1 :sparkles: :thumbsup: :sparkles:
:cookie: 308 | @cascada1 |http://www.freecodecamp.com/cascada1
mzedlach
@mzedlach
Aug 08 2016 19:24
@sorinr Good call on the centering. I've been looking at this too long ^^
And alsoo the button suggestion :)
@sorinr And I'm not sure how to adjust things for mobile ~
Marcus McKenzie
@NCATrumpet
Aug 08 2016 19:29
nvm I found one on w3schools.com
Sorin Ruse
@sorinr
Aug 08 2016 19:29
@mzedlach go on and do it. just replace the class for that h2 to text-center. as for the buttons just give to their parent div col .... bla bla bla a class of your own and in the css make it margin-top: 20px but you can play with that value of 20
@mzedlach as for mobile depends on how would you like to see that elements(year and description)
Rakesh Kumar
@infinitasweb
Aug 08 2016 19:39
@camperbot what's purpose of brownie point
Sorin Ruse
@sorinr
Aug 08 2016 19:40
help brownie
CamperBot
@camperbot
Aug 08 2016 19:40

:point_right: brownie points [wiki]

Brownie Points

The number beside your picture on Free Code Camp tells you how many Brownie Points you have.

A user profile picture next to a with Brownie Points score

There are two ways you can get Brownie Points:

  1. Complete challenges - you get one point per challenge you complete
  2. Help other campers in chat - each time you help another camper and they thank you (by typing "thanks @yourname"), you will get a point

Brownie Points help you look like the kind of person who codes a lot, shares relevant links, and helps people.

They also add to your Streak.

:pencil: read more about brownie points on the FCC Wiki

Sorin Ruse
@sorinr
Aug 08 2016 19:41
@infinitasweb got it?
Ken Haduch
@khaduch
Aug 08 2016 19:42
@NCATrumpet - if no one suggested this, I found the Bootstrap "themes" section on w3schools.com/bootstrap to be helpful to get some ideas of how to go about laying out the portfolio. The lessons on the individual elements of bootstrap were also helpful - more detail was helpful to me.
Sorin Ruse
@sorinr
Aug 08 2016 19:45
@khaduch hi Ken. how r u today?
mzedlach
@mzedlach
Aug 08 2016 19:53
thank you @sorinr :)
CamperBot
@camperbot
Aug 08 2016 19:53
mzedlach sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 640 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Aug 08 2016 19:54
@mzedlach welcome
mzedlach
@mzedlach
Aug 08 2016 19:57
@sorinr I'm trying out that topmargin thing and it's not applying.
I should add it to the div class="row"??
Sorin Ruse
@sorinr
Aug 08 2016 19:59
@mzedlach just create a class in the css like .mylinks{ margin-top: 10px;} and apply this class to each of the buttons bottom page
mzedlach
@mzedlach
Aug 08 2016 20:03
I've added it, but it's not changing anything in the output. Am I putting it in the wrong part of the code?
Sorin Ruse
@sorinr
Aug 08 2016 20:08
@mzedlach yep. not like </linkmargin> . you should delete that. but like <button class="btn btn-block button-parameters linkmargin">
mzedlach
@mzedlach
Aug 08 2016 20:10
Ah! Got it! :)
So, I might have a very basic question... because I come across a concept that I THINK I get and then realize my understanding is completely off.
Is everything in <style></style> considered html?
Sorin Ruse
@sorinr
Aug 08 2016 20:12
@mzedlach and in your css make it .linkmargin {margin-top:20px;} not linkmargin {margin-top:20px;}
mzedlach
@mzedlach
Aug 08 2016 20:12
Yes :)
Sorin Ruse
@sorinr
Aug 08 2016 20:15
@mzedlach you can move all you have between <style> and </style> in the html part
to your css part and get rid of <style> and </style> tags from html part. codepen adds automatically that tags for what you have in the css part of the pen
mzedlach
@mzedlach
Aug 08 2016 20:15
OH! So <style> tags indicate css?!
Sorin Ruse
@sorinr
Aug 08 2016 20:16
yes
<script> and </script> means js code
mzedlach
@mzedlach
Aug 08 2016 20:18
Okay, so in terms of "bootstrap", can that be considered like an add-on package to html?
Sabrina Ferguson
@itsacoyote
Aug 08 2016 20:21
@mzedlach mm, I guess if you want to call it a package? You can write inline script or css inside those tags on an html page. I would say package has a different meaning that how you're using it
Bootstrap is included by using a style src tag, as it's an external package. Same with jQuery.
Sorin Ruse
@sorinr
Aug 08 2016 20:21
@mzedlach bootstrap its just a css and js library that helps you style your html tags easily or add functionality to it(the js part of the bootstrap). but in order to use it in your pen settings you have to load first the bootstrap and then in the js part of the settings load first jquery and after bootstrap
mzedlach
@mzedlach
Aug 08 2016 20:22
Okay, thank you. That clarifies a lot.
Sorin Ruse
@sorinr
Aug 08 2016 20:25
@itsacoyote the problem was that @mzedlach had some of her css styling into the html part and some into the css part of the codepen. just advised its better to have all css in one place only
Sabrina Ferguson
@itsacoyote
Aug 08 2016 20:26
@sorinr ah, that makes sense.
Ken Haduch
@khaduch
Aug 08 2016 20:29
@sorinr :point_up: August 8, 2016 3:45 PM - doing ok. How are you?
Joel Santos
@St3ps
Aug 08 2016 20:30
Hey guys if I wanted to make text so big it would fully occupy it's container (assuming the container has a fixed width), how would i go for this in a dinamic way? I know I can just go trial and error, just wodnering if there's another way
Sorin Ruse
@sorinr
Aug 08 2016 20:32
@khaduch not bad. a little tired its 11:30 pm here an i'm online from 6:30am my time but i hope to be around awhile :)
Ken Haduch
@khaduch
Aug 08 2016 20:35
@sorinr - that's a long day...
Sorin Ruse
@sorinr
Aug 08 2016 20:43
@khaduch yes. even its a vacation day for me i enjoyed it :)
Ken Haduch
@khaduch
Aug 08 2016 20:47
@sorinr :+1:
MikeBeers
@MikeBeers
Aug 08 2016 20:52
Is there a
Room for help on backend
Looking for help with node.js babysteps
Norvin Burrus
@ndburrus
Aug 08 2016 20:56
@MikeBeers there is a backend room... :sparkles:
Samuel Plumppu
@Greenheart
Aug 08 2016 21:22
Hey! Anyone who could help me with the Promises returned by window.fetch()? I'm not getting my data back as I expect but just end up with [[PromiseValue]]s or undefined
Jason Luboff
@JLuboff
Aug 08 2016 21:22
@JLuboff
Afternoon all...working on my wikipedia viewer and I'm wanting the search bar to start in the middle of the page, and upon search fade out and fade back in located at the top of the page. I got that, but then on any subsequent searches (with it now at the top) I don't want it to fade at all, just stay normal but I can't figure it out. I tried creating an If statement with a counter, but it doesn't seem to iterate through the IF statement on additional searches. Any suggestions?
https://codepen.io/jluboff/pen/kXjypy
Rakesh Kumar
@infinitasweb
Aug 08 2016 21:23
kat-mag
@kat-mag
Aug 08 2016 21:24
why won't you stop spamming with this codepanel shhhh everywhere
It's like everywhere...
KD
@Annallon
Aug 08 2016 21:32
is the frontend tasks supposed to be more complex than we can do? I mean I just looked at the code for the portfolio example and its a lot more complex than what we've been taught up to this point :worried:
Sandra Marie
@smariecode
Aug 08 2016 21:33
@kat-mag LOL
@Annallon yes, that is how you learn ☺
@Annallon it forces you to go out and read, research, and apply
@Annallon some advice, take it one goal at a time, it will take a while if you are new to html
KD
@Annallon
Aug 08 2016 21:35
sure, i have learnt a lot from bootstrap html already but its already dived into JS and we havent even touched upon JS
or even been introduced to concept of JS within HTML/CSS. are we just supposed to find that ourselves?
Sandra Marie
@smariecode
Aug 08 2016 21:37
@Annallon I wrote my whole portfolio page without JS
Jason Luboff
@JLuboff
Aug 08 2016 21:38
@Annallon Build your portofolio on what you know, and then make changes later on as you learn if you'd like
Sandra Marie
@smariecode
Aug 08 2016 21:38
@Annallon No JS (well a little with scroll spy) http://codepen.io/SandraMarieCode/pen/dXJBLK
@JLuboff exactly! I dont really like my page, and I intend to make MANY changes, later as I learn
KD
@Annallon
Aug 08 2016 21:39
@smariecode Wow, looks great!
greg
@wearenotgroot
Aug 08 2016 21:39
@smariecode that was cute!! :)
Sandra Marie
@smariecode
Aug 08 2016 21:39
@Annallon thank you
CamperBot
@camperbot
Aug 08 2016 21:39
smariecode sends brownie points to @annallon :sparkles: :thumbsup: :sparkles:
:cookie: 120 | @annallon |http://www.freecodecamp.com/annallon
Sandra Marie
@smariecode
Aug 08 2016 21:40
LOL
@Annallon it took me 2 weeks at least cause it made me phycotic hahaha
KD
@Annallon
Aug 08 2016 21:41
thanks for the cookie haha. my page looks utter crap at the moment but im still working it out!
took me forever to work out how to do custom bootstrap.. turns out it was the wrong settings ALL ALONG
Sandra Marie
@smariecode
Aug 08 2016 21:42
@Annallon yep, i ran into a lot of that with codepen, and yeah I had to brush up on bootstrap, I cannot say that I fully understand it yet
KD
@Annallon
Aug 08 2016 21:43
the content online wasnt very good at explaining exactly what I needed it to explain
Lanitta
@DivaWeb
Aug 08 2016 21:43
hello all
KD
@Annallon
Aug 08 2016 21:44
on google, i mean
2 weeks is still good, I reckon :smile: what are you working on now?
Sandra Marie
@smariecode
Aug 08 2016 21:44
@Annallon algorithms
@Annallon and i have made it my goal to update one thing everyday on my portfolio page, I do have a few little bugs in there
Lanitta
@DivaWeb
Aug 08 2016 21:46
Well I am pulling my hair lolol if it makes you feel any better lolol
KD
@Annallon
Aug 08 2016 21:47
oh, cool i assume im well way off from where you are :P
haha what you stuck on now?
Lanitta
@DivaWeb
Aug 08 2016 21:48
I am working on the quote machine
Sandra Marie
@smariecode
Aug 08 2016 21:48
@Annallon im not really stuck anywhere, I have been taking the time to solve the algorithms mulitple ways to for learning, I am going to work on 'Find the Longest Word in a String Incomplete' today
KD
@Annallon
Aug 08 2016 21:48
oh ive seen that posted on a few portofolio sites, guessing its one of the tasks :)
Lanitta
@DivaWeb
Aug 08 2016 21:49
and for some reason it will only use a part of the page. I have cleared all code and started over to try to figure out what is creating it
Sandra Marie
@smariecode
Aug 08 2016 21:49
@DivaWeb i imagine quote machine will be challenging !
greg
@wearenotgroot
Aug 08 2016 21:50
@DivaWeb link your pen or fiddle
Lanitta
@DivaWeb
Aug 08 2016 21:51
@smariecode well I have not been able to find a free api for it so thinking about making it all from scratch
greg
@wearenotgroot
Aug 08 2016 21:52
@DivaWeb have you tried forismatic?
Lanitta
@DivaWeb
Aug 08 2016 21:53
@wearenotgroot hmmm not sure lol I have tried so many lol
@wearenotgroot I just pulled it up and I don't think I have tried it
greg
@wearenotgroot
Aug 08 2016 21:54
@DivaWeb some of the <link> you can put into settings in code pen
also when using code you dont need to do <body> tag
Lanitta
@DivaWeb
Aug 08 2016 21:56
@wearenotgroot I know you don't have to use the body tag but I am trying to figure why is it not using the whole page
Derek
@DTJ357
Aug 08 2016 21:56
Hi. Could someone help me with the "Showing Local Weather Challenge"? I'm having trouble, knowing what URL to put down for the getJSON method. Here is my CodePen:
http://codepen.io/Code4Jesus/pen/BzqGog?editors=1010#0
Jason Luboff
@JLuboff
Aug 08 2016 21:57
I didn't use an API for my quote generator...just created an array of quotes/authors https://s.codepen.io/jluboff/debug/GqyXdg
@DTJ357 Your URL looks correct. I would look into accessing the data in a different way though. Try printing to the console to see how the data is returned
Derek
@DTJ357
Aug 08 2016 22:00
Ok, @JLuboff . I'll see what I get!
greg
@wearenotgroot
Aug 08 2016 22:02

@DivaWeb remove everything in the html then just do this

<div class ="container-fluid">
    <div class = "jumbotron">


    </div>
</div>

then just add this to the html settings

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">

this one in the css setting

https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css

Derek
@DTJ357
Aug 08 2016 22:05
I wrote down 'console.log(json)', but it doesn't print.
Jason Luboff
@JLuboff
Aug 08 2016 22:09
Looked again...add http:// to the beginning of your url, seemed to print then
Derek
@DTJ357
Aug 08 2016 22:12
Oh, wow! That worked! Thank you, @JLuboff !
CamperBot
@camperbot
Aug 08 2016 22:12
dtj357 sends brownie points to @jluboff :sparkles: :thumbsup: :sparkles:
:cookie: 267 | @jluboff |http://www.freecodecamp.com/jluboff
Jason Luboff
@JLuboff
Aug 08 2016 22:12
@DTJ357 Glad to help. I've only been making progress due to others here helping me, spread the wealth, right? :)
Derek
@DTJ357
Aug 08 2016 22:13
Yeah. :smile:
Spartano
@Spartano
Aug 08 2016 22:19
someone has finished Build a Roguelike Dungeon Crawler Game?
Irina
@2Irina2
Aug 08 2016 22:21
Hello!
Could anyone tell me why it wouldnt show me the temperature, please?
greg
@wearenotgroot
Aug 08 2016 22:23
@2Irina2 hint asynchronous function(getJSON)
Jason Luboff
@JLuboff
Aug 08 2016 22:24
If you console.log(forecase.temperature) does it show in the console?
Irina
@2Irina2
Aug 08 2016 22:25
@wearenotgroot i don't know what that means
greg
@wearenotgroot
Aug 08 2016 22:27
@2Irina2 ok if you put a console.log('first'); on line 14 and console.log('second'); on line 23 and check the dev console which one prints first
Coy Sanders
@coymeetsworld
Aug 08 2016 22:27
The issue is that asynchronous calls don't necessarily finish while rest of code continues to execute @2Irina2
Drawgo
@Drawgo
Aug 08 2016 22:28
This message was deleted
Coy Sanders
@coymeetsworld
Aug 08 2016 22:28
This message was deleted
you should try nesting the getJSON call for weather inside the getJSON call for location data
greg
@wearenotgroot
Aug 08 2016 22:30

@2Irina2 oh the second console log --> on line 23 or between

});
  console.log('second'); //<------line keep changing -_-
  $.getJSON(" http://api.openweathermap.org/data/2.5/weather?lat="

to see the effect
as @coymeetsworld already explained

Irina
@2Irina2
Aug 08 2016 22:32
@wearenotgroot yeah it prints the first one
greg
@wearenotgroot
Aug 08 2016 22:33
@2Irina2 it should print the second one first move it above the second getJSON and outside the callback
Irina
@2Irina2
Aug 08 2016 22:34
@wearenotgroot oh yeah... now it does!
how should i arrange the code then>
?
greg
@wearenotgroot
Aug 08 2016 22:36
@2Irina2 as you see it wont wait for the api response first before it continues
Irina
@2Irina2
Aug 08 2016 22:36
@wearenotgroot yeah... interesting
greg
@wearenotgroot
Aug 08 2016 22:37
@2Irina2 @coymeetsworld said you should move the openweather api call inside the first getJSON callback
Irina
@2Irina2
Aug 08 2016 22:37
@wearenotgroot ah right i missed that
@wearenotgroot @coymeetsworld Thank you!
CamperBot
@camperbot
Aug 08 2016 22:37
2irina2 sends brownie points to @wearenotgroot and @coymeetsworld :sparkles: :thumbsup: :sparkles:
:star2: 1306 | @coymeetsworld |http://www.freecodecamp.com/coymeetsworld
:star2: 1308 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
Coy Sanders
@coymeetsworld
Aug 08 2016 22:38
yeah, the reason being is that the nested JSON call won't run until after the first one get the data @2Irina2 @wearenotgroot
greg
@wearenotgroot
Aug 08 2016 22:38
@2Irina2 there are other way to deal with this but you'll learn it later
Irina
@2Irina2
Aug 08 2016 22:38
Could you please give me a link to read more about synchronous and asynchronous functions?
Coy Sanders
@coymeetsworld
Aug 08 2016 22:38
and you need that data (i.e. the coordinates) in your 2nd call
javascript is also single threaded just FYI
Irina
@2Irina2
Aug 08 2016 22:41
Thanks, guys!
greg
@wearenotgroot
Aug 08 2016 22:41
np
Coy Sanders
@coymeetsworld
Aug 08 2016 22:46
np
greg
@wearenotgroot
Aug 08 2016 22:47
@2Irina2 btw the temp you are getting is in Standard units, you can add parameter to the api url to get specific units of measurement : imperial or metric
http://openweathermap.org/current if you scroll down somewhere near bottom of the page
Irina
@2Irina2
Aug 08 2016 22:48
@wearenotgroot oh yeah i was about to do that after i managed to have it displayed and right now i got caught up in reading about synchronous and asynchronous :)
greg
@wearenotgroot
Aug 08 2016 22:49
@2Irina2 :+1:
akash9236
@akash9236
Aug 08 2016 23:36
This message was deleted
Daniel Sousa
@dgsousa
Aug 08 2016 23:40
hey guys, i just completed the tic tac toe app, but im wondering how to make it mobile friendly
Jason Luboff
@JLuboff
Aug 08 2016 23:42
Anybody know why jQuery animate breaks all input within the DIV thats animated?