These are chat archives for FreeCodeCamp/HelpFrontEnd

26th
Aug 2016
Aaron
@apalm1341
Aug 26 2016 00:32
How do I get all of my text to appear?
http://codepen.io/ap1341/pen/grNWoJ
Can someone help me please? After I added my first background image, a lot of my text disappeared
I want to retrieve it back
Rachel
@1993pennylane
Aug 26 2016 01:40
Hi there. I'm trying to make my background of my HTML white and my background of my body a different color. I've tried multiple times and with and without div tags but it is still not working. Can someone point out what's going wrong here? Here is my code:

<!doctype html>

<HTML LANG="EN">
<head>
<meta charset="utf-8">
<meta name="description" content="page for exploring html documents">
<link rel="stylesheet" type="text/css" href="css%20style%20sheet.css">
<title> Rachel is Learning to Code!</title>
<style>
html {
background-color: honeydew;

    }
   div > body {
        color: black;
        background-color: aliceblue;
        width: 40%
        margin: 0 auto;
        padding: 50px;
    }    
</style>
</head>

<div> <body>
<p > This is a paragraph.</p>

</body> </div>

Anukath
@Anukath
Aug 26 2016 01:42
you just have to change the bodu color @1993pennylane
Rachel
@1993pennylane
Aug 26 2016 01:43
To a different color?
Anukath
@Anukath
Aug 26 2016 01:43
yup.. and delete html {
background-color: honeydew;
}
Rachel
@1993pennylane
Aug 26 2016 01:45
when I delete html {} all my page formatting gets weird
Like the body expands to the entire page view
Anukath
@Anukath
Aug 26 2016 01:46
how many pages do you have?
Rachel
@1993pennylane
Aug 26 2016 01:46
You can't see it here but I have 2
Anukath
@Anukath
Aug 26 2016 01:48
no idea
patricia grace
@patriciagrace
Aug 26 2016 01:49
what do mean "the background of my html white". You mean the background of the text?
Nicholas Vorraso
@nickeyvee
Aug 26 2016 01:49
how can i text if my ajax request is working in the console?!? http://codepen.io/nickey_vee/pen/QEXYWX?editors=1112
patricia grace
@patriciagrace
Aug 26 2016 01:49
@1993pennylane sorry that questions was for Rachel :) what do mean "the background of my html white". You mean the background of the text?
Rachel
@1993pennylane
Aug 26 2016 01:50
No, I mean the background of the screen
I saw a teacher in lynda do it and I liked how it looked
so I applied it to experiment with my code
But it doesn't work for me haha
patricia grace
@patriciagrace
Aug 26 2016 01:51
Ok, I didnt understand background of html and background of body as being two different things.
Anukath
@Anukath
Aug 26 2016 01:51
@nickeyvee you have an error in line 1
@nickeyvee $( document ).ready(function() {
Nicholas Vorraso
@nickeyvee
Aug 26 2016 01:53
@Anukath whoops no bling
vínαч puppαl
@vinaypuppal
Aug 26 2016 01:53
@nickeyvee and u need to add protocol http:// to ur URL in ajax request
Rachel
@1993pennylane
Aug 26 2016 01:54
@patriciagrace Yeah no worries, it is confusing. I've got to work for a little while but I'll be back soon if you're gonna be around I will definitely appreciate more of your troubleshooting help.
patricia grace
@patriciagrace
Aug 26 2016 01:54
no prob :)
vínαч puppαl
@vinaypuppal
Aug 26 2016 01:54
@nickeyvee and u need API Key from openweathermap to access weather data
Nicholas Vorraso
@nickeyvee
Aug 26 2016 01:57
@vinaypuppal ah ok, the fcc section on AJAX and JSON isn't very helpful -forgive me if these mistakes seem trivial
lol
vínαч puppαl
@vinaypuppal
Aug 26 2016 02:00
@nickeyvee nothing to worry :smile: . Signup for API key here http://openweathermap.org/api and read what response data you may get in documentation.
@nickeyvee and check chrome console for errors, that the best place to see if something is not working as expected :smile:
Nicholas Vorraso
@nickeyvee
Aug 26 2016 02:02
@vinaypuppal how would i insert the api key?
@vinaypuppal into the ajax function
vínαч puppαl
@vinaypuppal
Aug 26 2016 02:05
@nickeyvee read documentation http://openweathermap.org/current and figure it yourself thats the key of doing this project. Reading and understanding API documentation. Give it a try, if not able to find ask over here again someone might help you.
Nicholas Vorraso
@nickeyvee
Aug 26 2016 02:12
@vinaypuppal thanks for the help
CamperBot
@camperbot
Aug 26 2016 02:12
nickeyvee sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 462 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
Daulis M Gonzalez
@daulis809
Aug 26 2016 02:35
Hi @ll
Ahmed
@HosTilezZz
Aug 26 2016 02:37
@JLuboff @olgierd-on-fire thanks a ton guys! i had to fix the rgb value AND use !important to make it work, thanks a lot guys
CamperBot
@camperbot
Aug 26 2016 02:37
hostilezzz sends brownie points to @jluboff and @olgierd-on-fire :sparkles: :thumbsup: :sparkles:
:cookie: 322 | @jluboff |http://www.freecodecamp.com/jluboff
:cookie: 84 | @olgierd-on-fire |http://www.freecodecamp.com/olgierd-on-fire
Olga C
@Octopinky
Aug 26 2016 02:37
Hello
Toni Shortsleeve
@KoniKodes
Aug 26 2016 02:59
@vinaypuppal I totally agree with @nickeyvee -- the chrome console is your best frenemy for fixing those errors.
olgi3rd
@olgi3rd
Aug 26 2016 03:01
@KoniKodes I also agree with great chrome console.
Toni Shortsleeve
@KoniKodes
Aug 26 2016 03:02
I have such a love/hate relationship with that console...
Zach Weitzel
@zach362
Aug 26 2016 03:03
Hey guys! Almost done with my tribute page, how much harder is the portfolio?
Bhushan Patil
@mrpatil007
Aug 26 2016 03:04
@zach362 hm it's simpler not to much harder
Zach Weitzel
@zach362
Aug 26 2016 03:05
alright thanks
just tried the pen..
Dennis Domingo
@DenzDomingo
Aug 26 2016 03:14
basic formatting and linking fanatically for lebron lol :clap:
Stacey
@anastasi5
Aug 26 2016 03:22
@davisec52 , that's what i'm using, but I'm trying to have my buttons floating on the right, with my logo on the left. Again, I can get that look with the bootstrap grid, but I can't fix it to the top... How can I match the sample?
Justin
@jhadams82
Aug 26 2016 03:25
omg guys... i can't believe it. i finally found the bug
olgi3rd
@olgi3rd
Aug 26 2016 03:25
@jhadams82 Congrats.
Daniel Lu
@danielplu
Aug 26 2016 03:25
Hi, can someone explain to me what container-fluid does in bootstrap? Thanks!
Justin
@jhadams82
Aug 26 2016 03:25
it's embarassing, but whatevs. i banged my head on a wall for a WEEK AND A HALF
Chris Cullen
@123xylem
Aug 26 2016 03:26
This message was deleted
Justin
@jhadams82
Aug 26 2016 03:26
and i finally just now noticed i spelled "wrapper" with just one "p" lmao. omg....
olgi3rd
@olgi3rd
Aug 26 2016 03:26
@jhadams82 Use .container-fluid for a full width container, spanning the entire width of your viewport.
Chris Cullen
@123xylem
Aug 26 2016 03:26
This message was deleted

var boxTop = ["A", "B", "C"];
var boxMid = ["D", "E", "F"];
var boxBot = ["G", "H", "I"];
var boxVert1 = ["A", "D", "G"];
var boxVert2 = ["B", "E", "H"];
var boxVert3 = ["C", "F", "I"];
var boxDiag1 = ["A", "E", "I"];
var boxDiag2 = ["C", "E", "G"];

function win(){
  for (j=0;j<answers.length;j++){
  if(answer[j]==)                                       // How can i say if J finds all elements of var box top eg A B and C?

}}
Im trying to write a victory scan that checks to see if user inputs ever contain the victory condiition inputs. maybe test is good here?
Justin
@jhadams82
Aug 26 2016 03:27
it was the first time i was playing around with flexbox so i thought for sure I wasn't using it right. but nope, simple spelling mistake. geez
Daniel Lu
@danielplu
Aug 26 2016 03:28
@olgierd-on-fire do you generally use container-fluid in most html docs
olgi3rd
@olgi3rd
Aug 26 2016 03:29
@danielplu I dunno
Justin
@jhadams82
Aug 26 2016 03:29
@123xylem instead of having all these separate win condition arrays, could you do an array of all of them together?
olgi3rd
@olgi3rd
Aug 26 2016 03:29
@danielplu I don't use bootstrap for now
Daniel Lu
@danielplu
Aug 26 2016 03:29
Oh, i'm working through the bootstrap section
olgi3rd
@olgi3rd
Aug 26 2016 03:29
Semantic UI looks pretty instead.
Daniel Lu
@danielplu
Aug 26 2016 03:29
They didn't really go into depth on what container-fluid is, but that's ok
Thanks @olgierd-on-fire
CamperBot
@camperbot
Aug 26 2016 03:29
:cookie: 85 | @olgierd-on-fire |http://www.freecodecamp.com/olgierd-on-fire
danielplu sends brownie points to @olgierd-on-fire :sparkles: :thumbsup: :sparkles:
Justin
@jhadams82
Aug 26 2016 03:30
@123xylem then you could do if (win_conditions.indexOf(answer[j]) >-1)
Chris Cullen
@123xylem
Aug 26 2016 03:30
@jhadams82 for what reason? with this I can say if any show up in answers array I know someone has won
olgi3rd
@olgi3rd
Aug 26 2016 03:30
@danielplu See the official bootstrap docs.
Daniel Lu
@danielplu
Aug 26 2016 03:30
Alright
Justin
@jhadams82
Aug 26 2016 03:30
oooh, ok
Chris Cullen
@123xylem
Aug 26 2016 03:30
i dont know about underscores yet
Justin
@jhadams82
Aug 26 2016 03:30
i need to take a better look at your code. gimmy a minute
Chris Cullen
@123xylem
Aug 26 2016 03:30
@jhadams82 sure!
olgi3rd
@olgi3rd
Aug 26 2016 03:31
underscore.js is a set of javascript functions?
Chris Cullen
@123xylem
Aug 26 2016 03:33
@olgierd-on-fire i think its a new way of doing a lot of good shortcuts
Adesh Kumar
@adeskmr
Aug 26 2016 03:34
I want to place a google font on my tribute page but I want to us a lighten version of the one I have how do I do that?
Marc Droz
@b1tc0de
Aug 26 2016 03:44
3 days trying to make a darn navbar to collapse on small screen but cannot get it to work, please help...pasting code...
<nav class="navbar navbar-defaults myPadding" role="navigation">
      <div class="container-fluid myPadding">
        <div class="nav-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
          <a class="navbar-brand" href="#">
            <img alt="Brand" src="images/bitcodeLogo.png">
            <div class="collapse navbar-collapse" id="myNavbar">
            <ul class="nav navbar-nav navbar-right nav-pills">
              <li class="active"><a href="#">Home</a></li>
              <li><a href="#">About</a></li>
              <li><a href="#">Portfolio</a></li>
              <li><a href="#">freeCodeCamp</a></li>
              <div>
          </a>
        </div>
      </div>
    </nav>
the toggle button is transparent and does nothing
Owlie
@Owlie
Aug 26 2016 03:52
@b1tc0de Are you doing this in a codePen ?
Marc Droz
@b1tc0de
Aug 26 2016 03:53
no on my computer first...is space challenging to do it on code pen lol
is it better if i start from scratch on codepen?
Owlie
@Owlie
Aug 26 2016 03:53
@b1tc0de Remove the 's' from 'navbar-defaults'. Should just be 'navbar-default'.
@b1tc0de That should fix it.
Marc Droz
@b1tc0de
Aug 26 2016 03:54
awsome now i can see the button but still does not expands
Owlie
@Owlie
Aug 26 2016 03:55
Strange, it does for me. Do you have bootstrap.js and jquery.js added to the page it is on?
It should be jquery.js first, then bootstrap.js as well as bootstrap.css.
Marc Droz
@b1tc0de
Aug 26 2016 03:55
checking...
bootstrap.min.js bootstrap.min.css but not jquery.js
ill add it and try again
Owlie
@Owlie
Aug 26 2016 03:57
That would be the issue, and make sure you add it before bootstrap.min.js
Marc Droz
@b1tc0de
Aug 26 2016 03:58
<script src="https://ajax.googleapis.com/ajax/libs/jqueru/1.12.4/jquery.min.js"></script>
this one?
thanks for your time @Owlie
CamperBot
@camperbot
Aug 26 2016 03:59
:cookie: 327 | @owlie |http://www.freecodecamp.com/owlie
b1tc0de sends brownie points to @owlie :sparkles: :thumbsup: :sparkles:
Owlie
@Owlie
Aug 26 2016 04:00
Yeah thats the minimum version requirement for bootstrap. Should work perfectly.
@b1tc0de No problem.
Marc Droz
@b1tc0de
Aug 26 2016 04:02
no not yet
should i do it better on codePen right? that way i can share the code and get better help?
Owlie
@Owlie
Aug 26 2016 04:04
Yeah it would be easier to share the code and see what the problem is.
Marc Droz
@b1tc0de
Aug 26 2016 04:05
cool i'll do it thanks thou
Angel J Piscola
@Redmega
Aug 26 2016 04:05
Having an issue with a responsive image
The github image doesn't conform to the column's width, despite having max-width: 100% and height:auto. The other images are sizing just fine
(Open it in codepen, I've restricted my s3 bucket to deliver only to s.codepen.io
Angel J Piscola
@Redmega
Aug 26 2016 04:17
Figured it out, I was missing a .col
Olga C
@Octopinky
Aug 26 2016 04:20
@Redmega nice parallax effect!
Angel J Piscola
@Redmega
Aug 26 2016 04:20
Thanks, I'm using the Materializecss framework
Based on Material Design from google
I'm having trouble deciding if the note to "Come see me on linkedin" should scroll down to social media, or take them straight to linked in
Marc Droz
@b1tc0de
Aug 26 2016 04:47
nav bar not working please help, pasted as is no change to it
Kiriga Puro
@Kirigapuro
Aug 26 2016 04:58
hi guys, how do you display image in codepen? i try using links to some images but wont able to get them displayed.
Justin
@jhadams82
Aug 26 2016 05:03
what's the url to your image?
@Kirigapuro
Owlie
@Owlie
Aug 26 2016 05:08
@b1tc0de Add bootstrap to the JS section in the settings Marc
You have the bootstrap CSS added, as well as jQuery, but you also need bootstrapJS as well
Kiriga Puro
@Kirigapuro
Aug 26 2016 05:09
@jhadams82
Marc Droz
@b1tc0de
Aug 26 2016 05:11
thanks again @Owlie
CamperBot
@camperbot
Aug 26 2016 05:11
b1tc0de sends brownie points to @owlie :sparkles: :thumbsup: :sparkles:
:cookie: 328 | @owlie |http://www.freecodecamp.com/owlie
Kiriga Puro
@Kirigapuro
Aug 26 2016 05:14
@Owlie thanks. it worked but i wanna know the difference
CamperBot
@camperbot
Aug 26 2016 05:14
kirigapuro sends brownie points to @owlie :sparkles: :thumbsup: :sparkles:
:cookie: 329 | @owlie |http://www.freecodecamp.com/owlie
Angel J Piscola
@Redmega
Aug 26 2016 05:18
@Kirigapuro One is the link to the image, and one is the link to the entire webpage
Owlie
@Owlie
Aug 26 2016 05:23
@Kirigapuro The first url you sent was just a link to the media page, the second was to the actual media. It has to do with how the gettyimages site works, but usually in any other case you'd want to link to media with a .jpg, .png, or other extension in the URL.
Chris Cullen
@123xylem
Aug 26 2016 05:41
 if (userX) {
    $("#" + choice + "").text("O");

    console.log(choice + " cpumove");

    removeChoice(choice);

    console.log(choices + " choices array after cpumove")
  } else {
    $("#" + choice + "").text("X");
My tic tac inputs are done in JS... IS there a way of me saying O has class of color:blue in css or is there some kind of way of me changing the O and X color?
Im trying to add a css class to my js output.. I know its the other way around but there must be a way??
Owlie
@Owlie
Aug 26 2016 05:44
@123xylem Look in to the jQuery .class method.
@123xylem I'm sorry I meant .css
So something like $(element).css('color', '#0000FF');
or $(element).addClass("class-name");
Justin
@jhadams82
Aug 26 2016 05:50
can somebody look at my pen and tell me why only one of my "MORE INFO" buttons toggles to "LESS INFO"?
https://codepen.io/jhadams82/pen/akYmmy?editors=0010
that is so weird.
Owlie
@Owlie
Aug 26 2016 05:53
@jhadams82 You're only adding the click function to the first element found.
Although looking at your code it seems like it should work. Let me check further.
Justin
@jhadams82
Aug 26 2016 05:56
@Owlie nope, if you click on the other buttons, it expands the details section. it just doesn't toggle the up/down arrow & text
the line of code that slides the details up and down is applied to every button on the page. but the if statement only gets applied to the first one.
@Owlie ah crap. nevermind
the problem isn't my JS it's my HTML
sorry :)
Owlie
@Owlie
Aug 26 2016 05:59
@jhadams82 lol I just found the issue as well. H5 tags right
Chris Cullen
@123xylem
Aug 26 2016 05:59
@Owlie k il look into that
@jhadams82 fwiw i looked into it for u :)
Justin
@jhadams82
Aug 26 2016 06:03
@123xylem lol, thanks. man, that's my problem. i can write complicated stuff, but it's the simple little things that always hang me up. i'll spend days looking for errors in my JS when it's a spelling error in my HTML or CSS and i just don't think to check there. bleh
CamperBot
@camperbot
Aug 26 2016 06:03
jhadams82 sends brownie points to @123xylem :sparkles: :thumbsup: :sparkles:
:cookie: 330 | @123xylem |http://www.freecodecamp.com/123xylem
Justin
@jhadams82
Aug 26 2016 06:03
and thanks @Owlie for lookin at it, too
CamperBot
@camperbot
Aug 26 2016 06:03
jhadams82 sends brownie points to @owlie :sparkles: :thumbsup: :sparkles:
:cookie: 330 | @owlie |http://www.freecodecamp.com/owlie
Chris Cullen
@123xylem
Aug 26 2016 06:03
@jhadams82 ha no worries.. ur pretty good considering im ahead of u
Justin
@jhadams82
Aug 26 2016 06:05
@123xylem what all do you have left? all i've got is tic tac toe and simon and i'm done with front end
taking FOREVER tho. i started almost a year ago
just don't have enough spare time
Chris Cullen
@123xylem
Aug 26 2016 06:09
@jhadams82 o really.. twitch viewer is somewhere in the middle i though
unless your doing it out of order
Justin
@jhadams82
Aug 26 2016 06:33
yeah, i'm doing it out of order, i think
there towards the end i started skipping around
but anyway OOMMGG I THINK ITS DONE!!! WOOT!!
somebody tell me what's wrong with it. there has to be something
https://codepen.io/jhadams82/full/akYmmy/
ah, crap
it's not responsive, lol
lmao, that fast
still tho, at least on laptop and up, it works how i want it to
i need to make it responsive and clean up the code. i've probably got a ton of console.logs still in there
Justin
@jhadams82
Aug 26 2016 06:42
well, that's all for tonight. thanks everybody! happy coding, g'night
Chris Cullen
@123xylem
Aug 26 2016 06:53
http://codepen.io/123xylem/pen/JKqYZY?editors=1111
Review my TicTacToe Game.. There are some problems including that the AI is thicker than pavarottis waistline...
It fulfills the user stories but I dont know if I will submit it yet.
Aniruddh Goteti
@aniruddhgoteti
Aug 26 2016 07:04
is there a link where we can share our projects?
in FCC
?
kat-mag
@kat-mag
Aug 26 2016 07:04
@aniruddhgoteti You can share here
Just a beginner project
Feel free to give suggestions
and hw can i transfer it to github?
kat-mag
@kat-mag
Aug 26 2016 07:07
@aniruddhgoteti Your photo isn't loading. It's probably because it's a shortened url and codepen is picky :)
@aniruddhgoteti You could develop it localy in e.g. Brackets and then push to github
@aniruddhgoteti It looks good, btw. Sans the photo not working ;P
Aniruddh Goteti
@aniruddhgoteti
Aug 26 2016 07:09
I will work on the photo, thanks @kat-mag
CamperBot
@camperbot
Aug 26 2016 07:09
aniruddhgoteti sends brownie points to @kat-mag :sparkles: :thumbsup: :sparkles:
:cookie: 312 | @kat-mag |http://www.freecodecamp.com/kat-mag
kat-mag
@kat-mag
Aug 26 2016 07:10
@aniruddhgoteti and remove the width&height and just add class="image-responsive" to your photo. Bootstrap will fix it for you so it's not squished :)
@aniruddhgoteti Yeah, loads all right now ;)
Aniruddh Goteti
@aniruddhgoteti
Aug 26 2016 07:12
Thanks for the suggestions!! :) @kat-mag
CamperBot
@camperbot
Aug 26 2016 07:12
aniruddhgoteti sends brownie points to @kat-mag :sparkles: :thumbsup: :sparkles:
:warning: aniruddhgoteti already gave kat-mag points
kat-mag
@kat-mag
Aug 26 2016 07:14
@aniruddhgoteti No problem. Have fun :)
krupa007
@krupa007
Aug 26 2016 07:50

