These are chat archives for FreeCodeCamp/HelpFrontEnd

5th
Jun 2016
@aryandua I'd get comfortable with html/css before moving on to js
otherwise, you'll just hit impassable walls over and over
George Phalen
@gphalen
Jun 05 2016 00:12
Can anyone look at my Twitchtv project? I think I've fulfilled all the user stories, but I want to be sure.
Bruce Young
@mutantspore
Jun 05 2016 00:13
@gphalen go for it
George Phalen
@gphalen
Jun 05 2016 00:14
CamperBot
@camperbot
Jun 05 2016 00:14
gphalen sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1709 | @mutantspore |http://www.freecodecamp.com/mutantspore
George Phalen
@gphalen
Jun 05 2016 00:14
keep in mind I'm planning to fix the code up regardless, just want to know if I fulfilled the user stories.
JD Tadlock
@jdtdesigns
Jun 05 2016 00:15
@gphalen hmm, lots of repeated code and html in the css
George Phalen
@gphalen
Jun 05 2016 00:16
HTML in the CSS was a mistake, removed that.
I know there's repeated code, I'm planning to bring some Angular into it later to make it more succinct.
just want to know if user stories are fulfilled.
Manny
@Alloffices
Jun 05 2016 00:17
List of popular color pallets around the web: https://goo.gl/ery2GP
JD Tadlock
@jdtdesigns
Jun 05 2016 00:18
@gphalen, try to do clean it up in jquery before using a framework
you should be very very comfortable in vanilla js before going to angular
Bruce Young
@mutantspore
Jun 05 2016 00:18
@gphalen well you have hard coded in the 2 troublesome members . it will obviously only work for them
George Phalen
@gphalen
Jun 05 2016 00:19
@mutantspore is that improper? they gave us a list of names, so I just went with that.
@jdtdesigns I have a mentor of sorts who's trying to sell me on Angular, I've done a bit and find it reasonably intuitive.
Bruce Young
@mutantspore
Jun 05 2016 00:20
@gphalen yes but you should just submit them to teh api and see what comes back and deal with that
@gphalen the user story
I will see a placeholder notification if a streamer has closed their Twitch account (or the account never existed). You can verify this works by adding brunofin and comster404 to your array of Twitch streamers.
George Phalen
@gphalen
Jun 05 2016 00:21
@mutantspore I tried doing a getJson for the members with closed accounts and it wouldn't do anything, I took that to mean JSON isn't compatible with closed accounts.
Bruce Young
@mutantspore
Jun 05 2016 00:22
that means if i send off one of those or any other crap one.. your code will see th eerror situation and deal with it
@gphalen do you have the browser dev console open when you are running your code?
George Phalen
@gphalen
Jun 05 2016 00:23
ok, makes sense, I'll improve that portion
no, I don't
Bruce Young
@mutantspore
Jun 05 2016 00:24
@gphalen that is critical to see what’s happening in any of these exercises. it will make it much easier to know what’s going on. also you can log info to the console (console.log()) and help debug your code
i bludgeon my projects to death with console.log lol
George Phalen
@gphalen
Jun 05 2016 00:26
@mutantspore I want to do something like this to verify if a given username is valid.
if(!"https://www.twitch.tv/" +members[i])
body9.append("Account Closed");
Bruce Young
@mutantspore
Jun 05 2016 00:26
@gphalen look for data.status
if it’s 422 it’s closed. if it’s 404 it doesn’t exist
George Phalen
@gphalen
Jun 05 2016 00:28
@mutantspore so, like this?
$.getJSON('https://api.twitch.tv/kraken/streams/noobs2ninjas', function(data) {
if (data.status== 422 || data.status==404){
  body8.append("Account Closed");
}
    else{
      if (data.stream === null) {
        body8.append(":" + "Not currently streaming on Twitchtv.");
      } else
        body8.append(":" + "Currently streaming on Twitchtv.");

    }

    });
