These are chat archives for FreeCodeCamp/HelpFrontEnd

23rd
Feb 2016
Caleb Martin
@caleb272
Feb 23 2016 00:02
there is a twitter api ^ if so where
steve
@davidsonsteve
Feb 23 2016 00:03
Caleb Martin
@caleb272
Feb 23 2016 00:13
http://codepen.io/thecoder15/full/JGQVJJ can someone test this i dont have a twitter account
test the quote button and see if it works
steve
@davidsonsteve
Feb 23 2016 00:18
@caleb272 looks like it's working for me
there is a quote that's over the 140 character limit though, but the button works fine.
Caleb Martin
@caleb272
Feb 23 2016 00:20
ok thanks
Gordon Davidescu
@gordondavidescu
Feb 23 2016 00:24
hey all
here :
div board works, but if I make it div s00, it does NOT work
it doesn't seem to make sense that one would work and not the other
as the other is a subcategory of the first
Gordon Davidescu
@gordondavidescu
Feb 23 2016 00:46
anyone? yes? dust! anyone? Yes? Dust!
max77p
@max77p
Feb 23 2016 00:54
if i want to change jquery when a website is being viewed in smaller screen i should use an if statement in jquery file right?
max77p
@max77p
Feb 23 2016 01:03
can someone help me with this
in mobile view i want to remove the "click to slide the panel right" on the second page
ive written a jquery if statement, but it doesn't seem to work
Joe Sasson
@joesasson
Feb 23 2016 01:04
@max77p awesomeness*
max77p
@max77p
Feb 23 2016 01:04
haha yea i still need to change all that
Andrew Charlebois
@andrewchar
Feb 23 2016 01:07
hey guys im looking for a little help. i just downloaded node.js but im unsure what i am suppose to do now
should i need to do something in my shell?
shell is telling me i need to download npm when i type in "npm install -g firebase-tools"
Matt Leonard
@matty22
Feb 23 2016 01:19
General question:
As far as TDD goes, what's the first tool I should implement? Right now, I just use a browser and SublimeText and do everything locally. I'm currently working on the last couple Front End Dev Ziplines, so I'm not sure a big complicating testing framework is necessary, but would like to start learning something?
Mark Canning
@Maakux
Feb 23 2016 01:25
@matty22 I use Jasmine and a couple of other test suites.
Jasmine is nice for unit testing, and small scale things.
Matt Leonard
@matty22
Feb 23 2016 01:26
Is Jasmine something that would be useful if I'm doing exclusively front end stuff? It's not like I'm writing complicated algorithms or anything?
Johannah
@eccentricafterglow
Feb 23 2016 01:29
Not sure if this is the right room — I’m having trouble getting images to display on CodePen. I’m currently using dropbox to host images.
Has anyone else had issues?
Has anyone here gotten a pro plan from them, too?
if so, is it worth it?
Because they have image hosting with the plan.
I’d like to get around that for a least the first few projects here.
until I get my feet sufficiently wet.
Jonah Erlich
@jerlich97
Feb 23 2016 01:31
Hey all, Does anyone know why my wikipedia viewer won't do multiple searches without reloading? I'm having trouble figuring it out http://codepen.io/jerlich97/pen/YwbZPv
Matt Leonard
@matty22
Feb 23 2016 01:31
@eccentricafterglow All of those types of things (Dropbox, OneDrive, etc) make it difficult to find the correct URL for using them in that fashion
Johannah
@eccentricafterglow
Feb 23 2016 01:31
That makes sense.
Matt Leonard
@matty22
Feb 23 2016 01:32
Try something link Photobucket maybe? Or Github might let you do it.
Johannah
@eccentricafterglow
Feb 23 2016 01:33
Photobucket — I’ll try that.
I’m not sure how to do it on Github.
I couldn’t find direct instructions.
Jonah Erlich
@jerlich97
Feb 23 2016 01:35
Nevermind I figured it out
max77p
@max77p
Feb 23 2016 01:42
can someone help me please?
need help with making my jquery work while less than 720px width
Billy
@billywaite
Feb 23 2016 01:52
@davidsonsteve thanks man! That helped!
CamperBot
@camperbot
Feb 23 2016 01:52
billywaite sends brownie points to @davidsonsteve :sparkles: :thumbsup: :sparkles:
:star: 309 | @davidsonsteve | http://www.freecodecamp.com/davidsonsteve
thybean
@thybean
Feb 23 2016 02:01
Hello, how can I center an image in a bootstrap column?
Nairuz.Abulhul
@nairuzabulhul
Feb 23 2016 02:10
@thybean did you try position:absolute , top: 50%, left:50%;
Pawan
@pawan92
Feb 23 2016 02:13
asking around for round 2...does anyone know how to use a API to generate random quotes for my quotes generator
Gordon Davidescu
@gordondavidescu
Feb 23 2016 02:31
@jerlich97 what was the solution? I'm wondering
Travis Boss
@travisboss
Feb 23 2016 02:36
@max77p what is broken?
Valeesi
@Valeesi
Feb 23 2016 02:40

<ShowTheLocalWeather> Hi guys, I am stuck on trying to get and read the API respond from Open Weather. I am using XMLHttpRequest(). Here is the part of that code:
var xhr = new XMLHttpRequest();
xhr.open("GET", "https://api.openweathermap.org/data/2.5/weather?lat="+ lat +"&lon="+ lon +"&appid=e50f2b21b5b741b3c7254b3dc160f9a3", false);
xhr.send();

I'd really appreciate any help that I could get. Ideally not a solution but a direction or a page that I could study further. Thank you for your time!

Jonah Erlich
@jerlich97
Feb 23 2016 02:42
@gordondavidescu I forgot to delete the old divs and didn't realize the new ones were piling up below
So I'm trying to push values to a global array from a function $.json function which is within another function which is called from a $().click but it's not working. Any thoughts?
Andrew Schmidthuber
@calicode
Feb 23 2016 02:45
hi @Valeesi check your browsers developer console. the issue you are running into is that xmlhttp is only for within the same domain. jsonp is what you want to check out for external domains. jquery has some tools that make it easy to work with
developer console will give you a hint in some cases as to whats going wrong
max77p
@max77p
Feb 23 2016 02:48
@travisboss i figured it out, thanks!
CamperBot
@camperbot
Feb 23 2016 02:48
max77p sends brownie points to @travisboss :sparkles: :thumbsup: :sparkles:
:star: 266 | @travisboss | http://www.freecodecamp.com/travisboss
Valeesi
@Valeesi
Feb 23 2016 02:49
@calicode Thank you! I will read on that further.
CamperBot
@camperbot
Feb 23 2016 02:49
valeesi sends brownie points to @calicode :sparkles: :thumbsup: :sparkles:
:star: 333 | @calicode | http://www.freecodecamp.com/calicode
Jonah Erlich
@jerlich97
Feb 23 2016 02:51
Can someone help? .push() is not working properly for this project
http://codepen.io/jerlich97/pen/LGwPJv?editors=0011
narkeeta
@narkeeta
Feb 23 2016 02:59
Can someone look at this code and advise me on how to clear the current #results data every time that I enter new ones?
        function display(input) {
  $.ajax({
    url: '//en.wikipedia.org/w/api.php',
    data: {
      action: 'opensearch',
      search: input,
      format: 'json',
    },

    dataType: 'jsonp',
    success: function(json) {
      console.log(json);
      var i = 0;
      json[1].forEach(function(title) {
        var link = json[3][i];
        var descrip = json[2][i];

        var html = "<h2 class='title'>" + title + "</h2>";
        html += "<h2 class='description'>" + descrip + "</h2>";
        html = "<li><a href='" + link + "'class='result' target='_blank'>" + html + "</a></li>";
        $("#results").append(html);

        i++;
      })
    },
  })
};
$(document).ready(function() {
  $("#searchbox").submit(function(form) {
    form.preventDefault();
    var input = $("#input").val();
    display(input);
  });
});
DJ
@qualitymanifest
Feb 23 2016 03:00
@narkeeta $("#results").empty()
narkeeta
@narkeeta
Feb 23 2016 03:01
I put that in but then it wont show anything at all in my pen
DJ
@qualitymanifest
Feb 23 2016 03:01
@narkeeta paste the link to your pen
I cant seem to make it clear out the previous search results...not sure why
DJ
@qualitymanifest
Feb 23 2016 03:02
@narkeeta $("#results").empty() will work, if you put it in the right place
narkeeta
@narkeeta
Feb 23 2016 03:03
okay...I've been trying just about every location but ill keep looking
DJ
@qualitymanifest
Feb 23 2016 03:03
you need to think about when you want to empty out the old results.
probably because the user wanted to see some new results
and they submitted a new search
narkeeta
@narkeeta
Feb 23 2016 03:04
oh...weird. I had it at a specific place when I built the code, at the start of the display function but it wasnt working. But I tried there again and for some reason it is fine now
thanks
@qualitymanifest
DJ
@qualitymanifest
Feb 23 2016 03:04
np
Valeesi
@Valeesi
Feb 23 2016 03:48
<ShowTheLocalWeather> Is it normal that I can't get a response from Open Weather? Here is my short code and it seems that I am always getting no response from the server. Maybe I have made a mistake in the code? Thank you in advance for your time! http://codepen.io/Valeesi/pen/zrVPpY
I'm transitioning my html to have onclicks
but the very first one I implemented doesn't work at all
it worked great when all it did was pop up an alert :(
Joseph Morse
@jnmorse
Feb 23 2016 03:57
@gordondavidescu why are you trying to put onClicks in your html?
Gordon Davidescu
@gordondavidescu
Feb 23 2016 03:58
well this is as you can see tic tac toe and for some reason I just could not get the individual divs to be clickable
only the larger div
good question @jnmorse
Joseph Morse
@jnmorse
Feb 23 2016 04:01

@gordondavidescu well in you code you are already assigning click events, and they recieve a event prop so if you do

$('#board div').on("click", function(event) {
 console.log(event.target.id); 
});

you see the id of the div that was clicked on is outputed in the console

Gordon Davidescu
@gordondavidescu
Feb 23 2016 04:02
thats's beautiful thanks @jnmorse
CamperBot
@camperbot
Feb 23 2016 04:02
gordondavidescu sends brownie points to @jnmorse :sparkles: :thumbsup: :sparkles:
:star: 419 | @jnmorse | http://www.freecodecamp.com/jnmorse
Gordon Davidescu
@gordondavidescu
Feb 23 2016 04:08
@jnmorse sorry to bother you but when I click nothing seems to happen
same link
i mean in the console
Joseph Morse
@jnmorse
Feb 23 2016 04:11
@gordondavidescu you already have the selector $('#board div') where you could have added the console.log I posted, you added $('#s01 div') which doesn't exist in your layout
Gordon Davidescu
@gordondavidescu
Feb 23 2016 04:11
sure it does? it's a sub div of board div
Joseph Morse
@jnmorse
Feb 23 2016 04:12
@gordondavidescu its trying select a div that is in #s01 not #s01 itself
Gordon Davidescu
@gordondavidescu
Feb 23 2016 04:12
oh no
i want s01

tiredcodersayswhat

Joseph Morse
@jnmorse
Feb 23 2016 04:13
@gordondavidescu so if you wanted to write it that way, you would either remove the div in that, or add it just before #s01 without a space since #s01 is a div
Gordon Davidescu
@gordondavidescu
Feb 23 2016 04:13
heh i wasn't expecting that.
updated
like that? (still not quite doing what I think)
I appreciate your time
oh snap there is no s01
fixed that :o:
ha! i think it works now. and now, to bed.
Joseph Morse
@jnmorse
Feb 23 2016 04:16
@gordondavidescu its outputting to the console, which you can view by click the codepen console button at the bottom or view your browsers console with cntrl+shift+i
Gordon Davidescu
@gordondavidescu
Feb 23 2016 04:17
yes! and that's all I wanted for tonight. much appreciated.
Joseph Morse
@jnmorse
Feb 23 2016 04:18
@gordondavidescu np, good night
rodascesar
@cesarrodas
Feb 23 2016 04:38
so I had this problem of my gallery images not being the same height and today someone told me i should re size them before. and they told me i could use dropbox. the problem now is that the picture doesn't show. I clicked shared, any advice?\
Joseph Morse
@jnmorse
Feb 23 2016 04:41
@cesarrodas well depending how large they where you might have just got away with using something like max-height: 100px in your css, but if you replace the ?whatever at the end of the share link with ?raw=1 and go to that address in your bowser you'll get the address for the raw image
rodascesar
@cesarrodas
Feb 23 2016 04:45
@jnmorse haha you are awesome! been fighting this simple ordeal for a day or two lol and no, i tried eveything in css with the row and links and it just wasnt taking effect with bootstrap. this made it work in a sec :smile: Thanks
CamperBot
@camperbot
Feb 23 2016 04:45
cesarrodas sends brownie points to @jnmorse :sparkles: :thumbsup: :sparkles:
:star: 421 | @jnmorse | http://www.freecodecamp.com/jnmorse
Joseph Morse
@jnmorse
Feb 23 2016 04:57
http://codepen.io/jnmorse/pen/rxXaWx @cesarrodas just for future reference, three images, different sizes, all displaying at the same height, course if the images are very large it would be better performance wise to re-size them.
Jonathan
@jxvo92
Feb 23 2016 05:00
any know how to modify foundation switches css?
i want to change the default blue and inactive colors
rodascesar
@cesarrodas
Feb 23 2016 05:04
@jnmorse Awesome forked it to play with it more. thanks a lot
CamperBot
@camperbot
Feb 23 2016 05:04
cesarrodas sends brownie points to @jnmorse :sparkles: :thumbsup: :sparkles:
:warning: cesarrodas already gave jnmorse points
Joseph Morse
@jnmorse
Feb 23 2016 05:14

@jxvo92

input:checked + .switch-paddle {
  background-color: green;
}

.switch-paddle {
  background-color: yellowgreen;
}

this seems to do the trick

Arpit Saxena
@arpit-saxena
Feb 23 2016 05:22

http://codepen.io/FreeCodeCamp/full/VemmoX/

Someone tell me how to build a page where the scrolling is of this type.

Lindel Smith
@LindelTSmith
Feb 23 2016 05:30
http://codepen.io/smithlit/full/qbzdQe When I look at my page on safari on my iPhone in 1x zoom, the pictures overlap the border. On .5 and .25x zoom everything looks normal. Any help? Thanks!
Marek Slabicki
@thaniri
Feb 23 2016 05:32
your image has a fixed width of 500
so no matter how the viewport is sized, that image renders at 500px
if you want it to stay within the border
put it in a div
make the div width 100%
and you can set the max-width to 500px
so that when the viewport is desktop sized, it doesn't go beyond 500px
http://codepen.io/thaniri/full/MKPEXm/
anyone have an idea why my tweet button breaks? it works when i test locally
Khalysi
@Khalysi
Feb 23 2016 05:34
completed my portfolio page ^.^ http://codepen.io/Khalysi/full/JGQwGW/
Arpit Saxena
@arpit-saxena
Feb 23 2016 05:35
How to build parallax scrolling webpage?
Marek Slabicki
@thaniri
Feb 23 2016 05:35
google it
your site looks good khalysi! now fill it with projects :)
Arpit Saxena
@arpit-saxena
Feb 23 2016 05:36
@thaniri They are quite complicated and frankly, I'm a newbie
Khalysi
@Khalysi
Feb 23 2016 05:36
forgot the media query rip
Marek Slabicki
@thaniri
Feb 23 2016 05:36
the best way to go about it is to inspect the code of the site you're trying to copy
Lindel Smith
@LindelTSmith
Feb 23 2016 05:36
@thaniri thank you!
CamperBot
@camperbot
Feb 23 2016 05:36
lindeltsmith sends brownie points to @thaniri :sparkles: :thumbsup: :sparkles:
:star: 147 | @thaniri | http://www.freecodecamp.com/thaniri
Khalysi
@Khalysi
Feb 23 2016 05:36
meh i have projects but didn't care bout adding to the sample page, I actually have a real fully functional resume/portfolio site
Marek Slabicki
@thaniri
Feb 23 2016 05:47
http://codepen.io/thaniri/full/MKPEXm/
Can anyone help me troubleshoot my tweet button? I'm an ancestor of the button is violating the security policy of codepen, don't know which.
Raffy Jun Lorenzana
@raffylorenzana
Feb 23 2016 05:49
hello guys need help on random quote machine project
Marek Slabicki
@thaniri
Feb 23 2016 05:49
ask away
Raffy Jun Lorenzana
@raffylorenzana
Feb 23 2016 05:49
i cant get the current quote text and save it to the twitter text parameter
im using array not api
i save it to a variable but its empty, i dont know why its empty
Marek Slabicki
@thaniri
Feb 23 2016 05:51
document.getElementById("yourlinkhere").setAttribute("href", "https://twitter etcetc");
every time you generate a random quote
Raffy Jun Lorenzana
@raffylorenzana
Feb 23 2016 05:52
i use this $('.twitter-share-button').attr('href', 'https://twitter.com/intent/tweet?text=' + $currentQuote);
Marek Slabicki
@thaniri
Feb 23 2016 05:52
reset the href of the tweet button
i dont really know jquery
Caleb Martin
@caleb272
Feb 23 2016 06:01
can someone tell me how to set myLocation variable this isnt working
  function getLocation() {
    var myLocation = ["failed"];

    if (navigator.geolocation) {
      myLocation = navigator.geolocation.getCurrentPosition(function (position) {
        return [position.coords.latitude, position.coords.longitude];
      });

    }

    return myLocation;
  }