// Example
var ourArray = ["Stimpson", "J", "cat"];
ourArray.shift(); // ourArray now equals ["J", "cat"]
ourArray.unshift("Happy");
// ourArray now equals ["Happy", "J", "cat"]

// Setup
var myArray = [["John", 23], ["dog", 3]];
myArray.shift();

// Only change code below this line.
myArray.unshift(["paul" , 35 ]);

I am unable to run this code
Kevin Su
@barberkevinsu
Aug 26 2016 07:51
Can someone take a look at my code please
$(document).ready(function() {
var weather = {};
if (navigator.geolocation) {
$(".data").html("ddd");
navigator.geolocation.getCurrentPosition(function(position) {
$(".data").html("latitude: " + position.coords.latitude + "<br>longitude: " + position.coords.longitude);
});
}
This is my js code, I cannot get longitude and latitude
You can ignore that "ddd", I wrote that for tests
Deepal D'Silva
@dsilvadeepal
Aug 26 2016 07:54
@krupa007 I believe you need to change the P in paul to Paul..
krupa007
@krupa007
Aug 26 2016 07:55
ohkay @dsilvadeepal i'll try this in my code
Thanks @dsilvadeepal
CamperBot
@camperbot
Aug 26 2016 07:56
krupa007 sends brownie points to @dsilvadeepal :sparkles: :thumbsup: :sparkles:
:cookie: 167 | @dsilvadeepal |http://www.freecodecamp.com/dsilvadeepal
krupa007
@krupa007
Aug 26 2016 07:56
its work
:+1:
:)
Deepal D'Silva
@dsilvadeepal
Aug 26 2016 07:57
@krupa007 No probs..minor stuff :smile:
krupa007
@krupa007
Aug 26 2016 07:57
yep silly mistake i have made .
kirbyedy
@kirbyedy
Aug 26 2016 08:03
@barberkevinsu are you trying that code in codepen ?
Kevin Su
@barberkevinsu
Aug 26 2016 08:05
yes
yes @kirbyedy
kirbyedy
@kirbyedy
Aug 26 2016 08:05
make sure your codepen link starts with https
Kevin Su
@barberkevinsu
Aug 26 2016 08:07
But I don't see any http or https, it starts directly with codepen.io/myID/
kirbyedy
@kirbyedy
Aug 26 2016 08:10
exactly, add it
Kevin Su
@barberkevinsu
Aug 26 2016 08:15
ha I see! Thanks
Alexander Domikov
@AlexanderDom
Aug 26 2016 08:19
hey hey everybody !
Chris Cullen
@123xylem
Aug 26 2016 08:25
function cpu() { //CPU move chosen from random choice var
  if (userX) {
    $("#" + choice + "").text("O").css("color", "blue");
    cpuAnswer.push(choice.toUpperCase());
    console.log(cpuAnswer);
    if (cpuAnswer.indexOf("A") >= 0 && cpuAnswer.indexOf("B") >= 0 && cpuAnswer.indexOf("C") >= 0) {
      alert("you win!");
    } else if (cpuAnswer.indexOf("D") >= 0 && cpuAnswer.indexOf("E") >= 0 && cpuAnswer.indexOf("F") >= 0) {
      alert("Cpu win!");
    } else if (cpuAnswer.indexOf("G") >= 0 && cpuAnswer.indexOf("H") >= 0 && cpuAnswer.indexOf("I") >= 0) {
      alert("Cpu win!");
    } else if (cpuAnswer.indexOf("A") >= 0 && cpuAnswer.indexOf("D") >= 0 && cpuAnswer.indexOf("G") >= 0) {
      alert("CPU win!");
    } else if (cpuAnswer.indexOf("B") >= 0 && cpuAnswer.indexOf("E") >= 0 && cpuAnswer.indexOf("H") >= 0) {
      alert("CPU win!");
    } else if (cpuAnswer.indexOf("C") >= 0 && cpuAnswer.indexOf("F") >= 0 && cpuAnswer.indexOf("I") >= 0) {
      alert("CPU win!");
    } else if (cpuAnswer.indexOf("A") >= 0 && cpuAnswer.indexOf("E") >= 0 && cpuAnswer.indexOf("I") >= 0) {
      alert("CPU win!");
    } else if (cpuAnswer.indexOf("C") >= 0 && cpuAnswer.indexOf("E") >= 0 && cpuAnswer.indexOf("G") >= 0) {
      alert("CPU win!");
    }
    removeChoice(choice);

    console.log(choice + " cpumove");
  }
Im trying to put a timeout on this Function to give it a sec but I cant work out the brackets on it.. or its not working...
setTimeout(function(){ CPU()//CPU FUNCTION; }, 1000);
the doer
@ewathedoer
Aug 26 2016 09:05
I gotta issue with flex box, it’s about media of min.width 1001px, why my margin-left: auto does not push social class items to the right? any help? http://codepen.io/thedoer/pen/OXZyvp?editors=1100 Now they’re evenly distributed
the doer
@ewathedoer
Aug 26 2016 09:15
Another issue is how to make the social items jump to the new line if there are 4 <li> items
vínαч puppαl
@vinaypuppal
Aug 26 2016 09:44
@ewathedoer margin:auto on .social is not working since there is no extra room for li to move right. Try text-align:center; and see if thats what you wanted :smile:
Kevin Su
@barberkevinsu
Aug 26 2016 09:46
$(document).ready(function() {
var weather = {};
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
weather.long = position.coords.longitude;
weather.lati = position.coords.latitude;
});
}
$(".data").html(weather.long);
the doer
@ewathedoer
Aug 26 2016 09:46
@vinaypuppal I did and besides that I want to move social class to the right and make some more space on desktop display between items and social class
still not sure how to get there
Kevin Su
@barberkevinsu
Aug 26 2016 09:46
I still cannot get location in this case
vínαч puppαl
@vinaypuppal
Aug 26 2016 09:52
@ewathedoer oh okay try to adjust flex values on li and see
@barberkevinsu you need to load your pen over https://url for gelocation to work in chrome
the doer
@ewathedoer
Aug 26 2016 09:58
@vinaypuppal thanks for a hint :) I’m not sure if the way I chose now in media> 1001px is a good practice but it works
CamperBot
@camperbot
Aug 26 2016 09:58
ewathedoer sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 463 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
Kevin Su
@barberkevinsu
Aug 26 2016 09:58
I had already added "https", it still does't work
@vinaypuppal
vínαч puppαl
@vinaypuppal
Aug 26 2016 09:59
@barberkevinsu can you see if there are any erros in chrome console ?? Or just share you pen link I will take a look
the doer
@ewathedoer
Aug 26 2016 10:01
@vinaypuppal do you happen to know how to make the social items jump to the new line if there are 4 <li> items instead of current 3?
Kevin Su
@barberkevinsu
Aug 26 2016 10:05
It seems like even google map cannot determine my location either...
I am going to use another computer
vínαч puppαl
@vinaypuppal
Aug 26 2016 10:12
@barberkevinsu just move $(".data").html(weather.long); inside navigator.geolocation.getCurrentPosition callback since geolocation detection is done asynchronously .
@barberkevinsu so $(".data").html(weather.long); is executed before position data is available that's why weather.long is undefined
@barberkevinsu is it working now??
@ewathedoer you can do that by adjusting flex or flex-basis values and with media queries
Kevin Su
@barberkevinsu
Aug 26 2016 10:17
I am turning on another computer, one sec
@vinaypuppal
vínαч puppαl
@vinaypuppal
Aug 26 2016 10:17
@barberkevinsu okay
Kevin Su
@barberkevinsu
Aug 26 2016 10:18
But anyway, thanks for your help :)
vínαч puppαl
@vinaypuppal
Aug 26 2016 10:19
@barberkevinsu :smile:
Kevin Su
@barberkevinsu
Aug 26 2016 10:23
Is this this what you mean?
vínαч puppαl
@vinaypuppal
Aug 26 2016 10:26
yes @barberkevinsu
the doer
@ewathedoer
Aug 26 2016 10:26
@vinaypuppal now I played a bit with flex basis and it works, it’s like calculating columns in a row in Bootstrap; I’m just wondering if there is some better way to separate the lines if eg I’m not sure how many items would be in each line.
What about displaying each line simply as flex, do I need any extra containers
?
and nesting, I’m new to flexbox
and looking for best practices
Kevin Su
@barberkevinsu
Aug 26 2016 10:26
But it seems like the geolocation is still not showed
@vinaypuppal
vínαч puppαl
@vinaypuppal
Aug 26 2016 10:28
@barberkevinsu well i can see just see below pic
Kevin Su
@barberkevinsu
Aug 26 2016 10:28
You can see your location?
Here in my place, it is still "will be fixed"... @vinaypuppal
vínαч puppαl
@vinaypuppal
Aug 26 2016 10:29
@barberkevinsu yes i uploaded screen shot just have a look
geo.png
Kevin Su
@barberkevinsu
Aug 26 2016 10:30
OK, that's good! Probably because I am in the space now
vínαч puppαl
@vinaypuppal
Aug 26 2016 10:31
This message was deleted
NixonRichard
@NixonRichard
Aug 26 2016 10:31
hi there
vínαч puppαl
@vinaypuppal
Aug 26 2016 10:31
This message was deleted
Kevin Su
@barberkevinsu
Aug 26 2016 10:31
Thanks man! You are awesome @vinaypuppal
CamperBot
@camperbot
Aug 26 2016 10:31
barberkevinsu sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 464 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
NixonRichard
@NixonRichard
Aug 26 2016 10:31
can i add an image from my computer to html ?
if so how to do that ?
vínαч puppαl
@vinaypuppal
Aug 26 2016 10:32
@NixonRichard if developing locally then yes , on codepen u have to host image and use URL to access that image
NixonRichard
@NixonRichard
Aug 26 2016 10:32
how can i host img ?
like hosting a webpage ?
get a sever or else
vínαч puppαl
@vinaypuppal
Aug 26 2016 10:33
@NixonRichard u can use save your image in dropbox and use that URL its simple or use image hosting service like http://cloudinary.com/ use this if you are building demo production ready sites because it provides optimised images
Shubham yadav
@Shubham007yadav
Aug 26 2016 10:34
try imgur.com
NixonRichard
@NixonRichard
Aug 26 2016 10:35
okay thx u
Olga C
@Octopinky
Aug 26 2016 10:35
@NixonRichard how about using github? to host your images and webpage? Github has that ability
Shubham yadav
@Shubham007yadav
Aug 26 2016 10:36
so many tool is there, but u need only one to do your task. @Octopinky
James Leaver
@jaymsDooku
Aug 26 2016 10:37
Hey I am doing the local weather project and I'm wondering how they do the animated clouds and sun.
Olga C
@Octopinky
Aug 26 2016 10:37
@Shubham007yadav I find github pretty easy to use
vínαч puppαl
@vinaypuppal
Aug 26 2016 10:39
@ewathedoer yes exactly they will make Columns . if u dont have idea how many items will be in row just use flex:1 and using media queries specify flex-wrap that way on larger screens items would share available space and when feel they look conjusted wrap them
the doer
@ewathedoer
Aug 26 2016 10:39
aa ok it explains at least a bit, I need to fig deeperr into nesting too, thanks for explanation @vinaypuppal
CamperBot
@camperbot
Aug 26 2016 10:39
ewathedoer sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:warning: ewathedoer already gave vinaypuppal points
Bhushan Patil
@mrpatil007
Aug 26 2016 10:41

http://codepen.io/mrpatil007/full/dXBEPk/

Finally complete the Wikipedia viewer app plz give review........:grinning:

vínαч puppαl
@vinaypuppal
Aug 26 2016 10:43
@Octopinky ahh github its easy there is even one simple trick, just drag and drop image like comment in issues/new issue of your own repository. You will Permanent link for that image , you can use that link to serve images :smile:
@mrpatil007 cool design, can you handle Enter key press on input . if i enter some text and press enter the page is refreshing. Just fix this rest looks good.
Bhushan Patil
@mrpatil007
Aug 26 2016 10:46
@vinaypuppal actually i add the key event to display result
vínαч puppαl
@vinaypuppal
Aug 26 2016 10:47
@mrpatil007 and if possible make entire card clickable instead of Title and add target=_blank for links so they will be open in new tab
@mrpatil007 oh but its still refreshing when i press Enter key
Bhushan Patil
@mrpatil007
Aug 26 2016 10:48
@vinaypuppal ok sure i fix it thanks for suggestion any more suggestion to improve it
CamperBot
@camperbot
Aug 26 2016 10:48
:cookie: 465 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
mrpatil007 sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
Stephen James
@sjames1958gm
Aug 26 2016 10:49
@mrpatil007 If you put this in your if that detects enter key then it will not refresh e.preventDefault();
vínαч puppαl
@vinaypuppal
Aug 26 2016 10:50
@mrpatil007 to solve refresh issue make on submit handler for form and use e.preventDefault(); as @sjames1958gm suggested
Bhushan Patil
@mrpatil007
Aug 26 2016 10:51
@sjames1958gm @vinaypuppal thanks i will fix it
CamperBot
@camperbot
Aug 26 2016 10:51
mrpatil007 sends brownie points to @sjames1958gm and @vinaypuppal :sparkles: :thumbsup: :sparkles:
:warning: mrpatil007 already gave vinaypuppal points
:star2: 2871 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Stephen James
@sjames1958gm
Aug 26 2016 10:51
@vinaypuppal I don't think a separate handler is needed it just put it after if(key == 13) {
@mrpatil007 :+1:
vínαч puppαl
@vinaypuppal
Aug 26 2016 10:52
@sjames1958gm yeah that would also work :smile:
Bhushan Patil
@mrpatil007
Aug 26 2016 10:53
@sjames1958gm @vinaypuppal i fix it now check it out and give suggestion or review
Dami
@JustDami
Aug 26 2016 10:53
https://codepen.io/JustDami/pen/RRzrVN can you please tell me why the instagram logo image is interfering with my heading?
vínαч puppαl
@vinaypuppal
Aug 26 2016 10:57
@JustDami First you have lot of non HTML tags, dont use center tag its deprecated. If you want to center use CSS to do that and finally place CSS in CSS panel of codepen. If your confused on how to use codepen read this article https://medium.freecodecamp.com/codepen-tips-and-best-practice-cf926ebd0b11#.4f16rchq9
Bhushan Patil
@mrpatil007
Aug 26 2016 10:57
This message was deleted
Dami
@JustDami
Aug 26 2016 10:58
Ok Thanls
Bhushan Patil
@mrpatil007
Aug 26 2016 10:58
This message was deleted
vínαч puppαl
@vinaypuppal
Aug 26 2016 11:01
@mrpatil007 one more thing i noticed you did not close few tags properly checkout codepen highlighted them where they are incorrectly closed
Bhushan Patil
@mrpatil007
Aug 26 2016 11:01
@vinaypuppal in js or html
vínαч puppαl
@vinaypuppal
Aug 26 2016 11:01
@mrpatil007 HTML
Bhushan Patil
@mrpatil007
Aug 26 2016 11:02
@vinaypuppal ok i check it out
@vinaypuppal i yeh i fix it
r2d2
@UsamaHameed
Aug 26 2016 11:19
flexbox help needed
Aleksa Rakic
@aleksarakic
Aug 26 2016 11:19
This message was deleted
I am working on tictac toe. Anyone has idea why last(9th) play doesnt work? It says "its draw" no matter who has winning combination?
Stein-T Dale
@Lofthur
Aug 26 2016 11:22
@UsamaHameed Hi I can't help you but i got some good links that I got from someone here at FreeCodeCamp. Have not had the time to check them out yet since I'm working on oen of the projects. http://flexbox.io/ and https://css-tricks.com/snippets/css/a-guide-to-flexbox/. Hope thy can help you :)
Lidia Wisniewska
@lidiawisniewska
Aug 26 2016 11:24
Hi guys! I'm still stuck with the local weather challenge - can anyone help?
r2d2
@UsamaHameed
Aug 26 2016 11:24
@Lofthur thanks :P
CamperBot
@camperbot
Aug 26 2016 11:24
usamahameed sends brownie points to @lofthur :sparkles: :thumbsup: :sparkles:
:cookie: 292 | @lofthur |http://www.freecodecamp.com/lofthur
r2d2
@UsamaHameed
Aug 26 2016 11:25
@Lofthur this is good too http://flexboxfroggy.com/
vínαч puppαl
@vinaypuppal
Aug 26 2016 11:25
@UsamaHameed Hi I can't help you but i got some good links that I got from someone here at FreeCodeCamp. Have not had the time to check them out yet since I'm working on oen of the projects. http://flexbox.io/ and https://css-tricks.com/snippets/css/a-guide-to-flexbox/. Hope thy can help you :)
@ewathedoer i suggest you also try these resources they helped me lot while learning flexbox
Stein-T Dale
@Lofthur
Aug 26 2016 11:27
@UsamaHameed Thanks. Looks like a good resource :D
CamperBot
@camperbot
Aug 26 2016 11:27
lofthur sends brownie points to @usamahameed :sparkles: :thumbsup: :sparkles:
:cookie: 491 | @usamahameed |http://www.freecodecamp.com/usamahameed
the doer
@ewathedoer
Aug 26 2016 11:27
@vinaypuppal thanks. I've already seen them. Currently working on pricing list from flexbox.io :)
CamperBot
@camperbot
Aug 26 2016 11:27
ewathedoer sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 466 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
vínαч puppαl
@vinaypuppal
Aug 26 2016 11:27
@ewathedoer :smile:
Stein-T Dale
@Lofthur
Aug 26 2016 11:28
@vinaypuppal Hey I think i got the links from you earlier :)
vínαч puppαl
@vinaypuppal
Aug 26 2016 11:28
@lidiawisniewska just move $.get request inside callback of navigator.geolocation.getCurrentPosition then it shld work fine
the doer
@ewathedoer
Aug 26 2016 11:28
In this weekly code vlog I will add them all plus the rest to the video description. Hopefully others will findo them also useful learning flex box.
vínαч puppαl
@vinaypuppal
Aug 26 2016 11:28
@Lofthur yes :smile:
Lidia Wisniewska
@lidiawisniewska
Aug 26 2016 11:32
@vinaypuppal hasnt helped im afraid
vínαч puppαl
@vinaypuppal
Aug 26 2016 11:33
@lidiawisniewska look over here someone has same issue
@lidiawisniewska oh and you need API key to acess weather data you missed that
@lidiawisniewska signup for API key here http://openweathermap.org/ and include that in API request URL
Lidia Wisniewska
@lidiawisniewska
Aug 26 2016 11:42
@vinaypuppal I'm struggling to understand this :(
@vinaypuppal do I need to sign up to get the key?
vínαч puppαl
@vinaypuppal
Aug 26 2016 11:44
@lidiawisniewska yes
Stein-T Dale
@Lofthur
Aug 26 2016 11:47
Hi all. I'm hopefully finnished with the Twitch Tv project. If someone have time to have a look it would be appreciated :) http://codepen.io/Lofthur/pen/9badcf2bd1985cc0ce814761301a08ac
Lidia Wisniewska
@lidiawisniewska
Aug 26 2016 11:57
@vinaypuppal I think i got the key - what next?
vínαч puppαl
@vinaypuppal
Aug 26 2016 12:01
@lidiawisniewska And you need to add that API key in Request Url like this "http://api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + lon +"&APPID=Your-API-KEY"
did already :)
vínαч puppαl
@vinaypuppal
Aug 26 2016 12:04
@lidiawisniewska but that also wont work as openweathermap does not support https but we cant access geolocation in chrome without https so before request URL place https://crossorigin.me a proxy server like this https://crossorigin.me/http://api.openweatherapi.com/.... but its a temporary workaround dont use it in your Real projects. Try to use API that supports https
Joshua Swift
@joshuaswift
Aug 26 2016 12:06
Hey guys, I've been tweaking my quote generator so it fades the quotes in and out instead of them suddenly appearing, but now there seems to be a bug where seemingly at random the quotes will not appear when you click the button
if someone could take a look and see if anything jumps out that would be very helpful
Lidia Wisniewska
@lidiawisniewska
Aug 26 2016 12:08
@vinaypuppal wow!
at least im getting lon and lat now
vínαч puppαl
@vinaypuppal
Aug 26 2016 12:11
@lidiawisniewska if you want display response on page just use this $("#message").html(JSON.stringify(data)); just for your verification to check its working or not
Lidia Wisniewska
@lidiawisniewska
Aug 26 2016 12:12
its displayed raw data!
vínαч puppαl
@vinaypuppal
Aug 26 2016 12:13
@lidiawisniewska since data is object you can access properties over it like data.weather.description to place in your UI without JSON.stringify
Lidia Wisniewska
@lidiawisniewska
Aug 26 2016 12:13
cool! i'll see if i can do it from now
@vinaypuppal thanks so much!
CamperBot
@camperbot
Aug 26 2016 12:13
:cookie: 467 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
lidiawisniewska sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
Lidia Wisniewska
@lidiawisniewska
Aug 26 2016 12:13
:)
vínαч puppαl
@vinaypuppal
Aug 26 2016 12:13
@lidiawisniewska :smile:
Stein-T Dale
@Lofthur
Aug 26 2016 12:15
@Joshuaswift Hi, I think i see the problem. You will not get the second button on.clik to work. The one that calls the get new quote function. I did a quick fix here: var init = function() {
$('#newQuoteBtn').on('click', removeQuote);
//$('#newQuoteBtn').on('click', getQuote);
//Ensures there is a quote when page is loaded initially
getQuote();
};
vínαч puppαl
@vinaypuppal
Aug 26 2016 12:17
This message was deleted
Stein-T Dale
@Lofthur
Aug 26 2016 12:19
@Joshuaswift Sorry, my method did not work after all....
taihon
@taihon
Aug 26 2016 12:21
could somebody look at my code, and tell me why in the end variable called 'html' is empty?
I feel there's some silly mistake
vínαч puppαl
@vinaypuppal
Aug 26 2016 12:24
@Joshuaswift your quotes div is covering buttons. so click event is not registering on buttons. You can verify that by placing console.log('clicked') inside getQuote() and check in console. Adjust css to solve this issue
Joshua Swift
@joshuaswift
Aug 26 2016 12:26
@Lofthur Thanks for trying anyway!
CamperBot
@camperbot
Aug 26 2016 12:26
joshuaswift sends brownie points to @lofthur :sparkles: :thumbsup: :sparkles:
:cookie: 294 | @lofthur |http://www.freecodecamp.com/lofthur
Joshua Swift
@joshuaswift
Aug 26 2016 12:26
@vinaypuppal ahh what a silly mistake, thanks for that, I'll alter the css now
CamperBot
@camperbot
Aug 26 2016 12:26
joshuaswift sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 468 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
r2d2
@UsamaHameed
Aug 26 2016 13:05
Can anyone help with flexbox?
vínαч puppαl
@vinaypuppal
Aug 26 2016 13:06
@UsamaHameed yes what help you need??
r2d2
@UsamaHameed
Aug 26 2016 13:07
http://codepen.io/UsamaHameed/pen/KrjdBR
I am trying to give all the rows the same width. I tried flex: 1; but did not work
the doer
@ewathedoer
Aug 26 2016 13:08
@UsamaHameed maybe you should try flex-direction row and then wrapping
vínαч puppαl
@vinaypuppal
Aug 26 2016 13:09
@UsamaHameed u have closed a div before. Checkout codepen even hightlighted thats causing some problem fix that and see
@UsamaHameed and u can close input tag like this <input type="text" /> no need to close like this </input>
r2d2
@UsamaHameed
Aug 26 2016 13:15
@vinaypuppal before what?
I have applied flex: 1; to the class flex-box which I applied to every element
@ewathedoer let me try that
vínαч puppαl
@vinaypuppal
Aug 26 2016 13:25

