These are chat archives for FreeCodeCamp/HelpFrontEnd

4th
Jan 2017
BiancaPiper
@MissLouisePiper
Jan 04 2017 00:46
hi everyone. is there someone who knows or expert in Laravel framework? can you refer to me someone who is really good at this framework. I badly needed help. i hope you can help me. Thank you
Kevin Giannattasio
@kgiannattasio
Jan 04 2017 00:48
Hi everyone, does anyone know how I can link css to html within codepen? I'm working on my first project with codepen. Currently i'm posting <link rel="stylesheet" type="text/css" href=".css"> but I think the href might be wrong
ml3ha
@ml3ha
Jan 04 2017 00:51
you need to include the css file
href="yourfile.css"
Tom
@moT01
Jan 04 2017 01:14
wanna test out my game?
http://codepen.io/moT01/pen/egOKqO
find me some bugs? things that could be better?
DarylKnapp
@DarylKnapp
Jan 04 2017 01:23

Can anyone give me some points on how i can make my page longer? i wanna add a hire me page under it..

http://codepen.io/DarylKnapp/pen/vgYNXe?editors=1100

Tom
@moT01
Jan 04 2017 01:26
you want to know what to put there? to make it longer just add some stuff, it will be as long as the content
windosx64
@windosx64
Jan 04 2017 01:41
@moT01 I beat it
@moT01 is trump's hair the background?
Doneal Bercier
@donealbercier
Jan 04 2017 01:48
Could someone please give me some feedback on my Twitch app. I think I"m moving in the right direction: http://codepen.io/donealbercier/pen/NdKxbr
Sander Berntsen
@sbxn14
Jan 04 2017 02:04
I am so proud of myself https://codepen.io/sbxn14/full/mRdLpY/
Tyler Moeller
@TylerMoeller
Jan 04 2017 02:17
@c0d0er2 This is for Free Code Camp Front-end Development Project help. Not codecademy. Wrong number :)
Zachary
@Bazill03
Jan 04 2017 02:49
Hey guys, I'm working on the twitch streamer. I'm trying to use a for loop to both run through the array of streamers and apply them to the div id's. i.e. : box0, box1, ... and so on. However I keep getting box8, 8 times. Any idea why? Thanks. http://codepen.io/Bazill/pen/LbBQpZ?editors=1111
Rafael Monroy
@rafaelmonroy
Jan 04 2017 02:50
@sbxn14 lol that looks almost identical to the sample one
Zachary
@Bazill03
Jan 04 2017 02:50
Looks beautiful @sbxn14 ! Great work.
Rafael Monroy
@rafaelmonroy
Jan 04 2017 02:50
great job!
Tyler Moeller
@TylerMoeller
Jan 04 2017 02:55

@Bazill03 That's how for loops work with asynchronous functions. To simplify, try this:

for (var i = 0; i < 10; i++) {
  setTimeout(function() {
    console.log(i)
  }, 1000);
}

You will get 10 output 10 times instead of 0, 1, 2, 3, 4, 5, etc....

To fix it, loop through your streamers with a method that uses callbacks, like .map() or .forEach()
Zachary
@Bazill03
Jan 04 2017 02:56
Ah! I'll take a look into that. Thanks @TylerMoeller
CamperBot
@camperbot
Jan 04 2017 02:56
bazill03 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1255 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Alan Sato
@Halfcreative
Jan 04 2017 02:59
Hello! I'm a little lost on how to add a tweet button to my Quote Machine, https://codepen.io/halfcreative/pen/Xprrwm?editors=0010
The tweet button api has a section for text, but i'm having trouble getting the text to be the content of the quote
Tyler Moeller
@TylerMoeller
Jan 04 2017 03:02
@Halfcreative The Twitter widget code can get a little complicated, most people create a hyperlink and style it like a button instead.
Alan Sato
@Halfcreative
Jan 04 2017 03:04
@TylerMoeller ok, i'm guessing they just generate a button, then add the quote content into the text section of the link?
@TylerMoeller you helped me a couple days ago too didnt you? thank you for the consistent advice
CamperBot
@camperbot
Jan 04 2017 03:05
halfcreative sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1256 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Jan 04 2017 03:05
@Halfcreative I might have helped out a couple of days ago - usually check in at this time of day :)
And to be more specific, to style a hyperlink like a button, you can use the same classes you already use for your button:
<a href="url to some website" class ="btn btn-primary">Link Text</a>
And Font Awesome has a good Twitter Icon you can use: http://fontawesome.io/icons/
C
@engineerwithoutfear
Jan 04 2017 03:09
https://codepen.io/engineerwithoutfear/pen/QGeVQM anyone with d3 experience have any idea what the heck is happening to my x-axis? :worried:
Tom
@moT01
Jan 04 2017 03:16
@windosx64 i supposed to be a chalkboard
Alan Sato
@Halfcreative
Jan 04 2017 03:18
https://codepen.io/halfcreative/pen/Xprrwm?editors=1010 am i doing something wrong with my webintent for the url?
I try to replace all spaces with %20 and insert it into the url of the tweet button but it doesnt seem to add the quote the way i want it
Tom
@moT01
Jan 04 2017 03:21
the message shows correct if you comment that out
Tyler Moeller
@TylerMoeller
Jan 04 2017 03:21
@Halfcreative That's close, but you have a scope issue. What does this code output?
function myFunc() {
  var myVar = 'hello world';
}

console.log(myVar);
Alan Sato
@Halfcreative
Jan 04 2017 03:22
hello world?
CamperBot
@camperbot
Jan 04 2017 03:22

welcome to FreeCodeCamp @Halfcreative!

Alan Sato
@Halfcreative
Jan 04 2017 03:22
lol sorry camperbot not you
Tyler Moeller
@TylerMoeller
Jan 04 2017 03:22
@Halfcreative Actually, it's undefined
myVar is only defined inside the function myFunc(), so in your code, ranQuoteTweet is only defined inside your anonymous .getJSON function
Alan Sato
@Halfcreative
Jan 04 2017 03:23
ahhh, so i'm forgetting to set a variable to public, or i need to create a function that returns that value
Tyler Moeller
@TylerMoeller
Jan 04 2017 03:23
Or, you can put your tweet code inside your anonymous getJSON function.
Alan Sato
@Halfcreative
Jan 04 2017 03:25
@TylerMoeller you sir are a good teacher, and a wonderful friend
Tyler Moeller
@TylerMoeller
Jan 04 2017 03:25
function myFunc() {
  var myVar = 'hello world';
  console.log(myVar); // hello world
  logMyVar(myVar);
}

console.log(myVar); // undefined

function logMyVar(string) {
  console.log(string); // hello world
}
A few ways to do it - happy to help out
Alan Sato
@Halfcreative
Jan 04 2017 03:27
@TylerMoeller is there any way i can grant you more brownie points
Tyler Moeller
@TylerMoeller
Jan 04 2017 03:28
@Halfcreative lol, I don't do this for brownie points :)
Have plenty already
Tom
@moT01
Jan 04 2017 03:28
you can give them to me and ill do a hand off
Tyler Moeller
@TylerMoeller
Jan 04 2017 03:28
Yeah, give them to @moT01 lol
Alan Sato
@Halfcreative
Jan 04 2017 03:29
@moT01 thanks i did forget to give you points anyway
CamperBot
@camperbot
Jan 04 2017 03:29
halfcreative sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 449 | @mot01 |http://www.freecodecamp.com/mot01
Tom
@moT01
Jan 04 2017 03:30
if you wanna check out my tictactoe @TylerMoeller, i think im done with it, ...cept for maybe some beautification
Sam Griffen
@ssgriffen
Jan 04 2017 03:35
Am I using the correct url for my getJSON on this project? Is the way I am checking if someone's status is null or not the correct way to check if someone is online or not? http://codepen.io/ssgriffen/pen/VmOKEp
Tyler Moeller
@TylerMoeller
Jan 04 2017 03:36
@moT01 Nice work! I can't beat it :)
It would be nice to see the last letter I place before I get the alert(), but I'll take a closer look tomorrow when I have time and let you know if I see anything. Good job.
Tom
@moT01
Jan 04 2017 03:37
@ssgriffen i think that's right, looks like its working to me, the url anyway
@TylerMoeller thanks
CamperBot
@camperbot
Jan 04 2017 03:38
mot01 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1257 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Sam Griffen
@ssgriffen
Jan 04 2017 03:38
@moT01 https://codepen.io/FreeCodeCamp/full/Myvqmo/ the example project shows Free code camp as being offline ):
@moT01 but mine is showing the online
JD Tadlock
@jdtdesigns
Jan 04 2017 03:41
@ssgriffen You should be using /streams to check stream status and /channels to get channel info ;)
Sam Griffen
@ssgriffen
Jan 04 2017 03:42
@jdtdesigns roger than. 10:4. Delta niner
Tom
@moT01
Jan 04 2017 03:42
affirmative
Jerry Purvis
@MessiaHack
Jan 04 2017 03:47
can someone tell me what I am doing wrong?
function nextInLine(arr, item) {
  arr = testArr;
  arr.push(item);
  item = arr.shift();

  return item;  // Change this line
}

// Test Setup
var testArr = [5,6,7,8,9];

