These are chat archives for FreeCodeCamp/HelpFrontEnd

16th
Feb 2016
tommy
@tommygebru
Feb 16 2016 00:00
@KevinStaufy whats the webpage?
LoLRabbit
@KevinStaufy
Feb 16 2016 00:01
@tommygebru im trying to do http://www.freecodecamp.com/challenges/build-a-tribute-page but im not really understanding it to be honest
p0seur
@p0seur
Feb 16 2016 00:02
@KevinStaufy you can look at the example and build something similar
tommy
@tommygebru
Feb 16 2016 00:02
@KevinStaufy this is the associated link an example project the title is Dr.Norman.....
@KevinStaufy http://codepen.io/FreeCodeCamp/full/wMQrXV the project is "attributed" to him like a biography or a tombstone
LoLRabbit
@KevinStaufy
Feb 16 2016 00:03
so i just build a tribute page to w/e?
p0seur
@p0seur
Feb 16 2016 00:04
yep
LoLRabbit
@KevinStaufy
Feb 16 2016 00:04
well then
tommy
@tommygebru
Feb 16 2016 00:04
@KevinStaufy whats w/e ?
LoLRabbit
@KevinStaufy
Feb 16 2016 00:04
this is gonna be "fun"
and @tommygebru it means what ever
tommy
@tommygebru
Feb 16 2016 00:04
@KevinStaufy haha of course it is
LoLRabbit
@KevinStaufy
Feb 16 2016 00:04
:D
gosh i cant think of what to build a tribute page to lol
p0seur
@p0seur
Feb 16 2016 00:05
@KevinStaufy it's not that big a deal.. takes about 15/30 minutes
i spent more time copypasting dates then actually building it
Casey Heath
@ExhibitArts
Feb 16 2016 00:06
@tommygebru I don't understand why this site http://blog.teamtreehouse.com/how-to-make-a-favicon says that it can be difficult to make favicons. The first time I made a favicon it wasn't difficult. If anything the solution that they give you makes it difficult. If you want I can make you the favicon and send it to your email. Just pm me and I'll send you my email so you can send me the image you want as a favicon.
tommy
@tommygebru
Feb 16 2016 00:07
@KevinStaufy making a new logo it is currently to thin to be visible
Screen Shot 2016-02-15 at 4.06.53 PM.png
blob
Casey Heath
@ExhibitArts
Feb 16 2016 00:13
@tommygebru I make logos for $3. Check out my latest logo design. - https://www.youtube.com/watch?v=k3THvhg9jBo If you need a good logo I got you.
tommy
@tommygebru
Feb 16 2016 00:14
@ExhibitArts im also trying my hand at graphic design yesterday i started with this illustration http://codepen.io/gebrutommy/full/EPyorV/
Casey Heath
@ExhibitArts
Feb 16 2016 00:16
@tommygebru Wow. That looks great. What do you think of this one that I made. - https://gyazo.com/8b5bb9263b9f48cb1267ad9f4669f276
tommy
@tommygebru
Feb 16 2016 00:19
@KevinStaufy nice video and illustration the 4 is harder to make out but still great and sempa is really impressive :smile:
@KevinStaufy what do you think about having a HelpDesign channel as an extension of HelpFrontEnd chatroom?
Casey Heath
@ExhibitArts
Feb 16 2016 00:23

@tommygebru

@KevinStaufy what do you think about having a HelpDesign channel as an extension of HelpFrontEnd chatroom?

@tommygebru Are you talking to me?
tommy
@tommygebru
Feb 16 2016 00:24
@ExhibitArts haha sorry about that

@ExhibitArts

@KevinStaufy nice video and illustration the 4 is harder to make out but still great and sempa is really impressive :smile:

@KevinStaufy what do you think about having a HelpDesign channel as an extension of HelpFrontEnd chatroom?
LoLRabbit
@KevinStaufy
Feb 16 2016 00:25
@tommygebru wait what i just got back?
tommy
@tommygebru
Feb 16 2016 00:25
@KevinStaufy sorry i messed up the names... hows the tribute going [who got murdered]
LoLRabbit
@KevinStaufy
Feb 16 2016 00:26
idk im really confused to be honest its asking me to do stuff that im not really ready to do yet i dont think
@tommygebru ^^ thats ment for you
tommy
@tommygebru
Feb 16 2016 00:26
@KevinStaufy haha what's the problem
LoLRabbit
@KevinStaufy
Feb 16 2016 00:27
@tommygebru just everything its asking me to make the tribute but like i know somewhat how to code but i dont think im ready for the tribute i only started the course like 2 days ago and im just so lost at the moment because it just dropped this in my lap with no guide exceept that one example and im just confused :(
Raiden357
@raiden357
Feb 16 2016 00:28
@KevinStaufy ur welcome
LoLRabbit
@KevinStaufy
Feb 16 2016 00:29
@raiden357 yea your http://www.w3schools.com/ help a bit
im just so confused
tommy
@tommygebru
Feb 16 2016 00:31
@KevinStaufy OOHHH i see they added new challenges it wasnt there a few days ago...
LoLRabbit
@KevinStaufy
Feb 16 2016 00:31
@tommygebru what do you mean?
Raiden357
@raiden357
Feb 16 2016 00:31
@ExhibitArts yea i know w3c schools is not affiliated with w3c. w3c is a very good website, the most popular in fact
w3c schools i mean
tommy
@tommygebru
Feb 16 2016 00:32
@KevinStaufy I mean the Basic Projects is new !
LoLRabbit
@KevinStaufy
Feb 16 2016 00:32
ahhhh but im just like so stuck i dont even know where to start this tribute thing
tommy
@tommygebru
Feb 16 2016 00:32
@KevinStaufy I recommend going to codecademy its free and it'll probably help you understand html and css more !
LoLRabbit
@KevinStaufy
Feb 16 2016 00:33
alright i think i might do that to be honest
Raiden357
@raiden357
Feb 16 2016 00:33
@KevinStaufy same here
LoLRabbit
@KevinStaufy
Feb 16 2016 00:33
@raiden357 @tommygebru so you guys think i should do the run thoughs of the other two before trying my tributes?
Raiden357
@raiden357
Feb 16 2016 00:34
i'm sorry what do you mean by run thoughs?
LoLRabbit
@KevinStaufy
Feb 16 2016 00:34
@raiden357 like do codeacademy before i try the tribute
Raiden357
@raiden357
Feb 16 2016 00:34
nah, stay here
code academy is not worth it
LoLRabbit
@KevinStaufy
Feb 16 2016 00:35
hmm im just so confused on the tribute lol
Raiden357
@raiden357
Feb 16 2016 00:35
i left that and came here
LoLRabbit
@KevinStaufy
Feb 16 2016 00:35
how come?
Raiden357
@raiden357
Feb 16 2016 00:35
didn't keep my attention
not like this place
LoLRabbit
@KevinStaufy
Feb 16 2016 00:35
what do you mean? is it beacsue this one has a chat?
Raiden357
@raiden357
Feb 16 2016 00:36
chat is part of the reason. the other reason is this website keeps me engaged, focused. you'll know you found the right place when you can't wait to go back to it each day just to progress
LoLRabbit
@KevinStaufy
Feb 16 2016 00:37
thats how i was with this website with the lessons
i enjoyed them
but the tribute like i have literally NO clue what to do
tommy
@tommygebru
Feb 16 2016 00:37
@KevinStaufy you can try on your own but if you believe you want to learn more you should try https://www.codecademy.com/learn/web
or maybe try html & css on http://www.w3schools.com/ because they have examples of what the code does and they have tiny quizzes
Raiden357
@raiden357
Feb 16 2016 00:37
the fact that your starting your work on projects now shows your commitment
LoLRabbit
@KevinStaufy
Feb 16 2016 00:37
@tommygebru your talking about doing the html and css course on codeacadamy
@raiden357 i really want to start it but i dont know how to do it
Raiden357
@raiden357
Feb 16 2016 00:38
look at my page as a starter
LoLRabbit
@KevinStaufy
Feb 16 2016 00:38
hmmm alright
Raiden357
@raiden357
Feb 16 2016 00:38
i sent you a pm
LoLRabbit
@KevinStaufy
Feb 16 2016 00:38
got it
tommy
@tommygebru
Feb 16 2016 00:39
@KevinStaufy well as i understand it if you want to work elsewhere as practice ... also @raiden357 is right the chatroom is better here than anywhere else because the response time is instant :smile: elsewhere it can be hours or days :-1:
LoLRabbit
@KevinStaufy
Feb 16 2016 00:39
thats true
Michael Aubrey
@mca62511
Feb 16 2016 00:39
@KevinStaufy You don't have to make an exact copy of the tribute page, you just have to make something functionally similar.
Raiden357
@raiden357
Feb 16 2016 00:39
btw i'm new to all this. just started 5 days ago. never programmed before in my life. my tribute page is proof
LoLRabbit
@KevinStaufy
Feb 16 2016 00:40
same here @raiden357 i started 2 days ago
Michael Aubrey
@mca62511
Feb 16 2016 00:40
By the time you do the tribute page, you've gone over enough through FreeCodeCamp to create something similar at the very least.
Read-Search-Ask when you don't know how to do something
tommy
@tommygebru
Feb 16 2016 00:40
@mca62511 :+1:
LoLRabbit
@KevinStaufy
Feb 16 2016 00:41
alright ill try to throw something together after his League of legends game is over
Michael Aubrey
@mca62511
Feb 16 2016 00:41
awesome
LoLRabbit
@KevinStaufy
Feb 16 2016 00:41
my friend and i have a 15 minute que so ill try to throw some thing together
am i aloud to do it on anyone i want?
Michael Aubrey
@mca62511
Feb 16 2016 00:41
I'd encourage you to look up bootstrap grids and read up on them a bit, as that'll help out a lot.
Absolutely, the point is the html/css rather than the content.
LoLRabbit
@KevinStaufy
Feb 16 2016 00:42
ill probably do it on bill gates then
Michael Aubrey
@mca62511
Feb 16 2016 00:42
That's cool
I did mine on Hayao Miyazaki
LoLRabbit
@KevinStaufy
Feb 16 2016 00:43
link to yours?
tommy
@tommygebru
Feb 16 2016 00:43
@KevinStaufy don't he's still alive
LoLRabbit
@KevinStaufy
Feb 16 2016 00:43
i should do it someone whose passed?
tommy
@tommygebru
Feb 16 2016 00:43
no im joking
Michael Aubrey
@mca62511
Feb 16 2016 00:43
Oh, so is Miyazaki. I didn't realize--ahh
LoLRabbit
@KevinStaufy
Feb 16 2016 00:43
lol i was gonna say billy mays next LOL
The timeline is highly incomplete
LoLRabbit
@KevinStaufy
Feb 16 2016 00:44
BILLY MAYS HERE WITH OXYCLEAN
interesteing
tommy
@tommygebru
Feb 16 2016 00:44
@KevinStaufy his page going to be white on white on white
LoLRabbit
@KevinStaufy
Feb 16 2016 00:44
@tommygebru LOL
Stefan Jeremic
@ByteRogue
Feb 16 2016 00:45
Hi people. I have question for Random Quote Machine. Which link shoud I use to get JSON file? Also some explanation about tweeting would be great
LoLRabbit
@KevinStaufy
Feb 16 2016 00:47
is there anything on codepen that i should auto add in with the cogs? for CSS or JS
Michael Aubrey
@mca62511
Feb 16 2016 00:47
just bootstrap
tommy
@tommygebru
Feb 16 2016 00:48
If anyone is interested there is a HelpDesign room for feedback on Design :smile:
https://gitter.im/ExhibitArts/HelpDesign?utm_source=share-link&utm_medium=link&utm_campaign=share-link
LoLRabbit
@KevinStaufy
Feb 16 2016 00:48
Whoa
Michael Aubrey
@mca62511
Feb 16 2016 00:48
@KevinStaufy Just bootstrap really. You might add jQuery if you want to get all fancy, but it isn't necessary for the Tribute project
LoLRabbit
@KevinStaufy
Feb 16 2016 00:48
when did they add new room?????
@mca62511 alright ill add bootstrap thank you :)
CamperBot
@camperbot
Feb 16 2016 00:48
kevinstaufy sends brownie points to @mca62511 :sparkles: :thumbsup: :sparkles:
:star: 268 | @mca62511 | http://www.freecodecamp.com/mca62511
tommy
@tommygebru
Feb 16 2016 00:49
@KevinStaufy officially an unofficial room, feel free to join :smile_cat:
LoLRabbit
@KevinStaufy
Feb 16 2016 00:50
how often are you in the chat tommy and mca you guys are really helpfull haha
Raiden357
@raiden357
Feb 16 2016 00:50
@KevinStaufy i do agree with you. i'm not ready for this project and no amount of going over previous exercises will change that
they need to better explain ni the exercises extactly what we're doing
LoLRabbit
@KevinStaufy
Feb 16 2016 00:52
@raiden357 yea its like so fast
tommy
@tommygebru
Feb 16 2016 00:52
you know what Im dropping everything ... lets do this ... i will help you guys with your codepens..... which is the enviornment we build our projects on :smile:
http://codepen.io/
LoLRabbit
@KevinStaufy
Feb 16 2016 00:52
what do you mean?
tommy
@tommygebru
Feb 16 2016 00:53
@KevinStaufy lately i've been trying to design more so i've been away for a few days...
Raiden357
@raiden357
Feb 16 2016 00:53
@tommygebru i appreciate it
LoLRabbit
@KevinStaufy
Feb 16 2016 00:53
@tommygebru me to
tommy
@tommygebru
Feb 16 2016 00:54
@KevinStaufy @raiden357 create an account with codepen :+1:
LoLRabbit
@KevinStaufy
Feb 16 2016 00:54
i got one already
tommy
@tommygebru
Feb 16 2016 00:55
cool @KevinStaufy im going to make my tribute page too.. because i have passed the section... im not sure if I have to complete new challenges that pop up :smile:
LoLRabbit
@KevinStaufy
Feb 16 2016 00:55
@tommygebru ahh alright i mean
i get the jist of it
you helped alot
just at first i was kinda uhhh
LoLRabbit
@KevinStaufy
Feb 16 2016 00:56
@tommygebru keep doing your desing stuff
@tommygebru after this game is over ill work on my page a little bit and send it to you
tommy
@tommygebru
Feb 16 2016 00:57
@KevinStaufy that is a day to day expression, you will never forget it
LoLRabbit
@KevinStaufy
Feb 16 2016 00:57
haha
tommy
@tommygebru
Feb 16 2016 00:57
@raiden357 nice choice do you have any questions?
@KevinStaufy I will ... so many tabs ...
LoLRabbit
@KevinStaufy
Feb 16 2016 00:59
xD
Raiden357
@raiden357
Feb 16 2016 00:59
nah I think all i have to do is meet the bare requirements for the user stories.
thanks for the help though
Michael Aubrey
@mca62511
Feb 16 2016 01:00
Well, it doesn't hurt to try and replicate the layout some too.
I'd encourage you to at least try to use bootstrap's grid system, as that'll be very useful for you in the future.
Raiden357
@raiden357
Feb 16 2016 01:01
nah not ready for that
tommy
@tommygebru
Feb 16 2016 01:02
@raiden357 I'm looking at the challenge page and they encourage you to "give it a personal style" ... this means familarize yourself with basic css ... so that you understand it better... :smile:
@mca62511 bootstrap looks easy but is annoying to customize I decided to commit to css ... it is hard but it is very rewarding to look at my code and understand my mistakes :smile:
@mca62511 this is my current webpage, im not done yet :smile: I began focus on the header and footer, now im filling it with other pages
http://codepen.io/gebrutommy/full/WrLmOr#
Michael Aubrey
@mca62511
Feb 16 2016 01:07
Wow! That's gorgeous and clean.
http://codepen.io/mca62511/full/KVEdzK
This is the one I'm working on. I don't like the projects section.
tommy
@tommygebru
Feb 16 2016 01:08
@mca62511 thanks I was inspired by others ... one codecamper using bootstrap and another professional designer
CamperBot
@camperbot
Feb 16 2016 01:08
tommygebru sends brownie points to @mca62511 :sparkles: :thumbsup: :sparkles:
:star: 269 | @mca62511 | http://www.freecodecamp.com/mca62511
tommy
@tommygebru
Feb 16 2016 01:09
@mca62511 :+1: i was going to tell you to change it to full :smile:
@tommygebru same here I'm going to fill it with links of my codepens :smile:
LoLRabbit
@KevinStaufy
Feb 16 2016 01:12
time to start my tribute boys
tommy
@tommygebru
Feb 16 2016 01:12
@mca62511 very clean landing page ! very nice :smile:
Michael Aubrey
@mca62511
Feb 16 2016 01:14
@tommygebru Thanks :smile:
CamperBot
@camperbot
Feb 16 2016 01:14
mca62511 sends brownie points to @tommygebru :sparkles: :thumbsup: :sparkles:
:star: 622 | @tommygebru | http://www.freecodecamp.com/tommygebru
Alex Evans
@alex-evans
Feb 16 2016 01:15