shaishave
@shaishave
Feb 23 2016 06:15

Doubt

What we have been told: "We should not give more than one element the same id attribute."

But when we clone an element using clone() via JQuery, aren't we contradicting that rule?

Caleb Martin
@caleb272
Feb 23 2016 06:15
haha
could you help we with my problem above^
h4r1m4u
@h4r1m4u
Feb 23 2016 06:20
@shaishave generally you probably wouldn't want to clone an element with an id. but cloning an element with just a class (or no class, no id) would be fine
Sangeetha
@manmarziyan
Feb 23 2016 06:20
I think I have a couple of pens that run on an infinite loop. Every time I log on to the "my public pens" page, the whole pages freezes. I can't view, edit or even delete any of my pens. What do I do?
Whole page*
Caleb Martin
@caleb272
Feb 23 2016 06:21
^ haha i have no idea
maybe see if you can kill some JS processes in your browser
then delete them
Sangeetha
@manmarziyan
Feb 23 2016 06:22
I tried using "?turn_off_js=true". Doesn't work for the public pens page
Caleb Martin
@caleb272
Feb 23 2016 06:23
kill the processes from your task manager
Sangeetha
@manmarziyan
Feb 23 2016 06:23
How do I do that?
h4r1m4u
@h4r1m4u
Feb 23 2016 06:24
@manmarziyan that doesn't make sense it wouldn't work for the public pens
what's the link to your codepen?
Sangeetha
@manmarziyan
Feb 23 2016 06:24
Like the windows task manager?
h4r1m4u
@h4r1m4u
Feb 23 2016 06:24
killing the process from task manager will kill the whole browser window, it won't help you
Sangeetha
@manmarziyan
Feb 23 2016 06:40
Ok I'll try again
Ahh it doesn't work for HTTP://codepen.io/pens/mypens/?turn_off_js=true. How do I delete them..
h4r1m4u
@h4r1m4u
Feb 23 2016 06:45
you can add the the turn_off_js=true parameter to any of your pens' url and it'll switch off the JS. you can then edit the JS and remove the infinite loop
Sangeetha
@manmarziyan
Feb 23 2016 06:46
Hey I worked it out. I used my history to visit those pens, disabled Js, and deleted them on the editor page. Thanks!
h4r1m4u
@h4r1m4u
Feb 23 2016 06:46
that works too :)
Sangeetha
@manmarziyan
Feb 23 2016 06:46
Thanks @h4r1m4u (is this how I give you brownie points?)
CamperBot
@camperbot
Feb 23 2016 06:46
manmarziyan sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1464 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 23 2016 06:47
yeah, it is :) thanks!
Jonathan
@jxvo92
Feb 23 2016 07:08
@jnmorse worked like a charm, thanks
CamperBot
@camperbot
Feb 23 2016 07:08
jxvo92 sends brownie points to @jnmorse :sparkles: :thumbsup: :sparkles:
:star: 422 | @jnmorse | http://www.freecodecamp.com/jnmorse
Mihir Dutta
@mihirdutta
Feb 23 2016 07:30
Hi, I'm unable to call the Wikipedia API from CodePen. Here's my code
$(document).ready(function() {
  $("form").on("submit", function(event) {
    event.preventDefault();
    $.getJSON("https://en.wikipedia.org/w/api.php", {
      action: "query",
      titles: encodeURIComponent($("form > input").val()),
      prop: "revisions",
      rvprop: "content",
      format: "json",
    }, function(data) {
      // do something with data
    });
  });
});
Any help?
kirbyedy
@kirbyedy
Feb 23 2016 07:37
you have to call jsonp
or have a callback, because of that cross domain thing... something... not sure :)
Dulshani Gunawardhana
@dshgna
Feb 23 2016 07:38
Hi! Need help with tic-tac-tow
Dulshani Gunawardhana
@dshgna
Feb 23 2016 07:38
*toe
other than the minimax algorithm, can someone suggest an algorithm that is relatively easier to implement please?
Bruce Young
@mutantspore
Feb 23 2016 07:42
@mihirdutta pen?
Ziad Sabra
@zeiadwsabra
Feb 23 2016 07:50
Hi everyone any tips and thoughts on my wiki search : http://codepen.io/zamyka/pen/eJqNJE
is it working for everyone?
Caleb Martin
@caleb272
Feb 23 2016 08:11
can someone tell me how to use the weather api it doesn’t seem to work
Raffy Jun Lorenzana
@raffylorenzana
Feb 23 2016 08:16
@zeiadwsabra not working mate
Ziad Sabra
@zeiadwsabra
Feb 23 2016 08:18
@rjlorenz931 I think it only works on codepen, don't know why.
@caleb272 You have to have an account and API Key for the site to send a json file
Caleb Martin
@caleb272
Feb 23 2016 08:21
yes i have the key i just don’t know how to send it
Ziad Sabra
@zeiadwsabra
Feb 23 2016 08:21
"http://api.openweathermap.org/data/2.5/weather?lat="
          + (coordinates[0]) +
          "&lon=" + (coordinates[1]) +
          "&APPID=key"