// Display Code
console.log("Before: " + JSON.stringify(testArr));
console.log(nextInLine(testArr, 10)); // Modify this line to test
console.log("After: " + JSON.stringify(testArr));
Tom
@moT01
Jan 04 2017 03:51
@MessiaHack what are you supposed to return
the modified array right?
Jerry Purvis
@MessiaHack
Jan 04 2017 03:52
@moT01 I got it figured out. thanks :)
CamperBot
@camperbot
Jan 04 2017 03:52
messiahack sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 450 | @mot01 |http://www.freecodecamp.com/mot01
Tom
@moT01
Jan 04 2017 03:52
glad i could help
Amit Patel
@AmitP88
Jan 04 2017 04:09
hey guys, I'm finishing up my client's website and just wanted to get some opinions on it. It's not 100% finished yet, and I still need to get the descriptions, switch out some of the pics, fix spacing between elements, etc, but this is pretty much what it'll look like. Let me know what you guys think :) https://amitp88.github.io/Khmer-Family-Cafe/
Jack Lyons
@JackEdwardLyons
Jan 04 2017 04:13
hey @AmitP88 cool job.. maybe make the paragraph font size 16 - 18 px
so its easy to ready
read
perhaps incorporate the contact us, the map and the social links into one footer
like a horizontal nav similar to the main header nav @AmitP88
that would reduce scrolling, and make it all easier to read
the image lightbox has the close X in the bottom left, generally the X is at the top right
Amit Patel
@AmitP88
Jan 04 2017 04:15
@JackEdwardLyons ah ok, good point :) yeah, i'm just waiting on the client to provide the descriptions. once I get those, i'll adjust the fonts & paddings to clean the look up
oh yeah, originally it was at the top right, but the scale of the images was making it hard to see
i'll have to work on that too
Jack Lyons
@JackEdwardLyons
Jan 04 2017 04:15
maybe break up the panels with a different background color (ie) menu, about, catering, footer
Emily Sperry
@sperrye
Jan 04 2017 04:16
@AmitP88 the images are teeny on mobile
Jack Lyons
@JackEdwardLyons
Jan 04 2017 04:16
at a bare minimum, perhaps put the contact us and the map on the same row (ie) col-md-6 for the map and col-md-6 for the contact us info
@AmitP88
Amit Patel
@AmitP88
Jan 04 2017 04:17
@sperrye which images? the ones in the carousel or the ones in the menu
MirrorTorrent
@mirrortorrent
Jan 04 2017 04:17
how do I center all elements on my tribute page?
Amit Patel
@AmitP88
Jan 04 2017 04:18
@JackEdwardLyons ah ok, so like the opening hours, location, and map in one row?
Emily Sperry
@sperrye
Jan 04 2017 04:18
They could both be bigger but mainly the menu ones. There's also an image sizing issue with the image just below the header. I'm not sure what it's supposed to be it's all pixelated
Jack Lyons
@JackEdwardLyons
Jan 04 2017 04:18
yeah that will look so much cleaner
Emily Sperry
@sperrye
Jan 04 2017 04:19
Right above homemade traditional cuisine
Jack Lyons
@JackEdwardLyons
Jan 04 2017 04:19
because the contact hours is taking up wayyyy too much page space
Emily Sperry
@sperrye
Jan 04 2017 04:20
On mobile you could possibly put a larger image of the dish with the description underneath
Amit Patel
@AmitP88
Jan 04 2017 04:21
@JackEdwardLyons yeah, that's true. i'll definitely adjust that
@sperrye oh yeah, as far as the header image, it was provided by the client. I tried to implement a parallax effect, but i'm thinking of removing that to lessen loading time
@sperrye ah ok, i'll definitely think about that. thank you :)
CamperBot
@camperbot
Jan 04 2017 04:24
amitp88 sends brownie points to @sperrye :sparkles: :thumbsup: :sparkles:
:cookie: 282 | @sperrye |http://www.freecodecamp.com/sperrye
Emily Sperry
@sperrye
Jan 04 2017 04:24
On iPhone the enlarged images from the menu get cropped off by the header and can't be scrolled
Amit Patel
@AmitP88
Jan 04 2017 04:24
@sperrye oh yeah, i noticed that too. still need to work on that
Emily Sperry
@sperrye
Jan 04 2017 04:25
Now I'm hungry
Amit Patel
@AmitP88
Jan 04 2017 04:25
@sperrye lol that's a good sign =P
what do you guys think of the overall design though?
what i'll do is start cleaning up my code first (which is a lot =/) but then after that i'll start making the improvements you guys suggested. thank you so much for your feedback though, I really appreciate it :)
Curtis Salisbury
@DarthOpto
Jan 04 2017 04:39
Just wondering if I could get some quick help. I am working on my portfolio project and my boss suggested using flexbox it is certainly easy, but I have messed up somewhere and was wondering if you all could take a look and tell me what I am doing wrong. Basically the main image you see should be centered, and the text should be over the top of the image. I have bg-primary turned on so I can see where the containers are.
Rafael Monroy
@rafaelmonroy
Jan 04 2017 04:51
can anyone help me with why all my bullet points are in bold, i added the <strong> only to the date but after i nest it in a col or row, all the text becomes bold :/
was able to change to normal with h3 li {
font-weight: normal;
font-size: 16px;
}
but still concerned as to why the font would change to bold after nesting
Rafael Monroy
@rafaelmonroy
Jan 04 2017 04:57
does anyone know why after nesting an unordered list inside a boostrap col or row, all the text becomes bold and a larger font?
Dipal Gudhka
@dipalgudhka
Jan 04 2017 05:17
for the local weather is it ok to use simple weather
Ankit Agarwal
@ankit-prgmr
Jan 04 2017 06:04
@rafaelmonroy It was because of this line
<h3 class="text-center"><em>"The true sign of intelligence is not knowledge but imagination"</em><h3>
@rafaelmonroy You were not closing the <h3> tag and that is what <li> was inheriting and making your <li> element look bigger
Leena
@leena-d
Jan 04 2017 06:25
anyone have time to help me with a couple issues?
Ankit Agarwal
@ankit-prgmr
Jan 04 2017 06:29
@leena-d What is the issue?
Leena
@leena-d
Jan 04 2017 06:32
@ankit-prgmr i'm making a forcast app. i have a button that i want to use to switch between imperial and metric units but it's not working. and i'm also having an issue using the company's logo (required for using the API). ill post the link to the pen in a sec
Sorin Ruse
@sorinr
Jan 04 2017 06:51
@leena-d i would recommend you to disable in pen settings the autoupdate feature. you are wasting api calls for each litle change you made in code
Leena
@leena-d
Jan 04 2017 06:51
@sorinr true. hadn't thought of that. thanks
CamperBot
@camperbot
Jan 04 2017 06:51
leena-d sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1031 | @sorinr |http://www.freecodecamp.com/sorinr
John Andrew Torres
@jandrewtorres
Jan 04 2017 06:52
@sorinr @leena-d i would reccomend not using codepen at all
set your project up locally in your terminal/command line, learn how to deploy to cloud based services.
don't short yourself
Leena
@leena-d
Jan 04 2017 06:53
@jandrewtorres i actually write my code using a text editor and paste it into codepen for convience because i don't know how to use anything else for publishing. i am open to learning something new though
Sorin Ruse
@sorinr
Jan 04 2017 06:54
@jandrewtorres i always work locally and when i finish upload it to codepen
draconis1618
@draconis1618
Jan 04 2017 06:54
ho
how do i turn an image into a link?
my code is listed below

<link href="https://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>

<img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