Hi, working on the "No repeats please" challenge and the hint mentions to start the recursive call with the following:

perm(0, nothing used yet, empty new string (or array the same size as str);

I'm not following that last piece, the array the same size as str, why would it be an empty new string or an array the same size as str? Anyone able to clear that up for me? Thanks.

LoLRabbit
@KevinStaufy
Feb 16 2016 01:18
hey @tommygebru whats the command to make an img smaller
is it
.smaller-image {???????} ?
@mca62511 ^^^^
Michael Aubrey
@mca62511
Feb 16 2016 01:19
the actual name of the class doesn't matter
you can call it .thing-a-ma-bob if you want
LoLRabbit
@KevinStaufy
Feb 16 2016 01:20
how do i tell it to be certian pixel wide?
tommy
@tommygebru
Feb 16 2016 01:20
@KevinStaufy there is no such thing as a command.... except keyboard keys
Michael Aubrey
@mca62511
Feb 16 2016 01:20
.thing-a-ma-bob {
    width: 100px;
}
something like that could work
LoLRabbit
@KevinStaufy
Feb 16 2016 01:21
@mca62511 ahh yes the thingamaboob is what i was lookign for
tommy
@tommygebru
Feb 16 2016 01:21
@KevinStaufy you would use the width property and follow it with a value
like @mca62511
LoLRabbit
@KevinStaufy
Feb 16 2016 01:21
ahh alrighty
@tommygebru @mca62511 thank you
CamperBot
@camperbot
Feb 16 2016 01:21
kevinstaufy sends brownie points to @tommygebru and @mca62511 :sparkles: :thumbsup: :sparkles:
:warning: kevinstaufy already gave mca62511 points
:star: 623 | @tommygebru | http://www.freecodecamp.com/tommygebru
Michael Aubrey
@mca62511
Feb 16 2016 01:22
then for the image you'd do
<img class="thing-a-ma-bob" src="http://example.com/image.png" alt="A smiley narhwal">
LoLRabbit
@KevinStaufy
Feb 16 2016 01:22
what the command to center an img?
the code*
not command
sorry haha
Michael Aubrey
@mca62511
Feb 16 2016 01:23
But you should learn how to look it up. Google search something like "css image size" or "css center image" and see what you find
look at the links from w3.org, w3schools.com, and communities like stackoverflow.com
tommy
@tommygebru
Feb 16 2016 01:24
now that I think about it a tribute page is rather a grim way to begin your FCC Journey
LoLRabbit
@KevinStaufy
Feb 16 2016 01:24
@tommygebru what do you mean?
tommy
@tommygebru
Feb 16 2016 01:25
@KevinStaufy haha peoples first project ever is an obituary
LoLRabbit
@KevinStaufy
Feb 16 2016 01:25
@tommygebru true
kk cant figure it out how to center this image lmao
LoLRabbit
@KevinStaufy
Feb 16 2016 01:31
this is my code atm
<style>
  h1 { font-size: 46px;
  }

  .smaller-image{
  width: 300px;
  }

  .center-image{

  }

</style>
<h1 class="text-center"> Bill Gates </h1>
<img class="smaller-image center-image" src="https://upload.wikimedia.org/wikipedia/commons/1/19/Bill_Gates_June_2015.jpg"></img>
how do i center the image
tommy
@tommygebru
Feb 16 2016 01:34
@KevinStaufy if the class is still referencing the same image in your html you don't have to create a new class name, for centering alone :smile:
LoLRabbit
@KevinStaufy
Feb 16 2016 01:34
.>
     >.>
how do i center it though i tried googling it couldnt find it
Raiden357
@raiden357
Feb 16 2016 01:35
yea fcc is definitely not for beginners
tommy
@tommygebru
Feb 16 2016 01:35
check if this works
.smaller-image{text-align:center;}
LoLRabbit
@KevinStaufy
Feb 16 2016 01:35
@raiden357 why do you say that?
@tommygebru it didnt :L
tommy
@tommygebru
Feb 16 2016 01:35
@raiden357 I believe it began with javascript in mind and maybe added html and css later on
ok @KevinStaufy try :smile:
align:middle;
LoLRabbit
@KevinStaufy
Feb 16 2016 01:37
@tommygebru nothin :(
Ziad Sabra
@zeiadwsabra
Feb 16 2016 01:38
hi everyone I am doing the Tribute page Could you tell me what you think and what I should improve: http://codepen.io/zamyka/pen/adMqgZ
Michael Aubrey
@mca62511
Feb 16 2016 01:38
I think that it doesn't do anything because text-align: center and the like align the stuff inside that element... but an img tag is the element, there's nothing inside
tommy
@tommygebru
Feb 16 2016 01:38
ok @KevinStaufy give it
margin:0 auto;
Michael Aubrey
@mca62511
Feb 16 2016 01:38
so maybe put the img inside a div or.... yeah. Actually @tommygebru has the right of it. That's much more elegant.
tommy
@tommygebru
Feb 16 2016 01:38
@zeiadwsabra haha was going to do Snape :+1:
LoLRabbit
@KevinStaufy
Feb 16 2016 01:38
im just gonna run through codeacademys HTML and CSS course and @tommygebru still didnt do anything
hopefully i grasp html better through two courses
tommy
@tommygebru
Feb 16 2016 01:39
@KevinStaufy ok cool can you post your link to the project :smile:
is that it?
Ziad Sabra
@zeiadwsabra
Feb 16 2016 01:40
@tommygebru yeah I like snake but I always felt scared of him
Michael Aubrey
@mca62511
Feb 16 2016 01:40
@zeiadwsabra Nice! Very clean and responsive. And I love that you did a fictional character.
Ziad Sabra
@zeiadwsabra
Feb 16 2016 01:40
@mca62511 thanks
CamperBot
@camperbot
Feb 16 2016 01:40
zeiadwsabra sends brownie points to @mca62511 :sparkles: :thumbsup: :sparkles:
:star: 272 | @mca62511 | http://www.freecodecamp.com/mca62511
tommy
@tommygebru
Feb 16 2016 01:40
@zeiadwsabra love to hate that guy :smile:
Michael Aubrey
@mca62511
Feb 16 2016 01:41
@KevinStaufy Okay, first. In CodePen put all your css stuff in the css section, not inside <style> tags. Inside a real html document, you'd do that, but in this editor its divided up.
LoLRabbit
@KevinStaufy
Feb 16 2016 01:41
@mca62511 wow i feel not so smart i forgot that was even there
tommy
@tommygebru
Feb 16 2016 01:42

@zeiadwsabra weird my blockquote doesnt have that vertical line for quotes

example quote

Ziad Sabra
@zeiadwsabra
Feb 16 2016 01:44
@tommygebru yeah weird I thought that was the default
do you have a white background
Collin
@collinferry
Feb 16 2016 01:46
I need some design guidance to help polish this LOTR weather app. First order of business to to center my various divs relative to the background image. All the stack-overflow stuff I've found doesn't seem to work for me. Anyone have a silver bullet for alignment/margin percentages/etc?
http://codepen.io/collinferry/pen/obmKgm/
tommy
@tommygebru
Feb 16 2016 01:46
yes @zeiadwsabra this is my portfolio project ..
http://codepen.io/gebrutommy/pen/WrLmOr?editors=1000
my quote is "you should learn to code"
Michael Aubrey
@mca62511
Feb 16 2016 01:47

@KevinStaufy and what I was going to say before actually does work.

The "text-center" class and using class="text-align: center;" centers things INSIDE an element. There's nothing inside an img element, the img is the element itself. So you'll want to put the image inside a div, add "text-center" to the div, and THAT will center the image.

tommy
@tommygebru
Feb 16 2016 01:47
@collinferry check out the HelpDesign room https://gitter.im/ExhibitArts/HelpDesign
mjqblade
@mjqblade
Feb 16 2016 01:47
hey
tommy
@tommygebru
Feb 16 2016 01:47
welcome @mjqblade
mjqblade
@mjqblade
Feb 16 2016 01:48
<style>
  body {
    background-color: #000000;
  }
</style>

help pzl

CamperBot
@camperbot
Feb 16 2016 01:48
no wiki entry for: pzl
mjqblade
@mjqblade
Feb 16 2016 01:48
PLZ

plz

ygfyw
Michael Aubrey
@mca62511
Feb 16 2016 01:48
The " margin: 0 auto;" method doesn't work for img elements, it works for a div element.
LoLRabbit
@KevinStaufy
Feb 16 2016 01:49
so id have to make a div for it
and then class the margin into the div?
mjqblade
@mjqblade
Feb 16 2016 01:49
<style>
  body {
    background-color: #000000;
  }
</style>

plz help number 60

Michael Aubrey
@mca62511
Feb 16 2016 01:49
No, sorry for confusing you.
LoLRabbit
@KevinStaufy
Feb 16 2016 01:50
@mca62511 its fine
tommy
@tommygebru
Feb 16 2016 01:50
@mjqblade we don't use numbers :smile: use Title & Link
Michael Aubrey
@mca62511
Feb 16 2016 01:50
@KevinStaufy here, I forked it and played around a bit to explain http://codepen.io/mca62511/pen/qbvYBy
LoLRabbit
@KevinStaufy
Feb 16 2016 01:51
@mca62511 what do you mean
Michael Aubrey
@mca62511
Feb 16 2016 01:51
@KevinStaufy To "fork" is to make a copy of something that you can edit, that won't change the original. I forked your project so I could change it and explain what I mean.
LoLRabbit
@KevinStaufy
Feb 16 2016 01:51
@mca62511 ahhh i see
Michael Aubrey
@mca62511
Feb 16 2016 01:52

@KevinStaufy At the top you can see what I mean about centering the things inside the div instead of adding "text-center" to the img itself.

Below that, you can see what I was saying about using margin: 0 auto; to align a div. I made a red div box as an example.

LoLRabbit
@KevinStaufy
Feb 16 2016 01:53
you linked me one with nothing at all changed in it?
Adam Yuhasz
@jayuhasz
Feb 16 2016 02:01
real talk. anyone solve the clock with an accurate timer? I found the setInterval() countdowns were getting out of sync pretty quickly.
I thought about getting a new Date() stamp off a setInterval() pulse to correct it, but I'm a bit lost on how to code this.
Sebastian
@interstellaridea
Feb 16 2016 02:04
Hi guys, im working on the Random quote machine exercise, im looking for some sort of documentation for implementing the share via twitter.. im sure theres many roads to take on this. What do you guys recommend out there?
Adam Yuhasz
@jayuhasz
Feb 16 2016 02:05
@interstellaridea I recommend using the twitter API if that's what you're asking. https://dev.twitter.com/web/tweet-button
tommy
@tommygebru
Feb 16 2016 02:06
@zeiadwsabra did you add to your tribute page? :smile:
Sebastian
@interstellaridea
Feb 16 2016 02:07
@jayuhasz cool thanks!
CamperBot
@camperbot
Feb 16 2016 02:07
interstellaridea sends brownie points to @jayuhasz :sparkles: :thumbsup: :sparkles:
:star: 290 | @jayuhasz | http://www.freecodecamp.com/jayuhasz
LoLRabbit
@KevinStaufy
Feb 16 2016 02:08
k i give up cant figure out this center image stuff
its upsetting me :(
Lanitta
@DivaWeb
Feb 16 2016 02:08
hello all
does anyone know how to add images to code pen
Adam Yuhasz
@jayuhasz
Feb 16 2016 02:09
@KevinStaufy what do you mean?
LoLRabbit
@KevinStaufy
Feb 16 2016 02:09
im trying to make my tribute and i cant center the img
Adam Yuhasz
@jayuhasz
Feb 16 2016 02:10
@KevinStaufy got a link to your pen?
Lanitta
@DivaWeb
Feb 16 2016 02:12
how do I use an image on my laptop
Collin
@collinferry
Feb 16 2016 02:12
@DivaWeb what do you mean?
Adam Yuhasz
@jayuhasz
Feb 16 2016 02:13
@KevinStaufy ok I've forked your page, take a look at it to see my changes. http://codepen.io/jayuhasz/pen/RrdyKX
LoLRabbit
@KevinStaufy
Feb 16 2016 02:14
@jayuhasz omg thank you <3
CamperBot
@camperbot
Feb 16 2016 02:14
kevinstaufy sends brownie points to @jayuhasz :sparkles: :thumbsup: :sparkles:
Lanitta
@DivaWeb
Feb 16 2016 02:14
I am working on build a personal portfolio page and I need to use images that are not located on the web
CamperBot
@camperbot
Feb 16 2016 02:14
:star: 291 | @jayuhasz | http://www.freecodecamp.com/jayuhasz
Adam Yuhasz
@jayuhasz
Feb 16 2016 02:14
@KevinStaufy basically, I made the image into a block of it's own then applied margin properties to it
LoLRabbit
@KevinStaufy
Feb 16 2016 02:14
@jayuhasz i see thank you :)
CamperBot
@camperbot
Feb 16 2016 02:14
kevinstaufy sends brownie points to @jayuhasz :sparkles: :thumbsup: :sparkles:
:warning: kevinstaufy already gave jayuhasz points
Adam Yuhasz
@jayuhasz
Feb 16 2016 02:15
@DivaWeb you will need to upload the image to a host somewhere then link it
Lanitta
@DivaWeb
Feb 16 2016 02:15
@jayuhasz so I have to use a 3rd party to host my pics on the web?
Adam Yuhasz
@jayuhasz
Feb 16 2016 02:16
@DivaWeb or one of your own servers if you have access to it for code pen. if you've got a server for your site, you can host the images there as well.
tommy
@tommygebru
Feb 16 2016 02:17
@jayuhasz i believe flicker and dropbox works, I am using photobucket myself
Lanitta
@DivaWeb
Feb 16 2016 02:18
@jayuhasz I have no website or photos on the web I am using
@jayuhasz what can I use?
idietmoran
@idietmoran
Feb 16 2016 02:19
@DivaWeb you can upload your photo to imgur and point the html file to that
Adam Yuhasz
@jayuhasz
Feb 16 2016 02:19
@DivaWeb well you'll need to upload the images to an image host like flicker or photobucket
Lanitta
@DivaWeb
Feb 16 2016 02:19
@jayuhasz can I use drop box? I already have an account with them
idietmoran
@idietmoran
Feb 16 2016 02:20
@DivaWeb if the photo's are made public you can
Lanitta
@DivaWeb
Feb 16 2016 02:21
thanks guys
@idietmoran @jayuhasz thanks guys
CamperBot
@camperbot
Feb 16 2016 02:21
divaweb sends brownie points to @idietmoran and @jayuhasz :sparkles: :thumbsup: :sparkles:
:star: 298 | @idietmoran | http://www.freecodecamp.com/idietmoran
:star: 292 | @jayuhasz | http://www.freecodecamp.com/jayuhasz
LoLRabbit
@KevinStaufy
Feb 16 2016 02:38
can someone help me please
how do i center up the text some more
Michael Aubrey
@mca62511
Feb 16 2016 02:40
I've had mixed results with imgur. Sometimes it shows/works/ sometimes not so much.
What do you mean center up the text some more?
LoLRabbit
@KevinStaufy
Feb 16 2016 02:41
yea i feel like its to far spread
Michael Aubrey
@mca62511
Feb 16 2016 02:41
Too wide?
LoLRabbit
@KevinStaufy
Feb 16 2016 02:41
yea
Michael Aubrey
@mca62511
Feb 16 2016 02:42
Well, you should use div tags
for one
LoLRabbit
@KevinStaufy
Feb 16 2016 02:42
rip thats right
Michael Aubrey
@mca62511
Feb 16 2016 02:42
<div> is a division in the page. They can wrap around things and contain them.
LoLRabbit
@KevinStaufy
Feb 16 2016 02:42
wiki div
CamperBot
@camperbot
Feb 16 2016 02:42

:point_right: challenge assignment with divided by equals [wiki]

Assignment with Divided by Equals

The /= operator divides a variable by another number.

myVar = myVar / 5;

Will divide myVar by 5. This can be rewritten as:

myVar /= 5;

:pencil: read more about challenge assignment with divided by equals on the FCC Wiki

Michael Aubrey
@mca62511
Feb 16 2016 02:43

So first put it in a div

<div>
 <!-- your tribute page -->
</div>

And then in your css, style the div's width, margins, and/or padding to make it display how you'd like.

LoLRabbit
@KevinStaufy
Feb 16 2016 02:44
ahh alrighty
so how do i make multiple div's?
or can i only have one
Michael Aubrey
@mca62511
Feb 16 2016 02:45
div {
    width: 70%;
    margin: 0 auto;
}
Would be a simple way to do it
LoLRabbit
@KevinStaufy
Feb 16 2016 02:45
ahh alright
Michael Aubrey
@mca62511
Feb 16 2016 02:45
You can have as many as you want, but for this you could probably just wrap the whole page in it
LoLRabbit
@KevinStaufy
Feb 16 2016 02:46
sweet
quick question
how do i make diffrent ones
if there all named div
how do i differenceiate
Michael Aubrey
@mca62511
Feb 16 2016 02:46
instead of styling the div, use a class
LoLRabbit
@KevinStaufy
Feb 16 2016 02:47
so <div class="whatever"> ?
Michael Aubrey
@mca62511
Feb 16 2016 02:49

CSS

.site-wrapper {
    padding: 2em;
    width: 100%;
}

.redbox {
    background-color: red;
    height: 100px;
    width: 100px;
    margin: 10px;
}

HTML

<div class="site-wrapper">
    <p>This is my website! Look at this red box.</p>
    <div class="redbox"></div>
</div>
LoLRabbit
@KevinStaufy
Feb 16 2016 02:49
ahhh
Michael Aubrey
@mca62511
Feb 16 2016 02:50
Also, a <p> tag is a paragraph tag, so use them to divide paragraphs.
LoLRabbit
@KevinStaufy
Feb 16 2016 02:50
alrighty cool
Michael Aubrey
@mca62511
Feb 16 2016 02:51
This message was deleted

If you write,

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc varius magna ante, nec ornare ipsum viverra sit amet. Ut blandit metus id pulvinar convallis. Pellentesque arcu libero, semper ac tempor a, gravida a nisi. 

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc varius magna ante, nec ornare ipsum viverra sit amet. Ut blandit metus id pulvinar convallis. Pellentesque arcu libero, semper ac tempor a, gravida a nisi. </p>

Then it'll display as

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc varius magna ante, nec ornare ipsum viverra sit amet. Ut blandit metus id pulvinar convallis. Pellentesque arcu libero, semper ac tempor a, gravida a nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc varius magna ante, nec ornare ipsum viverra sit amet. Ut blandit metus id pulvinar convallis. Pellentesque arcu libero, semper ac tempor a, gravida a nisi.

However, if you write,

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc varius magna ante, nec ornare ipsum viverra sit amet. Ut blandit metus id pulvinar convallis. Pellentesque arcu libero, semper ac tempor a, gravida a nisi.</p> 

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc varius magna ante, nec ornare ipsum viverra sit amet. Ut blandit metus id pulvinar convallis. Pellentesque arcu libero, semper ac tempor a, gravida a nisi. </p>

Then it'll display as

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc varius magna ante, nec ornare ipsum viverra sit amet. Ut blandit metus id pulvinar convallis. Pellentesque arcu libero, semper ac tempor a, gravida a nisi.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc varius magna ante, nec ornare ipsum viverra sit amet. Ut blandit metus id pulvinar convallis. Pellentesque arcu libero, semper ac tempor a, gravida a nisi.

LoLRabbit
@KevinStaufy
Feb 16 2016 02:54
hmm interesting
@mca62511 thank you
CamperBot
@camperbot
Feb 16 2016 02:54
kevinstaufy sends brownie points to @mca62511 :sparkles: :thumbsup: :sparkles:
:star: 273 | @mca62511 | http://www.freecodecamp.com/mca62511
Travis Halleck
@hallectj
Feb 16 2016 02:56
Out of curiosity did anyone else put a setTimeout function on the weather app, just in case if there ajax response takes too long, or am I being to paranoid?
batilc1
@batilc1
Feb 16 2016 02:57
setTimeout? why wont you use the default timeout of http request?
Travis Halleck
@hallectj
Feb 16 2016 02:59
@batilc1 I'm not the most knowledgable at ajax, oh so their is a default one, okay, I guess that makes sense.
I always thought it was the ajax requesting info and if it got back before the page renders then it would error out.
LoLRabbit
@KevinStaufy
Feb 16 2016 03:03
@mca62511 i made a div with width: 70%; and it didnt work
Michael Aubrey
@mca62511
Feb 16 2016 03:04
show me?
ah, nm I see
I could just refresh the pen
you forget a dash between site and wrapper in your css
batilc1
@batilc1
Feb 16 2016 03:05
lol :) of course you should be filling dom after the dom is ready, thats for sure :)
LoLRabbit
@KevinStaufy
Feb 16 2016 03:05
ahh
@mca62511 much better ty
batilc1
@batilc1
Feb 16 2016 03:06
@hallectj inorder to ensure that you should do:
document.addEventListener("DOMContentLoaded", function(event) {
    console.log("DOM fully loaded and parsed");
   initThings();
  });
