These are chat archives for FreeCodeCamp/HelpFrontEnd

13th
Jul 2016
Juan Moraza
@Morazajuan
Jul 13 2016 00:00
@GregatGit I know i found it kinda anoying that the background was changing alot. Thanks again! :D
CamperBot
@camperbot
Jul 13 2016 00:00
morazajuan sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:warning: morazajuan already gave gregatgit points
Peter Kenward
@PeterKenward
Jul 13 2016 00:00
That's some good advice @GregatGit . And yes I will check back @Harry97. I shall find an api which just works and move on. :)
Elbert Cortez
@trip16661
Jul 13 2016 00:00
@GregatGit I don't know greg even though I agree about not getting stuck checking the code itself really don't help them and it creates a cheating pattern which is not nice
PeterKenward @PeterKenward goes for tea.
Elbert Cortez
@trip16661
Jul 13 2016 00:00
I still suffer from it xD
FarionLord
@FarionLord
Jul 13 2016 00:00
http://codepen.io/Farion/pen/kXxZkm How do I make the italic work?
Elbert Cortez
@trip16661
Jul 13 2016 00:02
<h3>Basic Information<h3>
<p>
remember to always close brackets
FarionLord
@FarionLord
Jul 13 2016 00:02
Oh...
Thanks @trip16661
CamperBot
@camperbot
Jul 13 2016 00:02
farionlord sends brownie points to @trip16661 :sparkles: :thumbsup: :sparkles:
:cookie: 394 | @trip16661 |http://www.freecodecamp.com/trip16661
Elbert Cortez
@trip16661
Jul 13 2016 00:03
and why instead of adding a new tag to it
Ken Haduch
@khaduch
Jul 13 2016 00:03
@trip16661 @GregatGit - you're welcome. It helped me to understand it a lot better. Now if I could just get the hang of the IIFE (Immediately Invoked Function Expressions) that would be great. I have gotten an example of that to work, but I have to go back and look at other things before I get it going successfully! :)
Greg Duncan
@GregatGit
Jul 13 2016 00:03
@PeterKenward use this till you find a good one var myQuotes = ['Quote One', 'Author One', 'Quote Two', 'Author Two', 'Quote Three', 'Author Three', 'Quote Four', 'Author Four', 'Quote Five', 'Author Five', 'Quote Six', 'Author Six'];
Elbert Cortez
@trip16661
Jul 13 2016 00:03
why don't you just style it
@FarionLord search for "font-style" css property
FarionLord
@FarionLord
Jul 13 2016 00:04
@trip16661 Thanks again
CamperBot
@camperbot
Jul 13 2016 00:04
farionlord sends brownie points to @trip16661 :sparkles: :thumbsup: :sparkles:
:warning: farionlord already gave trip16661 points
Elbert Cortez
@trip16661
Jul 13 2016 00:06
@khaduch well the other day i was reading about IIFE and modules and i felt they were talking in old english.. I really couldn't understand anything and felt depressed and left :(
Harry Adel
@harryadel
Jul 13 2016 00:06
@PeterKenward Well, Peter, If you want an api that's simple and works, try this one : http://quotesondesign.com/api-v4-0/
I helped a camper with it before, so if you faced a problem, I shall be of a good use.
before with*
Elbert Cortez
@trip16661
Jul 13 2016 00:08
I used this http://www.stands4.com before when i wanted to search an api with a n author query
Ken Haduch
@khaduch
Jul 13 2016 00:08
@trip16661 - It is a rather tricky concept, at least I find it to be so... There are a few things like this that are really esoteric, or at least I think so. Perhaps I haven't studied (and learned) enough Computer Science...
Greg Duncan
@GregatGit
Jul 13 2016 00:09
@trip16661 The way we learn and how we understand things is dramatically different - if I can't figure something out I will grab the anwser and tease it apart - if I don't get then I will just move on and come back to it.
Harry Adel
@harryadel
Jul 13 2016 00:11
@GregatGit damn, dude. I wish someone told me that before.
Elbert Cortez
@trip16661
Jul 13 2016 00:12
For me it just feel a bit too abstract in my head it just doesn't make sense even though i know it should make sense. @khaduch
@GregatGit I can understand the decomposition and examination of an answer for a better understanding of the problem
but sometimes we have to find or solve a problem by ourselves and t hat's where the issue is
Harry Adel
@harryadel
Jul 13 2016 00:16
The server request doesn't return 200
Harry Adel
@harryadel
Jul 13 2016 00:21
I've checked our code at http://jsonlint.com/
Harry Adel
@harryadel
Jul 13 2016 00:36
@PeterKenward Ops, sorry, it does return 200
David Clark
@DavidDoes
Jul 13 2016 00:40
How do I create links to sections in a scrolling website?
Harry Adel
@harryadel
Jul 13 2016 00:41
@SlouchingToast In your hyper links instead of typing a url
just simply type #div
David Clark
@DavidDoes
Jul 13 2016 00:41
Example, @Harry97 ?
pages such as http://www.example.org/foo.html#bar the fragment refers to the element with id="bar".
David Clark
@DavidDoes
Jul 13 2016 00:43
Right, how do I get it to work though? Haha
I've got: <a href="portfoliopage">Portfolio</a> with a class="portfoliopage" but it doesn't work
Gary Siu
@GarySiu
Jul 13 2016 00:43
Just put the #bar part in your href
You need the #
David Clark
@DavidDoes
Jul 13 2016 00:44
So I should be using id not class?
Harry Adel
@harryadel
Jul 13 2016 00:44
add a dot
Gary Siu
@GarySiu
Jul 13 2016 00:44
Also it needs to be an id not class yeah :P
David Clark
@DavidDoes
Jul 13 2016 00:44
Will that mess up my CSS at all once I replace the . with a #?
Harry Adel
@harryadel
Jul 13 2016 00:44
When you are tying to reference a class
add a dot
Gary Siu
@GarySiu
Jul 13 2016 00:44
IDs are unique. You can't link to a class.
Harry Adel
@harryadel
Jul 13 2016 00:45
@GarySiu You can't link a class ! Oh, first time to know that
David Clark
@DavidDoes
Jul 13 2016 00:45
Right, right, but in my CSS. Are attributes for classes and id's the same? Such as, font-size, background-image, etc.
Harry Adel
@harryadel
Jul 13 2016 00:45
@SlouchingToast Here's an example: <a href="#main-board">Home</a>
Gary Siu
@GarySiu
Jul 13 2016 00:45
They're the same but an element can have both an ID and a class
(and multiple classes if you want)
Harry Adel
@harryadel
Jul 13 2016 00:46
and add id="main-board" to your div or whatever you want
David Clark
@DavidDoes
Jul 13 2016 00:46
BRB going to try this
Gary Siu
@GarySiu
Jul 13 2016 00:47
Good luck!
David Clark
@DavidDoes
Jul 13 2016 00:48
Still no good
Got it! :) Missed putting the # in the href
Thank you @Harry97 and @GarySiu
CamperBot
@camperbot
Jul 13 2016 00:52
slouchingtoast sends brownie points to @harry97 and @garysiu :sparkles: :thumbsup: :sparkles:
:cookie: 120 | @garysiu |http://www.freecodecamp.com/garysiu
:warning: could not find receiver for harry97
David Clark
@DavidDoes
Jul 13 2016 00:52
Any ideas why bg images get screwed up a lot? They decide not to show.
Abdul Shabbir
@abdulqshabbir
Jul 13 2016 00:55
@SlouchingToast it could be because you're using background-image: cover
@SlouchingToast when you use 'cover' your image gets stretched to completely take up its parent container. Maybe use background-size: contain?
@SlouchingToast should have said *background-size
David Clark
@DavidDoes
Jul 13 2016 00:57
container makes it waaaay too large
@abdulqshabbir
How do I make the navbar button "active" once on that section?
Olga C
@Octopinky
Jul 13 2016 01:01
@PeterKenward I think there might be a mistake in the json file itself. It you try running your code with this json file: http://jsonplaceholder.typicode.com/posts/1, it at least gives some output on the console.log(json) command
Harry Adel
@harryadel
Jul 13 2016 01:03
@Octopinky You can get an output !!
For me, it returns nothing
Greg Duncan
@GregatGit
Jul 13 2016 01:05
@Morazajuan You got that text fading in and out perfectly- nice work
Olga C
@Octopinky
Jul 13 2016 01:05
@Harry97 yes, once the url is switched, then the output is at least possible. Maybe there are sytax errors in the original file
Harry Adel
@harryadel
Jul 13 2016 01:07
@Octopinky I'm glad that you found that out
I've been trying to get it to work but in vain
He's going to move on to another api, I believe
Ken Haduch
@khaduch
Jul 13 2016 01:09
@Harry97 - the thing about this (maybe it's been mentioned here) is that ID values are supposed to be unique (It is not valid to use the same value more than once) so that makes a unique target for the link. Class names, by nature, are able to be used multiple times. although you can make unique classes, but it is less common to do that, I would say? For these small projects, it might be more the case that classes are not used multiple times. too.
Harry Adel
@harryadel
Jul 13 2016 01:11
@khaduch You are absolutely right. I get your point but I thought @SlouchingToast was using a unique class, so I didn't bother to ask him to use an id
David Clark
@DavidDoes
Jul 13 2016 01:14
How can I get "active" working on navbar links?
Harry Adel
@harryadel
Jul 13 2016 01:15
@SlouchingToast What do you mean ?
as far as I know just add class="active"
and make sure Bootstrap is working
David Clark
@DavidDoes
Jul 13 2016 01:16
Well, how do I make it responsive?
If I just add the "active" class, it just highlights that item.
How can I make it respond to clicks?
Google is giving me a lot but none of it works.
Harry Adel
@harryadel
Jul 13 2016 01:18
you add hover in your css
you can*
David Clark
@DavidDoes
Jul 13 2016 01:19
No
When you click it, and it takes you to that section.
It should switch from the previous active page to the next.
Abdul Shabbir
@abdulqshabbir
Jul 13 2016 01:20
@SlouchingToast you probably want to use the jquery method 'toggleClass' . This will add and remove a class of choice (in this case 'active')
Harry Adel
@harryadel
Jul 13 2016 01:20
try adding data-toggle="pill"
to your line tags and see if it helps
David Clark
@DavidDoes
Jul 13 2016 01:21
I don't have any pills
Olga C
@Octopinky
Jul 13 2016 01:24
@SlouchingToast It seems to be responsive to me. When I click on portfolio, it takes me to that section
Harry Adel
@harryadel
Jul 13 2016 01:25
@Octopinky He wants the highlight effect to move on to the button your have clicked onto
Abdul Shabbir
@abdulqshabbir
Jul 13 2016 01:25
@Octopinky I think @SlouchingToast means that when he clicks the button he would like it to change to a different colour
Olga C
@Octopinky
Jul 13 2016 01:26
@abdulqshabbir @Harry97 oh, yeah, I see it now.
David Clark
@DavidDoes
Jul 13 2016 01:26
@Octopinky the active class doesn't change
notice that "about" stays highlighted
It's the "active" status. Supposedly, this JS is supposed to do it, but it doesn't:
$(".nav a").on("click", function(){
$(".nav").find(".active").removeClass("active");
$(this).parent().addClass("active");
});
Olga C
@Octopinky
Jul 13 2016 01:28
@SlouchingToast everything is fine, just load your jquery in yout javascript section!
David Clark
@DavidDoes
Jul 13 2016 01:29
@Octopinky ?
Harry Adel
@harryadel
Jul 13 2016 01:29
@SlouchingToast I know I ain't much of help to you
Olga C
@Octopinky
Jul 13 2016 01:30
@SlouchingToast in settings, choose javascript. Load up jquery. Click save.
Harry Adel
@harryadel
Jul 13 2016 01:30
but you sure you've added jQuery and Bootstrap.js ?
David Clark
@DavidDoes
Jul 13 2016 01:31
Oh my goodness...
Thank you @Harry97 and @Octopinky
CamperBot
@camperbot
Jul 13 2016 01:31
slouchingtoast sends brownie points to @harry97 and @octopinky :sparkles: :thumbsup: :sparkles:
:cookie: 190 | @octopinky |http://www.freecodecamp.com/octopinky
:warning: could not find receiver for harry97
Olga C
@Octopinky
Jul 13 2016 01:31
@SlouchingToast lol. It happens to the best of us!
David Clark
@DavidDoes
Jul 13 2016 01:31
Harry, you don't get any cookies :(
^ @Harry97
Any ideas how to make it scroll to that section instead of jump? :)
Harry Adel
@harryadel
Jul 13 2016 01:32
yeah ik
David Clark
@DavidDoes
Jul 13 2016 01:35
Yep, just tried that.
Am I missing a simple step with that one as well, @Harry97 ? haha
Harry Adel
@harryadel
Jul 13 2016 01:36
hmm
try $("a").click(function() instead of jQuery("a").click(function()
David Clark
@DavidDoes
Jul 13 2016 01:37
nope
do I need to change jQuery function as well?
Harry Adel
@harryadel
Jul 13 2016 01:38
$("a").click(function() {
$('html, body').animate({
scrollTop: $("#elementtoScrollToID").offset().top
}, 2000);
});
John Alcher
@alchermd
Jul 13 2016 01:40

hey fellas. I'm having a hard time understanding RegExp. Is it possible to

var str = "I am a string with an array [1,2,3,4] inside";
str.replace( // delete everything between [ and ] );

How do I do that?

David Clark
@DavidDoes
Jul 13 2016 01:40
Should that be the whole script or replace some of it?
@Harry97
Harry Adel
@harryadel
Jul 13 2016 01:40
the whole script
David Clark
@DavidDoes
Jul 13 2016 01:40
no bueno @Harry97 "/
Harry Adel
@harryadel
Jul 13 2016 01:42
@SlouchingToast Can you give me your codepen and let me fiddle with it ?
Olga C
@Octopinky
Jul 13 2016 01:44
@Harry97 @SlouchingToast it works fine for me (when I insert code and #id into correct places :))
David Clark
@DavidDoes
Jul 13 2016 01:45
@Octopinky ?
Olga C
@Octopinky
Jul 13 2016 01:47
@SlouchingToast when you insert js code, put it in the JS section, rather than in the <style> above the head.
David Clark
@DavidDoes
Jul 13 2016 01:48
Haha @Octopinky I just came back to tell you I caught it
I was thinking it was a script for some reason
It works!
Olga C
@Octopinky
Jul 13 2016 01:48
@SlouchingToast YAY!
David Clark
@DavidDoes
Jul 13 2016 01:50
Guess what. I have more questions. :)
I figured out that using margin-left:auto will send my element to the right of the page. But is there a better way?
Harry Adel
@harryadel
Jul 13 2016 01:53
maybe float: right; would do the trick
David Clark
@DavidDoes
Jul 13 2016 01:54
Ack! Would you look at my codepen again? My bg images disappeared again. The only way to fix it – and this makes no sense – is to delete the background-image code, open the image again in a new tab, copy the url again, and re-write the code exactly the same way. Any ideas?
Ivan
@gonzalezi2
Jul 13 2016 01:56
hey guys did any of you run into the "No 'Access-Control-Allow-Origin' header is present on the requested resource." error when working on the Random Quote Generator project? I was able to get around it using a CORS enabler extension on chrome but that's not really a solution...
Harry Adel
@harryadel
Jul 13 2016 01:57
@gonzalezi2 yeah I keep running into it when working on api projects
Ivan
@gonzalezi2
Jul 13 2016 01:59
@Harry97 well like I said I just installed the CORS enabler on Chrome which stops the error but it's only temporary and I don't want to submit my code like that
Harry Adel
@harryadel
Jul 13 2016 01:59
Oh i thought you already modified your code
try adding "callback=?" to the end of url
Olga C
@Octopinky
Jul 13 2016 02:01
@SlouchingToast yes, I can see that. I can not reproduce it though, I do not see what causes it to happen
Harry Adel
@harryadel
Jul 13 2016 02:02
@SlouchingToast When I zoom out of your page everything looks out of place
@Octopinky Do you get the same issue ?
Ivan
@gonzalezi2
Jul 13 2016 02:04
@Harry97 hmmm not really fixing it for me.
$.ajax({
        url: 'http://api.forismatic.com/api/1.0/?method=getQuote&format=json&jsonp=parseQuote&lang=en',
        dataType: 'json',
        type: 'get',
        success: 
        function parseQuote(response)
        {...}
This is what I have
Harry Adel
@harryadel
Jul 13 2016 02:05
How about "https" instead of "http"
Peter Kenward
@PeterKenward
Jul 13 2016 02:05
@GregatGit Thanks
CamperBot
@camperbot
Jul 13 2016 02:05
peterkenward sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 681 | @gregatgit |http://www.freecodecamp.com/gregatgit
Ivan
@gonzalezi2
Jul 13 2016 02:06
That gives me ERR_INSECURE_RESPONSE error
Olga C
@Octopinky
Jul 13 2016 02:06
@SlouchingToast @Harry97 Yes, I do too.
Harry Adel
@harryadel
Jul 13 2016 02:07
@gonzalezi2 yeah same shit I was getting with my project
@Octopinky sorry to bother but may u help him out @gonzalezi2, please ?
Olga C
@Octopinky
Jul 13 2016 02:09
@Harry97 I will try
Harry Adel
@harryadel
Jul 13 2016 02:09
thank you @Octopinky
CamperBot
@camperbot
Jul 13 2016 02:09
harry97 sends brownie points to @octopinky :sparkles: :thumbsup: :sparkles:
:cookie: 191 | @octopinky |http://www.freecodecamp.com/octopinky
Olga C
@Octopinky
Jul 13 2016 02:09
@gonzalezi2 hi. Can you please paste your codepen link?
Darshan
@Dave1089
Jul 13 2016 02:09
@khaduch Thanks a lot ... will really help me a lot
CamperBot
@camperbot
Jul 13 2016 02:09
dave1089 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1436 | @khaduch |http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Jul 13 2016 02:11
@Dave1089 - you're welcome - I hope it does. It focuses on the returning of the function and what it does, shows that it works (which I guess I didn't have to do) but to try and simplify that part of the problem in isolation. Good luck - ask questions if necessary!
Darshan
@Dave1089
Jul 13 2016 02:11
@khaduch yes.. I will
:+1:
Ken Haduch
@khaduch
Jul 13 2016 02:15
@gonzalezi2 - if you change your dataType value to jsonp, it changes what happens, but there is another error after that. It does make a request and get a response, just having a parsing issue...
Olga C
@Octopinky
Jul 13 2016 02:18
@gonzalezi2 it seems like using jsonp would be the solution to this
@gonzalezi2 and I guess what @khaduch said. This issue seems to be ongoing for many people and many projects.
Harry Adel
@harryadel
Jul 13 2016 02:19
@Octopinky Is it caused because of chrome or codepen ?
Olga C
@Octopinky
Jul 13 2016 02:23
@Harry97 its definitely an issue with codepen
Ivan
@gonzalezi2
Jul 13 2016 02:23
@Octopinky @khaduch Yeah I tried changing it jsonp earlier as well but was not getting anything. S
According to the API I'm using though, jsonp should work
API method calls are implemented in the form of HTTP requests to the URL 
http://api.forismatic.com/api/1.0/. Query parameters are passed using POST or GET (URL-encoded) method. The server return data format is set by the query parameter. The following response formats are supported:
xml
json
jsonp
html
text
Galen Crofut
@Owl-Exterminator
Jul 13 2016 02:26
Hello! I have a bit of a problem. I'm doing the "Random Quote Generator" challenge, and am trying to implement the tweet button. I included a comment in the JS section where the problem is. I'd greatly appreciate it if someone can point out what's my error!
http://codepen.io/GCrofut/pen/PzJkKm?editors=1010
Olga C
@Octopinky
Jul 13 2016 02:26
@gonzalezi2 when I use jasonp, I get this error: "Uncaught SyntaxError: Unexpected token :"
Ivan
@gonzalezi2
Jul 13 2016 02:28
@Octopinky Everywhere online I've searched JSONP was always the answer, but doesn't work in this instance...hmmmm
Olga C
@Octopinky
Jul 13 2016 02:32
@gonzalezi2 yeah... crossorigin seems to be the solution that codepen support is offering: https://blog.codepen.io/2013/09/23/ajax-codepen/
Ivan
@gonzalezi2
Jul 13 2016 02:36
@Octopinky looks like I have some reading to do. Thanks!
CamperBot
@camperbot
Jul 13 2016 02:36
gonzalezi2 sends brownie points to @octopinky :sparkles: :thumbsup: :sparkles:
:cookie: 192 | @octopinky |http://www.freecodecamp.com/octopinky
Troy
@Socrates714
Jul 13 2016 02:55
I keep clicking I have completed the challenge on the create a tribute page challenge but it's not letting me go to the next challenge. How do I fix this bug?
nevermind. It's working now
Galen Crofut
@Owl-Exterminator
Jul 13 2016 03:15
For the problem in the pen I posted, I think there's a scope issue with the way I'm using document.setAttribute(), but I'm not sure because document.getElementById() works fine in the same context.
khanh19934
@khanh19934
Jul 13 2016 03:31
http://codepen.io/khanh1993/pen/EybEak?editors=1011 i dont know what i'm wrong when i console.log(data3.error) is undefined ... anyone can help ?
Greg Duncan
@GregatGit
Jul 13 2016 03:54
@khanh19934 why are you pushing everything into an array - why don't you just start off with an array of channels?
khanh19934
@khanh19934
Jul 13 2016 03:59
@GregatGit it's just for test :D
Hong
@designBuildShipSoftware
Jul 13 2016 04:51
Hi, I tried to get json search data from wikipedia, but the data did not show. I wonder what was wrong. Here is my code:
This message was deleted
This message was deleted
Sorin Ruse
@sorinr
Jul 13 2016 04:52
This message was deleted
Hong
@designBuildShipSoftware
Jul 13 2016 04:53
This message was deleted
This message was deleted
Hong
@designBuildShipSoftware
Jul 13 2016 05:00
<div>
      <input id="input1" type="text" placeholder="Click here to search">
    </div>
    <div class="result"></div>
$(document).ready(function() {
   $("#input1").keypress(function(event) {
     if (event.which == 13) {
       $.getJSON("https://en.wikipedia.org/w/api.php?action=query&format=json&list=search&utf8=1&srsearch=wiki",function(json){
         $(".result").html(JSON.stringify(json));
       });
     };
   });
 });
Above is my code. Anyone know?
Sorin Ruse
@sorinr
Jul 13 2016 05:03
@designBuildShipSoftware where do u read the input value to use it in your $.getJSON?
Hong
@designBuildShipSoftware
Jul 13 2016 05:04
@sorinr I did not use the input value yet. Just test getting json via this api first
Nothing changed when I pressed enter
I just use the api for searching the word "wiki"
I added jquery to my js. Should I add another library?
I guess not
Sorin Ruse
@sorinr
Jul 13 2016 05:08
@designBuildShipSoftware no. jq is enough. try write a console.log(event) before if statement and see whats inside
Hong
@designBuildShipSoftware
Jul 13 2016 05:10
@sorinr where should I check my console? I use codepen.io
Sorin Ruse
@sorinr
Jul 13 2016 05:11
@designBuildShipSoftware F12 if u r on chrome to bring up dev tools. or just write instead of console.log an alert('keypress event is triggered'); to be sure your function its working
Hong
@designBuildShipSoftware
Jul 13 2016 05:15
@sorinr console said "XMLHttpRequest cannot load https://en.wikipedia.org/w/api.php?action=query&format=json&list=search&utf8=1&srsearch=wiki. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.
what does this mean?
Sorin Ruse
@sorinr
Jul 13 2016 05:20
@designBuildShipSoftware you have a cross origin problem. it happens with codepenfor security reasons. try add https://www.crossorigin.me/ before https://en..... like https://www.crossorigin.me/https://en.wikipedia.....
buiphuking
@buiphuking
Jul 13 2016 05:24
i have a doom question guy, 500px = ? cm , help me,
i've got it, thanks
Hong
@designBuildShipSoftware
Jul 13 2016 05:25
@sorinr I tried.not working
Can someone please help me change the quote when the Next Quote button is clicked?
Hong
@designBuildShipSoftware
Jul 13 2016 05:39
@themasoodali The Math.random() should be put somewhere after on("click", ...)
This message was deleted
Kartik Mudgal
@Sprinting
Jul 13 2016 05:46
@themasoodali in the on.click() event listener generate a value for ran randomly :)
Mir Masood Ali
@themasoodali
Jul 13 2016 05:48
Thank you @Sprinting @designBuildShipSoftware. It worked. You guys are the best :)
CamperBot
@camperbot
Jul 13 2016 05:48
themasoodali sends brownie points to @sprinting and @designbuildshipsoftware :sparkles: :thumbsup: :sparkles:
:cookie: 284 | @designbuildshipsoftware |http://www.freecodecamp.com/designbuildshipsoftware
:cookie: 329 | @sprinting |http://www.freecodecamp.com/sprinting
Sorin Ruse
@sorinr
Jul 13 2016 05:49
@designBuildShipSoftware what message do u have in the console?
Kartik Mudgal
@Sprinting
Jul 13 2016 05:49
@themasoodali heh. have fun :) you can always ask in the main room though, if this one seems inactive :)
Hong
@designBuildShipSoftware
Jul 13 2016 05:49
@themasoodali You are welcome! BTW, I am not a guy :)
Mir Masood Ali
@themasoodali
Jul 13 2016 05:49
@Sprinting Sure I will. Thanks a ton :)
CamperBot
@camperbot
Jul 13 2016 05:49
themasoodali sends brownie points to @sprinting :sparkles: :thumbsup: :sparkles:
:warning: themasoodali already gave sprinting points
Mir Masood Ali
@themasoodali
Jul 13 2016 05:50
@designBuildShipSoftware I'm so sorry :D Thanks a ton :)
CamperBot
@camperbot
Jul 13 2016 05:50
themasoodali sends brownie points to @designbuildshipsoftware :sparkles: :thumbsup: :sparkles:
:warning: themasoodali already gave designbuildshipsoftware points
Hong
@designBuildShipSoftware
Jul 13 2016 05:50
@themasoodali That's fine. I am super glad to be able to help :) I am learning too
@sorinr 'Performance.onwebkitresourcetimingbufferfull' is deprecated. Please use 'Performance.onresourcetimingbufferfull' instead.
@sorinr webkitIndexedDB' is deprecated. Please use 'indexedDB' instead.
mixu1308
@mixu1308
Jul 13 2016 05:54
can someone tell me why the about this page and around the web sections are stacking instead of being next to each other even though I used #row
http://codepen.io/mixu1308/pen/MyGvVL
Hong
@designBuildShipSoftware
Jul 13 2016 05:54
@sorinr 'window.webkitStorageInfo' is deprecated. Please use 'navigator.webkitTemporaryStorage' or 'navigator.webkitPersistentStorage' instead.
Sorin Ruse
@sorinr
Jul 13 2016 05:55
@designBuildShipSoftware can you please post ur codepen link in here?
kirbyedy
@kirbyedy
Jul 13 2016 05:57
@mixu1308 if you want them side by side, use 2 columns of 6
mixu1308
@mixu1308
Jul 13 2016 05:58
@kirbyedy ok will try
Sorin Ruse
@sorinr
Jul 13 2016 05:58
@designBuildShipSoftware make it if (event.charcode == 13)
kirbyedy
@kirbyedy
Jul 13 2016 05:59
@mixu1308 and for some reason you put that div inside footer section
Hong
@designBuildShipSoftware
Jul 13 2016 05:59
@sorinr changed, still not working
mixu1308
@mixu1308
Jul 13 2016 06:01
@kirbyedy do I need to use the container class? how to I center the 2?
Hong
@designBuildShipSoftware
Jul 13 2016 06:02
@sorinr does my code work on your computer?
Sorin Ruse
@sorinr
Jul 13 2016 06:05
@designBuildShipSoftware not yet. just let me copy your code and test it locally on my machine. i don't like codepen editor
kirbyedy
@kirbyedy
Jul 13 2016 06:05
@mixu1308 yes
Hong
@designBuildShipSoftware
Jul 13 2016 06:12
@sorinr Thanks Sorin
CamperBot
@camperbot
Jul 13 2016 06:12
designbuildshipsoftware sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 456 | @sorinr |http://www.freecodecamp.com/sorinr
Natasha Nazari
@natashanazari
Jul 13 2016 06:18
kirbyedy
@kirbyedy
Jul 13 2016 06:21
@natashanazari watch the spaces
@natashanazari also no need for so many "
@natashanazari and backslash is escaped with 2 slashes... like this: \\
Natasha Nazari
@natashanazari
Jul 13 2016 06:23
@kirbyedy Okay. Cleaned it up a bit, but it’s still not working. Do I need to put quotes around the special characters? I’m not sure why \n isn’t working. https://www.freecodecamp.com/challenges/escape-sequences-in-strings#?solution=var%20myStr%20%3D%20%22FirstLine%5Cn%5C%5CSecondLine%5C%5C%5CnThirdLine%22%3B%0A%0A%0A
Sorin Ruse
@sorinr
Jul 13 2016 06:25
@designBuildShipSoftware the problem is in your $.getJSON because it does not return a json
Hong
@designBuildShipSoftware
Jul 13 2016 06:26
@sorinr so it's XML? I set format=json on wiki API sandbox
Seems like the format setting did not work out
kirbyedy
@kirbyedy
Jul 13 2016 06:27
@natashanazari you are not using properly the carriage return, check the table, but you are very close
Sorin Ruse
@sorinr
Jul 13 2016 06:27
@designBuildShipSoftware add &format=json at the end of your call and make if (event.keyCode === 13)
kirbyedy
@kirbyedy
Jul 13 2016 06:27
@natashanazari new line and carriage return are two different characters
Hong
@designBuildShipSoftware
Jul 13 2016 06:28
@sorinr still, XMLHttpRequest cannot load https://en.wikipedia.org/w/api.php?action=query&list=search&srsearch=wiki&format=json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://s.codepen.io' is therefore not allowed access.
CamperBot
@camperbot
Jul 13 2016 06:30
natashanazari sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1218 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Hong
@designBuildShipSoftware
Jul 13 2016 06:30
@sorinr Yeah, I got the json this time
Sorin Ruse
@sorinr
Jul 13 2016 06:30
@designBuildShipSoftware i know :)
kirbyedy
@kirbyedy
Jul 13 2016 06:32
why are you people use crossorigin for wikipedia ?
Hong
@designBuildShipSoftware
Jul 13 2016 06:33
@sorinr So I needed to add crossorigin.me to get the wikipedia search website loaded and put format=json at the end to make the whole data in json, right?
@sorinr I still don't get why XMLHttpRequest cannot load the wikipedia search website
@sorinr Thanks again btw
CamperBot
@camperbot
Jul 13 2016 06:35
designbuildshipsoftware sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: designbuildshipsoftware already gave sorinr points
Sorin Ruse
@sorinr
Jul 13 2016 06:37
@designBuildShipSoftware yes. thats right. crossorigin.me just helps u overpass the cors problems within codepen. its just a quick fix
@designBuildShipSoftware the format=json will just tell the api you want the response returned as json
Hong
@designBuildShipSoftware
Jul 13 2016 06:40
@sorinr I see :)
Sorin Ruse
@sorinr
Jul 13 2016 06:43
@designBuildShipSoftware if you want to experiment more, instead of $.getJSON i would use $.ajax and set all headers, data type, deal with response codes ecc
Hong
@designBuildShipSoftware
Jul 13 2016 06:44
@sorinr I might try that
Sorin Ruse
@sorinr
Jul 13 2016 06:49
@designBuildShipSoftware its just for learning. if you do it, you will see how powerful $.ajax is. $.get is just an simplified $.ajax call
Hong
@designBuildShipSoftware
Jul 13 2016 06:51
@sorinr I know about $.ajax, it looked more complicated. since it is powerful, I will try it later :)
buiphuking
@buiphuking
Jul 13 2016 06:55
i build simon game but i need js graph first , anyone give me some advice plz?
Hong
@designBuildShipSoftware
Jul 13 2016 06:56
@sorinr Its almost 2am here. I am gonna go to sleep now. Thank you for your help. Have a nice one!
CamperBot
@camperbot
Jul 13 2016 06:56
designbuildshipsoftware sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: designbuildshipsoftware already gave sorinr points
Sorin Ruse
@sorinr
Jul 13 2016 06:57
@designBuildShipSoftware :) morning for me
Tyler
@TychoCRD
Jul 13 2016 07:26
for the Simon Game, I'm building the "effects" function for flashing buttons with sound (using new Audio(link).play(), and my question right now is how to cache the mp3 so there's no delay for first time players
Elbert Cortez
@trip16661
Jul 13 2016 07:34
@TychoCRD i think there is an onload thing check on the properties
JackeL
@jackel27
Jul 13 2016 07:44
@TychoCRD you could use event listener for the audio object
Tyler
@TychoCRD
Jul 13 2016 07:49
I don't have a problem playing the sound on command, just the first time a new user loads the game, there is a delay before the sound plays each time, afterwhich, they play fast enough. so I was thinking there might be a way to cache the mp3s like one might cache DOM elements into variables with an "initialize()" function. The question being, how to cache the mp3 in the browser without playing each?
maybe you guys are answering that question, but your language isn't specific enough for me to know what you mean
this could be a local issue for me, actually...
JackeL
@jackel27
Jul 13 2016 07:51
@TychoCRD I would look into the audio object as it can definitely help you out with this
Tyler
@TychoCRD
Jul 13 2016 07:51
mostly curious about best practices
Tyler
@TychoCRD
Jul 13 2016 07:54
thanks @jackel27
CamperBot
@camperbot
Jul 13 2016 07:54
tychocrd sends brownie points to @jackel27 :sparkles: :thumbsup: :sparkles:
:cookie: 436 | @jackel27 |http://www.freecodecamp.com/jackel27
JackeL
@jackel27
Jul 13 2016 07:54
@TychoCRD here is another good resource for the event listeners https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Media_events
Elbert Cortez
@trip16661
Jul 13 2016 07:55
@TychoCRD im mostly sure htlm audio tags has a on load property that basically ask for the file so it can be trigger at any time on page load
because right now im assuming that the delay is due to loading the file
Tyler
@TychoCRD
Jul 13 2016 07:57
@trip16661 thanks, I see. I'm currently constructing a "new Audio" object each time I need one to play, feeding it a concatenated url each time. Maybe it would be better just to place them as html elements then cache them to play when needed
CamperBot
@camperbot
Jul 13 2016 07:57
tychocrd sends brownie points to @trip16661 :sparkles: :thumbsup: :sparkles:
:cookie: 395 | @trip16661 |http://www.freecodecamp.com/trip16661
Tyler
@TychoCRD
Jul 13 2016 07:57
cache them as vars with jquery, tha tis
JackeL
@jackel27
Jul 13 2016 07:58
Maybe something like this ?
var aud = document.getElementById("myAudio")
aud.addEventListener("loadeddata", someFunc)
someFunc() {
    console.log('the first frame of the media has finished loading.')
    aud.play() // Play audio ?
}
Elbert Cortez
@trip16661
Jul 13 2016 08:09
@TychoCRD i think that's the way to go because if you create a new audio object every time i believe you are basically consuming resourses that you don't need to per say
Tyler
@TychoCRD
Jul 13 2016 08:09
seems HTML audio tag has a preload attribute as well
JackeL
@jackel27
Jul 13 2016 08:09
This message was deleted
Tyler
@TychoCRD
Jul 13 2016 08:09
yeah, I was concerned about that as well
JackeL
@jackel27
Jul 13 2016 08:09
right
Elbert Cortez
@trip16661
Jul 13 2016 08:10
if for what you want it is for the pomodoro i highly recomend to do the html way
it's simpler, you just have to target the tag and apply a method to it whenver u want to use it
Tyler
@TychoCRD
Jul 13 2016 08:14
now I have an html element such as
<audio id="btn-green" src="https://s3.amazonaws.com/freecodecamp/simonSound1.mp3" preload="auto"></audio>
which I can tell preloads. I use jquery to select its id and store it as a var, but for some reason it I get "not a function" error when I attempt to use the .play() method (inherited from mediaelement)
JackeL
@jackel27
Jul 13 2016 08:18
@TychoCRD
document.getElementById("btn-green").play();  // This does not work?  or $("#btn-green").play() ?   <--- is that the right jQuery? I forget...
Konstantin
@kostanakis
Jul 13 2016 08:19
guys, is there somebody who knows jquery? It's quite strange, but such query : $('.header-bg').get(0).style.left - returns "". Actually, for all properties of that div it returns "". What's wrong with it?
Reg
@Involver0
Jul 13 2016 08:19
Hello, I need help from someone. I builded website, and for some reason in small devices google font acts strangely. Is someone have experience with similar problem?
Tyler
@TychoCRD
Jul 13 2016 08:19
@jackel27 correct, the jquery which looks right, does not work
JackeL
@jackel27
Jul 13 2016 08:19
@TychoCRD try this...
This message was deleted
Tyler
@TychoCRD
Jul 13 2016 08:22
@jackel27 the vanillaJS query does work if I .play() the var it stores...
JackeL
@jackel27
Jul 13 2016 08:22
ok, try...
    $("#btn-green")[0].play();
