These are chat archives for FreeCodeCamp/HelpFrontEnd

2nd
Oct 2017
Tom
@moT01
Oct 02 2017 00:00
wanna attempt to fix an issue im having?
or help me figure it out
Ken Haduch
@khaduch
Oct 02 2017 00:02
@moT01 - I can give it a shot...
Tom
@moT01
Oct 02 2017 00:03
well, ill explain it, don't feel obligated if you dont want to...
im making a snake game
i enlarged the pieces
the food location is randomly generated
sometimes it shows up where the head of the snake it
is*
there's an xyHistory array with the location of all the snake pieces
(where you shouldn't be able to put the food)
and it works for all the spots but the head, meaning it shows up in the exact same spot as is last was when you eat it
am i making sense so far?
i dunno, i spent some time on it and can't quite get there - yet
the draw function at the bottom continuously loops
Tom
@moT01
Oct 02 2017 00:08
not sure if that's part of p5.js or canvas - not important
or maybe it is - i guess im not sure how that works exactly
piteto
@piteto
Oct 02 2017 00:13
Your navbar links are written correctly, but the sections need to be taller so you can scroll to them. Also, it would be better to use margins instead of html entities for spaces       Altogether, update your CSS with the following to see:
section {
  min-height: 70vh;
}

li {
  list-style: none;
  display: inline;
  margin: 0 15px;
}
CXmanager
@CXmanager
Oct 02 2017 00:43
@khaduch Thanks. Do you know how to make it scroll smoothly to that section?
CamperBot
@camperbot
Oct 02 2017 00:43
cxmanager sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 3329 | @khaduch |http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Oct 02 2017 00:47
@CXmanager - google for a JS package "scrollspy" - I think that is what people normally use. It might even be part of Bootstrap? I might be wrong about that for the smooth scrolling, but I think that's where you can find that functionality?
CXmanager
@CXmanager
Oct 02 2017 00:50
Thanks
Ken Haduch
@khaduch
Oct 02 2017 00:50
@CXmanager - this is the first link that came up with a google search: https://css-tricks.com/snippets/jquery/smooth-scrolling/ - you can find information there.
Alexx Martínez
@AlexxMart
Oct 02 2017 01:24
I'm adding the final touch to my "Twitch TV" challenge and I need the page to display an error message when the user enters an incorrect username. The first time the user adds an incorrect user it works fine, but then it shows the error message even when the username is correct
I have separated and commented the lines that are giving me problems
Amit Patel
@AmitP88
Oct 02 2017 01:29
hey guys, I'm trying to get the second clicked on cell to determine whether or not it's adjacent to the first clicked on cell in the grid, but i'm having trouble figuring out what I need to do to make this work
https://codepen.io/AmitP88/pen/pWyaNY?editors=0010
Moisés Man
@moigithub
Oct 02 2017 01:30
@AlexxMart before u do $(".L404").fadeIn(0, function() {
u need to check if the getJSON returned valid info
Ken Haduch
@khaduch
Oct 02 2017 01:38
@AlexxMart - I don't really see any place in your code where you differentiate between getting a good return for a user vs an invalid return? Am I just missing something?
Ken Haduch
@khaduch
Oct 02 2017 01:44
@AlexxMart - once you create a div with .L404 as a class, you never get rid of it, so it's always there and you always fade it in regardless of the returning status. So you should remove that class or remove that element that you create with the class if it is an invalid username. Before you do a search for the next username, that is.
Alexx Martínez
@AlexxMart
Oct 02 2017 02:00
@khaduch I couldn't figure out how to differentiate a good response from a bad one, I noticed the the bad response have "404" as status and that's why I decided to store that "404" response into a class
I had to add another character before the 404 response since the class name cannot be just numbers. that's why I included an L in the beginning of the class name. When the user enters a valid username the status "404" doesn't exist
Ken Haduch
@khaduch
Oct 02 2017 02:27
@AlexxMart - as I see it, the problem is that you have this div with the L404 class and you are always activating it when you search for a new username. So you have to somehow remove it from the DOM if you don't want to have it interfere with the next search. You could probably find a different way to display the error because if you have a "404" status returned, you can just display the error message and not put anything "permanent" in the DOM.
Ruchika Sharma
@ruchika90
Oct 02 2017 02:35
@Manish-Giri ty i passed the challenge
CamperBot
@camperbot
Oct 02 2017 02:35
ruchika90 sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 6602 | @manish-giri |http://www.freecodecamp.com/manish-giri
Princu
@Princu7
Oct 02 2017 02:51
https://codepen.io/Princu7/pen/PJKJWd?editors=1100
I don't understand float properly. Can someone tell me the reason why the text anchor elements are not aligned in the above pen? And why does it get aligned on adding some properties (mentioned in the comments inside) ?
Danny McVey
@dannymcvey
Oct 02 2017 03:04
@Princu7 - add display: inline-block; to your a element.
Let me know if that's what you were going for.
Princu
@Princu7
Oct 02 2017 03:06
@droymac Yeah. Thanks. It works also, if we add float: left to the .pull-left class. I wanted to understand why the elements are not aligned without adding those properties and what does adding these properties do which make the elements align themselves.
CamperBot
@camperbot
Oct 02 2017 03:06
princu7 sends brownie points to @droymac :sparkles: :thumbsup: :sparkles:
:cookie: 112 | @droymac |http://www.freecodecamp.com/droymac
Danny McVey
@dannymcvey
Oct 02 2017 03:11
@Princu7 - remove padding: 25px from your a element. See how your two elements line up? When you add vertical padding to an inline element, it pushes the next element below it. When you set display: inline-block to your a element, the browser retains both the padding you wanted AND the inline display of both elements.
Princu
@Princu7
Oct 02 2017 03:14
Oh. Didn't know that. Thank you so much :)
Adam Faraj
@adamfaraj
Oct 02 2017 04:00
how do i wrap my div in an anchor tag?
var newDiv = document.createElement("div"); //setting up a div to inject results into DOM
                newDiv.id = "divResults";
                newDiv.class = "divResults";

                var a = document.createElement('a');
                a.href = 'https://en.wikipedia.org/wiki/?curid=' + item[1].pageid;
                a.target = "_blank";
                a.class = "resultsLink";
                // var aText = document.createTextNode("Click here for article");
                // a.appendChild(aText);

                var h1 = document.createElement("h1");
                var titleText = document.createTextNode(item[1].title);
                h1.appendChild(titleText);
                var snippetText = document.createTextNode(item[1].extract);

                //populating div with data
                h1.appendChild(a);
                newDiv.appendChild(h1);
                newDiv.appendChild(snippetText);
                newDiv.appendChild(a);
                var finalDiv = $(".divResults").wrap($('.resultsLink'));
                finalDiv.class = "finalDiv";


                document.body.appendChild($(".divResults").wrap($('.resultsLink')));
this didn't work
David Chen
@Obiwan777
Oct 02 2017 04:10
anyone familiar with php mysql and html populated table?
linkin-park
@linkin-park
Oct 02 2017 06:38
@adamfaraj nice :)
@adamfaraj a little help how to start web design?
Linus
@nusli
Oct 02 2017 07:18
@piteto thanks
CamperBot
@camperbot
Oct 02 2017 07:18
nusli sends brownie points to @piteto :sparkles: :thumbsup: :sparkles:
:cookie: 180 | @piteto |http://www.freecodecamp.com/piteto
Adam Faraj
@adamfaraj
Oct 02 2017 07:24
@linkin-park say what?
haha
Henry
@GitHub-Henry
Oct 02 2017 07:56
@adamfaraj nice job
J.Chechelski
@SupaSaiyan
Oct 02 2017 07:59
Hello guys, which tool is better to know for beginner? gulp or webpack?
Sorin Ruse
@sorinr
Oct 02 2017 08:00
@SupaSaiyan gulp its much easier to configure.
J.Chechelski
@SupaSaiyan
Oct 02 2017 08:01
@sorinr ok, thanks. So I will try gulp :D
CamperBot
@camperbot
Oct 02 2017 08:01
supasaiyan sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1339 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Oct 02 2017 08:03
@SupaSaiyan you can also try webpack after and see whats the one that suites u best
@SupaSaiyan here a gulp starter kit for inspiration
J.Chechelski
@SupaSaiyan
Oct 02 2017 08:15
@sorinr ok, thank you
CamperBot
@camperbot
Oct 02 2017 08:15
supasaiyan sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
api offline
Sorin Ruse
@sorinr
Oct 02 2017 08:17
@SupaSaiyan welcome
Tomáš Dvořák
@Deepress
Oct 02 2017 09:31
Hi, anyone here uses yarn and can help me with migrating from bower+wiredep ?
CXmanager
@CXmanager
Oct 02 2017 11:35
Anyone struggled with the portfolio page...atleast the position it is in?
or am i the only one :D
Jan Shah
@JanShah
Oct 02 2017 12:40
@CXmanager you can design your own portfolio page
Tomáš Dvořák
@Deepress
Oct 02 2017 13:26
Ok, done with yarn, it's useless :/
Nitin Chandran Nair
@NitinNair89
Oct 02 2017 13:29

Hello. This might not be the right question for this channel but I am looking for some suggestions..

If there's an advertisement playing on a website, is there a way to "know" what advertisement was played?

hocjs1711
@hocjs1711
Oct 02 2017 13:34
I should learn react js or angular 2
Alex Boquist
@aplchian
Oct 02 2017 13:35
react all day err day
hocjs1711
@hocjs1711
Oct 02 2017 13:35
why?
Zerka1982
@Zerka1982
Oct 02 2017 13:35
Hello Guys ;)
Could you please check this and tell what's wrong with my code. Why I cannot display the content of li when hovering ?
https://codepen.io/Zerka1982/pen/qPXvBx
Anybody checked my code ?
Zerka1982
@Zerka1982
Oct 02 2017 13:41
I guess everybody is sleeping :)
Anybody here ?
Alex Boquist
@aplchian
Oct 02 2017 13:41
ill check it oout
whats going on with i
Zerka1982
@Zerka1982
Oct 02 2017 13:42
Thank you dude
When you hover the orange button, It should display the text
Alex Boquist
@aplchian
Oct 02 2017 13:43
what text
Zerka1982
@Zerka1982
Oct 02 2017 13:43
Inside li
Alex Boquist
@aplchian
Oct 02 2017 13:43
what line of code is the li on, im not seein git
Zerka1982
@Zerka1982
Oct 02 2017 13:43
<a href="index.html" class="anchor-link" data-anchor-name="great-students">Overview</a>
Sorry sorry
I meant inside <a>
Alex Boquist
@aplchian
Oct 02 2017 13:44
ok
so what text should it showw
Zerka1982
@Zerka1982
Oct 02 2017 13:44
It should show Overview
Alex Boquist
@aplchian
Oct 02 2017 13:44
it is showing overview for me
Zerka1982
@Zerka1982
Oct 02 2017 13:44
how is that :(
I don't see it here
Alex Boquist
@aplchian
Oct 02 2017 13:45
Screen Shot 2017-10-02 at 9.44.54 AM.png
that?
Long Nguyen
@longnt80
Oct 02 2017 13:45
I see Overview too
Zerka1982
@Zerka1982
Oct 02 2017 13:45
no sorry
because i changed something
the idea is to show the text once we hover
Once <a> </a> is hovered, it must display the text which is inside ....
you got my point guys ?
Long Nguyen
@longnt80
Oct 02 2017 13:50
you don't have the width when it is hovered
@Zerka1982
Zerka1982
@Zerka1982
Oct 02 2017 13:51
So what should I do please
Long Nguyen
@longnt80
Oct 02 2017 13:52
.anchor-links-wrapper .anchor-item:hover,
     .anchor-links-wrapper .anchor-item.active {
        width: 120px; 
      opacity: 1;
        -webkit-transition: 0.5s ease-in-out all;
        -ms-transition: 0.3s ease-in-out all;
        -moz-transition: 0.3s ease-in-out all;
        -o-transition: 0.3s ease-in-out all;
        transition: 0.3s ease-in-out all;
    }
^ width: 120px
Zerka1982
@Zerka1982
Oct 02 2017 13:53
are you sure ?
Long Nguyen
@longnt80
Oct 02 2017 13:53
yes
Zerka1982
@Zerka1982
Oct 02 2017 13:53
this is the result
image.png
Long Nguyen
@longnt80
Oct 02 2017 13:54
so? it worked
Zerka1982
@Zerka1982
Oct 02 2017 13:54
The idea is to show the content only when hovering
Long Nguyen
@longnt80
Oct 02 2017 13:54
then you separate the hover from .active
.anchor-links-wrapper .anchor-item:hover,
     .anchor-links-wrapper .anchor-item.active {

      opacity: 1;
        -webkit-transition: 0.5s ease-in-out all;
        -ms-transition: 0.3s ease-in-out all;
        -moz-transition: 0.3s ease-in-out all;
        -o-transition: 0.3s ease-in-out all;
        transition: 0.3s ease-in-out all;
    }
  .anchor-links-wrapper .anchor-item:hover {
      width: 120px; 
  }
Zerka1982
@Zerka1982
Oct 02 2017 13:58
@longnt80 Could you please create a new pen and copy paste the code and do your modification. Even i change the code the way you told me, still got the same result
@Zerka1982 there are 2 comments I added in there, where I edited the css
Zerka1982
@Zerka1982
Oct 02 2017 14:01
@longnt80 thank you very much
CamperBot
@camperbot
Oct 02 2017 14:01
zerka1982 sends brownie points to @longnt80 :sparkles: :thumbsup: :sparkles:
:cookie: 573 | @longnt80 |http://www.freecodecamp.com/longnt80
Long Nguyen
@longnt80
Oct 02 2017 14:01
@Zerka1982 np
Zerka1982
@Zerka1982
Oct 02 2017 14:01
There is only small thing to change
about the margin to make it exact
to make the text inside orange box centered
I added transition for the link inside
Zerka1982
@Zerka1982
Oct 02 2017 14:09
which line ?
Long Nguyen
@longnt80
Oct 02 2017 14:09
48
Zerka1982
@Zerka1982
Oct 02 2017 14:10
thank you again :)
Long Nguyen
@longnt80
Oct 02 2017 14:12
@Zerka1982 I changed the transition for the a a little bit to make it smoother
Zerka1982
@Zerka1982
Oct 02 2017 14:12
@longnt80 is it possible to use jquery to make displayed nice
like it moves from the left to the right wlosly
slowly
Anders Nicolai Magnussen
@andersnicolaimagnussen
Oct 02 2017 14:12
@nicolaimagnussen
Hi
I have an issue with a website I am trying to develop, I have some issues regarding the hamburgerbutton using bootstrap.
When I make the site smaller, and click on the hamburger button, the button opens and then instantly collapses. I know it has something to do with which bootstrap version min.js I am using. But If I change it and make it work, then the slider does not seem to work, so it seems like they are dependent on eachoter.
Anyone ? :)
Zerka1982
@Zerka1982
Oct 02 2017 14:12
you were reading my mind :9
Long Nguyen
@longnt80
Oct 02 2017 14:13
:D
Zerka1982
@Zerka1982
Oct 02 2017 14:13
@longnt80 I love you man
Ken Haduch
@khaduch
Oct 02 2017 14:31
@nicolaimagnussen - I responded in the "Help" room - if you want to post your URL we could take a look.
Joshua Frias
@Juke-Magic
Oct 02 2017 14:31
yo guys can someone help me