@caleb272 try this
Caleb Martin
@caleb272
Feb 23 2016 08:22
k thanks
Ziad Sabra
@zeiadwsabra
Feb 23 2016 08:22
@caleb272 welcome
h4r1m4u
@h4r1m4u
Feb 23 2016 08:31
@caleb272 also, you're missing 'http://'; at the beginning of the api url
Caleb Martin
@caleb272
Feb 23 2016 08:32
@h4r1m4u thank you so much man that was a stupid mistake
CamperBot
@camperbot
Feb 23 2016 08:32
caleb272 sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1465 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 23 2016 08:33
@caleb272 np. when you omit the http: or https: bit, it'll use the url in relation to the domain you're currently on (i.e. codepen.io in this case)
which wont' work
@zeiadwsabra looks and works good. the only issue i see is that the search input box is really tiny on mobile size screens
you might want to stack up the input and the buttons in a different way for smaller resolutions
Joel Bemis
@jbemis
Feb 23 2016 09:03
Hey guys!
I’m trying to troubleshoot and could use some insight
why doens’t the timer read 00:00:00?
shouldn’t my javascript have affected it?
Bruce Young
@mutantspore
Feb 23 2016 09:06
@jbemis it’s .getElementById
Joel Bemis
@jbemis
Feb 23 2016 09:07
thanks @mutantspore! you rock
CamperBot
@camperbot
Feb 23 2016 09:07
jbemis sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1153 | @mutantspore | http://www.freecodecamp.com/mutantspore
Joel Bemis
@jbemis
Feb 23 2016 09:07
careless errors how i love them
Bruce Young
@mutantspore
Feb 23 2016 09:07
:)
do you use the console in your browser tools? @jbemis
kangyao
@kay78
Feb 23 2016 09:09
@db001 thanks pal, i'll try that
CamperBot
@camperbot
Feb 23 2016 09:09
kay78 sends brownie points to @db001 :sparkles: :thumbsup: :sparkles:
:star: 295 | @db001 | http://www.freecodecamp.com/db001
Kenni Gandira Alamsyah
@kenniga
Feb 23 2016 09:13
Hello guys, I'm Kenni. Glad to see the other developers
I thought I was alone and nobody could help me :(
Bruce Young
@mutantspore
Feb 23 2016 09:14
@kenniga “We are not alone” lol
Kenni Gandira Alamsyah
@kenniga
Feb 23 2016 09:16
@mutantspore that was so pacificating, indeed
Bruce Young
@mutantspore
Feb 23 2016 09:17
plenty of help ..depending on who’s on of course…
Kenni Gandira Alamsyah
@kenniga
Feb 23 2016 09:18
by the way, I had some issue with gulp, is there anyone who use gulp too?
Joel Bemis
@jbemis
Feb 23 2016 09:20
@mutantspore no, should I/
Bruce Young
@mutantspore
Feb 23 2016 09:21
sorry not tried it yet ..perhaps the backendhelp line @kenniga
@jbemis well you can see errors etc in there. or do some console.log logging and help debug your code. Yes… it’s very hard to do this without using it.
Kenni Gandira Alamsyah
@kenniga
Feb 23 2016 09:23
@mutantspore oh sorry. I thought it was Front-End stuffs
Bruce Young
@mutantspore
Feb 23 2016 09:24
@kenniga it maybe :) i’ve not used it.. only heard of it.. it’s an automation tool ..command line?
Kenni Gandira Alamsyah
@kenniga
Feb 23 2016 09:26
@mutantspore yups. It's delicated. I've spent days for understanding CLI because many articles said it's important for nowadays Front-End Developer
and now I'm just like going nowhere.... :worried:
@mutantspore how about your opinion? Is it matter to learn CLI for being a Front End Developer?
Bruce Young
@mutantspore
Feb 23 2016 09:30
I’m sure that Gulp would be a great tool in a production environment and we all should be familiar with it but I’m sure you can get most of your FCC projects done without it. Especially the Front End Certificate projects.
use of various CLI tools will be needed though in the backend and some of the Data Visualization projects
In a production environment you’ll have far more “assets ” to manage and alter and CLI tools make that easy.
Bruce Young
@mutantspore
Feb 23 2016 09:35
@kenniga where are you up to in your projects?
Radhika Chaudhary
@radheyIndia
Feb 23 2016 09:37
hello
this is my codepen link
My twiiter link isnt working
and I cant identify the problem
http://codepen.io/radheyIndia/pen/QyReXK
anyone please help me
Kenni Gandira Alamsyah
@kenniga
Feb 23 2016 09:40
@mutantspore well, I have been working on "Bulid Personal Website"'s challange
fluffystub
@RakshithNM
Feb 23 2016 09:41
how can i generate a tweet on the click of a button?
Bruce Young
@mutantspore
Feb 23 2016 09:41
Good. I found that hard .. not the actual coding but the design and how to present myself as I now use it as my official portfolio page. @kenniga
Coy Sanders
@coymeetsworld
Feb 23 2016 09:44
@radheyIndia try checking out the this page for some help: https://about.twitter.com/resources/buttons
Kenni Gandira Alamsyah
@kenniga
Feb 23 2016 09:44
@mutantspore that was my plan too! The only problem was remembering all of important bootstrap component
do you memorize all of them too?
Coy Sanders
@coymeetsworld
Feb 23 2016 09:45
just a tip also on the button because it was a pain to set up, what I did (and I dont' think there's a way around it) is everytime you change your quote you have to recreate the button. You can't modify it with jquery
twitter embeds their buttons into these iframes and makes it complicated
Hemang Kumar
@hemangsk
Feb 23 2016 09:47
I didnt use twitter's embed button..
window.open('http://twitter.com/share?url=' + loc + '&text=' + title + loc + '&', 'twitterwindow', 'height=400, width=500, top='+($(window).height()/2 - 225) +', left='+$(window).width()/2 +', toolbar=0, location=0, menubar=0, directories=0, scrollbars=0');
and wrapped this inside onClick() function
Coy Sanders
@coymeetsworld
Feb 23 2016 09:49
never seen that solution before @hemangsk, and it works?
Hemang Kumar
@hemangsk
Feb 23 2016 09:51
@coymeetsworld yeah its working http://codepen.io/Hemang/pen/qbRgWe
@coymeetsworld i learnt about this implementation from a fellow campers code :)
Coy Sanders
@coymeetsworld
Feb 23 2016 10:00
i see, generate button needs some work though but gj @hemangsk
had to remove the button then recreate it with the newly generated text
J Savaiinaea
@savaii
Feb 23 2016 10:20

Hi!

How did you start doing the Zipline, Build Portfolio Webpage? Did you guys plan things out design-wise first?

Coy Sanders
@coymeetsworld
Feb 23 2016 10:23
Yeah I focused on design first
Creating the menu bar, and the sections first, then I would fill in the details after
Hemang Kumar
@hemangsk
Feb 23 2016 10:36
@coymeetsworld thanks ! gonna work on the generate button..
CamperBot
@camperbot
Feb 23 2016 10:36
hemangsk sends brownie points to @coymeetsworld :sparkles: :thumbsup: :sparkles:
:star: 294 | @coymeetsworld | http://www.freecodecamp.com/coymeetsworld
Hemang Kumar
@hemangsk
Feb 23 2016 10:37
@coymeetsworld and I'll try the twitter button embed approach this time
Coy Sanders
@coymeetsworld
Feb 23 2016 10:42
yeah that's the only difference is the button really, kind of annoying to have to recreate the tweet button everytime the HTML changes
and i searched on this quite a bit, there were alot of different solutions but this was the one that ended up working for me
thanks for showing your implementation too @hemangsk
CamperBot
@camperbot
Feb 23 2016 10:43
coymeetsworld sends brownie points to @hemangsk :sparkles: :thumbsup: :sparkles:
:star: 308 | @hemangsk | http://www.freecodecamp.com/hemangsk
Hemang Kumar
@hemangsk
Feb 23 2016 10:45
:smile: :smile:
Coy Sanders
@coymeetsworld
Feb 23 2016 10:53
nice @radheyIndia noticed one thing though with the quotes that have a ; in it
you may want to escape that symbol or else it closes the quote out too prematurely

Do not wait to strike till the iron is hot; but make it hot by striking.

only tweets

Do not wait to strike till the iron is hot

Radhika Chaudhary
@radheyIndia
Feb 23 2016 10:57
ok thanks @coymeetsworld Its been corrected
CamperBot
@camperbot
Feb 23 2016 10:57
radheyindia sends brownie points to @coymeetsworld :sparkles: :thumbsup: :sparkles:
:star: 302 | @coymeetsworld | http://www.freecodecamp.com/coymeetsworld
Rory Smith
@alanbuchanan
Feb 23 2016 11:01
anyone know about making css step animations using a sprite?
kirbyedy
@kirbyedy
Feb 23 2016 11:04
I would love to know that, but have no idea :(
J Savaiinaea
@savaii
Feb 23 2016 11:15
@coymeetsworld Thank you, heaps!
CamperBot
@camperbot
Feb 23 2016 11:15
savaii sends brownie points to @coymeetsworld :sparkles: :thumbsup: :sparkles:
:star: 303 | @coymeetsworld | http://www.freecodecamp.com/coymeetsworld
anthonygallina1
@anthonygallina1
Feb 23 2016 11:20
@radheyIndia Hi again Your twitter link works here
Mohamed
@mohamed-avatarinweb
Feb 23 2016 11:27
hi guys i need help/???
faraz
@silentarrowz
Feb 23 2016 12:00
hi, I have almost completed my weather app. but it seems like it's giving me the wrong temperature. could you tell me if there's anything wrong with my code??
take a look here - http://codepen.io/silentarrowz/pen/YwoGMB
Hemang Kumar
@hemangsk
Feb 23 2016 12:09
@silentarrowz °C x 9/5 + 32 = °F
Solberg
@BuLbaR
Feb 23 2016 12:11
@silentarrowz is it supposed to show my country?
Hemang Kumar
@hemangsk
Feb 23 2016 12:13
@silentarrowz the temp in json object is in Kelvin
faraz
@silentarrowz
Feb 23 2016 12:13
@BuLbaR yes, it shows the initials of the country and the city you live in
Hemang Kumar
@hemangsk
Feb 23 2016 12:14
T(°F) = T(K) × 9/5 - 459.67
convert into fahrenheit using this
and then into Celsius
faraz
@silentarrowz
Feb 23 2016 12:14
@hemangsk really?? maybe that's why I am getting this kind of temperature
Hemang Kumar
@hemangsk
Feb 23 2016 12:14
Yeah
it is in kelvin
Solberg
@BuLbaR
Feb 23 2016 12:14

@silentarrowz Latitude: 59.913868799999996
Longitude: 10.7522454

show country here

Show temperature here

Show weather here

show map here

faraz
@silentarrowz
Feb 23 2016 12:14
well, I'll go ahead and correct it then. I thought it was in fahrenheit and so things werent matching up
@BuLbaR maybe you didnt allow it to get your location
Hemang Kumar
@hemangsk
Feb 23 2016 12:15
@BuLbaR yep open the pen in new tab
Solberg
@BuLbaR
Feb 23 2016 12:16
@silentarrowz that worked. its over the boiling point here =P
@silentarrowz and i dont understand farenheit
faraz
@silentarrowz
Feb 23 2016 12:19
@BuLbaR yeah, even I was getting weird temperatures here. maybe it's because it was showing in kelvin and i didnt know that. let me fix it now
@BuLbaR @hemangsk it's done now. please check it again
Marius Brad
@mbrad26
Feb 23 2016 12:35
I need some help with the Wiki challenge. I can't make the api url return anything on the console. Thanks http://codepen.io/mbrad26/pen/bEPmGV?editors=0011
Marius Brad
@mbrad26
Feb 23 2016 12:45
Anyone?
kirbyedy
@kirbyedy
Feb 23 2016 12:55
hang on :)
Marius Brad
@mbrad26
Feb 23 2016 12:56
Sure :)
kirbyedy
@kirbyedy
Feb 23 2016 12:59
'https://en.wikipedia.org/w/api.php?callback=?&action=opensearch&search=' + input + '&limit=20&namespace=0&format=json'
how about now
Marius Brad
@mbrad26
Feb 23 2016 12:59
just a sec
It's alive
kirbyedy
@kirbyedy
Feb 23 2016 13:00
:thumbsup:
Marius Brad
@mbrad26
Feb 23 2016 13:01
But what was wrong...?
Thanks @kirbyedy
CamperBot
@camperbot
Feb 23 2016 13:01
mbrad26 sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star: 524 | @kirbyedy | http://www.freecodecamp.com/kirbyedy
kirbyedy
@kirbyedy
Feb 23 2016 13:01
I guess the json call
The line I gave you is mine
so compare it and see the difference
Marius Brad
@mbrad26
Feb 23 2016 13:02
Ok thanks man
kirbyedy
@kirbyedy
Feb 23 2016 13:02
console was saying... Refused to execute script from 'https://en.wikipedia.org/w/api.php?
and dont ask me why, I am really bad at this
Marius Brad
@mbrad26
Feb 23 2016 13:02
:)
me too it seems:)
Hemang Kumar
@hemangsk
Feb 23 2016 13:09
@silentarrowz Great! shows correct values now :smile:
krzysztofstanislawek
@krzysztofstanislawek
Feb 23 2016 13:32
Hi all!
kirbyedy
@kirbyedy
Feb 23 2016 13:37
dobry den
Venutom
@Venutom
Feb 23 2016 13:52
hi @krzysztofstanislawek
Dulshani Gunawardhana
@dshgna
Feb 23 2016 14:23
Hi! I'm a bit stuck in the calculator project. I don't want to implement the complete AI as yet, but want some non-random way for the computer to fill in the slots. Any suggestions for an approach I can follow?
Here's my code for destroyer function:
function destroyer(arr) {
  arr = arr.filter(function(currentVal){
    for(var i=1; i < arguments.length; i++){
      if(currentVal == arguments[i]){
        return false;
      }
    }
    return true;
  });
  return arr;
}
faraz
@silentarrowz
Feb 23 2016 15:08
thanks to you @hemangsk
CamperBot
@camperbot
Feb 23 2016 15:08
silentarrowz sends brownie points to @hemangsk :sparkles: :thumbsup: :sparkles:
:star: 309 | @hemangsk | http://www.freecodecamp.com/hemangsk
Arpit Saxena
@arpit-saxena
Feb 23 2016 15:10
Anyone?
Matthew Boland
@mattboland
Feb 23 2016 15:48
@arpit-saxena try renaming arr in your second line. create a new variable that will equal the following function that invokes arr
as you have it now arguments is undefined
var arguments = arr.filter...
Matthew Boland
@mattboland
Feb 23 2016 15:53
i need help understanding what is wrong with my javascript thus far on the weather app. when i run the following the console error tells me there is too much recursion and I cannot get it to print anything that I want from the json in the api...
if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(function(position) {
var lat = position.coords.latitude;
var lon = position.coords.longitude;
var api = "api.openweathermap.org/data/2.5/weather?lat="; + lat + "&lon=" + lon + "&appid=7f7ac04d02aeb07ff1fdce9eb35ca237";
$.getJSON(api, function(json){
$("#location").html(json.name);
console.log(json.name);
});
});
};
Joseph Morse
@jnmorse
Feb 23 2016 16:02
wiki format
CamperBot
@camperbot
Feb 23 2016 16:02