Sorin Ruse
@sorinr
Jan 04 2017 06:55
@draconis1618 something like <a><img></a>
draconis1618
@draconis1618
Jan 04 2017 06:56
where do i type that
John Andrew Torres
@jandrewtorres
Jan 04 2017 06:57
@leena-d @sorinr I think codepen is great for code sharing, but IMHO, half the battle for some apps is setting up the local and production/deploy envirionments. It will serve you well to do everything in a local environment, and try to deploy it on a cloud-based service. This requires git experience. I use sublime text editor for all my web base projects. Check it out
Sorin Ruse
@sorinr
Jan 04 2017 06:57
you just wrap the img you have with anchor tags
draconis1618
@draconis1618
Jan 04 2017 06:58
can you re-write it for me
and show me how its done
@sorinr please :D?
Leena
@leena-d
Jan 04 2017 06:59
@jandrewtorres i have no experience with git. if you or anyone else has the time to teach me one day i'd be happy to learn
Sorin Ruse
@sorinr
Jan 04 2017 06:59
@jandrewtorres you are going to far away. there is no production ready apps on codepen. just small examples
@draconis1618 put <a href="here the link url">in front of <img class="smaller-image thick-green-border" .... and add </a> at the end of the img tag like ....alt="A cute orange cat lying on its back. "></a>
draconis1618
@draconis1618
Jan 04 2017 07:03
thanks heap sorin
Sorin Ruse
@sorinr
Jan 04 2017 07:04
@draconis1618 :+1:
Sarah
@Shoyren
Jan 04 2017 07:07
Hi, can anyone tell me why my CodePen can't retrieve Open Weather's JSON data? https://codepen.io/shoyren/pen/EZxpRg/?editors=1010
Coy Sanders
@coymeetsworld
Jan 04 2017 07:08
openweathermap free account only works on non-secure connections @Shoyren, you have to pay to use https
Leena
@leena-d
Jan 04 2017 07:10
@Shoyren geolocation doesn't work. i used ipinfo.io
Sarah
@Shoyren
Jan 04 2017 07:11
@coymeetsworld @leena-d OK, good to know. I was only able to use geolocation because I used 'https' but then that breaks Open Weather. Thanks!
CamperBot
@camperbot
Jan 04 2017 07:11
shoyren sends brownie points to @coymeetsworld and @leena-d :sparkles: :thumbsup: :sparkles:
:star2: 1724 | @coymeetsworld |http://www.freecodecamp.com/coymeetsworld
:cookie: 266 | @leena-d |http://www.freecodecamp.com/leena-d
Leena
@leena-d
Jan 04 2017 07:11
@Shoyren no problem
Coy Sanders
@coymeetsworld
Jan 04 2017 07:11
yeah you can use an api to get your location
thats what I did
ml3ha
@ml3ha
Jan 04 2017 07:17
hey, looking for some advice on designing a page. anyone here atm
Sorin Ruse
@sorinr
Jan 04 2017 07:17
@Shoyren do not round coordinates like var lat = Math.round(position.coords.latitude); you will get wrong data all the time
Sarah
@Shoyren
Jan 04 2017 07:18
@sorinr Thanks! Will keep that in mind. I was only doing it because I thought it was somehow messing with the url. But tbh that makes no sense.
CamperBot
@camperbot
Jan 04 2017 07:18
shoyren sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1032 | @sorinr |http://www.freecodecamp.com/sorinr
Sarah
@Shoyren
Jan 04 2017 07:21
@ml3ha I think what you're supposed to do is lay out all of your HTML first (including divs), then begin using CSS to format everything. It also helps to sketch out what you want it to look like on paper first too.
@ml3ha Also, if you're wondering about making good design more generally, I'd suggest you look into that as well. There are plenty of books on the topic, but this link might get you a good start. http://blog.visme.co/elements-principles-good-design/
ml3ha
@ml3ha
Jan 04 2017 07:25
Oh, I meant im building a web application and i have some pages but id like some input on the design of them
@Shoyren
Will take a look at that link. Looks very helpful
draconis1618
@draconis1618
Jan 04 2017 07:32

learn to code javascript at Free Code Camp logo

Map
Chat
Forum
About
Shop
[ 30 ]

Turn an Image into a Link

You can make elements into links by nesting them within an a element.

Nest your image within an a element. Here's an example:

<a href="#"><img src="https://bit.ly/fcc-running-cats" alt="Three kittens running towards the camera. "></a>

Remember to use # as your a element's href property in order to turn it into a dead link.

Place the existing image element within an anchor element.

Once you've done this, hover over your image with your cursor. Your cursor's normal pointer should become the link clicking pointer. The photo is now a link.

<link href="https://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><img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. "> </a>

<a href="https://bit.ly/fcc-running-cats" alt="#"> </a>

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

can someone help me please
Sorin Ruse
@sorinr
Jan 04 2017 07:39
@draconis1618 :point_up: January 4, 2017 8:59 AM and read the challenge example <a href="#"><img src.... and compare with what you have. you missed the deadlink # for the <a> tag
Wen Luo
@wilsonluo1987
Jan 04 2017 09:28
<a class="btn btn-default" href="#"><i class="fa fa-twitter" aria-hidden="true"></i>Twitter</a>
why twitter icons doesn't show up?
Sorin Ruse
@sorinr
Jan 04 2017 09:33
@wilsonluo1987 have you loaded the fa library?
Ritvars
@RitvarsZ
Jan 04 2017 09:34
@wilsonluo1987 does the <i> element need a closing tag?
Wen Luo
@wilsonluo1987
Jan 04 2017 09:34
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css">
this one right?
it has closing tag
Sorin Ruse
@sorinr
Jan 04 2017 09:46
@wilsonluo1987 think that in the version 4.0.3 some of the social icons where not added yet. try to use 4.7.0
Sorin Ruse
@sorinr
Jan 04 2017 09:58
@wilsonluo1987 its seems the problem is the way of loading the fa lib. its should be <link rel="stylesheet" href="https://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css"> not http://
@wilsonluo1987 here an working example
John Alcher
@alchermd
Jan 04 2017 10:13
Hey fellas. With a function solve(x, operand, y), you think it's possible to reduce an array [1, "+", 2, "+", 3] to a single value (6)?
Sorin Ruse
@sorinr
Jan 04 2017 10:17
@alchermd yes. you can also use the jq .eval() function. here some info: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval
John Alcher
@alchermd
Jan 04 2017 10:19
@sorinr wow that's neat!
@sorinr So I just convert the array to a string and eval() it, right?
Sorin Ruse
@sorinr
Jan 04 2017 10:21
@alchermd yes. something like arr.join().eval() will do the trick
John Alcher
@alchermd
Jan 04 2017 10:22
@sorinr Thanks! One more thing, is there a way to ignore precedence with this method?
CamperBot
@camperbot
Jan 04 2017 10:22
alchermd sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1033 | @sorinr |http://www.freecodecamp.com/sorinr
John Alcher
@alchermd
Jan 04 2017 10:23
var seq = [1,"+",2,"+",3, "*", 2], str = "";

seq.forEach(function(x){
  str += x;
});

eval(str); // returns 9. Ignoring precedence, this should return 12
John Alcher
@alchermd
Jan 04 2017 10:28
@sorinr Hey mate, I solved it with adding conditional statements (i.e .eval() the str when x is * or /)
Sorin Ruse
@sorinr
Jan 04 2017 10:31
@alchermd eval() takes care of precedence. you don't have to worry about it
John Alcher
@alchermd
Jan 04 2017 10:32
@sorinr I'm trying to ignore precedence :D
Sorin Ruse
@sorinr
Jan 04 2017 10:33
@alchermd sorry. haven't read all the message above :)
John Alcher
@alchermd
Jan 04 2017 10:34
@sorinr No worries! I have another guy on the other chatroom saying eval() is bad. I think it does the job perfectly in this context. What's your take?
Sorin Ruse
@sorinr
Jan 04 2017 10:38
@alchermd its not at all bad if you "sanitize" the string you evaluate. if you restrict the user inputs by validating them before i don't think there is a much of on issue. true they say "eval() is a dangerous function, which executes the code it's passed with the privileges of the caller. If you run eval() with a string that could be affected by a malicious party, you may end up running malicious code on the user's machine with the permissions of your webpage / extension. More importantly, third party code can see the scope in which eval() was invoked, which can lead to possible attacks in ways to which the similar Function is not susceptible."
Amy Walters
@codecampamy
Jan 04 2017 10:39
Hey all - When the mouse hovers over a menu item in the navigation bar the word is underlined. I've tried removing this in the css using "text-decoration: none;" but it's not worked. Any ideas? http://codepen.io/codecampamy/pen/zozrBM
Self resolved! Moved the text-decoration to the a element css rather than the a:hover Thanks!!! Sorry!!!
Clyde Lobo
@oppiniated
Jan 04 2017 10:41
@codecampamy a:hover
@codecampamy great :thumbsup:
Amy Walters
@codecampamy
Jan 04 2017 10:42
I honestly spent a good quarter of an hour before I thought I'd ask and them BAM it occurs to me doh. @oppiniated
John Alcher
@alchermd
Jan 04 2017 10:42
@sorinr Awesome. My use case should be fine since it's a calculator (the input is sanitized since the buttons are hard coded).
Clyde Lobo
@oppiniated
Jan 04 2017 10:43
@codecampamy I call this the EUREKA moment. I have a couple of these on a weekly bases. Your code does not work no matter what and then suddenly BAM, EUREKA
Sorin Ruse
@sorinr
Jan 04 2017 10:45
@alchermd here some quick example using eval()
John Alcher
@alchermd
Jan 04 2017 10:47
@sorinr I'm gonna have to hold off looking at that since I'm still working on mine hahaha
Amy Walters
@codecampamy
Jan 04 2017 10:50
Ha - I do have another problem now though... of course @oppiniated
Sorin Ruse
@sorinr
Jan 04 2017 10:51
@alchermd you can look at it. it just show an example of using eval function. thats all
@codecampamy @oppiniated take a look at one of my fav quotes. the 2nd one :)
Amy Walters
@codecampamy
Jan 04 2017 10:58
Hi, I added a:focus to my css so the menu is accessible for keyboard events but when I do this I get the same problem with the word in the menu being underlined. I also need to add a:active but when I add in this code a:hover,
a:focus,
a:active,
a.active {
color: #fec503;} it ends up messing up my navigation menu set up entirely.... http://codepen.io/codecampamy/pen/zozrBM
@sorinr That is the truth!
Ankit Agarwal
@ankit-prgmr
Jan 04 2017 10:59
@codecampamy Hi , So you don't want underline , just the text color?
Amy Walters
@codecampamy
Jan 04 2017 11:00
Yes, sorry I'd just like the menu items to go from white to yellow when focus/active/hover apply @ankit-prgmr (hi again by the way!)
Ankit Agarwal
@ankit-prgmr
Jan 04 2017 11:01
@codecampamy Okay, let me have a look
@codecampamy You have almost achieved it. Change your code to this
a {
  color: #ffffff;
  text-decoration: none;
}

a:hover
{

  text-decoration: none;
  color:  #fec503;
}

a:focus
{ 
  text-decoration: none;
color: #fec503;
}
DarylKnapp
@DarylKnapp
Jan 04 2017 11:03
anyone know of a great place to get stock place holder images.. please dont say google lol
Ankit Agarwal
@ankit-prgmr
Jan 04 2017 11:03
Amy Walters
@codecampamy
Jan 04 2017 11:04
@DarylKnapp Death to the stock photo
That's the name of the site! @DarylKnapp
DarylKnapp
@DarylKnapp
Jan 04 2017 11:04
@codecampamy Lols Okay. Is it the rage?
Amy Walters
@codecampamy
Jan 04 2017 11:05
That kitten site is a great site @ankit-prgmr
Ankit Agarwal
@ankit-prgmr
Jan 04 2017 11:06
@codecampamy Haha yeah. Did that code work for you?
Amy Walters
@codecampamy
Jan 04 2017 11:06
Mine isn't placeholder as such actually like the one Ankit has suggested - just stock photos, I use it for my blog @DarylKnapp
marko bogdanovic
@okramovic
Jan 04 2017 11:07
hi everybody. would anyone pls point me to what is the problem in my wikipedia viewer?
http://codepen.io/okramovic/pen/qRBpzg
Amy Walters
@codecampamy
Jan 04 2017 11:08
YES! Thank you @ankit-prgmr - I added in the active too same format and I have no underlining etc... brilliant, thanks for taking a look
CamperBot
@camperbot
Jan 04 2017 11:08
codecampamy sends brownie points to @ankit-prgmr :sparkles: :thumbsup: :sparkles:
:cookie: 282 | @ankit-prgmr |http://www.freecodecamp.com/ankit-prgmr
Ankit Agarwal
@ankit-prgmr
Jan 04 2017 11:08
@codecampamy Np :+1:
Sorin Ruse
@sorinr
Jan 04 2017 11:09
@codecampamy bet you still have it for <a> visited links :)
Amy Walters
@codecampamy
Jan 04 2017 11:11
I will of you when that time comes - this page is taking me f.o.r.e.v.e.r every little thing is taking so much time! @sorinr
Ankit Agarwal
@ankit-prgmr
Jan 04 2017 11:11
@sorinr I guess she wants it that way, right @codecampamy ?
Amy Walters
@codecampamy
Jan 04 2017 11:13
I haven't even got to thinking about visited links yet! @ankit-prgmr I will cross that bridge later :)
Ankit Agarwal
@ankit-prgmr
Jan 04 2017 11:14
@codecampamy Haha okay :+1:
DarylKnapp
@DarylKnapp
Jan 04 2017 11:29