var api = "http://samples.openweathermap.org/data/2.5/weather?lat="+lat+"&lon="+long+"&appid=b1b15e88fa797225412429c1c50c122a1";

$.getJSON(api, function(data) {

var windspeed = data.speed;
var temp = data.main.temp;
var cityname = data.name;

$("#wind").html(api);
});

wind wont show

Tom
@moT01
Oct 02 2017 14:39
@Juke-Magic got a pen? you getting any errors?
Ken Haduch
@khaduch
Oct 02 2017 14:45
@Juke-Magic - if you are just passing the api variable as a value, it probably won't display. If you are correctly accessing the windspeed, try $("#wind").html(windspeed); You should try using console.log(windspeed); and see what you're getting for a value, or check the return with devtools and see if you're getting the proper response from the site.
@moT01 - hey Tom - did you get anywhere with your game problem that you posted last night? I fell asleep and lost track of things after that...
Ken Haduch
@khaduch
Oct 02 2017 14:52
@Juke-Magic - also you need to have valid values for lat and long, and you didn't show that code - as @moT01 said - posting a URL will make it easier to help you.
Tom
@moT01
Oct 02 2017 14:52
@khaduch no, i didn't get anywhere with that specific issue
Ken Haduch
@khaduch
Oct 02 2017 15:01
@moT01 - well, I think that I just saw an instance of the behavior that I think you're trying to sort out? When the food item appears on the snake's body? Or was it just the head? Since the snake always seems to return to just a single square, is it only the position of the head that you are having a problem with? As the snake gets longer and longer it seems that you'd run out of places to put the food...
Tom
@moT01
Oct 02 2017 15:04
it's only the head, the food gets generated on the head (also the exact spot the just was) - then the rest of the body will go over the food
Ken Haduch
@khaduch
Oct 02 2017 15:04
okay, it's hard to pick that up at that speed... :)
Tom
@moT01
Oct 02 2017 15:04
it used to get put on the body some times, but i added something to stop that, and it worked for everything but this head issue
yea, on my last attept to see what was up, i added debugger; in the draw function, and ...
im not sure - the value seemed wrong of the xy coordinates
so, my initial thought was that my array holding the location of the snake (xyHistory) wasn't getting updated in the right order or something - the head location didn't get added to the array before the food location got created
that's probly still what is happening - i can only assume
Tom
@moT01
Oct 02 2017 15:11
okay, so here's what happened on the debugger - i had to go do it again
i create a snake object @ 0,0
then snake.update runs
and the location changes to 100, 0
100 in my case cause that's the size im using, my codepen might be 200
then i run snake.show - which draws the rectangle, but it shows up at 0,0
the first frame
Ken Haduch
@khaduch
Oct 02 2017 15:14
@moT01 - if you are just concerned about the position of the head, why is the history important? Wouldn't it be enough to just get the current position of the snake's head?
Tom
@moT01
Oct 02 2017 15:14
i need the history to shows other rect's
so after we eat 1 food, i need to draw two rects
(the snake grows)
lemme try and think that through - it's early still - i didn't think i would be thinking this hard yet
Ken Haduch
@khaduch
Oct 02 2017 15:17
But if the only place you are concerned with placing a new food item is where the snake's head was (or is) wouldn't it be just good enough to check the head position? Or maybe add an additional check for the head position and also check the body history if you want to not place the food on the body, either?
Tom
@moT01
Oct 02 2017 15:18
yea, we don't want the food on the body either
okay, i might be on to something here
Tom
@moT01
Oct 02 2017 15:28
oh, i dunno
it has to do with the order i do things i think, the head value is missing from that array or something, but i can't quite put my finger on how to fix it
Amit Patel
@AmitP88
Oct 02 2017 15:30