Michael Aubrey
@mca62511
Feb 16 2016 03:07
no worries. btw, if you use a percentage width for the img it'll scale better between different devices
right now if you view it on your cell phone Bill will be too big for the page
batilc1
@batilc1
Feb 16 2016 03:07
@hallectj the ajax timeout is for requests that take too long to respond, so that the timeout is fired and you can do stuff
LoLRabbit
@KevinStaufy
Feb 16 2016 03:08
@mca62511 wait i thought i was using a %
nvm
check now
Travis Halleck
@hallectj
Feb 16 2016 03:09
@batilc1 Oh okay, I sort of new at this
Michael Aubrey
@mca62511
Feb 16 2016 03:09
@KevinStaufy Nice :thumbsup:
batilc1
@batilc1
Feb 16 2016 03:10
@hallectj nvm, just trying to help :) using setTimeout for waiting page to load is not right, nor guaranteed
LoLRabbit
@KevinStaufy
Feb 16 2016 03:10
@mca62511 :D
Michael Aubrey
@mca62511
Feb 16 2016 03:12
@KevinStaufy Florida? I was born in Miami. Family moved to Sebring after Hurricane Andrew.
LoLRabbit
@KevinStaufy
Feb 16 2016 03:12
@mca62511 orlando :)
LoLRabbit
@KevinStaufy
Feb 16 2016 03:21
@mca62511 so what else am i missing from this? http://codepen.io/KevinStaufy/pen/GoexQP
Michael Aubrey
@mca62511
Feb 16 2016 03:21
In order to complete the zipline/project? If I remember correctly you need to have a link to where people can learn more information.
LoLRabbit
@KevinStaufy
Feb 16 2016 03:22
@mca62511 oo yea!
Michael Aubrey
@mca62511
Feb 16 2016 03:22
Also, looks like you still haven't fixed your paragraph tags.
LoLRabbit
@KevinStaufy
Feb 16 2016 03:22
o yea
your right
Michael Aubrey
@mca62511
Feb 16 2016 03:27
looking better
LoLRabbit
@KevinStaufy
Feb 16 2016 03:28
:D
Michael Aubrey
@mca62511
Feb 16 2016 03:29

so actually, I need some help.

I moved the project portfolio page to my actual domain (and removed the projects for now until I have better stuff to show)
http://michaelcharl.es/aubrey

However, on mobile, it isn't rendering properly. It is showing the full webpage, zoomed out, as opposed to the smaller gird version.

The col-xs elements appear properly on a small sized window on the computer, they just don't show properly on a similarly sized phone window.

Any thoughts?

LoLRabbit
@KevinStaufy
Feb 16 2016 03:30
@mca62511 did you make this website?
Michael Aubrey
@mca62511
Feb 16 2016 03:30
yeah
LoLRabbit
@KevinStaufy
Feb 16 2016 03:31
thats REALLY cool to be honest
Michael Aubrey
@mca62511
Feb 16 2016 03:31
Oh, well thanks :P
LoLRabbit
@KevinStaufy
Feb 16 2016 03:31
:D
@mca62511 i added a link in the bottom
but used h2 i should have used a <p> with a bigger font proabbly
Michael Aubrey
@mca62511
Feb 16 2016 03:33
either way is okay
well, actually, I think p with a bigger font is better
LoLRabbit
@KevinStaufy
Feb 16 2016 03:34
i did it that way just because its bigger by default
yea i think your right ill switch it
Michael Aubrey
@mca62511
Feb 16 2016 03:36
For the link to work in CodePen, you need to give it a target window.
LoLRabbit
@KevinStaufy
Feb 16 2016 03:36
?
Michael Aubrey
@mca62511
Feb 16 2016 03:36
<a href="http://www.example.com" target="_blank">This is a link!</a>
What that does it makes it open in a new window, instead of trying to open in the same window.
This message was deleted
LoLRabbit
@KevinStaufy
Feb 16 2016 03:37
ahhh
question
why isnt my wiki-link in my CSS working
Michael Aubrey
@mca62511
Feb 16 2016 03:39
because there are a bunch of different units of measurement. Not just pixels. Therefore you need to specify you mean 42 pixels high, "42px", not "42"
LoLRabbit
@KevinStaufy
Feb 16 2016 03:39
o yea
iforgot that lmao
there we go fixed it
Jovvi Johnson
@jovjohnson
Feb 16 2016 04:16
does anyone know how i can append an array of elements in place?
using jquery?
Neeraj Lad
@neeraj-lad
Feb 16 2016 04:17
@jovjohnson do you want to join the array elements together?
DJ
@qualitymanifest
Feb 16 2016 04:19
i don't think that :point_up: is the case...? but it's hard to tell what you're trying to do @jovjohnson . if you can paste your codepen and explain what you want to happen, that would help
Jovvi Johnson
@jovjohnson
Feb 16 2016 04:21
basically, in my game of hangman, i'm trying to countdown the number of lives the user has left. currently my code is returning a bunch of "you have (number) of lives left" on top of each other with every event.
DJ
@qualitymanifest
Feb 16 2016 04:22
@jovjohnson $('placeYoureDisplayingThat').empty().append(whatYouWantToDisplay)
or, you could just use $('placeYoureDisplayingThat').text(whatYouWantToDisplay)
Michael Aubrey
@mca62511
Feb 16 2016 04:23

I'm not that far yet, but couldn't you just use jquery to change the text within an element to display what you want to display?

$(".score").html("You have " + varScore + " lives left.");

Something like that?

or .text too, that works too
Jovvi Johnson
@jovjohnson
Feb 16 2016 04:27
ahh, .text works perfectly. thanks @qualitymanifest @mca62511
i was definitely overthinking this wow
CamperBot
@camperbot
Feb 16 2016 04:27
jovjohnson sends brownie points to @qualitymanifest and @mca62511 :sparkles: :thumbsup: :sparkles:
:star: 966 | @qualitymanifest | http://www.freecodecamp.com/qualitymanifest
:star: 275 | @mca62511 | http://www.freecodecamp.com/mca62511
Fernando Ramirez
@Gords
Feb 16 2016 04:28
could any of you guys look at my code? im having trouble putting the lat and long in my api request
being stuck here for like, 2 hours
DJ
@qualitymanifest
Feb 16 2016 04:30
@Gords 2 hours is nothing :wink2: but yeah paste your codepen
th-thanks, yeah but it kind of is for something so trivial
LoLRabbit
@KevinStaufy
Feb 16 2016 04:33
im kinda like lost
and i have NO CLUE how to or where to even start
Fernando Ramirez
@Gords
Feb 16 2016 04:35
@KevinStaufy i feel you, if it helps, you can go to codecademy.com and have some more html+css training there before doing the portfolio
DJ
@qualitymanifest
Feb 16 2016 04:35
@Gords you need to put your openweathermap call inside your geolocation successfunction
greg
@wearenotgroot
Feb 16 2016 04:35
@KevinStaufy you start with one html tag at a time :smile:
Jovvi Johnson
@jovjohnson
Feb 16 2016 04:35
@KevinStaufy start with some basic html
LoLRabbit
@KevinStaufy
Feb 16 2016 04:35
@wearenotgroot >.>
this is my tribute
its really bad but its better than nothing
greg
@wearenotgroot
Feb 16 2016 04:36
@KevinStaufy it looks fine :smile:
DJ
@qualitymanifest
Feb 16 2016 04:36
@Gords where you have it, outside your geolocation successfunction, lat and long are undefined
LoLRabbit
@KevinStaufy
Feb 16 2016 04:36
@wearenotgroot <3
greg
@wearenotgroot
Feb 16 2016 04:37
@KevinStaufy if you really are at a lost then go and watch a couple of html and css vids, look at others portfolio page online and get some inspiration
DJ
@qualitymanifest
Feb 16 2016 04:37
@Gords the reason for this (i think) is because your geolocation function isn't done yet by the time your openweathermap function begins
LoLRabbit
@KevinStaufy
Feb 16 2016 04:38
@wearenotgroot alright thanks ill try it out
CamperBot
@camperbot
Feb 16 2016 04:38
kevinstaufy sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star: 856 | @wearenotgroot | http://www.freecodecamp.com/wearenotgroot
Michael Aubrey
@mca62511
Feb 16 2016 04:39

@KevinStaufy Well... If you're following the map, at this point you've covered basic HTML5 and CSS, the basics of using Bootstrap for responsive design, and you've been shown how to manipulate the DOM in jquery. That's really all you need to make something like that.

If you

1) Review the lessons you've already done, or use something like codeacademy for review.

2) Google things you don't know.

3) Ask for help after that fails you

Then you can definitely do it. You'll need to use HTML, CSS, Bootstrap, and jQuery to pull off the portfolio page (everything you've learned so far).