Tyler
@TychoCRD
Jul 13 2016 08:23
so I think the issue must be.... jquery is making it a jquery object, so the .play() method isn't right
JackeL
@jackel27
Jul 13 2016 08:23
right
try the above
Tyler
@TychoCRD
Jul 13 2016 08:23
@jackel27 yes, thanks, I've been looking at that [0] in the console trying to figure out what's going on
CamperBot
@camperbot
Jul 13 2016 08:23
tychocrd sends brownie points to @jackel27 :sparkles: :thumbsup: :sparkles:
:warning: tychocrd already gave jackel27 points
JackeL
@jackel27
Jul 13 2016 08:24
maybe console log the jQuery selector and see what it spits out
for future ref
Tyler
@TychoCRD
Jul 13 2016 08:25
yeah, I was, but didn't know how to understand it until I saw your [0]. sounds all work now
thanks again
now....light up colors...
Konstantin
@kostanakis
Jul 13 2016 08:26
@jackel27 Tried your solution for my code...It seems that [0] and .get(0) works equally.
shweta rajput
@ShwetaRajput
Jul 13 2016 08:31
hello everyone.. i got stucked at the wikipedia viewer
i dont know how to add a search icon to my search bar. would someone help me?
here is my codepen
Elbert Cortez
@trip16661
Jul 13 2016 08:33
@ShwetaRajput try background
on the input bar
and then positionating it
you should check background property
shweta rajput
@ShwetaRajput
Jul 13 2016 08:35
what i guess u didn't understood what i asked.
i want to add a search icon. and i don't know the code
@trip16661
Elbert Cortez
@trip16661
Jul 13 2016 08:37
@ShwetaRajput That's what i'm telling you..
use a background property
@ShwetaRajput you can also
https://design.google.com/icons/
JackeL
@jackel27
Jul 13 2016 08:38
@ShwetaRajput http://getbootstrap.com/components/ scroll down to button addons
Nathaniel Nasarow
@Torgian
Jul 13 2016 08:39
hey all
I'm doing the twitch.tv api, but cant figure out why my code won't show if a stream is on or offline
shweta rajput
@ShwetaRajput
Jul 13 2016 08:41
@trip16661 @jackel27 thanku boh of you
CamperBot
@camperbot
Jul 13 2016 08:41
shwetarajput sends brownie points to @trip16661 and @jackel27 :sparkles: :thumbsup: :sparkles:
:cookie: 398 | @trip16661 |http://www.freecodecamp.com/trip16661
:cookie: 437 | @jackel27 |http://www.freecodecamp.com/jackel27
Elbert Cortez
@trip16661
Jul 13 2016 08:42
@Torgian ReferenceError: cc is not defined
kirbyedy
@kirbyedy
Jul 13 2016 08:43
@Torgian shouldnt you have some kind of condition here: if(data.stream)
Nathaniel Nasarow
@Torgian
Jul 13 2016 08:43
ah, damn, ok that makes sense about the not defined since i forgot to uncomment the function
Elbert Cortez
@trip16661
Jul 13 2016 08:44
@Torgian ahahaha xD
you should see the devp tool every time
Nathaniel Nasarow
@Torgian
Jul 13 2016 08:44
but I've noticed before that it only puts the HTML into the first element, not their respective elements
yeah I forgot to check xD
Anyways, it seems to be outputting the correct ones (Off or Online) but all on the first element
saved, check again
Elbert Cortez
@trip16661
Jul 13 2016 08:45
what's append online and ofline do?
Nathaniel Nasarow
@Torgian
Jul 13 2016 08:45
I've ran into this problem yesterday
ok
hold on
let me try innerHTML instead
ah, nope, it just returns the final on or offline
trying to think why it's only putting the On or Offline text into the very first h4 elmeent
Elbert Cortez
@trip16661
Jul 13 2016 08:47
@Torgian i think the best way (have nt really read much of ur code) is to have a toogle class class
Nathaniel Nasarow
@Torgian
Jul 13 2016 08:47
OK so I know that with the forEach in this specific call, it is iterating through each specific channel
kirbyedy
@kirbyedy
Jul 13 2016 08:47
again...
@Torgian shouldnt you have some kind of condition here: if(data.stream)
Nathaniel Nasarow
@Torgian
Jul 13 2016 08:47
Yes, it's in there
if(data.stream) {

      $("#onOrOff").html("Online");

    } else {

      $("#onOrOff").html("Offline");
    }