hey guys, I'm redoing my project and I'm already running into problems. when I try to run my code, it says that I have an infinite loop. How do I fix my for loop to resolve this?

https://codepen.io/AmitP88/pen/pWyaNY?editors=0010

Ken Haduch
@khaduch
Oct 02 2017 15:30
@moT01 - okay... one other thing that I wonder about is how you are using this: while (xyHistory.toString().indexOf(this.rand.toString()) >= 0) - since you are converting your history into one long string, could there be a place where you have a comparison of your rand value that matches across a pair of X and Y coordinates?
@AmitP88 - it looks like you are modifying grid while also trying to use the .length of either grid or grid[i] in your loop - that's probably what it's detecting
Tom
@moT01
Oct 02 2017 15:35
if it matches - it would then go find a new rand value
that's what i added to keep the food from showing up on the snake, and it works for all but the head
or maybe i don't understand what you're getting at
that test is the way it is (meaning .toString()) cause it's the only way i could get it working - i got help there too. I initially tried to just compare the array - appearantly you can't do that
Ken Haduch
@khaduch
Oct 02 2017 15:40
@moT01 - I was just wondering if you have some data like this in your history: [[x1, y1],[ x2, y2],[ x3, y3]], and that gets converted to the string x1,y1,x2,y2,x3,y3. If the coordinates that are being generated match a pair of yn,xninstead of xn,yn is what I'm asking about - like y1,x2 for example? There is no way to match at a point between xy pairs. I'm not sure if that could be a problem here, but it seems like it's not what you would want if it happened?
Tom
@moT01
Oct 02 2017 15:41
ohh
very interesting thought
but if that were the case wouldn't it then also show up on the body some times
Ken Haduch
@khaduch
Oct 02 2017 15:44
@moT01 - it could, but I thought that might have been what I saw in some cases, although I couldn't tell if it just re-appeared at the head location or if it was on the body?
Tom
@moT01
Oct 02 2017 15:46
i enlarged the pieces so you could come across the problem fairly quickly, when i shrink them back down - it's more clear
but takes longer
Ken Haduch
@khaduch
Oct 02 2017 15:46
@AmitP88 - did you want to .push(populator()) onto the grid, or do grid[i] = populator(); to set the grid location to the image value?
Tom
@moT01
Oct 02 2017 15:46
i think i found a fix
Zach Freitag
@Zfreitag34
Oct 02 2017 15:46