:point_right: code formatting [wiki]

Inline code

This an inline `<paste code here>` code formatting with a single backtick(`) at start and end around the code.

Code Block

```js ⇦ Type 3 backticks and then press [shift + enter ⏎] (type js or html or css)

<paste your code here>,
then press [shift + enter ⏎]

``` ⇦ Type 3 backticks, then press [enter ⏎]

See also: ☛ How to type Backticks | ☯ Compose Mode | ❄ Gitter Formatting Basics

:pencil: read more about code formatting on the FCC Wiki

Matthew Boland
@mattboland
Feb 23 2016 16:04
'''
if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(function(position) {
var lat = position.coords.latitude;
var lon = position.coords.longitude;
var api = "api.openweathermap.org/data/2.5/weather?lat=";; + lat + "&lon=" + lon + "&appid=7f7ac04d02aeb07ff1fdce9eb35ca237";
$.getJSON(api, function(json){
$("#location").html(json.name);
console.log(json.name);
});
});
};
'''
CamperBot
@camperbot
Feb 23 2016 16:04
:bulb: to format code use backticks! ``` more info
Joseph Morse
@jnmorse
Feb 23 2016 16:04
@mattboland have you tried to console.log(json) and check the console to see if your getting data back
@mattboland btw backticks are the character left of 1 on your keyboard
Coira Ellison
@Coira
Feb 23 2016 16:08
@mattboland are these two semi-colons meant to be here ";; + lat ?
Richard
@stormgrass
Feb 23 2016 16:08
@Coira @mattboland that's what I was thinking. And in the first example above, there was only one of them. I think they might be the problem.
Matthew Boland
@mattboland
Feb 23 2016 16:09
if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(function(position) {
var lat = position.coords.latitude;
var lon = position.coords.longitude;
var api = "api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + lon + "&appid=7f7ac04d02aeb07ff1fdce9eb35ca237";
$.getJSON(api, function(json){
$("#location").html(json.name);
console.log(json.name);
});
});
};
Coira Ellison
@Coira
Feb 23 2016 16:09
@stormgrass i think you got the wrong person :)
Matthew Boland
@mattboland
Feb 23 2016 16:10
@jnmorse i tried console.log(json) but the console error tells me there is too much recursion
Richard
@stormgrass
Feb 23 2016 16:10
@Coira oh, no, I was referring to your answer to @mattboland
Joseph Morse
@jnmorse
Feb 23 2016 16:10
@mattboland can you copy and paste you pen url
Coira Ellison
@Coira
Feb 23 2016 16:10
oh right!
Coira Ellison
@Coira
Feb 23 2016 16:12
@mattboland api.openweathermap should be //api.openweathermap
Matthew Boland
@mattboland
Feb 23 2016 16:13
wow. thank you @Coira
CamperBot
@camperbot
Feb 23 2016 16:13
:star: 489 | @coira | http://www.freecodecamp.com/coira
mattboland sends brownie points to @coira :sparkles: :thumbsup: :sparkles:
Coira Ellison
@Coira
Feb 23 2016 16:13
np :)
Matthew Boland
@mattboland
Feb 23 2016 16:13
and thanks @jnmorse for showing me the code formatting for these chats
CamperBot
@camperbot
Feb 23 2016 16:13
mattboland sends brownie points to @jnmorse :sparkles: :thumbsup: :sparkles:
Coira Ellison
@Coira
Feb 23 2016 16:13
if you run into cors error, try https:// or http://
CamperBot
@camperbot
Feb 23 2016 16:13
:star: 423 | @jnmorse | http://www.freecodecamp.com/jnmorse
Richard
@stormgrass
Feb 23 2016 16:15
@Coira openweathermap, unfortunately, doesn't allow SSL for free APIs
Coira Ellison
@Coira
Feb 23 2016 16:15
ah ok, couldn't remember offhand
Richard
@stormgrass
Feb 23 2016 16:16
@Coira only mentioning that because I tried running it via an https site and it didn't work
Marius Brad
@mbrad26
Feb 23 2016 16:20
Hi guys. I'm working on my Wiki app and there is a small issue with my code. Each time I make a search the first thing that comes out is "undifined" followed by the search results. Anyone knows how to fix this? Thanks http://codepen.io/mbrad26/pen/bEPmGV?editors=0011
Coira Ellison
@Coira
Feb 23 2016 16:30
@mbrad26 html += "<p>" + data[1][i] + "</p>"; change the += to =
or give var html a value (e.g. var html = "")
Joseph Morse
@jnmorse
Feb 23 2016 16:31
@mbrad26 if you define your html var before the for loop var html = '' then move your output, $(".wiki").html(html); to after your for loop, you wont get undefined
Marius Brad
@mbrad26
Feb 23 2016 16:33
@Coira @jnmorse Thanks guys:)
CamperBot
@camperbot
Feb 23 2016 16:33
mbrad26 sends brownie points to @coira and @jnmorse :sparkles: :thumbsup: :sparkles:
:star: 424 | @jnmorse | http://www.freecodecamp.com/jnmorse
:star: 490 | @coira | http://www.freecodecamp.com/coira
Jas K
@jask84
Feb 23 2016 16:36
@h4r1m4u sorry for late reply. Yeah all is well, just getting through the wikipedia viewer project as we speak.
Arpit Saxena
@arpit-saxena
Feb 23 2016 16:36
I feel extremely angry when I, most of the times, types int i = 0 instead of var i = 0 owing to C and C++ I have been using for more than a year
Matt Leonard
@matty22
Feb 23 2016 16:40
Running into a CORS error in the wikipedia viewer project. I am reading this in the documentation:
origin When accessing the API using a cross-domain AJAX request (CORS), set this to the originating domain. This must be included in any pre-flight request, and therefore must be part of the request URI (not the POST body). This must match one of the origins in the Origin header exactly, so it has to be set to something like https://en.wikipedia.org or https://meta.wikimedia.org. If this parameter does not match the Origin header, a 403 response will be returned. If this parameter matches the Origin header and the origin is whitelisted, an Access-Control-Allow-Origin header will be set.
Joseph Morse
@jnmorse
Feb 23 2016 16:40
@arpit-saxena lol, muscle memory, it happens, I sometimes find myself trying to use something from php in javascript then wonder why its not working.. :fire:
Matt Leonard
@matty22
Feb 23 2016 16:41
But that doesn't tell me how to do that.
Coira Ellison
@Coira
Feb 23 2016 16:43
@arpit-saxena i used to quite calm before i started using javascript, but look at my photo/avatar now...
Andrew Charlebois
@andrewchar
Feb 23 2016 16:49
does anyone use firebase web hosting service
or any web hosting service..
Alex Dobre
@Zerelt
Feb 23 2016 16:51
guys for the past 2 days i'm trying to make a simple ajax call with this mess of a react library ... right now i'm reducing it all down to a bare minimum to figure out what i'm doing wrong .. can anybody tell me what's wrong with this ?
var Order = React.createClass({
  getInitialState: function() {
    return {

      usrnme:'',
    };
  },

  componentDidMount:function() {
    $get(this.props.source, function(result) {
        this.setState({
          usrnme: result[0].username
        });
    }.bind(this));
  },

  render: function() {
    return (
      <div>
        <div>{this.state.usrnme}</div>
      </div>
    )
  }

});

  ReactDOM.render(<Order source = "http://fcctop100.herokuapp.com/api/fccusers/top/recent"/>, document.body)
Coira Ellison
@Coira
Feb 23 2016 16:52
@Zerelt $.get rather than $get ?
Alex Dobre
@Zerelt
Feb 23 2016 16:52
fml
Matt Leonard
@matty22
Feb 23 2016 16:52
Haha
Alex Dobre
@Zerelt
Feb 23 2016 16:52
seriously i want to die rigth now ..
Coira Ellison
@Coira
Feb 23 2016 16:52
:p
Alex Dobre
@Zerelt
Feb 23 2016 16:52
@Coira thank you
CamperBot
@camperbot
Feb 23 2016 16:52
zerelt sends brownie points to @coira :sparkles: :thumbsup: :sparkles:
:star: 491 | @coira | http://www.freecodecamp.com/coira
Hemang Kumar
@hemangsk
Feb 23 2016 16:54
@matty22 Thats CORS quite a notorious pain in the head while doing wikipedia viewer zipline..
@matty22 have you included " &callback=? " in api call
h4r1m4u
@h4r1m4u
Feb 23 2016 16:58
@jask84 great, making progress!
Joseph Morse
@jnmorse
Feb 23 2016 16:59
@andrewchar I use digital ocean
Andrew Charlebois
@andrewchar
Feb 23 2016 17:00
@jnmorse i just wanna ask about picture hosting.. i just deployed my first site to firebase and my picture is a broken image. im trying to google how im suppose to fix but finding nothing
@jnmorse do you have to have the images hosted for them to work?
Joseph Morse
@jnmorse
Feb 23 2016 17:02
@andrewchar yes the images need to be hosted somewhere, either on your host or another you can pull from
Andrew Charlebois
@andrewchar
Feb 23 2016 17:10
@jnmorse thank you so much. fixed
CamperBot
@camperbot
Feb 23 2016 17:10
andrewchar sends brownie points to @jnmorse :sparkles: :thumbsup: :sparkles:
:star: 425 | @jnmorse | http://www.freecodecamp.com/jnmorse
Andrew Charlebois
@andrewchar
Feb 23 2016 17:10
finished the tribute, first time using a host woohoo. https://tribute.firebaseapp.com/
now i wanna put everything i have to host lol
instead of showing it on codepen, i kind of dislike codepen
Chethan Bhat
@chethanbhat
Feb 23 2016 17:11
hey guys
please checkout my wikipedia viewer . would be grateful for your feedback
Matt Leonard
@matty22
Feb 23 2016 17:18

