These are chat archives for FreeCodeCamp/HelpFrontEnd

11th
Oct 2016
Walid Ashri
@walidashri
Oct 11 2016 00:00
.box height : 30 vh not vw
Jerzz
@2cool4school
Oct 11 2016 00:09
This message was deleted
can anyone tell me why this code wont work? Im trying to replicate and example of a dropdown button but use a link inside my navbar instead:
<!DOCTYPE html>
<html>
<head>
<style>

ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
}

li {
    float: left;
}

li a {
    display: block;
    color: powderblue;
    text-align: center;
    padding: 7px 7px;
    text-decoration: none;
}

li a:hover {
    background-color: #111;
}

.dropbtn {
    background-color: #4CAF50;
    color: white;
    padding: 16px;
    font-size: 16px;
    border: none;
    cursor: pointer;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
    display: block;
}

.dropdown:hover .dropbtn {
    background-color: #3e8e41;
}
</style>
</head>
<body>

<h2>Hoverable Dropdown</h2>
<p>Move the mouse over the button to open the dropdown menu.</p>



<ul>
  <li class='dropdown'>
    <a href='#' class='dropbtn'>Dropdown</a>
    <div class="dropdown-content">
      <a href="#">Link 1</a>
      <a href="#">Link 2</a>
      <a href="#">Link 3</a>
    </div>
  </li>
</ul>