kirbyedy
@kirbyedy
Jul 13 2016 08:48
if has to be a condition, checking for something
if data is null do this, else do something else
Nathaniel Nasarow
@Torgian
Jul 13 2016 08:48
Where are you in my code?
check line 56
kirbyedy
@kirbyedy
Jul 13 2016 08:49
there where you quoted
Nathaniel Nasarow
@Torgian
Jul 13 2016 08:49
it's in there
yes
Konstantin
@kostanakis
Jul 13 2016 08:49
```js($('.header-bg').css('left').slice(0,-2)/$('body').width()).toPrecision(2)*100 + "%"
Nathaniel Nasarow
@Torgian
Jul 13 2016 08:49
put in a console.log, you'll see the response
kirbyedy
@kirbyedy
Jul 13 2016 08:49
obviously you dont understand me
Konstantin
@kostanakis
Jul 13 2016 08:49
($('.header-bg').css('left').slice(0,-2)/$('body').width()).toPrecision(2)*100 + "%"
damn, I like it.
Elbert Cortez
@trip16661
Jul 13 2016 08:50
@kostanakis what are you even doing there? O.o
look like a creepy pasta
Nathaniel Nasarow
@Torgian
Jul 13 2016 08:50
@kirbyedy you don't need to specifically define it to check for null, it's simply looking for a truth response
Konstantin
@kostanakis
Jul 13 2016 08:50
Just retrieving absolute position left property is percents)
Nathaniel Nasarow
@Torgian
Jul 13 2016 08:51
therefore, if it returns true (i.e., it returns objects), then it's Online, else it is simply null, and therefore returns Offline
kirbyedy
@kirbyedy
Jul 13 2016 08:51
https://api.twitch.tv/kraken/streams/superjonico
https://api.twitch.tv/kraken/streams/ogamingsc2
check this two links and tell me the difference
in your browser
Nathaniel Nasarow
@Torgian
Jul 13 2016 08:52
OK
kirbyedy
@kirbyedy
Jul 13 2016 08:52
your IF hits the first guy who is offline, goes to else, end quits
does not check for the rest of them
Konstantin
@kostanakis
Jul 13 2016 08:52
@trip16661 Just retrieving absolute position left property is percents)
Nathaniel Nasarow
@Torgian
Jul 13 2016 08:52
yes, it does check them all
kirbyedy
@kirbyedy
Jul 13 2016 08:52
where are they ?
Elbert Cortez
@trip16661
Jul 13 2016 08:53
@kostanakis is percents?
Konstantin
@kostanakis
Jul 13 2016 08:53
@trip16661 %
Nathaniel Nasarow
@Torgian
Jul 13 2016 08:53
the forEach function should iterate through all of them. If you replace html() with append() you'll see all the off or online texts
however, it only appends them to the first h4 element
Konstantin
@kostanakis
Jul 13 2016 08:53
@trip16661 oops. *in percents, of course
Nathaniel Nasarow
@Torgian
Jul 13 2016 08:54
which I don't understand
Sorin Ruse
@sorinr
Jul 13 2016 08:54
@Involver0 post your pen link
Elbert Cortez
@trip16661
Jul 13 2016 08:54
@kostanakis what for if i can ask?
kirbyedy
@kirbyedy
Jul 13 2016 08:54
here is your console @Torgian
Screen Shot 2016-07-13 at 11.54.05.png
Konstantin
@kostanakis
Jul 13 2016 08:55
@trip16661 because it is simplier for me to change this prop in percents.
Nathaniel Nasarow
@Torgian
Jul 13 2016 08:56
yes, it's iterating through each channel, checking them with the call, and finding them either true or false
However, it's only appending to the first h4 element
Elbert Cortez
@trip16661
Jul 13 2016 08:56
@Torgian the thing
Nathaniel Nasarow
@Torgian
Jul 13 2016 08:56
I also tried making them specifically look for either null or a true response, and the same thing happens
Elbert Cortez
@trip16661
Jul 13 2016 08:56
is that you are doing two things
you are first calling your channels
and then
Sorin Ruse
@sorinr
Jul 13 2016 08:57
@Torgian yes. but when you make a new research append() will just add and add to the old html. html should be "reseted" on each search to show just the search results from that call
Elbert Cortez
@trip16661
Jul 13 2016 08:57
you are saying ask for the
streams
and change the property of #something
or add to something
but what you want is to call twice
on each element
you have to call twice, one to check the channel and whiting that to check for stream
Nathaniel Nasarow
@Torgian
Jul 13 2016 08:59
Are you talking about two separate ajax calls?
Elbert Cortez
@trip16661
Jul 13 2016 08:59
no right now that's what you are doing
Nathaniel Nasarow
@Torgian
Jul 13 2016 09:00
So one ajax call with two separate checks
Elbert Cortez
@trip16661
Jul 13 2016 09:00
more as
im iterating
the first item is 1
1 search for channel 1 then search for stream (notice im still on 1)
2 search for channel 2 then search for stream
etc
Konstantin
@kostanakis
Jul 13 2016 09:01
@trip16661 The question now is how to put percentage value back to css property :D
Nathaniel Nasarow
@Torgian
Jul 13 2016 09:02
I don't completely understand what you mean by searching first for the channel and then the stream. Like using a for loop? Or first checking to see if the current channel is 1, then check channel 1's stream? and so on?
Because, I think the forEach loop should take care of this, right?
Elbert Cortez
@trip16661
Jul 13 2016 09:02
you are iterating twice
Nathaniel Nasarow
@Torgian
Jul 13 2016 09:03
ohhh wait
I think I get it now
Elbert Cortez
@trip16661
Jul 13 2016 09:03
and when you iterate the sec time you don't quite target the element itself
Nathaniel Nasarow
@Torgian
Jul 13 2016 09:03
Because my function is outside of the ajax call, it's not calling the function with each check
I think
haha
oh wait was looking at the wrong section hold on
@jackel27 check this one
JackeL
@jackel27
Jul 13 2016 09:05
@ShwetaRajput :+1:
shweta rajput
@ShwetaRajput
Jul 13 2016 09:06
@jackel27 can you tell me that if i can link the search item in html or i have to usejavascript?
Elbert Cortez
@trip16661
Jul 13 2016 09:09
$.calling(ur) bla bla  {
    var inforforchannel = data;
    $.calling(url2)bla bla {
     var is  = "off" 
     if (null){
      is  = "on "; 
      }
      $(something).htlm(<inforforchanell>).addClass(is)

     }
}
something like that
@Torgian the syntax is not quite acurated but you can see where im going
Sam White
@swhitedev
Jul 13 2016 09:10
Hi there guys I'm brand new to code camp, (very sorry if I'm sticking this is the wrong place) but I'm having an issue with the ui right off the bat. I've made it as far as the 'Headline with the h2 Element' challenge and the content gets cut off way before the end of the page, so I can't see any instructions etc. To make matters stranger, if I view it in mobile view e.g. ipad, all the content is shown! I was wondering if anyone else is seeing this or if the problem is local! Any feedback would be really handy!
Nathaniel Nasarow
@Torgian
Jul 13 2016 09:10
wait hold on
so you can do a second ajax call inside of the first ajax call?
Elbert Cortez
@trip16661
Jul 13 2016 09:11
@Torgian you could also do promises to do it but i think thats a bit complicated for you now
so you can get the info from the first and the second call
so when you make the elemnt you have those two infos
Nathaniel Nasarow
@Torgian
Jul 13 2016 09:11
God, that makes things easier >.< I didn't think an ajax call inside of the first would work
Yeah I read a little about promises, but I'm not there yet xD
Elbert Cortez
@trip16661
Jul 13 2016 09:12
it works the thing is not efficient because if the first fails for some reason everything breaks
Nathaniel Nasarow
@Torgian
Jul 13 2016 09:12
@trip16661 @kirbyedy thanks
CamperBot
@camperbot
Jul 13 2016 09:12
torgian sends brownie points to @trip16661 and @kirbyedy :sparkles: :thumbsup: :sparkles:
:cookie: 399 | @trip16661 |http://www.freecodecamp.com/trip16661
:star2: 1220 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Nathaniel Nasarow
@Torgian
Jul 13 2016 09:12
yeah I bet
Elbert Cortez
@trip16661
Jul 13 2016 09:12
but you are not dealing with many calls so i think it will be okay
shweta rajput
@ShwetaRajput
Jul 13 2016 09:13
@trip16661 can you tell me that if i can link my searchinput with wikipedia in html or i have to use javascript?
Elbert Cortez
@trip16661
Jul 13 2016 09:13
plus if the first breaks the program will break anyway
Nathaniel Nasarow
@Torgian
Jul 13 2016 09:13
I guess it might also work if I take the stream ajax call and put the response into a global variable or array, and call that while in the first ajax call?
well
yeah
if the channel call doesn't work, the whole thing breaks either way
Elbert Cortez
@trip16661
Jul 13 2016 09:14
@Torgian well the thing is that if you do it that way you will have to iterate again
while in this case you iterate once which is better
Nathaniel Nasarow
@Torgian
Jul 13 2016 09:15
yeah
I guess this is where promises come in handy
Elbert Cortez
@trip16661
Jul 13 2016 09:15
the less steps it takes the better performance
@ShwetaRajput what do you mean i dont understand u
link search input? or link the button?
either way you need javascript to do it
anyway good luck to all I'm off now :)
shweta rajput
@ShwetaRajput
Jul 13 2016 09:20
@trip16661 ok i apologize for whatever i said. and thanku
CamperBot
@camperbot
Jul 13 2016 09:20
shwetarajput sends brownie points to @trip16661 :sparkles: :thumbsup: :sparkles:
:warning: shwetarajput already gave trip16661 points
Elbert Cortez
@trip16661
Jul 13 2016 09:21
not sure what you said but it's okay :)
JackeL
@jackel27
Jul 13 2016 09:40
@Torgian I fixed it up out of boredom, could be an easier way, but thought I'd at least try to work with what you had.
Nathaniel Nasarow
@Torgian
Jul 13 2016 09:44
@jackel27 thanks mate, although I haven't checked your code yet. I actually changed mms structure a bit now xD
CamperBot
@camperbot
Jul 13 2016 09:44
torgian sends brownie points to @jackel27 :sparkles: :thumbsup: :sparkles:
:cookie: 438 | @jackel27 |http://www.freecodecamp.com/jackel27
JackeL
@jackel27
Jul 13 2016 09:44
@Torgian Promises are good. there is definately a better way to achieve this. Maybe after see how you can improve it more with es6 :)
Nathaniel Nasarow
@Torgian
Jul 13 2016 09:44
this is what I have now
but I think I'm running into the same problem xD
JackeL
@jackel27
Jul 13 2016 09:46
You can exclude the else if and simply just use
} else { 
is = "off";
$("#onOfOff").addClass(is);
}
Nathaniel Nasarow
@Torgian
Jul 13 2016 09:47
ok
JackeL
@jackel27
Jul 13 2016 09:47
@Torgian Also...
@Torgian You are using the same id for all, it is best if targetting elements by id's that they remain unique. maybe add the cc for the name of the id when you loop through it
@Torgian I do not see a #onOrOff to even target either
JackeL
@jackel27
Jul 13 2016 09:55
@Torgian if you go to console, try document.getElementById("onOrOff")
it was never created. when you go through that loop to create those elements with the same ids, try to make them all a unique name.
Nathaniel Nasarow
@Torgian
Jul 13 2016 09:55
Oh, see check it out, in the createElement function
the onoroff id is part of h4 element that is created in each div
oh but yeah on the console it returns null
werid
even though the page is already populated?
oh haha
miswrote it
The first h4 element does have both classes off and on though
you're saying add the cc for the name of the id, good idea i'll try that real quick
oh
you might want to reload first
JackeL
@jackel27
Jul 13 2016 10:08
@Torgian hmm... You want to achieve something like this?
http://codepen.io/Jackel27/full/VjAdJA/
Nathaniel Nasarow
@Torgian
Jul 13 2016 10:08
ok i made a few changes, check again, it's just not adding it to the h4 element with the matching tag. I made it so that each ID is unique, using the channel name
JackeL
@jackel27
Jul 13 2016 10:10
@Torgian few things.. you are adding a class of on or off. but, you do not have any of those classes made in your css
Nathaniel Nasarow
@Torgian
Jul 13 2016 10:10
yeeeeaaah, kind of. I am using only one API call with the stream call inside the channel call, so that it should iterate through each channel while checking that channel's stream status
Right, but shouldn't it add the class anyway, even if there is no CSS?
I just added them right now anyway, simple color change depending if on or off
this kinda makes me wish they teach promises before going into APIs xD hahaha
JackeL
@jackel27
Jul 13 2016 10:12

@Torgian change ch to cc
remove the var and use

   if (cc.stream){
          $('#'+ch.name.toLowerCase()).addClass("on");

instead

not much to do with promises here
Nathaniel Nasarow
@Torgian
Jul 13 2016 10:15
done and saved, however it does give me a warning of cannot read property Cannot read property 'toLowerCase' of undefined
JackeL
@jackel27
Jul 13 2016 10:15
my mistake,
this is how it should be within your function..
      createElement(results);
      $.getJSON("https://api.twitch.tv/kraken/streams/" + ch + "?callback=?").done(function(cc){
        console.log(ch);
        if (cc.stream){
          $('#' + ch.toLowerCase()).addClass("on");
        } else {
          $('#' + ch.toLowerCase()).addClass("off");
        };
Nathaniel Nasarow
@Torgian
Jul 13 2016 10:15
that's what I thought I should write xD
JackeL
@jackel27
Jul 13 2016 10:16
there is an issue though
you are trying to add a class to an element that does not exist yet
Nathaniel Nasarow
@Torgian
Jul 13 2016 10:16

cool, that worked well.

Yes, I was wondering about this due to the asynchronis nature of ajax calls

if for some reason the calls are done before everything gets appended, would that throw an error?
Ananay
@ananaymital
Jul 13 2016 10:17
does anybody know the link for obtaining all channels for twitch.tv ?
platy11
@platy11
Jul 13 2016 10:19
does anybody know the link for obtaining all channels for twitch.tv ?
JackeL
@jackel27
Jul 13 2016 10:20
@Torgian you can do it without worrying about the asynchronous bit. you just need to make sure that the elements have been created with the id before you go and try to add a class to something that doesn't exist yet
Nathaniel Nasarow
@Torgian
Jul 13 2016 10:20
@jackel27 Thanks a lot for your help. Been trying to figure this last part out, appending the status correctly to the page. I knew the code, just not how to write it correctly. XD
CamperBot
@camperbot
Jul 13 2016 10:20
torgian sends brownie points to @jackel27 :sparkles: :thumbsup: :sparkles:
:warning: torgian already gave jackel27 points
platy11
@platy11
Jul 13 2016 10:20
@Torgian I'll do it for you
thanks @jackel27
CamperBot
@camperbot
Jul 13 2016 10:21
platy11 sends brownie points to @jackel27 :sparkles: :thumbsup: :sparkles:
Nathaniel Nasarow
@Torgian
Jul 13 2016 10:21
Right. This is why I thought about calling the createElement function before the second ajax call. But, I'm not sure if that matters in the long run
CamperBot
@camperbot
Jul 13 2016 10:21
:cookie: 439 | @jackel27 |http://www.freecodecamp.com/jackel27
Nathaniel Nasarow
@Torgian
Jul 13 2016 10:21
@platy11 already taken care of :)
platy11
@platy11
Jul 13 2016 10:21
@Torgian surely it can be done twice :clap:
Nathaniel Nasarow
@Torgian
Jul 13 2016 10:23
@jackel27 So, does calling the createElement function append everything to the page first BEFORE the second ajax call, or is the second ajax call already running before the createElement function finishes appending everything to the document?
platy11
@platy11
Jul 13 2016 10:24
@Deadpool37 what do you mean?
JackeL
@jackel27
Jul 13 2016 10:26
@Torgian your other linhe
Ananay
@ananaymital
Jul 13 2016 10:26
now I see the same channel in live as well as in offline
JackeL
@jackel27
Jul 13 2016 10:27
@Torgian move
function createElement(data) { ..... }
function right under
createElement(results)
Ananay
@ananaymital
Jul 13 2016 10:27
platy11
@platy11
Jul 13 2016 10:28
JackeL
@jackel27
Jul 13 2016 10:29
@Torgian Good job ! :)
platy11
@platy11
Jul 13 2016 10:30
@Deadpool37 you might need an API key for some of those
Ananay
@ananaymital
Jul 13 2016 10:30
@platy11 yeah i know this
but how do i know what all channels are live?
@platy11 where do i get the key from?
Nathaniel Nasarow
@Torgian
Jul 13 2016 10:32
Well, time for a break, dinner time here in Taiwan xD
platy11
@platy11
Jul 13 2016 10:33
@Deadpool37 I don't know, could this help: (I don't have a twitch account) http://stackoverflow.com/a/34589364
@Deadpool37 Sorry, I've got to go now
@Deadpool37 just try searching the twitch dev forums, google and stackoverflow
Ananay
@ananaymital
Jul 13 2016 10:37
@platy11 thanks anyway
CamperBot
@camperbot
Jul 13 2016 10:37
deadpool37 sends brownie points to @platy11 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for platy11
Ananay
@ananaymital
Jul 13 2016 10:54
can anybody help me with twitch.tv
http://codepen.io/Deadpool37/pen/XKzpjr?editors=1010
It shows the same channels in online and offline
Elbert Cortez
@trip16661
Jul 13 2016 10:56
@Deadpool37 what do you exactly need
be consise
Ananay
@ananaymital
Jul 13 2016 10:57
@trip16661 whether i click on all,online or offline the same channels appear
what am i doing wrong?
Elbert Cortez
@trip16661
Jul 13 2016 11:02
@Deadpool37 ummm the way im seeing it you are just using the api for users that the api throw which i think it's not that great
also you should check the differneces btween when a user is offline vs when its on
note the difference and apply it to your code
Ananay
@ananaymital
Jul 13 2016 11:06
@trip16661 and how will i know that who to find?
Elbert Cortez
@trip16661
Jul 13 2016 11:06
@Deadpool37 you mean how to know who to find ?
Ananay
@ananaymital
Jul 13 2016 11:07
@trip16661 what you are saying is for 'all' tab only
yeah
Elbert Cortez
@trip16661
Jul 13 2016 11:07
the simples way is to store many channes you like in an array
and then call for every each one of the
and check wether its off or on
Ananay
@ananaymital
Jul 13 2016 11:08
@trip16661 if the api returns all the offline channels then i wouldn't need to check right?
yea so i was gonna do what you are saying for the 'all' channels tab to change the differentiate the online from the offine ones
Elbert Cortez
@trip16661
Jul 13 2016 11:10
@Deadpool37 what i mean is that you are basically using the api wrong, well not really wrong just not efectively
why because you don't know what does the user want
and instead you are just smashing all together whatever the api gives you
and it's not good because you are basically loading like 40 channels on offline and 40 on online
which uses a lot of resources
and so you can know how to differenciate online vs offline
Adetunji Iyaniwura
@Iadetunji
Jul 13 2016 12:00
http://codepen.io/Iadetunji/pen/AXQaaN, need help with the JS section of this project
JackeL
@jackel27
Jul 13 2016 12:22
going to live code some twitch api fun with vue.js on FCC twitch channel
Sorin Ruse
@sorinr
Jul 13 2016 12:24
@Iadetunji you are not closing functions correctly in your js.
Adetunji Iyaniwura
@Iadetunji
Jul 13 2016 12:27
@sorinr , pls point me to the lines to consider, i wrote a lot of functions there
Sorin Ruse
@sorinr
Jul 13 2016 12:36
@Iadetunji i would start from begining above you just existing code: like '$(document).ready(function() {}then inside write the vars and then open theif(){}` and so on
@Iadetunji at the end i will just delete all the previous code
Adetunji Iyaniwura
@Iadetunji
Jul 13 2016 12:38
@sorinr .ill give it a try
Sorin Ruse
@sorinr
Jul 13 2016 12:41
@Iadetunji good. i'm not giving full solutions like here is the code. its better for you to make it on your own
Adetunji Iyaniwura
@Iadetunji
Jul 13 2016 12:41
@sorinr ,am working on it already
@sorinr , i have restured it am not getting results
Sorin Ruse
@sorinr
Jul 13 2016 12:47
@Iadetunji its because you have copied all the same. where do you close the doc ready function?
Adetunji Iyaniwura
@Iadetunji
Jul 13 2016 12:52
@sorinr , i closed it @ the end of the else statement
J. Kelley
@jothetraveler
Jul 13 2016 13:12
Morning. I'm trying to change the font of Portfolio but it will not change. What am I missing? http://codepen.io/jothetraveler/pen/OXOBAw
Sorin Ruse
@sorinr
Jul 13 2016 13:16
@jothetraveler where do u get the Georgia font from?
Adam Lichter
@spot1000
Jul 13 2016 13:18
@jothetraveler it's changing for me when I change the #portfolio tag I just need to hit run every time...
Adetunji Iyaniwura
@Iadetunji
Jul 13 2016 13:34
http://codepen.io/Iadetunji/pen/AXQaaN, need help on dis project
Sorin Ruse
@sorinr
Jul 13 2016 13:38
@Iadetunji if you start your js with a doc ready function, how do you end it up with an else{} ? you are just mixing functions. nobody knows where a function begin and finish
Adetunji Iyaniwura
@Iadetunji
Jul 13 2016 13:39
@sorinr ,pls give me a clear insight to get this fixed
J. Kelley
@jothetraveler
Jul 13 2016 13:41
@spot1000 That's so weird because it will not do that for me. I event tried changing it to other fonts
Sorin Ruse
@sorinr
Jul 13 2016 13:42
@Iadetunji so: write your docready function first, then write your geolocation function inside docready and console.log(position) to see that your geolocation its working.
Adam Lichter
@spot1000
Jul 13 2016 13:42
@jothetraveler sorry, i thought you were trying to change the font size! whoops
J. Kelley
@jothetraveler
Jul 13 2016 13:42
@sorinr What do you mean where did I get it from?
Adam Lichter
@spot1000
Jul 13 2016 13:42
hold on, I'll take another look
Sorin Ruse
@sorinr
Jul 13 2016 13:44
@jothetraveler i saw you are not loading that font from a library. how do you expect my browser to recognize that Lobster font if you don't provide it
J. Kelley
@jothetraveler
Jul 13 2016 13:47
@sorinr got it. but I'm still not able to change it on my browser. I was able to change my header font. Not sure why #portfolio will not.
Adam Lichter
@spot1000
Jul 13 2016 13:48
try putting in "times" @jothetraveler
never mind... that didn't work on my end...
J. Kelley
@jothetraveler
Jul 13 2016 13:52
@spot1000 Got it! put it under body .container and that worked.
Adam Lichter
@spot1000
Jul 13 2016 13:52
boom! there you go!
J. Kelley
@jothetraveler
Jul 13 2016 13:53
@spot1000 Preciate it. Needed to talk through it.
Donna
@Mstp23
Jul 13 2016 13:53
Hello, can someone please tell me how to make a thumbnail image from a pen? thanks
Adam Lichter
@spot1000
Jul 13 2016 13:53
@jothetraveler glad I could help
Alhaji Turay
@Alhaji24
Jul 13 2016 14:11
I need help with an array/looping problem.
Adam Lichter
@spot1000
Jul 13 2016 14:15
@Alhaji24 sure, what do you need?
Alhaji Turay
@Alhaji24
Jul 13 2016 14:17
//my code var arr = [3,6,9,12,15];
var loveTheThrees = function(arr){
var threes = [];
if(threes+=arr%3){
return threes
}
}@spot1000 link to question https://codecard.io/a/challenge/d4MZUIhg2?sequence=7Y82i_Zc2
Adam Lichter
@spot1000
Jul 13 2016 14:20
ok, so you need to loop over every value in your array, and check to see if its divisible by 3, if it is push it to your threes array
Alhaji Turay
@Alhaji24
Jul 13 2016 14:20
so a for loop
Adam Lichter
@spot1000
Jul 13 2016 14:20
that would work
Alhaji Turay
@Alhaji24
Jul 13 2016 14:23
@spot1000 //new code var arr = [3,6,9,12,15];
var loveTheThrees = function(arr){
var threes = [];
for(var i= 3;i<16;i++){
}
return threes;
}
Adam Lichter
@spot1000
Jul 13 2016 14:25
ok, looking good so far, but you need your for loop to do something as it checks each number
err wait, take another look at your for loop
or at least the settings for your for loop
Alhaji Turay
@Alhaji24
Jul 13 2016 14:28
Im lost right now I have no clue( i<arr)? @spot1000
Adam Lichter
@spot1000
Jul 13 2016 14:31
that'll give you a bit of an idea of what you need to do
Alhaji Turay
@Alhaji24
Jul 13 2016 14:32
@spot1000 can i use .length for this question?
Adam Lichter
@spot1000
Jul 13 2016 14:32
yep
Alhaji Turay
@Alhaji24
Jul 13 2016 14:34
so (i<arr.length)? @spot1000
Adam Lichter
@spot1000
Jul 13 2016 14:34
looks good so far
Alhaji Turay
@Alhaji24
Jul 13 2016 14:36
should i start from 1 or 3 ? // new code for(var i= 3;i<arr.length;i++){
return threes
}
Adam Lichter
@spot1000
Jul 13 2016 14:37
you're using your for loop to check every number in the array, so start at the begining of the array
Alhaji Turay
@Alhaji24
Jul 13 2016 14:38
so 0 ?
its 3
Adam Lichter
@spot1000
Jul 13 2016 14:39
yep
Alhaji Turay
@Alhaji24
Jul 13 2016 14:40
do i have to use this (% )?
Adam Lichter
@spot1000
Jul 13 2016 14:41
inside your for loop
Alhaji Turay
@Alhaji24
Jul 13 2016 14:42
@spot1000 // final new code var arr = [3,6,9,12,15];
var loveTheThrees = function(arr){
var threes = [];
for(var i= 3;i<arr.length;i++){
return threes % 3;
}
}
Adam Lichter
@spot1000
Jul 13 2016 14:42
not quite
Alhaji Turay
@Alhaji24
Jul 13 2016 14:44
should i keep my var three empty array ?
or make it global
Adam Lichter
@spot1000
Jul 13 2016 14:44
empty array is fine
Adetunji Iyaniwura
@Iadetunji
Jul 13 2016 14:44
@sorinr ,ill give it a try
Alhaji Turay
@Alhaji24
Jul 13 2016 14:45
@spot1000 so my for loop is still missing something ?
Adam Lichter
@spot1000
Jul 13 2016 14:47
yeah, and it's still not quite right...
take another look at that link i sent
and look at "try it yourself"
Alhaji Turay
@Alhaji24
Jul 13 2016 14:52
@spot1000 // new code var arr = [3,6,9,12,15];
var loveTheThrees = function(arr){
var threes = [];
for(var i = 3;i<arr.length;i++){
return threes[i];
}
}
Adam Lichter
@spot1000
Jul 13 2016 14:55
not really...
Adetunji Iyaniwura
@Iadetunji
Jul 13 2016 14:56
@sorinr ,pls review the correction:http://codepen.io/Iadetunji/pen/AXQaaN?editors=1010
Adam Lichter
@spot1000
Jul 13 2016 14:56
Hassan ben haj
@Hassanbhb
Jul 13 2016 14:58
guys i have this problem