@hemangsk No, I haven't. Here's my API URL:

"https://en.wikipedia.org/w/api.php?action=query&titles=" + searchQuery + "&format=json"

Where searchQuery is the variable holding the value the user typed into the search bar.
Hemang Kumar
@hemangsk
Feb 23 2016 17:19
@matty22 "https://en.wikipedia.org/w/api.php?action=query&titles=" + searchQuery + "&format=json&callback=?"
Matt Leonard
@matty22
Feb 23 2016 17:20
Do I replace the ? with something? Or literally type &callback=?
Hemang Kumar
@hemangsk
Feb 23 2016 17:20
Yeah just type it literally
&callback=?
can you share the codepen link?
Matt Leonard
@matty22
Feb 23 2016 17:23
I am not working in codepen. Working locally.
Here's the pertinent bit of my JS:
var wikipediaString = "https://en.wikipedia.org/w/api.php?action=query&titles=" + searchQuery + "&format=json&callback=?";
    $.get(wikipediaString, function(json){
        console.log(json);
    });
Chethan Bhat
@chethanbhat
Feb 23 2016 17:25
@matty22 what problem are u facing
i just finished the challenge
hope i can help
Matt Leonard
@matty22
Feb 23 2016 17:25
CORS error
Here's my console error: XMLHttpRequest cannot load https://en.wikipedia.org/w/api.php?action=query&titles=bats&format=json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.
Chethan Bhat
@chethanbhat
Feb 23 2016 17:26
okay
Matt Leonard
@matty22
Feb 23 2016 17:26
Note that the error and what I have in my variable above are not consistent. The error doesn't have &callback=? on the end.
Chethan Bhat
@chethanbhat
Feb 23 2016 17:27
see the problem is due to requests originating from the same browser
please use ajax function
checkout my codepen
i have used the ajax function
in ajax function, use datatype to jsonp instead of json
it will solve your problem
Matt Leonard
@matty22
Feb 23 2016 17:30
I have no idea what your (or any) ajax function does. Have a good resource for reading?
instead of get use ajax
Hemang Kumar
@hemangsk
Feb 23 2016 17:32
@matty22 modified the api call a bit
$.getJSON("http://en.wikipedia.org/w/api.php?format=json&action=query&generator=search&gsrsearch=" + value + "&callback=?", function(json){
console.log(json);
}
$.getJSON("http://en.wikipedia.org/w/api.php?format=json&action=query&generator=search&gsrsearch=" + value + "&callback=?", function(json){
               console.log(json);
ehekatlOf
@ehekatlOf
Feb 23 2016 17:33
did anyone manage to do the wikipedia zipline without angular?
I'm getting bodied every time I make an api call with .ajax
Matt Leonard
@matty22
Feb 23 2016 17:34
@hemangsk No change. My error still shows the old URL as well.
XMLHttpRequest cannot load https://en.wikipedia.org/w/api.php?action=query&titles=mats&format=json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.
Hemang Kumar
@hemangsk
Feb 23 2016 17:35
@matty22 Using $.getJSON () ?
Matt Leonard
@matty22
Feb 23 2016 17:35
Yep.
Hemang Kumar
@hemangsk
Feb 23 2016 17:36
can you paste the code here
Sujit Karki
@Swoozeki
Feb 23 2016 17:36
@hemangsk Yes, you can
Matt Leonard
@matty22
Feb 23 2016 17:37
$.getJSON("http://en.wikipedia.org/w/api.php?format=json&action=query&generator=search&gsrsearch=" + searchQuery + "&callback=?", function(json){ console.log(json); });
$.getJSON("http://en.wikipedia.org/w/api.php?format=json&action=query&generator=search&gsrsearch=" + searchQuery + "&callback=?", function(json){
        console.log(json);
    });
ehekatlOf
@ehekatlOf
Feb 23 2016 17:38
is there a good resource to read up on whether to use .ajax or .getJSON?
because the weather zipline API call was fairly straightforward
but I'm at a loss on how to handle the wikipedia one
Hemang Kumar
@hemangsk
Feb 23 2016 17:38
@matty22 looking into it
Matt Leonard
@matty22
Feb 23 2016 17:42
Weird. My URL is the exact copy of that and it doesn't work.
Please help me with this
I am not getting what the code is all about
Matt Leonard
@matty22
Feb 23 2016 17:47
Ok, I quit for now. Thanks @hemangsk and @chethanbhat
CamperBot
@camperbot
Feb 23 2016 17:47
matty22 sends brownie points to @hemangsk and @chethanbhat :sparkles: :thumbsup: :sparkles:
:star: 312 | @chethanbhat | http://www.freecodecamp.com/chethanbhat
:star: 310 | @hemangsk | http://www.freecodecamp.com/hemangsk
Hemang Kumar
@hemangsk
Feb 23 2016 17:50
@arpit-saxena You hava JSON Object { "":"" } ... You have to access the elements inside it, and show those elements in HTML using javascript
have a JSON*
Arpit Saxena
@arpit-saxena
Feb 23 2016 17:51
@hemangsk can you explain the code line by line pls... Only the one which is asked to enter
json.forEach(function(val) { var keys = Object.keys(val); html += "<div class = 'cat'>"; keys.forEach(function(key) { html += "<b>" + key + "</b>: " + val[key] + "<br>"; }); html += "</div><br>"; });
This one

Caleb Martin
@caleb272
Feb 23 2016 17:52
can someone tell me why in the weather api its returning 293 for weatherData.main.temp
Rahul Gandhi
@gandhirahul
Feb 23 2016 17:53
its kelvin @caleb272
Caleb Martin
@caleb272
Feb 23 2016 17:53
o ok thanks
Rahul Gandhi
@gandhirahul
Feb 23 2016 17:53
you can provide the units
Caleb Martin
@caleb272
Feb 23 2016 17:53
ya i will just convert it
Rahul Gandhi
@gandhirahul
Feb 23 2016 17:53
if you want default as celcius or fahernheit
cool
ehekatlOf
@ehekatlOf
Feb 23 2016 17:53
@caleb272 temp -273
Roberto Di Lillo
@koop4
Feb 23 2016 17:55
hi guys
Hemang Kumar
@hemangsk
Feb 23 2016 17:56

@arpit-saxena forEach () function.. Read more about it here https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

It traverses the whole array, sending one element at a time, inside the callback function. The callback function in this case is function(val){..} so.. forEach( )
function send each element of array (whose name is "json") , one by one in the function(val)..

ehekatlOf
@ehekatlOf
Feb 23 2016 17:57
can anyone help me on where to get started on the wikipedia API call?
Roberto Di Lillo
@koop4
Feb 23 2016 17:58
I'm implementing a Siding Scroll Layout, any hint on how to have it responsive? Oo
Hemang Kumar
@hemangsk
Feb 23 2016 17:59

@ehekatlOf This is a simple example of an API call which can be made Wikipedia,

https://en.wikipedia.org/w/api.php?action=query&titles=Main%20Page&prop=revisions&rvprop=content&format=json

Arpit Saxena
@arpit-saxena
Feb 23 2016 18:00
@hemangsk what about the keys = objects line...
From where did the object came from?
Hemang Kumar
@hemangsk
Feb 23 2016 18:00
Object.keys is a function
Arpit Saxena
@arpit-saxena
Feb 23 2016 18:00
For? @hemangsk
Hemang Kumar
@hemangsk
Feb 23 2016 18:01
It returns the list of properties of an Object
as an array
Arpit Saxena
@arpit-saxena
Feb 23 2016 18:01
Thank you @hemangsk
CamperBot
@camperbot
Feb 23 2016 18:01
arpit-saxena sends brownie points to @hemangsk :sparkles: :thumbsup: :sparkles:
:star: 311 | @hemangsk | http://www.freecodecamp.com/hemangsk
Hemang Kumar
@hemangsk
Feb 23 2016 18:02
@arpit-saxena So "keys" becomes an array
Suppose I have an object, var obj = { "property 1": "value" , "property 2": "some value"};
and if I say
key = Object.keys(obj);
then key will be = ["property1", "property2"];
thats it..
Caleb Martin
@caleb272
Feb 23 2016 18:04
why is this function throwing an error
function kelvinToFehrenheit(kelvin) {
    return (((kelvin - 273.15) x 1.8) + 32);
  }
Hemang Kumar
@hemangsk
Feb 23 2016 18:04
@arpit-saxena key will now store the property names as strings
@caleb272 Use '*' instead of 'x' sign for multiplication
Caleb Martin
@caleb272
Feb 23 2016 18:06
o duh is so stupid sometimes
Henk
@Xerceng
Feb 23 2016 18:07
Can somebody help me? I want to fade in the divs #1, #2 and #3 when someone hovers over #img1, #img2 and #img3. But it doesn't work, codepen: http://codepen.io/Xerceng/pen/mVYNbK
Chris Trumbull
@tbullcoder
Feb 23 2016 18:20
I can't get my tweet window to display my current quote. Any ideas?
  <div class="container-fluid">
    <div class=" row ">
      <div style="font-family: 'Rock Salt', cursive; font-size: 36px;" class="col-sm-12 text-center">
        Tao Te Ching
        <p></p>
        <div style="font-family: 'Rock Salt', cursive; font-size: 18px;"> -- Lao Tzu</div>
      </div>
    </div>
    <div style="font-size: 16px;" class="row text-center" id="laoTzu">

    </div>
  </div>
  <div class="row ">
    <div style="font-family: 'Rock Salt', cursive; font-size: 12px;" class="col-sm-12 text-center">

      <ul class="list-inline text-center">
        <li>
          <a href="https://en.wikipedia.org/wiki/Tao_Te_Ching" target="_blank" class="btn btn-default btn-md btn-social"><i class="fa fa-wikipedia-w"></i>iki link</a>
        </li>
        <li>
          <button type="button" class="btn btn-default btn-lg btn-social" onclick="newQuote() ">New Quote</button>
          </a>
        </li>
        <li>
          <a class="btn btn-default btn-md btn-social" href="https://twitter.com/intent/tweet?>
            <i class="fa fa-twitter"></i> Tweet
          </a>
        </li>

      </ul>
    </div>


  </div>
  </div>
  <div class="container-fluid">
    <div class=" row ">
      <div style="font-family: 'Rock Salt', cursive; font-size: 36px;" class="col-sm-12 text-center">
        Tao Te Ching
        <p></p>
        <div style="font-family: 'Rock Salt', cursive; font-size: 18px;"> -- Lao Tzu</div>
      </div>
    </div>
    <div style="font-size: 16px;" class="row text-center" id="laoTzu">

    </div>
  </div>
  <div class="row ">
    <div style="font-family: 'Rock Salt', cursive; font-size: 12px;" class="col-sm-12 text-center">

      <ul class="list-inline text-center">
        <li>
          <a href="https://en.wikipedia.org/wiki/Tao_Te_Ching" target="_blank" class="btn btn-default btn-md btn-social"><i class="fa fa-wikipedia-w"></i>iki link</a>
        </li>
        <li>
          <button type="button" class="btn btn-default btn-lg btn-social" onclick="newQuote() ">New Quote</button>
          </a>
        </li>
        <li>
          <a class="btn btn-default btn-md btn-social" href="https://twitter.com/intent/tweet?>
            <i class="fa fa-twitter"></i> Tweet
          </a>
        </li>

      </ul>
    </div>


  </div>
  </div>
Rahul Gandhi
@gandhirahul
Feb 23 2016 18:28
@tbullcoder you have to append it at the end as query parameters.
TinT1
@TinT1
Feb 23 2016 18:30
http://codepen.io/Topolovec/pen/WrVGae
need help with jQuery, not sure why my #div-image is not animated and bouncing
h4r1m4u
@h4r1m4u
Feb 23 2016 18:32
@Xerceng you forgot to import jquery into your codepen
add this as a JS resource in the settings: https://code.jquery.com/jquery-1.12.1.min.js
TinT1
@TinT1
Feb 23 2016 18:33
i imported jQuery in codepen but not working
h4r1m4u
@h4r1m4u
Feb 23 2016 18:33
@TinT1 the bounce and animated classes are from animate.css which you didn't import. https://daneden.github.io/animate.css/
once you've imported the library, you don't actually need to add the classes with jquery. you can simply add them in your HTML (i.e. unless you want to add them on a specific event, for example a hover or click on the image). as you have it right now, they'll be added on page load and it's not necessary to use jquery for that
Chris Trumbull
@tbullcoder
Feb 23 2016 18:35
@gandhirahul I've been trying that, but can't get it to work.
TinT1
@TinT1
Feb 23 2016 18:36
@h4r1m4u how do i import animate.css
h4r1m4u
@h4r1m4u
Feb 23 2016 18:36
@TinT1 you need to download it, then host it somewhere, then import into your pen
@TinT1 actually, you can import it directly from here: https://cdn.jsdelivr.net/animatecss/3.5.1/animate.min.css
it's a free CDN
@tbullcoder what does your JS code look like?
TinT1
@TinT1
Feb 23 2016 18:39
<h1 class="text-center text-primary animated bounce"style="font-family:Serif;">Albert Einstein</h1> so this is no working i imported from that last site u post
h4r1m4u
@h4r1m4u
Feb 23 2016 18:40
i don't see it imported in your codepen
oh, you imported it as a JS resource
it's a CSS library
not JS
TinT1
@TinT1
Feb 23 2016 18:41
@h4r1m4u uh sorry for taking your time on a silly thing
h4r1m4u
@h4r1m4u
Feb 23 2016 18:41
np
Chris Trumbull
@tbullcoder
Feb 23 2016 18:42
@h4r1m4u
function newQuote() {
  var quote = [];
  quote[0] = "The wise man is one who, knows, what he does not know. ";
  quote[1] = "Those who know, do not speak. Those who speak, do not know. ";
  quote[2] = "When you are content to be simply yourself and do not compare or compete, everyone will respect you. ";
  quote[3] = "The truth is not always beautiful, nor beautiful words the truth. ";
  quote[4] = "A man with outward courage dares to die; a man with inner courage dares to live. ";
  quote[5] = "Do you have the patience to wait until your mud settles and the water is clear? ";
  quote[6] = "The flame that burns twice as bright burns half as long. ";
  quote[7] = "If you try to change it, you will ruin it. Try to hold it, and you will lose it. ";
  quote[8] = "To understand the limitation of things, desire them. ";
  quote[9] = "Success is as dangerous as failure. Hope is as hollow as fear. ";
  quote[10] = "Fill your bowl to the brim and it will spill. Keep sharpening your knife and it will blunt. ";
  quote[11] = "If you want to know me, Look inside your heart. ";
  quote[12] = "He is free from self-display, and therefore he shines; ";
  quote[13] = "Clay is fashioned into vessels; but it is on their empty hollowness, that their use depends ";
  quote[14] = "Where the Mystery is the deepest is the gate of all that is subtle and wonderful. ";
  quote[15] = "A violent wind does not last for a whole morning; a sudden rain does not last for the whole day. ";
  quote[16] = "He who overcomes himself is mighty. ";
  quote[17] = "Sincere words are not fine; fine words are not sincere ";
  quote[18] = "Abstaining from speech marks him who is obeying the spontaneity of his nature. ";
  quote[19] = "So it is that existence and non-existence give birth the one to the other. ";
  var q = quote.length;
  var selectedQuote = Math.round(Math.random() * (q - 1));

  document.getElementById("laoTzu").innerHTML = quote[selectedQuote];
}
newQuote();

// end of first script

window.twttr = (function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0],
    t = window.twttr || {};
  if (d.getElementById(id)) return t;
  js = d.createElement(s);
  js.id = id;
  js.src = "https://platform.twitter.com/widgets.js";
  fjs.parentNode.insertBefore(js, fjs);

  t._e = [];
  t.ready = function(f) {
    t._e.push(f);
  };

  return t;
}(document, "script", "twitter-wjs"));
TinT1
@TinT1
Feb 23 2016 18:42
@h4r1m4u working ^^
h4r1m4u
@h4r1m4u
Feb 23 2016 18:45
@tbullcoder my advice, ditch the twitter widget and use twitter intents instead. basically all you need to do is to create a link in the following format: <a href="https://twitter.com/intent/tweet?text=Some+text" target="_blank">Tweet</a> where 'Some+text' is the text of your quote. in your JS code then manipulate and update the href attribute of this <a> element and add your newly generated quote into the URL
using the twitter widget makes things more complicated because the widget actually changes your HTML structure and embeds the Tweet button as an iframe
more on the twitter intents here: https://dev.twitter.com/web/tweet-button/web-intent
@TinT1 cool
Chris Trumbull
@tbullcoder
Feb 23 2016 18:48
@h4r1m4u Thanks. I'll give it a try
CamperBot
@camperbot
Feb 23 2016 18:48
tbullcoder sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1466 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 23 2016 18:48
no prob
Chris Hinton
@hintcj
Feb 23 2016 18:53
I'm working on the personal portfolio zipline. Is there a resource that will teach me how to create the different sections? I'm having trouble with sizing the different sections
Chris Trumbull
@tbullcoder
Feb 23 2016 19:02
@h4r1m4u How do I change the URL to find the newly generated quote?
Khalysi
@Khalysi
Feb 23 2016 19:04
got my sample portfolio page done ^.^ http://codepen.io/Khalysi/full/JGQwGW/
pinkmanbox
@pinkmanbox
Feb 23 2016 19:04
guys. can someone help me out? I need to know how to check if an html tag is empty
h4r1m4u
@h4r1m4u
Feb 23 2016 19:04
@tbullcoder something like document.getElementById("myTweetLink").setAttribute('href', "http://whateveryoururlis)
so your tweet <a> should have an id which use to select it. and your quote text is quote[selectedQuote] after you generated the random number. so now you just need to put all these ingredients together
Omran Abazid
@OmranAbazid
Feb 23 2016 19:05
@hintcj can you explain more what do you mean by sizing
the hight, the width or you want to make content centered?
h4r1m4u
@h4r1m4u
Feb 23 2016 19:06
@pinkmanbox you ok with a jquery solution?
Omran Abazid
@OmranAbazid
Feb 23 2016 19:07
@pinkmanbox in jquery you can do something like
if($('div').html()=="") do something
pinkmanbox
@pinkmanbox
Feb 23 2016 19:07
i would prefer javascript, but let's hear it
Chris Hinton
@hintcj
Feb 23 2016 19:08
@OmranAbazid The height is what I am referring to. So far, I have 3 sections and for whatever reason the second page height is much smaller than the other two. http://codepen.io/hintcj/full/LGvQGw/
h4r1m4u
@h4r1m4u
Feb 23 2016 19:08
yup. if( $('your-element').html() ) should do it
you don't need to compare it to an empty string
in vanilla JS, if ( document.getElementById('your-id').innerHTML ) should work
@pinkmanbox
Omran Abazid
@OmranAbazid
Feb 23 2016 19:10
@hintcj your section 3 is inside section 2
make sure you close the div of section 2 before section 3
@hintcj you are doing well with bootstrap so far
Chris Hinton
@hintcj
Feb 23 2016 19:12
@OmranAbazid whoops. Thank you for the help and compliment
CamperBot
@camperbot
Feb 23 2016 19:12
hintcj sends brownie points to @omranabazid :sparkles: :thumbsup: :sparkles:
:star: 195 | @omranabazid | http://www.freecodecamp.com/omranabazid
pinkmanbox
@pinkmanbox
Feb 23 2016 19:15
@h4r1m4u Thanks man. Much love
CamperBot
@camperbot
Feb 23 2016 19:15
pinkmanbox sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1467 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 23 2016 19:15
:heart:
Omran Abazid
@OmranAbazid
Feb 23 2016 19:15
@hintcj anytime :smile:
Leonel
@Leloofico
Feb 23 2016 19:16
hi i am looking for help

function myFunction() {
var myVar= 'use strict';

console.log(myVar);
}
myFunction();

// run and check the console
// myVar is not defined outside of myFunction
console.log(myVar);

// now remove the console log line to pass the test

error on No global myVar variable
Omran Abazid
@OmranAbazid
Feb 23 2016 19:21
@Leloofico remove the console.log(myvar); line
and then press next and you will pass it
Caleb Martin
@caleb272
Feb 23 2016 19:24
^ really that makes or breaks it
Chris Trumbull
@tbullcoder
Feb 23 2016 19:27
@h4r1m4u My tweet id would be id="myTweetLink" in your example? I don't understand what "my" URL is.
the id myTweetLink is just an example. you just need to select the tweet <a> element somehow, so you can use an id or class.
Clark Arnold
@clarkarnold
Feb 23 2016 19:40
Does anybody have any tips for Wikipedia Viewer? I am struggling to understand how to use the API, and the sandbox is not making much sense..
Caleb Martin
@caleb272
Feb 23 2016 19:40
how do you make a well circular
?
its a bootstrap well
Jess Johnson
@jessjo
Feb 23 2016 19:45
@caleb272 why do you need a circular well?
@clarkarnold what are you stuck on?
Caleb Martin
@caleb272
Feb 23 2016 19:45
for this
Clark Arnold
@clarkarnold
Feb 23 2016 19:46
@jessjo I am having trouble figuring out where to start.. the sandbox is not making any sense to me for some reason
I can't really figure out how to get it to give me a URL to call
Jess Johnson
@jessjo
Feb 23 2016 19:47
@clarkarnold I didn't love their API documentation. Can you get urls that work when you just call them in the browser?
h4r1m4u
@h4r1m4u
Feb 23 2016 19:47
@caleb272 you could add border-radius: 50%; to #main-well. it'll make it round-ish. if you want a perfect circle, you need to make sure the height and width of the well is the same
Caleb Martin
@caleb272
Feb 23 2016 19:47
k thanks
Chris Trumbull
@tbullcoder
Feb 23 2016 19:48

@h4r1m4u Sorry to bother you again. Here is what I have.

<a class="btn btn-default btn-md btn-social" id="tweety" href="https://twitter.com/intent/tweet?" target="_blank">
            <i class="fa fa-twitter"></i> Tweet
          </a>

var q = quote.length;
  var selectedQuote = Math.round(Math.random() * (q - 1));

  document.getElementById("laoTzu").innerHTML = quote[selectedQuote];

  document.getElementById("tweety").setAttribute('href', "https://twitter.com/intent/tweet?");
}
newQuote();

I get that this changes the href on the twitter <a> element. I just don't get how it can be a twitter url and refer to my quote.

Jess Johnson
@jessjo
Feb 23 2016 19:49
@clarkarnold - the first thing I'd do is figure out a URL that you can call successfully in the browser. There's a few trip ups with cross-site scripting errors that you have to work through (if you start running into errors you can't figure out make sure you have your developer console open in your browser to help you catch!) but the first step is just getting one that works when you call it in a browser tab.
h4r1m4u
@h4r1m4u
Feb 23 2016 19:49

@tbullcoder the text of your quote is in quote[selectedQuote]. so now you just need to append it to the intent URL:

document.getElementById("tweety").setAttribute('href', "https://twitter.com/intent/tweet?text=" + quote[selectedQuote] );

i think this should work

Clark Arnold
@clarkarnold
Feb 23 2016 19:50
@jessjo So you mean get one in the sandbox and then copy and paste into the address bar?
Caleb Martin
@caleb272
Feb 23 2016 19:51
thanks @h4r1m4u
CamperBot
@camperbot
Feb 23 2016 19:51
caleb272 sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1468 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 23 2016 19:52
np
Alex Dobre
@Zerelt
Feb 23 2016 19:55

this react syntax is so messed up man ... how can you have the heart to make something like this ... 2 days straight to make an ajax call .. finally made ONE name appear today thanks to coira's help noticing that i missed a dot -_- and now i'm stuck having no idea if i'm trying to loop through the array properly

var Order = React.createClass({
  getInitialState: function() {
    return {

      usrnme:[],
    };
  },

  componentDidMount:function() {
    $.get(this.props.source, function(result) {

        this.setState({
          usrnme: result.data.children
        });

    }.bind(this));
  },

  render: function() {
    x = this.state.usrnme || [];
    return (
      <div>
        {x.map(function(y) {
          return (<div id="box">
                    <div>{y.data.username}</div>
                  </div>)
        })}
      </div>

    );
  }

});

  ReactDOM.render(<Order source = "http://fcctop100.herokuapp.com/api/fccusers/top/recent"/>, document.body);

anybody has an idea what i'm doing wrong here ? :/

George Carroll
@ghcarrolljr
Feb 23 2016 20:01
I need help with my Front End Project. How do I link my quote to Twitter?
Caleb Martin
@caleb272
Feb 23 2016 20:01
one second let me get the one i used
h4r1m4u
@h4r1m4u
Feb 23 2016 20:02
@ghcarrolljr if you go through the chat above (in the last hour or so), i discussed how to do it with @tbullcoder
Caleb Martin
@caleb272
Feb 23 2016 20:02
@ghcarrolljr http://twitter.com/home/?status=" + $("#quote").html()
that is what i used
Joseph Morse
@jnmorse
Feb 23 2016 20:03
@Zerelt pretty sure result.data.children should just be result.data
Alex Dobre
@Zerelt
Feb 23 2016 20:04
won't work even without that 'data' @jnmorse
oh wait
i tried it with just children and with just data
nothing
Chris Trumbull
@tbullcoder
Feb 23 2016 20:15
@h4r1m4u omg. finally got it. appreciate your patience
Alex Dobre
@Zerelt
Feb 23 2016 20:15
OMG !!!!!! finally
i was using an example i managed to find (only god knows how since aparently react is the most hyped thing since the facebook ipo, but there are as many examples as there are natural white lions in the world)
and was adding some extra stuff to search for by mistake which did not exist in that fcc api link
@jnmorse thanks realized thanks to your help
CamperBot
@camperbot
Feb 23 2016 20:18
zerelt sends brownie points to @jnmorse :sparkles: :thumbsup: :sparkles:
:star: 426 | @jnmorse | http://www.freecodecamp.com/jnmorse
V Arun Kumar
@arunvkumr
Feb 23 2016 20:26
i have completed the tribute challenge, need feedback on my design.
http://codepen.io/arunkumrv/full/dGLZRV/
i tried to keep it as close to original.:smile:
Alex Dobre
@Zerelt
Feb 23 2016 20:30
looks nice ... i'd do something about that extra grey space on the sides when it's full screen ... i have just a 22 inch monitor and when it's full screen it's a bit too much ...when it's half a screen it'ok.. but hey maybe that's just me ... that quote is awesome though :D
Jack Lyons
@JackEdwardLyons
Feb 23 2016 20:32
hey guys I am trying to make my clock responsive, but its not responding to my media queries, any ideas? I want to make the buttons stack on top of each other and fit into the div
any suggestions?
or reasons why its not responding?
thank you in advance!!
V Arun Kumar
@arunvkumr
Feb 23 2016 20:33
@Zerelt thanks for feedback. i'll see what should be done to about the grey space.
CamperBot
@camperbot
Feb 23 2016 20:33
arunkumrv sends brownie points to @zerelt :sparkles: :thumbsup: :sparkles:
:star: 368 | @zerelt | http://www.freecodecamp.com/zerelt
Bryan Wegman
@bwyan
Feb 23 2016 20:35
@JackEdwardLyons I don’t see any media queries, but you might not need any. Your buttons aren’t stacking because their width is a percentage.
Jack Lyons
@JackEdwardLyons
Feb 23 2016 20:36
oh, because i didnt save the pen since last time! haha sorry
Bryan Wegman
@bwyan
Feb 23 2016 20:36
Aah.
Jack Lyons
@JackEdwardLyons
Feb 23 2016 20:37
oh ok so, change the percentage to px?
Bryan Wegman
@bwyan
Feb 23 2016 20:37
yeah. that’ll force the second button to stack under the first.
Alex Dobre
@Zerelt
Feb 23 2016 20:38
and that left margin you have for the reset button is making them to not be aligned when they're stacked
@JackEdwardLyons
Jack Lyons
@JackEdwardLyons
Feb 23 2016 20:38
hmm yeah it stacks regardless, what i am trying to tweak is the margin between them
i tried changing the display to inline when its smaller and that helps
but the media query wont respond..
Alex Dobre
@Zerelt
Feb 23 2016 20:38
add that extra 5 pixels to the right margin of the start button
and remove the left margin from the reset button
Bryan Wegman
@bwyan
Feb 23 2016 20:39
You could put each button in its own <div class="col-xs-12>
<div class="col-xs-12">
Jack Lyons
@JackEdwardLyons
Feb 23 2016 20:40
yeah.. good idea @bwyan ill try that
thanks @Zerelt
CamperBot
@camperbot
Feb 23 2016 20:40
jackedwardlyons sends brownie points to @zerelt :sparkles: :thumbsup: :sparkles:
:star: 369 | @zerelt | http://www.freecodecamp.com/zerelt
Matas
@bonchanm
Feb 23 2016 20:42
Hey guys, any ideas how to make jumbotron background image the right size, nothing works :/
but they still wont stack up now..
Gershon Papi
@papigers
Feb 23 2016 20:48
Hey guys, I'm working on the portfolio page using bootstrap, I'm looking at the example portfolio and I can't figure out how he used the fixed-switching background, I'm guessing it's some kind of mix with affix and scrollspy, any suggestions?
Omran Abazid
@OmranAbazid
Feb 23 2016 20:52
@papigers he did not use anything
just make the background-image of the div fixed and you will get the same effect
Matthew Boland
@mattboland
Feb 23 2016 20:56
hey all, i'm struggling to see what is wrong with my switch statement that keeps it from changing the image source depending on the weather. http://codepen.io/MattBoland/pen/gPEGKo?editors=1010
Bryan Wegman
@bwyan
Feb 23 2016 20:58
@JackEdwardLyons I have to run, but here’s a starting point (i added the orange borders so you can easily see what the div’s behaviors are)
        <div class="row row-centered">
          <div class="col-md-1 buttons">
            <button id="playpause" class="btn btn-start">
              Start
            </button>
          </div>
          <div class="col-md-1 buttons">
            <button id="playpause" class="btn btn-start">
              Reset
            </button>
          </div>
        </div>
Omran Abazid
@OmranAbazid
Feb 23 2016 20:58
@mattboland default case does not need a break
Bryan Wegman
@bwyan
Feb 23 2016 20:58
And on your CSS, remove display: and float:
.buttons { 
  margin: 20px 5px 0px 0px; 
  width: 45%;
  border: 1px dotted orange;
}
You’ll have some more work to do to get the centering done.
Matthew Boland
@mattboland
Feb 23 2016 21:03
@OmranAbazid ok, that makes sense. however, the image source still does not change. any ideas?
Omran Abazid
@OmranAbazid
Feb 23 2016 21:05
@mattboland can you please make sure that your codepen is working correclty and give me the link again because you have errors in the js
Matthew Boland
@mattboland
Feb 23 2016 21:07
@OmranAbazid yeah, let me get back to you on that... im getting this error now: " An iframe which has both allow-scripts and allow-same-origin for its sandbox attribute can remove its sandboxing"
Dave
@db001
Feb 23 2016 21:16
Hi, my weather page will show the weather when I click on the button, but if I take the button out (and the code from the JS) the weather doesn't show on the page. Any ideas please?
greg
@wearenotgroot
Feb 23 2016 21:17
@mattboland should be json.weather[0].main on your switch
Matthew Boland
@mattboland
Feb 23 2016 21:19
@wearenotgroot good catch, thanks. however i cannot test that currently as codepen all of a sudden decided to not work.
CamperBot
@camperbot
Feb 23 2016 21:19
mattboland sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star: 938 | @wearenotgroot | http://www.freecodecamp.com/wearenotgroot
greg
@wearenotgroot
Feb 23 2016 21:20
@mattboland how is that?
@mattboland did you add the missing ) on the second } after the switch default ?
Dariusz Biskupski
@Visiona
Feb 23 2016 21:21
hi all, qq I am starting building Random Quote Machine... is it something I can built on knowledge from the challenges only? or googling? I dont want to look into the code
Omran Abazid
@OmranAbazid
Feb 23 2016 21:21
@db001 it is working with me even without the button
@Visiona it is just an array that you randomly choose an element of
that is all
nothing new i guess
greg
@wearenotgroot
Feb 23 2016 21:22
@db001 the reason is that the geolocate is an async call on googles api meaning the code below it executes and doesnt wait for it to finish or received data
Matthew Boland
@mattboland
Feb 23 2016 21:24
@wearenotgroot yes, that's where i have the ) and it makes sense to be there(i think) but codepen says its an error and will no longer load the user interface
greg
@wearenotgroot
Feb 23 2016 21:24
@db001 when you had the button it allowed for time for the response from google api to deliver the data so that when the user click the button it will be ready(lat and lon)
@mattboland