How do I go about making the pic bigger or small, and not have the column grow as well.

http://codepen.io/DarylKnapp/pen/vgYNXe?editors=1100

Sorin Ruse
@sorinr
Jan 04 2017 11:31
@DarylKnapp which picture?
DarylKnapp
@DarylKnapp
Jan 04 2017 11:32
sorry the top.. that you can obviously see is not on their right lol
Sorin Ruse
@sorinr
Jan 04 2017 11:34
@DarylKnapp you mean the one in the jumbotron?
DarylKnapp
@DarylKnapp
Jan 04 2017 11:34
yes sir.
Sorin Ruse
@sorinr
Jan 04 2017 11:36
lol. not a sir yet. the queen din't made me one :) think you want it as a hero image, right?
DarylKnapp
@DarylKnapp
Jan 04 2017 11:36
correct lol
Minoy
@minoy
Jan 04 2017 11:36

Hello!
I am working on the Profile Lookup challenge under Javascript. Following is my code till now for the first part when both conditions are true:

function lookUpProfile(firstName, prop){
// Only change code below this line
for (var i = 0; i < contacts.length; i++) {
  for (var j =0; j < contacts[i].length; j++) {
    if (contacts[i][j] == firstname && contacts.hasOwnProperty(prop) === true) {
      return contacts[i][prop];
    } 
  }
}


// Only change code above this line
}

// Change these values to test your function
lookUpProfile("Akira", "likes");

But when I run the challenge, I do not get any output. Any ideas?

Boris Radev
@krgvnr
Jan 04 2017 11:38
how is it possible to align not just the text, but the bullets too of an list?
Hi, all, I will try to paraphrase: I need to build an unordered list, but as I try to center it, only the text itself is centered, not the actual bullets of the text (they remain aligned to the left).
Ankit Agarwal
@ankit-prgmr
Jan 04 2017 11:41
@krgvnr code link please?
Sorin Ruse
@sorinr
Jan 04 2017 11:41
@DarylKnapp you want to achieve some like example ?
DarylKnapp
@DarylKnapp
Jan 04 2017 11:43
@sorinr I just PM'ed you
@sorinr Can you explain what I did wrong?
Boris Radev
@krgvnr
Jan 04 2017 11:47
Sorin Ruse
@sorinr
Jan 04 2017 11:48
@DarylKnapp nothing wrong in your code. img in the div.jumbotron will accommodate the jumbotron that have some margin and padding. i just made the img as a background to the jumbotron class and added some more properties just for a visual effect. see the css where the .jumbotron class its modified
Boris Radev
@krgvnr
Jan 04 2017 11:55
Hello, I am stuck at the Tribute Page challenge. I would like to know how to align bullets properly and how to fit the frame of the picture correctly. This is my code so far: https://codepen.io/krgvnr/pen/mRdwPq Please help me.
Uros Tadic
@urketadic
Jan 04 2017 12:01
How can i play this sound on an event? https://clyp.it/sym3ccgr
This is what i have tried thus far
else {
        numSpan.addClass("incorrect");
      inputCount++;
      wrong++;
      $('body').append('<embed src="https://clyp.it/sym3ccgr "');
    }
Phillip Troutman
@troutman21
Jan 04 2017 12:26
blob
blob
Ankit Agarwal
@ankit-prgmr
Jan 04 2017 12:31
@krgvnr Hey sorry I had to go out. Are you still stuck?
Phillip Troutman
@troutman21
Jan 04 2017 12:32
Does anyone know how to expand the length of the input field of a form element? i want the first name and last name field to be as long as my textarea field....i've been trying to structure this for like a day. any help would be awesome. http://codepen.io/Troutman21/pen/PbrQqE?editors=1100
Ankit Agarwal
@ankit-prgmr
Jan 04 2017 12:34
@troutman21 Try putting this inside your text field
class = "form-control"
Phillip Troutman
@troutman21
Jan 04 2017 12:37
Thanks! that worked but im not sure why lol @ankit-prgmr . Do you know how i can make that slightly smaller tho ? It took up the whole area.
CamperBot
@camperbot
Jan 04 2017 12:37
troutman21 sends brownie points to @ankit-prgmr :sparkles: :thumbsup: :sparkles:
:cookie: 283 | @ankit-prgmr |http://www.freecodecamp.com/ankit-prgmr
Ankit Agarwal
@ankit-prgmr
Jan 04 2017 12:38
@troutman21 form-control is used to take whole width available
@troutman21 Let me check how you can make it bit smaller
Phillip Troutman
@troutman21
Jan 04 2017 12:42
Thanks. I need to figure out how to control them better. Its hard to describe but i want to make them the same size as the textarea box and push them right to be right next to the textarea box. I dont know if that makes sense. @ankit-prgmr
CamperBot
@camperbot
Jan 04 2017 12:42
troutman21 sends brownie points to @ankit-prgmr :sparkles: :thumbsup: :sparkles:
:warning: troutman21 already gave ankit-prgmr points
Ankit Agarwal
@ankit-prgmr
Jan 04 2017 12:42
@troutman21 you can make it smaller like this
.textWidth{
  width:90%
}
You can then control its alignment using margin-left or margin-right
Sander Berntsen
@sbxn14
Jan 04 2017 12:45

can someone help me? I currently got <link href="https://fonts.googleapis.com/css?family=Amatic+SC|Gloria+Hallelujah|Permanent+Marker" rel="stylesheet">

<nav class="navbar navbar-default">
<div class="container-fluid">
<a class="navbar-brand">a portfolio by my name</a>
</div>