//http://ip-api.com/json
$(document).ready(function(){
    var key_api = "1f87fb77d263be74b2888a5974bf89cd";
    var baseUrl = "http://api.openweathermap.org/data/2.5/";
    var lat;
    var lon;
    var country;
    var city;
    var w;
    var LocationData="";
    $.getJSON("http://ip-api.com/json", function(data){
        lat = data.lat;
        lon = data.lon;
        country = data.country;
        city = data.city;
        LocationData += "<p class ='Location'>"+country+" / "+city+ "</p>";
        $(".info").html(LocationData); 
    })        
    $.ajax({
        url: baseUrl,
        data:{
            lat: lat,
            lon: lon,
            units: 'imperial',
            APPID: key_api
        },
        dataType: 'jsonp',
        success: function(data) {
            console.log(data);
           }
    })

})
the last console.log return an error
jquery.min.js:4 GET http://api.openweathermap.org/data/2.5/?callback=jQuery11240168364165119545…7881&units=imperial&APPID=1f87fb77d263be74b2888a5974bf89cd&_=1468421667882
what is wrong here?
Alhaji Turay
@Alhaji24
Jul 13 2016 15:00
@spot1000 should I add a sum variavle
should i use % between i<arr.length;@spot1000
Sorin Ruse
@sorinr
Jul 13 2016 15:16
@Hassanbhb make your url like:baseurl+lat+lon+ecc. all in one call. the openweather api will not know how to interpret your data in the ajax call
Alhaji Turay
@Alhaji24
Jul 13 2016 15:18
@spot1000 Am I close ?// new code var arr = [3,6,9,12,15];
var loveTheThrees = function(arr){
var threes = arr;
for(var i = 3;i<16;i+=3){
return threes[i];
}
}
Adam Lichter
@spot1000
Jul 13 2016 15:22
unfortunatly no, @Alhaji24 . you should do some research on arrays, and for loops and then try this porblem again
Alhaji Turay
@Alhaji24
Jul 13 2016 15:24
@spot1000 thanks for the help and being patient with me
CamperBot
@camperbot
Jul 13 2016 15:24
alhaji24 sends brownie points to @spot1000 :sparkles: :thumbsup: :sparkles:
:cookie: 344 | @spot1000 |http://www.freecodecamp.com/spot1000
Adam Lichter
@spot1000
Jul 13 2016 15:27
no problem buddy, good luck!
NPeyralans
@NPeyralans
Jul 13 2016 15:29