Fernando Ramirez
@Gords
Feb 16 2016 04:39
@qualitymanifest it worked! thank you so much, now ill try to get the temp
CamperBot
@camperbot
Feb 16 2016 04:39
gords sends brownie points to @qualitymanifest :sparkles: :thumbsup: :sparkles:
:star: 967 | @qualitymanifest | http://www.freecodecamp.com/qualitymanifest
LoLRabbit
@KevinStaufy
Feb 16 2016 04:40
@mca62511 ill try m ybest
Michael Aubrey
@mca62511
Feb 16 2016 04:40
@KevinStaufy Also, you could just take a break from the projects and make a bunch of your own small side projects. That'll also likely help you tremendously as you learn by doing. Make your own cat facts page, tribute to curry rice, Orlando tour guide, etc.
Fernando Ramirez
@Gords
Feb 16 2016 04:40
@qualitymanifest yup but it taked the lat for some reason, just not the long, that drived me crazy
tommy
@tommygebru
Feb 16 2016 04:43
@evaderei thanks
CamperBot
@camperbot
Feb 16 2016 04:43
tommygebru sends brownie points to @evaderei :sparkles: :thumbsup: :sparkles:
:star: 385 | @evaderei | http://www.freecodecamp.com/evaderei
greg
@wearenotgroot
Feb 16 2016 04:43
@Gords btw you can specify what unit system you want, units='metric' or units='imperial'
LoLRabbit
@KevinStaufy
Feb 16 2016 04:43
@mca62511 hmmm i was going to go run through the code acadamy but its so diffrent
Michael Aubrey
@mca62511
Feb 16 2016 04:46
It's more of a choose-your-own-adventure game approach (metaphorically speaking). If you do use CodeAcademy just focus on the "Build a Website" types of courses that use jQuery, bootstrap, css, and html
at least for now
avoid anything that has to do with AngularJS or Ruby.
LoLRabbit
@KevinStaufy
Feb 16 2016 04:46
@mca62511 yea i did the html one and it was teaching me all diffrent stuff
Michael Aubrey
@mca62511
Feb 16 2016 04:47
I mean, you can learn those things if you want. They wont directly help you with the FCC projects, but they are definitely good to know.
How so?
LoLRabbit
@KevinStaufy
Feb 16 2016 04:47
instead of like <h1> they tell you <header1>
Brett Miller
@Brman85
Feb 16 2016 04:48
Hi all
Has anybody done the Build a Tribute page challenge?
Michael Aubrey
@mca62511
Feb 16 2016 04:48
can you screenshot what you're looking at? I just opened CodeAcademy it is teaching <h1>
Brett Miller
@Brman85
Feb 16 2016 04:50
In the challenges, it says use whichever libraries you need. Do you know what this means?
Michael Aubrey
@mca62511
Feb 16 2016 04:53
a library a collection of premade code used to make doing things easier. One example is jQuery, a Javascript library.
So feel free to include jQuery or a css framework like Bootstrap, but otherwise make it yourself.
Brett Miller
@Brman85
Feb 16 2016 04:58
Thank you!
DJ
@qualitymanifest
Feb 16 2016 05:02
@mca62511 have your brownie tax
CamperBot
@camperbot
Feb 16 2016 05:02
qualitymanifest sends brownie points to @mca62511 :sparkles: :thumbsup: :sparkles:
:star: 277 | @mca62511 | http://www.freecodecamp.com/mca62511
Michael Aubrey
@mca62511
Feb 16 2016 05:02
yay brownies
they should make a custom brownie emoji
DJ
@qualitymanifest
Feb 16 2016 05:05
@mca62511 done. :poop:
Michael Aubrey
@mca62511
Feb 16 2016 05:05
:P
Ogundele Olumide
@Lumexralph
Feb 16 2016 05:24
hey guys, i have a lil challenge, making a timer that counts down, if I put the window.interval method in my function it obeys the click event but misbehaves but if it's declared outside the countdown function it works fine but starts running onload without click event initiating it, how can I correct this, this is my js fiddle
iigmir
@iigmir
Feb 16 2016 05:52
Hi there, I try to view make Local Weather so I look example, but I found that nothing info print in example. What should I do to let my browser get my city info?
Brett Felts
@brettfelts
Feb 16 2016 06:05
use navigator.geolocation
I'm on the same one and I cant seem to get the button to toggle between imperial and metric properly. any suggestions?
Ankit Panwar
@coderNoob
Feb 16 2016 06:08
@brettfelts Can I see your code?
this is one fork, I have another which has the click event in a different place.
Ankit Panwar
@coderNoob
Feb 16 2016 06:11
@brettfelts Use id for your on click event instead of class.
Brett Felts
@brettfelts
Feb 16 2016 06:14
which fork did you look at?
Ankit Panwar
@coderNoob
Feb 16 2016 06:15
the second one
@brettfelts Sorry it was the first one
greg
@wearenotgroot
Feb 16 2016 06:44
@brettfelts add button listener before the ajax call and do it outside it
kirbyedy
@kirbyedy
Feb 16 2016 06:45
does not read the temperature for me :( @brettfelts
greg
@wearenotgroot
Feb 16 2016 06:45
@brettfelts that way you have a listener on the button when the page load
@be
@brettfelts another thing is you can specify on the query what units system you want to the result to use
@brettfelts just add -------->&units=metric or imperial on the url
greg
@wearenotgroot
Feb 16 2016 06:52

@brettfelts you can do something like outside the ajax

$('button').click(function(e){
    var id = e.target.id;

    if(id === 'celsius')
    {
      console.log('celsius');
      //convert();
    }
    else
    {
      console.log('fahrenheit');
      //convert();
    }

  });

then just have a convert function that gets the value of the #temp display and converts it to celsius and fahrenheit then re-display the converted values

Greg Duncan
@GregatGit
Feb 16 2016 06:53
@brettfelts I just did the math inside the JS - so I got the temp in C and then did the math in the js and stored it as another varible
Fernando Ramirez
@Gords
Feb 16 2016 07:00
$( "#btn1" ).click(function() {
  $( ".message" ).toggle();
});
@brettfelts you can also do this, if you put both the celsius and the fahrenheit in <p> tags (or whatever you want) but just show one of them
Mark
@mlawson3691
Feb 16 2016 07:35
Wikipedia Viewer: I can formulate the API call but I can’t retrieve any data from it..is there a special trick or something?
Bruce Young
@mutantspore
Feb 16 2016 07:35
show us your stuff
Mark
@mlawson3691
Feb 16 2016 07:37
…how do you enter chunks of code like that, just copy/paste?
Bruce Young
@mutantspore
Feb 16 2016 07:37
@mlawson3691 you can but I’d rather see your codePen as often the issues lies …elsewhere
greg
@wearenotgroot
Feb 16 2016 07:38
@mlawson3691 wiki format
wiki format
CamperBot
@camperbot
Feb 16 2016 07:38

:point_right: code formatting [wiki]

Inline code

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

Code Block

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

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

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

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

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

greg
@wearenotgroot
Feb 16 2016 07:39
@mlawson3691 ^
honestly, i’ve changed it so many times that I could be so far off at this point too
greg
@wearenotgroot
Feb 16 2016 07:40
@mlawson3691 try dataType: 'jsonp'
Mark
@mlawson3691
Feb 16 2016 07:41
@wearenotgroot no change
any other ideas?
Bruce Young
@mutantspore
Feb 16 2016 07:46
it needs a callback ?callback=? but possibly more ..still looking
ok it’s the form i think… it resets everything and reloads the page
Ankit Panwar
@coderNoob
Feb 16 2016 07:48

The pos seems to have the same value after the if statement.

function miniMax(movesSign, sign, pos) {
  var scoreGame = score();

  if (scoreGame) {
    return [scoreGame, pos];
  }
  console.log(pos);
  var multi = sign === aiSign ? 1 : -1;
  var moves = possibleMoves();
  var bestScore = -100;
  var positions = [pos];
  var thisScore;
  var oppSign = sign === "O" ? "X" : "O"; // opponent's sign
  while (moves.length > 0) {
    var newPosition = moves.pop();
    var newBoard = movesSign.slice();
    newBoard[newPosition] = sign;
    var result = miniMax(newBoard, oppSign, newPosition);
    thisScore = multi * result[0];

    // Choose the best possible move
    if (thisScore === bestScore) {
      positions.push(newPosition);
    } else if (thisScore > bestScore) {
      bestScore = thisScore;
      positions = [newPosition];
    }
  }

  // Choose a move at random from the best moves
  var randomMove = Math.floor(Math.random() * positions.length);
  return [multi * bestScore, positions[randomMove]];
};

Can you guys please help me with this?

Mark
@mlawson3691
Feb 16 2016 07:49
@mutantspore so strip the form down to bare bones and see if it works?
Bruce Young
@mutantspore
Feb 16 2016 07:49
@mlawson3691 well you actually open a form but never close it. .
your base url should be https://en.wikipedia.org/w/api.php?callback=? to add in teh callback
and yesthe dataType is probably jsonp
h4r1m4u
@h4r1m4u
Feb 16 2016 07:54

@mlawson3691 as @mutantspore suggested above, the problem is that when the form is submitted it reloads the entire page, so you'll never get the results back from the API (when the page reloads, they're wiped). prevent the form from submitting:

  $('#form').submit(function(event) {
    event.preventDefault();
    var input = $('#search').val();
    $.ajax({ 
     // the rest of your code as is

and yeah, you're missing a closing </form> tag in your HTML as well
the ajax call as such is working fine

Ankit Panwar
@coderNoob
Feb 16 2016 07:54
I'm at my wits end now ! It's throwing Uncaught RangeError: Maximum call stack size exceedederror. Don't know why. Please help.
http://codepen.io/coderNoob/pen/vLmyWN?editors=1010
Mark
@mlawson3691
Feb 16 2016 07:55
you guys are amazing!
thank you @h4r1m4u !
CamperBot
@camperbot
Feb 16 2016 07:56
mlawson3691 sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1413 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 16 2016 07:56
np
Mark
@mlawson3691
Feb 16 2016 07:56
and thank you @mutantspore
CamperBot
@camperbot
Feb 16 2016 07:56
mlawson3691 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1126 | @mutantspore | http://www.freecodecamp.com/mutantspore
greg
@wearenotgroot
Feb 16 2016 08:03
@mlawson3691 you may want to change that .on('click', function(){}) to on('input',function(){}) instead so it will not trigger the search when you click the input textfield
@mlawson3691 but rather trigger the search when the values in the input textfield changes
@mlawson3691 another thing you might want to use .hasOwnProperty() to test if the data has some property for instance query or page. so it doesnt gives you error when the data is an error message
Bruce Young
@mutantspore
Feb 16 2016 08:08
@coderNoob All I can say at the mement that it’s the while loop
th erecursion in the while loop
Ankit Panwar
@coderNoob
Feb 16 2016 08:09
@mutantspore Yes . I narrowed it. For some reason, the newPosition value is not being passed in the recursive calls.
Mark
@mlawson3691
Feb 16 2016 08:15
@wearenotgroot thanks for the input :)
CamperBot
@camperbot
Feb 16 2016 08:15
mlawson3691 sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star: 861 | @wearenotgroot | http://www.freecodecamp.com/wearenotgroot
greg
@wearenotgroot
Feb 16 2016 08:16
@mlawson3691 :+1: YW
Ankit Panwar
@coderNoob
Feb 16 2016 08:31
@mutantspore var newPosition = moves.pop(); The value is not changing. It pops the last free box number and it keeps looping on the same box number.
h4r1m4u
@h4r1m4u
Feb 16 2016 08:35

hey guys, i have a lil challenge, making a timer that counts down, if I put the window.interval method in my function it obeys the click event but misbehaves but if it's declared outside the countdown function it works fine but starts running onload without click event initiating it, how can I correct this, this is my js fiddle

@Lumexralph here you go:

var time = 1200;   // in secs
var clockDisplay = document.getElementById('sessionCount');  // target the div
var myTimer; // stores the interval id

function startCountdown () {       //countdown by decreasing time at inttervals of 1 second
    myTimer = setInterval(function() {
      time--;
       displayTime();  
     }, 1000);
}

function displayTime () {    //updates the div anytime time decreases
    var min = Math.floor(time / 60);     //convert time to mins
    var secs = Math.floor(time % 60);    //convert time to secs
    if(secs == 0) {          //make secs 59 if it's 0
    min--;
    secs = 59;
    }
  //clockDisplay.textContent = min + 'm' + ':' + secs + 's';
  clockDisplay.textContent = min + 'm' + ':' + secs + 's';
}

//adding a click event on the div
clockDisplay.addEventListener('click', startCountdown);
wyattelliott
@wyattwade
Feb 16 2016 08:41
@h4r1m4u I wasn't able to fix up that tic tac toe code
:worried:
h4r1m4u
@h4r1m4u
Feb 16 2016 08:42
how come?
wyattelliott
@wyattwade
Feb 16 2016 08:43
   function mainAlgoMove() { // *********** bug happens because it finds multiple winnning computer combinations. Sometimes the one it finds comes up with the container being taken by an x. In this event

            if (move == 0 && playerArray.length == 0 && compArray.length == 0){    //This will trigger when the board is cleared and the player had the last turn. The computer will go first and have a random move
                 computerFirst();
            }
            if (move == 0 && (          (pattern.length == 2 && compJoined.length == 1 && pattern.indexOf(24) !== -1) || (pattern.length == 2 && compJoined.length == 1 && pattern.indexOf(34) !== -1) || (pattern.length == 2 && compJoined.length == 1 && pattern.indexOf(27) !== -1) ||(pattern.indexOf(2) !== -1 && pattern.indexOf(3) !== -1) || (pattern.indexOf(5) !== -1 && pattern.indexOf(9) !== -1) || (pattern.indexOf(4) !== -1 && pattern.indexOf(7) !== -1)) && $('#container-1').html() == "") {
                compArray.push(1);
                $('#container-1').html(compSymbol).css({'background-color': compColor});
                move = 1;

            }
            if (move == 0 && ((pattern.indexOf(5) !== -1 && pattern.indexOf(8) !== -1) || (pattern.indexOf(1) !== -1 && pattern.indexOf(3) !== -1) ||
                (pattern.indexOf(2) !== -1 && pattern.indexOf(8) !== -1)) && $('#container-2').html() == "") {
                compArray.push(2);
                $('#container-2').html(compSymbol).css({'background-color': compColor});
                move = 1;

            }
            if (move == 0 && ((pattern.length == 2 && compJoined.length == 1 && pattern.indexOf(16) !== -1) || (pattern.length == 2 && compJoined.length == 1 && pattern.indexOf(26) !== -1) || (pattern.length == 2 && compJoined.length == 1 && pattern.indexOf(29) !== -1) ||(pattern.indexOf(1) !== -1 && pattern.indexOf(2) !== -1 ) || (pattern.indexOf(5) !== -1 && pattern.indexOf(7) !== -1 ) || (pattern.indexOf(6) !== -1) && pattern.indexOf(9) !== -1) && $('#container-3').html() == "") {
                compArray.push(3);
                $('#container-3').html(compSymbol).css({'background-color': compColor}); 
                move = 1;

            }
            if (move == 0 &&((pattern.indexOf(1) !== -1 && pattern.indexOf(7) !== -1) || (pattern.indexOf(5) !== -1 && pattern.indexOf(6) !== -1 ) || (pattern.indexOf(2) !== -1 && pattern.indexOf(8) !== -1) || (pattern.indexOf(4) !== -1 && pattern.indexOf(6) !== -1)) && $('#container-4').html() == "") {
                compArray.push(4);
                $('#container-4').html(compSymbol).css({'background-color': compColor});
                move = 1;
            }
            if (move == 0 && ((pattern.indexOf(1) !== -1 && pattern.indexOf(9) !== -1) || (pattern.indexOf(2) !== -1 && pattern.indexOf(8) !== -1) || (pattern.indexOf(3) !== -1 && pattern.indexOf(7) !== -1) || (pattern.indexOf(4) !== -1 && pattern.indexOf(6) !== -1)) && $('#container-5').html() == "") {
                compArray.push(5);
                $('#container-5').html(compSymbol).css({'background-color': compColor});
                move = 1;
            }
            if (move == 0 && ((pattern.indexOf(3) !== -1 && pattern.indexOf(9) !== -1) || (pattern.indexOf(4) !== -1 && pattern.indexOf(5) !== -1)) && $('#container-6').html() == "") {
                compArray.push(6);
                $('#container-6').html(compSymbol).css({'background-color': compColor});
                move = 1;
            }
            if (move == 0 && ((pattern.length == 2 && compJoined.length == 1 && pattern.indexOf(48) !== -1) || (pattern.length == 2 && compJoined.length == 1 && pattern.indexOf(49) !== -1) || (pattern.length == 2 && compJoined.length == 1 && pattern.indexOf(18) !== -1) ||                   (pattern.indexOf(1) !== -1 && pattern.indexOf(4) !== -1) || (pattern.indexOf(3) !== -1 && pattern.indexOf(5) !== -1) || (pattern.indexOf(8) !== -1 && pattern.indexOf(9) !== -1)) && $('#container-7').html() == "") {
                compArray.push(7);
                $('#container-7').html(compSymbol
That was the original block of code that just went on way too long
if (move == 0){

    for (var i = 1; i <= mainArray.length - 1; i++){


        for (var j = 0; j <= mainArray[i].length - 1; j++){

                if ((pattern.indexOf(mainArray[i][j][0]) !== -1) && ((pattern.indexOf(mainArray[i][j][1]) !== -1)) && ($('#container-'+i).html() == "")){

                $('#container-' + i).html(compSymbol).css({'background-color': compColor});
                move = 1;
                return;                

             console.log('--------------------------------------------------------------------------------------------------------------------mainArray' + mainArray[i][j]);

           console.log('------------------------------------------------------pattern  ' + pattern   );

           console.log('----------------------------------------------------------- i  ' + i);

                        }      






             }
}
}    


        }
I made it into as little code as that
but there are just too many bugs
I may just have to take the whoopin in the interview
h4r1m4u
@h4r1m4u
Feb 16 2016 08:45
hmm. that looks much better, the original makes me want to throw up :D
wyattelliott
@wyattwade
Feb 16 2016 08:46
i know... me too
h4r1m4u
@h4r1m4u
Feb 16 2016 08:46
any chance you can fix those bugs?
wyattelliott
@wyattwade
Feb 16 2016 08:46
but it doesn't have bugs
been trying all day
it's a mess
This message was deleted
Ogundele Olumide
@Lumexralph
Feb 16 2016 08:47
@h4r1m4u ....you know what I did to fix it?
wyattelliott
@wyattwade
Feb 16 2016 08:47
I'll keep trying
h4r1m4u
@h4r1m4u
Feb 16 2016 08:48
@wyattwade can you explain in words what the mainAlgoMove() function does?
@Lumexralph nope. what did you do?
Ogundele Olumide
@Lumexralph
Feb 16 2016 08:48
I wrapped the interval id in another function and used that as the function to be fired on click event
hope it's cool that way?
wyattelliott
@wyattwade
Feb 16 2016 08:49
@h4r1m4u Yeah, first it looks at the computer positions on the board. It looks to see if the computer has a winning move
h4r1m4u
@h4r1m4u
Feb 16 2016 08:49
@Lumexralph sounds alright, hard to tell without seeing the code. did you see my edit of your code above?
wyattelliott
@wyattwade
Feb 16 2016 08:49
the function runs twice every computer turn
Ogundele Olumide
@Lumexralph
Feb 16 2016 08:50
Yes I did
h4r1m4u
@h4r1m4u
Feb 16 2016 08:50
ok
Ogundele Olumide
@Lumexralph
Feb 16 2016 08:50
can't reach my pc now..... Would post my version as soon as I can
h4r1m4u
@h4r1m4u
Feb 16 2016 08:50
np
Ogundele Olumide
@Lumexralph
Feb 16 2016 08:50
Thanks man
wyattelliott
@wyattwade
Feb 16 2016 08:52
each time it's the computers turn, the mainAlgoMove runs twice. First time it runs the computer looks to see if it has a winning move. Second time it runs, it looks to prevent the player from striking a winning move
since It runs twice, I change a variable called pattern before it runs the second time
I'll keep on it, see if I get anywhere
I appreciate the input, I think getting this right could determine alot : - /
h4r1m4u
@h4r1m4u
Feb 16 2016 08:55
@wyattwade hmm. is there a way that you could break it into smaller functions? e.g. a function to determine whether there's a winning move if a row is completed, a function to determine if there's a column winning move, and a function to determine if there is a diagonal winning move?
ultimately there are only 8 winning combinations (3 rows, 3 cols, 2 diagonals). could you store these in an array and then see if the computer can complete one of them in its move?
i'm not sure if this makes sense with the rest of your code, i'm just trying to give you some tips / nudge you in a better direction
wyattelliott
@wyattwade
Feb 16 2016 08:56
yeah definitely
wow some of my bugs aren't occurring all of the sudden.....
I'm going to do some more testing and then take your advice
h4r1m4u
@h4r1m4u
Feb 16 2016 08:58
roger that
wyattelliott
@wyattwade
Feb 16 2016 08:58
thanks again for helping me out man @h4r1m4u
CamperBot
@camperbot
Feb 16 2016 08:58
wyattwade sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1414 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 16 2016 08:58
no worries
Olawale Akinseye
@brainyfarm
Feb 16 2016 10:25
Guys, I need help in testing my Tic-Tac-Toe if it is beatable or not.
Please take note of your first move.
http://codepen.io/brainyfarm/full/obVzVN
Neeraj Lad
@neeraj-lad
Feb 16 2016 10:37
@brainyfarm Winning position. I am X. I started from the second row of the first column.
http://picpaste.com/brainyFarmTicTacToe-vfsn56UN.png
Olawale Akinseye
@brainyfarm
Feb 16 2016 10:39
Thank you for your testing and review @neeraj-lad :D
I especially appreciate the screenshot :thumbsup:
CamperBot
@camperbot
Feb 16 2016 10:39
brainyfarm sends brownie points to @neeraj-lad :sparkles: :thumbsup: :sparkles:
:star: 301 | @neeraj-lad | http://www.freecodecamp.com/neeraj-lad
Neeraj Lad
@neeraj-lad
Feb 16 2016 10:39
@brainyfarm Starting from the middle position on any of the edges, is resulting in wins.
YW
Rozana
@Rozana78
Feb 16 2016 11:50
@mca62511 thank you for the advice..it was very helpful,about codecademy...I am in the same position as KevinStaufy...a good level of HTML CSS etc knowledge but so confused how to start!
CamperBot
@camperbot
Feb 16 2016 11:50
rozana78 sends brownie points to @mca62511 :sparkles: :thumbsup: :sparkles:
:star: 309 | @mca62511 | http://www.freecodecamp.com/mca62511
Manoj Singh
@manojansh
Feb 16 2016 11:57
@mutantspore You there?
need help anyone?
anyone?
Rozana
@Rozana78
Feb 16 2016 12:00
no particular help for now @manojansh
Manoj Singh
@manojansh
Feb 16 2016 12:00
@Rozana78 , say what?
Rozana
@Rozana78
Feb 16 2016 12:02
@manojansh I mean so far everything is under control...
Manoj Singh
@manojansh
Feb 16 2016 12:03
doesn't look like
@Rozana78
Manoj Singh
@manojansh
Feb 16 2016 12:12
need help please, I need to know if we could set a minimum fontsize in html, so that whereever we define font-size in %, it will be with respect to the defined font-size.!!
Pedro Figueiredo
@pedronfigueiredo
Feb 16 2016 12:16
Hi, I’m having serious problems making Wikipedia API work can someone help me?
Ankit Panwar
@coderNoob
Feb 16 2016 12:17
@manojansh You can use em.
font-size: 1em;
Pedro Figueiredo
@pedronfigueiredo
Feb 16 2016 12:17
@manojansh @coderNoob or rem!
Manoj Singh
@manojansh
Feb 16 2016 12:18
@coderNoob how does em work?
@pedronfigueiredo boss, I haven't reached there yet
Manoj Singh
@manojansh
Feb 16 2016 12:19
@pedronfigueiredo thanks
CamperBot
@camperbot
Feb 16 2016 12:19
manojansh sends brownie points to @pedronfigueiredo :sparkles: :thumbsup: :sparkles:
:star: 298 | @pedronfigueiredo | http://www.freecodecamp.com/pedronfigueiredo
Ankit Panwar
@coderNoob
Feb 16 2016 12:20
@pedronfigueiredo Thanks. I didn't even know what rem is !
CamperBot
@camperbot
Feb 16 2016 12:20
codernoob sends brownie points to @pedronfigueiredo :sparkles: :thumbsup: :sparkles:
:star: 299 | @pedronfigueiredo | http://www.freecodecamp.com/pedronfigueiredo
Pedro Figueiredo
@pedronfigueiredo
Feb 16 2016 12:20
yeah, it works even better I think ;)
do you know how to do API calls?
Ankit Panwar
@coderNoob
Feb 16 2016 12:21
Yes
What exactly do you need help with?
Manoj Singh
@manojansh
Feb 16 2016 12:21
@pedronfigueiredo No my friend, am also new
Ankit Panwar
@coderNoob
Feb 16 2016 12:21
I'll try my best
I need to use wikipedia API to do a search and return results
Ankit Panwar
@coderNoob
Feb 16 2016 12:23
for example, if you put this url on your browser
it returns entries for obama related articles
for some reason I can’t set up the API call so it gets what you see in the browser and stores it into an object (variable) so I can use it inside JS
Harry Aydin
@HMAN1911
Feb 16 2016 12:24
hi guys is this the right place to get code feedback?
Ankit Panwar
@coderNoob
Feb 16 2016 12:27
@pedronfigueiredo Can you be more specific. Did you use the $.JSON() method?
greg
@wearenotgroot
Feb 16 2016 12:28
Harry Aydin
@HMAN1911
Feb 16 2016 12:33
@wearenotgroot thank you kindly
CamperBot
@camperbot
Feb 16 2016 12:33
hman1911 sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
Pedro Figueiredo
@pedronfigueiredo
Feb 16 2016 12:33
@coderNoob @wearenotgroot why doesn’t this work?
CamperBot
@camperbot
Feb 16 2016 12:33
:star: 866 | @wearenotgroot | http://www.freecodecamp.com/wearenotgroot
Ankit Panwar
@coderNoob
Feb 16 2016 12:33
@wearenotgroot I know this might be too much to ask but can you please help me figure out why the minimax is not working as it should. I know this algorithm is correct but something is amiss.
http://codepen.io/coderNoob/pen/vLmyWN
Pedro Figueiredo
@pedronfigueiredo
Feb 16 2016 12:33
$(document).ready(function(){
  var api_url="https://en.wikipedia.org/w/api.php?action=opensearch&search=api&limit=10&namespace=0&format=jsonfm";
  $(window).load(function(){
    $.ajax({
    url: api_url,
    method: 'GET',
    success: function(data) {
      document.getElementById("display").innerHTML = "TEST!";
      // $('#display').html("test!");
    }
    });
  });
});
Ankit Panwar
@coderNoob
Feb 16 2016 12:34
@pedronfigueiredo What doesn't work? The api is returning the desired JSON data. You need to format it into proper HTML form for proper display.
greg
@wearenotgroot
Feb 16 2016 12:35
@pedronfigueiredo you need to add search= "keyword"
Ankit Panwar
@coderNoob
Feb 16 2016 12:35
@pedronfigueiredo You need to add a callback function.
var api_url="https://en.wikipedia.org/w/api.php?&callback=?&action=opensearch&search=api&limit=10&namespace=0&format=jsonfm";
greg
@wearenotgroot
Feb 16 2016 12:35
@coderNoob I'll take a look but no promises :smile:
Ankit Panwar
@coderNoob
Feb 16 2016 12:36
@wearenotgroot He's using opensearch
Pedro Figueiredo
@pedronfigueiredo
Feb 16 2016 12:39
@coderNoob what do you mean? sorry my brain is freezing on me
Ankit Panwar
@coderNoob
Feb 16 2016 12:41
@pedronfigueiredo In your api url, you need to add &callback=?&
@pedronfigueiredo callback prevents the statement from executing until all of it is finished
My brain freezes all the time. Happens to everyone.
@pedronfigueiredo So what the call back function does is, it prevents the statement from executing until all the data is fetched from the API call.
h4r1m4u
@h4r1m4u
Feb 16 2016 12:56
@coderNoob @pedronfigueiredo nope, that's not what the callback does. adding the callback parameter into the API URL turns the request into a JSONP request instead of a pure JSON, which overcomes the cross-domain request issue
@pedronfigueiredo here's a working version to get you going. notice that i a) changed the format parameter in the URL, b) added the callback parameter, c) added the dataType parameter into the ajax call, d) removed the window.load function (you already have that covered by the doc.ready statement):
$(document).ready(function(){
  var api_url="https://en.wikipedia.org/w/api.php?callback=?&action=opensearch&search=api&limit=10&namespace=0&format=json";

    $.ajax({
    url: api_url,
    method: 'GET',
    dataType: 'json',
    success: function(data) {
       console.log(data);
       }
    });

});
batilc1
@batilc1
Feb 16 2016 13:03
Guys, I put myself on a challenge to make Simon game 3d using pure css transformations
we'll see how it will go
Hemang Kumar
@hemangsk
Feb 16 2016 13:25
@batilc1 Good luck :smile:
Need guidance about how to remove this margin that I have between pageOne and pageTwo. I want the two background together, but I do not know what else to try...
Sorry about the picture, I attach the first one I found.
kirbyedy
@kirbyedy
Feb 16 2016 13:37
its a bit messy, for start I see that you are not using correctly the bootstrap row class, that might be the problem
you also made that div fixed height to 800px
padding top = 10% in the second page, why is that ?
Pedro Abel Díaz Sánchez
@coderHook
Feb 16 2016 13:53
ummm @kirbyedy I think I let that by mistake
as I didn't knoow how to fix it I was trying things
In order to display the whole image I set height:800px; to force it to that size
Pedro Figueiredo
@pedronfigueiredo
Feb 16 2016 14:02
@coderNoob Thank you so much. Got lunch and coffee, now coming back to get it :)
CamperBot
@camperbot
Feb 16 2016 14:02
pedronfigueiredo sends brownie points to @codernoob :sparkles: :thumbsup: :sparkles:
:star: 334 | @codernoob | http://www.freecodecamp.com/codernoob
h4r1m4u
@h4r1m4u
Feb 16 2016 14:04
@Abel1987 change the .pageTwo background property to this: background: url("http://wallpapershdfine.com/wp-content/gallery/engineering-background-images/hse_background.jpg") 0 0/100% 100% fixed no-repeat;. and remove the background-size property
Tomáš Kalný
@Sleepy-guy
Feb 16 2016 14:07
http://codepen.io/Sleepy-guy/pen/adqjjq?editors=0010 can you look at line 28 ? i think didnt slice string properly
batilc1
@batilc1
Feb 16 2016 14:19
i occasionally encounter things like this @Sleepy-guy
didnt look at your code, but it seems to me your fix is adding this css to your child divs
box-sizing: border-box
also, if you are using inline-block's, there shouldn't be any space between the html of those inline elements
that means:
<div ...inline... ></div>
<div ...inline...></div>
will not work
in that case, you must either delete the new-line character between the two elements, or comment out the space between them, or set -4px negative margin-left to their class
@Sleepy-guy I went on doing
   <div ...inline...></div><!--
--><div ...inline...></div>
classact1
@classact1
Feb 16 2016 14:29
hi guys I have a question about Random Quote Generator? Where should I store my quotes? Should I just build and array of quotes and get them from there? Or is a better way to do it?
kirbyedy
@kirbyedy
Feb 16 2016 14:29
@classact1 yes the array thing is ok
h4r1m4u
@h4r1m4u
Feb 16 2016 14:30
@classact1 that's a good start. the next step would be to use a third party API
classact1
@classact1
Feb 16 2016 14:30
@h4r1m4u hmm, don't have any experience with APIs. Which API is it?
h4r1m4u
@h4r1m4u
Feb 16 2016 14:31
@classact1 for example http://forismatic.com/en/api/. but if you google around, you'll find others. there's one that gives you chuck norris jokes, for example :)
classact1
@classact1
Feb 16 2016 14:32
@h4r1m4u thanks! : )
CamperBot
@camperbot
Feb 16 2016 14:32
classact1 sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1415 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 16 2016 14:34
np
Nairuz.Abulhul
@nairuzabulhul
Feb 16 2016 14:40
Hello every one ! Does anyone how to get data from one page and display them in another page using JavaScript ???
Neeraj Lad
@neeraj-lad
Feb 16 2016 14:41
hi @h4r1m4u could you check my pen?
http://codepen.io/neeraj-lad/pen/zrbJrR?editors=0010
I can't get the background image to change at line 95 in JS.
anyone else who can look into this?
Nairuz.Abulhul
@nairuzabulhul
Feb 16 2016 14:45
@neeraj-lad what is the problem ?
Neeraj Lad
@neeraj-lad
Feb 16 2016 14:48

@ZeeMax I put a $(body).css() code at line 95, which wasn't working ie I was not able to change the background on refresh.
My previous code:

$("body").css("background", bckgImg);

But I just got a soln which works

$("body").css("background-image", 'url('+bckgImg+')');
Nairuz.Abulhul
@nairuzabulhul
Feb 16 2016 14:50
@neeraj-lad are you retrieving the image from the API or you hard code it ?
Neeraj Lad
@neeraj-lad
Feb 16 2016 14:51
@ZeeMax My problem is solved now. The second method works.
No, I have number of links, from which I choose the appropriate one using switch.
Nairuz.Abulhul
@nairuzabulhul
Feb 16 2016 14:56
@neeraj-lad good
Neeraj Lad
@neeraj-lad
Feb 16 2016 14:57
@ZeeMax another query, what should I do to stretch the image over the entire background? I used width: 100% for body now, but when I zoom out, the image doesn't cover the entire bckg
Nairuz.Abulhul
@nairuzabulhul
Feb 16 2016 15:02
@neeraj-lad background-size:cover;
Neeraj Lad
@neeraj-lad
Feb 16 2016 15:03
@ZeeMax thanks! that works!
CamperBot
@camperbot
Feb 16 2016 15:03
neeraj-lad sends brownie points to @zeemax :sparkles: :thumbsup: :sparkles:
:star: 237 | @zeemax | http://www.freecodecamp.com/zeemax
Nairuz.Abulhul
@nairuzabulhul
Feb 16 2016 15:04
@neeraj-lad make sure to include your image url in this foramt background:url () center fixed; to get centered fixed background
@neeraj-lad Great
Neeraj Lad
@neeraj-lad
Feb 16 2016 15:05
@ZeeMax thanks again! would background-size: 100% auto do the same thing?
CamperBot
@camperbot
Feb 16 2016 15:05
neeraj-lad sends brownie points to @zeemax :sparkles: :thumbsup: :sparkles:
:warning: neeraj-lad already gave zeemax points
Nairuz.Abulhul
@nairuzabulhul
Feb 16 2016 15:05
@neeraj-lad yeah
Neeraj Lad
@neeraj-lad
Feb 16 2016 15:07
@ZeeMax great!
Mooli
@Mooli88
Feb 16 2016 15:11
hi. someone know how to define text-decoration-color in chrome ?
or any alternative ?
Pradeep CE
@cepradeep
Feb 16 2016 15:21
@Mooli88 To specify color, you just have to say color :)
.myElement {
  color: red;
}
Mooli
@Mooli88
Feb 16 2016 15:27
@pradeepce i meant text-decoration-color :) i want the underline to be different color
J Sanderson
@J-Sanderson
Feb 16 2016 15:32
Hi everyone. Having some issues with my wikipedia viewer, I have something that mostly works, but it doesn't like URLs with quote marks. How would I get the article ID instead? http://codepen.io/jsanderson/pen/xZBmXy
Pistacue
@Pistacue
Feb 16 2016 15:32
Hey everybody! I am working on this zipline http://codepen.io/FreeCodeCamp/full/bELRjV here is what i have made so far http://codepen.io/Pistacie/full/ZQPPRp/ My codepen is showing temperature in celsius right now, but when i compare my temperature and temperature from the other code pen they are different, how come?
Neeraj Lad
@neeraj-lad
Feb 16 2016 15:34
@Pistacue the FCC codepen has round the value. Yours shows me 24.476 while FCC shows 25
@rustydragonfly do you want to put quotes in your url?
Pistacue
@Pistacue
Feb 16 2016 15:35
@neeraj-lad thanks, mine is showing 4,7 celsius but the other is showing 2, so that made me think, but I guess it doesn't matter
CamperBot
@camperbot
Feb 16 2016 15:35
pistacue sends brownie points to @neeraj-lad :sparkles: :thumbsup: :sparkles:
:star: 303 | @neeraj-lad | http://www.freecodecamp.com/neeraj-lad
Neeraj Lad
@neeraj-lad
Feb 16 2016 15:35
@Pistacue that might be due to some other issue.. that can't be due to rounding. But your pen gave the right temp for me.
Pistacue
@Pistacue
Feb 16 2016 15:40
I have rounded it and my codepen is showing 1° and the exemplar is showing 2°, is it possible they are getting my location differently?
Neeraj Lad
@neeraj-lad
Feb 16 2016 15:41
@Pistacue did you round up or did you round down?
Pistacue
@Pistacue
Feb 16 2016 15:41
@neeraj-lad I used the Math.round()
Neeraj Lad
@neeraj-lad
Feb 16 2016 15:42
@Pistacue the value might be <1.5, FCC might have used Math.ceil()
John Deegan
@JohnDeegs
Feb 16 2016 15:43
Hey guys, I'm currently trying to make a portfolio page and I'm having some trouble with bootstrap. Is anyone able to decipher why the two wells aren't in alignment vertically with the wells in the next row? It might be better to view the project on a higher resolution than the chat allows. Thanks in advance :) http://codepen.io/JohnDeegs/pen/pgYGoV
Neeraj Lad
@neeraj-lad
Feb 16 2016 15:45
@JohnDeegs you need to verify your email. Codepen is prohibiting full page view right now.
John Deegan
@JohnDeegs
Feb 16 2016 15:45
@neeraj-lad Done
Neeraj Lad
@neeraj-lad
Feb 16 2016 15:49
@JohnDeegs You have not closed the 'row' div of the first row.
John Deegan
@JohnDeegs
Feb 16 2016 15:53
@neeraj-lad I just did that after you said and in my pen I'm still having the problem, interesting
@neeraj-lad It was the row around "Portfolio" that wasn't closed right?
@neeraj-lad Thanks though
CamperBot
@camperbot
Feb 16 2016 15:55
johndeegs sends brownie points to @neeraj-lad :sparkles: :thumbsup: :sparkles:
:star: 304 | @neeraj-lad | http://www.freecodecamp.com/neeraj-lad
Neeraj Lad
@neeraj-lad
Feb 16 2016 15:55
@JohnDeegs try putting a close div tag, before the start of the second div 'row'
rtc31293
@rtc31293
Feb 16 2016 15:57