but I want the brand
to be in the center of the navbar
how do I do that
Phillip Troutman
@troutman21
Jan 04 2017 12:45
awesome @ankit-prgmr thank you sir.
CamperBot
@camperbot
Jan 04 2017 12:45
troutman21 sends brownie points to @ankit-prgmr :sparkles: :thumbsup: :sparkles:
:warning: troutman21 already gave ankit-prgmr points
Ankit Agarwal
@ankit-prgmr
Jan 04 2017 12:46
@troutman21 Don't call me sir :smile:
Phillip Troutman
@troutman21
Jan 04 2017 12:46
lol
Sander Berntsen
@sbxn14
Jan 04 2017 12:47
no one? :C
nvm worked it out
Rafael Monroy
@rafaelmonroy
Jan 04 2017 13:10
@ankit-prgmr how can i share a box of code like that?
Use 3 backticks
Rafael Monroy
@rafaelmonroy
Jan 04 2017 13:11
thanks!
@ankit-prgmr hey also thanks for helping me out with my codepen tribute page! i just saw your reply
CamperBot
@camperbot
Jan 04 2017 13:14
rafaelmonroy sends brownie points to @ankit-prgmr :sparkles: :thumbsup: :sparkles:
:cookie: 284 | @ankit-prgmr |http://www.freecodecamp.com/ankit-prgmr
Ankit Agarwal
@ankit-prgmr
Jan 04 2017 13:15
@rafaelmonroy Np. Hope it cleared your doubt
Rafael Monroy
@rafaelmonroy
Jan 04 2017 13:21
it, was driving me crazy lol
Ankit Agarwal
@ankit-prgmr
Jan 04 2017 13:22
haha
giovanniattina
@giovanniattina
Jan 04 2017 15:25
HI
why Can I acess the api?
It's say that the site is wrong
the why am I writing the site acess is wrong?
Tom
@moT01
Jan 04 2017 15:27
console.log your lat/long before your .getjson
giovanniattina
@giovanniattina
Jan 04 2017 15:30
it's getting undefined
both variables
Tom
@moT01
Jan 04 2017 15:32
exactly
Christopher Ryder
@cryder9898
Jan 04 2017 15:37
Hello all, I am building the weather app and I think I am doing it wrong. My code pauses before showing the temperature. Mind you, I just started this. Can someone suggest a better way to do this?? pen
also, how do you get the pen to show in gitter?
Tom
@moT01
Jan 04 2017 15:41
works fine for me, ...a slight pause maybe, ...not sure if thats fixable im assuming its just taking a second to get the data
ahhh
i have an ajax call inside another ajax call
i have to get the location in order to get the weather
giovanniattina
@giovanniattina
Jan 04 2017 15:43
@moT01 what should I do?
Tom
@moT01
Jan 04 2017 15:44
move your .getjson inside the other function
@cryder9898 yea, you need to get both pieces of info, ...there might be a better way to do it, ...not sure
giovanniattina
@giovanniattina
Jan 04 2017 15:46
@moT01 thanks, now worked
CamperBot
@camperbot
Jan 04 2017 15:46
:cookie: 451 | @mot01 |http://www.freecodecamp.com/mot01
giovanniattina sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
Sorin Ruse
@sorinr
Jan 04 2017 16:27
@cryder9898 you can separate them by creating a function like getWeather(city,state){ajax call to get the weather) and call this function within the first ajax call. something like: example
Christopher Ryder
@cryder9898
Jan 04 2017 16:30
yea, its essentially the same thing, no?
It still has the same little pause before the temp shows
maybe weather underground is slow
You are right tho @sorinr I should be saving that as a function
Sarah
@Shoyren
Jan 04 2017 16:35
How would I access a Javascript object within another object? I'm having trouble accessing the weather condition (i.e. "cloudy") in my weather page. http://codepen.io/shoyren/pen/EZxpRg/?editors=1010
Uros Tadic
@urketadic
Jan 04 2017 16:36

volume=0 doesn't seem to be supported anymore.
Does anyone know how i can mute my iframe now in year of 2017?

When i click unmute icon, mute icon should appear and video should be muted. (and the other way around)

This is what iv tried thus far:

//Mute-Unmute Music
 $('#unmute').on('click', function() {
    $("#unmute").hide();
    $("#mute").show();
    $("#iframe").attr("volume", "0");
 });
 $('#mute').on('click', function() {
    $("#mute").hide();
    $("#unmute").show();
    $("#iframe").attr("volume", "1");
  });
Sorin Ruse
@sorinr
Jan 04 2017 16:37
@cryder9898 yes you get the response from the weather api call with a delay coz the api is a little slower. both solutions r working. the one i've showed you its just if you want to separate the logic. one function is for getting the location and one for getting the weather
Christopher Ryder
@cryder9898
Jan 04 2017 16:42
@Shoyren data['weather']['main']
or data.weather.main
Sorin Ruse
@sorinr
Jan 04 2017 16:42
@urketadic i think you should refer to the iframe#unmute element otherwise the browser will search for an inpage element not an embeded element. hope it makes sense
Christopher Ryder
@cryder9898
Jan 04 2017 16:42
should give you clouds
Sarah
@Shoyren
Jan 04 2017 16:44
@cryder9898 OK, so I tried this first, but this sends me back 'undefined'. Am I missing something
Christopher Ryder
@cryder9898
Jan 04 2017 16:44
there is a really nice chrome extension for looking at JSON called JSON-Handle
@Shoyren try data.weather.shift().main
@Shoyren inside weather is an array of length 1
Sarah
@Shoyren
Jan 04 2017 16:47
@cryder9898 Thanks! That did the trick!
CamperBot
@camperbot
Jan 04 2017 16:47
:cookie: 264 | @cryder9898 |http://www.freecodecamp.com/cryder9898
shoyren sends brownie points to @cryder9898 :sparkles: :thumbsup: :sparkles:
any idea why?
LascarPaul
@LascarPaul
Jan 04 2017 16:48
can anyone help me change the font color on the navbar for this thing please?
Christopher Ryder
@cryder9898
Jan 04 2017 16:48
@Shoyren if you use chrome get the JSON-handle extension, when you hover your mouse over the fields it shows you (basically) what to code to get the values
Giannis Dallas
@giannis-dallas
Jan 04 2017 17:00

@LascarPaul try

.navbar.navbar-default {}

@LascarPaul
.navbar.navbar-default {
background: rgba(xxx, yyy, zzz, 0.a);
}
Jev
@iriepixel
Jan 04 2017 17:04
hi everyone
could you suggest me best grid system for 2017 please
Ritvars
@RitvarsZ
Jan 04 2017 17:04
I there a way of getting an image from a wikipedia post with the Wikipedias API? This is my request so far: https://en.wikipedia.org/w/api.php?action=opensearch&section=0&prop=text&origin=*&search=test
any properties to add so I can get an image for that post?
LascarPaul
@LascarPaul
Jan 04 2017 17:11
@gianndall thx but it won't work
CamperBot
@camperbot
Jan 04 2017 17:11
lascarpaul sends brownie points to @gianndall :sparkles: :thumbsup: :sparkles:
:cookie: 263 | @gianndall |http://www.freecodecamp.com/gianndall
Sorin Ruse
@sorinr
Jan 04 2017 17:11
@iriepixel i would go for flexbox
Walter V. Santos
@theunmanifested
Jan 04 2017 17:12
Need some help. I'm having trouble understanding the following in HTML5 and CSS when we use a "form" element with the "action" attribute. In the "Create Form Element" exercise, the instructions call for "Add the action="/submit-cat-photo" attribute to this form element." Question: Why do we use a forward slash when using a URL? In the W3school exercise they don't use forward slash. Thanks.
Jev
@iriepixel
Jan 04 2017 17:12
@sorinr need to support IE9
Sorin Ruse
@sorinr
Jan 04 2017 17:12
@iriepixel who cares about ie9 these days :)
Jev
@iriepixel
Jan 04 2017 17:13
@sorinr client =(
@sorinr any other recommendations?
Tyler Moeller
@TylerMoeller
Jan 04 2017 17:14
@RitvarsZ Yes, you can get images from Wikipedia with the Wikimedia API. Stack Overflow has some examples of different queries you can use. Here's the main article from the help docs: https://www.mediawiki.org/wiki/API:Images
Jev
@iriepixel
Jan 04 2017 17:14
@sorinr zen-grid, sussy?
Sorin Ruse
@sorinr
Jan 04 2017 17:15
@iriepixel yep. pure css with floats, % and all the stuff
Tyler Moeller
@TylerMoeller
Jan 04 2017 17:15
@theunmanifested / indicates it's coming from the root of the site, otherwise it's a relative path from the current directory. http://stackoverflow.com/questions/7613274/why-would-a-developer-place-a-forward-slash-at-the-start-of-each-relative-path
Walter V. Santos
@theunmanifested
Jan 04 2017 17:16
@TylerMoeller Thanks, man. I need to remember to use Stack Overflow as much as I google. I appreciate the help.
CamperBot
@camperbot
Jan 04 2017 17:16
theunmanifested sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1258 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Sorin Ruse
@sorinr
Jan 04 2017 17:17
@iriepixel maybe. until display: grid will be available on all modern browsers
Ritvars
@RitvarsZ
Jan 04 2017 17:17
@TylerMoeller I know. prop=images returns every image of the wiki page. I would need a function to sort through and get the right one, but thats making it too complicated. I could just take the first one, but it might not always be the best representing image. I was just wondering if anyone knew a easyer way of doing that :) Thanks!
CamperBot
@camperbot
Jan 04 2017 17:17
ritvarsz sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1259 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Jan 04 2017 17:26
@RitvarsZ By "best representing image", I'm guessing you want to get the main image for that post, not all images for the post. In that case, use generators in combination with the pageImages property: https://www.mediawiki.org/wiki/Extension:PageImages
My Wikipedia Viewer requests a 500px version of the main thumbnail for every article with that property: https://s.codepen.io/TylerMoeller/debug/NAjLYo
Uros Tadic
@urketadic
Jan 04 2017 17:34
@sorinr can you help me
Sorin Ruse
@sorinr
Jan 04 2017 17:35
@urketadic about?
Ritvars
@RitvarsZ
Jan 04 2017 17:37
@TylerMoeller Exactly. I tried using pageimages, but for some reason it doesn't work, the request sends back only the title, description and link as always. I really don't enjoy this API :D
Tyler Moeller
@TylerMoeller
Jan 04 2017 17:38
@RitvarsZ Yeah, the opensearch module you are using is limited. You'll need to use a different module, which takes a few hours of learning the API and understanding all the properties. It's a very powerful API though, and once you figure it out, you can use it on any wikimedia-powered website, not just Wikipedia.
Ritvars
@RitvarsZ
Jan 04 2017 17:40
@TylerMoeller Looks like I should get to reading. What module should I use then?
Tyler Moeller
@TylerMoeller
Jan 04 2017 17:41
@RitvarsZ The Query module: https://www.mediawiki.org/wiki/API:Query
Ritvars
@RitvarsZ
Jan 04 2017 17:42
@TylerMoeller Thanks! I'll get to work :+1:
CamperBot
@camperbot
Jan 04 2017 17:42
ritvarsz sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:warning: ritvarsz already gave tylermoeller points
Tyler Moeller
@TylerMoeller
Jan 04 2017 17:42
Good luck! :+1:

@LascarPaul It's always a pain finding the right selector to use with the bootstrap navbar ;) best way to do it is to right-click the navbar, choose "inspect element", and see what classes are being used for the font color. In your case, you can do this:

.navbar-default .navbar-brand,
.navbar-default .navbar-nav > li > a {
  color: #01B6E4;
}

(for example)

Hussain Haider
@HussainHaider
Jan 04 2017 17:46

Hello everyone!!I'm currently working on codepen on "Build a Personal Portfolio Webpage"Project..I'm using bootsrap but

<footer class="container-fluid text-center" id="Section3" >
<a href="https://twitter.com/HussainZaidi14"><i class="fa fa-twitter-square" style="font-size:36px"></i></a>
<a href="https://www.facebook.com/Hussain094"><i class="fa fa-facebook-square" style="font-size:36px"></i></a>
<a href="https://www.instagram.com/hussainhaider490/"><i class="fa fa-instagram" style="font-size:36px"></i></a>
<a href="https://www.linkedin.com/in/syed-hussain-haider-zaidi-259742128"><i class="fa fa-linkedin" style="font-size:36px"></i></a>

</footer> these lines are not working..kindly help me

Tyler Moeller
@TylerMoeller
Jan 04 2017 17:47
@gianndall That link is failing because openweathermap doesn't support HTTPS unless you spend money. Change https to http in your URL and it will work fine
Uros Tadic
@urketadic
Jan 04 2017 17:49
Tyler

Do you know whats wrong with mah mute button @ http://codepen.io/urketadic/pen/YpLgBX

If you start Options -> Matrix MOde (mute/unmute button appears) but it doesn't work.