How can I access the "self" and "channel" parts of this object (i'm gonna post in a second)?
here's my code

        mainFac.getData = function(urls) { 
            var userData = [];
            for (var i = 0; i < urls.length; i++) {
                currentData = $http.get(urls[i]);  

                // Picture that I posted a second ago:
                console.log('userData: ' + i + '\t' + currentData);

                // RETURNS TYPEDEF ERROR UNDEFINED:
                console.log(currentData.data._links.channel);

                userData.push(currentData);
            };

            //console.log('userData in factory getData: ' + userData);
            return userData;
        }

and the object:

1.PNG
No one for a json object parsing it in the angular factory?
NPeyralans
@NPeyralans
Jul 13 2016 15:35
@Hassanbhb Hey, you know you can declare all those variable with commas inbetween them on one line?
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 15:36
hello everyone, i am new to coding and i got this idea for my local weather page, how can i get a picture using google search engine by searching for the corrent city of the user and set it as a background image ?
this is a link to the page :
https://codepen.io/Mohanad-Mjawaz/pen/jAaEbw
NPeyralans
@NPeyralans
Jul 13 2016 15:37
@Mohanad-Mjawaz Hmm, that's a pretty cool idea, I have no idea how you would do it though...
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 15:39
There must be a way to write a js code that will search for a "string of my choice" and us the result url to set it as a background image!
NPeyralans
@NPeyralans
Jul 13 2016 15:39
@Mohanad-Mjawaz You could send a request to this api and extract the photo: http://www.panoramio.com/?no_redirect
@Mohanad-Mjawaz There are apis out there for so many things, a quick google search said that this one will give you a generic photo of a country that your request
I don't think you would be able to do it with a web page unless you got into some other languages like I've seen stuff similar to that in python.
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 15:40
@NPeyralans but im not sure how to write the code exactly
i just started using api 3 days ago :smile:
NPeyralans
@NPeyralans
Jul 13 2016 15:41
@Mohanad-Mjawaz what code?
@Mohanad-Mjawaz Oh, yeah believe me, an api is there to make it easy to request information from places, so if you can't do the api you probably won't be able to fetch it a different way....
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 15:43
@NPeyralans well thanks for the advice i think now i know what to do and i just have to learn how to do it !
CamperBot
@camperbot
Jul 13 2016 15:43
mohanad-mjawaz sends brownie points to @npeyralans :sparkles: :thumbsup: :sparkles:
:cookie: 290 | @npeyralans |http://www.freecodecamp.com/npeyralans
NPeyralans
@NPeyralans
Jul 13 2016 15:44
;)
Tony Johnson
@tnyjhnsn
Jul 13 2016 15:46
@Mohanad-Mjawaz if you do get the image, you can use the jquery .css method to set your background
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 15:46
@tnyjhnsn yes exactly i guess i found the way ! thanks guys
CamperBot
@camperbot
Jul 13 2016 15:46
mohanad-mjawaz sends brownie points to @tnyjhnsn :sparkles: :thumbsup: :sparkles:
:cookie: 316 | @tnyjhnsn |http://www.freecodecamp.com/tnyjhnsn
blackhat144
@blackhat144
Jul 13 2016 15:59
Do I have to sign up for Medium to continue the lesson?
sethun60
@sethun60
Jul 13 2016 18:07
Hey guys is joining in a bootcamp worth it ?
Dylan
@dhcodes
Jul 13 2016 18:08
@sethun60 there have been a few medium posts I've read that suggest "no" though it depends on the person and their desired timeline and the bootcamp
Mettcon
@Mettcon
Jul 13 2016 18:08
i tried values from bestmotherfuckingwebsite for my Codepen Page, but it looks completely different
Dylan
@dhcodes
Jul 13 2016 18:08
i'll find one
@sethun60 actually it appears to be mixed reception: here's one post from the FCC founder: https://www.quora.com/Are-programming-bootcamps-worth-it/answer/Quincy-Larson
i'll find the medium post I read saying it wasn't worth it
It probably depends on the person taking the bootcamp, their financial freedom, etc
Gary Siu
@GarySiu
Jul 13 2016 18:19
Also on the camp’s reputation and whether they have any relationships to someone you’d want to work for.
Gabriel Ramos
@GabrielusR
Jul 13 2016 18:36
In the CatPhotoApp how can i make the 3 buttons text bellow the relaxing cat image fit inside the button widt and dont get squeezed to the buttons right side?
gitgenie
@gitgenie
Jul 13 2016 18:39
hey guys ! please give your comments / suggestions http://codepen.io/gitginie/pen/mEqOBq
Dmitry Palamarchuk
@moonbrv
Jul 13 2016 18:46
I need help! In chrome on iphone i have a small gap between my sticky header, and chrome navigation menu. How to avoid that gap. in all other browser it work fine, i don't have that gap. https://moonbrv.github.io/sticky-header-test/ -- scroll a bit on page to sticky header appear
Jonathan
@JonKaric
Jul 13 2016 18:58
@moonbrv I can't replicate your problem, is it on the top or one of the sides?
Lee Vulinovic
@LeeVulinovic
Jul 13 2016 19:01
hey guys, need help with tribute page challenge. Essentially my web page is complete but i have issue with the text aligning when web page is full page view. The timeline text un-centers itself. Here is link to web page https://codepen.io/leevulinovic/full/NrbrQK/ it's probably an obvious fix but any suggestions will be gratefully received :-)
Jonathan
@JonKaric
Jul 13 2016 19:02
@LeeVulinovic It's because you have an offset on your column
Simon Cordova
@gbsimon87
Jul 13 2016 19:03
Could someone please tell me where I am off? I"m trying to create a countdown timer
http://codepen.io/gbsimon87/pen/zBPXwL
Jonathan
@JonKaric
Jul 13 2016 19:03
instead of offset 4, put col-md-offset-2 instead
Dmitry Palamarchuk
@moonbrv
Jul 13 2016 19:04
@JonKaric scroll on page, when sticky header appear, between chrome navigation and sticky header you will see small gap
@JonKaric top of the page
Jonathan
@JonKaric
Jul 13 2016 19:04
@moonbrv okay, make sure there is 0 margin. and try overflow:hidden
that might do the trick
Simon Cordova
@gbsimon87
Jul 13 2016 19:05
Hey guys!
Could someone please take a look at mine as well? :)
Jonathan
@JonKaric
Jul 13 2016 19:06
@gbsimon87 Hey simon, try the javascript help. js isnt my strong point
Simon Cordova
@gbsimon87
Jul 13 2016 19:09
@JonKaric ok I'll try there as well...
Lee Vulinovic
@LeeVulinovic
Jul 13 2016 19:26
@JonKaric thanks, looks better now. any ideas on how to get the image to expand when on viewing full page?
CamperBot
@camperbot
Jul 13 2016 19:26
leevulinovic sends brownie points to @jonkaric :sparkles: :thumbsup: :sparkles:
:cookie: 153 | @jonkaric |http://www.freecodecamp.com/jonkaric
Subroto
@Shub1427
Jul 13 2016 19:30
Is AngularJs worth starting... coz i checked a lot about it n people are supporting more for ReactJs??
ronaldrdguez
@ronaldrdguez
Jul 13 2016 19:41
@Shub1427 Yes, it is, forget about people, especially when it comes to JS frameworks.
Subroto
@Shub1427
Jul 13 2016 19:43
It's also said that due to the rise of Angular 2.... AngularJs 1.x is deprecated
Jonathan
@JonKaric
Jul 13 2016 19:45
@LeeVulinovic It looks like it's already full size. Id try either finding a bigger image, or leaving it as it is. Any bigger and it will distort the image
ronaldrdguez
@ronaldrdguez
Jul 13 2016 19:49
@Shub1427 There is a lot of angular 1 code out there to be maintained. You could do your research, pick React, A2, Ember or whatever, it doesn’t matter. The whole JS ecosystem is one big awful mess, next week there will be another “new” hot framework to make your life “easier”, and every starbucks dweller outhere will start blogging about it and tell you to switch to it.
Marco Mazzeo
@Doko85
Jul 13 2016 19:56
uhm... guys, I have a question... why is it needed to put all of the script tags in the footer even if you are using the document.ready function to ensure they get executed only when the page is fully loaded?
Chris Rutherford
@cjrutherford
Jul 13 2016 20:02
So, I don't quite remember the whole batch of advice from yesterday, but I was wondering if someone would look over my Javascript and see what I'm doing wrong?
ronaldrdguez
@ronaldrdguez
Jul 13 2016 20:02
@Doko85 It may improve responsiveness if it is one BIG page, since you start seeing stuff earlier, I believe. No big deal.
Ken Haduch
@khaduch
Jul 13 2016 20:10
@cjrutherford - well, right now, I'm seeing absolutely nothing come up in your page, other than the heading bar with "All Followed Streams", etc. It looks like all of the requests are returning some kind of error like this: jQuery22403377007232314537_1468440430451({"error":"Not Found","message":"Channel '6' does not exist","status":404}
Chris Rutherford
@cjrutherford
Jul 13 2016 20:11
@khaduch that's funny, because I'm not getting any console output....
Dylan
@dhcodes
Jul 13 2016 20:16
@Doko85 you don't need to, putting it at the bottom is mostly for scripts that don't use document.ready
@cjrutherford are you looking in you dev tools console
?
sometimes the codepen console doesn't capture all the errors
Marco Mazzeo
@Doko85
Jul 13 2016 20:19
@dhcodes something like the bootstrap\jquery or any other framework\library js file?
Dylan
@dhcodes
Jul 13 2016 20:19
@Doko85 document ready is a jQuery command typically
it's also just habit to put it in the bottom script tags
Chris Rutherford
@cjrutherford
Jul 13 2016 20:22
@dhcodes I'm looking in the chrome dev tools
Dylan
@dhcodes
Jul 13 2016 20:25
@cjrutherford I think I found your issue
Chris Rutherford
@cjrutherford
Jul 13 2016 20:26
@dhcodes ok
Dylan
@dhcodes
Jul 13 2016 20:26
@cjrutherford you are using a for...in which is for objects primarily so if you change it to users.forEach(function(user) { ...
you will be good
well, at least it's console logging the right output
Chris Rutherford
@cjrutherford
Jul 13 2016 20:27
@dhcodes okay, yes, thanks, I've been looking for a similar option for Powershell style foreach and python style for x in y iteration.
CamperBot
@camperbot
Jul 13 2016 20:27
cjrutherford sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1216 | @dhcodes |http://www.freecodecamp.com/dhcodes
Dylan
@dhcodes
Jul 13 2016 20:28
yeah for...in was working but was making each user a number
Daniel Sousa
@dgsousa
Jul 13 2016 20:29
hey does anyone else have trouble changing the value of global variables in codepen?
Chris Rutherford
@cjrutherford
Jul 13 2016 20:36
@dhcodes ah, that's not good, and now I just have to check my logic. Check it now! it's cool looking!
Ken Haduch
@khaduch
Jul 13 2016 20:57
@cjrutherford - yeah - really nice for the online users! At least some of them?
Chris Rutherford
@cjrutherford
Jul 13 2016 20:59
@khaduch now, I just need to see what my logic fail is. Anyone know how to set break points so I can stop the code and see what the evaluations are?
Ken Haduch
@khaduch
Jul 13 2016 20:59
@cjrutherford - are you using Chrome?
Chris Rutherford
@cjrutherford
Jul 13 2016 21:00
@khaduch yep yep
so it evaluates the ones that are online
Ken Haduch
@khaduch
Jul 13 2016 21:01
@cjrutherford - find the "Sources" tab in the dev tools. and click on "pen.js" - that should be your javascript code that you want to look at.
Chris Rutherford
@cjrutherford
Jul 13 2016 21:03
@khaduch Nice! I like that!
Ken Haduch
@khaduch
Jul 13 2016 21:04
@cjrutherford - it doesn't seem to be evaluating all online users properly - "cretetion" seems to be online, but isn't showing up on the screen?
Chris Rutherford
@cjrutherford
Jul 13 2016 21:06
@khaduch from what I can tell, it's evaluating the online fine, but is never checking the offline, and going through adding them to the page.....
I don't actually have invalid users in my list.
going mobile, so I may not answer right away. One-on-One?
Ken Haduch
@khaduch
Jul 13 2016 21:09
ok
@cjrutherford - maybe it's working correctly - there are multiple transactions that I'm seeing for cretetion, and I might have misinterpreted that they are online... so it's just the offline users?
Peter Kenward
@PeterKenward
Jul 13 2016 21:16
@khaduch I just found the "Sources" tab in the dev tools and clicked on the pen I'm working on... and there's the javascript I want to look at... awesome. Thanks!
CamperBot
@camperbot
Jul 13 2016 21:16
peterkenward sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1437 | @khaduch |http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Jul 13 2016 21:19
@PeterKenward :+1: great!
it's tricky to find the code on some projects / API tools, so it's good that this one shows up rather easily... you could also use the "debug" view and get rid of all of the codepen overhead, but sometimes it's nice to have it there for making edits and quick checks...
Olga C
@Octopinky
Jul 13 2016 21:21
I need help with stand in line challenge. The task is Write a function nextInLine which takes an array (arr) and a number (item) as arguments. Add the number to the end of the array, then remove the first element of array. The nextInLine function should then return the element that was removed. My code:

function nextInLine(arr, item) {
  var nextNum = 0;
  nextNum=arr[arr.length-1]++;
  arr.push(nextNum);
  arr.shift();
  // Your code here

  return arr.shift();  // Change this line
}
Ken Haduch
@khaduch
Jul 13 2016 21:22
@cjrutherford - I think that I see one problem for your not-online users, you have a jQuery selector $('list-group'), and it should be $('.list-group')- to select the class.
@cjrutherford - that makes the offline users show up in the list now... :)
khaduch @khaduch - going to start making some dinner...
Shannon Palm
@ShannonPalm
Jul 13 2016 21:24
@khaduch Thank you so much! That is awfully helpful.
CamperBot
@camperbot
Jul 13 2016 21:24
shannonpalm sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1438 | @khaduch |http://www.freecodecamp.com/khaduch
Peter Kenward
@PeterKenward
Jul 13 2016 21:25
@khaduch I think I need a bigger monitor :)
Olga C
@Octopinky
Jul 13 2016 21:29
Lol, how come my shift() function removes 2 first elements?
Daniel Sousa
@dgsousa
Jul 13 2016 21:33
hey guys, im having a bit of trouble with codePen, specifically saving a value in a global variable. Has anyone else experienced this?
Elbert Cortez
@trip16661
Jul 13 2016 21:35
@danielmooncloud you are never invoking setValue therefore it will always be dog
@danielmooncloud if you never invoke it it will never work
Peter Kenward
@PeterKenward
Jul 13 2016 21:37
you have arr.push(nextNum); is nextNum what you want to be 'pushing' onto the end of your array?
Olga C
@Octopinky
Jul 13 2016 21:37
I got it. Wheee!
@PeterKenward Yeah, I thought for some reason, that the task was to push numbers in order. That was a mistake, lol!
Peter Kenward
@PeterKenward
Jul 13 2016 21:38
:)
Elbert Cortez
@trip16661
Jul 13 2016 21:38
@danielmooncloud happy that helped :)
long text comming..
Daniel Sousa
@dgsousa
Jul 13 2016 21:39
thanks!
Elbert Cortez
@trip16661
Jul 13 2016 21:39
np
mby someone who is free can help me with this one thing is been bothering me
I'm loosing focus even though i shouldn't (on my dynamical added inputs) :/
Lines of interest 177, 152, 206
ps:not responsive yet so.
http://codepen.io/Trip1666/full/wGOvEq/
Peter Kenward
@PeterKenward
Jul 13 2016 21:41
I'm working in codepen and using the Chrome devtools. Now as I have loaded jQuery to my 'pen', presumably I can call jQuery functions from the console?
Elbert Cortez
@trip16661
Jul 13 2016 21:42
@PeterKenward you mean jquery methods?
Daniel Sousa
@dgsousa
Jul 13 2016 21:43
@trip16661 i guess my problem is this then.. how do i change the value of a global variable with a click event?
Peter Kenward
@PeterKenward
Jul 13 2016 21:43
Yes @trip16661
Elbert Cortez
@trip16661
Jul 13 2016 21:43
yes you can peter
as long as you script loads then yes
PeterKenward @PeterKenward googles 'method' again...
Elbert Cortez
@trip16661
Jul 13 2016 21:43
@danielmooncloud check On click events* (typo)
Peter Kenward
@PeterKenward
Jul 13 2016 21:44
thanks @trip16661
CamperBot
@camperbot
Jul 13 2016 21:44
:cookie: 401 | @trip16661 |http://www.freecodecamp.com/trip16661
peterkenward sends brownie points to @trip16661 :sparkles: :thumbsup: :sparkles:
Daniel Sousa
@dgsousa
Jul 13 2016 21:45
use On instead of click.?
Elbert Cortez
@trip16661
Jul 13 2016 21:45
@danielmooncloud well if you use click you will have to stop default
which is more annoying
unless you have a small snipped on you text editor
but honestly i just like more the on" something syntax since i can wrap it better in my head
Daniel Sousa
@dgsousa
Jul 13 2016 21:48
so how would you alter this to work?
Elbert Cortez
@trip16661
Jul 13 2016 21:49
$(document).on('click', '.header', function() {
    myValue = "test";   
  });