@UsamaHameed your css seems a bit odd to me, so i suggest you to use below code as reference and tweak according to your needs

<div class="calculator-buttons">
<div class="flex-box center-center">
  <div class="flex-item">AC</div>
  <div class="flex-item">C</div>
  <div class="flex-item">/</div>
  <div class="flex-item">*</div>
</div>
<div class="flex-box center-center">
  <div class="flex-item">AC</div>
  <div class="flex-item">C</div>
  <div class="flex-item">/</div>
  <div class="flex-item">*</div>
</div>
</div>
.calculator-buttons{
  max-width: 50%;
  margin: 0 auto;
}
.flex-box{
  display: flex;
  text-align: center;
}

.center-center{
  justify-content:center;
  align-items: center;
}

.flex-item{
  flex: 1;
  background: skyblue;
  padding: 10px 0
}

CodePen for reference http://codepen.io/vinaypuppal/pen/kXONNW?editors=1100

r2d2
@UsamaHameed
Aug 26 2016 13:28
@vinaypuppal how is it odd?
vínαч puppαl
@vinaypuppal
Aug 26 2016 13:29
you are using same styles for flexbox container div and flexbox child div that causing problem i think
@UsamaHameed
r2d2
@UsamaHameed
Aug 26 2016 13:29
which ones?
vínαч puppαl
@vinaypuppal
Aug 26 2016 13:30
@UsamaHameed
<div class="flex-box row">
      <div class="flex-box btn bg">lol</div>