if (navigator.geolocation) {
  navigator.geolocation.getCurrentPosition(function(position) {
      var lat = position.coords.latitude;
      var lon = position.coords.longitude;
      var api = "//api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + lon + "&appid=7f7ac04d02aeb07ff1fdce9eb35ca237";

      $.getJSON(api, function(json) {
        console.log(json);
          var tempC = Math.round(json.main.temp - 273.15);
          $("#location").html(json.name);
          $("#temp").html(tempC);
          $("#cels").click(function() {
            $("#temp").html(tempC);
          });
          $("#faren").click(function() {
            var far = Math.round((json.main.temp - 273.15) * 1.8 + 32);
            $("#temp").html(far);
          });
          $("#weath").html(json.weather[0].main + ": " + json.weather[0].description);

          switch (json.weather[0].main) {
            case "Thunderstorm":
              document.getElementById("myImg").src = 'http://openweathermap.org/img/w/11d.png';
              break;
            case "Drizzle":
              document.getElementById("myImg").src = 'http://openweathermap.org/img/w/09d.png';
              break;
            case "Rain":
              document.getElementById("myImg").src = "http://openweathermap.org/img/w/10d.png";
              break;
            case "Snow":
              document.getElementById("myImg").src = 'http://openweathermap.org/img/w/13d.png';
              break;
            case "Clear":
              document.getElementById("myImg").src = 'http://openweathermap.org/img/w/01d.png';
            case "Clouds":
              document.getElementById("myImg").src = 'http://openweathermap.org/img/w/03d.png';
              break;
            case "Atmosphere":
              document.getElementById("myImg").src = 'http://openweathermap.org/img/w/50d.png';
              break;
            default:
              document.getElementById("myImg").src = "https://www.google.com/url?sa=i&rct=j&q=&esrc=s&source=images&cd=&cad=rja&uact=8&ved=0ahUKEwim9Kr-4I7LAhVBdD4KHWbZB-oQjRwIAw&url=http%3A%2F%2Fspore.wikia.com%2Fwiki%2FFile%3AQuestion-mark.png&psig=AFQjCNG_mFi_G9Lt0I7R30NSAMloSjTKNw&ust=1456346866331272";
          };
        }); //<---------------------missing on yours
      });
  }