why document and not the elemement itself?
@danielmooncloud it works the thing is that
it changes the variable internally there is no such thing that tell it to display it
getValue is invoked before the click event therefore it only works with dogs because at the moment it's invoked nothing changed its value
Daniel Sousa
@dgsousa
Jul 13 2016 21:53
right
i guess thats the logic im stuck in
is there a way to change the value of a global variable through a click event?
Elbert Cortez
@trip16661
Jul 13 2016 21:54
@danielmooncloud Like I said you are doing that already
you are just not refreshing the contnet
since getValue is invoked as the page loads
Daniel Sousa
@dgsousa
Jul 13 2016 21:55
so is there a way to make it work
?
Elbert Cortez
@trip16661
Jul 13 2016 21:55
yes
ofc
you just have to think about what i said before
If you want me to directly say it i can but it's better if you think it
like i said you are already changing the variable
on a click event
Daniel Sousa
@dgsousa
Jul 13 2016 21:56
i mean i can move getValue inside of the click event
Elbert Cortez
@trip16661
Jul 13 2016 21:56
ofc :)
Daniel Sousa
@dgsousa
Jul 13 2016 21:57
waht is ofc?
Elbert Cortez
@trip16661
Jul 13 2016 21:57
of course
do it and let me know :)
Daniel Sousa
@dgsousa
Jul 13 2016 22:00
now the text disappeared
ok wait
i got it back
Elbert Cortez
@trip16661
Jul 13 2016 22:03
because you did move the block inside and then called outside
so it will never be initialized until you actually click
and that's not the func you want
want you want is to invoke the function inside of the click even
so when it clicks it refresh the element
Daniel Sousa
@dgsousa
Jul 13 2016 22:04
right
so i guess here's my dillemma then
im trying to use a search text to create a url and save it in a variable using jquery
and then call the url using angular
but i guess that's the problem, becuase i would have to initialize the angular every time the click event is called
Elbert Cortez
@trip16661
Jul 13 2016 22:06
wait what?
do you know angular is more of a framework
Daniel Sousa
@dgsousa
Jul 13 2016 22:07
yeah
Elbert Cortez
@trip16661
Jul 13 2016 22:07
how can u initialize it on click
Daniel Sousa
@dgsousa
Jul 13 2016 22:07
i mean im basically trying to use angular
i just need to be able to dynamically update the url
Elbert Cortez
@trip16661
Jul 13 2016 22:07
want my honest answer?
Daniel Sousa
@dgsousa
Jul 13 2016 22:07
sure
Elbert Cortez
@trip16661
Jul 13 2016 22:08
Don't attempt angular just yet
learn jquery and javascript first
angular peek is huge
Dhruv Kumar
@IMDhruv
Jul 13 2016 22:08
even better learn Javascript first., and then jQuery
Daniel Sousa
@dgsousa
Jul 13 2016 22:08
what does that mean?
Elbert Cortez
@trip16661
Jul 13 2016 22:09
learn proper javascript because angular and jquery depends a lot from
javascript
so it makes no sense to learn angular if you don't know js that well
so it's okay
Daniel Sousa
@dgsousa
Jul 13 2016 22:10
i mean, i don't think its that hard to build the wikiviewer in angular though
if i can figure out a way to dynamically update hte url
i already have the module, the controller, and the service up and running
Elbert Cortez
@trip16661
Jul 13 2016 22:12
@danielmooncloud you can, but as i have seen it you lack so much in the javascrip area and dom manipulation area
that it makes no sense to learn it just now
and sorry if im brutally honest
but it'sbetter being honest than sorry
can anyone take a look at my tic tac toe? Let me know if there any bugs/improvements i should make
Elbert Cortez
@trip16661
Jul 13 2016 22:16
@Neotriz it works really well but
if you are using modal for the first thing
why you are using alert box for ?
Kenzo Mendoza
@KenzoM
Jul 13 2016 22:17
@trip16661 my next improvement is actually getting rid of alertbox and replace with div that alerts the user instead
the alertbox was initally there for debugging purposes
Elbert Cortez
@trip16661
Jul 13 2016 22:18
I wouldn't dbug with alert box but okay :P
what i mean is that
you already have a modal box (the first thing that appear)
you could have used the same modal and change it
Kenzo Mendoza
@KenzoM
Jul 13 2016 22:21
gotcha
that makes sense
cool, ill work on that. thanks for the input!
Elbert Cortez
@trip16661
Jul 13 2016 22:22
Yeah i mean i guess you could for sure make other modals but that would be wasting time
since u already build one
a bug i just found is
clicking outside of the modal
when choosing
Kenzo Mendoza
@KenzoM
Jul 13 2016 22:24
oh yeah, I forgot about that
Elbert Cortez
@trip16661
Jul 13 2016 22:24
start the game without the user being able
to select
Kenzo Mendoza
@KenzoM
Jul 13 2016 22:24
awesome, thanks for pointing that out
Peter Kenward
@PeterKenward
Jul 13 2016 22:29