</div>
r2d2
@UsamaHameed
Aug 26 2016 13:30
row, btn, bg are defined in the CSS
vínαч puppαl
@vinaypuppal
Aug 26 2016 13:31
@UsamaHameed yes see .flex-box class is used on both parent and child
r2d2
@UsamaHameed
Aug 26 2016 13:31
ALright. Defining a flex-item and applying it
wait
:+1:
vínαч puppαl
@vinaypuppal
Aug 26 2016 13:32
:smile:
Is some other class conflicting with flexbox?
vínαч puppαl
@vinaypuppal
Aug 26 2016 13:40
@UsamaHameed did you make any change ?? i still see same HTML
updated @vinaypuppal
r2d2
@UsamaHameed
Aug 26 2016 13:52
@vinaypuppal fixed :D
Mark Ayoub
@mk485eg
Aug 26 2016 14:08
hi
can i submit a problem need help here ?
hi there
Robert Dewitt
@rtd62
Aug 26 2016 14:14
Hello team! I just wanted to share my development community on Discord called Front End Bridge. It’s a space for front end web developers to help each other, share experiences, and to post jobs for people who are seeking! I want this to become worldwide, so head on over and check it out! https://discordapp.com/invite/bUVNj7s
CamperBot
@camperbot
Aug 26 2016 14:14