Js code is at the bottom of JS.
Tyler Moeller
@TylerMoeller
Jan 04 2017 17:50
@HussainHaider That should work - we'd probably need to see your codepen to investigate further
Uros Tadic
@urketadic
Jan 04 2017 17:50
Iv also tried volume=0 but doesn't work
Christopher Ryder
@cryder9898
Jan 04 2017 17:51
When I resize the width of the window the text is stuck to the left. Why wont the centering adjust to the width of the window?
Tyler Moeller
@TylerMoeller
Jan 04 2017 17:51
@HussainHaider Go to your codepen settings, in the JavaScript section remove font awesome and put it in your CSS section instead.
@urketadic I don't get any sound, but if I click on the speaker icon it goes to a muted speaker icon
Uros Tadic
@urketadic
Jan 04 2017 17:53
You need to enable Matrix Mode in options
to get sound
oh wait
Hussain Haider
@HussainHaider
Jan 04 2017 17:53
@TylerMoeller thanks buddy
CamperBot
@camperbot
Jan 04 2017 17:53
hussainhaider sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1260 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Jan 04 2017 17:53
yw :+1:
Uros Tadic
@urketadic
Jan 04 2017 17:55
I hear the sound
and my friend
Tyler Moeller
@TylerMoeller
Jan 04 2017 17:55
@urketadic Looks like you're using the YouTube API, I haven't used that API for a while. :/
Uros Tadic
@urketadic
Jan 04 2017 17:56
I only tried using it last 5 minutes because
giving attribute volume = 0 didnt work
If u got any other option leme know
Yeah :( I'l try figure something out.
Thanks anyway @TylerMoeller
CamperBot
@camperbot
Jan 04 2017 17:57
urketadic sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1261 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Jan 04 2017 17:57
@urketadic I'm noticing this error in the console:
Uncaught TypeError: Cannot read property 'unMute' of undefined
    at HTMLImageElement.<anonymous> (pen.js:890:11)
    at HTMLImageElement.dispatch (https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js:3:9922)
    at HTMLImageElement.q.handle (https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js:3:7949)
Uros Tadic
@urketadic
Jan 04 2017 17:58
yeah unmute doesn't work, but mute isnt working eather
Tyler Moeller
@TylerMoeller
Jan 04 2017 17:59
I think it's saying that you're calling mute() and unMute() out of scope
Tyler Moeller
@TylerMoeller
Jan 04 2017 18:13

@cryder9898 You'll need to change it to inline-block if you want to use text-align: center:

.infobox{
  display: inline-block;
  width: 450px;
  text-align: center;
}

Or, use margin: 0 auto instead:

.infobox{
  width: 450px;
  margin: 0 auto;
}
Christopher Ryder
@cryder9898
Jan 04 2017 18:14
@TylerMoeller nice thanks!
CamperBot
@camperbot
Jan 04 2017 18:14
cryder9898 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1262 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Ananda Johnson
@Sovember
Jan 04 2017 18:14
Does anyone here have experience with bootstrap nav's? I have an issue where where my nav breaks into two lines at a certain breakpoint. I don't know how'd I'd go about fixing this
Tyler Moeller
@TylerMoeller
Jan 04 2017 18:16
@Sovember You can set a minimum width for the navbar or use white-space: nowrap. Hard to tell exactly what's going on without seeing the code.
Ananda Johnson
@Sovember
Jan 04 2017 18:17
@TylerMoeller Thanks! I'll try that, if I still have an issue I will be more specific and paste the html/css
CamperBot
@camperbot
Jan 04 2017 18:17
:star2: 1263 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
sovember sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
Tyler Moeller
@TylerMoeller
Jan 04 2017 18:17
No problem - lots of other options depending on what's going on with the code
hudsontaylor
@hudsontaylor
Jan 04 2017 18:42
I'm having trouble with the Twitch.tv API challenge. Right now I'm adding each object to an array using .push(). However, the objects seem to be added arbitrarily with no apparent order. I need them to be added in the order they were in to begin with. Is that possible?
Link to pen: http://codepen.io/Hudson_Taylor11/pen/YpjxKm?editors=0010
E Smith
@mas1321
Jan 04 2017 18:47
Hi, I'm wondering for the portfolio project if we are allowed to use themes from bootstrap or is that "not allowed"?
hudsontaylor
@hudsontaylor
Jan 04 2017 18:48
@mas1321 It says you can use whichever libraries you would like. I'd go right ahead!
E Smith
@mas1321
Jan 04 2017 18:52
thanks @hudsontaylor didn't know because they suggested we code it from ground up
CamperBot
@camperbot
Jan 04 2017 18:52
mas1321 sends brownie points to @hudsontaylor :sparkles: :thumbsup: :sparkles:
:cookie: 283 | @hudsontaylor |http://www.freecodecamp.com/hudsontaylor
A_A
@Otto-AA
Jan 04 2017 18:53
@hudsontaylor push always adds it to the end. The problem is most likely that the api call responds aren't coming in the correct order.
hudsontaylor
@hudsontaylor
Jan 04 2017 18:54
@Otto-AA Does it have something to do with JSON being asynchronous?
A_A
@Otto-AA
Jan 04 2017 18:55
@hudsontaylor Yeah, if the api-call would be synchronous it would most likely work. But I wouldn't recommend that one
@hudsontaylor Rather wait till all api-calls are finsihed and then sort it afterwards, or make one after another.
hudsontaylor
@hudsontaylor
Jan 04 2017 18:57
Good idea! Thanks @Otto-AA
CamperBot
@camperbot
Jan 04 2017 18:57
hudsontaylor sends brownie points to @otto-aa :sparkles: :thumbsup: :sparkles:
:cookie: 381 | @otto-aa |http://www.freecodecamp.com/otto-aa
A_A
@Otto-AA
Jan 04 2017 18:58
@hudsontaylor You're welcome =D
hudsontaylor
@hudsontaylor
Jan 04 2017 19:14
Is anybody available to help with my Twitch app?
A_A
@Otto-AA
Jan 04 2017 19:14
@hudsontaylor what's the problem?
hudsontaylor
@hudsontaylor
Jan 04 2017 19:17
I'm trying to console log each returned object with an "indentifier." But, it's returning the objects as undefined. Any ideas? http://codepen.io/Hudson_Taylor11/pen/YpjxKm?editors=0010
A_A
@Otto-AA
Jan 04 2017 19:18
you mean the console.log on line 18?
hudsontaylor
@hudsontaylor
Jan 04 2017 19:20
Yes.
If you look at the console, it's doing what I want but adding the word "undefined" to the beginning of each object.
A_A
@Otto-AA
Jan 04 2017 19:21
@hudsontaylor I get Object {}in the console
@hudsontaylor Can you save it another time. Maybe my version is a older one of yours?
hudsontaylor
@hudsontaylor
Jan 04 2017 19:23
Yes, but if you open it, there are three objects. Each one has a value of something like "undefined{"stream":null,"_links":{"self":"https://api.twitch.tv/kraken/streams/freecodecamp","channel":"https://api.twitch.tv/kraken/channels/freecodecamp"}}"
I saved it one more time :)
A_A
@Otto-AA
Jan 04 2017 19:24
@hudsontaylor Oh, the codepen console just didn't show it while the firefox console does O.o
@hudsontaylor you need info[identifier] = JSON.stringify(json);. Because at that moment info[identifier] is undefined
Ghulam Shabir
@ghulamshabir
Jan 04 2017 19:27
@hudsontaylor your console.log(info) gets called before getJSON's callback returns data
A_A
@Otto-AA
Jan 04 2017 19:28
@ghulamshabir Yeah, it gets called too early. But in my firefox (chrome most likely too) console it updates the description so I can look at it either way
Ghulam Shabir
@ghulamshabir
Jan 04 2017 19:29
@Otto-AA if he wants to use that from json then he must use it inside the getJSON callback
hudsontaylor
@hudsontaylor
Jan 04 2017 19:30
@Otto-AA I changed it from info[identifier] += JSON.stringify(json); to info[identifier] = JSON.stringify(json); and it works fine. Apparently the + was throwing things. Thanks!
CamperBot
@camperbot
Jan 04 2017 19:30
hudsontaylor sends brownie points to @otto-aa :sparkles: :thumbsup: :sparkles:
:warning: hudsontaylor already gave otto-aa points
A_A
@Otto-AA
Jan 04 2017 19:30
@ghulamshabir That's also the way I would do it. But firefox automatically updates the console.log statement when the getJSON is finished
Radmir Akzhigitov
@Radmir2015
Jan 04 2017 19:31
Hi)) Who can help me with codepen?
A_A
@Otto-AA
Jan 04 2017 19:31
@Radmir2015 Just ask ;)
Ghulam Shabir
@ghulamshabir
Jan 04 2017 19:35
@Otto-AA printing in console is different than using the data
A_A
@Otto-AA
Jan 04 2017 19:36
@ghulamshabir Yup, using the data wouldn't work =D
Ghulam Shabir
@ghulamshabir
Jan 04 2017 19:37
@Otto-AA :+1:
Zaurbek Zhakupov
@zzhakupov
Jan 04 2017 19:37
Hello guys, can somebody answer do I need to make many dungeons in the rogue like challenge or is one enough?
Radmir Akzhigitov
@Radmir2015
Jan 04 2017 19:41
Заурбек, ты казахстанец?
A_A
@Otto-AA
Jan 04 2017 19:42
Radmir Akzhigitov
@Radmir2015
Jan 04 2017 19:42
@Otto-AA I am creating a Local Weather project.
Codepen not want to determine the location using navigator.geolocation, I read on the Internet that need to use https, instead of http. To do so and it worked, but now with this connection does not want to take JSON from openWeather. How to fix?
A_A
@Otto-AA
Jan 04 2017 19:43
@Radmir2015 Can you link the pen?
@Radmir2015 And which browser are you using?
Radmir Akzhigitov
@Radmir2015
Jan 04 2017 19:43
@Otto-AA Google Chrome...
Radmir Akzhigitov
@Radmir2015
Jan 04 2017 19:52
@TylerMoeller thanks, but why does it work? I want to try to do it without this site.
CamperBot
@camperbot
Jan 04 2017 19:52
radmir2015 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1264 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Jan 04 2017 19:55
@Radmir2015 Maybe this will help explain loading HTTP over HTTPS: https://developers.google.com/web/fundamentals/security/prevent-mixed-content/what-is-mixed-content
Radmir Akzhigitov
@Radmir2015
Jan 04 2017 20:01
@TylerMoeller this is a problem everywhere, or only in Codepen?
Tyler Moeller
@TylerMoeller
Jan 04 2017 20:04
@Radmir2015 It happens everywhere - HTTPS is meant to be secure, HTTP is not.
Radmir Akzhigitov
@Radmir2015
Jan 04 2017 20:09
@TylerMoeller If it is global, I think that it is already able to solve. Thank you so much. And you have already passed the entire course?
CamperBot
@camperbot
Jan 04 2017 20:09
radmir2015 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:warning: radmir2015 already gave tylermoeller points
Tyler Moeller
@TylerMoeller
Jan 04 2017 20:11
Yes, it can be solved by using a Weather API that supports both HTTP and HTTPS. I passed the front end portion of the course. Still working slowly on the other parts.
Salomon
@zarruk
Jan 04 2017 20:15
Hello. Do you know how can i do to make the AC and CE buttons be just below the other AC and CE buttons? https://codepen.io/zarruk/pen/NbVxQe?editors=1100
Sorry. I mean, just below the other buttons
Radmir Akzhigitov
@Radmir2015
Jan 04 2017 20:16
@TylerMoeller and how, if I may switch it to https connection? And how much time you've spent on all courses (for a long time started)?
Tyler Moeller
@TylerMoeller
Jan 04 2017 20:18
@Radmir2015 To switch to HTTPS connection, change the address to https://codepen.io/ instead of http://codepen.io/ in your browser.
I've probably spent over 500hrs by now since the very beginning. They have estimates at https://www.freecodecamp.com/map
João Novaes Barreiros
@Jon-Nova
Jan 04 2017 20:21
what is the best way to upload images to use in codepen
?
Radmir Akzhigitov
@Radmir2015
Jan 04 2017 20:30
@TylerMoeller I've already done it. But as I said, geolocation is not working, because the connection is unprotected.
Tyler Moeller
@TylerMoeller
Jan 04 2017 20:32
@Radmir2015 Your connection is protected if you visit codepen over HTTPS, maybe I'm misunderstanding.
Does this work for you? https://codepen.io/TylerMoeller/pen/ZBBEGq
What does "Location Provider" say when you open that page?
Salomon
@zarruk
Jan 04 2017 20:36
Hello. Do you know how can i do to make the AC and CE buttons be just below the other buttons? https://codepen.io/zarruk/pen/NbVxQe?editors=1100
Tyler Moeller
@TylerMoeller
Jan 04 2017 20:37
@zarruk You might want to put them at the top like on most calculators, and you also need to add a divide button.
@Jon-Nova Lots of people use https://postimage.org
João Novaes Barreiros
@Jon-Nova
Jan 04 2017 20:38
@TylerMoeller thx
CamperBot
@camperbot
Jan 04 2017 20:38
jon-nova sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1265 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Salomon
@zarruk
Jan 04 2017 20:39
@TylerMoeller Ok, yes, I know but the issue is not where I put them but how do I put buttons below all the other buttons if the = button is of a different height
Radmir Akzhigitov
@Radmir2015
Jan 04 2017 20:41
@TylerMoeller "Location Provider" say: navigator.geolocation
Salomon
@zarruk
Jan 04 2017 20:42
https://codepen.io/zarruk/pen/NbVxQe?editors=1100 @TylerMoeller this is what I mean
Tyler Moeller
@TylerMoeller
Jan 04 2017 20:43
@Radmir2015 Right, so navigator.geolocation works in your browser if you load the web page over HTTPS.
If you load that same web page over HTTP, it will show a different location provider: http://s.codepen.io/TylerMoeller/pen/ZBBEGq
Salomon
@zarruk
Jan 04 2017 20:44
@TylerMoeller well, that way I'd have to put it manually
Tyler Moeller
@TylerMoeller
Jan 04 2017 20:45
@zarruk That's why I recommend putting those buttons at the top
Salomon
@zarruk
Jan 04 2017 20:45
@TylerMoeller https://codepen.io/zarruk/pen/NbVxQe?editors=1100 I already did. However, that is not the issue
Radmir Akzhigitov
@Radmir2015
Jan 04 2017 20:46
@TylerMoeller I use HTTPS, but I can download JSON... Can I download without using prefix site?
Radmir Akzhigitov
@Radmir2015
Jan 04 2017 20:53
@TylerMoeller If (I'm using IP-geolocation interface), the result is not accurate (80 km mistaken).
Tyler Moeller
@TylerMoeller
Jan 04 2017 20:55
@Radmir2015 Yes, IP-based location is not very accurate, but that's the tradeoff if you want to give people weather over HTTP or if the user decides to block navigator.geolocation
@zarruk You can also use a <div> for each column of buttons or for each row depending on how you want the final layout to look.
Radmir Akzhigitov
@Radmir2015
Jan 04 2017 21:01
@TylerMoeller
function(){
var obj;
someMethod(function(val){obj=val.prop;});
return obj;}
How to fix it? Return: undefined.
Katie Shermer
@katieshermer
Jan 04 2017 21:03
Hey guys, just finished the first CodePen challenge: http://codepen.io/katieshermer/pen/GrgJOZ
Let me know what you think! I did copy the basic layout since I'm pretty new to Bootstrap.
Sander Berntsen
@sbxn14
Jan 04 2017 21:04
how do I get a middle section like in this example? https://codepen.io/FreeCodeCamp/full/YqLyXB/
JD Tadlock
@jdtdesigns
Jan 04 2017 21:06
@zarruk A much simpler approach:
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.row {
  display: flex;
}

.calculator {
  display: flex;
  flex-direction: column;
}

.calculator button {
  width: 30px;
  height: 30px;
  margin: 3px 3px;
}


<div class="calculator">
  <div class="row">
    <button>AC</button>
    <button>CE</button>
    <button>/</button>
    <button>+</button>
  </div>
  <div class="row">
    <button>1</button>
    <button>2</button>
    <button>3</button>
    <button>-</button>
  </div>
</div>
Salomon
@zarruk
Jan 04 2017 21:08
@jdtdesigns do you mean making it row by row?
JD Tadlock
@jdtdesigns
Jan 04 2017 21:09
@zarruk Yes, wrap the buttons in a row and make it flex. This will do a lot of things for you, so all you need to do is set height and width and margin.
Salomon
@zarruk
Jan 04 2017 21:10
but what about the buttons with a larger height (like the = button)? @jdtdesigns
The next row would be below the = button and not besides it
JD Tadlock
@jdtdesigns
Jan 04 2017 21:12
@zarruk There's a few ways. I'll post an example of one approach that's pretty easy.
Salomon
@zarruk
Jan 04 2017 21:13
@jdtdesigns Great!
Simon Cordova
@gbsimon87
Jan 04 2017 21:20
@jdtdesigns long time, happy ny
JD Tadlock
@jdtdesigns
Jan 04 2017 21:21
@gbsimon87 And a Happy New Year to you ;)
Salomon
@zarruk
Jan 04 2017 21:24
@jdtdesigns thanks so much! I got it!
CamperBot
@camperbot
Jan 04 2017 21:24
zarruk sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 790 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
JD Tadlock
@jdtdesigns
Jan 04 2017 21:24
@zarruk Awesome!
Damla Köksal
@damlakoksal
Jan 04 2017 21:39
Hi everyone! I want to activate night mode but it says authorization required, can someone help me?
I'm trying to get my img to be center on the page can anyone help
well now that i look at it in the preview it looks center....wth
Tom
@moT01
Jan 04 2017 21:46
@mendala margin: 0 auto; puts equal margin on the left and right
mendala
@mendala
Jan 04 2017 21:46
gotcha
margin: 0 auto; will only work if the image is displayed as block
it's inline-block by default
mendala
@mendala
Jan 04 2017 21:55
oh i see. what does display mean?
I'm still learning
Sander Berntsen
@sbxn14
Jan 04 2017 21:56
damn I really need help. http://codepen.io/sbxn14/full/VPwNzE/ I currently got this set up and want it to scroll (used smoothscroll in jQuery for that) but first of all. it doesnt scroll and I donno what i did wrong and secondly. if you click on one of the links in the navbar it doesnt go to the top of the section but a few lines down from it how do I fix these things
Salomon
@zarruk
Jan 04 2017 22:02
does someone know where can I find all types of fonts? I want to add a font that seems "electronic" for my calculator project
Jason
@ICodeWateverIFeelLikeCoding
Jan 04 2017 22:05
@zarruk google fonts
JD Tadlock
@jdtdesigns
Jan 04 2017 22:11
@sbxn14 You don't need another script other than jquery to do smooth scroll. I took smooth-scroll off and used the standard default method. I also corrected the html a little. You don't need links inside the divs. The divs should have the id. I also changed them to 'sections' to make css styling easy. ;)
http://codepen.io/jdtadlock/pen/dNPMJb?editors=0100
You can just subtract some amount from the 'offset' to make the scroll-to point a little higher.
Jason
@ICodeWateverIFeelLikeCoding
Jan 04 2017 22:12
Does anybody know how i could center my <li> elements within my <div> element that has been centered using margin: auto? i am trying to create a nav bar. i've centered the bar, but my <li> elements are positioned using position:absolute(left input, top input) so they're not truly centered. Only centered on my screen.
Ralph Nahra
@Rallph
Jan 04 2017 22:16
Hey guys I'm doing the wikipedia viewer project and I'm a bit dumbfounded as to how I'm supposed to get the user's inputted value from the search box
Sander Berntsen
@sbxn14
Jan 04 2017 22:27
@jdtdesigns omg I love you so much thank you!!!
CamperBot
@camperbot
Jan 04 2017 22:27
sbxn14 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 791 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Sander Berntsen
@sbxn14
Jan 04 2017 22:27
@jdtdesigns thanks! have all my brownies
CamperBot
@camperbot
Jan 04 2017 22:27
sbxn14 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: sbxn14 already gave jdtdesigns points
JD Tadlock
@jdtdesigns
Jan 04 2017 22:29
Sander Berntsen
@sbxn14
Jan 04 2017 22:29
@jdtdesigns could you explain to me what you exactly changed as I cannot really find it myself and I dont udnerstand your actual description. I want to learn what I did wrong
oo the offset point
nvm got it
Ralph Nahra
@Rallph
Jan 04 2017 22:40
@jdtdesigns thank you, but can you explain the purpose of making getResults a variable that is actually a function. Also can you explain the "e.preventDefault()" line?
CamperBot
@camperbot
Jan 04 2017 22:40
rallph sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 792 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Jon Brandwein
@jdb409
Jan 04 2017 22:42
Hi, I'm having problems with my twitch api code.
I'm trying 2 ajax calls to get the streams and channel data
the first ajax call is fine, but the second is returning undefined values
JD Tadlock
@jdtdesigns
Jan 04 2017 22:44
@Rallph It's habit for me to declare my functions as variables because I usually locally scope all my code. You can use regular functions if you like with such a small amount of code. The preventDefault keeps the form from submitting to the current page. Take the prevent away and you'll see the page refresh when you click the button. That's the default behavior of forms. They submit to the current page or another and some server side script gets the input data from the form.
Ralph Nahra
@Rallph
Jan 04 2017 22:45
ok, thanks a ton man
Jon Brandwein
@jdb409
Jan 04 2017 22:51
any help?
Alan Sato
@Halfcreative
Jan 04 2017 22:54
Hey All, i'm having a little trouble with my Local Weather App. I am unsure on how to use an API key or where to place it in my getJSON method. My Codepen is here in case im just doing it wrong to begin with: https://codepen.io/halfcreative/pen/BpaPKx?editors=0010
@jdb409 havent gotten to your project yet but if you want to post your codepen i can take a look
Walid Ashri
@walidashri
Jan 04 2017 22:58
@Halfcreative jus add &appid= YOUR-APIKEY-HERE in ur url
John P Penaloza
@johnpyp
Jan 04 2017 23:00
Hey guys, how would I dead-center a div container inside of a container-fluid so that the container-fluid took the whole page visible, with no scrollbar, and the div container was just centered vertically and horizontally.
Alan Sato
@Halfcreative
Jan 04 2017 23:01
I am now getting the error, "jquery min is 4"
Joshua
@jfc246
Jan 04 2017 23:08
DarylKnapp
@DarylKnapp
Jan 04 2017 23:08
What is up front end devs? :P
Joshua
@jfc246
Jan 04 2017 23:09
@DarylKnapp me??
:P
DarylKnapp
@DarylKnapp
Jan 04 2017 23:12
@jfc246 Except you :P jk jk
Anthony Mitchell
@Drantho
Jan 04 2017 23:16
@Halfcreative its not a good idea to use api keys in codepen I used a method for finding location that didnt require one for my weather project
Alan Sato
@Halfcreative
Jan 04 2017 23:18
@Drantho directly from the assignment "
We recommend using the Open Weather API. This will require creating a free API key. Normally you want to avoid exposing API keys on CodePen, but we haven't been able to find a keyless API for weather."
so i just went with the Open Weather
Anthony Mitchell
@Drantho
Jan 04 2017 23:19
@Halfcreative i thought you were referring to the method of getting the user's location because it looks like you are using the weather api key correctly
Alan Sato
@Halfcreative
Jan 04 2017 23:20
@Drantho now its giving me net::ERR_CONNECTION_REFUSED
This request has been blocked; the content must be served over HTTPS. but if i switch my api url to run over https i cant connect
and if i dont run Codepen on https i get an error cus i cant load weather
Anthony Mitchell
@Drantho
Jan 04 2017 23:23
@Halfcreative look into $.get(url, function (response) {}, "jsonp"); the "jsonp" part particularly
Alan Sato
@Halfcreative
Jan 04 2017 23:29
what is AJAX?
Anthony Mitchell
@Drantho
Jan 04 2017 23:30
so your url works if you use http not https
and the jsonp thing i think gets around you asking a different domain for information
AJAX is a technique for updating part of your page without a full refresh
try switching to http and adding the jsonp argument to your $get