This is my first use of the indexOf( ) method which I’m trying to use to return the index of where in the string ‘Waldo’ starts.
I’ve spent hours reading a suggested resource:

https://developer.mozilla.org/enUS/docs/Web/JavaScript/Reference/Global_Objects/String/indexOf

I’m just not getting it. Any new suggestions are greatly appreciated!

Challenge: Return the index of where in the string 'Waldo' starts.

image.png
Tom
@moT01
Oct 02 2017 15:47
maybe not the way i wanted to fix it, but if it works - i think ill go with it
Zach Freitag
@Zfreitag34
Oct 02 2017 15:47
image.png
Tom
@moT01
Oct 02 2017 15:47
i added a condition to the test while (xyHistory.toString().indexOf(this.rand.toString()) >= 0 || (this.x == snake.x && this.y == snake.y))
korzo
@korzo
Oct 02 2017 15:48
@Zfreitag34 str.indexOf('Waldo')
Tom
@moT01
Oct 02 2017 15:49
the snake head location changes but doesn't get put in the array right away, so i think testing the location directly is working
Ken Haduch
@khaduch
Oct 02 2017 15:50
@moT01 - okay, that sounds good!
Tom
@moT01
Oct 02 2017 15:51
@khaduch thanks for helping, i don't think that's the best way to fix it - but i can't wrap my head around what's happening to fix it the proper way, happens too fast
CamperBot
@camperbot
Oct 02 2017 15:51
mot01 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 3330 | @khaduch |http://www.freecodecamp.com/khaduch
Zach Freitag
@Zfreitag34
Oct 02 2017 15:52
@korzo with str.indexOf('Waldo') do I use that below each statement?
image.png
korzo
@korzo
Oct 02 2017 15:53
@Zfreitag34 No, inside findWaldo function.
It will return position in string str, where Waldo starts( position of letter 'W')
Zach Freitag
@Zfreitag34
Oct 02 2017 15:56
@korzo here is where I'm at:
image.png
I'm assuming that I need to do something with all the "where's Waldo" statements:
image.png
korzo
@korzo
Oct 02 2017 15:57
you have to assign it to waldoPosition. Otherwise function returns nothing
Ken Haduch
@khaduch
Oct 02 2017 15:57
@Zfreitag34 - use waldoPosition = str.indexOf('Waldo'); or another variation - var waldoPosition = str.indexOf('Waldo'); - only one var keyword should be used, but you can assign the value on the same line where you declare the variable.
korzo
@korzo
Oct 02 2017 15:57
@Zfreitag34
Ken Haduch
@khaduch
Oct 02 2017 15:59
@moT01 - you could wait to place the food particle until after you make sure you update the snake history - but if it's working now that's a step in the right direction... :)
Zach Freitag
@Zfreitag34
Oct 02 2017 15:59
@khaduch @korzo thanks a ton!
CamperBot
@camperbot
Oct 02 2017 15:59
zfreitag34 sends brownie points to @khaduch and @korzo :sparkles: :thumbsup: :sparkles:
:cookie: 564 | @korzo |http://www.freecodecamp.com/korzo
:star2: 3331 | @khaduch |http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Oct 02 2017 16:04
@Zfreitag34 - you're welcome. One other variation that you can do with this, instead of assigning to a variable, is just to use this code return str.indexOf('Waldo'); as long as you're just returning the value, it eliminates the step of assigning it to a variable. That might be some concept that they cover in a different lesson, but good that it's working now!
Tom
@moT01
Oct 02 2017 16:10
@khaduch yea, you're right - i think that's how i should do it, but im not sure it's that easy - i think there's some other things at play, i dunno - i might give it another try after a bit
Jorge Castaño Delgado
@jhcastanod
Oct 02 2017 16:11
hey guys, have anyone from here used ´swiper slider´ library? Need a little help with it, please
Tom
@moT01
Oct 02 2017 16:12
whats the problem? @jhcastanod
Jorge Castaño Delgado
@jhcastanod
Oct 02 2017 16:14
I'm using a cms to print all the html... I was wondering if the library add all the classes the demo shows or if I have to do it manually... I'm reading about the library but there's nothing about it
´´´
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide">Slide 1</div>
<div class="swiper-slide">Slide 2</div>
<div class="swiper-slide">Slide 3</div>
<div class="swiper-slide">Slide 4</div>
<div class="swiper-slide">Slide 5</div>
<div class="swiper-slide">Slide 6</div>
<div class="swiper-slide">Slide 7</div>
<div class="swiper-slide">Slide 8</div>
<div class="swiper-slide">Slide 9</div>
<div class="swiper-slide">Slide 10</div>
</div>
´´´
@moT01 I mean all the parent classes and children ones
Tom
@moT01
Oct 02 2017 16:16
im not familiar with it
Jorge Castaño Delgado
@jhcastanod
Oct 02 2017 16:18
ok @moT01 it's a shame, thank you
CamperBot
@camperbot
Oct 02 2017 16:18
jhcastanod sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 867 | @mot01 |http://www.freecodecamp.com/mot01
Ken Haduch
@khaduch
Oct 02 2017 16:34
@jhcastanod - I'm going to guess that the classes have to be added manually (within your code) based on this documentation which says in step 3 - 'Create the HTML'. Now whether or not you can get your CMS to generate that is another question, but I don't think that the slider-swiper will add the classes for you.
Pagnito
@Pagnito
Oct 02 2017 16:46
Can i make more than one top level repo on github
Roel Verbunt
@roelver
Oct 02 2017 17:06
@Pagnito I don't understand. There should be only one top level in a hierarchy. It's lonely at the top :smile: . Why do you want multiple top level repos? What's the difference with just multiple repos?
piteto
@piteto
Oct 02 2017 17:15
@Juke-Magic The URL you are using for the weather API is incorrect. It should be
https://api.openweathermap.org/data/2.5/weather?lat="+lat+"&lon="+long+"&appid=b1b15e88fa797225412429c1c50c122a1";
Also, that API key is not yours. Use your own API Key for these projects. Every other codepen project using that key is also broken.
@Pagnito Assuming you want to do https://pagnito.github.io/repoNumber1, https://pagnito.github.io/repoNumber2, https://pagnito.github.io/repoNumber3, etc.. yes, you can do that. Add additional folders to your existing repo at: https://github.com/Pagnito/Pagnito.github.io (that's what I do here). Or, create individual repos and make a branch called gh-pages, it will be accessible at http://pagnito.github.io/yourRepoName
Pagnito
@Pagnito
Oct 02 2017 17:22
@piteto that would allow me to view each repo as a siye basically right?
Site*
piteto
@piteto
Oct 02 2017 17:22
Technically a sub-site of https://pagnito.github.io, but yes. They'd all function independently of one another
Pagnito
@Pagnito
Oct 02 2017 17:26
Ah. Ok i see thanks @piteto
CamperBot
@camperbot
Oct 02 2017 17:26
pagnito sends brownie points to @piteto :sparkles: :thumbsup: :sparkles:
api offline
Jorge Castaño Delgado
@jhcastanod
Oct 02 2017 18:44
@khaduch yeah man, I had to do it manually. thanks for the answer
CamperBot
@camperbot
Oct 02 2017 18:44
jhcastanod sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
api offline
Zerka1982
@Zerka1982
Oct 02 2017 20:04
Hello guys
In my local pc, I can get the Json Data without issue, however When I tried in the server, I received this message in the console :
[Deprecation] getCurrentPosition() and watchPosition() no longer work on insecure origins. To use this feature, you should consider switching your application to a secure origin, such as HTTPS. See https://goo.gl/rStTGz for more details.
I cannot display the data as I do from my localhost :(
korzo
@korzo
Oct 02 2017 20:06
@Zerka1982 Geolocation works only on https
Zerka1982
@Zerka1982
Oct 02 2017 20:06
Korzo see this please
$(document).ready(function() {
//confirm('Not working? Location access might be disabled.');
navigator.geolocation.getCurrentPosition(function(position) {
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
var key = "KEY_NUMBER";
var Api =
"http://api.apixu.com/v1/current.json?key=" +
key +
"&q=" +
latitude +
"," +
longitude +
"";
$.getJSON(Api, function(json) {
var icon = "https:" + json.current.condition.icon;
var weatherStatus = json.current.condition.text;
var name = json.location.name;
var region = json.location.region;
..........
Do you see anything wrong in my code ?
image.png
In my localhost, it works just fine. See the following picture.
korzo
@korzo
Oct 02 2017 20:09
@Zerka1982 I think it's ok as long as you have all closing brackets
Zerka1982
@Zerka1982
Oct 02 2017 20:09
But I don't get the data :(
korzo
@korzo
Oct 02 2017 20:10
@Zerka1982 Does your server use https?
Zerka1982
@Zerka1982
Oct 02 2017 20:11
No
It uses http
korzo
@korzo
Oct 02 2017 20:12
@Zerka1982 That's what I wrote above.
Geolocation works only on sites using https
Zerka1982
@Zerka1982
Oct 02 2017 20:12
So, no solution ?
korzo
@korzo
Oct 02 2017 20:13
@Zerka1982 If you can't use https on your server, then no unfortunately .
You can try to locate user by IP address, but it's not very precise
@Zerka1982 Or put your code on codepen or github
korzo
@korzo
Oct 02 2017 20:18
@Zerka1982 You forget to add jQuery in Setting
Zerka1982
@Zerka1982
Oct 02 2017 20:18
True
Gersho
@Gersho
Oct 02 2017 20:18
also we can see your key
Zerka1982
@Zerka1982
Oct 02 2017 20:18
Now, could you please check my code
I know you can use my key
I left it because I trusted you :)
Gersho
@Gersho
Oct 02 2017 20:19
an API with key that doesn't https, maybe you should consider using another one ?
korzo
@korzo
Oct 02 2017 20:19
@Zerka1982 It works now :+1:
Zerka1982
@Zerka1982
Oct 02 2017 20:19
Gersho
I don't get the point why I cannot see the data from the server
BTW my server uses http
@korzo What's wrong then when I try from the server
korzo
@korzo
Oct 02 2017 20:21
@Zerka1982 Your site url starts with http://
Geolocation doesn't work on sites with http:// url
Your url have to start with https://
Zerka1982
@Zerka1982
Oct 02 2017 20:21
Alright Korzo ....
Gersho
@Gersho
Oct 02 2017 20:22

BTW my server uses http

since you make use of user data, you should avoid http

Zerka1982
@Zerka1982
Oct 02 2017 20:22
That's true
Gersho
@Gersho
Oct 02 2017 20:24
Lemercier,
2017-10-02 16:22

Moderate rain 28 ˚C
Wind: 8.1 mph    Humidity: 84%    Precipitation: 0%
i have no idea what Lemercier is
Zerka1982
@Zerka1982
Oct 02 2017 20:25
@Gersho Gersho I'm using apixu api
Would you recommend something else ? for getting the data about weather
Gersho
@Gersho
Oct 02 2017 20:26
if that's for the fcc challenge use : https://fcc-weather-api.glitch.me
Zerka1982
@Zerka1982
Oct 02 2017 20:28
Can I simply replace it with the old one ?
Gersho
@Gersho
Oct 02 2017 20:29
you're probably gonna have to rework some parts, since it's unlikely that they have the exact same object structure in their answer, but apart from that it should be ok
Jorge
@OrangeKulture
Oct 02 2017 20:30
hey whats up guys
Gersho
@Gersho
Oct 02 2017 20:30
:wave:
Zerka1982
@Zerka1982
Oct 02 2017 20:31
@Gersho Could you please edit my code, I get confuse ...
Jorge
@OrangeKulture
Oct 02 2017 20:33
whats happening
Gersho
@Gersho
Oct 02 2017 20:34
you only need to change those iirc
      var icon = "https:" + json.current.condition.icon;
      var weatherStatus = json.current.condition.text;
      var name = json.location.name;
      var region = json.location.region;
      var tempC = json.current.temp_c  +' <a href="#">˚C</a>';
      var date =  json.location.localtime;
      var wind = "Wind: " + json.current.wind_mph + " mph ";
      var humidity = " Humidity: " + json.current.humidity + "% ";
      var precipitation = " Precipitation: " + json.current.precip_in + "%";
Zerka1982
@Zerka1982
Oct 02 2017 20:53
@Gersho Could you please check it https://codepen.io/Zerka1982/pen/oGGjpQ
Gersho
@Gersho
Oct 02 2017 20:57

Uncaught TypeError: Cannot read property '0' of undefined
var icon = json.weather[0].icon;

you must have some mistakes in your object manipulation

Zerka1982
@Zerka1982
Oct 02 2017 20:59
Well, do you see anything wrong here
$.getJSON(Api, function(json) {
var icon = json.weather[0].icon;
var weatherStatus = json.weather[0].description;
var date = json.weather[0].name;
var place = json.main.temp;
As the documentation says : to access the icon images : weather[0].icon
Gersho
@Gersho
Oct 02 2017 21:05
it seems there's an error in your call
{error: "Please provide longitude as lon and latitude as lat as numbers/floats."}
when trying to do console.log(json);
Zerka1982
@Zerka1982
Oct 02 2017 21:05
Does't detect the user location automatically ?
Gersho
@Gersho
Oct 02 2017 21:05
try:
var latit = pos.coords.latitude.toFixed(2);
var longit = pos.coords.longitude.toFixed(2);
piteto
@piteto
Oct 02 2017 21:07
var Api = "https://fcc-weather-api.glitch.me/api/current?lat=" + latitude + "&lon=" + longitude;
you have:
var Api = "https://fcc-weather-api.glitch.me/api/current?" + latitude + "=" + "&" + longitude + "";
Zerka1982
@Zerka1982
Oct 02 2017 21:08
Yes
now I got the data
Thank you guys, it was painful for me :(
my question now, Will I be able to use this API even my server utilises HTTP ?
piteto
@piteto
Oct 02 2017 21:10
yes
Gersho
@Gersho
Oct 02 2017 21:10
hmm, maybe, since the http part will not care if it takes http or https
Zerka1982
@Zerka1982
Oct 02 2017 21:11
Hopefully, I ll give it a try, but before that I need to gather the important information from the API first :)
piteto
@piteto
Oct 02 2017 21:11
https is secure, so everything needs to be loaded over https also. http doesn't care - wild, wild west
Zerka1982
@Zerka1982
Oct 02 2017 21:13
Does the property name holds the location name ?
Correct me if i am wrong please
Gersho
@Gersho
Oct 02 2017 21:14
json.name yes
town name
Zerka1982
@Zerka1982
Oct 02 2017 21:14
I don't see the country :D
hahah lol
Gersho
@Gersho
Oct 02 2017 21:15
have you used a json prettyfier ?
piteto
@piteto
Oct 02 2017 21:15
It's a copy of this API: https://openweathermap.org/current
Gersho
@Gersho
Oct 02 2017 21:15
json.sys.country
Zerka1982
@Zerka1982
Oct 02 2017 21:15
@Gersho I never used it before
I got it now
Gersho
@Gersho
Oct 02 2017 21:16
@Zerka1982 you should try, it allows you to see the object in a neat fashion and make accessing data a breeze
Zerka1982
@Zerka1982
Oct 02 2017 21:16
@Gersho
var country = json.sys.country;
$(".location").html( country);
@piteto I tried that api before, but I got a problem when I moved the project to the server. I couldn't see the data :/
@Gersho I got FI as location, is there a way to get Finland instead of FI :)
piteto
@piteto
Oct 02 2017 21:19
@Zerka1982 The API you are using now is that one. The page I linked to shows you all the JSON data and what everything means
If you want to see the data in a nicer format, stringify it and put it in pre tags:
$('body').append('<pre>' + JSON.stringify(json, null, 4) + '</pre>')
Gersho
@Gersho
Oct 02 2017 21:21
didn't know <pre> i usually call the request in the browser (depending on the browser it is auto pretiffied)
piteto
@piteto
Oct 02 2017 21:22
Yeah, I use chrome dev tools
Zerka1982
@Zerka1982
Oct 02 2017 21:22
Perfect
piteto
@piteto
Oct 02 2017 21:23
if it's really complicated, maybe import to excel :joy:
Zerka1982
@Zerka1982
Oct 02 2017 21:23
I'm learning lots of things from you guys
I really appreciate your help
Gersho
@Gersho
Oct 02 2017 21:24

if it's really complicated, maybe import to excel :joy:

atom has a prettifier but the first time i didn't know, and i cleaned it up myself

and those wikipedia json are kinda big
;_;
Zerka1982
@Zerka1982
Oct 02 2017 21:24
personally, I use POSTMAN :D
That's a way for me to display the data in very nice way and see where objects are and which parts are index lol
Kenneth-Brisco
@Kenneth-Brisco
Oct 02 2017 21:35
Hey is there a page for svg backgrounds for texture design
Zerka1982
@Zerka1982
Oct 02 2017 21:35
@piteto @Gersho guys, again,after moving the code to the server, I'm not able to see the data
piteto
@piteto
Oct 02 2017 21:36
@Zerka1982 what does your developer tool console say?
Zerka1982
@Zerka1982
Oct 02 2017 21:36
main.js:30 [Deprecation] getCurrentPosition() and watchPosition() no longer work on insecure origins. To use this feature, you should consider switching your application to a secure origin, such as HTTPS. See https://goo.gl/rStTGz for more details.
korzo
@korzo
Oct 02 2017 21:36
@Zerka1982 It's http:// again? :)
Zerka1982
@Zerka1982
Oct 02 2017 21:36
@korzo again :/
Gersho
@Gersho
Oct 02 2017 21:36
well i believe this error is pretty straightforward
korzo
@korzo
Oct 02 2017 21:37
@Zerka1982 I said it will not work
piteto
@piteto
Oct 02 2017 21:37
ahhhhhh, yeah, that's going to be a problem. You'll need to use a different way to get location
Zerka1982
@Zerka1982
Oct 02 2017 21:37
I hate my life :D
@korzo Yes, you told
korzo
@korzo
Oct 02 2017 21:37
@Zerka1982 That was why you moved to codepen
Zerka1982
@Zerka1982
Oct 02 2017 21:38
Chrome/Chromium and Opera browsers no longer support geolocation over HTTP
even with the IP api , the data is not acurrate
Even I'm tired, but still I am happy ;)
Gersho
@Gersho
Oct 02 2017 21:41
IP is meaningless, depending on the day i can be located in Pointe a Pitre (closest "big" town) Florida (closest network node) or paris (relevant legal entity)
Zerka1982
@Zerka1982
Oct 02 2017 21:42
yes
korzo
@korzo
Oct 02 2017 21:42
@Gersho Or even Lemercier :)
Gersho
@Gersho
Oct 02 2017 21:43
oh yeah i had that earlier,
what is this supposed to be ? Lemercier is a french family name too so i'm not getting anything relevant in google
piteto
@piteto
Oct 02 2017 21:46
Lemercier is in Guadalupe, by Chez Mario on Route de Bellevue :)
Zerka1982
@Zerka1982
Oct 02 2017 21:46
lol
vous parlez francais ;)
Gersho
@Gersho
Oct 02 2017 21:48

Lemercier is in Guadalupe, by Chez Mario on Route de Bellevue :)

that would mean it's a person or a building

piteto
@piteto
Oct 02 2017 21:48
That's where the map marker is on weather.com when looking up weather for lemercier
Gersho
@Gersho
Oct 02 2017 21:48
oh, i'll try that
Zerka1982
@Zerka1982
Oct 02 2017 21:49
So guys, What is the most used API for weather ?
from your point of view I mean ...
piteto
@piteto
Oct 02 2017 21:50
you don't need a different Weather API - you need a different location API to get your app working over HTTP
Gersho
@Gersho
Oct 02 2017 21:50
depends where you live, for exemple where i live the only relevant weather data we want is http://www.sxmcyclone.com/ but most of the world has no use for it
Zerka1982
@Zerka1982
Oct 02 2017 21:51
@piteto my question is a general one :)
I do understand now whats wrong with the server I am using ...
in the search engine, the first answer is about apixu
piteto
@piteto
Oct 02 2017 21:53
looking at the free code camp forums, seems people used Open Weather Map and Weather Underground a lot
Gersho
@Gersho
Oct 02 2017 21:53
@piteto ok so apparently Lemercier seems to be a district name in the town of Le Moule, it's actually a closer localisation to where i live than when i let weather.com find where i live
it's a few blocks away from me
piteto
@piteto
Oct 02 2017 21:54
Funny when code teaches us something about our home
Gersho
@Gersho
Oct 02 2017 21:54
i've been living here for 7 years ...
Zerka1982
@Zerka1982
Oct 02 2017 21:55
Of course, We don't know everything about the place where we live
:D
Don't be surprised if they mention something about Aliens under the ground
Gersho
@Gersho
Oct 02 2017 21:57
i'm hoping for a stargate
alpox
@alpox
Oct 02 2017 21:59
@Gersho they really could use some frontend designer for that weather website though o.O gosh is that terrible to look at on mobile
Gersho
@Gersho
Oct 02 2017 22:03
@alpox haha yeah, but you don't really mind when you need to know if a tornado is about to murder you :P
alpox
@alpox
Oct 02 2017 22:09
@Gersho true, true :D
Zerka1982
@Zerka1982
Oct 02 2017 22:11
@Gersho hahah I found an alert about Tornado in one API :D
Imagine ?????
Tom
@moT01
Oct 02 2017 22:14
comes in handy @Zerka1982
Zerka1982
@Zerka1982
Oct 02 2017 22:50
Guys
how can I access to feelslike_c object
"current": {
"last_updated_epoch": 1506983408,
"last_updated": "2017-10-03 01:30",
"temp_c": 8,
"temp_f": 46.4,
"is_day": 0,
"condition": {
"text": "Partly cloudy",
"icon": "//cdn.apixu.com/weather/64x64/night/116.png",
"code": 1003
},
"wind_mph": 19.2,
"wind_kph": 31,
"wind_degree": 150,
"wind_dir": "SSE",
"pressure_mb": 1013,
"pressure_in": 30.4,
"precip_mm": 0,
"precip_in": 0,
"humidity": 76,
"cloud": 75,
"feelslike_c": 3.9,
"feelslike_f": 39,
"vis_km": 10,
"vis_miles": 6
}
is it current.feelslike_c ?
piteto
@piteto
Oct 02 2017 22:52
@Zerka1982 Open your developer tools console, right-click it, and select "copy path"
Zerka1982
@Zerka1982
Oct 02 2017 22:55
Oh I found the problem
I forget a dot, because I'm using a class name inside Div
:D
@piteto Good idea to find the get the path
Cale Switzer
@Tennyx
Oct 02 2017 23:17
how does one view the current html you are looking at? I am trying to see my DOM created by iquery scripting, but in Chrome, right click "view page source" just shows me the base template html before any of the jquery modifies it
Zerka1982
@Zerka1982
Oct 02 2017 23:18
Right Click - Inspect the page
Cale Switzer
@Tennyx
Oct 02 2017 23:19
oh wow
i do that all the time and go right to console
thank you @Zerka1982 !
CamperBot
@camperbot
Oct 02 2017 23:20
tennyx sends brownie points to @zerka1982 :sparkles: :thumbsup: :sparkles:
:cookie: 266 | @zerka1982 |http://www.freecodecamp.com/zerka1982
Zerka1982
@Zerka1982
Oct 02 2017 23:20
you have to go to elements :)
@Tennyx you are welcome!
Zerka1982
@Zerka1982
Oct 02 2017 23:40
back
Anybody here :)
Check this out
Guys, when I click on Overview, I wish to keep it displayed
Zerka1982
@Zerka1982
Oct 02 2017 23:48
any comment ?