welcome to FreeCodeCamp @rtd62!

Mark Ayoub
@mk485eg
Aug 26 2016 14:17
blob
Ken Haduch
@khaduch
Aug 26 2016 14:19
@mk485eg - hover over the red "X" and see what the error is. Probably parentheses out of balance or something? They are underlining the "2" at the end.
Mark Ayoub
@mk485eg
Aug 26 2016 14:22
blob
@khaduch
Ty
@TheNewStyles
Aug 26 2016 14:25
http://codepen.io/TheNewStyles/pen/OXZgJy I am trying to get Jquery to replace the text in a div on click but I am having trouble. Anybody got a sec to see what the problem is?
Ken Haduch
@khaduch
Aug 26 2016 14:25
@mk485eg - you are missing a closing parenthesis on that line
Mark Ayoub
@mk485eg
Aug 26 2016 14:28
blob
this is last traial
still not right
@khaduch
Ken Haduch
@khaduch
Aug 26 2016 14:30
@mk485eg - try doing exactly what they are doing in their example function, only with your variables...
Hatem
@hatemcode
Aug 26 2016 14:31
Hey all of you. I have a problem with my Local Weather Challenge. It is all correct and it works like charm on my local server. But the problem is that the json request which cannot be resolved without SSL (https) API. My page does do anything in codepen. What I can do ?
Ken Haduch
@khaduch
Aug 26 2016 14:38
@TheNewStyles - If I remove all of your CSS code, then it works... the click will pop up the alert. Something going on in your CSS? Seems like a syntax error there?
Ken Haduch
@khaduch
Aug 26 2016 14:45
@TheNewStyles - oh - it is in the CSS rule that you have for #snow - the z-index:1; is obscuring the buttons (they are behind the #snow div?) I cannot see the snow anyway - things are not loading properly for some reason - using imgur seems to be one of them? But that is the reason why your button click is not working.
the doer
@ewathedoer
Aug 26 2016 14:48
I need help with flexbox and this one line form http://s.codepen.io/thedoer/debug/RRXbGB?from=&to=
I want to:
  1. make the height of all elements with white background equal
  2. make it responsive
Marc Droz
@b1tc0de
Aug 26 2016 14:51
how do i target a specific DOM element with media queries?
the doer
@ewathedoer
Aug 26 2016 14:51
@b1tc0de by id or class
Ken Haduch
@khaduch
Aug 26 2016 14:58

@TheNewStyles - for the time being, I changed your #snow CSS rule to this:

#snow{
    background: none;
    font-family: Androgyne;
background-image: url('http://www.wearewebstars.dk/codepen/img/s1.png'), url('http://www.wearewebstars.dk/codepen/img//s2.png'), url('http://www.wearewebstars.dk/codepen/img//s3.png');
  background-color: blue;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index:-1;
    -webkit-animation: snow 10s linear infinite;
    -moz-animation: snow 10s linear infinite;
    -ms-animation: snow 10s linear infinite;
    animation: snow 10s linear infinite;
}

And the clicking works. I don't know about the snow effect - possibly without the images loading that won't work? I hope that helps get you on track...

UPDATE - I put the background images there against the blue background, and the snow is flying! :)

@TheNewStyles - also noticed you had "container-fluid" misspelled...
karocann
@karocann
Aug 26 2016 15:02
I'm trying to use the CodePen app to build a project. If I leave the app after I have written some code and have saved it, I cannot find a way to load it back so I can continue working on it. I am using the free module for CodePen. How to save and load my code?
the doer
@ewathedoer
Aug 26 2016 15:03
@karocann if it was on codepen you have to look itin pens and for the sake of security next time you may always export it as a gist to github gists
karocann
@karocann
Aug 26 2016 15:04
I don't unxderstand. WEhat is it
I don't understand. What is "itin"?
the doer
@ewathedoer
Aug 26 2016 15:05
lack of space, you have to look it in...
karocann
@karocann
Aug 26 2016 15:07
IS there someplace that explains how to use this app? I don't see "pens" anywhere on the page that I am writing the code, only a "save" button which normally saves your work.
the doer
@ewathedoer
Aug 26 2016 15:09
When you enter codeine.io and look for your profile you will see your public pens, collections, etc.
Save as a gist is at the bottom while you write a particular pen (code). It’s small export button at the bottom right
@karocann
Ken Haduch
@khaduch
Aug 26 2016 15:09
@karocann - look in the upper right corner (of the CodePen site), click on your profile picture - at the bottom there are a couple links, one is "Pens" - that should take you to a dashboard with all of your saved work?
the doer
@ewathedoer
Aug 26 2016 15:12
I’m looking for help with flexbox http://codepen.io/thedoer/pen/RRXbGB?editors=1100
I’m fresh to flexbox and can’t find the way out to center and strech all the content in this single line form. I also want to make it responsive.
karocann
@karocann
Aug 26 2016 15:12
OK. I got it. Couldn't have done it without your help. These folks need some help on designing a UI for their front end.
Marc Droz
@b1tc0de
Aug 26 2016 15:19
thanks @ewathedoer
CamperBot
@camperbot
Aug 26 2016 15:19
b1tc0de sends brownie points to @ewathedoer :sparkles: :thumbsup: :sparkles:
:cookie: 476 | @ewathedoer |http://www.freecodecamp.com/ewathedoer
Ken Haduch
@khaduch
Aug 26 2016 15:26
@ewathedoer - well, I don't know a lot about flexbox, either, I've been trying to learn something about it in fits and starts. What is it that you're trying to achieve? Looking at it on a wide screen, it looks reasonable? I see this:
blob
it's not really neat, but I guess I don't know what you're after...
And I guess that it is a nightmare for responsive presentation... :)
the doer
@ewathedoer
Aug 26 2016 15:29
@khaduch try to shrink the broswer’s window and you will see that it’s not stretched evenly
Muhammad Hasham
@MohammadHasham
Aug 26 2016 15:31
I am at "No Repeats ease" can anyone tell me that how permAlone("aab")
should return 2
@ewathedoer
@khaduch
Ken Haduch
@khaduch
Aug 26 2016 15:34
@MohammadHasham - I think that you should get ab and ba, the two different a's cannot be used two different times? I have not completed this one, haven't gotten that far... That's not right...
Muhammad Hasham
@MohammadHasham
Aug 26 2016 15:36
@khaduch Okay Thanks
CamperBot
@camperbot
Aug 26 2016 15:36
mohammadhasham sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1579 | @khaduch |http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Aug 26 2016 15:40
@MohammadHasham - you can get four different arrangements of aab, aab (with the two a's reversed) and baa, baa (again, with the two available a's reversed). But since the a's are repeated in those, they don't count. aba and aba, with the two different a characters switched are the only ones that count.
Stacey
@anastasi5
Aug 26 2016 15:43
I'm still slogging through the Portfolio project.. Here's my pen using bootstrap's columns: https://codepen.io/anastasi55/pen/vKQbVZ
This message was deleted
However, I'm trying to use bootstrap's navbar code, but I can't seem to customize the height to accomidate my logo, and I can't seem to have the buttons float on the right. https://codepen.io/anastasi55/pen/PzVrRY
Ken Haduch
@khaduch
Aug 26 2016 15:54
@anastasi5 - it seems as though you have two <nav elements in your HTML code?
Stacey
@anastasi5
Aug 26 2016 15:57
@khaduch I deleted a separate sample that was conflicting, but other than that, I copied directly from getbootstrap.com
Ken Haduch
@khaduch
Aug 26 2016 15:58
@anastasi5 - okay, I jut reloaded it.
Shailza
@shailza
Aug 26 2016 16:07
point out my mistakes http://codepen.io/shlza/pen/grNKJY
Stephen James
@sjames1958gm
Aug 26 2016 16:07
nvm
@shailza var item = $("#entered").value(); should be val()
Shailza
@shailza
Aug 26 2016 16:09
@sjames1958gm done! what else?
Stephen James
@sjames1958gm
Aug 26 2016 16:10
@shailza Looks like the object doesn't have data.query.pages - put the URL in the address bar and examine the structure of the json.
tylerobot
@tylerobot
Aug 26 2016 16:11
I'm having a day full of brain farts, just can't seem to get it working. I'm having trouble iterating over this array. It seems to only be pulling the last entry multiple times.
var twitchUsers = ["freecodecamp", "brunofin", "ronimogames"];