does anyone know hwy this isn't working?

function sym(args) {
  arr = arguments[0];
  for (i = 1; i < arguments.length; i++){
    arr = arr.concat(arguments[i]);
    i += 1;
  }
  return arr;

Is should return [1, 2, 5, 2, 3, 5, 3, 4, 5] when passed sym([1, 2, 5], [2, 3, 5], [3, 4, 5]), but only return [1,2,5,2,3,5]

Neeraj Lad
@neeraj-lad
Feb 16 2016 15:59
@rtc31293 what is the use of the line i += 1?
J Sanderson
@J-Sanderson
Feb 16 2016 16:00
@neeraj-lad it's mainly if I get a result with a quote, it doesn't work. E.g I was using "cat" as a test search and the third result is "Schrödinger's cat" which cuts off at the '
Everything else seems fine
@rtc31293 yeah, you shouldn't need that? You already have it set to iterate at the start of the loop with i++
Nairuz.Abulhul
@nairuzabulhul
Feb 16 2016 16:02
@rtc31293 also you forgot to identify i , it should be var i = whateverhere ;
Neeraj Lad
@neeraj-lad
Feb 16 2016 16:02
@rustydragonfly ohh.. I you need to convert "Schrödinger's cat" to a url, try encodeuricomponent. I don't know what might be causing your issue though.
rtc31293
@rtc31293
Feb 16 2016 16:02
hahaha oh man..I need to take a step back from my code for a little haha I can't believe I missed that @neeraj-lad @rustydragonfly
@ZeeMax it shouldn't matter if you preceed i with var, var declared a new variables but using it without var will also declare a new variable, which shouldn't matter unless you're using multiple for loops
J Sanderson
@J-Sanderson
Feb 16 2016 16:13
@neeraj-lad ooh, fantastic. thanks.
CamperBot
@camperbot
Feb 16 2016 16:13
rustydragonfly sends brownie points to @neeraj-lad :sparkles: :thumbsup: :sparkles:
:star: 305 | @neeraj-lad | http://www.freecodecamp.com/neeraj-lad
Owen Temple
@owentemp
Feb 16 2016 16:14
When I set up my API call for Build a Random Quote Machine on Codepen(http://codepen.io/owentemp/pen/LGajWq), I am running into the following error: XMLHttpRequest cannot load http://codepen.io/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&_=1455638016563. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://s.codepen.io' is therefore not allowed access. The response had HTTP status code 404. Does anyone know how to get past the "Access-Control-Allow-Origin" barrier I keep running into?
Doandes Razvan
@Fuzyon
Feb 16 2016 16:17
Can someone tell me why my script is not working when I press the button? I imagine it's a missing column or something since it worked before.
http://codepen.io/Fuzyon/pen/KVJBLW
It says that checkLocation is not defined, any idea why?
Neeraj Lad
@neeraj-lad
Feb 16 2016 16:24
@Fuzyon shouldn't it be checkLocation()?
Doandes Razvan
@Fuzyon
Feb 16 2016 16:27
doesn't make a difference, I tried already
it's probably an issue in the script
Stefan Jeremic
@ByteRogue
Feb 16 2016 16:27
anyone have an explanation how to draw animated weather icons? I saw one example which use border-radius to draw clouds, but I don't understand the logic behind it. Some link about that topic would be great. I also tought to do svg animations but IE and Edge doesn't support them
Doandes Razvan
@Fuzyon
Feb 16 2016 16:29
this is annoying, arrrgh
kirbyedy
@kirbyedy
Feb 16 2016 16:29
do you really want to do that from the scratch ?
you can use font awesome if its for the project
Neeraj Lad
@neeraj-lad
Feb 16 2016 16:31
@ByteRogue you can also look at these:
http://codepen.io/joshbader/full/EjXgqr/
Stefan Jeremic
@ByteRogue
Feb 16 2016 16:32
@neeraj-lad I saw that already but I want to understand css for creating those icons
Neeraj Lad
@neeraj-lad
Feb 16 2016 16:32
@ByteRogue okay!
rtc31293
@rtc31293
Feb 16 2016 16:42

I'm very close to getting the Symmetric Difference Algorithm.

function sym(args) {
  arr = arguments[0];
  lengths = [arguments[0].length];
  for (i = 1; i < arguments.length; i++){
    lengths.push(arguments[i].length);
    arr = arr.concat(arguments[i]);
  }
  var o = {};
  var output;

  output = arr.reduce(function(prev, current) {
        var key = '$' + current;

        if (o[key] === true){
            index = prev.indexOf(current);
            prev.splice(index,1);
        }

        if (o[key] === void 0) {
            prev.push(current);
            o[key] = true;
        }

        return prev;
    }, []);

    // write back the result
    return output;
}

sym([1, 2, 5], [2, 3, 5], [3, 4, 5]);

Any advice? The function works when only two arguments are passed in, but when there are more than two I can't figure out how to create a new array for the previous two, I tried using the reduce method inside a for loop but the program told me not to do that

Justice Mba
@Dajust
Feb 16 2016 16:43
codepen is acting very crazy right now
Everything running smooth on my local host, giving 'undefined label' error on codepen
http://codepen.io/daajust/pen/obVROB?editors=0010
Bruce Young
@mutantspore
Feb 16 2016 16:43
@Fuzyon don’t round off the lat and lon.
Doandes Razvan
@Fuzyon
Feb 16 2016 16:48
@mutantspore I found the issue, there were some missing columns
Bruce Young
@mutantspore
Feb 16 2016 16:50
@Fuzyon yes that may be true but instead of being 4 metres inaccurate it’s 40 miles off because you have rounded your lat and lon
@owentemp you don’t really have a URL in your .ajax.. just a bit of one
@owentemp should be http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1 I guess
@Fuzyon also I can’t see the background you are trying to put up
Ednacode (New to Github and making mistakes)
@EdnaMode
Feb 16 2016 17:32
hi

anyone managed to figure out Style Text Inputs as Form Controls my code

<
<button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button>
</div>
<div class="col-xs-4">
<button class="btn btn-block btn-info"><i class="fa fa-info-circle"></i> Info</button>
</div>
<div class="col-xs-4">
<button class="btn btn-block btn-danger"><i class="fa fa-trash"></i> Delete</button>
</div>
</div>
<p>Things cats <span class="text-danger">love:</span></p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
<form action="/submit-cat-photo">
<div class="row">
<div class="col-xs-6">
<label><input type="radio" name="indoor-outdoor"> Indoor</label>
</div>
<div class="col-xs-6">
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
</div>
</div>
<div class="row">
<div class="col-xs-4">
<label><input type="checkbox" name="personality"> Loving</label>
</div>
<div class="col-xs-4">
<label><input type="checkbox" name="personality"> Lazy</label>
</div>
<div class="col-xs-4">
<label><input type="checkbox" name="personality"> Crazy</label>
</div>
</div>
<div>
<form>
<input type="text" form-control placeholder="form-control">
<div class="btn btn-primary">

  <i class="fa fa-paper-plane"></i>

<button type="button" class="btn btn-primary">primary</button>

trying to do this Give the submit button in your form the classes btn btn-primary.
Add a <i class="fa fa-paper-plane"></i> within your submit button element.
Give the text input in your form the class form-control.#

Eduardo Campaña
@orballo
Feb 16 2016 17:34
hi guys, can anyone recommend me a site with a images of all sizes to use while I'm building a web?
Ednacode (New to Github and making mistakes)
@EdnaMode
Feb 16 2016 17:35
sorry if im stating the obv but have u tried the free ones
Eduardo Campaña
@orballo
Feb 16 2016 17:38
yeah sorry, i was googling it but didn't know what to search, it's done. thanks
Ednacode (New to Github and making mistakes)
@EdnaMode
Feb 16 2016 17:39
k cool
ichirped
@ichirped
Feb 16 2016 17:39
I'm trying to use bootstrap class "list-inline" for my unordered list, but it's not working as expected. <ul class="list-inline"> <li>1914 - Born in Cresco, Iowa</li> </ul>
Can anyone point out what am I doing wrong here ?
Ednacode (New to Github and making mistakes)
@EdnaMode
Feb 16 2016 17:39
are u working on the boostrap class
es
ichirped
@ichirped
Feb 16 2016 17:40
no this one is for "Build a tribute page"
Ednacode (New to Github and making mistakes)
@EdnaMode
Feb 16 2016 17:41
sounds like that is beyond bootstrap so apologies not there yet
ichirped
@ichirped
Feb 16 2016 17:43
oh ok np
h4r1m4u
@h4r1m4u
Feb 16 2016 17:44
@ichirped that looks fine to me. what's the issue?
ichirped
@ichirped
Feb 16 2016 17:47
@h4r1m4u I still see the text left-aligned with no bullets
h4r1m4u
@h4r1m4u
Feb 16 2016 17:48
@ichirped well, the inline list doesn't have any bullets and if you only have one <li> in it, it'll be left aligned
ichirped
@ichirped
Feb 16 2016 17:48
ahh
h4r1m4u
@h4r1m4u
Feb 16 2016 17:48
check the example on the bootstrap doc page to see what the inline list looks like: http://getbootstrap.com/css/#type-lists
ichirped
@ichirped
Feb 16 2016 17:48
ok seems like I need to find another way to do what I want
@h4r1m4u I see bullets there :(
h4r1m4u
@h4r1m4u
Feb 16 2016 17:50
are you looking at the Inline list?
Ednacode (New to Github and making mistakes)
@EdnaMode
Feb 16 2016 17:50
blob
blob
style text input as form controls can anyone help with this please. the result i am getting looks ok
but not getting green lights
so can go forward
is this a bug

?
<input type="text" form-control placeholder="form-control">
<div class="btn btn-primary">

  <i class="fa fa-paper-plane"></i>

<button type="button" class="btn btn-primary">primary</button>

ichirped
@ichirped
Feb 16 2016 17:52
@h4r1m4u oh I wasn't, thanks for your help. that link seems helpful in determining what the end result looks like
CamperBot
@camperbot
Feb 16 2016 17:52
ichirped sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1416 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 16 2016 17:52
@ichirped you're welcome
Ednacode (New to Github and making mistakes)
@EdnaMode
Feb 16 2016 17:53
<input type="text" form-control placeholder="form-control">
<div class="btn btn-primary">

  <i class="fa fa-paper-plane"></i>
<button type="button" class="btn btn-primary">primary</button>
Matthew Schultz
@vexleir
Feb 16 2016 17:54
Hey everyone, I'm about to start the random quote machine challenge bu am a bit lost on getting the actual quotes. Are we expected to just store a buunch in an array or find a more sophisticated solution?
h4r1m4u
@h4r1m4u
Feb 16 2016 17:56
@vexleir yeah, either you can store them in an array in your code, or you could use a third party API and pull the quotes from there via API calls
Matthew Schultz
@vexleir
Feb 16 2016 17:57
Ah ok, I didn't even think to see of there was an API that would do that. Thanks @h4r1m4u
CamperBot
@camperbot
Feb 16 2016 17:57
vexleir sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1417 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 16 2016 17:57
@EdnaMode <input type="text" form-control placeholder="form-control">. shouldn't it be class="form-control"
@vexleir no problem. here's an example of one: http://forismatic.com/en/api/. there are others also; if you google around, you'll find a bunch
Matthew Schultz
@vexleir
Feb 16 2016 17:58
perfect, thanks!
Ednacode (New to Github and making mistakes)
@EdnaMode
Feb 16 2016 17:59
@h4r1m4u thks will try thank u
CamperBot
@camperbot
Feb 16 2016 17:59
ednamode sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1418 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
Andrew Charlebois
@andrewchar
Feb 16 2016 18:18
looking for help with getting data from an api to display. doing local weather app and i cant figure out how to pull certain data from the data that i get back from my api call
greg
@wearenotgroot
Feb 16 2016 18:18
@andrewchar which api?
@andrewchar oh that
link your pen @andrewchar
Andrew Charlebois
@andrewchar
Feb 16 2016 18:19
greg
@wearenotgroot
Feb 16 2016 18:20
@andrewchar did you try to output the data on the console
@andrewchar you will usually get a json object from the api
Andrew Charlebois
@andrewchar
Feb 16 2016 18:20
yes i am getting the data that i want
grolocation is working
geo*
i just dont know how to pull certain data that i want from that list using jquery
greg
@wearenotgroot
Feb 16 2016 18:21
@andrewchar it's just a regular look up on object
@andrewchar example
@andrewchar json.main.temp
@andrewchar console log it
@andrewchar you can also specify what unit system the result data will be return in, in your api url call add &units=metric or imperial
Bruce Young
@mutantspore
Feb 16 2016 18:24
some is in an array json.weather[0].icon and json.weather[0].description
greg
@wearenotgroot
Feb 16 2016 18:27
@andrewchar so? did you tried it?
Andrew Charlebois
@andrewchar
Feb 16 2016 18:28
im not sure what to do with json.main.temp
greg
@wearenotgroot
Feb 16 2016 18:29
@andrewchar it give you the tempearture
@andrewchar on your code
$.getJSON('http://api.openweathermap.org/data/2.5/weather?lat=' + latitude + '&lon=' + longitude + '&appid=80f8b2429407d4784a3e920826f54555&units=metric', function(json) {
        console.log(json);
        console.log(json.main.temp);
        updateWeather = json;
      });
@andrewchar you named the object data json so
Andrew Charlebois
@andrewchar
Feb 16 2016 18:31
ok its shows me 282.564
greg
@wearenotgroot
Feb 16 2016 18:32
@andrewchar yes it's in kelvin
@andrewchar you need to specify the unit system to use
@andrewchar append this to the url --------->&units=metric or imperial
Andrew Charlebois
@andrewchar
Feb 16 2016 18:37
ok ive got it in my url
greg
@wearenotgroot
Feb 16 2016 18:37
good
Andrew Charlebois
@andrewchar
Feb 16 2016 18:37
i guess i could add something to that later to get it to somehow change
the way i did to my lat and lon
to change in my url
greg
@wearenotgroot
Feb 16 2016 18:38
@andrewchar just console.log the entire data so you can study what data you want and how to get it
Andrew Charlebois
@andrewchar
Feb 16 2016 18:41
in the lesson Convert JSON Data to HTML. it makes me do a function to put my data into html on the screen
can i not just write $("#myTemp").text( json.main.temp );
and link that to a div ID to make it show
Bruce Young
@mutantspore
Feb 16 2016 18:42
@andrewchar yes
greg
@wearenotgroot
Feb 16 2016 18:43
@andrewchar just add some div with id then append a html element on it or something
Juwdohr
@Juwdohr
Feb 16 2016 18:50
So starting on the Random Quote Machine and I have a bunch of quotes I want to use. Am I using JavaScript for that/
greg
@wearenotgroot
Feb 16 2016 18:52
@Jarvis-327 yep
@Jarvis-327 you have two choice on how to do it
Juwdohr
@Juwdohr
Feb 16 2016 18:53
@wearenotgroot explain?
greg
@wearenotgroot
Feb 16 2016 18:53
@Jarvis-327 either have an api to get random quotes or just have your own list of quote in an array
@Jarvis-327 if you choose the array route
@Jarvis-327 then just generate random number using Math.random<----------------random index(remember range!)
Andrew Charlebois
@andrewchar
Feb 16 2016 18:56

@wearenotgroot

<p id="myTemp">Temp: </p>
$("#myTemp").append(json.main.temp);

like that?

greg
@wearenotgroot
Feb 16 2016 18:59
@andrewchar sure try it :smile:
@andrewchar you have lots of option .html, .text() etc
Andrew Charlebois
@andrewchar
Feb 16 2016 19:01
i add that to my append?
batilc1
@batilc1
Feb 16 2016 19:02
Help please! What is wrong with this piece of code that Xhr fails with 'no-access-control-allow-origin'
var xhr = new XMLHttpRequest();
    xhr.open('GET', 'https://s3.amazonaws.com/freecodecamp/simonSound1.mp3', true);
    xhr.responseType = 'arraybuffer';

    xhr.onload = function() {
       console.log('hello');
    }
    xhr.withCredentials = true;
    xhr.send();
CamperBot
@camperbot
Feb 16 2016 19:02
no wiki entry for: please what is wrong with this piece of code that xhr fails with no-access-control-allow-originvar xhr new xmlhttprequest xhropenget httpss3amazonawscomfreecodecampsimonsound1mp3 true xhrresponsetype arraybuffer xhronload function consoleloghello xhrwithcredentials true xhrsend
greg
@wearenotgroot
Feb 16 2016 19:19
@batilc1 how is your connection? via http or https?
batilc1
@batilc1
Feb 16 2016 19:19
what do you mean?
i opened up an http-server on my localhost, it is trying to access the amazon server
greg
@wearenotgroot
Feb 16 2016 19:20
@batilc1 if you are connected via http then request a query in https then the browser will se two different header data
batilc1
@batilc1
Feb 16 2016 19:22
i am not sure what do you mean by connected via http ? @wearenotgroot
greg
@wearenotgroot
Feb 16 2016 19:22
batilc1
@batilc1
Feb 16 2016 19:22
but that is a hack for development, i may go on production with this code :/ and serve it to common people who dont use that extension
this cors is a joke...
Mooli
@Mooli88
Feb 16 2016 19:24
hi, the 'and' in this media query '@media not screen and (color) {...}' is more like '&&' or '| |' ?
Clark Arnold
@clarkarnold
Feb 16 2016 19:25
Hey guys I am having trouble accessing the openweather api object for "weather"..
[Object { 
 description: "broken clouds",
 icon: "04d",
 id: 803,
 main: "Clouds"
}]
How do you access the keys in this "weather" object
its confusing that is has [ ] and { }
greg
@wearenotgroot
Feb 16 2016 19:26
@clarkarnold weather[0].
Clark Arnold
@clarkarnold
Feb 16 2016 19:26
so weather[0].main
?
@wearenotgroot Got it to work thank you!
CamperBot
@camperbot
Feb 16 2016 19:27
clarkarnold sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star: 868 | @wearenotgroot | http://www.freecodecamp.com/wearenotgroot
greg
@wearenotgroot
Feb 16 2016 19:27
@andrewchar :+1:
Mariya
@mariyadiminsky
Feb 16 2016 19:42
I just found this really cool resource for learning regex. Enjoy *~ http://regex.learncodethehardway.org/book/
kamil kawa
@GlaDdos
Feb 16 2016 19:45
Hey guys i have a quick question, i'm trying to do Show the local Waether project, and i have troubles with getCurrentPosition() function. Is there a posibility that callback function is protecting vvariables with coords to show position outside that function?
greg
@wearenotgroot
Feb 16 2016 19:50
@GlaDdos remember the request is an async
mjqblade
@mjqblade
Feb 16 2016 19:50

can anyone help\

greg
@wearenotgroot
Feb 16 2016 19:51
@GlaDdos meaning the function/your program will continue on while waiting for the result
mjqblade
@mjqblade
Feb 16 2016 19:51

ok'

Bruce Young
@mutantspore
Feb 16 2016 19:52
@mjqblade with what?
greg
@wearenotgroot
Feb 16 2016 19:52
@GlaDdos so your getWeather gets executed and doesnt see the current position
@GlaDdos because it hasnt receive the data yet
mjqblade
@mjqblade
Feb 16 2016 19:53
<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
  .red-text {
    color: red;
  }

  h2 {
    font-family: Lobster, Monospace;
  }

  p {
    font-size: 16px;
    font-family: Monospace;
  }

  .thick-green-border {
    border-color: green;
    border-width: 10px;
    border-style: solid;
    border-radius: 50%;
  }

  .smaller-image {
    width: 100px;
  }
</style>

<h2 class="red-text">CatPhotoApp</h2>

<p>Click here for <a href="#">cat photos</a>.</p>

<a href="#"><img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat"></a>

<p>Things cats love:</p>
<ul>
  <li>cat nip</li>
  <li>laser pointers</li>
  <li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
  <li>flea treatment</li>
  <li>thunder</li>
  <li>other cats</li>
</ol>
<form action="/submit-cat-photo">
  <label><input type="radio" name="indoor-outdoor"> Indoor</label>
  <label><input type="radio" name="indoor-outdoor"> Outdoor</label>
  <label><input type="checkbox" name="personality"> Loving</label>
  <label><input type="checkbox" name="personality"> Lazy</label>
  <label><input type="checkbox" name="personality"> Crazy</label>
  <input type="text" placeholder="cat photo URL" required>
  <button type="submit">Submit</button>
</form>

it says your div element should have the class contaner flood

kamil kawa
@GlaDdos
Feb 16 2016 19:54
no it's not taht, i was trying to save position to global variable, and it keeps resseting to initial value outside getPCurrentPosition(some_function(){ here i get variables set to coords})
greg
@wearenotgroot
Feb 16 2016 19:54
@GlaDdos to make sure that the longitude and latitude are receive before requesting the openweather api . do the openweather api call inside your getlocation callback function
mjqblade
@mjqblade
Feb 16 2016 19:54

<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

<style>
.red-text {
color: red;
}

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}

.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
border-radius: 50%;
}

.smaller-image {
width: 100px;
}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<p>Click here for <a href="#">cat photos</a>.</p>

<a href="#"><img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat"></a>

<p>Things cats love:</p>

<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>

<p>Top 3 things cats hate:</p>

<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>

<form action="/submit-cat-photo">
<label><input type="radio" name="indoor-outdoor"> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality"> Loving</label>
<label><input type="checkbox" name="personality"> Lazy</label>
<label><input type="checkbox" name="personality"> Crazy</label>
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>

greg
@wearenotgroot
Feb 16 2016 19:54
@GlaDdos post the link to your pen
mjqblade
@mjqblade
Feb 16 2016 19:55
<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
  .red-text {
    color: red;
  }

  h2 {
    font-family: Lobster, Monospace;
  }

  p {
    font-size: 16px;
    font-family: Monospace;
  }

  .thick-green-border {
    border-color: green;
    border-width: 10px;
    border-style: solid;
    border-radius: 50%;
  }

  .smaller-image {
    width: 100px;
  }
</style>

<h2 class="red-text">CatPhotoApp</h2>

<p>Click here for <a href="#">cat photos</a>.</p>

<a href="#"><img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat"></a>

<p>Things cats love:</p>
<ul>
  <li>cat nip</li>
  <li>laser pointers</li>
  <li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
  <li>flea treatment</li>
  <li>thunder</li>
  <li>other cats</li>
</ol>
<form action="/submit-cat-photo">
  <label><input type="radio" name="indoor-outdoor"> Indoor</label>
  <label><input type="radio" name="indoor-outdoor"> Outdoor</label>
  <label><input type="checkbox" name="personality"> Loving</label>
  <label><input type="checkbox" name="personality"> Lazy</label>
  <label><input type="checkbox" name="personality"> Crazy</label>
  <input type="text" placeholder="cat photo URL" required>
  <button type="submit">Submit</button>
</form>

help plz excresice 74

Mooli
@Mooli88
Feb 16 2016 19:55
question - the 'and' in this media query '@media not screen and (color) {...}' is more like '&&' or '| |' ?
kamil kawa
@GlaDdos
Feb 16 2016 19:55
@wearenotgroot ```if(navigator.geolocation){
navigator.geolocation.getCurrentPosition(function(position){
longitudeQuery = position.coords.longitude;
latitudeQuery = position.coords.latitude;
      weatherAPIQuery = "http://api.openweathermap.org/data/2.5/weather?lat=" + latitudeQuery + "&lon=" + longitudeQuery;

      console.log(weatherAPIQuery);
});```
oh well that formatting came up great XD
Bruce Young
@mutantspore
Feb 16 2016 19:56
@GlaDdos you’ll need an api key to make it work
mjqblade
@mjqblade
Feb 16 2016 19:56
@mutantspore help plz
kamil kawa
@GlaDdos
Feb 16 2016 19:57
anyways longtitudeQuery is global variable, and outside this function its not showing coord but undefined or wahtever i assign to it before entering that function
Ednacode (New to Github and making mistakes)
@EdnaMode
Feb 16 2016 19:57
@mjqblade @mjqblade did u get an ans?
greg
@wearenotgroot
Feb 16 2016 19:58
@GlaDdos post your pen so we have the whole picture
mjqblade
@mjqblade
Feb 16 2016 19:58
what\
Bruce Young
@mutantspore
Feb 16 2016 19:58
@GlaDdos it’s not showing for the reasons mentioned earlier
mjqblade
@mjqblade
Feb 16 2016 19:58
noooooooo
Mooli
@Mooli88
Feb 16 2016 19:58
whats the difference between '@media print and (min-resolution: 300dpi) {...}' to '@media only print and (min-resolution: 300dpi) {...}'?
mjqblade
@mjqblade
Feb 16 2016 19:59
@Mooli88 almost everythimg]]
@EdnaMode no
Ednacode (New to Github and making mistakes)
@EdnaMode
Feb 16 2016 19:59
@mjqblade im new here so can you cut and paste the question fm the map and i will see if i have answered that
mjqblade
@mjqblade
Feb 16 2016 19:59
i didnt
Mooli
@Mooli88
Feb 16 2016 19:59
@mjqblade please be more specific
mjqblade
@mjqblade
Feb 16 2016 20:00
@Mooli88 i dpnt know much but i know there diffrent becuase in one your asking something]
kamil kawa
@GlaDdos
Feb 16 2016 20:00
Ednacode (New to Github and making mistakes)
@EdnaMode
Feb 16 2016 20:00
@mjqblade exact question pls
?
mjqblade
@mjqblade
Feb 16 2016 20:01
what
kamil kawa
@GlaDdos
Feb 16 2016 20:01
i know it's not showing API responce yet, i'm trying to figure out why global variables are not storing values that are assigned to them in navigator.geolocation.getCurrentPosition(function(position) <- this place
Ednacode (New to Github and making mistakes)
@EdnaMode
Feb 16 2016 20:02
what is the question on Map so i can locate it
mjqblade
@mjqblade
Feb 16 2016 20:02
Use Responsive Design with Bootstrap Fluid Containers
greg
@wearenotgroot
Feb 16 2016 20:04
@GlaDdos

$(document).ready(function(){
var weatherAPIKey = "6a8f3fff2528a34f3bc0896626b63742";
var longitudeQuery = 0;
var latitudeQuery = 0;
var weatherAPIQuery = "";
  if(navigator.geolocation){
    navigator.geolocation.getCurrentPosition(function(position){
          longitudeQuery = position.coords.longitude;
          latitudeQuery = position.coords.latitude;
console.log(longitudeQuery);
          weatherAPIQuery = "http://api.openweathermap.org/data/2.5/weather?lat=" + latitudeQuery + "&lon=" + longitudeQuery +'&appid=' + weatherAPIKey;

console.log(longitudeQuery);


      $.getJSON(weatherAPIQuery).done(function(weather){
          console.log(weather);
        })
        .fail(function(){
          console.log("error");
        });
    });

  }




});
Bruce Young
@mutantspore
Feb 16 2016 20:04
@GlaDdos as has already been said. the process is asychonous .. the geolocation process gets started but you don’t know when it wil finish.. teh actual JS code just keeps rolling on and gets to teh bit outside the geolocate and well.. nothing has return yet.
kamil kawa
@GlaDdos
Feb 16 2016 20:05
@mutantspore Oooooh...
greg
@wearenotgroot
Feb 16 2016 20:05
@GlaDdos as said earlier to make sure that the longitude and latitude are set before making request to the openweather api you either set a timeout on the getJSON or do it inside the getCurrentPosition callback
Clark Arnold
@clarkarnold
Feb 16 2016 20:05
@mutantspore @wearenotgroot I am working on the same project.. How do you control when the next part fires? I am getting my Coordinates but I can't figure out how to tell the rest of the code to wait for that part to happen first
Bruce Young
@mutantspore
Feb 16 2016 20:05
either do it as @wearenotgroot has suggested or wrap your getjson in a function ..say.. getWeather and call it from inside the geolocation
greg
@wearenotgroot
Feb 16 2016 20:05
@GlaDdos and as @mutantspore said you need to add the appid
kamil kawa
@GlaDdos
Feb 16 2016 20:05
thatks you guys i get that now @mutantspore @wearenotgroot
i meant thanks @mutantspore @wearenotgroot
CamperBot
@camperbot
Feb 16 2016 20:06
gladdos sends brownie points to @mutantspore and @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star: 869 | @wearenotgroot | http://www.freecodecamp.com/wearenotgroot
:star: 1129 | @mutantspore | http://www.freecodecamp.com/mutantspore
Bruce Young
@mutantspore
Feb 16 2016 20:07
@clarkarnold as we just mentioned.. call the second part from within the first
Ednacode (New to Github and making mistakes)
@EdnaMode
Feb 16 2016 20:08
@mjqblade @mjqblade this worked for me
<div class =" container-fluid">


<h2 class="red-text">CatPhotoApp</h2>

<p>Click here for <a href="#">cat photos</a>.</p>

<a href="#"><img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat"></a>

<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
<form action="/submit-cat-photo">
<label><input type="radio" name="indoor-outdoor"> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality"> Loving</label>
<label><input type="checkbox" name="personality"> Lazy</label>
<label><input type="checkbox" name="personality"> Crazy</label>
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>
</div>
dont forget the closing div at the bottom
that caught me out
mjqblade
@mjqblade
Feb 16 2016 20:09

need help

greg
@wearenotgroot
Feb 16 2016 20:10
@clarkarnold remember scope also no need to stringify anything just get it directly on json parameter
var arr;
var url;
var lat; 
var lon;
var str;

if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position) {
    $("#data").html("latitude: " + position.coords.latitude + "<br>longitude: " + position.coords.longitude);
    lon = position.coords.longitude;
    lat = position.coords.latitude;
    url = "http://api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + lon + "&appid=44db6a862fba0b067b1930da0d769e98&units=imperial";
    runFun(); //<---------------as mentioned call this here to insure the lat and lon are set
  });

}