Bruce Young
@mutantspore
Jun 05 2016 00:29
@gphalen loop through your members list using something like .forEach or .map or a for loop with a closure (look it up)
@gphalen might work .. “suck it and see” lol
@gphalen wel your example is just looking at noobs2ninjas
George Phalen
@gphalen
Jun 05 2016 00:31
@mutantspore Tried it with brunofin, nothing came back. Seems like getJSON just isn't compatible with closed accounts.
JD Tadlock
@jdtdesigns
Jun 05 2016 00:32
@gphalen getJSON will work ;)
Bruce Young
@mutantspore
Jun 05 2016 00:32
@gphalen I have to rework my menu but…
http://codepen.io/MutantSpore/full/jrEBgq/
@gphalen do you have your console open yet. just right click on the web page area and select ‘inspect’ or something like that depending on which browser you are using
I’m not suggesting you look at my code.. just that this is all possible
George Phalen
@gphalen
Jun 05 2016 00:35
@mutantspore I'm on Safari, I'm not sure what my equivalent of "Inspect" is...
DonFilip
@DonFilip
Jun 05 2016 00:36
Have anyboy idea why fontawesome icon don't wanna work? i try to put <link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css"> in header but nothing heppened. it's in the AROUND class? thank you
*anybody
Bruce Young
@mutantspore
Jun 05 2016 00:37
@gphalen @gphalen ‘inspect element`
DonFilip
@DonFilip
Jun 05 2016 00:37
tried but siple don't show any icon and i don't know why
Bruce Young
@mutantspore
Jun 05 2016 00:40
@DonFilip you can just paste that link into the css settings in codepen
DonFilip
@DonFilip
Jun 05 2016 00:40
yes
but got the similar problm with bootstrap doesn't work i think because of jquery one page scroll
tried
Jonathan Davey
@Jdeadevil
Jun 05 2016 00:42
Guys, why isn't Font Awesome working on my portfolio? https://codepen.io/Jdeadevil/pen/KMKYQd
George Phalen
@gphalen
Jun 05 2016 00:42
@mutantspore Google tells me I'd find that under the "Advanced" section of "Preferences," not finding it there...
Jonathan Davey
@Jdeadevil
Jun 05 2016 00:42
I have it in my CSS that points directly to the file on my server, I copied and pasted one of the examples
DonFilip
@DonFilip
Jun 05 2016 00:43
the similar problem
Bruce Young
@mutantspore
Jun 05 2016 00:48
@DonFilip @DonFilip I have removed all your adding of stuff as it’s in the wrong spot and some is wrong and missing some.. I have added it all in the codepen setting (css and js) and put your little bit of js in the js tab.
http://codepen.io/MutantSpore/pen/GqJXJM
tommy
@tommygebru
Jun 05 2016 00:49
Jonathan Davey
@Jdeadevil
Jun 05 2016 00:50
@tommygebru That's the URL to the Font Awesome file on my serber
server*
tommy
@tommygebru
Jun 05 2016 00:50

@Jdeadevil remove that and instead use this in your html list of links

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

ok i understand now :+1:
Jonathan Davey
@Jdeadevil
Jun 05 2016 00:51
Hmm, good shout though to putting it in the head instead, I'll try it and see what happens
tommy
@tommygebru
Jun 05 2016 00:51
i guess you have to make the file connect with your css stylesheet
Bruce Young
@mutantspore
Jun 05 2016 00:51
@gphalen all yo have to do in any browser in right click on teh web page you are looking at and select safari “inspect Element” .. chrome .. ‘inspect"
Jonathan Davey
@Jdeadevil
Jun 05 2016 00:52
Eh still doesn't budge
George Phalen
@gphalen
Jun 05 2016 00:52
oh OK, got it
DonFilip
@DonFilip
Jun 05 2016 00:54
@mutantspore Thank you, i will try to do something, but technicli many things han doesn't work
CamperBot
@camperbot
Jun 05 2016 00:54
donfilip sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1710 | @mutantspore |http://www.freecodecamp.com/mutantspore
DonFilip
@DonFilip
Jun 05 2016 00:54
*than
Manny
@Alloffices
Jun 05 2016 00:58
@needsMoreCoffee Still in the works - thanks!
CamperBot
@camperbot
Jun 05 2016 00:58
alloffices sends brownie points to @needsmorecoffee :sparkles: :thumbsup: :sparkles:
:cookie: 309 | @needsmorecoffee |http://www.freecodecamp.com/needsmorecoffee
DonFilip
@DonFilip
Jun 05 2016 00:58
@mutantspore I found this icons and it works http://www.sabinanore.com/design/html-special-symbols/
Bruce Young
@mutantspore
Jun 05 2016 01:00
@DonFilip icon from font awsome was working on my fork of yours
the github one
DonFilip
@DonFilip
Jun 05 2016 01:01
@mutantspore yes but other things doesn't :)
Bruce Young
@mutantspore
Jun 05 2016 01:01
and the music
DonFilip
@DonFilip
Jun 05 2016 01:02
but they don't gott social icons :(
:)
Bruce Young
@mutantspore
Jun 05 2016 01:02
@DonFilip fontawaseone?? yes they do
DonFilip
@DonFilip
Jun 05 2016 01:03
no no
this new site i sent you
Bruce Young
@mutantspore
Jun 05 2016 01:03
ok
DonFilip
@DonFilip
Jun 05 2016 01:03
fontawaseone got
but if i put everything you show me then other things doesn't work
Bruce Young
@mutantspore
Jun 05 2016 01:06
you need to take all that style stuff out of your html.. make them classes in the CSS. also I think the html has a lot of errors in it. I think you may have some quote marks in the wrong place and it’s throwing everything out
Bruce Young
@mutantspore
Jun 05 2016 01:12
@DonFilip this line for example .. remove the ; and the extra there are several like that
<img src="https://dl.dropboxusercontent.com/s/6y800o5p29p03jp/Prva%20strelica.jpg" alt="Strelica1" ; “>
DonFilip
@DonFilip
Jun 05 2016 01:13
when i was read about that one page sroll jquery thing, it writted "put that in HTML" and than everything gone worng :) bootstrap doesn't work too
Bruce Young
@mutantspore
Jun 05 2016 01:16
@DonFilip well in the code you posted .. you don’t actually load boostrap.css anywhere that I can see. it also requires jquery.js and bootstrap.js (3 files)
DonFilip
@DonFilip
Jun 05 2016 01:16
i tried and i dind't work
and then i removed
plan is that try it again in the end when i finish few more things and then to do responsive
Robson Beaudry
@Robson-Beaudry
Jun 05 2016 01:17
Does anyone know how to extend background colour over line breaks? I'm trying to get a background colour through CSS, but it won't extend to the title or the <br>'s (the <br>'s won't take any color).
http://codepen.io/robsonbeaudry/pen/beGEXp?editors=0100
Bruce Young
@mutantspore
Jun 05 2016 01:17
wel don’t try to use script or link tags in your html when you use codePen. use the quick add feature in the setting options .. look in css and js
Lisa
@aGirlWhoCodes
Jun 05 2016 01:18

Hello! Question here. In JS is this if-statement working?

if (status === 'Online') {
$('.resultsPart img').css('border','3px solid #BCED91');
}

Or do I need something like stringcompare?

DonFilip
@DonFilip
Jun 05 2016 01:18
u right but now i get in it so i gotta finish on some way :)
Lisa
@aGirlWhoCodes
Jun 05 2016 01:18
if (status === 'Online') {
$('.resultsPart img').css('border','3px solid #BCED91');
}
Jonathan Davey
@Jdeadevil
Jun 05 2016 01:21
Why does fa fa-codepen look work on my site? https://codepen.io/Jdeadevil/pen/KMKYQd
not work*
JD Tadlock
@jdtdesigns
Jun 05 2016 01:21
@aGirlWhoCodes it could work depending on what status is outputting
buiphuking
@buiphuking
Jun 05 2016 01:23
hi guys, i code tic tac toe, i put debugger in js, but i want to know exactly a line working or not, how can i do that ?
Lisa
@aGirlWhoCodes
Jun 05 2016 01:23
@jdtdesigns status is putting 'Offline' or 'Online' or 'Account Closed'.. Although the code inside the if-statement is also affecting 'Offline' cases and sometimes 'Online' cases aren't changing like they should..
Greg Duncan
@GregatGit
Jun 05 2016 01:23
@aGirlWhoCodes it could be done by creating an online and offline class
JD Tadlock
@jdtdesigns
Jun 05 2016 01:25
@aGirlWhoCodes post the codepen if you don't mind
Greg Duncan
@GregatGit
Jun 05 2016 01:25
@Jdeadevil are they fonts awesome? If they are you have to add that in the css
parisempress
@parisempress
Jun 05 2016 01:25
@parisempress
has anyone worked with meteor before?
thanks
CamperBot
@camperbot
Jun 05 2016 01:25
sorry parisempress, you can't send brownie points to yourself! :sparkles: :sparkles:
Lisa
@aGirlWhoCodes
Jun 05 2016 01:26
http://codepen.io/Didi987/pen/qNdmrK @GregatGit @jdtdesigns
Greg Duncan
@GregatGit
Jun 05 2016 01:26
@Jdeadevil sorry - I see you already have
Jonathan Davey
@Jdeadevil
Jun 05 2016 01:26
yep
Greg Duncan
@GregatGit
Jun 05 2016 01:28
@Jdeadevil I put them in like this <i class="fa fa-github fa-lg"></i>
JD Tadlock
@jdtdesigns
Jun 05 2016 01:29
@aGirlWhoCodes what's the issue?
Jonathan Davey
@Jdeadevil
Jun 05 2016 01:29
Well the FA for CodePen is fa fa-codepen, so no idea why it's not appearing
Lisa
@aGirlWhoCodes
Jun 05 2016 01:32
@jdtdesigns The circle around the pictures are supposed to turn green when they are 'Online' or streaming.. To accomplish that I made an if-statement which I showed you before. The if-statement isn't making working properly.. Sometimes making 'Offline' green and sometimes it leaves 'Online' red..
Thats why I was wondering if it was ok to write the if-statement like that.. If it's ok to compare the content of a variable like that..
Greg Duncan
@GregatGit
Jun 05 2016 01:34
@aGirlWhoCodes when you are building the html if you give them a clas of 'online' or offline - then in your css you can shape them however you want - also you can hide() and show() them very easy
JD Tadlock
@jdtdesigns
Jun 05 2016 01:34
@aGirlWhoCodes what greg said
Lisa
@aGirlWhoCodes
Jun 05 2016 01:36
@jdtdesigns I see now I commented the if-statement out in the codepen i sent to you..
@GregatGit How can I give a class to a changing variable?
JD Tadlock
@jdtdesigns
Jun 05 2016 01:38
@aGirlWhoCodes just put the status in as a class
change it to lowercase
Greg Duncan
@GregatGit
Jun 05 2016 01:39
@Jdeadevil i just tried it and the fa-codepen doesn't work on mine either
Jonathan Davey
@Jdeadevil
Jun 05 2016 01:40
weird
Lisa
@aGirlWhoCodes
Jun 05 2016 01:41
@jdtdesigns I am sorry.. can you give me an example
Greg Duncan
@GregatGit
Jun 05 2016 01:43
@Jdeadevil delete the font awesome fromt setting and when you put the new one in it will be up-to-date
@Jdeadevil fa-codepen must be new
Jonathan Davey
@Jdeadevil
Jun 05 2016 01:44
what do you mean? just get the most update ver?
Greg Duncan
@GregatGit
Jun 05 2016 01:44
@Jdeadevil take out font awesome then add it again
@Jdeadevil it should be version 4.6.2
Jonathan Davey
@Jdeadevil
Jun 05 2016 01:45
ah ok
Ah, I added 4.6.3 but it still won't appear
Lisa
@aGirlWhoCodes
Jun 05 2016 01:48
Great! Thanks A lot Guys! @jdtdesigns @GregatGit
CamperBot
@camperbot
Jun 05 2016 01:48
agirlwhocodes sends brownie points to @jdtdesigns and @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 441 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
:cookie: 558 | @gregatgit |http://www.freecodecamp.com/gregatgit
JD Tadlock
@jdtdesigns
Jun 05 2016 01:49
welcome ;)
Greg Duncan
@GregatGit
Jun 05 2016 01:49
@aGirlWhoCodes
str = 'offline';  // or online
'<div class="resultsPart row +' str + '">' +
buiphuking
@buiphuking
Jun 05 2016 01:50
someone help me plz, if my turn, show up YOUR TURN, if computer turn hide it, disabled a cell if you click more than 1 time, and if i or computer win, all the rest of cells disabled, plz help me!!!!!!!!!!!
http://codepen.io/buiphuking/pen/JKoEZG?editors=1010
Greg Duncan
@GregatGit
Jun 05 2016 01:53
@Jdeadevil typos fa-codepen no capitals
Bruce Young
@mutantspore
Jun 05 2016 01:54
@Jdeadevil codepen is all lowercase
Jonathan Davey
@Jdeadevil
Jun 05 2016 01:54
Aha! Finally it's working. Cheers @GregatGit and @mutantspore
Bruce Young
@mutantspore
Jun 05 2016 01:54
@Jdeadevil fa fa-codepen not fa fa-CodePen
:)
Jonathan Davey
@Jdeadevil
Jun 05 2016 01:55
Although now I'm running into a new problem
Why does my jQuery code fuck up my social media FB button? https://codepen.io/Jdeadevil/pen/KMKYQd
Robson Beaudry
@Robson-Beaudry
Jun 05 2016 01:56
Hi, does anyone know what this annoying white line is above my input, and how to get rid of it? (general feedback also welcome).
http://codepen.io/robsonbeaudry/pen/beGEXp?editors=1000
Greg Duncan
@GregatGit
Jun 05 2016 01:56
@aGirlWhoCodes don't forget to use the tidy button in the js section - make your code look neater
Bruce Young
@mutantspore
Jun 05 2016 01:58
@Jdeadevil @Jdeadevil wel you told it to change anything with class .btn and an a tag to be printed in white
and it did .. on hover
Greg Duncan
@GregatGit
Jun 05 2016 02:00
@Robson-Beaudry try deleting the form and start again
Jonathan Davey
@Jdeadevil
Jun 05 2016 02:00
@mutantspore I'm not sure if there's a CSS entry for what I'm trying to do. Basically, all the links have a black font color and white background, when I hover over them I want them to have their own social media hex colors (which I did) and white font... But having an a tag in there has fucked it up, now I can't fix it without it thinking I'm saying "When I hover over the letter, not the background"
So by using jQuery I was trying to say, when I hover over the background, change the color of the font to white
Robson Beaudry
@Robson-Beaudry
Jun 05 2016 02:06
@GregatGit Just tried, seems the line goes up the minute I put in the input tag
Lisa
@aGirlWhoCodes
Jun 05 2016 02:07
@GregatGit Thanks! I couldn't imagine this was possible! Glad I learned about it today :smile:
CamperBot
@camperbot
Jun 05 2016 02:07
agirlwhocodes sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:warning: agirlwhocodes already gave gregatgit points
Thomas Mullen
@t-mullen
Jun 05 2016 02:10
Has anyone here done video chat with peerjs?
My streams are lagging when the mouse isn't moving, but they are fine when it is.
Every browser I try has the same issue :/
Thomas Mullen
@t-mullen
Jun 05 2016 03:06
FIXED: autoplay must be set to true for mediaStreams
Paul
@pdbroadfoot
Jun 05 2016 03:58

Hi anyone, just wondering how people source their images for pages on codepen. Is there a repository to upload images and then you can use that web location for you img src attribute ? Or is it just locate the image on the web and use it if it available for use. (i.e. no copyright protection etc).

Thanks for any suggestions.

skilescm
@skilescm
Jun 05 2016 04:06
@pdbroadfoot , I just direct link to the images found online. (for a codepen anyway)
Paul
@pdbroadfoot
Jun 05 2016 04:13
Thanks @skilescm - I appreciate for a codepen that its a reasonable approach, but for a project its not that great as you want to control quality of image. My current solution is to upload to a git project and reference that, but I see that its https for the links and so assume a viewer without github access wouldn't see the image.
CamperBot
@camperbot
Jun 05 2016 04:13
pdbroadfoot sends brownie points to @skilescm :sparkles: :thumbsup: :sparkles:
:cookie: 157 | @skilescm |http://www.freecodecamp.com/skilescm
skilescm
@skilescm
Jun 05 2016 04:18
@pdbroadfoot , another thing I do if I need better control over an image or if its one of my own is to just host it on my own site and create the url. I got a years cpanel from ehost for $40. Really comes in handy at times.
Nguyễn Quốc Đại
@nqdai1992
Jun 05 2016 04:55
Hello everyone
I'm make project show the local weather
and I didn't see any the previous lesson to use api. Should I read or learn somthing to do it ?
thanks
Ruchita Save
@RuchitaSave
Jun 05 2016 04:59
Hello, can anyone provide me source for icons which I can use for my practice projects ?
Nguyễn Quốc Đại
@nqdai1992
Jun 05 2016 05:00
@RuchitaSave You can get icons in this link: http://fontawesome.io/icons/
Ruchita Save
@RuchitaSave
Jun 05 2016 05:04
@nqdai1992 thanks.
CamperBot
@camperbot
Jun 05 2016 05:04
ruchitasave sends brownie points to @nqdai1992 :sparkles: :thumbsup: :sparkles:
:cookie: 2 | @nqdai1992 |http://www.freecodecamp.com/nqdai1992
Isaac Pak
@pak11273
Jun 05 2016 05:15
does anybody read their fcc weekly digest?
you should check the latest success story. 5 months and landed his first web development job, the guy is a regular in the fcc chat.
Ryan
@ispeakcomputer
Jun 05 2016 05:21
@pak11273 crazy , I actually read that on Medium .
I could totally see that though.
Tulio Natale
@tuliodnw
Jun 05 2016 05:32
people im tryying to do the body background gradient, here http://www.w3schools.com/css/tryit.asp?filename=trycss3_gradient-linear the code works but not in codepen, can someone help?
Ryan
@ispeakcomputer
Jun 05 2016 05:33
Someone really working at it that is personable with a portfolio could definitely do it. There is a huge deficit for tech workers you could get sucked right up. Took me eight months but i got a good job in tech as a VoIP engineer ( tier ii, started as tier 1) just by listing all the projects I have done , webapps I installed for others along with other fun stuff I did in my own time with no prior "experience". I listed this as freelance to grab the attention of the hiring manager .I got a graphic designer to make me a nice resume and ran a blog with my tech ramblings just for the purpose of one day being hired in the next year. once i got the interview it was in the bag. Shoot for small shops or startups as the Corporate monsters want all kinds of certs or experience .
i think for a web guy a portfolio and the freelance for friends should be enough proof to hiring managers that are not too tech savvy .
Tulio Natale
@tuliodnw
Jun 05 2016 05:34
here is the code

background: -webkit-linear-gradient(red, yellow); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(red, yellow); /* For Opera 11.1 to 12.0 */
   background: -moz-linear-gradient(red, yellow); /* For Firefox 3.6 to 15 */

    background: linear-gradient(#F50057, #C51162);
Ryan
@ispeakcomputer
Jun 05 2016 05:36
@tuliodnw shoot , I wish i saved the codepen pen I made using this but i didn't or maybe I could help you.
Tulio Natale
@tuliodnw
Jun 05 2016 05:37
@needsMoreCoffee the code works on divs, but not in body, no idea why
Ryan
@ispeakcomputer
Jun 05 2016 05:37
i do remember I used the same codes for every entry .
@tuliodnw let me play with it i might have an idea.
Kay
@PandaProgrammer
Jun 05 2016 05:38
Hey so I am having some difficulty. I am writing the portfolio project and have my text set to 80% width and centered but I can't seem to center it on the page. I have tried looking for it and all I can get is text-align:center; and that is not working. I want the whole 80% centered. Help?
Coy Sanders
@coymeetsworld
Jun 05 2016 05:39
try setting the margins to auto @PandaProgrammer
Tulio Natale
@tuliodnw
Jun 05 2016 05:39
@needsMoreCoffee done, i had to put html{
height:100%;
Kay
@PandaProgrammer
Jun 05 2016 05:40
@coymeetsworld Thank you so much! It was driving me crazy! Something so simple of course.
CamperBot
@camperbot
Jun 05 2016 05:40
:star2: 1049 | @coymeetsworld |http://www.freecodecamp.com/coymeetsworld
pandaprogrammer sends brownie points to @coymeetsworld :sparkles: :thumbsup: :sparkles:
Coy Sanders
@coymeetsworld
Jun 05 2016 05:40
:thumbsup: yeah text-align will only work on text, for the container or div or whatever you're using you need to adjust margins
Kay
@PandaProgrammer
Jun 05 2016 05:41
@coymeetsworld okay that is much easier to understand
Ryan
@ispeakcomputer
Jun 05 2016 05:41
works somewhat for me . i can see stuff. http://codepen.io/needsmorecoffee/pen/MewPae
@tuliodnw got ya !
i notice when removing background: linear-gradient(#F50057, #C51162); it changed the colors maybe because the way you have hex plus the words?
for the listed colors. just FYI. New to the linear-gradient.
Tulio Natale
@tuliodnw
Jun 05 2016 05:43
@needsMoreCoffee thanks anyway
CamperBot
@camperbot
Jun 05 2016 05:43
tuliodnw sends brownie points to @needsmorecoffee :sparkles: :thumbsup: :sparkles:
:cookie: 310 | @needsmorecoffee |http://www.freecodecamp.com/needsmorecoffee
Kyle W Pilkinton
@tadake
Jun 05 2016 05:44
if i store a string in a variable is there anyway to assign something to the value of the string?
Ryan
@ispeakcomputer
Jun 05 2016 05:47
hey guys check this out. I get my JSON coming in which I see in console. I have the correct key choose now I just need to write this to the HTML and add some finishing touches . How would i write that to the HTML using .html() or .append() im alittle confused at the best course of action . http://codepen.io/needsmorecoffee/pen/JKoZwx
Kay
@PandaProgrammer
Jun 05 2016 05:48
ok another problem google can't understand. I want to style everything in CSS except my navigation bar. how do I exclude that in CSS without putting everything else in a div of its own?
Ryan
@ispeakcomputer
Jun 05 2016 05:48
@tadake thats a good question i know in ruby i did this with interpolation but not sure in JS .
kirbyedy
@kirbyedy
Jun 05 2016 05:49
@needsMoreCoffee $("#yourbox").html(yourdata)
@needsMoreCoffee btw your last line says appead intead of append
Kyle W Pilkinton
@tadake
Jun 05 2016 05:50
yeah i know how to do it in c but not JS lol @needsMoreCoffee
Ryan
@ispeakcomputer
Jun 05 2016 05:51
@kay .or at least add Id's to the elements tag and target that if the CSS you set is affecting multiples on your page .
i hope that helps.
@kirbyedy thanks !
CamperBot
@camperbot
Jun 05 2016 05:51
needsmorecoffee sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1059 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Ryan
@ispeakcomputer
Jun 05 2016 05:53
@kirbyedy woot! its in my html now . awesome thanks !!!!!
CamperBot
@camperbot
Jun 05 2016 05:53
needsmorecoffee sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:warning: needsmorecoffee already gave kirbyedy points
Ryan
@ispeakcomputer
Jun 05 2016 05:54
getting there...awesome.
Isaac Pak
@pak11273
Jun 05 2016 05:58
@needsMoreCoffee have you finished the FCC front-end yet?
Ryan
@ispeakcomputer
Jun 05 2016 06:01
@pak11273 no I have not.
only doing the quote generator now.
still got a ways to go .
Isaac Pak
@pak11273
Jun 05 2016 06:03
@needsMoreCoffee still landed an IT job, thats awesome
god dam. does anybody else here have a hard time reading through these mdn docs??
Ryan
@ispeakcomputer
Jun 05 2016 06:05
shit yeah
I just need one line that explains it in laymans terms 75% of the time.
Isaac Pak
@pak11273
Jun 05 2016 06:06
i end up down a ton of rabbit trails just to decipher one freakin thing, and an hour later...
Tulio Natale
@tuliodnw
Jun 05 2016 06:10

can someone tell me why the main body, isnt center? is the div with class clock, also tips and comments welcome

http://codepen.io/tuliodnw/pen/PzqebR?editors=1100

if you make the window smaller is more visible
Ryan
@ispeakcomputer
Jun 05 2016 06:12
@pak11273 i know . i feel the same. I was telling my girlfriend I search the internet for someone to put it in a way I can easy digest . This is usually one sentence .
Isaac Pak
@pak11273
Jun 05 2016 06:12
@needsMoreCoffee yeah, that's kinda what i do to.
Ryan
@ispeakcomputer
Jun 05 2016 06:13
I could really read into the great texts on each function , method , etc but i will go off into doing something totaly unrelated
must be ADD or something
taht what they tell me anyway , ha
@tuliodnw the timer body? that part looks center to me .
i sure if thats what yo mean .
Kyle W Pilkinton
@tadake
Jun 05 2016 06:15
take off position:absolute @tuliodnw and looks good!
Tulio Natale
@tuliodnw
Jun 05 2016 06:16
@tadake that fixed thank
CamperBot
@camperbot
Jun 05 2016 06:16
tuliodnw sends brownie points to @tadake :sparkles: :thumbsup: :sparkles:
:cookie: 380 | @tadake |http://www.freecodecamp.com/tadake
Tulio Natale
@tuliodnw
Jun 05 2016 06:17
@needsMoreCoffee thanks
CamperBot
@camperbot
Jun 05 2016 06:17
tuliodnw sends brownie points to @needsmorecoffee :sparkles: :thumbsup: :sparkles:
:warning: tuliodnw already gave needsmorecoffee points
Kyle W Pilkinton
@tadake
Jun 05 2016 06:19
welcome :+1: @tuliodnw
Sai Rahul
@rhhhhl
Jun 05 2016 08:41
hi, just leveled up to front end from jQuery..
quick question what is the min time period anyone completed front end dev challenge and earned the certificate ?
Dimitris Kako
@jimaginator
Jun 05 2016 10:06
hello everyone :)
i need some help with the wikipedia viewer
how is it possible to achieve live search?
Sorin Ruse
@sorinr
Jun 05 2016 10:20
Hi everybody. Can you test if my weather app its reporting the right location? Tnx in advance for your feedback. Here is my pen: https://codepen.io/sorinr/full/xOGdYz/
Sorin Ruse
@sorinr
Jun 05 2016 10:27
@jimaginator if you have an input field add an event to it to trigger a live search function. it depends on when do you want to trigger that function (on enter, onkeyup, ...)
Dimitris Kako
@jimaginator
Jun 05 2016 10:29
@sorinr thanks! i think onkeyup is what im looking for...
CamperBot
@camperbot
Jun 05 2016 10:29
jimaginator sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 316 | @sorinr |http://www.freecodecamp.com/sorinr
RompePC
@RompePC
Jun 05 2016 10:44
@rhhhhl Depends of the knowledge the people has when entering here. For me (and because my lazinness and life stuff and free time) is goind to be around 2 weeks more or less. Others could take 1 month, others maybe more, depends on you.
Akram
@niwox
Jun 05 2016 10:45
Hello guys, anyone comfortable with ejs ?
Ken Haduch
@khaduch
Jun 05 2016 10:50
@sorinr - weather location works fine for me.
coffeebeanzz
@coffeebeanzz
Jun 05 2016 10:59
@sorinr works for me too, nice background! :)
Greg Duncan
@GregatGit
Jun 05 2016 11:14
@sorinr Works great for me - great looking page - I really like it
@jimaginator What do you mean by a 'live search'?
Dimitris Kako
@jimaginator
Jun 05 2016 11:29
@GregatGit i mean searching while you typing without the need to hit a sumbit button
Greg Duncan
@GregatGit
Jun 05 2016 11:31
@jimaginator ok - thanks for that -
CamperBot
@camperbot
Jun 05 2016 11:31
gregatgit sends brownie points to @jimaginator :sparkles: :thumbsup: :sparkles:
:cookie: 324 | @jimaginator |http://www.freecodecamp.com/jimaginator
Rob Simpson
@pertrai1
Jun 05 2016 11:36
Hi, can't figure out the part of Spinal Tap for AllThe-smallthings test. This is what I have so far
var repl = /[\s-_]/g;
  return str.replace(repl, '-').toLowerCase();
having tough time with online regex to understand how to find lowercase character followed by uppercase character
davees
@davees
Jun 05 2016 11:37
$(document).ready(function() {
  $.getJSON("http://quotes.stormconsultancy.co.uk/random.json", function(data) {
    $("#quote").text(data.quote);

  });

});
guys any input on why im not getting a random quote when the page is loaded?
Greg Duncan
@GregatGit
Jun 05 2016 11:41
@sorinr You may want to update the clock on the page as time passes
Sorin Ruse
@sorinr
Jun 05 2016 11:58
@GregatGit yea it is a good idea. I also want to make it 5 days forecast . thank you
CamperBot
@camperbot
Jun 05 2016 11:58
sorinr sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 560 | @gregatgit |http://www.freecodecamp.com/gregatgit
Sorin Ruse
@sorinr
Jun 05 2016 11:59
@khaduch @coffeebeanzz thank you all for your feedback
CamperBot
@camperbot
Jun 05 2016 11:59
sorinr sends brownie points to @khaduch and @coffeebeanzz :sparkles: :thumbsup: :sparkles:
:cookie: 435 | @coffeebeanzz |http://www.freecodecamp.com/coffeebeanzz
:star2: 1258 | @khaduch |http://www.freecodecamp.com/khaduch
Greg Duncan
@GregatGit
Jun 05 2016 12:00
@sorinr Its a great looking page - i only notice the time because I left the page up for so long
Sorin Ruse
@sorinr
Jun 05 2016 12:04
@GregatGit every time you refresh the page it gets the current time.
Harshit Anand
@nerocool996
Jun 05 2016 12:55
This message was deleted
This message was deleted
Jacob Bogers
@jacobbogers
Jun 05 2016 12:57
any react JS gurus here?
Harshit Anand
@nerocool996
Jun 05 2016 12:58
$.getJSON("https://en.wikipedia.org/w/api.php?action=query&format=json&list=search&redirects=1&srsearch=title&srlimit=10",function(json){ alert("sucess"); });. Is something wrong here I am trying to make search request to wiki api
Greg Duncan
@GregatGit
Jun 05 2016 13:08
@nerocool996 can you put your pen up
Greg Duncan
@GregatGit
Jun 05 2016 13:08
your query url looks fine
Harshit Anand
@nerocool996
Jun 05 2016 13:08
Here it is
Greg Duncan
@GregatGit
Jun 05 2016 13:13
@nerocool996 try this url var url = "https://en.wikipedia.org/w/api.php?format=json&action=query&generator=search&gsrnamespace=0&gsrlimit=10&prop=pageimages|extracts&pilimit=max&exintro&explaintext&exsentences=1&exlimit=max&gsrsearch=" + title + "&callback=?";
Harshit Anand
@nerocool996
Jun 05 2016 13:15
@GregatGit Yeah that worked thanks :smile: . But do you know why because whenever I open my old link in the browser it works.
CamperBot
@camperbot
Jun 05 2016 13:15
nerocool996 sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 562 | @gregatgit |http://www.freecodecamp.com/gregatgit
Greg Duncan
@GregatGit
Jun 05 2016 13:17
@nerocool996 I found understanding the wiki's api more art than science
Harshit Anand
@nerocool996
Jun 05 2016 13:22
@GregatGit Hahahaha
Garwah Lam
@garwahl
Jun 05 2016 13:32
Hey guys can I get some feedback on my Wikipedia Viewer?
http://codepen.io/garwahl/pen/QEWzWR
Adetunji Iyaniwura
@Iadetunji
Jun 05 2016 14:04
pls how can i create a functional button that will link my portfolio page to my social media pages

http://codepen.io/Iadetunji/pen/QELEPW:pls

how can i create a functional button that will link my portfolio page to my social media pages

RompePC
@RompePC
Jun 05 2016 14:14
@Iadetunji Just use a <a> setting its href property to the URL of your social media page.
Adetunji Iyaniwura
@Iadetunji
Jun 05 2016 14:15
RompePC
@RompePC ,would the <a> be embeded in a button code ?
Amande
@wormwoods
Jun 05 2016 14:16
This message was deleted
RompePC
@RompePC
Jun 05 2016 14:16
@Iadetunji Nah, just use it with some own style, like background color, modify the style for :link and :visited, and you can go on
Adetunji Iyaniwura
@Iadetunji
Jun 05 2016 14:17
RompePC
@RompePC, can i use font awesome with it ?
RompePC
@RompePC
Jun 05 2016 14:20
@Iadetunji Of course, just insert the needed tag for the icon inside the anchor
Adetunji Iyaniwura
@Iadetunji
Jun 05 2016 14:21
RompePC
@RompePC,pls can you show me the code structure
RompePC
@RompePC
Jun 05 2016 14:23
@Iadetunji From http://fontawesome.io/examples/ : <i class="fa fa-camera-retro fa-lg"></i>
@Iadetunji That would go inside your <a>
@Iadetunji Anyway, here's a quick button style example:
.btn {
  /* Box-model */
  padding: 15px;

  /* Visual */
  background-color: #66ccff;
  border-radius: 10px;
}

.btn,
.btn:link,
.btn:visited {
  /* Typography */
  text-decoration: none;

  /* Visual */
  color: #fff;
}

.btn:hover {
  /* Visual */
  background-color: #0099e6;
}
Adetunji Iyaniwura
@Iadetunji
Jun 05 2016 14:25
RompePC
@RompePC, where wuld the button tag be after i add the fonte awesome ?
RompePC
@RompePC
Jun 05 2016 14:27
@Iadetunji Neither you use a <button> nor <a>, set inside iit the <i>.
@Iadetunji An example from the same page:
<a class="btn btn-default" href="#">
    <i class="fa fa-align-center" title="Align Center"></i>
  </a>
Adetunji Iyaniwura
@Iadetunji
Jun 05 2016 14:28
take a look at this : <a href="https://www.facebook.com/adetunji.teslimiyaniwura "><i class="fa fa-facebook-official" style="font-size:48px;color:#3B5998"></i></a>
RompePC
@RompePC
Jun 05 2016 14:38
@Iadetunji I would prefer seeing it into your pen, but looks nice altough.
Adetunji Iyaniwura
@Iadetunji
Jun 05 2016 14:40
RompePC
@RompePC,i just inserted the code to my pen and it has nt linked to my social network
RompePC
@RompePC
Jun 05 2016 14:40
@Iadetunji Put the pen here
Adetunji Iyaniwura
@Iadetunji
Jun 05 2016 14:41
RompePC
@RompePC
Jun 05 2016 14:42
@Iadetunji A <button> isn't a <a>, that's why you need to use it
@Iadetunji When you wanna link a URL, you need to use an anchor.
Adetunji Iyaniwura
@Iadetunji
Jun 05 2016 14:44
do you mean i shuld replace all the buttons with the <a> tag
ok
RompePC
@RompePC
Jun 05 2016 14:46
@Iadetunji Yep
Adetunji Iyaniwura
@Iadetunji
Jun 05 2016 14:49
RompePC
@RompePC,ill do that !
Adetunji Iyaniwura
@Iadetunji
Jun 05 2016 14:57
RompePC
@RompePC, i just tried it ,nd it has not work
RompePC
@RompePC,or does it require java scipt ?
RompePC
@RompePC
Jun 05 2016 14:58
@Iadetunji One <a> per social media link
Adetunji Iyaniwura
@Iadetunji
Jun 05 2016 14:59
RompePC
@RompePC, yea i just tried it for the first one ,nd it never worked
you can recheck my pen to see wht am saying
RompePC
@RompePC
Jun 05 2016 14:59
@Iadetunji I can enter your FB profile, so it has to work
Adetunji Iyaniwura
@Iadetunji
Jun 05 2016 15:00
did you enter through codepen ?
yerevin
@yerevin
Jun 05 2016 15:03
http://codepen.io/sirmmate/pen/ezYMYx
can somebody tell me why my click function push number so many times how long array is wide?
for example:
i have on 2nd level array as: arrGame[1,2]
if i click button 1 i get: arrPlayer[1,1]
i want to get: arrPlayer[1] after clicking first time and after clicking 2nd time button get arrPlayer[1,2]
what is wrong with this push functions on click?
RompePC
@RompePC
Jun 05 2016 15:08
@Iadetunji Yep
Amir Elsaeed
@Elmohandes
Jun 05 2016 15:08
how much should i know to start building "a Tribute Page".
i mean should i know bootstrap well at this point
RompePC
@RompePC
Jun 05 2016 15:09
@Elmohandes Knowing just about the grid and visibility from devices would be enough
Adetunji Iyaniwura
@Iadetunji
Jun 05 2016 15:13
RompePC
@RompePC,i kept trying it and it is nt working from my end
pls have you done anything similar to this before ?
RompePC
@RompePC
Jun 05 2016 15:14
@Iadetunji I will check, I'm sure you are doing some newbie errors
Adetunji Iyaniwura
@Iadetunji
Jun 05 2016 15:15
@RompePC ,pls help me check it carefully
RompePC
@RompePC
Jun 05 2016 15:15
This message was deleted
@Iadetunji This is your code:
<a class="btn btn-default" href="https://www.facebook.com/adetunji.teslimiyaniwura">
      <i class="fa fa-align-center fa fa-facebook-official" title="Align Center" style="font-size:48px;color:#3B5998"></i>
        </a>
        <i class="fa fa-github" style="font-size:48px;color:"></i>
        <i class="fa fa-linkedin-square" style="font-size:48px;color:#006699"></i>
        <i class="fa fa-twitter-square" style="font-size:48px;color:#55ACEE"></i>
@Iadetunji What doesn't work? The other links?
Adetunji Iyaniwura
@Iadetunji
Jun 05 2016 15:17
the first link that i added the </a> tag @RompePC
@RompePC ,i just tested the first b4 applying the <a> tag to othe font awesome
RompePC
@RompePC
Jun 05 2016 15:18
@Iadetunji I can access your FB profile without problems (the captcha is going to be there you like it or no)
@Iadetunji And get off that "Align Center" title, thats for showing text when you hover the element
RompePC
@RompePC
Jun 05 2016 15:23
@Iadetunji If you could pass here if there are any error message or the rendered HTML part of the links maybe we would see something
Adetunji Iyaniwura
@Iadetunji
Jun 05 2016 15:27
@RompePC ,ill apply to the other fonte awesome
@RompePC , and ill keep you posted, thank you
CamperBot
@camperbot
Jun 05 2016 15:27
iadetunji sends brownie points to @rompepc :sparkles: :thumbsup: :sparkles:
:cookie: 293 | @rompepc |http://www.freecodecamp.com/rompepc
Matt
@Pixelbark
Jun 05 2016 16:09
http://codepen.io/Pixelbark/pen/MewmLO Anyone know how I can move that tweet button to the center? .center-block does nothing. ;_;
Islam Ibakaev
@dagman
Jun 05 2016 16:11
yo guys was working on who animation. what do u think about it?
yerevin
@yerevin
Jun 05 2016 16:44
@Pixelbark you must do it as
<div class="text-center">
      <a href="https://twitter.com/share" class="twitter-share-button" data-text="I just used @Pixelbark VetMed flashcards! Check it out.">Tweet</a></div>
Alex Myers
@qckpckt
Jun 05 2016 16:49
I’m stuck on the wikipedia viewer project. I’m trying to save the input from my search field to a variable that i’ll pass to the JSON call, but I’ve never done this before and I’m obviously doing it wrong. Anyone able to point me in the right direction? http://codepen.io/qckpckt/pen/BzNxEb
JD Tadlock
@jdtdesigns
Jun 05 2016 17:04
@qckpckt You can get the input on keypress like this http://jsbin.com/lacapim/edit?html,js,console,output
M
@raydiatur
Jun 05 2016 17:04
hello, im nearly done with my portfolio just trying to make it mobile friendly, having scaling/width issues
Alfarhan Zahedi
@alfarhanz
Jun 05 2016 17:14
@raydiatur ...r u using bootstrap.css??
M
@raydiatur
Jun 05 2016 17:15
@Alfarhanz yes
i just fixed my images but the website is still wide when i open it on my iphone
Justin Woodward
@jwoo92
Jun 05 2016 17:15
@needsMoreCoffee nice story, im glad you were able to change your life and get a job you wanted :+1: if you dont mind me asking, where exactly were you in your learning when you were able to grab your first job?
Alfarhan Zahedi
@alfarhanz
Jun 05 2016 17:16
@raydiatur ...can i get the link to your pen..to see what actually is the prblm?
M
@raydiatur
Jun 05 2016 17:16
i just posted it
Justin Woodward
@jwoo92
Jun 05 2016 17:17
@qckpckt this is how i did it. var searchValue = $("#input-box").val(); #input-box was the ID i set to grab with jquery.
Alfarhan Zahedi
@alfarhanz
Jun 05 2016 17:17
@raydiatur ..ur navbar is giving the problem ryt??..its hiding the heading??
M
@raydiatur
Jun 05 2016 17:18
no
Justin Woodward
@jwoo92
Jun 05 2016 17:18
@qckpckt i also did input on keypress as well.
M
@raydiatur
Jun 05 2016 17:18
if i pull this up on my iphone its super wide that i have to scroll to see all the content
about to post a screenshot
CamperBot
@camperbot
Jun 05 2016 17:19
you need to ask about @someone!
Alfarhan Zahedi
@alfarhanz
Jun 05 2016 17:19
@raydiatur ...use media queries for small screens...
mheonyae
@mheonyae
Jun 05 2016 17:20
Hey everyone, can you tell your oppinion on this portfolio page i made for the challenge: http://codepen.io/mheonyae/full/ezNVeE/
Justin Woodward
@jwoo92
Jun 05 2016 17:20
@raydiatur have you tried container for your content after the navbar? this may give you a desired effect if you are worried about having some side margins.
M
@raydiatur
Jun 05 2016 17:20
alright, sounds good, ill learn how to implement it
Justin Woodward
@jwoo92
Jun 05 2016 17:21
@raydiatur ...<div id="content" class="container"> page content here </div> maybe something along the lines of this? just an idea.
M
@raydiatur
Jun 05 2016 17:22
okay, where do i put the closing tag? at the very end?
im not following on the id and class, wouldnt i have to put something in css for those?
Justin Woodward
@jwoo92
Jun 05 2016 17:25
@raydiatur container will be a bootstrap class, the id content was just an example to put in place in case you wanted any css to the content of that div.
M
@raydiatur
Jun 05 2016 17:25
ah
Justin Woodward
@jwoo92
Jun 05 2016 17:28
@raydiatur Here is my Portfolio. you can check out how i used several techniques to achieve the desired effect.
Why does the round button's value change?
Alex Myers
@qckpckt
Jun 05 2016 17:32
@jwoo92 Yeah I have that code line in my .submit function, but its still not logging anything to console
Nikov
@nsieber
Jun 05 2016 17:35
Hey y'all. I got CSS problems. Does anyone want to help a frustrated camper? :worried:
Nitinkumar Jaiswal
@jais0004
Jun 05 2016 17:35
Hi Nikov, I can try to help you
Aryan
@aryandua
Jun 05 2016 17:36
@nsieberI am average at css but i can try
Nikov
@nsieber
Jun 05 2016 17:38
Justin Woodward
@jwoo92
Jun 05 2016 17:38
@qckpckt your issue may be elsewhere then.
@nsieber what are you trying to do?
Joe Callon
@joecallon
Jun 05 2016 17:38
@nsieber You have a margin-right: % with no number which might be causing you problems
Nikov
@nsieber
Jun 05 2016 17:39
@aryandua when it's in three column layout I would like the image and text to remain vertically aligned
@joecallon yes I think that it's just being ignored though. I'll remove to avoid confusion
Aryan
@aryandua
Jun 05 2016 17:41
@nsieber I have no image :smile:
Nikov
@nsieber
Jun 05 2016 17:41
@aryandua the image is just a placeholder. It's the alignment that I'm finding problematic
M
@raydiatur
Jun 05 2016 17:42
@jwoo92 still struggling, might be some of the other content thats messed up, ill keep chugging away
Aryan
@aryandua
Jun 05 2016 17:42
@nsieber follow the link
Justin Woodward
@jwoo92
Jun 05 2016 17:43
@nsieber try this:
<div class="col-md-4 portfolio-item">
              <div class="colorMe">
              <h3 class="text-center">
                    <a href="#">Project Name</a>
              </h3>  
              <div class="content text-center">
                <img  src="https://cdn.rawgit.com/ayoisaiah/freeCodeCamp/master/twitch/images/placeholder-2.jpg">
                <p class="status">hey wahtup man what it is . this is a game channel</p>
               </div>
             </div>
           </div>
@nsieber take out line height in your css here .status.
Dan
@dcgoings
Jun 05 2016 17:44
hey guys! posted this last night but i just wanted to post again during the day and get more feedback on my tribute page! thoughts? comments? thanks!
http://codepen.io/dcgoings/full/MeWBwz/
Justin Woodward
@jwoo92
Jun 05 2016 17:44
@raydiatur itll take time. maybe it is in your button click action to your search input. i didnt look too deep into it. just continue trial and error.
@raydiatur what i can suggest though is forget about the fancy stuff for now. get the base line of functionality. then progress to the fancy stuff from there.
M
@raydiatur
Jun 05 2016 17:45
yeah, i was using your navbar as a guide and made changes here and there, but i want to say its the images or possibly the text?
it looks good/fine on pc its just on mobile where its a disaster
well i guess im continue on to fcc and come back when i try to add my future projects
Nikov
@nsieber
Jun 05 2016 17:46
@jwoo92 I tried your code. They're not inline anymore. Do you think display: inline will help?
Justin Woodward
@jwoo92
Jun 05 2016 17:47
@nsieber i thought you wanted not inline. what is it exactly youre trying to do?
Alex Myers
@qckpckt
Jun 05 2016 17:47
@jwoo92 figured out why it wasnt working. The input elements are being added in to a div as part of an animation, and I had to nest the click function inside the animation function to get it to all work together. :)
Sravya Pullagura
@sravya96
Jun 05 2016 17:48
@qckpckt Hey there! I just googled and found that you can select input <type="submit" buttons with $(":submit") selector. So all you need to do is replace $("#boo") with $(":submit"). It works for me :)
Nikov
@nsieber
Jun 05 2016 17:48
I want them inline vertically aligned middle. But vertical-align: middle; doesn't do anything
Aryan
@aryandua
Jun 05 2016 17:48
@nsieber put everything inside a <div>
and give that div an id
any id
then in css-
yourId {
verical-align:middle;
}
or..
Nikov
@nsieber
Jun 05 2016 17:50
I added the div with the class content and added vertical align middle with no results. you think adding another one will help?
Aryan
@aryandua
Jun 05 2016 17:50
#yourID {
margin-left:400px;

}
Justin Woodward
@jwoo92
Jun 05 2016 17:51
@dcgoings just minor for using code pen. you can put this in your head of the html settings while using codepen.
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<link href='https://fonts.googleapis.com/css?family=Passion+One|Bangers|Contrail+One|Racing+Sans+One' rel='stylesheet' type='text/css'>

<div class="container">

    <head>
        <div class="parallax-header border">
        </div>
    </head>
Aryan
@aryandua
Jun 05 2016 17:52
Hi @jwoo92 how are you?
did you finish your intermediate projects?
Justin Woodward
@jwoo92
Jun 05 2016 17:54
@nsieber so basically centered inside the div? is that what you mean?
Nikov
@nsieber
Jun 05 2016 17:54
@jwoo92 yes exactly
@jwoo92 vertically
Justin Woodward
@jwoo92
Jun 05 2016 17:54
@aryandua hey hows it going. i am near the middle of the intermediate algorithm challenges. roman numeral converter took some time for me.
@nsieber oh okay thatll be simple hold on.
Aryan
@aryandua
Jun 05 2016 17:55
@jwoo92 the roman numeral took me like 3 days but eventualy the answer was pretty easy
:)
Sai Rahul
@rhhhhl
Jun 05 2016 18:02
Thanks @RompePC 👍
CamperBot
@camperbot
Jun 05 2016 18:02
:cookie: 296 | @rompepc |http://www.freecodecamp.com/rompepc
rhhhhl sends brownie points to @rompepc :sparkles: :thumbsup: :sparkles:
Nikov
@nsieber
Jun 05 2016 18:02
@jwoo92 I like your confidence. I thought it would be simple too hehe
Justin Woodward
@jwoo92
Jun 05 2016 18:04
@nsieber
<div class="col-md-4 portfolio-item">
      <div class="colorMe">
        <div class="title">
          <h3 class="text-center">
                    <a href="#">Project Name</a>
              </h3>
        </div>
        <div class="noBorder  row content text-center">
          <div class="noBorder col-md-4">
            <img src="https://cdn.rawgit.com/ayoisaiah/freeCodeCamp/master/twitch/images/placeholder-2.jpg">
          </div>
          <div class="noBorder col-md-8">
            <p class="status">hey wahtup man what it is . this is a game channel</p>
          </div>
        </div>
      </div>
    </div>
css
.title {
  margin: 10px;
  border: none;
}

a {
  border: none;
}

.noBorder {
  border: none;
}
Alex DeCapri
@alexdecapri
Jun 05 2016 18:05
I'm having the hardest time getting twitter to even open... any thoughts? (random quote machine) http://codepen.io/alexanderdd/pen/jrPEMR
Justin Woodward
@jwoo92
Jun 05 2016 18:05
@nsieber the border none was a quick correction to display the desired effect. i would suggest rather than border over everything, you apply to a class so when it is desired.
@nsieber you can tweak your divs very easily. it just takes time to learn how to at first. then youll be a pro at it in no time.
Dylan
@dhcodes
Jun 05 2016 18:07
@alexdecapri methinks you have a decent function but haven't associated it with clicking the button
@alexdecapri add an event listener to the twitter div
Alex DeCapri
@alexdecapri
Jun 05 2016 18:07
You're right
Justin Woodward
@jwoo92
Jun 05 2016 18:07
@aryandua i didnt have much time to do it, but i knocked it out in one night( sunset-sunrise). getting the proper numbers was easy. i struggle with the conversion from the number itself to the roman numeral.
Alex DeCapri
@alexdecapri
Jun 05 2016 18:07
I just assumed openURL was a prebuilt function in jquery library or something... it's not @ dhcodes
@dhcodes
it was associated with the click though, thanks @dhcodes
CamperBot
@camperbot
Jun 05 2016 18:08
alexdecapri sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:cookie: 946 | @dhcodes |http://www.freecodecamp.com/dhcodes
Dylan
@dhcodes
Jun 05 2016 18:09
np
Nikov
@nsieber
Jun 05 2016 18:09
@jwoo92 your code gets the look I want in 3 column. And then the image and text shift to block when the page collapses into a single column.
purnendutiwari
@purnendutiwari
Jun 05 2016 18:10
just started "Build a Personal Portfolio Webpage"
don't know how should i start
Justin Woodward
@jwoo92
Jun 05 2016 18:10
@alexdecapri on click for the new quote i had this html changed each time for my twitter button <a href="https://twitter.com/intent/tweet?text=' + encodeURI(response.quoteText) + '" target="_blank">
Nikov
@nsieber
Jun 05 2016 18:10
@jwoo92 Nonetheless I'll follow your suggestions and buckle down to learn this stuff. Much thanks
CamperBot
@camperbot
Jun 05 2016 18:10
nsieber sends brownie points to @jwoo92 :sparkles: :thumbsup: :sparkles:
:cookie: 344 | @jwoo92 |http://www.freecodecamp.com/jwoo92
Justin Woodward
@jwoo92
Jun 05 2016 18:14
@nsieber it can be addressed. i believe you should just continue practicing your css. it is not a hard thing to master as long as you educate yourself in css and when using bootstrap.
Dylan
@dhcodes
Jun 05 2016 18:15
@purnendutiwari make the navbar and containers for all the sections
then go from there
Aryan
@aryandua
Jun 05 2016 18:16
how do i make something wait for 1 second??
Nikov
@nsieber
Jun 05 2016 18:16
@aryandua use the setTimeout function
Aryan
@aryandua
Jun 05 2016 18:17
@nsieber it doesnt really work for me
setTimeout(1000);
Nikov
@nsieber
Jun 05 2016 18:17
@aryandua you need to supply it the function ..
Alex DeCapri
@alexdecapri
Jun 05 2016 18:17
^
setTimeout(function(){ alert("Hello"); }, 3000);
purnendutiwari
@purnendutiwari
Jun 05 2016 18:18
thanks @dhcodes
CamperBot
@camperbot
Jun 05 2016 18:18
purnendutiwari sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
Nikov
@nsieber
Jun 05 2016 18:18
``` setTimeout(function() { do something; }, 1000)
CamperBot
@camperbot
Jun 05 2016 18:18
:cookie: 949 | @dhcodes |http://www.freecodecamp.com/dhcodes
Aryan
@aryandua
Jun 05 2016 18:18
@nsieber nope doesnt work
Nikov
@nsieber
Jun 05 2016 18:18
@aryandua What environment are you executing in?
Alex DeCapri
@alexdecapri
Jun 05 2016 18:18
@aryandua can you copy your code in?
Aryan
@aryandua
Jun 05 2016 18:19
@nsieber codepen
setTimout is achrymous
Nikov
@nsieber
Jun 05 2016 18:19
@aryandua send the link to codepen
so whats wrong?
Alex DeCapri
@alexdecapri
Jun 05 2016 18:23
@aryandua your function "myFunc" is just a console.log
Aryan
@aryandua
Jun 05 2016 18:23
@alexdecapri yes so?
Nikov
@nsieber
Jun 05 2016 18:23
@aryandua Can you put a comment in there where you want the timout?
@nsieber ok i did
saebrabaebra
@saebrabaebra
Jun 05 2016 18:24