//for loop iterating over twitchUsers array
for (var i = 0; i < twitchUsers.length; i++) {
  var url = "https://api.twitch.tv/kraken/streams/" + twitchUsers[i];
}
Stephen James
@sjames1958gm
Aug 26 2016 16:12
@tylerobot - Is there more code? Are you call getJSON with a callback? Read this:
http://stackoverflow.com/questions/750486/javascript-closure-inside-loops-simple-practical-example
@tylerobot The short answer is switch to forEach
tylerobot
@tylerobot
Aug 26 2016 16:13
@sjames1958gm there is more code, and I've got that working with getJSON, but I'm just in a fog today and couldn't figure out what I was doing wrong. the forEach answer just made it click. Thanks!
CamperBot
@camperbot
Aug 26 2016 16:13
tylerobot sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 2880 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Stephen James
@sjames1958gm
Aug 26 2016 16:14
@tylerobot Your brain is just farting in the fog?
Evan Davis
@davisec52
Aug 26 2016 16:14
@anastasi5 I made a fork of your pen at https://codepen.io/davisec52/pen/VjoYwZ?editors=1100 - is this the effect your are trying to get?
tylerobot
@tylerobot
Aug 26 2016 16:15
@sjames1958gm lol, exactly!
Micah Points
@msp327
Aug 26 2016 16:16
So here is my portfolio page and I am happy with it for my skill level. I am looking for any suggestions on how to enhance it in order to stretch me a bit. Thanks https://codepen.io/msp327/full/rLpLKL/
Albert Brennan
@bluegreybolt
Aug 26 2016 16:19
Hey I'm doing the wikipedia project at the moment and I'm getting a bug.
Stephen James
@sjames1958gm
Aug 26 2016 16:19
@shailza
     $.each(data.query.search, function(i, item) {
            alert(item.title);
     });
Albert Brennan
@bluegreybolt
Aug 26 2016 16:19
Has anyone had it?
When I try to call the Wikipedia API I'm getting No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://s.codepen.io' is therefore not allowed access.
 No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://s.codepen.io' is therefore not allowed access.
tylerobot
@tylerobot
Aug 26 2016 16:20
you'll need to use JSONP
Albert Brennan
@bluegreybolt
Aug 26 2016 16:20
I'm using jsonp I think
Stephen James
@sjames1958gm
Aug 26 2016 16:20
@bluegreybolt Yep, like everyone - if you are using getJSON - you can add callback=? to your URL
Albert Brennan
@bluegreybolt
Aug 26 2016 16:20
$.ajax( 
      {type: "GET",
       url:thisQuery,
       datatype:"jsonp",
       success:function(json) {

         console.log(json);

       }

    });
This is my code for the API call
Can you see the problem?
r2d2
@UsamaHameed
Aug 26 2016 16:21
Don't look at the code. Just report bugs :D
http://codepen.io/UsamaHameed/pen/KrjdBR
tylerobot
@tylerobot
Aug 26 2016 16:21
@bluegreybolt if that doesn't work, I use this hack in codepen, but don't ever use it in production
```if (window.location.protocol !== 'http:') url = 'https://crossorigin.me/' + url;
the hack around just needs to follow the url
Shailza
@shailza
Aug 26 2016 16:22
@sjames1958gm something is happening! :worried: which is not right
Stephen James
@sjames1958gm
Aug 26 2016 16:23
@shailza ?
@shailza What is it that is happening and how not right?
Shailza
@shailza
Aug 26 2016 16:24
@sjames1958gm i dont need alert. i need to show the pages. How do I do that?
tylerobot
@tylerobot
Aug 26 2016 16:24
@UsamaHameed the "del" "n" and "lol" buttons don't do anything for me
Shailza
@shailza
Aug 26 2016 16:24
Realised my mistake!
Jason Luboff
@JLuboff
Aug 26 2016 16:24
@shailza think about how you displayed the resulting data from your weather app
Stephen James
@sjames1958gm
Aug 26 2016 16:25
@shailza You remove the alert and then you can put the data into your HTML - here is a sample response
{
"ns": 0,
"title": "Frog",
"snippet": "article is about the group of amphibians. For other uses, see <span class=\"searchmatch\">Frog</span> (disambiguation).   <span class=\"searchmatch\">Frogs</span> are a diverse and largely carnivorous group of short-bodied",
"size": 158611,
"wordcount": 18243,
"timestamp": "2016-08-05T06:31:53Z"
},
@tylerobot C'mon they moved me to tears.
Jason Luboff
@JLuboff
Aug 26 2016 16:26
@sjames1958gm sometimes I feel like you have too much fun in here :smile: :+1:
r2d2
@UsamaHameed
Aug 26 2016 16:27
@tylerobot I have not programmed them :D
Stephen James
@sjames1958gm
Aug 26 2016 16:27
@JLuboff :) -
r2d2
@UsamaHameed
Aug 26 2016 16:27
they are jsut placeholders for now
Stephen James
@sjames1958gm
Aug 26 2016 16:27
@UsamaHameed I like the font -
tylerobot
@tylerobot
Aug 26 2016 16:27
didn't want to look at the code since you asked me not to! I get self conscious about that, too, so I didn't want to dive in
everything else worked great, no issue
r2d2
@UsamaHameed
Aug 26 2016 16:28
@sjames1958gm the one in the answer text or the history text?
Stephen James
@sjames1958gm
Aug 26 2016 16:28
@UsamaHameed Answer
r2d2
@UsamaHameed
Aug 26 2016 16:28
RIght. Well this was the first time I changed my font :smile:
r2d2
@UsamaHameed
Aug 26 2016 16:53
@tylerobot thanks
CamperBot
@camperbot
Aug 26 2016 16:53
usamahameed sends brownie points to @tylerobot :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for tylerobot
Andrea Rocca
@ilrock
Aug 26 2016 17:08

Hey guys! How you doing? :)

Just reached the portfolio page part of the course - this is the v1 of the page, what do you think?

chunnali
@chunnali
Aug 26 2016 17:16
I like it! Looks very clean
What code did you just making it viewable in mobile?
Andrea Rocca
@ilrock
Aug 26 2016 17:17
It’s all bootstrap basically
Thanks a lot!! :)
I’m trying to get more into the front end part as my background is more backend focused - need to learn from the best here :)
Bhushan Patil
@mrpatil007
Aug 26 2016 17:20
@sfogo5 who i am button dose not match the bg-image change the color and make it wide
Andrea Rocca
@ilrock
Aug 26 2016 17:21
@mrpatil007 definitely a good point! Cheers
Bhushan Patil
@mrpatil007
Aug 26 2016 17:21
@sfogo5 welcome
Tyler Moeller
@TylerMoeller
Aug 26 2016 17:38
@sfogo5 Great work. You'll need to load bootstrap.js to get the mobile menu working in your Navbar. Maybe it wasn't written originally in codepen, but it's loading external resources twice by having a <head> in the HTML in addition to the Codepen Settings. Also, I'm getting 404 errors in the console due to relative paths that can't be reached (<script type="text/javascript" src="index.js"></script>) plus a message "ready" every time the page is loaded. Might want to remove that eventually :) Overall, a really nice looking portfolio.
Ahmad Irshad
@ahmadirshad888
Aug 26 2016 17:40
hi
Albert Brennan
@bluegreybolt
Aug 26 2016 17:45
Hey I need some help with the wikipedia API
But it isn't working
I'm trying to get it to return the PageID using prop=info
Does anyone have any ideas?
Ronnelle
@ronnelle
Aug 26 2016 17:54
Hi! I've just created my portfolio page using bootstrap. Any feedback on how to improve my website? please visit http://ronnelle.tk
Thanks!
Jason Luboff
@JLuboff
Aug 26 2016 17:57
@bluegreybolt What data are you having returned? I have an array that is returned with my Wikipedia API. I then call to different sections as I would any other array (i.e data1 is title, data[2] is content, etc)
This is what is returned
Putting prop=info in should return the PageID too, but it isn't working
Jason Luboff
@JLuboff
Aug 26 2016 18:00
codeiak
@codeiak
Aug 26 2016 18:05
I'm having some issues that I don't know how to resolve, I am working on my portfolio, so far I've got a nav bar that works fine, then I separated the page with 4 divs "home", "about","portfolio", and "contact". I gave them all a different class and each section has a background image, my problem is even when I go to my css and define heigth:100% for the div and set the background-image: url(something); it is only showing me about 20px for the height, I added padding:100% then it shows the full image but now I have about the same size as the image of space underneath it for each div and image.. Can someone help me?
@ronnelle I would suggest for the contact section if you can remove the scrolling within it, it would be great. Awesome portfolio by the way.
ravie
@Ravikarthick
Aug 26 2016 18:19
@codeiak Can you able to share you code?
codeiak
@codeiak
Aug 26 2016 18:22
yes you want to css or the html code? or both?
Tony Rivera
@tonyrivera
Aug 26 2016 18:22
Paste it in codepen.io and send link here
@codeiak
ravie
@Ravikarthick
Aug 26 2016 18:30
@codeiak cool!
Ty
@TheNewStyles
Aug 26 2016 18:33
@khaduch Hey thank you Ken. I couldn't figure out that for the life of me.
CamperBot
@camperbot
Aug 26 2016 18:33
thenewstyles sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1581 | @khaduch |http://www.freecodecamp.com/khaduch
ravie
@Ravikarthick
Aug 26 2016 18:34
@codeiak Do want image as a background for div?
Andrew1024
@Andrew1024
Aug 26 2016 18:36
Hello, can anybody look through my JS code. I can't find a mistake http://codepen.io/Andrew1024/pen/dXBpxJ
codeiak
@codeiak
Aug 26 2016 18:37
@Ravikarthick yes I would like that the 4 images in the different divs to show
Tony Rivera
@tonyrivera
Aug 26 2016 18:37
Im betting its the background size
Try using height and width instead
Also i think your targeting the wrong divs
Hard to tell cuz im on mobile but i got it slight working
Woops there is no width height
ravie
@Ravikarthick
Aug 26 2016 18:39
Yeah @tonyrivera
Jason Luboff
@JLuboff
Aug 26 2016 18:39
@Andrew1024 You're missing some closing } and )
Muhammad Hasham
@MohammadHasham
Aug 26 2016 18:39
I have a question that do you need a really strong foundation for javascript to make websites or a novice in js can also work with things in a way?
ravie
@Ravikarthick
Aug 26 2016 18:40
@codeiak you have assign value for width
Jason Luboff
@JLuboff
Aug 26 2016 18:40
''' search();
}
});
}
})
''' @Andrew1024 should be your end of code
CamperBot
@camperbot
Aug 26 2016 18:40
:bulb: to format code use backticks! ``` more info
Jason Luboff
@JLuboff
Aug 26 2016 18:40
    }
});
      }
      })