Dave
@db001
Feb 23 2016 21:25
@wearenotgroot so how do I ensure the data is received before the rest of the code runs?
greg
@wearenotgroot
Feb 23 2016 21:25
@db001 by doing this
$(document).ready(function() {

  navigator.geolocation.getCurrentPosition(function(position) {
  lat = position.coords.latitude;
  long = position.coords.longitude;
  $("#data").html("latitude: " + lat + "<br>longitude: " + long);
  weatherCall = "http://api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + long + "&APPID=2dece6437b9269efec3f645327f480d2&units=metric";

// $('#getMessage').on("click", function() {
    $.getJSON(weatherCall, function(json) {
      tempInC = Math.round(json.main.temp) + "&deg;C";
      clouds = json.weather[0].description;
      wIcon = '<img src="http://openweathermap.org/img/w/' + json.weather[0].icon + '.png" />';
      $(".message").html(tempInC + ", " + clouds);
      $("#weatherIcon").html(wIcon);
      $(".readout").html(JSON.stringify(json));
    });
//  });

    });
});
Matthew Boland
@mattboland
Feb 23 2016 21:26
@wearenotgroot haha, well thanks again.
CamperBot
@camperbot
Feb 23 2016 21:26
mattboland sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:warning: mattboland already gave wearenotgroot points
marcdaley
@marcdaley
Feb 23 2016 21:26