I need some help! Here's the link to my codepen.

https://codepen.io/saebra/pen/pbvQyV

I want there to be a white box with grey text, a background of the image I imported, and below the white box a pink box that will soon have an <ol> I have the link colors set to change and they aren't either.
Can someone look this over?

None of my code is doing anything.
Nikov
@nsieber
Jun 05 2016 18:24
@aryandua and save it :)
Aryan
@aryandua
Jun 05 2016 18:24
@nsieber I did
in my js
look at two spots it says-
//timeout needed for 1 second
Tones
@tonyszhang
Jun 05 2016 18:25
hey guys, i also nee some help with my twitch.tv project. for some reasons, the order of the channels come in random. I'm using a for loop to iterate through an array of channel names, using query. the results seem to rarely be the order of the array...
here's the source. click the button a few times to see what i mean
Nikov
@nsieber
Jun 05 2016 18:28
@aryandua Ahh I see, you want to pause for one second and then continue the code. But setTimeout is designed a little differently...
Aryan
@aryandua
Jun 05 2016 18:29
@nsieber oh ok
Nikov
@nsieber
Jun 05 2016 18:29
@aryandua to use it you would have to put everything that comes after settimeout in another function and then call that function from settimout
Aryan
@aryandua
Jun 05 2016 18:29
@jdtdesigns I will look at that page thx
CamperBot
@camperbot
Jun 05 2016 18:29
aryandua sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 442 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Aryan
@aryandua
Jun 05 2016 18:29
@nsieber I see
should I do that?
Nikov
@nsieber
Jun 05 2016 18:30
@aryandua May I ask why you're pausing execution?
Aryan
@aryandua
Jun 05 2016 18:31
since you have to wait one second to continue right?
Ryan
@ispeakcomputer
Jun 05 2016 18:32
Do you guys have the same issue with "(" or javascript endding " )}; " disappearing from your codepen projects ? Typically results in the "loading......." of death
Nikov
@nsieber
Jun 05 2016 18:33
@jwoo92 I haven't found css easy to work with at all. Any resources that helped you get good at it?
@aryandua the code as it is saved in there now will continue executing but will call "myfunc()" after one second...
Allen Pittard
@donaldpittard
Jun 05 2016 18:35
Does any one have any advice for handling CORS on the Wikipedia Viewer Assignment?
Nikov
@nsieber
Jun 05 2016 18:36
@aryandua settimeout is generally not a good way to handle asynchronous issues because if you're pausing to wait for something else to happen, what if it takes more than the time you set?
Aryan
@aryandua
Jun 05 2016 18:36
@nsieber but it doesnt wait or call the function
@nsieber then what do i use?
Nikov
@nsieber
Jun 05 2016 18:37
@aryandua you have a typo. it's setTimeout()
@aryandua In order to pause the entire program you will have to refactor so that setTimeout is the last statement in that function, and it calls another function, and the last statement in that function is a setTimeout which calls another function etc.
Aryan
@aryandua
Jun 05 2016 18:40
@nsieber I dont get it
can you ust show me the code?
Nikov
@nsieber
Jun 05 2016 18:40
@aryandua Ok I'll whip up a quick code pen
Aryan
@aryandua
Jun 05 2016 18:41
thanks @nsieber
CamperBot
@camperbot
Jun 05 2016 18:41
aryandua sends brownie points to @nsieber :sparkles: :thumbsup: :sparkles:
:cookie: 249 | @nsieber |http://www.freecodecamp.com/nsieber
Islam Ibakaev
@dagman
Jun 05 2016 18:44
hey guys can u advise some nice-looking custom fonts for navigation links and who section animation text for this portfolio?
Bruce Young
@mutantspore
Jun 05 2016 18:45
@donaldpittard how are you using the api? .getJSON or .ajax ?
@donaldpittard and can you show the pen?
Allen Pittard
@donaldpittard
Jun 05 2016 18:46
@mutantspore I'm using an XMLHTTPRequest. I was trying to avoid jquery, but I'm guessing I will have to use it because I don't feel like building out jsonp functionality myself.
Bruce Young
@mutantspore
Jun 05 2016 18:48
@donaldpittard i think I did that once for amusement but I’m not sure if I still have it
Allen Pittard
@donaldpittard
Jun 05 2016 18:49
@mutantspore thanks. I'm sure I can find one or write it; it just seems so kludgy.
CamperBot
@camperbot
Jun 05 2016 18:49
donaldpittard sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1711 | @mutantspore |http://www.freecodecamp.com/mutantspore
Nikov
@nsieber
Jun 05 2016 18:53
@aryandua I've never used the js console in codepen. Do you know how to launch it?
Bruce Young
@mutantspore
Jun 05 2016 18:54
@nsieber just right click on your web page and select “inspect” for chrome or inspect element for Safari
Aryan
@aryandua
Jun 05 2016 18:57
@nsieber yeh @mutantspore is right
as usual ;)
Nikov
@nsieber
Jun 05 2016 19:01
@mutantspore was looking for codepen's js console as opposed to the one that comes with browser since logs will be mixed in with codepen's error messages