```$.getJSON( "http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&callback=", function( json ) {
console.log(json);

});```

Elbert Cortez
@trip16661
Jul 13 2016 22:30
what's the problem?
Peter Kenward
@PeterKenward
Jul 13 2016 22:31
The code above works from Chrome console, but not from within my pen where I get "Error 404 (Not Found)"
Troy
@Socrates714
Jul 13 2016 22:31

Here is my codepen site:

http://codepen.io/Socrates714/pen/EybzRV

I am trying to put an about of a portfolio page (assignment for freecodecamp) under my taskbar. It is currently overlapping with my taskbar. I wrote the text "hi" in the div so that I could see where the div was on the page. I have 2 questions. First, why is it overlapping with my task bar div rather than showing up underneath the taskbar div which is what I want. Second, why is adding to the margin-top of the second div not moving it down on the page?

Thank you for your help.

Peter Kenward
@PeterKenward
Jul 13 2016 22:32
Sorry I need to save my pen before sharing it......
Ken Haduch
@khaduch
Jul 13 2016 22:32
@PeterKenward - yeah, it does get a little awkward on the spacing - I have two monitors connected to my computer, and that isn't enough with the huge CodePen display. You can anchor the dev tools to the browser window - if can get by with a small enough desktop view, that helps sometimes.
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 22:32
hello guys i am trying to get a background image suit the user location
```
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 22:33
$(document).ready(function(){
var background;
$.getJSON2("http://www.panoramio.com/map/get_panoramas.php?set=public&from=0&to=1&minx=" + lat + "&miny=" + lng + "&maxx=" + lat + "&maxy=" + lng + "&size=large&mapfilter=true"
function(json2) {
        background = photos[0].photo_file_url;
      });
    document.body.style.backgroundImage = "background";
}
is is correct ?
Elbert Cortez
@trip16661
Jul 13 2016 22:33
@PeterKenward cors problem
XMLHttpRequest cannot load http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&callback=. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://s.codepen.io' is therefore not allowed access.
Peter Kenward
@PeterKenward
Jul 13 2016 22:35
@trip16661 I get this error message when I click on Quote: pen.js:6 GET http://s.codepen.io/boomerang/3dfbc28a54f026d84172c18fe67d23b51468443893178/apiUrl 404 (Not Found)
Elbert Cortez
@trip16661
Jul 13 2016 22:36
@PeterKenward not sure about that
@Mohanad-Mjawaz im not sure if getJson 2 is the correct syntax also u are not using the parameter the function gives you
if its an object what you have in the parameter you should access it through
json2.photos[0].photo bla bla bla
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 22:41
@trip16661 this is the page im working on, im trying to add a function that will change the background image to each location
https://codepen.io/Mohanad-Mjawaz/pen/jAaEbw
so im kinda lost here becouse im new to JS
Elbert Cortez
@trip16661
Jul 13 2016 22:42
@Mohanad-Mjawaz sure but you what i mean is that you are not using your object there
function(json2) {
        background = photos[0].photo_file_url;
      });
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 22:43
@trip16661 oh
Elbert Cortez
@trip16661
Jul 13 2016 22:43
you are basically saying background be this random thing that don't have route
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 22:43
@trip16661 so how should i fix this i need to add return maybe ?
Elbert Cortez
@trip16661
Jul 13 2016 22:44
where is photos[0].photo_file_url;
inside of the call?
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 22:44
from the api
Elbert Cortez
@trip16661
Jul 13 2016 22:44
then why are you not using the object?
Elbert Cortez
@trip16661
Jul 13 2016 22:44
how does the program know where to find it
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 22:45
hmm
Elbert Cortez
@trip16661
Jul 13 2016 22:45
when u do ajax call
you are basically asking information in this case a json object
in your case you do it
but you are not accessing to the object that you recieve
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 22:46
i see
Elbert Cortez
@trip16661
Jul 13 2016 22:46
and instead u are putting route that the program don;t know inside of
background
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 22:47
i thought i was accessing it by function(json) {
background =photos[0].photo_file_url;
}
Elbert Cortez
@trip16661
Jul 13 2016 22:47
where is photos?
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 22:47
then how can i get that url of the image ?
Elbert Cortez
@trip16661
Jul 13 2016 22:47
inside of the call?
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 22:47
its inside the JSON
Elbert Cortez
@trip16661
Jul 13 2016 22:47
how does the computer know that?
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 22:47
so i should add JSON first
function(json) {
background =JSON.photos[0].photo_file_url;
} ?
Elbert Cortez
@trip16661
Jul 13 2016 22:48
the path itself it's wrong because you are asuming that the programs know what you want
but you are not telling it to do it right
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 22:48
i see
Elbert Cortez
@trip16661
Jul 13 2016 22:48
function(json2) {
which one is the parameter?
json2 not JSON or json or JsON
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 22:49
well i got lost becouse im already using another JSON to get weather and location
hmmm
Elbert Cortez
@trip16661
Jul 13 2016 22:51
I can see that but the syntax is wrong therefore the program breaks
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 22:51
can you take a look to this page ?
https://codepen.io/Mohanad-Mjawaz/pen/jAaEbw
i mean how can i add this fuction in the right way so it will work ?
i have been looking for way too long on google and now im kind confiused
Troy
@Socrates714
Jul 13 2016 22:55

Here is my codepen site:

http://codepen.io/Socrates714/pen/EybzRV

I am trying to put an about of a portfolio page (assignment for freecodecamp) under my taskbar. It is currently overlapping with my taskbar. I wrote the text "hi" in the div so that I could see where the div was on the page. I have 1 questions. First, why is it overlapping with my task bar div rather than showing up underneath the taskbar div which is what I want. I had to add to the margin
Thank you for your help.

ahh didn't get to finish typing. I had to add to the margin-top to move the text down.
Elbert Cortez
@trip16661
Jul 13 2016 22:57
I won't really look but i will give you the leads okay?
first you want to do an ajax calling for the images related to what you want and as asoon as you get it you will have to changge the body (or mby the container, up to you) css background property using the image route you get from the object
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 23:00
@trip16661 ok thanks for your time
CamperBot
@camperbot
Jul 13 2016 23:00
mohanad-mjawaz sends brownie points to @trip16661 :sparkles: :thumbsup: :sparkles:
:cookie: 405 | @trip16661 |http://www.freecodecamp.com/trip16661
Alejandro Carrera
@Ale-Carrera-97
Jul 13 2016 23:00
Hey guys. I'm currently trying to build the first tribute page using codepen. Does anybody have any tips as to how to do this. I feel overwhelmed cause I'm not sure how to begin. My main concern is on getting fonts and getting images. Also I feel like I should retake the previous courses that teach HTML CSS Bootstrap and Jquery. What do you guys think?
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 23:00
im gona spend few more hours tring to work on it
Elbert Cortez
@trip16661
Jul 13 2016 23:00
good luck dude
Greg Duncan
@GregatGit
Jul 13 2016 23:01
@Socrates714 Portfolios and Navbars are quite tricky - here is a good template to see how to do one http://www.w3schools.com/bootstrap/bootstrap_scrollspy.asp
Elbert Cortez
@trip16661
Jul 13 2016 23:02
@Ale-Carrera-97 just search to saint google whenever you feel confused
if you feel you know nothing still just read it again
but the course is never meant to teach you completely but to lead you to the path so you can think for yourself and say "oh so this is possible"
Greg Duncan
@GregatGit
Jul 13 2016 23:03
@Ale-Carrera-97 Start off by making an ordinary page and keep improving it as you learn - going over the html and css is a good idea - I rushed through them and had to do them all again
Alejandro Carrera
@Ale-Carrera-97
Jul 13 2016 23:04
@trip16661 @GregatGit thanks you guys.
CamperBot
@camperbot
Jul 13 2016 23:04
ale-carrera-97 sends brownie points to @trip16661 and @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 406 | @trip16661 |http://www.freecodecamp.com/trip16661
:cookie: 683 | @gregatgit |http://www.freecodecamp.com/gregatgit
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 23:05
@trip16661 am i going on the right way ?
$.ajax({
url:"http://www.panoramio.com/map/get_panoramas.php?set=public&from=0&to=1&minx=-180&miny=-90&maxx=180&maxy=90&size=medium&mapfilter=true"
dataType:'jsonp',
var background = photos[0].photo_file_url;
});
Alejandro Carrera
@Ale-Carrera-97
Jul 13 2016 23:05
Im on google fonts looking for an appropriate font for a heavy metal tribute page
Elbert Cortez
@trip16661
Jul 13 2016 23:07
@Mohanad-Mjawaz that links makes me download a php document
so i doubt that's the right route
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 23:07
i got it from panoramio website :O
Elbert Cortez
@trip16661
Jul 13 2016 23:08
did you read the documentation?
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 23:08
yes
this is what they said
Troy
@Socrates714
Jul 13 2016 23:10
@GregatGit thank you!
CamperBot
@camperbot
Jul 13 2016 23:10
socrates714 sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 684 | @gregatgit |http://www.freecodecamp.com/gregatgit
Greg Duncan
@GregatGit
Jul 13 2016 23:11
@Socrates714 :+1:
Elbert Cortez
@trip16661
Jul 13 2016 23:15
@Mohanad-Mjawaz no idea i tried to do a simple call and i get a
XMLHttpRequest cannot load https://www.panoramio.com/map/get_panoramas.php?set=public&from=0&to=20&minx=-180&miny=-90&maxx=180&maxy=90&size=medium&mapfilter=true. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://s.codepen.io' is therefore not allowed access.
error
Mohanad Mjawaz
@Mohanad-Mjawaz
Jul 13 2016 23:15
@trip16661 ok man thanks any way it was great help from you
CamperBot
@camperbot
Jul 13 2016 23:15
mohanad-mjawaz sends brownie points to @trip16661 :sparkles: :thumbsup: :sparkles:
:warning: mohanad-mjawaz already gave trip16661 points
Elbert Cortez
@trip16661
Jul 13 2016 23:16
but try to remember that if you dont specify the route your program will never know
photos[0].photo_file_url
is not really the right route
isntead
myAjaxCallRecievedObject.photos[0].photo_file_url;
@GregatGit greg mby if you are bored you can help me with this silly eror im having here with focusing an input field
http://s.codepen.io/Trip1666/debug/wGOvEq
been stuck for so long xD
Greg Duncan
@GregatGit
Jul 13 2016 23:22
@trip16661 can you post the editors view
Lines of interest 177, 152, 206
Greg Duncan
@GregatGit
Jul 13 2016 23:23
so what exactly do you want to happen?
Elbert Cortez
@trip16661
Jul 13 2016 23:23
i have an even on click to gain focus on a hidden input
Alejandro Carrera
@Ale-Carrera-97
Jul 13 2016 23:24
Okay I'm a little confused as to how I can add images to my html code for my tribute page. I've found a couple of good pics on Google Images but I don't really know where to go from there. The only thing that comes to mind is right-clicking the image and clicking Inspect Element.
Elbert Cortez
@trip16661
Jul 13 2016 23:24
but when i click on the elements that edits (and pop an input) an element
Greg Duncan
@GregatGit
Jul 13 2016 23:24
@trip16661 so an example of what you want to hapen
Elbert Cortez
@trip16661
Jul 13 2016 23:24
just keep the focus on the input fields
click on rename
on the console
it basically pops an input to change the rename to whatever the use puts
Alejandro Carrera
@Ale-Carrera-97
Jul 13 2016 23:26
hold on... i think i got it figured out. I'm going to give my approach a try. I'll let you know how it goes.
Elbert Cortez
@trip16661
Jul 13 2016 23:27
the problem rely that when i click on the element the click event that keep the hidden input field focuses activates but the the click event of the element that has a focus event inside don't
and because it never happens it loses the focus and it triggers a blur event
Greg Duncan
@GregatGit
Jul 13 2016 23:29
@trip16661 I have never used focus() or blur()
Alejandro Carrera
@Ale-Carrera-97
Jul 13 2016 23:30
okay it totally worked. I had to copy the image source by hand though. lol
Elbert Cortez
@trip16661
Jul 13 2016 23:30
oh xD
it supposed to focus the selected element
but i guess it happens on different timings
Mrinal Patwardhan
@mrinalusp
Jul 13 2016 23:34
guys
did anyone face problem going to the next challenge
Greg Duncan
@GregatGit
Jul 13 2016 23:35
@trip16661 I can't find the class rename in the html
Elbert Cortez
@trip16661
Jul 13 2016 23:36
@GregatGit because it's dinamically added after the element
is clicked
Toni Shortsleeve
@KoniKodes
Jul 13 2016 23:36
@mrinalusp which challenge are you on?
Alejandro Carrera
@Ale-Carrera-97
Jul 13 2016 23:36
Okay so I'm trying to re-size an image for my tribute page. On the CSS console, I type the style element and the code for changing the amount of pixels in an image but when I run the code, nothing happens. where do you think that I might be wrong>
Mrinal Patwardhan
@mrinalusp
Jul 13 2016 23:37
@KoniKodes i am on the tribute challeenge
have completed it
Greg Duncan
@GregatGit
Jul 13 2016 23:37
@trip16661 I can see that - but I'm trying to see it in the debugger in the elements
Nicholas Vorraso
@nickeyvee
Jul 13 2016 23:37
good evening to all!
Elbert Cortez
@trip16661
Jul 13 2016 23:37
@GregatGit
try this one then
http://codepen.io/Trip1666/pen/wGOvEq
the blur event is commented
Toni Shortsleeve
@KoniKodes
Jul 13 2016 23:38
@mrinalusp I think it is very well done.
Mrinal Patwardhan
@mrinalusp
Jul 13 2016 23:38
@KoniKodes thanks buddy!
CamperBot
@camperbot
Jul 13 2016 23:38
mrinalusp sends brownie points to @konikodes :sparkles: :thumbsup: :sparkles:
:cookie: 324 | @konikodes |http://www.freecodecamp.com/konikodes
Elbert Cortez
@trip16661
Jul 13 2016 23:38
the thing is that when it get blur (loses focus ) it automatically submit do something removing the form element (including the inputfield)
@mrinalusp you did really well specially on small view
Toni Shortsleeve
@KoniKodes
Jul 13 2016 23:40
@mrinalusp Thank you for the brownie. You will probably find each challenge a little more difficult, although some might have an easier time depending on their experience.
CamperBot
@camperbot
Jul 13 2016 23:40
konikodes sends brownie points to @mrinalusp :sparkles: :thumbsup: :sparkles:
:cookie: 131 | @mrinalusp |http://www.freecodecamp.com/mrinalusp
Alejandro Carrera
@Ale-Carrera-97
Jul 13 2016 23:41
still stuck on that re-sizing issue...
Greg Duncan
@GregatGit
Jul 13 2016 23:41
@trip16661 how can I add (then see) some html with the class 'rename'
Toni Shortsleeve
@KoniKodes
Jul 13 2016 23:41
@trip16661 The calculator looks good.
Elbert Cortez
@trip16661
Jul 13 2016 23:42
@GregatGit clicking on rename or edit button (on the calculator clips, once you added a new formula)
Greg Duncan
@GregatGit
Jul 13 2016 23:44
@trip16661 I can see rename but no class="rename" in the html
Elbert Cortez
@trip16661
Jul 13 2016 23:45
click on rename button on the left top corner
Greg Duncan
@GregatGit
Jul 13 2016 23:45
yes
Elbert Cortez
@trip16661
Jul 13 2016 23:45
it should dinamically add a form element with an inputfield with class rename
the thing is that since it loses focus you can't really write on the box
Greg Duncan
@GregatGit
Jul 13 2016 23:47
@trip16661 how jQuery select a class that is not appearing the html?
how do you post an img on gitter?
Elbert Cortez
@trip16661
Jul 13 2016 23:50
dragging i think
input111.png
y dragging
Greg Duncan
@GregatGit
Jul 13 2016 23:53
html.JPG
@trip16661 where is class='rename'
even if you have dynamicly added a class it should appear in the html
Elbert Cortez
@trip16661
Jul 13 2016 23:58
did you try the new link that i gave you?
http://codepen.io/Trip1666/pen/wGOvEq
i dissable the onblur event
so you could see