ravie
@Ravikarthick
Aug 26 2016 18:40
@codeiak Just try width:100px;
codeiak
@codeiak
Aug 26 2016 18:41
no I just tried width and height for the #home-image both of 100% and still its showing a little bigger but not much
100px width gives me a small square in the middle of the screen
Andrew1024
@Andrew1024
Aug 26 2016 18:43
@JLuboff thank you :smile: Did you find the mistake by yourself or through some technic?
CamperBot
@camperbot
Aug 26 2016 18:43
andrew1024 sends brownie points to @jluboff :sparkles: :thumbsup: :sparkles:
:cookie: 324 | @jluboff |http://www.freecodecamp.com/jluboff
tylerobot
@tylerobot
Aug 26 2016 18:44
Using this for-of loop, it works with three items in the array, but if I add more, it breaks. Any insight?
var twitchUsers = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas", "brunofin"]; 

//for of loop iterating over twitchUsers array
for (var i of twitchUsers) {
  var url = "https://api.twitch.tv/kraken/streams/" + i; 
}
Jason Luboff
@JLuboff
Aug 26 2016 18:44
@Andrew1024 Whenever CodePen has the red !, that signifies there is an issue and it tells you what it is. It was saying unexpected end of code. I had to trace the closing } to find what was missing
Andrew1024
@Andrew1024
Aug 26 2016 18:47
Now the code does not send a query to Wikipedia http://codepen.io/Andrew1024/pen/dXBpxJ
Russell Mckee
@russell305
Aug 26 2016 18:52
May someone assist me with regular expression. I am trying to change the whitespace between words into a dash. But I am only changing the 's'. To find a whitespace it is telling me to use '\s'... var newString=str.replace( /s/ig, '--');
Brandon Unbedacht
@unbedachtb
Aug 26 2016 18:52
Does anyone know if I have to use CodePen to do the projects? Can I do it in Atom and send the link to my Github instead?
Chris Rutherford
@cjrutherford
Aug 26 2016 18:53
little bit lost here. for some reason, my tic-tac-toe game is not going past the third move....
http://codepen.io/christopherrutherford/pen/QEokXm?editors=0010
Jason Luboff
@JLuboff
Aug 26 2016 18:56
@Andrew1024 I think there's an issue with your function. One thing I will note, I used .val() for my query result (therefore.. var query= @("#query).val(); ) I don't see anything passing into your function though when using console.log
codeiak
@codeiak
Aug 26 2016 18:59
@Ravikarthick I added a <p> and some text to the html and it shows a little bit more on the image because of the text
ravie
@Ravikarthick
Aug 26 2016 19:04
@codeiak I guess you want one image as a full background for entire page. Right?
codeiak
@codeiak
Aug 26 2016 19:07
No, four images for four different section of the page
Robert Skalko
@RobertSkalko
Aug 26 2016 19:07
i could use help with localstorage, someone good with it?
codeiak
@codeiak
Aug 26 2016 19:07
So I'm doing it in one page but I have the home section, about section, portfolio section and contact section
Anshul Jain
@ajain706
Aug 26 2016 19:10
hy guys can anyone help me in weather app
Jason Luboff
@JLuboff
Aug 26 2016 19:14
@ajain706 Post your question..
Anshul Jain
@ajain706
Aug 26 2016 19:16
i need help in API i have geolocation and the API key now how to use these information to determine the weather
@JLuboff
Jason Luboff
@JLuboff
Aug 26 2016 19:17
CasiqueJhon
@CasiqueJhon
Aug 26 2016 19:21
@CasiqueJhon
what's the code for social media buttons?
fa fa-facebook? anything else?
Martine Ross
@moi238
Aug 26 2016 19:23
I'm having trouble getting the page to scroll on clicking the top navbar This is the code that I have which links to all the sections. The navigation part works I just need to make it scroll! Please help?
Sorry here is the code: <header><nav class="site-navigation page-navigation">
<ul class="menu">
<li id="Home"><a href="#Firstsection"><h3>Home</h3></a>
</li>
<li id="About"><a href="#AboutMe"><h3>About</h3></a>
</li>
<li id="Portfolio"><a href="#Portfolio"><h3>Portfolio</h3></a></li>
<li id="contact"><a href="#footer"><h3>Contact</h3></a>
</li>
</ul>
</nav>
</header>
Jason Luboff
@JLuboff
Aug 26 2016 19:24
@moi238 Scroll as in scrollspy, or scroll as in when you click the nav item it takes you to the location?
Martine Ross
@moi238
Aug 26 2016 19:29
@JLuboff I think scrollspy as the nav item already takes you to the location
codeiak
@codeiak
Aug 26 2016 19:29
@moi238 I would suggest that you make divisions and give the the id that you are using in the a href tag example: <a href="#first">First</a>...... somewhere down the page you have a <div id="first">Some Stuff </div>
Jason Luboff
@JLuboff
Aug 26 2016 19:30
@moi238 Did you enable bootstrap in both the css and js sections of codepen?
Martine Ross
@moi238
Aug 26 2016 19:30
@JLuboff yes I've enabled bootstrap
Jason Luboff
@JLuboff
Aug 26 2016 19:31
can you post your codepen?
Martine Ross
@moi238
Aug 26 2016 19:32
@JLuboff I hadn't enabled jwuery which might be a big part of the problem
Jason Luboff
@JLuboff
Aug 26 2016 19:33
Yes, thats possible..
Also, bootstrap under JS may help
Martine Ross
@moi238
Aug 26 2016 19:34
@JLuboff I could try that
Martine Ross
@moi238
Aug 26 2016 19:39
@JLuboff Found this page used the code posted by devin in JS box and it's worked!! https://css-tricks.com/snippets/jquery/smooth-scrolling/ Thank you for your help I wouldn't have checked if jquery was enabled otherwise :)
CamperBot
@camperbot
Aug 26 2016 19:39
:cookie: 325 | @jluboff |http://www.freecodecamp.com/jluboff
moi238 sends brownie points to @jluboff :sparkles: :thumbsup: :sparkles:
Ghost
@ghost~56ef2a8b85d51f252ab9dec9
Aug 26 2016 19:50
Hi everyone, I'm improving my local weather app and I've noticed that navigator.geolocation.getCurrentPosition doesn't work anymore.
Does everyone know an alternative?
Jason Luboff
@JLuboff
Aug 26 2016 19:51
@moi238 :+1:
Dan
@dcgoings
Aug 26 2016 19:51
hey guys, i have a question for you guys. im entering my second year as a cs major, only dealt with java in the first year. i spent most of the summer learning front-end html/css/js/minimal jquery, and never reached the "next step" stuff like SASS/LESS or anything else like that. i ended up applying for an internship a couple weeks ago and they reached out to me with an interview next week and im terrified that im not ready.
does anyone have any websites they usually go to for reference for interview-type stuff?
Jason Luboff
@JLuboff
Aug 26 2016 19:51
@thomlom It should work unless you are using chrome (and didn't account for setting up your app via https). You can use IP location as an alternative
Dan
@dcgoings
Aug 26 2016 19:52
i cant tell if this is going to be a very technical interview, considering its 30min and only an internship at a < 50 person startup.
Ghost
@ghost~56ef2a8b85d51f252ab9dec9
Aug 26 2016 19:53
Yes I'm using Chrome. Thanks for the advice!
@JLuboff
Jason Luboff
@JLuboff
Aug 26 2016 19:53
@dcgoings I've never been an intern, so I can't really answer with any authority..but I wouldn't stress to much. They know that you are learning and that you're looking to gain work experience but not going to be an expert with 10+ years experience :)
Dan
@dcgoings
Aug 26 2016 19:55
i guess i feel like i still dont have the basics down. that's what is making me a nervous wreck. like, i havent read up on things like browser compatibility, or what quirks vs standard mode is, or building a multilingual site, things like that.
and at the same time, i cant tell if im expected to know that stuff through 4-5 months of learning front end.
and by 4-5 months, i mean only doing FCC, three projects in, portfolio built, and only advanced JS algs remaining.
zaidiali
@zaidiali
Aug 26 2016 20:03
hello can someone tell how to add image from url ?
Jason Luboff
@JLuboff
Aug 26 2016 20:04
@dcgoings I get you. I wouldn't stress so much, just go in their with confidence. Even if you don't get it, at least you'll have a practice interview before the next one!
@zaidiali <img src="url"> ?
Dan
@dcgoings
Aug 26 2016 20:04
true, true. guess i should view this as a test run and keep my expectations low.
zaidiali
@zaidiali
Aug 26 2016 20:05
thanks @JLuboff
CamperBot
@camperbot
Aug 26 2016 20:05
zaidiali sends brownie points to @jluboff :sparkles: :thumbsup: :sparkles:
:cookie: 326 | @jluboff |http://www.freecodecamp.com/jluboff
zaidiali
@zaidiali
Aug 26 2016 20:08
one more thing is how to start unordered list, i forgot
Jason Luboff
@JLuboff
Aug 26 2016 20:09
<ul>
zaidiali
@zaidiali
Aug 26 2016 20:10
its not a class in div ?
tylerobot
@tylerobot
Aug 26 2016 20:10
I've got this array of strings, but I can't figure out how to get my loop to create a unique url for all of them. It keeps skipping to the last item of the array.
var twitchUsers = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"];