@aryandua run this code to see what I mean ```function logIt() {
console.log('hi');
setTimeout(logNext, 1000);
}

function logNext() {
console.log('log next');
setTimeout(logLast, 1000);
}

function logLast() {
console.log('this is the end')
}

logIt();```

Bruce Young
@mutantspore
Jun 05 2016 19:02
@nsieber little button at the bottom left of the screen
Nikov
@nsieber
Jun 05 2016 19:02
@aryandua oops I'll reforma
function logIt() {
    console.log('hi');
    setTimeout(logNext, 1000);
}

function logNext() {
    console.log('log next');
    setTimeout(logLast, 1000);
}

function logLast() {
    console.log('this is the end')
}

logIt();
Aryan
@aryandua
Jun 05 2016 19:02
@nsieber @nsieber ok thx
CamperBot
@camperbot
Jun 05 2016 19:02
aryandua sends brownie points to @nsieber :sparkles: :thumbsup: :sparkles:
:warning: aryandua already gave nsieber points
Aryan
@aryandua
Jun 05 2016 19:02
i get it
:)
Nikov
@nsieber
Jun 05 2016 19:03
@mutantspore that's it. thanks
CamperBot
@camperbot
Jun 05 2016 19:03
nsieber sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1712 | @mutantspore |http://www.freecodecamp.com/mutantspore
Nikov
@nsieber
Jun 05 2016 19:04
@aryandua ok cool. Just keep in mind there's probably not a good reason to actually write javascript code that does that. But that's a whole other topic ;)
Lucas Mendes
@ldcm3
Jun 05 2016 19:31
Guys, anyone cal help me with the "Show the Local Weather" project?
I am trying to use the $.getJSON method to retrieve the API address but I am not getting it success. It seems that everything is right, but I cant figure out the problem.
This is the code : https://codepen.io/ldcm3/pen/oLXPdw?editors=1010
Wojtek Gorzawski
@S2YCH4
Jun 05 2016 19:36
how to set photos height using bootstrap ?
Terrell Vest
@MirPresT
Jun 05 2016 19:38
any suggestions on testing react components, I've seen jest but have heard it recommended AGAINST, has anyone tested react components before ??
Dylan
@dhcodes
Jun 05 2016 19:38
@ldcm3 are you using chrome?
Lucas Mendes
@ldcm3
Jun 05 2016 19:40
I am using Safari @dhcodes
Andrew Charlebois
@andrewchar
Jun 05 2016 19:41
@wol
Dylan
@dhcodes
Jun 05 2016 19:41
ok, nvm then. html5 location won't work on chrome
Andrew Charlebois
@andrewchar
Jun 05 2016 19:42
@S2YCH4 just add a class to your image and set the high in your css
Wojtek Gorzawski
@S2YCH4
Jun 05 2016 19:42
@andrewchar i did it but don't work
Andrew Charlebois
@andrewchar
Jun 05 2016 19:43
Make sure you don't have it in a container so it's not cutting the img off
Wojtek Gorzawski
@S2YCH4
Jun 05 2016 19:46
@andrewchar priv
Bruce Young
@mutantspore
Jun 05 2016 19:58
@ldcm3 you issue with safari and your weather app is simply because you are accessing the pen using secure https:// and then your pen is dragging in insecure stuff via http:// . that’s not allowed.
Dylan
@dhcodes
Jun 05 2016 19:58
@ldcm3 i can't get it to work either. Maybe try using ip location since you'll need ip anyway for it to work in chrome
Bruce Young
@mutantspore
Jun 05 2016 19:59
it wil work
@ldcm3 now as @dhcodes is also saying, the geolocation won’t work in Chrome unless you use https:// for your pen so… as the weathe api can only do http:// you’ll need another way. one way is to use http://ip-info.org to get the location and then you can still use the owm api. just make sure you call your pen using http:// though
Dylan
@dhcodes
Jun 05 2016 20:01
@mutantspore it wouldn't seem to work for me in safari. Idk why
Bruce Young
@mutantspore
Jun 05 2016 20:01
it did for me.. the link he posted was in https .. just hack it
the one i posted was changed
in Safari.. I have to have my wi-fi on in Safari to make the geolocate work though
even on this ethernet connected iMac
Dylan
@dhcodes
Jun 05 2016 20:07
interesting
Bruce Young
@mutantspore
Jun 05 2016 20:07
@dhcodes nothing for you?
Sue Hanen
@greypaws
Jun 05 2016 20:08
In Rule #2 for building a Tribute Page it reads "Use whichever libraries you need." Does anyone know what libraries it is referring to?
Bruce Young
@mutantspore
Jun 05 2016 20:08
i get an alert and London in the top left of teh webpage
Lucas Mendes
@ldcm3
Jun 05 2016 20:08
Thanks a lot @mutantspore and @dhcodes !
It worked using http:// now
CamperBot
@camperbot
Jun 05 2016 20:08
ldcm3 sends brownie points to @mutantspore and @dhcodes :sparkles: :thumbsup: :sparkles:
:cookie: 955 | @dhcodes |http://www.freecodecamp.com/dhcodes
:star2: 1713 | @mutantspore |http://www.freecodecamp.com/mutantspore
Bruce Young
@mutantspore
Jun 05 2016 20:08
@greypaws bootstrap, jQuery, materialize.css anything that helps
@greypaws animation .. bacically they are saying it’s ok to use stuff to help your place and present stuff
Dylan
@dhcodes
Jun 05 2016 20:10
yeah it never worked for me but as long as it's working for you and @ldcm3
Bruce Young
@mutantspore
Jun 05 2016 20:10
or you can do it all by the sweat of your own JS and CSS
Sue Hanen
@greypaws
Jun 05 2016 20:11
@mutantspore
@mutantspore ok thanks
CamperBot
@camperbot
Jun 05 2016 20:11
greypaws sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1714 | @mutantspore |http://www.freecodecamp.com/mutantspore
Bruce Young
@mutantspore
Jun 05 2016 20:15
@greypaws the thing is I think they also say that you don’t need to do any JS or CSS of your own. things like bootstrap will enable you to do some neat stuff just using HTML and existing classes.
@greypaws it’s an introductory exercise to get you started before jumping up to a Personal portfolio. Keep it simple.
Will Power
@restartedwill
Jun 05 2016 20:22
Hi. I posted this a few days ago. I think I have something really simple wrong where my $(document).ready(function() is not firing for my local weather project. Please don't focus on the call to OpenWeather; I've tried even simple updating of a div tag's HTML, and it did not work. My CodePen is https://codepen.io/restartedwill/pen/wWavMd.
Tyler Moeller
@TylerMoeller
Jun 05 2016 20:23
@restartedwill If you're using OpenWeather, you can't use HTTPS because OpenWeather only works over HTTP
Will Power
@restartedwill
Jun 05 2016 20:24
I pasted the JS into Visual Studio, and it compiles cleanly. If I do the Analyze JS, I get what I think are false positives.
Tyler Moeller
@TylerMoeller
Jun 05 2016 20:24
The other problem is that navigator.geolocation only works over HTTPS :(
Tim LaRocque
@Heavyjunk36
Jun 05 2016 20:24
Please don't judge me...but I'm having trouble completing the first challenge...making my page say Hello World instead of just Hello! Can anyone give me a hint?
Will Power
@restartedwill
Jun 05 2016 20:24
@TylerMoeller I'm using the crossorigin.me shim. That worked in another project here.
Bruce Young
@mutantspore
Jun 05 2016 20:25
@restartedwill regarless of any errors what @TylerMoeller is saying wil be th eultimate issue
Tyler Moeller
@TylerMoeller
Jun 05 2016 20:25
You'll need to choose a weather API that works over HTTPS or go with a weather app that only works over HTTP and use something like http://ip-api.com/json for obtaining location over HTTP
Bruce Young
@mutantspore
Jun 05 2016 20:25
This message was deleted
Tyler Moeller
@TylerMoeller
Jun 05 2016 20:27
@mutantspore Random question...Curious if you know why we're all using jsonp? I've read jsonp has security issues when you don't have control over the script. Would an ideal implementation be a private cross origin proxy for working around this? Not sure I trust someone else's proxy.
Will Power
@restartedwill
Jun 05 2016 20:27
Thanks @TylerMoeller . I can re-engineer my app. But I still think I've done something really basic and simple with my JS that is not letting the document.ready fire. It wasn't working before I even included the OpenWeather stuff.
CamperBot
@camperbot
Jun 05 2016 20:27
restartedwill sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 573 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Jun 05 2016 20:27
@restartedwill It's working - try this:
$(document).ready(function() {
  alert('Ready!')
You'll need to press the "Run" button in codepen to get it to fire
Will Power
@restartedwill
Jun 05 2016 20:28
@TylerMoeller Ah, I did not know about Alert. That will help me in debugging in CodePen.
Bruce Young
@mutantspore
Jun 05 2016 20:28
@TylerMoeller yes i think in a real world project the access is done by the backend to hide the api key for example.
Tyler Moeller
@TylerMoeller
Jun 05 2016 20:29
@mutantspore I mean for working around CORS issues
@restartedwill console.log() may be a better alternative since it won't give you a popup - but both are useful to see when/where code is firing and what data it has.
DC
@dctor
Jun 05 2016 20:31
quick question...the nabar-brand will nest with the next line of text when stretched on a wide screen ....why is that?
http://codepen.io/dctor/pen/oLXypa
Nikov
@nsieber
Jun 05 2016 20:54
Anyone here still?
DC
@dctor
Jun 05 2016 20:55
yap
Jakub Wdowiak
@ChaZZ27
Jun 05 2016 21:03
hello
Will Power
@restartedwill
Jun 05 2016 21:03
@TylerMoeller I found https://freegeoip.net/json/ as a source that retrieves the latitude and longitude for the current IP address as https:!
Jakub Wdowiak
@ChaZZ27
Jun 05 2016 21:04
i have a question
Tyler Moeller
@TylerMoeller
Jun 05 2016 21:09
@restartedwill nice! For a https weather solution, I think forecast.io and weather underground are options. I went with all http for my weather app with a warning to users when they load the app over https.
wildaces215
@wildaces215
Jun 05 2016 21:10
IS there anyone familiar with ionic framework?
Nikov
@nsieber
Jun 05 2016 21:13
Can someone explain why the text in this codepen has so much space between lines? http://codepen.io/nsieber/pen/8b98f8389167363cae3b3d35e1d7d71d?editors=1100
Dimitris Kako
@jimaginator
Jun 05 2016 21:17
http://codepen.io/jimaginator/pen/aZOxob?editors=1010 can anyone tell me why i can retrive data from json file? my code is exactly the same as in the task "Convert JSON Data to HTML"
Manny
@Alloffices
Jun 05 2016 21:18
Free icon packs from around the web by first-class designers https://goo.gl/Tgt5dX
Ryan
@ispeakcomputer
Jun 05 2016 21:40
Hey guys , Do you have any ideas on how I could have the quotes be inline with the text when I press the button? right now im animating <i> and <h1> trying to keep the font awesome <i> tag inline but its not working out very well. I would also like to do it in a way that I only need one line of code to animate the while thing . Any help is welcome . thanks ! http://codepen.io/needsmorecoffee/pen/02ce2c79a4089374d181973916a7c1ba?editors=0010
Virdis Anténor
@virdisss
Jun 05 2016 21:52
Hi, i've trying to use bootstrap in my code that doesn't have any effect
i've been trying
Emmanuelle DeBarge
@emmanuelledebarge
Jun 05 2016 21:52
@virdisss you have to import it first
@virdisss or place it in the <head> of your code
Virdis Anténor
@virdisss
Jun 05 2016 22:01
Thanks!
Ryan
@ispeakcomputer
Jun 05 2016 22:04
codepen allows you to automatically add bootstrap in the settings dropdown for js
just fyi .
makes it easy
bscyrpt
@bscyrpt
Jun 05 2016 22:04
@needsMoreCoffee the quotes are messed up because <h1> tags are block elements by default, change to display:inline;
Ryan
@ispeakcomputer
Jun 05 2016 22:06
@bscyrpt thanks . i did that for the I tag but not the other. I would have never caught that without your help. thanks .
CamperBot
@camperbot
Jun 05 2016 22:06
needsmorecoffee sends brownie points to @bscyrpt :sparkles: :thumbsup: :sparkles:
:cookie: 275 | @bscyrpt |http://www.freecodecamp.com/bscyrpt
Andrew Charlebois
@andrewchar
Jun 05 2016 22:07
@needsMoreCoffee put the i tags inside your js
$('h1').html(<itag here> + quote + <i tag) + author)
bscyrpt
@bscyrpt
Jun 05 2016 22:08
wouldn't that be bad separation code vs html stuff
Ryan
@ispeakcomputer
Jun 05 2016 22:08
i did try that but now im gonna try again with the info I have @andrewchar thanks man !
CamperBot
@camperbot
Jun 05 2016 22:08
needsmorecoffee sends brownie points to @andrewchar :sparkles: :thumbsup: :sparkles:
:cookie: 445 | @andrewchar |http://www.freecodecamp.com/andrewchar
Virdis Anténor
@virdisss
Jun 05 2016 22:08
Guys i'd like to add pictures but it appears that i have to be a pro member.
Ryan
@ispeakcomputer
Jun 05 2016 22:09
@bscyrpt like best practice stuff? I should def read about that.
Virdis Anténor
@virdisss
Jun 05 2016 22:09
Do you know to do it without being a pro?
Ryan
@ispeakcomputer
Jun 05 2016 22:09
@virdisss in that case host elsewhere
bscyrpt
@bscyrpt
Jun 05 2016 22:09
yea typically you don't want to mix html inside other languages as little as possible, makes debugging a pain later if complexity grows
Ryan
@ispeakcomputer
Jun 05 2016 22:09
and use a link . image hosting places can help you
Virdis Anténor
@virdisss
Jun 05 2016 22:09
That's what i did but i don't really like the idea but got no choice.
Ryan
@ispeakcomputer
Jun 05 2016 22:10
@bscyrpt i had that thought after looking through my html for the tag when i did it . makes sense.
bscyrpt
@bscyrpt
Jun 05 2016 22:10
@virdisss you can always setup own webserver on local machine use stuff like xampp or install apache/mysql on other boxes
Ryan
@ispeakcomputer
Jun 05 2016 22:11
@virdisss i just paid the 10 a month for codepen to make life easy .
as i felt the same ha
it will let you host "assets" that way .
Andrew Charlebois
@andrewchar
Jun 05 2016 22:14
@needsMoreCoffee if you are going to do it the way i suggested. make a variable with the html fragment you intent on using and then use that variable where you insert it into your h1 tag with jQuery
var $template = $(all of your stuff here);
Ryan
@ispeakcomputer
Jun 05 2016 22:15
@andrewchar a prefect way to organize everything . thanks for the advice guys!
CamperBot
@camperbot
Jun 05 2016 22:15
needsmorecoffee sends brownie points to @andrewchar :sparkles: :thumbsup: :sparkles:
:warning: needsmorecoffee already gave andrewchar points
Andrew Charlebois
@andrewchar
Jun 05 2016 22:16
this way its easier to read which is one of the most important things
@needsMoreCoffee since you expressed interest in best practice. http://lab.abhinayrathore.com/jquery-standards/
Stephen
@stephepush
Jun 05 2016 22:22
So I'm working on the titleCase algorithm and I've been researching regexes and methods. Can somebody help me with figuring out how to get this line running?
string = string.replace(/\b[a-z]/g, '$&'.toUpperCase());
Xavier Velez
@JonSnow08
Jun 05 2016 22:38
would anybody mind taking a look at this and giving me a bit of help with the twitter button
Joshua Abu
@Absolutestunna
Jun 05 2016 22:48

Is there a concept in vanilla js (or comparable solutions) that assigns a "default value" to an expression until the real data is recieved. I'm having some async issues and I want to be able to say "hey if you don't have this promised object, use this default object"

Sorry for the horribly worded question (does a tenery help. the solution should behave like an if statement so to speak)

Xavier Velez
@JonSnow08
Jun 05 2016 22:50
@stephepush you still there?
Stephen
@stephepush
Jun 05 2016 22:50
yep
Xavier Velez
@JonSnow08
Jun 05 2016 22:50
@stephepush i'll see if I can help you out while I wait to see if someone can help me lol
Stephen
@stephepush
Jun 05 2016 22:51
alright
Xavier Velez
@JonSnow08
Jun 05 2016 22:51
@stephepush post all your code plz
Stephen
@stephepush
Jun 05 2016 22:51
alright
i changed my regex to looking for whitespac
but let me show you what I have
string = "I AM VulCAN";
string = string.toLowerCase();
//var query = /\b[a-z]/g;
string = string.replace((/\s\b([a-z]/g), '$&'.toUpperCase());
console.log(string);
heres a link to the code:
https://repl.it/CYQw/5
Xavier Velez
@JonSnow08
Jun 05 2016 22:53
@stephepush I handled this a bit differently in my case
Stephen
@stephepush
Jun 05 2016 22:54
did you use a regex?
also, do you want to take this to a private chat?
Xavier Velez
@JonSnow08
Jun 05 2016 22:54
nope
all it is asking for is that you turn the first letter of each word to upper case correct?
so why not treat each word as an individual?
how would you do that?
Stephen
@stephepush
Jun 05 2016 22:56
because I can't figure out how to replace the first letter of an array element
Xavier Velez
@JonSnow08
Jun 05 2016 22:56
no problem
do you know how to point to the first character in an array?
thisArray.charAt(0)
Stephen
@stephepush
Jun 05 2016 22:58
charAt(0)?
Xavier Velez
@JonSnow08
Jun 05 2016 22:58
exactly
so if i use the .toUpperCase() command
Stephen
@stephepush
Jun 05 2016 22:59
but you'd have to put each word in the string into it's own array
Xavier Velez
@JonSnow08
Jun 05 2016 22:59
why not put the whole string into one array?
Stephen
@stephepush
Jun 05 2016 22:59
.split(" "), what I know, only divides them up into elements
Xavier Velez
@JonSnow08
Jun 05 2016 23:00
you can even put it into an array and accomplish your step of putting the other letters to lowercase in one line of code
Stephen
@stephepush
Jun 05 2016 23:00
sure
Xavier Velez
@JonSnow08
Jun 05 2016 23:00
var splitStr = str.toLowerCase().split(' ');
Stephen
@stephepush
Jun 05 2016 23:00
i got that
Xavier Velez
@JonSnow08
Jun 05 2016 23:01
and the .split(' ') would separate it at every space, boom each string is a value within the array
ok next we need to take the first letter in each array which you know how to point to already and make it uppercase
but we don't want to write that line of code over and over again, so how would you accomplish that?
@stephepush
Stephen
@stephepush
Jun 05 2016 23:04
yep
this is where I get hung up
Xavier Velez
@JonSnow08
Jun 05 2016 23:04
okay fair enough
Stephen
@stephepush
Jun 05 2016 23:04
you can make a for loop
Xavier Velez
@JonSnow08
Jun 05 2016 23:04
exactly
Stephen
@stephepush
Jun 05 2016 23:04
now
Xavier Velez
@JonSnow08
Jun 05 2016 23:06
what part do you get hung up on specifically @stephepush
Stephen
@stephepush
Jun 05 2016 23:06
would it be "for (i=0; i<string.length, i++)..." or "for([i]=0; [i]<string.length; [i]++)..."
Xavier Velez
@JonSnow08
Jun 05 2016 23:06
the first one
but var i = 0
because remember you have to define the variable or the loop doesn't know you aren't pointing to a global variable that doesn't exist
Stephen
@stephepush
Jun 05 2016 23:07
ah okay
Xavier Velez
@JonSnow08
Jun 05 2016 23:08
@stephepush show me what you have so far so I can make sure we are on the same page
Stephen
@stephepush
Jun 05 2016 23:09
string = "I AM VulCAN";
var splitStr = string.toLowerCase().split(" ");
for (var i=0; i<splitStr.length; i++){

}
Xavier Velez
@JonSnow08
Jun 05 2016 23:09
perfect
now what would I set splitStr = to, if I wanted to make the first letter of each array index an uppercase?
Stephen
@stephepush
Jun 05 2016 23:12
splitStr = charAt(0).replace.toUpperCase();
Xavier Velez
@JonSnow08
Jun 05 2016 23:12
close
splitStr[i] = splitStr[i].charAt(0).toUpperCase()
Stephen
@stephepush
Jun 05 2016 23:12
ah
Xavier Velez
@JonSnow08
Jun 05 2016 23:13
Because you want it to move another index throughout each loop
and you don't need the replace
Stephen
@stephepush
Jun 05 2016 23:14
nest this all into a function?
Xavier Velez
@JonSnow08
Jun 05 2016 23:14
but what would be missing from this if we just set splitStr[i] = splitStr[i].charAt(0).toUpperCase()
yes
you may want to copy what you have minue the string = and hit reset code then nest it all into the function
minus*
that way you don't have issues when you try to pass
if anything I will send you the entire thing, I just want to make sure you understand what we are doing. Just giving you the answer does you no justice.
so @stephepush back to my question from earlier if we set splitStr[i] = splitStr[i].charAt(0).toUpperCase(); what would I end up with as splitStr[i]
Stephen
@stephepush
Jun 05 2016 23:20
ah you only get the first characters
Xavier Velez
@JonSnow08
Jun 05 2016 23:20
perfect
so how would I fix that?
@stephepush still there? sorry my internet cuts out from time to time just want to be sure
Stephen
@stephepush
Jun 05 2016 23:24
yes
Xavier Velez
@JonSnow08
Jun 05 2016 23:24
okay
Stephen
@stephepush
Jun 05 2016 23:24
was turning on a noise generator
Xavier Velez
@JonSnow08
Jun 05 2016 23:25
np
so we still need to add the rest of the word correct?
any idea how to do that/
Stephen
@stephepush
Jun 05 2016 23:27
yes
im trying to figure that out
thats why I've been silent, sorry
we have the capitalized letters of each word in the string in an array
we also have each word of the string split up into elements in an array
actually, we don't
we need to split string up into an array again
right?
@JonSnow08
C
@engineerwithoutfear
Jun 05 2016 23:30
http://codepen.io/engineerwithoutfear/pen/pbzBXw could someone help me get the tweet button to snuggle up next to the bottom of the quotebox div when it's in small screenwidth mode?
Stephen
@stephepush
Jun 05 2016 23:32
are we still talking, @JonSnow08 ?
C
@engineerwithoutfear
Jun 05 2016 23:32
Screenshot.png
Xavier Velez
@JonSnow08
Jun 05 2016 23:33
@stephepush sorry
@stephepush not yet but we do need to do that in the next step
splitStr[i] = splitStr[i].charAt(0).toUpperCase() + splitStr[i].substring(1);
is the next step we need
Stephen
@stephepush
Jun 05 2016 23:34
is this going in the same function we've been working on?
Xavier Velez
@JonSnow08
Jun 05 2016 23:36
yes it's replacing splitStr[i] = splitStr[i].charAt(0).toUpperCase() line
in the same loop
Stephen
@stephepush
Jun 05 2016 23:36
ah
Xavier Velez
@JonSnow08
Jun 05 2016 23:37
now that loop is done so we close it with }
and what do we need to return to complete the checkpoint?
(hint: you said it earlier)
CamperBot
@camperbot
Jun 05 2016 23:37
Set a bonfire to talk about with bonfire name
Stephen
@stephepush
Jun 05 2016 23:37
join all the elements
Xavier Velez
@JonSnow08
Jun 05 2016 23:38
perfect
Xavier Velez
@JonSnow08
Jun 05 2016 23:38
return splitStr.join(' ');
Aryan
@aryandua
Jun 05 2016 23:38
Why does my setTimeout function not wait?
Xavier Velez
@JonSnow08
Jun 05 2016 23:38
but not inside the loop
Stephen
@stephepush
Jun 05 2016 23:38
I wanna be like Mike @JonSnow08 , lol
Xavier Velez
@JonSnow08
Jun 05 2016 23:38
haha no you don't, I only know this because somebody took the time to explain it to me
Aryan
@aryandua
Jun 05 2016 23:38
@JonSnow08 dont ever return anything in a loop
Xavier Velez
@JonSnow08
Jun 05 2016 23:39
@aryandua i know, im explaining that to him right now...
Aryan
@aryandua
Jun 05 2016 23:39
Unless you are using recursion
Xavier Velez
@JonSnow08
Jun 05 2016 23:39
I don't think he's that far yet...but thank you
Aryan
@aryandua
Jun 05 2016 23:40
I just like pointing out kind of unrelated stuff ;P
Xavier Velez
@JonSnow08
Jun 05 2016 23:40
@stephepush so i'll PM you exactly what you should have just to make sure you can pass it now that you understand it
Stephen
@stephepush
Jun 05 2016 23:40
alright
Tulio Natale
@tuliodnw
Jun 05 2016 23:41
i finished the timer challenge, can someone give me ideas , im not happy with the design
http://codepen.io/tuliodnw/pen/PzqebR
Stephen
@stephepush
Jun 05 2016 23:41
i used recursion for the factorialization algo, btw
Xavier Velez
@JonSnow08
Jun 05 2016 23:41
@stephepush awesome man
@stephepush so then you understand it and when to use returns inside of the loop and when not to. That took me a bit myself haha
Stephen
@stephepush
Jun 05 2016 23:46
Indeed, lol
Thanks for the help @JonSnow08
CamperBot
@camperbot
Jun 05 2016 23:46
stephepush sends brownie points to @jonsnow08 :sparkles: :thumbsup: :sparkles:
:cookie: 271 | @jonsnow08 |http://www.freecodecamp.com/jonsnow08
Stephen
@stephepush
Jun 05 2016 23:47
and for the patience
Xavier Velez
@JonSnow08
Jun 05 2016 23:47
@stephen any time man, just let me know if you need any help and if i'm around I don't mind at all
it helps me review the little things which is big with this
Stephen
@stephepush
Jun 05 2016 23:50
sure will
Ashley Wilson
@aCodingCat
Jun 05 2016 23:57
i was told you guys might be able to help me with a codepen project?