</body>
</html>
Evan W
@Dirtier
Oct 11 2016 00:35
Can someone please help me figure out why I'm getting a reference error? I'm using Vue.js
I've been at this for 3 days
John Garrison
@johntg96
Oct 11 2016 00:37
I am making a hangman game and I get:
game.js:71 Uncaught SyntaxError: Unexpected end of input
// start a new game
$('#new-game').on('click', function() {
$('.game').removeClass('hide');
$(this).addClass("hide");
$('#reset').removeClass('hide');
main()
});
@johntg96 Why would I get this error? I am pretty sure I have all the right closings..
// start a new game
$('#new-game').on('click', function() {
    $('.game').removeClass('hide');
    $(this).addClass("hide");
    $('#reset').removeClass('hide');
    main()
});
Jordan Bartholomew
@tourdejord
Oct 11 2016 00:45
3 days? That's rough, Your tic tac toe worked for me.
Beautifully I might add. Looks good.
Evan, what's the issue?
@Dirtier
I had to jump on the computer. My phone isn't being tag(@) friendly.
Stephen James
@sjames1958gm
Oct 11 2016 01:11
@Dirtier Try game.compStart("X") the modal is not part of game
@johntg96 That is all there is?
Evan W
@Dirtier
Oct 11 2016 01:18
I'm back
sorry
Ok so when you click the versus computer
you should be able to click on either the X or the O
and that will call the function compStart that sets the respective marker, and then makes the modal disappear
Stephen James
@sjames1958gm
Oct 11 2016 01:18
In your modal template try game.compStart
Evan W
@Dirtier
Oct 11 2016 01:19
v-on:click='game.compStart' ?
Stephen James
@sjames1958gm
Oct 11 2016 01:19
yes, add game. to the front of the two calls
Evan W
@Dirtier
Oct 11 2016 01:19
Holy shit
are you fing kidding me
Stephen James
@sjames1958gm
Oct 11 2016 01:20
@Dirtier Sorry :(
Evan W
@Dirtier
Oct 11 2016 01:20
that actually worked? I've been smashing my head against the wall for days
trying to figure out why this wasn't working
Lol wow @sjames1958gm thanks a lot man
CamperBot
@camperbot
Oct 11 2016 01:20
dirtier sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 3780 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Stephen James
@sjames1958gm
Oct 11 2016 01:20
@Dirtier I believe it did, the modal is outside of the game object, so it needed to reference it
Evan W
@Dirtier
Oct 11 2016 01:21
Yea it worked lol I'm just astounded
Bc I swear it was able to change data
before I made it a function, so I thought it had something to do with it being a function
@tourdejord Thanks :P
CamperBot
@camperbot
Oct 11 2016 01:22
dirtier sends brownie points to @tourdejord :sparkles: :thumbsup: :sparkles:
:cookie: 272 | @tourdejord |http://www.freecodecamp.com/tourdejord
Evan W
@Dirtier
Oct 11 2016 01:23
@tourdejord It wasnt a problem with the game itself, it was with the way I was trying to get input from the user about which marker they wanted when they hit vs computer
Kevin Janada Roy Ardian
@kevinjanada
Oct 11 2016 01:23
Hey all, hows it going?
Evan W
@Dirtier
Oct 11 2016 01:24
I finished the game and most of the UI first and then kind of went back through and rectro-actively added the AI and the marker selection, which turned out to be way bigger of a pain in the ass than I thought it would
@sjames1958gm Thanks again man, can't believe it was that simple lol, after 3 days on stackoverflow and spamming questions in here and getting no answers you have no idea how much that just helped
CamperBot
@camperbot
Oct 11 2016 01:25
:warning: dirtier already gave sjames1958gm points
dirtier sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
Evan W
@Dirtier
Oct 11 2016 01:26
Now I just have to figure out why it isn't transitioning into the modal O.o and why the sounds aren't working on the welcome screen
Kevin Janada Roy Ardian
@kevinjanada
Oct 11 2016 01:26
Im trying to assign an ajax response to a variable, but it is not working.
Could someone take a look at my code please?
```
Im trying to assign an ajax response to a variable, but it is not working.
Could someone take a look at my code please?

$(document).ready(function(){


var quoteData;

      $.ajax({
        url: 'https://andruxnet-random-famous-quotes.p.mashape.com/', // The URL to the API. You can get this in the API page of the API you intend to consume
        type: 'GET', // The HTTP Method, can be GET POST PUT DELETE etc
        dataType: 'json',
        success: function(data) { 
          console.log(data);
          quoteData = data;
        },
        error: function(err) { alert(err); },
        beforeSend: function(xhr) {
        xhr.setRequestHeader("X-Mashape-Authorization", "FBozgJ3jMGmshCl5vNX6duTY1Zuop1wJypcjsnL0HOmBEK4Jm4"); // Enter here your Mashape key
        }
    });

  console.log(quoteData);
console.log(quoteData) returns undefined
Evan W
@Dirtier
Oct 11 2016 01:28
@kevinjanada can you post your codepen
Evan W
@Dirtier
Oct 11 2016 01:32
ok yea ive run into this before
its bc the ajax call is async I believe, so it has something to do with the data coming in at a different time and you can't move it outside
I'm not entirely sure why, just know you can't lol
I would just do everything you need to do inside the success function
Kantra
@removed~kantrakantra
Oct 11 2016 01:33

Hey guys, can anybody help me figure out how to add the line of html code in my .on() function to the specified div element?

I must be doing something incorrectly because an image is supposed to appear in the center of the page when 'RUN' is clicked

http://codepen.io/kantrakantra/pen/qNZawR?editors=0010

Kevin Janada Roy Ardian
@kevinjanada
Oct 11 2016 01:36
@Dirtier hmm ok, i will try that. thanks for that
CamperBot
@camperbot
Oct 11 2016 01:36
kevinjanada sends brownie points to @dirtier :sparkles: :thumbsup: :sparkles:
:cookie: 250 | @dirtier |http://www.freecodecamp.com/dirtier
Evan W
@Dirtier
Oct 11 2016 01:37
@kevinjanada heres an example if you want http://codepen.io/Dirtier/pen/ORjLoW
Just did everything I needed once it had successfully gotten the information from the API calls
Kantra
@removed~kantrakantra
Oct 11 2016 01:40

Actually my mistake, it is working. But its stacking each new line of code instead of replacing the previous one everytime 'RUN' is clicked. Anybody know how to fix that?

http://codepen.io/kantrakantra/pen/qNZawR?editors=0010

Evan W
@Dirtier
Oct 11 2016 01:45
@sjames1958gm You wouldn't happen to know why the on-hover tick sound isn't working on the welcome screen, would you?
Kantra
@removed~kantrakantra
Oct 11 2016 01:46
Okay nvm I fixed it with .html()
Joaquin Ignacio Sanz
@JoacoSz
Oct 11 2016 02:01
Do you guys know of any site to grab some good icons for the weather app?
Kevin Janada Roy Ardian
@kevinjanada
Oct 11 2016 02:04
hey guys, could i get a hint as to why my quote button only works once?
DJ
@qualitymanifest
Oct 11 2016 02:12
@kevinjanada you need to make it call the ajax function on click. right now you're only calling the ajax function once ever and your click function is displaying the data from that call.
Kevin Janada Roy Ardian
@kevinjanada
Oct 11 2016 02:20
@qualitymanifest yes, it works now. Thanks!!
CamperBot
@camperbot
Oct 11 2016 02:20
kevinjanada sends brownie points to @qualitymanifest :sparkles: :thumbsup: :sparkles:
:star2: 1435 | @qualitymanifest |http://www.freecodecamp.com/qualitymanifest
DJ
@qualitymanifest
Oct 11 2016 02:20
cool :+1:
Greg D
@mosaic-greg
Oct 11 2016 02:31
i think this is a good idea for tic tac toe?
var board = [null,null,null,null,null,null,null,null,null]
Greg D
@mosaic-greg
Oct 11 2016 02:42
the click function (on the div) will check if null, then update the board array, and append the div to "X" or "O"
Ken Haduch
@khaduch
Oct 11 2016 02:46
@JoacoSz - there is a set of weather icons that you can get - check here: https://erikflowers.github.io/weather-icons/
JD Tadlock
@jdtdesigns
Oct 11 2016 02:57
@mosaic-greg It's mainly about the index value and not the type
c0d0er
@c0d0er
Oct 11 2016 03:05
could anybody give some idea to solve the challenge Smallest Common Multiple? the following is my current code:
function smallestCommons(arr) {
    var a=[];
  for(var i=Math.min.apply(null,arr); i<=Math.max.apply(null,arr); i++){a.push(i);}
  console.log(a)
  var b=1;
//while(j%a[0]!==0||j%a[1]!==0||j%a[2]!==0||j%a[3]!==0||j%a[4]!==0||j%a[5]!==0){ j++;}//this code works
var test=function(){return b++;};
for(var y=0;y<a.length;y++){while(b%a[y]!==0||b%a[y+1]){
    test();}}
return b;
}
smallestCommons([18, 23]);
/*
smallestCommons([1, 5]) should return a number.
smallestCommons([1, 5]) should return 60.
smallestCommons([5, 1]) should return 60.
smallestCommons([1, 13]) should return 360360.
smallestCommons([23, 18]) should return 6056820.
*/
JD Tadlock
@jdtdesigns
Oct 11 2016 03:50
If anybody wants to see an app being built from the ground up, i'm creating a DevWar app. https://ide.c9.io/jdtdesigns/devwar
Michael Karpinski
@karpimpski
Oct 11 2016 03:59
@jdtdesigns are you going to make this public?
JD Tadlock
@jdtdesigns
Oct 11 2016 04:00
@karpimpski for coding?
Michael Karpinski
@karpimpski
Oct 11 2016 04:01
@jdtdesigns no, I mean are you going to make this a public website for people to actually practice coding or is this just a personal project?
JD Tadlock
@jdtdesigns
Oct 11 2016 04:02
@karpimpski It'll be a public place to sign up for Dev War tournaments. The matches will be 3v3, 2v2 or 1v1 and streamed live on twitch.
The matches will consist of a huge variety of challenges from created standard html/css/js sites to full apps with node, php and other languages
Michael Karpinski
@karpimpski
Oct 11 2016 04:03
@jdtdesigns that sounds really awesome!
JD Tadlock
@jdtdesigns
Oct 11 2016 04:04
oh yes @karpimpski
i can't wait until i'm finished lol
Michael Karpinski
@karpimpski
Oct 11 2016 04:04
@jdtdesigns make sure you let everybody here know when you are, I'd love to check it out once it's done
JD Tadlock
@jdtdesigns
Oct 11 2016 04:04
i'll definitely spread the word
i'm not sure how long it will take
shiva mariswamy subramani
@shivamar
Oct 11 2016 04:40
@kevinjanada i liked ur quote page. simple to learn ajax n css for a beginner
Kevin Janada Roy Ardian
@kevinjanada
Oct 11 2016 04:42
@shivamar thanks! appreciate it. hopefully i'll finish it soon.
just need to make the tweet button work now
CamperBot
@camperbot
Oct 11 2016 04:42
kevinjanada sends brownie points to @shivamar :sparkles: :thumbsup: :sparkles:
:cookie: 24 | @shivamar |http://www.freecodecamp.com/shivamar
Kantra
@removed~kantrakantra
Oct 11 2016 05:37

Does anybody know if you can animate a fade in for .html()?

For example with this code:

$(document).ready(function() {

  $('.run').on('click', function() {

      $(".theball").html('<div class="die pulse" style="background-image: url(' + suh() + ');"></div>');

    })

})

which is adding/replacing the enclosed div element everytime the div classed .theball is clicked. Is there anyway to animate – preferably a fade in / fade out – of the element (it's essentially just an image) everytime .theball is clicked?

This is the rest of the code, It's a Magic Eight Ball. Click "RUN" to see what I'm talking about. I want the Eight Ball response to fade out and the new one to fade in every time it's changed.

http://codepen.io/kantrakantra/pen/bwrEaq?editors=1010

NITIN RAGHAV
@nitinraghav
Oct 11 2016 05:41
how to indent a <p>?
silver537
@silver537
Oct 11 2016 06:28
Text-indent
c0d0er
@c0d0er
Oct 11 2016 06:32
could anybody check why the following code works in repl.it, but cannot pass the the challenge Smallest Common Multiple in fcc ?
function smallestCommons(arr) {
var max=Math.max(arr[0],arr[1]);
  var min=Math.min(arr[0],arr[1]);
function test (num){
    for(var i=min; i<=max; i++){
        if(num%i){return false}        
    }
    return true;
}
var a=1;
while(!test(a)){a++;test(a);}
return a;
}
smallestCommons([1,13]);
/*
smallestCommons([1, 5]) should return a number.
smallestCommons([1, 5]) should return 60.
smallestCommons([5, 1]) should return 60.
smallestCommons([1, 13]) should return 360360.
smallestCommons([23, 18]) should return 6056820.
*/
Dr. Paul Kenneth Shreeman
@pkshreeman
Oct 11 2016 06:35
@c0d0er hello again. The challenge is to multiply these numbers together without repeating. You did not multiply the results.
NITIN RAGHAV
@nitinraghav
Oct 11 2016 06:36
@silver537 thanks
CamperBot
@camperbot
Oct 11 2016 06:36
nitinraghav sends brownie points to @silver537 :sparkles: :thumbsup: :sparkles:
:cookie: 610 | @silver537 |http://www.freecodecamp.com/silver537
Dr. Paul Kenneth Shreeman
@pkshreeman
Oct 11 2016 06:38
  $('button').click( function(){

     if(this.id == "blue" || "red"){
     if (this.id =="blue"){enemycolor = "blue"; mycolor="red"; console.log("color selected")};
     if(this.id =="red"){enemycolor="red",mycolor="blue"};
      $("#infohere").html('<div class ="w3-container"><button id = "1"></button><button id = "2"></button><button id = "3"></button><br><button id = "4"></button><button id = "5"></button><button id = "6"></button><br><button id = "7"></button><button id = "8"></button><button id = "9"></button><br></div>')};
     if(this.id == "1"){console.log("does this even work?")};
   })
 });
What am I doing wrong here?
I"m trying to write over the html code with new html code and continue to monitor these new button's clicking activity. There's no response.
Ayush Agrawal
@ayush1810
Oct 11 2016 06:48
Hey,
I just learned Bootstrap after learning HTML,CSS, JS, JQUERY.
I wish to make a personal portfolio but can't make a layout. Can anyone suggest some ideas for layout design of the site.
Or some resources to look up for that?
Ahmad Ali
@microcyberz
Oct 11 2016 08:01
game is not complete yet, but I programmed it to generate auto opponent's response. Sometimes It does not generate that response, I would appreciate your help http://codepen.io/microcyberz/pen/wzmVrG
cannelflow
@cannelflow
Oct 11 2016 08:03
can any one point me in the right direction for creating this type of nav bar https://blackrockdigital.github.io/startbootstrap-stylish-portfolio/
cannelflow
@cannelflow
Oct 11 2016 08:08
ty @cannelflow
CamperBot
@camperbot
Oct 11 2016 08:08
sorry cannelflow, you can't send brownie points to yourself! :sparkles: :sparkles:
cannelflow
@cannelflow
Oct 11 2016 08:33
@kirbyedy ty
CamperBot
@camperbot
Oct 11 2016 08:33
cannelflow sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1444 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
cannelflow
@cannelflow
Oct 11 2016 08:33
i also found some http://bootsnipp.com/user/snippets/3XRNV @kirbyedy
Evan W
@Dirtier
Oct 11 2016 08:49
Grr anyone there pretty good w/ Vue and debugging?
I'm not too great with the chrome debugger and I can't figure out why its giving me an undefined
Ghulam Shabir
@ghulamshabir
Oct 11 2016 08:55
Hello all campers, I am getting started to work on Build a Portfolia assignment, which library to use? bootstrap?, I will be using this project as my real portfolio, so what is easiest way to host the project from codepen to the hosting website. which free hosting website are you using? please give you invaluable suggestions. !!THANKS!!
Allan Pooley
@AllanPooley
Oct 11 2016 08:58
@ghulamshabir Hey Ghulam Shabir, I've just had a go at the challenge and found bootstrap to be pretty handy and easy to use. I'd recommend it.
Ghulam Shabir
@ghulamshabir
Oct 11 2016 08:58
@AllanPooley ok. where you guys host your portfolios for free?
Allan Pooley
@AllanPooley
Oct 11 2016 08:59
There's lots of online resource, videos of youtube, but this is the reference that is particularly handy: https://getbootstrap.com/
Ghulam Shabir
@ghulamshabir
Oct 11 2016 09:00
@AllanPooley oh you mean i need to google to find a hosting website? you could name one or two please
@AllanPooley learning bootstrap is not a problem, i am thinking of making this project online, would you help me
Allan Pooley
@AllanPooley
Oct 11 2016 09:03
@ghulamshabir I just meant for using bootstrap. I'm not sure about hosting. I'm not sure if there is a place that will host your html and css for free. You want your own domain right? Like "ghulamshabir.com" right?
kat-mag
@kat-mag
Oct 11 2016 09:03
@ghulamshabir github
Ghulam Shabir
@ghulamshabir
Oct 11 2016 09:03
@AllanPooley oh yes that i was asking
@kat-mag oh github? its good? i thought people use it post their programs to review or something like that
kat-mag
@kat-mag
Oct 11 2016 09:04
gh-pages You can have your static webpage there
@ghulamshabir and you'll learn to use git along the way ;D
Ghulam Shabir
@ghulamshabir
Oct 11 2016 09:05
@AllanPooley @kat-mag can i get domain on my own name on github
kat-mag
@kat-mag
Oct 11 2016 09:06
@ghulamshabir u gonna get username.github.io
It's good for a start
Ghulam Shabir
@ghulamshabir
Oct 11 2016 09:06
@kat-mag @AllanPooley oh thank you all , you are great :smile:
CamperBot
@camperbot
Oct 11 2016 09:06
:cookie: 359 | @kat-mag |http://www.freecodecamp.com/kat-mag
:cookie: 122 | @allanpooley |http://www.freecodecamp.com/allanpooley
ghulamshabir sends brownie points to @kat-mag and @allanpooley :sparkles: :thumbsup: :sparkles:
Allan Pooley
@AllanPooley
Oct 11 2016 09:07
Good luck and have fun @ghulamshabir ! :smile:
Ghulam Shabir
@ghulamshabir
Oct 11 2016 09:07
@AllanPooley :smile:
Sebastian Cheung CQF
@scheung38
Oct 11 2016 09:46

how to import expect into codepenio :

https://www.npmjs.com/package/expect

Settings -> Javascript -> Babel

and then

https://npmcdn.com/expect@1.20.2/umd/expect.min.js

kat-mag
@kat-mag
Oct 11 2016 09:54
Sebastian Cheung CQF
@scheung38
Oct 11 2016 09:55
Thanks @kat-mag
CamperBot
@camperbot
Oct 11 2016 09:55
scheung38 sends brownie points to @kat-mag :sparkles: :thumbsup: :sparkles:
:cookie: 360 | @kat-mag |http://www.freecodecamp.com/kat-mag
Sebastian Cheung CQF
@scheung38
Oct 11 2016 09:56
But it is not working
http://codepen.io/scheung38/pen/JRvERJ?editors=1111 , should be getting back error as code is not even finished, but no errors shown?
Stephen James
@sjames1958gm
Oct 11 2016 09:59
@scheung38 Exceptions show in the devtools console - not the codepen console
kat-mag
@kat-mag
Oct 11 2016 10:04
@scheung38 yeah. works as @sjames1958gm said
Sebastian Cheung CQF
@scheung38
Oct 11 2016 10:05
@sjames1958gm thanks but I am not getting any error in console...
CamperBot
@camperbot
Oct 11 2016 10:05
scheung38 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 3782 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Sebastian Cheung CQF
@scheung38
Oct 11 2016 10:06
devtools console and not console? I only see one console in Codepen
kat-mag
@kat-mag
Oct 11 2016 10:06
devtools
Stephen James
@sjames1958gm
Oct 11 2016 10:06
I see this : expect.min.js:1 Uncaught Error: Expected 0 to equal 1
kat-mag
@kat-mag
Oct 11 2016 10:06
ctrl+shift+i on chrome
or right button -> inspect
Stephen James
@sjames1958gm
Oct 11 2016 10:07
@scheung38 codepen console shows only console.log() output, but the devtools console shows runtime errors as well
Or F12
Sebastian Cheung CQF
@scheung38
Oct 11 2016 10:10
Ok then the link was incorrect, I had to change Codepen - Settings -> Javascript Preprocessor -> Babel to see console
kat-mag
@kat-mag
Oct 11 2016 10:11
seriously
what browser are you using?
Stephen James
@sjames1958gm
Oct 11 2016 10:12
@scheung38 If you use try/catch around your test cases you can send the output to the console from the catch.
Sebastian Cheung CQF
@scheung38
Oct 11 2016 10:12
chrome
kat-mag
@kat-mag
Oct 11 2016 10:13
have you used right mouse button -> inspect? or ctrl+shift+i?
Stephen James
@sjames1958gm
Oct 11 2016 10:13
function counter(state, action) {
  // if (action.type === 'INCREMENT') {
  // return state + 1;
  // } else if (action.type === 'DECREMENT')   // {
  // return state - 1;
  // }
  // }
  return state;
}

try {
   expect(
     counter(0, {
       type: 'INCREMENT'
     })

).toEqual(1);


  console.log('All Tests Passed!');

} catch (e) {
  console.log('Test failed: ', e);
}
Sebastian Cheung CQF
@scheung38
Oct 11 2016 10:14
This message was deleted
Stephen James
@sjames1958gm
Oct 11 2016 10:15
@scheung38 That is a different tool than codepen - these are codepen limitations - that I think is jsbin
Sebastian Cheung CQF
@scheung38
Oct 11 2016 10:16
@sjames1958gm thanks then JSBin is better than Codepen then in this case as I need to see error in Chrome inspector, JSBin shows error in their console
CamperBot
@camperbot
Oct 11 2016 10:16
scheung38 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:warning: scheung38 already gave sjames1958gm points
Max Mirza
@maxmirza
Oct 11 2016 10:25

hey guys im trying to get the physical layout of a tic tac toe game, is anyone willing to help? :)
boolean mouseOverRect(int x, int y, int w, int h) {
return (mouseX >= x && mouseX <= x+w && mouseY >= y && mouseY <= y+h);
}

Button squareOne;
Button squareTwo;
Button squareThree;
Button squareFour;
Button squareFive;
Button squareSix;
Button squareSeven;
Button squareEight;
Button squareNine;

import java.util.Scanner;

void setup()
{
size (800, 800);
squareOne = new Button( 100, 300 , 100, 100);
squareTwo = new Button( 200, 300 , 100, 100);
squareThree = new Button( 300, 300 , 100, 100);
squareFour = new Button( 400, 300 , 100, 100);
squareFive = new Button( 500, 300 , 100, 100);
squareSix = new Button( 600, 300 , 100, 100);
squareSeven = new Button( 600, 300 , 100, 100);
squareEight = new Button( 600, 300 , 100, 100);
squareNine = new Button( 600, 300 , 100, 100);
}

void draw()
{
squareOne.draw();
squareTwo.draw();
squareThree.draw();
squareFour.draw();
squareFive.draw();
squareSix.draw();
squareSeven.draw();
squareEight.draw();

}

Jack Lyons
@JackEdwardLyons
Oct 11 2016 11:08
@c0d0er first of all, set up some variables to make your code cleaner and easier to read
Frank
@skfwnelf
Oct 11 2016 11:12
why can't I see the project challenges finished on the main page of FCC after submitting with the codepen URL
Farid
@Faredhattab
Oct 11 2016 11:46
any help with writing a program to cheak if a given array is magic Square or not (for example) [[2,7,6],[9,5,8],[4,3,1]]
https://upload.wikimedia.org/wikipedia/commons/thumb/e/e4/Magicsquareexample.svg/180px-Magicsquareexample.svg.png
Rostyslav
@BeerDRinker
Oct 11 2016 12:46
hello al
all
need help
with twitch project
what query i should to do
GET /channels/:channel
or
GET /streamers/:channel
?
Rostyslav
@BeerDRinker
Oct 11 2016 12:53
so I need bouth?
kirbyedy
@kirbyedy
Oct 11 2016 12:54
I think so
oh you need a client-id as well
Rostyslav
@BeerDRinker
Oct 11 2016 12:57
I allready have one
kirbyedy
@kirbyedy
Oct 11 2016 12:58
https://api.twitch.tv/kraken/streams/ + user name + client_id
Artur Arsalanov
@kurumkan
Oct 11 2016 13:00

@Faredhattab please check this code var t =[[ 4 , 9, 2 ],[ 3 , 5, 7 ],[ 8 , 1 , 6 ]]

console.log(isMagic(t));

function isMagic(array){
var sum = array[0].reduce(function(a,b){return a+b});

for(var i=1; i<array.length; i++){
    var temp = array[i].reduce(function(a,b){return a+b});
    if(temp!==sum){
        return false;
    }
}

for(var i=0; i<array.length; i++){
    var temp = array.map(function(d){return d[i]}).reduce(function(a,b){return a+b});         
    if(temp!==sum){            
        return false;
    }
}

var temp1 = 0;
var temp2 = 0;
for(var i=0; i<array.length; i++){
    temp1+=array[i][i];
    temp2+=array[i][array.length-1-i];
}

if(temp1!==sum||temp2!==sum)
    return false;

return true;

}

@Faredhattab `var t =[[ 4 , 9, 2 ],[ 3 , 5, 7 ],[ 8 , 1 , 6 ]]

console.log(isMagic(t));

function isMagic(array){
var sum = array[0].reduce(function(a,b){return a+b});

for(var i=1; i<array.length; i++){
    var temp = array[i].reduce(function(a,b){return a+b});
    if(temp!==sum){
        return false;
    }
}

for(var i=0; i<array.length; i++){
    var temp = array.map(function(d){return d[i]}).reduce(function(a,b){return a+b});         
    if(temp!==sum){            
        return false;
    }
}

var temp1 = 0;
var temp2 = 0;
for(var i=0; i<array.length; i++){
    temp1+=array[i][i];
    temp2+=array[i][array.length-1-i];
}

if(temp1!==sum||temp2!==sum)
    return false;

return true;

}

`

f*k
Theodore P.
@Ierofantis
Oct 11 2016 14:02
can anyone explain to me why when I append text it stays for a few seconds and after it dissapears? here is my pen
http://codepen.io/Ierofantis/pen/pEpYGp?editors=1010
Stephen James
@sjames1958gm
Oct 11 2016 14:05
@Ierofantis You have your input inside a form and the browser wants to submit that form and that causes a refresh.
Make this change to call preventDefault (which prevents this default behavior)
$("#input").click(function(e) {
  e.preventDefault();
Theodore P.
@Ierofantis
Oct 11 2016 14:06
@sjames1958gm many thanks!
CamperBot
@camperbot
Oct 11 2016 14:06
ierofantis sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 3784 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Joshua Faggion
@joshfaggion11
Oct 11 2016 14:16
What are some good API's for a random quote machine?
Or libary.
Jess Alexander
@jess-alexander
Oct 11 2016 14:18
@joshfaggion11 I finished that challenge last week and made my own giant array of quotes. Using an API makes so much more sense...
Ghulam Shabir
@ghulamshabir
Oct 11 2016 14:19
gist @joshfaggion11
Jess Alexander
@jess-alexander
Oct 11 2016 14:20
@joshfaggion11 have you looked at https://quotesondesign.com/api-v4-0/?
Joshua Faggion
@joshfaggion11
Oct 11 2016 14:21
Thanks for the help guys!
Ghulam Shabir
@ghulamshabir
Oct 11 2016 14:22
@joshfaggion11 mention them who help you
ManBearPigg
@ManBearPigg
Oct 11 2016 14:22
I have a flex box that contains a form that contains one text input. The form and input width can only be changed using em or px, not percent. Any ideas why I can't change width with percent? The form is contained within a nav element of width 100%
Joshua Faggion
@joshfaggion11
Oct 11 2016 14:22
I know. Thx @ghulamshabir Thanks @jess-alexander
CamperBot
@camperbot
Oct 11 2016 14:22
:cookie: 109 | @jess-alexander |http://www.freecodecamp.com/jess-alexander
joshfaggion11 sends brownie points to @ghulamshabir and @jess-alexander :sparkles: :thumbsup: :sparkles:
:cookie: 511 | @ghulamshabir |http://www.freecodecamp.com/ghulamshabir
Ghulam Shabir
@ghulamshabir
Oct 11 2016 14:23
@joshfaggion11 :smile:
Joshua Faggion
@joshfaggion11
Oct 11 2016 14:23
I have like 300 brownie points. But I've been inactive recently.
Ghulam Shabir
@ghulamshabir
Oct 11 2016 14:23
@joshfaggion11 you dont need repeated thanking by the way
Jess Alexander
@jess-alexander
Oct 11 2016 14:23
lol - I think that was my first. :p
Ghulam Shabir
@ghulamshabir
Oct 11 2016 14:25
@joshfaggion11 @jess-alexander brownie points are our earnings for this 24 hour services lol
Joshua Faggion
@joshfaggion11
Oct 11 2016 14:25
@ghulamshabir I'de forgotten that.
Spyrantis Theodoros
@thodorisanta
Oct 11 2016 14:29

http://codepen.io/oshikurou/pen/LkvoyX

So im currently working on the : RAMDOM QUOTE GENERATOR project.
and i have no idea whatsoever on how to make the "tweet" button to actually tweet the quote that appears.
And i also wanna make the colors to change smoothly like in the freecodecamp's site "https://codepen.io/FreeCodeCamp/full/ONjoLe/"

Jess Alexander
@jess-alexander
Oct 11 2016 14:44
@thodorisanta You've got to use Javascript to create a tweet button. First, include the twitter widget in your javascript file, then check out the javascript factory function section. https://dev.twitter.com/web/tweet-button
I can't remember where I found this widget code - but it was copy and pasted from dev.twitter.com so I'll share it with you! ```//////////////////////////////////////////////////
////////////// twitter functionality ////////////
//////////////////////////////////////////////////
window.twttr = (function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0],
t = window.twttr || {};
if (d.getElementById(id)) return t;
js = d.createElement(s);
js.id = id;
js.src = "https://platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js, fjs);
  t._e = [];
  t.ready = function(f) {
    t._e.push(f);
  };

  return t;
}(document, "script", "twitter-wjs"));```
Let's try that again...
//////////////////////////////////////////////////
    ////////////// twitter functionality   ////////////
    //////////////////////////////////////////////////
      window.twttr = (function(d, s, id) {
      var js, fjs = d.getElementsByTagName(s)[0],
        t = window.twttr || {};
      if (d.getElementById(id)) return t;
      js = d.createElement(s);
      js.id = id;
      js.src = "https://platform.twitter.com/widgets.js";
      fjs.parentNode.insertBefore(js, fjs);

      t._e = [];
      t.ready = function(f) {
        t._e.push(f);
      };

      return t;
    }(document, "script", "twitter-wjs"));
Benigno Moico
@Noigallardo
Oct 11 2016 14:53
hello world
CamperBot
@camperbot
Oct 11 2016 14:53

welcome to FreeCodeCamp @Noigallardo!

Benigno Moico
@Noigallardo
Oct 11 2016 14:54
hi, how to put image in Tribute Page,
Ghulam Shabir
@ghulamshabir
Oct 11 2016 14:55
@Noigallardo you should use an online service to store the image and use that url in codepen
Dylan Noble
@drnoble88
Oct 11 2016 14:55
I am working on the build a tribute page and can't figure out how to get the bullet points in the middle like the example. Can anyone help?
Ghulam Shabir
@ghulamshabir
Oct 11 2016 14:55
@drnoble88 <ul> <li> </li> </ul>
Benigno Moico
@Noigallardo
Oct 11 2016 14:56
@ghulamshabir ... how
Ghulam Shabir
@ghulamshabir
Oct 11 2016 14:56
@drnoble88 for moving them to middle of the page you can use bootstrap's columns
Benigno Moico
@Noigallardo
Oct 11 2016 14:56
an you guide me
Jess Alexander
@jess-alexander
Oct 11 2016 14:57
@Noigallardo , I like using photobucket to upload pictures. Then right click the photo you like, and get the imageURL
Dylan Noble
@drnoble88
Oct 11 2016 14:57
@ghulamshabir I have the bullet points but I cannot get them centered.
Ghulam Shabir
@ghulamshabir
Oct 11 2016 14:57
@Noigallardo imgur.com/
Benigno Moico
@Noigallardo
Oct 11 2016 14:57
@jess-alexander thank you
CamperBot
@camperbot
Oct 11 2016 14:57
noigallardo sends brownie points to @jess-alexander :sparkles: :thumbsup: :sparkles:
:cookie: 110 | @jess-alexander |http://www.freecodecamp.com/jess-alexander
Jess Alexander
@jess-alexander
Oct 11 2016 14:58
@drnoble88 Can you post a codepen? There's probably a CSS fix.
Dylan Noble
@drnoble88
Oct 11 2016 14:58
How do I do that?
Jess Alexander
@jess-alexander
Oct 11 2016 14:58
How are your writing your code?
Jess Alexander
@jess-alexander
Oct 11 2016 14:59
There ya go! Hang on. Lemme look.
Dylan Noble
@drnoble88
Oct 11 2016 14:59
I gotta get going but I'll be back later to check. Thanks for the help!
Ghulam Shabir
@ghulamshabir
Oct 11 2016 14:59
@drnoble88 <div class = "sm-4"> something like that i dont remember exactly
first try to put your bullet list in a smaller container like col-xs-4
Jess Alexander
@jess-alexander
Oct 11 2016 15:02
@drnoble88 - You've got the bootstrap libraries included, but you're not using them yet. :) You've got to write in classes within the divs that you're using. You're on the right track, just check out those docs a little closer. http://getbootstrap.com/css/#grid-example-basic
Piotr Małecki-Jurek
@piotr-m-jurek
Oct 11 2016 15:02
and then add col-xs-offset-4 since you have grid of 12
(col-... is a class of course)
Jess Alexander
@jess-alexander
Oct 11 2016 15:02
@MrBruckner What's the offset do? I've never seen that
Piotr Małecki-Jurek
@piotr-m-jurek
Oct 11 2016 15:03
@jess-alexander try to imagine your page is split into equal 12 vertical columns
Jess Alexander
@jess-alexander
Oct 11 2016 15:04
Yes, I know how bootstrap works. :) But I've always seen the classes like col-xs-4, col-xs-4, col-xs-4
never seen xs-offset-4
Piotr Małecki-Jurek
@piotr-m-jurek
Oct 11 2016 15:04
basically
Jess Alexander
@jess-alexander
Oct 11 2016 15:04
4+4+4 = 12
Piotr Małecki-Jurek
@piotr-m-jurek
Oct 11 2016 15:04
you get space on left
like you would add another 4 wide div on the left
Jess Alexander
@jess-alexander
Oct 11 2016 15:05
Ah - so you don't have to code in an empty div just for spacing sake.
I hate doing that.
Piotr Małecki-Jurek
@piotr-m-jurek
Oct 11 2016 15:05
@jess-alexander try class="col-xs-4 col-xs-offset-4 on your dive
in 7th line
yeah ;)
Jess Alexander
@jess-alexander
Oct 11 2016 15:06
Actually, it's @drnoble88's codepen. I havent' posted any code. ;)
Piotr Małecki-Jurek
@piotr-m-jurek
Oct 11 2016 15:06
oh
well you can try it either way :smile:
ManBearPigg
@ManBearPigg
Oct 11 2016 15:08
Anyone know flexbox who can take a quick look at my gist?
Piotr Małecki-Jurek
@piotr-m-jurek
Oct 11 2016 15:10
we could try :D
John Alcher
@alchermd
Oct 11 2016 15:10
Just a quick one guys. In regexp, how do I match (555) and not match 555) and (555 ?
ManBearPigg
@ManBearPigg
Oct 11 2016 15:11
Here is the Gist. Problem is in the short description https://gist.github.com/ManBearPigg/c2234f05d24a4e9ff15f7390ec9c5166
oh wow it embeds. so problem is that form width can't be set as percent, only as static like px or em. Not sure why
Btw there is a bit more to the gist than it lets us see here
Maksim Kulichenko
@makstheimba
Oct 11 2016 15:12
@alchermd /(555)/
John Alcher
@alchermd
Oct 11 2016 15:13
@makstheimba Forgot to mention that the parentheses are optional as well.
Piotr Małecki-Jurek
@piotr-m-jurek
Oct 11 2016 15:13
@alchermd I did it like this find: (555) OR 555 without brackets
so you eliminate the fact that there could be only one bracket
Maksim Kulichenko
@makstheimba
Oct 11 2016 15:13
@alchermd When I did it I checked if brackets properly closed/opened
Piotr Małecki-Jurek
@piotr-m-jurek
Oct 11 2016 15:14
how do you check it @makstheimba
?
John Alcher
@alchermd
Oct 11 2016 15:14
@MrBruckner that made sense! brb
Maksim Kulichenko
@makstheimba
Oct 11 2016 15:16
@MrBruckner made two arrays of opened and closed brackets, and checked if they correspond to each other
Piotr Małecki-Jurek
@piotr-m-jurek
Oct 11 2016 15:17
oh, right
Maksim Kulichenko
@makstheimba
Oct 11 2016 15:17
@MrBruckner he can check for brackets with regExp also, but the statement will be very long and not very readable
Piotr Małecki-Jurek
@piotr-m-jurek
Oct 11 2016 15:18
yeah
John Alcher
@alchermd
Oct 11 2016 15:21
Thanks for the help @MrBruckner @makstheimba ! Got it working now
CamperBot
@camperbot
Oct 11 2016 15:21
alchermd sends brownie points to @mrbruckner and @makstheimba :sparkles: :thumbsup: :sparkles:
:cookie: 304 | @mrbruckner |http://www.freecodecamp.com/mrbruckner
:cookie: 343 | @makstheimba |http://www.freecodecamp.com/makstheimba
Piotr Małecki-Jurek
@piotr-m-jurek
Oct 11 2016 15:28
@ManBearPigg I'm looking, but i can't find any solution, but still looking
:D
Maksim Kulichenko
@makstheimba
Oct 11 2016 15:33
https://jsfiddle.net/w3qe0jbe/9/ Can someone explain why when I call module method directly "this" is bound to object. Yet if I pass it to setTimeout "this" is bound to global object?
ManBearPigg
@ManBearPigg
Oct 11 2016 15:39
Thanks @MrBruckner
CamperBot
@camperbot
Oct 11 2016 15:39
manbearpigg sends brownie points to @mrbruckner :sparkles: :thumbsup: :sparkles:
:cookie: 305 | @mrbruckner |http://www.freecodecamp.com/mrbruckner
ManBearPigg
@ManBearPigg
Oct 11 2016 15:40
@MrBruckner isn't it a strange problem? Should be able to use percent width since form is a child of nav which has 100% width
Piotr Małecki-Jurek
@piotr-m-jurek
Oct 11 2016 15:44
yeah
i think so
maybe you are using css on form, IDK
Simon Cordova
@gbsimon87
Oct 11 2016 15:46
good aft!
have you checked it for guidance?
Artur Arsalanov
@kurumkan
Oct 11 2016 15:47
@makstheimba When you get the property from the object and call it in one go, the object will be the context for the method. If you call the same method, but in separate steps, the context is the global scope (window) instead
Piotr Małecki-Jurek
@piotr-m-jurek
Oct 11 2016 15:47
this works
Christopher Campbell
@nankeuriseu
Oct 11 2016 15:47
Nice! Thanks, @kurumkan. I’m not Maksim, but I was wondering about context myself.
CamperBot
@camperbot
Oct 11 2016 15:47
nankeuriseu sends brownie points to @kurumkan :sparkles: :thumbsup: :sparkles:
:cookie: 318 | @kurumkan |http://www.freecodecamp.com/kurumkan
Dylan
@dhcodes
Oct 11 2016 15:49
@ManBearPigg you need a space between nav and #question-form
or at least that seems to fix the width issue
line 28
Artur Arsalanov
@kurumkan
Oct 11 2016 15:49
@nankeuriseu ya it's pretty confusing js feature. Js is so different from other languages. You are welcome
Maksim Kulichenko
@makstheimba
Oct 11 2016 15:53
@kurumkan thanks
CamperBot
@camperbot
Oct 11 2016 15:53
makstheimba sends brownie points to @kurumkan :sparkles: :thumbsup: :sparkles:
:cookie: 319 | @kurumkan |http://www.freecodecamp.com/kurumkan
Dylan
@dhcodes
Oct 11 2016 15:55
This message was deleted
Artur Arsalanov
@kurumkan
Oct 11 2016 15:56
@makstheimba hey man. Are you from Russia or Ukraine?
Maksim Kulichenko
@makstheimba
Oct 11 2016 15:56
@kurumkan Russia
Shawn Kemp
@official-shawnkemp
Oct 11 2016 15:57
im just starting on front end, however i always stuck up if im on the right place
ManBearPigg
@ManBearPigg
Oct 11 2016 15:57
@dhcodes Oh my goodness, it was a typo. You're right. Thanks a million
CamperBot
@camperbot
Oct 11 2016 15:57
manbearpigg sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1482 | @dhcodes |http://www.freecodecamp.com/dhcodes
Artur Arsalanov
@kurumkan
Oct 11 2016 15:57
@makstheimba me too. What city? Let's practice English=)
Maksim Kulichenko
@makstheimba
Oct 11 2016 16:00
@kurumkan Rostov. Nice projects mate, design's good. I have no problem writing JS, but struggle to make website eye apeealing. Can you recommend something on design?
@kurumkan And what do you mean by "practicing English"? Isn't it just reading/speaking in language you want to learn to master?
Dylan
@dhcodes
Oct 11 2016 16:05
@ManBearPigg what do i win?
Christopher Campbell
@nankeuriseu
Oct 11 2016 16:07
@makstheimba They are adding an applied visual design component to the curriculum soon.
Artur Arsalanov
@kurumkan
Oct 11 2016 16:09
@makstheimba I have the same problem. It's hard to find a good design solution on my own. So I just surf around and look for some nice looking websites. Then I just copy them=)
Christopher Campbell
@nankeuriseu
Oct 11 2016 16:09
You could also check out Coursera. There are several courses on Graphic Design and Interaction Design. I’m still hunting for a good User Experience design course.
Artur Arsalanov
@kurumkan
Oct 11 2016 16:10
@makstheimba ya I agree with you
Shiv M
@shivsagar1
Oct 11 2016 16:10
which is best source for studying react js
Artur Arsalanov
@kurumkan
Oct 11 2016 16:11
@shivsagar1 for beginners - check out http://codeacademy.com/
Jean Louis Salbego
@jlouiss
Oct 11 2016 16:11
help me please, what am I missing here? http://codepen.io/JLouisS/pen/JRvpjg
CamperBot
@camperbot
Oct 11 2016 16:11
no wiki entry for: me please what am i missing here httpcodepeniojlouisspenjrvpjg
Jean Louis Salbego
@jlouiss
Oct 11 2016 16:11
(svg shapes)
Artur Arsalanov
@kurumkan
Oct 11 2016 16:12
@shivsagar1 after that - try to make few projects on your own. And then to wrap it up and a bit extend your react skills - follow this tutorial https://www.udemy.com/react-redux/
Piotr Małecki-Jurek
@piotr-m-jurek
Oct 11 2016 16:14
@jlouiss what are you trying to accomplish?
the picture is in a wrong position?
damn
i know nothing about svg
Shiv M
@shivsagar1
Oct 11 2016 16:15
@kurumkan : thank you arthur, but before digging into react you should be perfect in es6 right
CamperBot
@camperbot
Oct 11 2016 16:15
shivsagar1 sends brownie points to @kurumkan :sparkles: :thumbsup: :sparkles:
:cookie: 320 | @kurumkan |http://www.freecodecamp.com/kurumkan
Jean Louis Salbego
@jlouiss
Oct 11 2016 16:17
@MrBruckner that's it, I'm trying to fix the picture but i don't know how to do it, thanks anyways
CamperBot
@camperbot
Oct 11 2016 16:17
jlouiss sends brownie points to @mrbruckner :sparkles: :thumbsup: :sparkles:
:cookie: 306 | @mrbruckner |http://www.freecodecamp.com/mrbruckner
Artur Arsalanov
@kurumkan
Oct 11 2016 16:17
@shivsagar1 imho - to be perfect at it - need a lot of practice - and you can learn es6 along with react. It's just my opinion. And I do that way. Probably it's not the best pathway
Shiv M
@shivsagar1
Oct 11 2016 16:19
@kurumkan : which is best source for learning javascript algorithm questions to crack javascript interviews
Artur Arsalanov
@kurumkan
Oct 11 2016 16:22
@shivsagar1 I would like to find out more about it too. Now I am reading https://www.amazon.com/Cracking-Coding-Interview-Programming-Questions/dp/0984782850/ref=pd_bxgy_14_img_2?ie=UTF8&psc=1&refRID=73MZ0CBX61V458WQ3J20 I think algorithms - it's important to be familiar with algorithms in general. They are not about language
Simon Cordova
@gbsimon87
Oct 11 2016 16:32
Hey guys, quick question...
My weather API has icons that may be used depending upon the weather at the moment.
I'm able to get the img location of the icon, but am having difficulty displaying the icon...
Here's a snapshot of what I've tried...
//getting icon info ID from API
var icon = data2.weather[0].icon;

//create a variable holding a specific icon location
var iconImage = "http://openweathermap.org/img/w/" + icon + ".png";

// Looking for something along the lines of....
$("#images").append('<img src="http://openweathermap.org/img/w/" + icon + ".png">');
Amit
@amit-s
Oct 11 2016 16:33
@shivsagar1 @kurumkan www.codewars.com
Dylan
@dhcodes
Oct 11 2016 16:35
@gbsimon87 do you have a codepen?
Simon Cordova
@gbsimon87
Oct 11 2016 16:38
hey @dhcodes what's happening buds!
http://codepen.io/gbsimon87/pen/ozZQPz?editors=1010
Tyler Moeller
@TylerMoeller
Oct 11 2016 16:41
@gbsimon87 Some issues with your quotes: Try this instead: $("#images").append('<img src="http://openweathermap.org/img/w/' + icon + '.png">');
Or, do: $('#images').append("<img src=" + iconImage + ">");
Shiv M
@shivsagar1
Oct 11 2016 16:41
@amit-s : thank you
CamperBot
@camperbot
Oct 11 2016 16:41
shivsagar1 sends brownie points to @amit-s :sparkles: :thumbsup: :sparkles:
:cookie: 332 | @amit-s |http://www.freecodecamp.com/amit-s
Artur Arsalanov
@kurumkan
Oct 11 2016 16:42
@amit-s thank you! great resource!
CamperBot
@camperbot
Oct 11 2016 16:42
kurumkan sends brownie points to @amit-s :sparkles: :thumbsup: :sparkles:
:cookie: 333 | @amit-s |http://www.freecodecamp.com/amit-s
Simon Cordova
@gbsimon87
Oct 11 2016 16:44
@TylerMoeller thanks buds I"ll try it out
CamperBot
@camperbot
Oct 11 2016 16:44
gbsimon87 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 870 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Dylan
@dhcodes
Oct 11 2016 16:45
good job @TylerMoeller . his solution worked
Simon Cordova
@gbsimon87
Oct 11 2016 16:45
@TylerMoeller worked perfectly, and cheers as well @dhcodes for offering help
Tyler Moeller
@TylerMoeller
Oct 11 2016 16:51
cheers :+1:
JD Tadlock
@jdtdesigns
Oct 11 2016 17:53
Building an app from the ground up for competitive dev tournaments if anybody is interested in watching https://ide.c9.io/jdtdesigns/devwar
Marange
@Marange
Oct 11 2016 17:57
Hello there, I'm trying to include a chat in my website, anyone knows where can I download one for free
JD Tadlock
@jdtdesigns
Oct 11 2016 18:03
it will take some basic js knowledge
Marange
@Marange
Oct 11 2016 18:05
@jdtdesigns No problem I'll give it a try, thanks
CamperBot
@camperbot
Oct 11 2016 18:05
marange sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 688 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Marange
@Marange
Oct 11 2016 18:06
@jdtdesigns seems like the site is down,
@jdtdesigns do you know where to download a chat that works with push notifications??
JD Tadlock
@jdtdesigns
Oct 11 2016 18:13
@Marange Umm, site's up for me
it's not about downloading a chat
it's about integrating a chat api with your site
it can get pretty complicated
if you're on WordPress, they have chat plugins
but otherwise, you'll need to do a little research and learning to make it happen ;)
Marange
@Marange
Oct 11 2016 18:19
@jdtdesigns OK, I get it, I'm not using any framework or CMS I'm doing it by hand that's why I want to skip the chat, I don't want to reinvent the wheel, because is not an essential part of the site just a secondary complement, so I want to use an already developed chat to save time, thanks for your help :)
CamperBot
@camperbot
Oct 11 2016 18:19
marange sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: marange already gave jdtdesigns points
dapperAuteur
@dapperAuteur
Oct 11 2016 18:20
Anyone got a moment to help me with my pomodoro clock? I can format time to hh:mm:ss and I can get the countdown to work but it doesn't countdown in hh:mm:ss format
mandreottola
@mandreottola
Oct 11 2016 18:23
build tribute page help.. hi all! so i almost have this done but need help with the responsive code. can anyone help??
Simon Cordova
@gbsimon87
Oct 11 2016 18:36
@mandreottola what do you need help with exactly?
dapperAuteur
@dapperAuteur
Oct 11 2016 18:38
You can do lots of things with nodejs
mandreottola
@mandreottola
Oct 11 2016 18:39
@gbsimon87 so the website looks good for the "Build a Tribute Page" project but when you adjust the size of the webpage, it doesnt respond like the example does.
Simon Cordova
@gbsimon87
Oct 11 2016 18:40
@mandreottola are you using any frameworks such as bootstrap?
mandreottola
@mandreottola
Oct 11 2016 18:41
@gbsimon87 no just css. is it easier to use bootstrap? if so, i will go back through the lessons.
Mohamed Hassan
@mamoshii
Oct 11 2016 18:41
Use Font Awesome to add a thumbs-up icon to your like button by giving it an i element with the classes fa and fa-thumbs-up. I cant solve this one, help please!
Simon Cordova
@gbsimon87
Oct 11 2016 18:42
@mandreottola Bootstrap consists of CSS rules that will automatically make the elements responsive as per their grid system.
If you are not using any framework, which to be honest I do recommend as it'll save you tons of work, you'll need to look at media queries.
mandreottola
@mandreottola
Oct 11 2016 18:43
ok thank you. i will look into the bootstrap
Simon Cordova
@gbsimon87
Oct 11 2016 18:45
No worries, anytime! :)
albertmillert
@albertmillert
Oct 11 2016 19:08
This message was deleted
Can anyone please help me with my weather app. Idk why my jQuery is not working properly...
$(document).ready(function() {
    var long, lat;
    if(navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(function(position) {
        lat = position.coords.latitude;
            long = position.coords.longitude;
            $(".longg").html("long: "+long);
            $(".latt").html("lat: "+lat);
      });
    }
    var api = 'http://api.openweathermap.org/data/2.5/weather?lat='+lat+'&lon='+long+'&appid=e402911b7c3f3ff555036120c4299785';
    $.getJSON(api, function(data) {
        var typeOfWeather = data.weather[0].description;
        var temp = data.main[temp];
        var tempC = ((temp - 32) * 5 / 9).toFixed(2);
        var tempK = (tempC + 273).toFixed(2);
        var windSpeed = data.wind.speed;
        var cityName = data.name;

        $("#place").html(cityName);
        $("#temperature").html(tempC+" C");
        $("#description").html(typeOfWeather);
        var celcius = true;
        $("#temperature").click(function(celcius) {
            if(celcius === true) {
                $("#temperature").html(tempK+" K");
                celcius = false;
            }
            else {
                $("#temperature").html(tempC+" C");
                celcius = true;
            }
        });
    });
});
<div class="container-fluid">
    <h1>Weather app</h1>
    <h3>Made by a Albert Millert</h3>
    <div class="row">
        <div class="btn btn-primary" id="place">Dupa</div>
        <div class="btn btn-info" id="temperature">20 stopni</div>
        <div class="btn btn-danger" id="description">Opis pogody w dupie</div>
        <div class="btn btn-default" id="wiatr">wicher dmie</div>
    </div>
    <div class="latt">gdfdg</div>
    <div class="longg">dgdfd</div>
</div>
that's html file to it
Simon Cordova
@gbsimon87
Oct 11 2016 20:11
@albertmillert are you using chrome?
Sinesaw
@Sinesaw
Oct 11 2016 20:16
Hello to everyone. I just finished tribute and portfolio page (required by FCC),when they will be reviewd?
__mifflin__
@cdrainxv
Oct 11 2016 20:22
@Sinesaw I assume when you have the front end course completely finished... other wise just link your projects and ask for adivce/criticism/ways to improve/etc in any room or the designated Code Review Room.
Sinesaw
@Sinesaw
Oct 11 2016 20:50
@cdrainxv Ok, Thank you for the reply.
CamperBot
@camperbot
Oct 11 2016 20:50
sinesaw sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:cookie: 421 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
Dan-1
@Dan-1
Oct 11 2016 21:13
Is it possible to reference local images in codepen?
kat-mag
@kat-mag
Oct 11 2016 21:24
@Dan-1 no
Dan-1
@Dan-1
Oct 11 2016 21:32
rats
Thanks @kat-mag
CamperBot
@camperbot
Oct 11 2016 21:32
dan-1 sends brownie points to @kat-mag :sparkles: :thumbsup: :sparkles:
:cookie: 361 | @kat-mag |http://www.freecodecamp.com/kat-mag
Dan-1
@Dan-1
Oct 11 2016 21:33
Is it possible to add a black line using <hr> I cant find anything online that works
kat-mag
@kat-mag
Oct 11 2016 21:33
@Dan-1 yep
complex answers streak: 2
just make <hr class="hrline">
set this class to display: block;
and customize as you wish
Dan-1
@Dan-1
Oct 11 2016 21:35
ahhh why display: block?
kat-mag
@kat-mag
Oct 11 2016 21:37
oh, you can do it without
@Dan-1 I just end up doing weird things with hr tags, so I like them on the same line as text sometimes... and you can't do it without changing 'display' prop
never mind me ;D
Dan-1
@Dan-1
Oct 11 2016 21:38
Im trying to use <hr style="color:#000000;width:20%;height:5px">
Unfortunately I cannot change the color or thickness
kat-mag
@kat-mag
Oct 11 2016 21:40
border: none
.hrline {
  background-color: red;
  height: 2px;
  border: none;
}
Dan-1
@Dan-1
Oct 11 2016 21:42
Ahh thank you @kat-mag I got it without Border: none;
CamperBot
@camperbot
Oct 11 2016 21:42
dan-1 sends brownie points to @kat-mag :sparkles: :thumbsup: :sparkles:
:warning: dan-1 already gave kat-mag points
Dan-1
@Dan-1
Oct 11 2016 21:42
What is that supposed to do?
kat-mag
@kat-mag
Oct 11 2016 21:43
because, @Dan-1 why would you use that ugly native border on your hr?
and why the inline style..
Dan-1
@Dan-1
Oct 11 2016 21:46
haha okay I see now. The first project I was working on did inline style so I kinda just kept it going. Should probably start using css right?
Moe Mir
@mmtech90
Oct 11 2016 21:46
hey guys, can someone help me out here. I am on the portfolio challenge and i am unable to get the nav links to align to right correctly as shown in the example
kat-mag
@kat-mag
Oct 11 2016 21:47
@Dan-1 yep, separate CSS is the best way
you gonna have to do this anyways ;p
disjfa
@disjfa
Oct 11 2016 21:48
@mmtech90 check the example on http://getbootstrap.com/components/#navbar
kat-mag
@kat-mag
Oct 11 2016 21:48
@mmtech90 probs because you've put them in separate divs ;o
Dan-1
@Dan-1
Oct 11 2016 21:49
@mmtech90 I used <ul class="nav navbar-nav navbar-right">
<li><button type="button" class="btn btn-default navbar-btn"><a href="#">Home</a></button></li>
<li><button type="button" class="btn btn-default navbar-btn"><a href="">Portfolio</a></button></li>
<li><button type="button" class="btn btn-default navbar-btn"><a href="">Experience</a></button></li>
</ul>
Moe Mir
@mmtech90
Oct 11 2016 21:49
@disjfa @kat-mag thank you! i had the documentation open but was look right past it
CamperBot
@camperbot
Oct 11 2016 21:49
mmtech90 sends brownie points to @disjfa and @kat-mag :sparkles: :thumbsup: :sparkles:
:cookie: 358 | @disjfa |http://www.freecodecamp.com/disjfa
:cookie: 362 | @kat-mag |http://www.freecodecamp.com/kat-mag
kat-mag
@kat-mag
Oct 11 2016 21:50
@mmtech90 and you don't have an opening tag for nav
disjfa
@disjfa
Oct 11 2016 21:50
@mmtech90 and don't include an <a> in a <button> tag. choose one
kat-mag
@kat-mag
Oct 11 2016 21:50
or i'm blind
disjfa
@disjfa
Oct 11 2016 21:50
@mmtech90 and add a class btn btn-whatever instead of type
type is button or submit
Dan-1
@Dan-1
Oct 11 2016 21:52
For these portfolios we can make them look however we like correct?
disjfa
@disjfa
Oct 11 2016 21:52
yes
Moe Mir
@mmtech90
Oct 11 2016 21:52

@disjfa ok will do thanks. I see this being used

<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">

can you help me under stand what this is for?

CamperBot
@camperbot
Oct 11 2016 21:52
:warning: mmtech90 already gave disjfa points
mmtech90 sends brownie points to @disjfa :sparkles: :thumbsup: :sparkles:
disjfa
@disjfa
Oct 11 2016 21:53
toggle on small screens
Moe Mir
@mmtech90
Oct 11 2016 21:54
@kat-mag do i need an nav tag? i was using it before but removed it and used a header tag
kat-mag
@kat-mag
Oct 11 2016 21:54
@mmtech90 you want to write HTML5? new fresh and fancy?
U do nav ;D
disjfa
@disjfa
Oct 11 2016 21:55
And add a role="navigation"
Moe Mir
@mmtech90
Oct 11 2016 21:55
@kat-mag ok so if i use nav do i remove the header tag?
@disjfa role meaning class?
kat-mag
@kat-mag
Oct 11 2016 21:55
not so new, but well... it's a way to write more semantic HTML. So you actually know why this old-div is a navigation bar.
@mmtech90 nav has nothing to do with header tag
disjfa
@disjfa
Oct 11 2016 21:56
is the nav in the header ^_^
kat-mag
@kat-mag
Oct 11 2016 21:56
you can put your nav in the header tag
Moe Mir
@mmtech90
Oct 11 2016 21:56
Ok
ManBearPigg
@ManBearPigg
Oct 11 2016 22:17
I have two divs. The width of each is a percentage. When screen resizes, they resize approporately. Now when I give right div a min-width, the left div jumps to a new line when screen shrinks because it can't maintain it's % width. How do I prevent this div from jumping line?
Simon Cordova
@gbsimon87
Oct 11 2016 22:22
@ManBearPigg do you have a codepen?
ManBearPigg
@ManBearPigg
Oct 11 2016 22:24
@gbsimon87 No there is too much extra data that gets in the way of this simpler question
I can reset the hard coded percent width of the left div with media queries whenever it's about to jump ship, but I was hoping that this was a common problem with a commonly known solution
kat-mag
@kat-mag
Oct 11 2016 22:27
@ManBearPigg display: inline-block; maybe... to try a stupid solution
ManBearPigg
@ManBearPigg
Oct 11 2016 22:32
@kat-mag didn't work thanks though. I'll look into flex box that might work
CamperBot
@camperbot
Oct 11 2016 22:32
manbearpigg sends brownie points to @kat-mag :sparkles: :thumbsup: :sparkles:
:cookie: 364 | @kat-mag |http://www.freecodecamp.com/kat-mag
Simon Cordova
@gbsimon87
Oct 11 2016 22:35
@ManBearPigg I'm not sure if I fully understand it...
Wouldn't the other div always jump when screen size is too small considering the right one has a MIN width?
ManBearPigg
@ManBearPigg
Oct 11 2016 22:37
@gbsimon87 basically I want a scaling left-div while having a right div with min-width
But I have to give it some width somehow
consider this gitter page, you scroll it smaller, the chat shrinks, but the user bar on the right remains the same
I implemented a flexbox and it worked perfectly.
Simon Cordova
@gbsimon87
Oct 11 2016 22:40
True
good job on achieving it!
ManBearPigg
@ManBearPigg
Oct 11 2016 22:45
Thanks for the advice guys
Thanks @gbsimon87
CamperBot
@camperbot
Oct 11 2016 22:45
manbearpigg sends brownie points to @gbsimon87 :sparkles: :thumbsup: :sparkles:
:cookie: 346 | @gbsimon87 |http://www.freecodecamp.com/gbsimon87
Simon Cordova
@gbsimon87
Oct 11 2016 22:46
cheers!
Brandon
@chunb
Oct 11 2016 23:25
For "Show the Local Weather" does the Open Weather API calls work properly? I click the links and it brings up an "invalid" message?
*example links
cayou99
@cayou99
Oct 11 2016 23:29
@chunb I am having issues as well
Brandon
@chunb
Oct 11 2016 23:30
@cayou99 When you click the example link, it brings up an error message?
cayou99
@cayou99
Oct 11 2016 23:45
The example Pen works ok
@chunb ^
I had to disable Https Everywhere
dimasumskoy
@dimasumskoy
Oct 11 2016 23:47
Hello World!
CamperBot
@camperbot
Oct 11 2016 23:47

welcome to FreeCodeCamp @dimasumskoy!