function runFun() {
  $.getJSON(url, function(json) {
    console.log(json);
    arr = json; //<-------------no need for  this
    str = JSON.stringify(json); ///<-----------no need for this
//move here to reach the json/data
    $("#test").html("City: " + json.name + "<br>Temp: " + json.main.temp + "<br>Wind: " + json.wind.speed + " MPH from " + json.wind.deg + " degrees" + "<br>Weather Conditions: " + json.weather[0].main);

  });
  //<---------------couldnt reach the variable from here move it up
};
Ednacode (New to Github and making mistakes)
@EdnaMode
Feb 16 2016 20:11
@mjqblade @mjqblade just sent help to you
cant u not see code???
mjqblade
@mjqblade
Feb 16 2016 20:11
<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
  .red-text {
    color: red;
  }

  h2 {
    font-family: Lobster, Monospace;
  }

  p {
    font-size: 16px;
    font-family: Monospace;
  }

  .thick-green-border {
    border-color: green;
    border-width: 10px;
    border-style: solid;
    border-radius: 50%;
  }

  .smaller-image {
    width: 100px;
  }
</style>

<h2 class="red-text">CatPhotoApp</h2>

<p>Click here for <a href="#">cat photos</a>.</p>

<a href="#"><img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat"></a>

<p>Things cats love:</p>
<ul>
  <li>cat nip</li>
  <li>laser pointers</li>
  <li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
  <li>flea treatment</li>
  <li>thunder</li>
  <li>other cats</li>