Hello all you fine people. Has anyone had issues when they try to click on a button to get to an external link and it only works with right-click? Here is part of my code.

<a href="https://www.facebook.com/stork99"class="btn btn-block btn-info">Facebook</a>
</div>

greg
@wearenotgroot
Feb 23 2016 21:26
@mattboland YW
Dave
@db001
Feb 23 2016 21:27
@wearenotgroot That's great, thank you!
CamperBot
@camperbot
Feb 23 2016 21:27
db001 sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star: 939 | @wearenotgroot | http://www.freecodecamp.com/wearenotgroot
greg
@wearenotgroot
Feb 23 2016 21:27
@db001 having it inside the getCurrentLocation callback ensures that it will be triggered when the data is received
@db001 YW
Alex Dobre
@Zerelt
Feb 23 2016 21:28
@db001 made it work .. had to make some modification to your code but made it work xD

try it like this :

$(document).ready(function() {
  if(navigator.geolocation) {
  navigator.geolocation.getCurrentPosition(function(position) {
    var lat = position.coords.latitude;
    var long = position.coords.longitude;
    // $("#data").html("latitude: " + lat + "<br>longitude: " + long);
    // weatherCall = "http://api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + long + "&APPID=2dece6437b9269efec3f645327f480d2&units=metric";


  $.getJSON("http://api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + long + "&APPID=2dece6437b9269efec3f645327f480d2&units=metric", function(json) {
    tempInC = Math.round(json.main.temp) + "&deg;C";
    clouds = json.weather[0].description;
    wIcon = '<img src="http://openweathermap.org/img/w/' + json.weather[0].icon + '.png" />';
    $(".message").html(tempInC + ", " + clouds);
    $("#weatherIcon").html(wIcon);
    $(".readout").html(JSON.stringify(json));
  }); });
  }
});

aww you already got helped with it 5 min ago .. didn't notice xD

marcdaley
@marcdaley
Feb 23 2016 21:30
If anyone is interested here is my tribute page. http://codepen.io/marcdaley/pen/rxRNLM
greg
@wearenotgroot
Feb 23 2016 21:33
@marcdaley the text is a bit hard to read because of the color and the background(colors clashing)
@marcdaley looks good :+1:
Dave
@db001
Feb 23 2016 21:33
@Zerelt lol, no worries, appreciate the effort though, thanks!
CamperBot
@camperbot
Feb 23 2016 21:33
db001 sends brownie points to @zerelt :sparkles: :thumbsup: :sparkles:
:star: 370 | @zerelt | http://www.freecodecamp.com/zerelt
marcdaley
@marcdaley
Feb 23 2016 21:35
@wearenotgroot Thanks!
CamperBot
@camperbot
Feb 23 2016 21:35
marcdaley sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star: 941 | @wearenotgroot | http://www.freecodecamp.com/wearenotgroot
marcdaley
@marcdaley
Feb 23 2016 21:36
@wearenotgroot I changed the text to yellow in the tribute page to make it easier to read.
greg
@wearenotgroot
Feb 23 2016 21:38
@marcdaley or you can add a bit of a background behind the text, just to separate it from the page background
@marcdaley try this in your css just to test it out------->
ul{background:rgba(0,0,0,.8);}
marcdaley
@marcdaley
Feb 23 2016 21:43

@wearenotgroot I changed the background to white for now and will adjust it at a later date.

Have you had issues with button links only working when you right-click on them?

greg
@wearenotgroot
Feb 23 2016 21:44
@marcdaley hmm cant say i have
@marcdaley browser settings perhaps?
Martin Hesko
@martinhesko
Feb 23 2016 21:44
Can i get some advice on how to make the h1's on the bottom of the page to get closer to each other? http://codepen.io/Sorbo/pen/dGxNKX
Tommy
@Saintgein
Feb 23 2016 21:45
Anyone care for some criticism?
Thanks!
marcdaley
@marcdaley
Feb 23 2016 21:46
@UjoHesko Do you have &nbsp between the h1s?
Martin Hesko
@martinhesko
Feb 23 2016 21:48
@marcdaley nope
Marius Brad
@mbrad26
Feb 23 2016 21:48
@Saintgein It looks kind of cool. It could use some more padding on the left side.
Tommy
@Saintgein
Feb 23 2016 21:49
:) I was thinking of that too, have to watch the padding for the smaller screens tho. Otherwise the text gets messed up.
marcdaley
@marcdaley
Feb 23 2016 21:50
@UjoHesko Have you tried <div class="row" before your h1s? That might work better than my original idea?
greg
@wearenotgroot
Feb 23 2016 21:51
@UjoHesko why not do this instead
<h1 class="col-xs-10 col-xs-offset-1 coming-soon">
         <p> "Oh, what an ordinary day. Take out the garbage, masturbate"</p>
         <p class="pull-right">- Birth In Reverse</p>
</h1>
Martin Hesko
@martinhesko
Feb 23 2016 21:52
@marcdaley solved it by copypasting few &nbsp's after first line, thanks :)
CamperBot
@camperbot
Feb 23 2016 21:52
ujohesko sends brownie points to @marcdaley :sparkles: :thumbsup: :sparkles:
:star: 182 | @marcdaley | http://www.freecodecamp.com/marcdaley
marcdaley
@marcdaley
Feb 23 2016 21:53
Glad I could help!
Jack Lyons
@JackEdwardLyons
Feb 23 2016 21:54
thank you @bwyan ill play around with that, appreciate the help :)
CamperBot
@camperbot
Feb 23 2016 21:54
jackedwardlyons sends brownie points to @bwyan :sparkles: :thumbsup: :sparkles:
:star: 259 | @bwyan | http://www.freecodecamp.com/bwyan
rtc31293
@rtc31293
Feb 23 2016 22:02
@cragsify thanks for directin me here. I'm reallllyyyyy close to finishing the Exact Change advanced algorithm after literally two days of work and this is my output: [["TWENTY", "60.00"], ["TEN", "20.00"], ["FIVE", "15"], ["ONE", "1"], ["QUARTER", "0.50"], ["DIME", "0.20"], ["PENNY", "0.04"]]. This result is 99% correct, but I need to remove the quotes around each number value, e.g. "60.00" needs to be 60.00. If I try parseInt, the function cuts off the trailing zeros and gives me simply, 60. If I use toFloat(2), it turns the number back into a string with the proper trailing zeros. I will be forever grateful for any advice on this!!
CamperBot
@camperbot
Feb 23 2016 22:02
rtc31293 sends brownie points to @cragsify :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for cragsify
Andrew Perrin
@Pezz18
Feb 23 2016 22:24
Hi all, i have just reached the random quote generator challenge, im attempting to get the click event to work, by initially using the original example completed in the 'Change Text with Click Events' challenge, but struggling to figure out how to get it to work in code pen... any suggestions??
greg
@wearenotgroot
Feb 23 2016 22:28
@Pezz18 you forgot to add jquery on js settings
Jared Abel
@jaredabel
Feb 23 2016 22:29
anyone around who can assist with the wiki api?
Matt Bajorek
@mattbajorek
Feb 23 2016 22:32
@mattbajorek
Hey guys I'm working on the first project: Build a Tribute Page and I'm stuck on trying to get the top margin of the jumbotron to display with the css code for the body as shown in the video
Lanitta
@DivaWeb
Feb 23 2016 22:46
@mattbajorek here is a goo video about working with jumbotrons it is something I keep in my info arsonal
Andrew Perrin
@Pezz18
Feb 23 2016 22:49
hi, i have just reached the random quote generator and am a little puzzled....
in the challenges leading up to this, we learn how to Get JSON with the jQuery getJSON Method... my question is, where do you build a js object to hold your quotes your then going to randomly display??
@wearenotgroot yeah, twigged not too long after posting my question! got another one now though!
Juwdohr
@Juwdohr
Feb 23 2016 22:52
How do I do a button to tweet my quotes for the Random Quote Machine?
Andrew Perrin
@Pezz18
Feb 23 2016 22:53
@Jarvis-327 where do you put the quotes to start with? im just starting out on this challenge...
Juwdohr
@Juwdohr
Feb 23 2016 22:54
@Pezz18 Do them as an array or use an api. Also they go into the JS area of codepen.io
Andrew Perrin
@Pezz18
Feb 23 2016 22:56
ok, litrelly within the js section then,. thanks :smile:
Juwdohr
@Juwdohr
Feb 23 2016 22:57
@Pezz18 No problem. Still trying to figure out the Twitter Button.
Andrew Perrin
@Pezz18
Feb 23 2016 22:57
@Jarvis-327 ok, well i will let you know if i figure it out! - not even created my twitter button yet though! only just started the challenge, so probably will also get stuck!
Michael Bildstein
@mbildstein
Feb 23 2016 23:28
Could someone please help with the weather api challenge?
satish
@satishreddy04
Feb 23 2016 23:28
hello every one, i am unable to write a code to build a wikipedia viewer. can any one help with that?
Juwdohr
@Juwdohr
Feb 23 2016 23:30
Is there a way to create links that go to another pen?
mehulbhardwaj
@mehulbhardwaj
Feb 23 2016 23:51
Hi Guys, I've made a project on codepen http://codepen.io/mehulbhardwaj/pen/eJwpQm. Have a look and let me know if you like it
Also, does anyone know how to handle the dangling closing-quote at the bottom?
Lanitta
@DivaWeb
Feb 23 2016 23:52
@mehulbhardwaj very nice
mehulbhardwaj
@mehulbhardwaj
Feb 23 2016 23:53
@DivaWeb well thanks :)
CamperBot
@camperbot
Feb 23 2016 23:53
mehulbhardwaj sends brownie points to @divaweb :sparkles: :thumbsup: :sparkles:
:star: 220 | @divaweb | http://www.freecodecamp.com/divaweb