//for of loop iterating over twitchUsers array
for (var i of twitchUsers) {
  var url = "https://api.twitch.tv/kraken/streams/" + i;
  $.getJSON(url, funcData);
}
Jason Luboff
@JLuboff
Aug 26 2016 20:10
No. <ul> <li>List item 1</li><li>List item 2</li></ul>
@tylerobot I had trouble getting a for loop to work, I ended up using forEach (well..the jquery equivelent which is $.each)
zaidiali
@zaidiali
Aug 26 2016 20:13
is the responsive image a class ? or type ?
tylerobot
@tylerobot
Aug 26 2016 20:13
@JLuboff isn't the forOf loop functionally similar to the forEach? I might have this wrong
Tony Rivera
@tonyrivera
Aug 26 2016 20:13
@tylerobot i needs to be set to 0 then after each iterating add +1 upto array.lenght
Or do what they said and do a foreach
tylerobot
@tylerobot
Aug 26 2016 20:14
I was having the same issue using a standard for loop
might just switch to forEach
Tony Rivera
@tonyrivera
Aug 26 2016 20:17
for(var i=0, len=myArray.length; i < len){}
for(var i=0; len=twitchUsers; i<len){}
@tylerobot
Then you have to do
Jason Luboff
@JLuboff
Aug 26 2016 20:21
@tylerobot I'm not sure to be honest
Tony Rivera
@tonyrivera
Aug 26 2016 20:21
twitchUsers[ i]
Jason Luboff
@JLuboff
Aug 26 2016 20:22
@zaidiali Its a class. <img src="url,jpg" class="img-responsive">
roninjedi
@roninjedi
Aug 26 2016 20:35
I can't tell how they got the portfolio example to look like one page scrolling over another. It dosen't look like their are any frame ID's in the code. Does anyone know how?
Norvin Burrus
@ndburrus
Aug 26 2016 21:09
@zaidiali :sparkles:
  • use the format/syntax from the example code, here:
    <ul>
        <li>milk</li>
        <li>cheese</li>
    </ul>
Alex
@Sevohan
Aug 26 2016 21:25
Hey I'm running into an issue that has me baffled. For some reason I can't see my quotes for my quote machine show up on when I run it but others are able to see them. Does anyone know what could be causing this? codepen.io/Sevohan/pen/NAkdag
Wait, never mind. I figured it out.
Norvin Burrus
@ndburrus
Aug 26 2016 21:26
@zaidiali class
Carl Smith
@Csmith1990
Aug 26 2016 21:33
Hi everyone
Aaron
@apalm1341
Aug 26 2016 21:39
@apalm1341
http://codepen.io/ap1341/pen/grNWoJ
Can someone help me please?
I am wondering what fonts and colors I should use throughout this project
And also am wondering how to go about putting my actual projects to showcase into here
@apalm1341
I want my images of the actual projects that I am showcasing in my portfolio project to look like this site's
And also something got screwed up with some of my text being hidden in the about me section
Kelly Mason
@kellymason
Aug 26 2016 22:00
Hi frontenders! Is there a place to see other answers once you've submitted your challenge? I'm working through the algorithms and would love to see other ways of solving some of these.
Tyler Moeller
@TylerMoeller
Aug 26 2016 22:06
@kellymason The Wiki has a few different answers for most of the algorithm challenges: https://github.com/FreeCodeCamp/freecodecamp/wiki
Joakim Bajoul Kakaei
@Todai88
Aug 26 2016 22:12
Does anyone know of a good (accurate) API for getting the user's location without having a https host? Can't seem to find one that locates me closer than 50-60km from where I live.
Tyler Moeller
@TylerMoeller
Aug 26 2016 22:15
@Todai88 How does this one work for you? http://s.codepen.io/TylerMoeller/debug/NAmoGG
That uses the Google Maps Geolocation API, but you need an API key to use it: https://developers.google.com/maps/documentation/geolocation/intro
It's about a mile away for me on my cell phone.
Joakim Bajoul Kakaei
@Todai88
Aug 26 2016 22:16
@Tyler thanks for the suggestion, but it's even further away from me. :P
CamperBot
@camperbot
Aug 26 2016 22:16
todai88 sends brownie points to @tyler :sparkles: :thumbsup: :sparkles:
:cookie: 28 | @tyler |http://www.freecodecamp.com/tyler
Tyler Moeller
@TylerMoeller
Aug 26 2016 22:16
LOL
Bob Evermore
@BeeQuickest
Aug 26 2016 22:20
Hi Everyone. I'm working on the Personal Portfolio project. I've successfully created a nav-bar at the top with working buttons that shift the page to the identified sections (e.g. About, Portfolio, Contact Me) but when the page shifts up, the upper part of it disappears under the nav-bar. Can someone suggest a way to make the page shift up only to the bottom of the nav-bar and not to the very top of the window?
Dan
@dcgoings
Aug 26 2016 22:32
@BeeQuickest you have some JS code that allows the scroll, correct?
Ken Haduch
@khaduch
Aug 26 2016 22:55
@BeeQuickest - one way is to add padding-top: 50px; (that's the typical size of the navbar) to the body element in the CSS. That at least makes the page load without hiding the top. @dcgoings is probably getting at adjusting the scroll amounts, too?

@apalm1341 - for your projects, you can take a screenshot of your front page and then scale it down to use as the image for your projects, and set it up within an anchor tag so that they are clickable.

Colors are another problem - I think that the background images are a little "busy" - I don't know what others would feel about that?

Ken Haduch
@khaduch
Aug 26 2016 23:00
@apalm1341 - http://mashable.com/2013/01/15/color-scheme-tools/#IbSn9nCaxZqx - have a look there for color schemes?
Alex
@Sevohan
Aug 26 2016 23:01
Hey everyone! I'm just finishing up my random quote machine but I can't figure out how to get my twitter button to automatically enter my quote into the tweet when it is pressed. Has anyone found any resources that helped with this?
Bob Evermore
@BeeQuickest
Aug 26 2016 23:03
@dcgoings @khaduch Sorry guys, I didn't get a reply right away and then got called away from my office momentarily. Not sure if I've done everything properly as far as scrolling goes, although the page scrolls and will adjust to the desired sections when I hit the nav buttons. The only problem is the top of each section is obscured by the nav-bar.
Ken Haduch
@khaduch
Aug 26 2016 23:08
@BeeQuickest - well, depending on how you are scrolling (it will most likely involve some javascript to do this?) you would have to adjust the scroll amount by 50px (or whatever your navbar height is), at least that's what I'm thinking? Are you using some javascript smooth-scrolling code or something? Or just internal links. If it is just internal links, I don't know if there is a way to automatically adjust it? Care to post a link?
Bob Evermore
@BeeQuickest
Aug 26 2016 23:10
```js
Ken Haduch
@khaduch
Aug 26 2016 23:11
@BeeQuickest - I guess that you could always put "padding-top: 50px;" on each div (I'm thinking each section of your page is a div?) so that it will push the content down? Or is that margin-top? one or the other... :)
Bob Evermore
@BeeQuickest
Aug 26 2016 23:12
@khaduch
http://codepen.io/BeeQuickest/pen/OXdyZY here's the code, I think I'll try padding/margin and see if that helps. Thanks
CamperBot
@camperbot
Aug 26 2016 23:12
beequickest sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1582 | @khaduch |http://www.freecodecamp.com/khaduch
Bob Evermore
@BeeQuickest
Aug 26 2016 23:14
@khaduch Isn't that going to add excessive space between the different sections of my page?
Bob Evermore
@BeeQuickest
Aug 26 2016 23:22
@khaduch @dcgoings It looks like I'll try the bootstrap data-spy plug-in and see what happens. Thanks for the suggestions.
CamperBot
@camperbot
Aug 26 2016 23:22
beequickest sends brownie points to @khaduch and @dcgoings :sparkles: :thumbsup: :sparkles:
:warning: beequickest already gave khaduch points
:cookie: 351 | @dcgoings |http://www.freecodecamp.com/dcgoings
Dan
@dcgoings
Aug 26 2016 23:23
hey @BeeQuickest still here?
i was in a rocket league game lol
Bob Evermore
@BeeQuickest
Aug 26 2016 23:24
@dcgoings yes, but just leaving to modify code to include bootstrap data-spy plug-in...
Dan
@dcgoings
Aug 26 2016 23:24
@khaduch has a good idea with the padding, but i was unable to do this because i had three different navbar heights depending on width of the page. i probably could have made three media queries for this, but i ended up finding a better solution
for my scroll click event, i ended up just editing scrollTop to this:
scrollTop: $(this.hash).offset().top - $(".navbar-default").height()
so it subtracts whatever the height of the navbar is. obviously your mileage will vary, and your naming might not look the same as mine
my entire click function is this:
    $(".scroll").click(function(event) {
        event.preventDefault();
        $("html,body").animate({
            scrollTop: $(this.hash).offset().top - $(".navbar-default").height()
        }, 1000);
    });
Bob Evermore
@BeeQuickest
Aug 26 2016 23:26
This is quite a bit more sophisticated than my effort... ;)
Dan
@dcgoings
Aug 26 2016 23:26
haha np
Carl Smith
@Csmith1990
Aug 26 2016 23:33
Anyone want to make a website with me?
Alex
@Sevohan
Aug 26 2016 23:42
Hey everyone! I'm just finishing up my random quote machine but I can't figure out how to get my twitter button to automatically enter my quote into the tweet when it is pressed. Has anyone found any resources that helped with this?
Dan
@dcgoings
Aug 26 2016 23:49
@Sevohan the text that is inside a tweet is whatever is in the link
example, for mine, i have this whenever someone tries tweeting without picking a quote
https://twitter.com/intent/tweet?text=oops! I forgot to get a quote! %23freetheswanson
with that said, the way i approached that was using JQuery to change the href attribute.
Alex
@Sevohan
Aug 26 2016 23:55
@dcgoings Is there a way to set the quote on the page to automatically be put into the tweet?
Dan
@dcgoings
Aug 26 2016 23:55
yes, i did it using jquery.
for example
whenever a quote is generated, at the same time, i have it change the href that is linked to my tweet button
does that make sense?
Alex
@Sevohan
Aug 26 2016 23:57
@dcgoings That makes perfect sense. Thank you!
CamperBot
@camperbot
Aug 26 2016 23:57
sevohan sends brownie points to @dcgoings :sparkles: :thumbsup: :sparkles:
:cookie: 352 | @dcgoings |http://www.freecodecamp.com/dcgoings
Dan
@dcgoings
Aug 26 2016 23:59
so i just saw you're using an API for your quotes. i ended up making an array of 40-50 quotes instead. but as long as you know how to grab the quote text, it's smooth from there.
here's mine