</ol>
<form action="/submit-cat-photo">
  <label><input type="radio" name="indoor-outdoor"> Indoor</label>
  <label><input type="radio" name="indoor-outdoor"> Outdoor</label>
  <label><input type="checkbox" name="personality"> Loving</label>
  <label><input type="checkbox" name="personality"> Lazy</label>
  <label><input type="checkbox" name="personality"> Crazy</label>
  <input type="text" placeholder="cat photo URL" required>
  <button type="submit">Submit</button>
</form>

help level 74 or Use Responsive Design with Bootstrap Fluid Containers

Clark Arnold
@clarkarnold
Feb 16 2016 20:12
@wearenotgroot OK I will give that a try thanks!
CamperBot
@camperbot
Feb 16 2016 20:12
clarkarnold sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:warning: clarkarnold already gave wearenotgroot points
greg
@wearenotgroot
Feb 16 2016 20:13
@clarkarnold :+1:
@mjqblade re-read instruction
@mjqblade where is the <link> for bootstrap!!!!!
@mjqblade from instruction:
You can add Bootstrap to any app just by including it by adding the following code to the top of your HTML:

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"/>
@mjqblade add that on the top of the page
Clark Arnold
@clarkarnold
Feb 16 2016 20:18
@wearenotgroot Got it working now thanks again
CamperBot
@camperbot
Feb 16 2016 20:18
clarkarnold sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:warning: clarkarnold already gave wearenotgroot points
greg
@wearenotgroot
Feb 16 2016 20:18
@clarkarnold :+1:
wyattelliott
@wyattwade
Feb 16 2016 20:22
Finally fixed it up a bit. At least that one chunk of code. Couldn't have done it without you thanks again man @h4r1m4u . Have a good night
CamperBot
@camperbot
Feb 16 2016 20:22
wyattwade sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1419 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
Robert Uivarosi
@URobert
Feb 16 2016 20:48
@SaintPeter thanks
CamperBot
@camperbot
Feb 16 2016 20:48
urobert sends brownie points to @saintpeter :sparkles: :thumbsup: :sparkles:
:star: 2500 | @saintpeter | http://www.freecodecamp.com/saintpeter
Sebastian Chirila
@DrSebic
Feb 16 2016 20:55
Hey guys! I am currently working on my portfolio project. I have a question about the portfolio part of the website. The page that we have as a model has projects as a div with an image of the actual project.
I am trying to find a way to get a picture of my own ziplines. Do you have any idea how to do that?
Bruce Young
@mutantspore
Feb 16 2016 20:56
@DrSebic screen shot
Sebastian Chirila
@DrSebic
Feb 16 2016 20:56
But how do you load that into codepen?
Bruce Young
@mutantspore
Feb 16 2016 20:57
you’ll have to host it somewhere. like http://postimage.org
or even dropbox if you mak eit public
Sebastian Chirila
@DrSebic
Feb 16 2016 20:58
I will try it with dropbox. Thanks @mutantspore!
CamperBot
@camperbot
Feb 16 2016 20:58
drsebic sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1133 | @mutantspore | http://www.freecodecamp.com/mutantspore
Bruce Young
@mutantspore
Feb 16 2016 20:58
just don’t use imgur.. it fails
Adam Yuhasz
@jayuhasz
Feb 16 2016 21:04
imgur TOS specifically says "don't link to your website" so yeah...
wyattelliott
@wyattwade
Feb 16 2016 21:26
I've had problems with Dropbox for some reason, not sure why
Only with recent versions tho
How's it going @mutantspore
Bruce Young
@mutantspore
Feb 16 2016 21:27
@wyattwade :) good. you hav eto fiddle with teh dropbox url to get it right
Larry Simiyu
@LarrySimiyu
Feb 16 2016 21:33
can some one help me with the portfolio project
batilc1
@batilc1
Feb 16 2016 21:39
hello frontendies! I finally did make a 3D simon game with pure-css pouring a lot of effort in it! please check it out, you can switch between 2d and 3d graphics. Zoom in to see the height :D http://codepen.io/batilc/pen/rxbadv
idietmoran
@idietmoran
Feb 16 2016 21:42
@batilc1 having an issue, it asks for the same inputs everytime instead of a random one.
batilc1
@batilc1
Feb 16 2016 21:44
@idietmoran oh having the same issue as well, wasnt happening 10min ago :S
Doandes Razvan
@Fuzyon
Feb 16 2016 21:47
Can someone tell me why I can't vertically align all the content in my body in this project? I know my css is probably messy, still learning
http://codepen.io/Fuzyon/pen/KVJBLW
Bruce Young
@mutantspore
Feb 16 2016 21:49
@Fuzyon as I mentioned earlier this rounding of your lat and lon is making your location very inaccurate .. 40 miles off for me.
var latitude = Math.round(position.coords.latitude);
 var longitude = Math.round(position.coords.longitude);
batilc1
@batilc1
Feb 16 2016 21:51
@idietmoran it is working perfectly right now? I dont understand, i did not do anything?
Doandes Razvan
@Fuzyon
Feb 16 2016 21:52
@mutantspore changed that, thanks
CamperBot
@camperbot
Feb 16 2016 21:52
fuzyon sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1134 | @mutantspore | http://www.freecodecamp.com/mutantspore
Doandes Razvan
@Fuzyon
Feb 16 2016 21:52
it's not gonna be perfect, even the official website doesn't get my exact location.
Bruce Young
@mutantspore
Feb 16 2016 21:53
@Fuzyon it’s correct now
Doandes Razvan
@Fuzyon
Feb 16 2016 21:53
good! :D any idea for centering? display:flex and align-items: center messes up everything
Bruce Young
@mutantspore
Feb 16 2016 21:55
Screen Shot 2016-02-16 at 4.54.38 PM.png
is that not what you wanted?
wyattelliott
@wyattwade
Feb 16 2016 21:56
@mutantspore I know I tried for a while!! I'll give dropbox another go soon. I like it a lot except for when that happens
Bruce Young
@mutantspore
Feb 16 2016 21:56
@Fuzyon or do you want everything … including teh title etc to move down to be centered?
wyattelliott
@wyattwade
Feb 16 2016 21:57
Hey man @mutantspore I've been working on this for weeks. The ai was done last week but I just redid a lot of the code. I still need to rename function and comment better. Some of the code probably still needs to be cleaned up. This is due tomorrow for an apprenticeship tomorrow
lemme get it on codepen 1 se4c
I know you're busy but if you want criticize the hell out of it lol
Doandes Razvan
@Fuzyon
Feb 16 2016 21:58
@mutantspore yep
i wrapped everything with a container div and gave it margin-top: 5%, it's close but I don't think it's the best solution
wyattelliott
@wyattwade
Feb 16 2016 21:59
This message was deleted
I got most of the bugs I think. There may still be more . If anyone has any type of criticism it's very appreciated. Thanks
Doandes Razvan
@Fuzyon
Feb 16 2016 22:01
@wyattwade I just won one and it alerted "Tie!", might want to get that checked out
wyattelliott
@wyattwade
Feb 16 2016 22:01
do you know what combination you used to win?
its not supposed to be winable
shit....
Doandes Razvan
@Fuzyon
Feb 16 2016 22:02
vertical line down the middle
haha
I'm a god, lol
i just won again the same way
it's probably that combination that gives you trouble
wyattelliott
@wyattwade
Feb 16 2016 22:03
top middle bottom?
mid top - mid mid- bottom mid?
Doandes Razvan
@Fuzyon
Feb 16 2016 22:03
wait
i'll take a pic
wyattelliott
@wyattwade
Feb 16 2016 22:03
k
where'd you go first second and third?
Doandes Razvan
@Fuzyon
Feb 16 2016 22:04
middle, top right and left middle
batilc1
@batilc1
Feb 16 2016 22:05
can anyone explain how display flex works?
CamperBot
@camperbot
Feb 16 2016 22:05
no wiki entry for: flex
Bruce Young
@mutantspore
Feb 16 2016 22:05
@wyattwade it doesn’t really show you the winning (or generally final) move. an alert box pops up with the status but the game board isn’t updated. Alo have alook at using a modal or something else than an alert.
batilc1
@batilc1
Feb 16 2016 22:06
can anyone explain how display flex works please?
wyattelliott
@wyattwade
Feb 16 2016 22:06
I like that idea @mutantspore
thanks @mutantspore
CamperBot
@camperbot
Feb 16 2016 22:06
wyattwade sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1135 | @mutantspore | http://www.freecodecamp.com/mutantspore
wyattelliott
@wyattwade
Feb 16 2016 22:06
@Fuzyon It doesn't happen with me. Would you mind sending a screen-shot?
Doandes Razvan
@Fuzyon
Feb 16 2016 22:07
ya, sec
wyattelliott
@wyattwade
Feb 16 2016 22:07
@mutantspore were you able to beat it?
Doandes Razvan
@Fuzyon
Feb 16 2016 22:09
alt
and it's my turn :D
wyattelliott
@wyattwade
Feb 16 2016 22:09
did you go middle - top right - left - bottom?
and thanks @Fuzyon I'll get on thsi now
CamperBot
@camperbot
Feb 16 2016 22:09
wyattwade sends brownie points to @fuzyon :sparkles: :thumbsup: :sparkles:
:star: 177 | @fuzyon | http://www.freecodecamp.com/fuzyon
Doandes Razvan
@Fuzyon
Feb 16 2016 22:10
middle - top right - left middle
after that I put one on bottom middle then he puts one bottom right, instead of blocking me by placing one top middle
that's the issue
wyattelliott
@wyattwade
Feb 16 2016 22:11
replicated it
good catch @Fuzyon
fixing it now
Doandes Razvan
@Fuzyon
Feb 16 2016 22:11
good luck! :P
Pedro Abel Díaz Sánchez
@coderHook
Feb 16 2016 22:12

Guys, I am doing the calculator and I find this curios thing.
Is there something in the text input that makes the string appear inverse?

I display the same string somewhere in the html webpage, inside a div I mean. And also, the same string inside the input text, and It appears inversed.

Is there smt I have to know in order to solve it?

http://codepen.io/DiazPedroAbel/pen/pgRXWv?editors=1010

forget about memo_inv, I was trying to redo the string but inverse to sove the problem but I couldn't for the moment.

Ulises Rangel
@urangel
Feb 16 2016 22:16
How does one indent bullets without only indenting the text after the bulletpoint
oh maybe, i want aligning instead of indenting... looking further into
Lanitta
@DivaWeb
Feb 16 2016 22:33
hello everyone
Adam Yuhasz
@jayuhasz
Feb 16 2016 22:37
@Abel1987 you have the javascript displaying it that way.
Casey Heath
@ExhibitArts
Feb 16 2016 22:38
Does anyone know why my website only fits 30% of the page on the iPhone 4 but fits the width perfectly on other phones. - http://colinflaherty-websitedesign.byethost8.com/?ckattempt=1
Adam Yuhasz
@jayuhasz
Feb 16 2016 22:38
@Abel1987 some of the issue is you're treating the digits and operators separately for display purposes, if you treated them the same, there wouldn't be an issue.
batilc1
@batilc1
Feb 16 2016 22:42
Do i have to use React to finish the React challenges?
Bruce Young
@mutantspore
Feb 16 2016 22:48
@ExhibitArts not sure what you mean. it seems to be as intended on both the chrome dev tools iPhone 4 simulator and a real iPhone 4
@ExhibitArts though your mobile menu doesn’t seem to work. is it using bootstrap? you need bootstrap.css , jQuery.js and bootstrap.js for that
Casey Heath
@ExhibitArts
Feb 16 2016 22:52
@mutantspore Yes I know that. I haven't worked on that part yet. It's wierd because on my iphone it doesn't look right. Another person said the same thing and he had an iPhone aswell.
idietmoran
@idietmoran
Feb 16 2016 22:53

@ExhibitArts

are you trying to center it on full screen?

Casey Heath
@ExhibitArts
Feb 16 2016 22:55
@idietmoran It's supposed to look like this on mobile. - https://gyazo.com/686c52f97ae2d2c1f9ef18a79a5e4e6f
Mateus Felipe C. C. Pinto
@mateusfccp
Feb 16 2016 22:58
@batilc1 Yes.
idietmoran
@idietmoran
Feb 16 2016 23:10

@ExhibitArts
check this

http://i.imgur.com/Nsndksk.png

look at the changes made below, might have to mess with it some more to center it but that's what you're looking for i believe

you also have to change all your media queries i believe
Murray Baker
@MurrayBakerWebDeveloper
Feb 16 2016 23:18
On the Local Weather Zipline, what is a route for displaying the Open Weather API
steve
@davidsonsteve
Feb 16 2016 23:20
does anybody know of any good resources for trying to complete the wiki search zipline? i've tried the wiki api page and everything else i could find with google but am still super lost on it all and not really progressing.
Murray Baker
@MurrayBakerWebDeveloper
Feb 16 2016 23:23
FIrst search search bar's with website/url endpoints. Second search for a randomize button. @davidsonsteve
steve
@davidsonsteve
Feb 16 2016 23:26
i've been able to retrieve json data from wikipedia but changing the request url to send back the specific info i want and trying to use their sandbox for generating it hasn't been working for me
idietmoran
@idietmoran
Feb 16 2016 23:29
@davidsonsteve post your code
steve
@davidsonsteve
Feb 16 2016 23:32
 $.getJSON("http://en.wikipedia.org/w/api.php?action=query&format=json&prop=extracts&list=search&indexpageids=1&exsentences=4&exintro=1&explaintext=1&exsectionformat=plain&limit=10&prop=pageimages|extracts&pilimit=max&exintro&explaintext&exsentences=1&exlimit=max&srsearch=" + input + "&callback=?", function(json) {
       var myData = json;
       console.log(myData);
     console.log(myData.query.search[0].title);
console.log(myData.query.search[0].snippet);
  });
the console.logs work as i expect them to
oops above that var input="dogs"; a static var for now
idietmoran
@idietmoran
Feb 16 2016 23:34
@davidsonsteve have you checked the error in your browsers console?
@davidsonsteve iirc you need to use JSONP with the wiki API.
steve
@davidsonsteve
Feb 16 2016 23:37
my console prints out "Dogs", the title of [0] in the returned array and then the snippet from it, no error. it's just when i try to modify that url to retrieve different information then i get errors about MIME types or that the property of "search" is undefined. I've got the "&callback=?" in there at the end though, so it's returning results
idietmoran
@idietmoran
Feb 16 2016 23:39
@davidsonsteve might be an issue with your input command then, or you aren't running the .getJSON on click maybe.
steve
@davidsonsteve
Feb 16 2016 23:42
yeah i'm having trouble formulating a good input command that returns basically just the titles, descriptions, and page IDs. that's the only one i've had any luck with but it doesn't return the page id. thanks, i'll keep trying with it
batilc1
@batilc1
Feb 16 2016 23:51

@davidsonsteve you better use $.ajax and give those parameters like :

data: {
   action: 'query',
   exintro: 1,
   ...
}

so that you can do modifications easily, and your code is readable as well.
also, have a look at generators in wikipedia api

steve
@davidsonsteve
Feb 16 2016 23:54
hey thanks, i'll check into those. sounds like i got some reading to do because i was way off in my approach
morganmay
@morganmay
Feb 16 2016 23:56
I'm working on the first challenge, and I've run into an odd issue with CodePen. When I attempt to load Bootstrap through CodePen's options as instructed, it doesn't load; adding Bootstrap classes to elements does nothing. However, if I copy the CDN code from http://getbootstrap.com/getting-started/ into the project, Bootstrap loads properly. I don't have this problem with the other libraries like jQuery. Has anyone else encountered this?