These are chat archives for FreeCodeCamp/HelpFrontEnd

15th
Feb 2016
Alex
@Jeckstex
Feb 15 2016 00:03
@vremerz Try to find a picture on the net, then add the logo to your link. something like this: https://www.keinesorgen.at/fileadmin/img/fb.png
add it as an image.
I think you have other ways of doing it but it's what I did ^^
Greg Duncan
@GregatGit
Feb 15 2016 00:06
@Jeckstex Try getting your button to do something simple when it's pressed like alert("Hi"); and then when you get the alert firing go from there

@Jeckstex I did it this way

$(document).ready(function() {
  $("#newQuote").click(newQuote);
});

newQuote is a function

Alex
@Jeckstex
Feb 15 2016 00:12
@GregatGit I will try this and see how it works out. Thank you for your time :)
CamperBot
@camperbot
Feb 15 2016 00:12
jeckstex sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:star: 353 | @gregatgit | http://www.freecodecamp.com/gregatgit
F1nches
@F1nches
Feb 15 2016 00:17
Anyone here that can help me with the Simon game zipline?
Greg Duncan
@GregatGit
Feb 15 2016 00:19
@Jeckstex I just realised - You have to add jQuery - you added boostrap but no jQuery
Alex
@Jeckstex
Feb 15 2016 00:22
@GregatGit hallelujah! Great it works now! Thanks Greg!
CamperBot
@camperbot
Feb 15 2016 00:22
jeckstex sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:warning: jeckstex already gave gregatgit points
Alex
@Jeckstex
Feb 15 2016 00:22
really was pounding my head on this one ^^
Greg Duncan
@GregatGit
Feb 15 2016 00:23
@Jeckstex you also put <cite classe="well author">
Alex
@Jeckstex
Feb 15 2016 00:27
@GregatGit corrected it! I didn't see that...
Greg Duncan
@GregatGit
Feb 15 2016 00:28
@Jeckstex You can use sublime editior to type in your pens which helps with typos and is generally much quicker
Alex
@Jeckstex
Feb 15 2016 00:30
@GregatGit what is sublime editor? Is it in codepen?
Greg Duncan
@GregatGit
Feb 15 2016 00:32
It's a free download - you can buy it but works fine if you don't https://www.sublimetext.com/3
Alex
@Jeckstex
Feb 15 2016 00:33
Nice! That will be very handy, I often make typos mistakes.
Greg Duncan
@GregatGit
Feb 15 2016 00:33
You have to add Ghost text to your chrome tools - and then just google - how to use sublime with ghost text
Alex
@Jeckstex
Feb 15 2016 00:37
Okay good! It will make things easyer I guess. Thanks again
Susan
@SusanGrattan
Feb 15 2016 00:38
thank you @qualitymanifest I was just using what I learned from the lessons. They should really make a few more lessons on JSON..
CamperBot
@camperbot
Feb 15 2016 00:38
susangrattan sends brownie points to @qualitymanifest :sparkles: :thumbsup: :sparkles:
:star: 963 | @qualitymanifest | http://www.freecodecamp.com/qualitymanifest
Dan Stockham
@DanStockham
Feb 15 2016 00:51
@Jeckstex LOL OMG that avatar is hilarious.
Alex
@Jeckstex
Feb 15 2016 00:56
@DanStockham yup, that's my penguin haha
Francisco Knebel
@FranciscoKnebel
Feb 15 2016 01:20
Hey everyone. Can you give me an opinion on my tictactoe zipline? Thanks (need to implement logic to the AI, at the moment it's just pseudorandom choices, so pretty easy to win, but I think the rest should work. It has all the user stories, but I want it to be at least a little smarter).
http://codepen.io/KyoZeus/pen/BjbyvR
Susan
@SusanGrattan
Feb 15 2016 01:33
@KyoZeus it looks good. I can tell there's no logic though =P and I don't care for the pop-up windows.
Francisco Knebel
@FranciscoKnebel
Feb 15 2016 01:35
@SusanGrattan the alerts are there just for testing, you can see who won with the scoreboard just as easily. Thanks for looking it up :smile:
CamperBot
@camperbot
Feb 15 2016 01:35
kyozeus sends brownie points to @susangrattan :sparkles: :thumbsup: :sparkles:
:star: 325 | @susangrattan | http://www.freecodecamp.com/susangrattan
Shahid Foy
@shahidfoy
Feb 15 2016 01:51
@KyoZeus so far ive won all games against the computer
Dan Stockham
@DanStockham
Feb 15 2016 01:52
@KyoZeus The unbeatable logic is no longer needed anymore: https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Updates-February-11-2015
Francisco Knebel
@FranciscoKnebel
Feb 15 2016 01:52
@shahidfoy yes, I haven't put logic into it just yet, so it should be quite easy.
@DanStockham yeah, I saw that the video and the user stories on nearly all the ziplines are different, but it's no hard thing building something like this.
Dan Stockham
@DanStockham
Feb 15 2016 01:54
@KyoZeus It would save time and you can move on the last project sooner.
@KyoZeus That's what I am doing. Just meet the user stories and get the cert so I can move on to the data visualization and back-end stuff.
Francisco Knebel
@FranciscoKnebel
Feb 15 2016 01:56
@DanStockham All right. Thanks for the hint.
CamperBot
@camperbot
Feb 15 2016 01:56
kyozeus sends brownie points to @danstockham :sparkles: :thumbsup: :sparkles:
:star: 378 | @danstockham | http://www.freecodecamp.com/danstockham
rushi
@rush86999
Feb 15 2016 02:33
need help with code i don't know if i am allowed to do this ```
var calculator1 = Object.create(Calculator);
//jquery for click event to call calculator
$("#clear").click(calculator1.press("clear"));
var calculator1 = Object.create(Calculator);
//jquery for click event to call calculator
$("#clear").click(calculator1.press("clear"));
error in dev console says
Uncaught TypeError: calculator is not a function
Uncaught TypeError: Object.$ is not a function
i don't understand why this is happening?? the calculator is the object is created using
var Calculator = {};
Mackenzie Clark
@xmclark
Feb 15 2016 03:16
@rush86999 are you sure you can do this? $("#clear").click(calculator1.press("clear"));
@rush86999 usually it doesn't want a function with an argument. I always thought it wants just the function handler.
rushi
@rush86999
Feb 15 2016 03:18
@xmclark i just found you are right
my next error is now
press() {
    this.pressed = arguments[0];

    if (this.pressed.length === 1) {
      //it is not a number and it is not a deceimal point and not empty
      if (isNan(this.pressed[0]) && this.pressed[0] != "." && this.pressed[0] != null)
isNan is not defined
i thought i could use arguments[0] to get the string value passed in from click event
Mackenzie Clark
@xmclark
Feb 15 2016 03:19
@rush86999 isNaN(123)
syntax error i think
two capital Ns
rushi
@rush86999
Feb 15 2016 03:19
@xmclark really LOL thanks
CamperBot
@camperbot
Feb 15 2016 03:19
rush86999 sends brownie points to @xmclark :sparkles: :thumbsup: :sparkles:
:star: 119 | @xmclark | http://www.freecodecamp.com/xmclark
rushi
@rush86999
Feb 15 2016 03:22
now i just have to figure out why concatenation doesn’t work
h4r1m4u
@h4r1m4u
Feb 15 2016 03:23

@h4r1m4u Okay so how do you get the alert dialog to to prompt while the page is loading.?

@ExhibitArts a) did you import the alertify.min.js library into your project? b) if yes, this should work:

$( document ).ready(function() {
  alertify.alert("Your message");
});
Casey Heath
@ExhibitArts
Feb 15 2016 03:30
@h4r1m4u How can you make it automatically call the alert dialog on page load?
h4r1m4u
@h4r1m4u
Feb 15 2016 03:30
@ExhibitArts the doc.ready function will do it
Casey Heath
@ExhibitArts
Feb 15 2016 03:31
It's not working.
:(
h4r1m4u
@h4r1m4u
Feb 15 2016 03:31
do you have it in codepen?
Casey Heath
@ExhibitArts
Feb 15 2016 03:32
This message was deleted
Bruce Young
@mutantspore
Feb 15 2016 03:32
and jQuery loaded
Casey Heath
@ExhibitArts
Feb 15 2016 03:32
@h4r1m4u yeah
h4r1m4u
@h4r1m4u
Feb 15 2016 03:32
could you link it here?
h4r1m4u
@h4r1m4u
Feb 15 2016 03:39

@ExhibitArts

  <link type="text/css" rel="stylesheet" href="main.css">
  <link type="text/css" rel="stylesheet" href="css/responsive.css" />
  <link type="text/css" rel="stylesheet" href="alertify/alertify.core.css" />
  <link type="text/css" rel="stylesheet" href="alertify/alertify.default.css" />
  <script type="text/javasript" href="alertify/alertify.min.js"></script>

none of these file are going to load - given the href, you're linking them to be loaded from codepen, but codepen doesn't include those files. you'll first need to host these files somewhere on the web where you can import them from

(dropbox works for that, among others)
Casey Heath
@ExhibitArts
Feb 15 2016 03:40
@h4r1m4u Ok. Hold on.
Casey Heath
@ExhibitArts
Feb 15 2016 03:47
@ExhibitArts Here it is with all the links. - http://codepen.io/ExhibitArts/pen/dGrYGJ
Bruce Young
@mutantspore
Feb 15 2016 03:51
http://codepen.io/MutantSpore/pen/dGrYpd?editors=1010
the js for your alert has to be after the jquery load.
i put the loading of the js stuff in the codePen JS cog
@ExhibitArts
Casey Heath
@ExhibitArts
Feb 15 2016 04:00
@mutantspore What exactly do I do with this. Should I put it in between a script tag and putthe script tag in the head? $( document ).ready(function() {
alertify.alert("Your message");
});
Pradeep CE
@cepradeep
Feb 15 2016 04:02
@ExhibitArts If you're doing this codepen, just put it in the JS box on the right.
Casey Heath
@ExhibitArts
Feb 15 2016 04:07
@pradeepce I'm trying to apply it to my html file. It seems to work on Codepen but how should I apply it to make it work on my website.
Bruce Young
@mutantspore
Feb 15 2016 04:09
@ExhibitArts loading of JS components should be done at the bottom of the HTML document just before the closing body tag. Also you should put the jS code you are intending to write in a .js file and load that last after the other js components..
@ExhibitArts CSS stuff is loaded in the head as you have
h4r1m4u
@h4r1m4u
Feb 15 2016 04:10

@ExhibitArts here's a working fork: http://codepen.io/pixelninjame/pen/rxROwj

i
a) moved all your import into the CSS and JS resource settings section of the pen (which is the proper way to do it on codepen)
b) the hosting of the alertify files from your server doesn't work properly. i imported them from the alertify github page directly instead
c) i moved the doc.ready and the JS code into the JS code pane (which is the proper way to do it on codepen)

Bruce Young
@mutantspore
Feb 15 2016 04:10
try not to mix html/css/js in the html file as it makes it harder to debug
h4r1m4u
@h4r1m4u
Feb 15 2016 04:11
@ExhibitArts let me know when you've forked my pen so that i can delete it
Casey Heath
@ExhibitArts
Feb 15 2016 04:12
@h4r1m4u Forked.
h4r1m4u
@h4r1m4u
Feb 15 2016 04:12
thanks
Pradeep CE
@cepradeep
Feb 15 2016 04:21

@ExhibitArts To add it to your site, you can put it in a <script> tag in the <head>.
You can also put it in a .js file (for example myscript.js and include it in your HTML with something like

<script src="myscript.js"></script>

Remember that the value of the src is the path to your script relative to your html file. Here, I assume both files are in the same folder.

Casey Heath
@ExhibitArts
Feb 15 2016 04:26

@pradeepce I still can't get it to work. - <html lang="en-US">

<head>
<title>Colin Flaherty - White Girl Bleed A Lot | Home</title>
<link type="text/css" rel="stylesheet" href="main.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link type="text/css" rel="stylesheet" href="css/responsive.css" />
<link type="text/css" rel="stylesheet" href="alertify/alertify.core.css" />
<link type="text/css" rel="stylesheet" href="alertify/alertify.default.css" />
</head>

<body>
<!-- Top Header Quote Area -->
<div class="body-container">

<div class="top_header-container">
  <h6 class="wgbalot-header">"White Girl <br>Bleed A Lot" <em>- Colin Flaherty</em></h6>
  <img class="wgbalot-bookcover" alt="bookcover" src="http://colinflaherty-websitedesign.byethost8.com/images/wgbalot-cover.jpg" />
  <img class="agold-seller" alt="number1book" src="http://colinflaherty-websitedesign.byethost8.com/images/agold-seller.png" />
  <span class="onebook">#1 Best Seller <br>on Amazon</span>
  <div class="quote_wrapper">
    <h1 class="wgbalot_quote-text">"White Girl Bleed A Lot"</h1>
    <strong class="quoteAllenWest">"At least author Colin Flaherty is tackling this issue</strong>
    <p class="quoteAllenWest-br">(of racial violence in his new book, White Girl Bleed a Lot: The
      <br>Return of Racial Violence To America and How The Media Ignores It."</p>
    <strong class="AllenWest">- Allen West</strong>
  </div>
</div>
<!-- Top Nav -->
<div class="topnav_container">
  <img class="stackedbars" src="images/3bars.png" />
  <a class="wgbalot_navlink">"White Girl Bleed A Lot"</a>
</div>
<!-- Newest Video -->
<div class="contentvideo_container">
  <iframe class="iframe" width="100%" height="400" src="https://www.youtube.com/embed/Xeu2zIHSABM" frameborder="0" allowfullscreen></iframe>
</div>
<div class="desctil_container">
  <h1 class="newvid-title">
        <span class="watch_title">Black Violence As Crazy as It Gets</span>
    </h1>
  <p class="newvid-desc_container">
    <span class="watch-desc">Colin Flaherty is an award winning reporter and author of the #1 best selling book 'Don't Make the Black Kids Angry: The hoax of black victimization and those who enable it'. His work has 
        appeared in more than 1000 news sites around the world, including the New York Times, Washington Post, Los Angeles Times, Time Magazine. His story about how a black man was unjustly convicted of trying to kill his white girlfriend resulted in his release from state prison and was featured on Court TV, NPR, The Los Angeles Times and San Diego Union-Tribune.
        </span>
  </p>
</div>
<!-- Top 10 -->
<div class="top10_container">
  <div id="title10_wrapper"></div>
  <p id="li-title_top10">Top 10 Black Mob Violence Videos</p>
  <p id="li-10paragraph">Watch Colin Flaherty's 'Top 200 Black Mob Violence Videos' and discover the truth <br>behind black on white violence.</p>
  <ul class="top10" style="list-style-type: none;">
    <a href="https://www.youtube.com/watch?v=kSpSn14Dwrw">
      <li id="li-blkmob1"><em>#1:</em> Black Mob at Detroit Gas Station</li>
    </a>
  </ul>
</div>
<div class="background-wrapper"></div>

</div>
<script src="alertify/alertify.min.js"></script>
<script src="js/alertify.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
</body>
</html>

Could you put the script tags were they need to go. I can't get it to work on my site.
Bruce Young
@mutantspore
Feb 15 2016 04:29
@ExhibitArts jquery has to be loaded before the other JS files
asd then your js after the last of what i added there
h4r1m4u
@h4r1m4u
Feb 15 2016 04:31
@ExhibitArts just curious, any reason you're not using the working version i gave you?
Bruce Young
@mutantspore
Feb 15 2016 04:32
he wants it for a local implementation
@h4r1m4u
h4r1m4u
@h4r1m4u
Feb 15 2016 04:32
ah, ok
Casey Heath
@ExhibitArts
Feb 15 2016 04:34
omg how hard can this be.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="alertify/alertify.min.js"></script>
<script src="js/alertify.min.js"></script>
Rafael J. Rodriguez
@Rafase282
Feb 15 2016 04:35
oh this room exists!
Bruce Young
@mutantspore
Feb 15 2016 04:35
@ExhibitArts yes and then put your own JS last
Rafael J. Rodriguez
@Rafase282
Feb 15 2016 04:35
hi @mutantspore
Bruce Young
@mutantspore
Feb 15 2016 04:35
@Rafase282 :) hi there
Rafael J. Rodriguez
@Rafase282
Feb 15 2016 04:36
this room was under the radar, cant remember why it was not on my list
Casey Heath
@ExhibitArts
Feb 15 2016 04:36
@mutantspore Can I share my screen?
Rafael J. Rodriguez
@Rafase282
Feb 15 2016 04:36
either way, people, any comments? http://codepen.io/Rafase282/full/pgYjbJ/
Kevin Mulligan
@kmulligan
Feb 15 2016 04:36
I am running into problems inserting the result of a function into a Twitter Share This (https://dev.twitter.com/web/tweet-button/javascript-create).. can someone help me troubleshoot?
Bruce Young
@mutantspore
Feb 15 2016 04:36
lots of new rooms to fit the new naming system
Sloth
@RMo-Sloth
Feb 15 2016 04:38
Hey I finished my "Build a tribute page"-challenge. I would love to get some pointers on it. Also there is an issue where the white space on the right side of the screen gets bigger than that on the left, when you resize the screen. Anyone has an idea what causes this? http://codepen.io/RobMo/pen/yewyXp
Johnathan Brown
@Legend28469
Feb 15 2016 04:38
@Rafase282 does it work right now?
Rafael J. Rodriguez
@Rafase282
Feb 15 2016 04:38
no, just started working on it
Pradeep CE
@cepradeep
Feb 15 2016 04:38

@ExhibitArts

<head>
<title>Colin Flaherty - White Girl Bleed A Lot | Home</title>
<!-- All the CSS you've loaded -->

<script>
  // This is where you put your Javascript.
// For example
$( document ).ready(function() {
  alertify.alert("Your message");
});
</script> <!-- remember to close script -->

<!-- If you want to load an external Javascript file, put it in a separate script tag -->
<script src="myscript.js"></script>
<!-- For each file, you need a separate script tag -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>

</head>

<body>
<!-- and the rest of your html -->

Did that help?

Rafael J. Rodriguez
@Rafase282
Feb 15 2016 04:39
@Legend28469 the back end works, just creating the front end and then will connect it
Johnathan Brown
@Legend28469
Feb 15 2016 04:39
Looks awesome
Can’t wait to use it
Rafael J. Rodriguez
@Rafase282
Feb 15 2016 04:40
thanks
how far are you on teh curriculum?
Johnathan Brown
@Legend28469
Feb 15 2016 04:42
Near the end of front end
Rafael J. Rodriguez
@Rafase282
Feb 15 2016 04:43
I could use help but I was thinking about using react
Johnathan Brown
@Legend28469
Feb 15 2016 04:44
Oh. Sorry. Would if I could though :thumbsup:
Rafael J. Rodriguez
@Rafase282
Feb 15 2016 04:46
still debating
if i use jade then I cant use react or it will make it harder to be more accurte
rushi
@rush86999
Feb 15 2016 04:49
anybody know why this doesn’t work i am trying to pass a number or a “.” point in the if function
else if (!(isNaN(this.pressed) || (this.pressed == ".")
decimal point
Rafael J. Rodriguez
@Rafase282
Feb 15 2016 04:51
what are you getting?
and what is the example
seems like the logic says if is a number or a dot
for which you coudl use typeof this.pressed == 'number'
Casey Heath
@ExhibitArts
Feb 15 2016 04:55
This message was deleted
@pradeepce Thanks!
CamperBot
@camperbot
Feb 15 2016 04:55
exhibitarts sends brownie points to @pradeepce :sparkles: :thumbsup: :sparkles:
:star: 329 | @pradeepce | http://www.freecodecamp.com/pradeepce
Casey Heath
@ExhibitArts
Feb 15 2016 04:55
@mutantspore Thanks!
CamperBot
@camperbot
Feb 15 2016 04:55
exhibitarts sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1124 | @mutantspore | http://www.freecodecamp.com/mutantspore
Casey Heath
@ExhibitArts
Feb 15 2016 04:56
@h4r1m4u Thanks!
CamperBot
@camperbot
Feb 15 2016 04:56
exhibitarts sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1399 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
Pradeep CE
@cepradeep
Feb 15 2016 04:56
@ExhibitArts Glad :)
Sloth
@RMo-Sloth
Feb 15 2016 05:09
Hey I finished my "Build a tribute page"-challenge. I would love to get some pointers on it. Also there is an issue where the white space on the right side of the screen gets bigger than that on the left, when you resize the screen. Anyone has an idea what causes this? http://codepen.io/RobMo/pen/yewyXp
Taurus Colvin
@colvint
Feb 15 2016 05:16
@Rafase282 suggest you use react and not worry about jade
Rafael J. Rodriguez
@Rafase282
Feb 15 2016 05:17
yeah I was talking about that yonteh backend room, no omuch room for jade with what I have in mind
Taurus Colvin
@colvint
Feb 15 2016 05:17
yeah, react is the future — jade not so much
jade looks pretty but doesn’t buy you much more than that
react gives you a lot of value in the long run
rushi
@rush86999
Feb 15 2016 05:20
@Rafase282 this is passing a decimal point or number from a button in calculator object
Rafael J. Rodriguez
@Rafase282
Feb 15 2016 05:21
@RobMo what challenge is that? is it somethign new?
rushi
@rush86999
Feb 15 2016 05:21
line 237 code
Sloth
@RMo-Sloth
Feb 15 2016 05:23
@Rafase282 It s the "build a tribute page*"-one
Rafael J. Rodriguez
@Rafase282
Feb 15 2016 05:24
that's so easy, if you completed the previous challenges that is
but yours look fine @RobMo
Bruce Young
@mutantspore
Feb 15 2016 05:24
you don’t have to if you’ve done the camper news…which they are taking away
Rafael J. Rodriguez
@Rafase282
Feb 15 2016 05:24
i did that way, this new one was mared as done
Bruce Young
@mutantspore
Feb 15 2016 05:25
you’ll find it’s “ticked” off already for you
Sloth
@RMo-Sloth
Feb 15 2016 05:26
@Rafase282 Hmm I just want to figure out why the white areas sizes change. That s the main thing I wanna learn out of it ;).
Rafael J. Rodriguez
@Rafase282
Feb 15 2016 05:32
you should remove the foot notes or complete them @RobMo
Casey Heath
@ExhibitArts
Feb 15 2016 05:32
Is there something wrong with my viewport code? I'm testing my website http://colinflaherty-websitedesign.byethost8.com/?ckattempt=1 on mobile and it only fills like 30% of the screen.
I'm using the iPhone 4
This I my viewport that I'm talking about. - <meta name="viewport" content="width=device-width, initial-scale=1.0">
Taurus Colvin
@colvint
Feb 15 2016 05:34
err, i feel a ban coming on...
Rafael J. Rodriguez
@Rafase282
Feb 15 2016 05:35
I hope not
Democrat and Republicans are not the only parties
;-)
Sloth
@RMo-Sloth
Feb 15 2016 05:44
@Rafase282 so the col-xs-offset-1 turn both columns on the side into margins?
Taurus Colvin
@colvint
Feb 15 2016 05:52
@RobMo col-xs-offset-1 is a bootstrap class which essentially adds 1 empty column at the left edge of the row you place it in
so, in a sense it’s adds a left “margin”
Sloth
@RMo-Sloth
Feb 15 2016 05:57
@colvint not on the right as well? I had issues with resizing and changing sizes of the whitespace on the right. After Rafaze282 added the col-xs-offset-1 the issue was fixed. Before that I had a div before and after it with col-xs-1 (which didn t work right)
Taurus Colvin
@colvint
Feb 15 2016 05:58
oh sure, you can add another on the right — ya
Sloth
@RMo-Sloth
Feb 15 2016 06:00
@Rafase282 @colvint thx both of you ;)
CamperBot
@camperbot
Feb 15 2016 06:00
robmo sends brownie points to @rafase282 and @colvint :sparkles: :thumbsup: :sparkles:
:star: 976 | @rafase282 | http://www.freecodecamp.com/rafase282
:star: 45 | @colvint | http://www.freecodecamp.com/colvint
Casey Heath
@ExhibitArts
Feb 15 2016 06:22
How do you call the 'Persistent' alertify log?
$( document ).ready(function() {
alertify.log("This site was developed by Exhibit Arts - Casey Heath");
});
h4r1m4u
@h4r1m4u
Feb 15 2016 06:40
@ExhibitArts try
$( document ).ready(function() {
alertify.log("This site was developed by Exhibit Arts - Casey Heath", "", 0);
});
Casey Heath
@ExhibitArts
Feb 15 2016 06:42
@h4r1m4u Thanks that worked.
CamperBot
@camperbot
Feb 15 2016 06:42
exhibitarts sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1400 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 15 2016 06:42
np
Nisha Shlaymoon
@leaguelism
Feb 15 2016 07:30
Hey guys, I noticed after I finished my tribute page, the sample tribute page was done by pure html and bootstrap. Is using pure bootstrap good practice or bad practice?
Joseph Morse
@jnmorse
Feb 15 2016 07:37
@leaguelism Its really up to you. You don't have to use bootstrap, write your own CSS, use a completely different CSS framework, custormize a said framework, or just use it as is.
Jonathan
@jxvo92
Feb 15 2016 07:52
Hey what's a good resource for weather background images?
Also, how can I find out exactly how many different weather images I will need through a weather api?
Neeraj Lad
@neeraj-lad
Feb 15 2016 08:00
@jxvo92 try pixabay for images
h4r1m4u
@h4r1m4u
Feb 15 2016 08:00
or unsplash.com
Neeraj Lad
@neeraj-lad
Feb 15 2016 08:00
@jxvo92 as for the number of images, its upto you. Eg snowy, sunny, rainy, foggy should cover most cases.
Jonathan
@jxvo92
Feb 15 2016 08:05
@leaguelism i think for personal tasks like a tribute page it's fine. but for bigger projects, imo, it comes off as a rush job
@neeraj-lad @h4r1m4u how can I find out how many weather states an api provides data for?
i know a few would cover most cases. but I want to make the images as diverse as possible
h4r1m4u
@h4r1m4u
Feb 15 2016 08:10
@jxvo92 hopefully, the API documentation.
if you're using the openweather API, i personally found that there were way too many possible weather states and thus decided to implement the changing background image based on the temperature, rather than the weather as such
Neeraj Lad
@neeraj-lad
Feb 15 2016 08:10
@jxvo92 haha.. sorry no idea. One trick you might use is, get lat & lon of different cities in the world having different climates, and see what values you get with the api call.
@jxvo92 @h4r1m4u did you guys face Mixed Content Issues while accessing the open weather api?
h4r1m4u
@h4r1m4u
Feb 15 2016 08:15
@neeraj-lad nope. if i'm right in thinking what you're referring to, make sure that you're using the same protocol for both your codepen and the API. in other words, if you accessing the API with http://, make sure you're accessing your codepen with http:// as well. if you're using https://, use it for both as well (if supported by the API)
Neeraj Lad
@neeraj-lad
Feb 15 2016 08:16
@h4r1m4u I am accessing codepen using http, and the api is in http too.
But codepen internally generate a new link https://s.codepen.com/...., which is causing this issue
@h4r1m4u didn't you face the same problem?
h4r1m4u
@h4r1m4u
Feb 15 2016 08:17
do you have a link to your codepen?
Jonathan
@jxvo92
Feb 15 2016 08:17
@h4r1m4u @neeraj-lad thanks for the help. i'm looking into icon sets and am seeing about 200+ weather variations. no way i'm searching for that many bg-images lol. i think i'm going to go with like 15-20 images. does that sound like a magic number to ya?
CamperBot
@camperbot
Feb 15 2016 08:17
jxvo92 sends brownie points to @h4r1m4u and @neeraj-lad :sparkles: :thumbsup: :sparkles:
:star: 1401 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
:star: 294 | @neeraj-lad | http://www.freecodecamp.com/neeraj-lad
h4r1m4u
@h4r1m4u
Feb 15 2016 08:18
@jxvo92 entirely up to you how complex you want to make it. i think i used 5 or 6 at max
Neeraj Lad
@neeraj-lad
Feb 15 2016 08:19
@jxvo92 15 seems a lot! I personally would only add 5 atmost. But then its upto you in the end.
Jonathan
@jxvo92
Feb 15 2016 08:19
@neeraj-lad actually, i haven't even started coding yet. i'm just gathering resources first so i don't have to waste time doing that later.
Neeraj Lad
@neeraj-lad
Feb 15 2016 08:20
@jxvo92 I am currently doing the same project. You can see the above pen.
h4r1m4u
@h4r1m4u
Feb 15 2016 08:22
@neeraj-lad no, i didn't have that issue. i'm having difficulties troubleshooting your pen as my browser doesn't like the geolocation. that said, if i remove the geolocation block and insert the lat and lon manually, i get the weather fine
so i'm assuming the issue is with the geolocation function itself
kirbyedy
@kirbyedy
Feb 15 2016 08:24
@neeraj-lad it shows that is 30c here where I live, but is not really :D
Jonathan
@jxvo92
Feb 15 2016 08:24
@kirbyedy seems to be the default value
Neeraj Lad
@neeraj-lad
Feb 15 2016 08:24
@h4r1m4u geolocation gets my lat & lon correctly. The problem seems to be due to the http request.
Jonathan
@jxvo92
Feb 15 2016 08:24
checked my chrome console, i'm getting the same Mixed Content Error
h4r1m4u
@h4r1m4u
Feb 15 2016 08:25
that's strange. i don't have that problem when i remove the geolocation function
Jonathan
@jxvo92
Feb 15 2016 08:25
'Mixed Content: The page at 'https://s.codepen.io/arialblack14/fullembedgrid/rxpYJp?type=embed&animations=run' was loaded over HTTPS, but requested an insecure script 'http://api.openweathermap.org/data/2.5/weather?lat=41.3212912&lon=-72.92833…s=metric&callback=jQuery21305472092777490616_1455500906528&_=1455500906529'. This request has been blocked; the content must be served over HTTPS.'
h4r1m4u
@h4r1m4u
Feb 15 2016 08:26
@neeraj-lad are you sure that you're accessing the codepen in your browser at http://codepen.io/neeraj-lad/pen/dGadyX/ and not https://codepen.io/neeraj-lad/pen/dGadyX/?
Jonathan
@jxvo92
Feb 15 2016 08:27
@h4r1m4u @neeraj-lad actually opening the pen in a new tab made it work for me
Neeraj Lad
@neeraj-lad
Feb 15 2016 08:28
@h4r1m4u yes.. but the issue is due to the /s.codepen.io/.. link
Mixed Content: The page at 'https://s.codepen.io/neeraj-lad/fullpage/dGadyX?' was loaded over HTTPS, but requested an insecure script 'http://api.openweathermap.org/data/2.5/weather?callback=jQuery2130792804101…2002&lon=73.0437446&APPID=44db6a862fba0b067b1930da0d769e98&_=1455524804055'. This request has been blocked; the content must be served over HTTPS.
Jonathan
@jxvo92
Feb 15 2016 08:28
only thing not working is the temperature. still showing default value 30c
Neeraj Lad
@neeraj-lad
Feb 15 2016 08:29
@jxvo92 yeah.. I didn't add code for that. Do you see your location correctly?
Jonathan
@jxvo92
Feb 15 2016 08:29
it's actually -17c over here lol
i'm getting location: New Haven, CT + Sky is Clear + 0.96 meter/sec @neeraj-lad
h4r1m4u
@h4r1m4u
Feb 15 2016 08:31
@neeraj-lad i'm still fairly certain that in your browser URL bar you're using https:// instead of just http://
which is what's giving you the mixed content error
Jonathan
@jxvo92
Feb 15 2016 08:32
CTRL/CMD + Click to open your pen link in a new tab. that's how i got it working for me. doesn't seem to be working through gitter preview tho
Neeraj Lad
@neeraj-lad
Feb 15 2016 08:34
@h4r1m4u @jxvo92 Got the issue at last!
Casey Heath
@ExhibitArts
Feb 15 2016 08:35
anyone know of some good free open source text editors
Neeraj Lad
@neeraj-lad
Feb 15 2016 08:35
I had https everywhere extension installed on my browser. It might be changing http to https. So so silly of me!
Thanks for your help @h4r1m4u @jxvo92
CamperBot
@camperbot
Feb 15 2016 08:35
neeraj-lad sends brownie points to @h4r1m4u and @jxvo92 :sparkles: :thumbsup: :sparkles:
:star: 1402 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
:star: 278 | @jxvo92 | http://www.freecodecamp.com/jxvo92
Neeraj Lad
@neeraj-lad
Feb 15 2016 08:35
:D
h4r1m4u
@h4r1m4u
Feb 15 2016 08:35
ah, glad you sorted it out :)
Neeraj Lad
@neeraj-lad
Feb 15 2016 08:36
@ExhibitArts try brackets.. it is open source, though Adobe owns it.
h4r1m4u
@h4r1m4u
Feb 15 2016 08:37
@ExhibitArts are you after free? or open source? if the former, atom or sublime text are widely used
Adam Camacho
@Adancode
Feb 15 2016 08:43

@Adancode
Guys, I'm still working on the Wikipedia Viewer (been at it about two weeks now), I'm getting farther, but I get an error. This is the code I have so far: $(document).ready(function() {
$("#searchMe").click(function() {
searchTerm = $('#typeMe').val();
getJSON(searchTerm);
});
}); // Closes JQUERY Document

var searchTerm;
var url;

function getJSON(searchTerm) {
url = 'http://en.wikipedia.org/w/api.php?action=parse&page=' + searchTerm + '&prop=text&format=json'; //&callback=?'
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) {
console.log(xhr.readyState);
console.log(xhr.responseText); document.getElementById('wikiInfo').innerHTML = xhr.responseText;
console.log(searchTerm);//xhr.responseText;
}
};
xhr.open('GET', url);
xhr.send();
}
And this is the error: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

Any tips?
h4r1m4u
@h4r1m4u
Feb 15 2016 08:45
@Adancode any reason why you're writing the getJSON function in vanilla JS? why not use the jQuery getJSON method since you're already using jQuery anyway?
Adam Camacho
@Adancode
Feb 15 2016 08:46
Because I used the JSON function for the last two weeks and no one could help me get it to work, even a developer here in town.
So I figured I'd try vanilla JavaScript.
h4r1m4u
@h4r1m4u
Feb 15 2016 08:46
ok. do you have it in codepen? i'll make it work for you in two minutes
Adam Camacho
@Adancode
Feb 15 2016 08:47
The JSON one, yes, also this one.
Gimme a sec, I have like 10 versions, haha
h4r1m4u
@h4r1m4u
Feb 15 2016 08:47
sure
Adam Camacho
@Adancode
Feb 15 2016 08:48
HOLY SHIT
I figured it out.
My bad, the language, so sorry!
Wow...
Thanks, @h4r1m4u !!! Dude, you made my day!!!
CamperBot
@camperbot
Feb 15 2016 08:49
adancode sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1403 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 15 2016 08:49
nothing like figuring it out yourself :)
nice work
Adam Camacho
@Adancode
Feb 15 2016 08:50
I had solved an issue on this one, the javascript version, but thought it had nothing to do with the JSON version, well, since you suggested I pull up the JSON version, I did, and then before I was going to send it to you, I noticed that one little issue, and I fixed it real quick and on a whim, loaded a search query, and it worked!
For anyone in the future looking at this, don't use input type submit for the search button, use input type button...two weeks I've lost...
Thanks so much, man!!!
h4r1m4u
@h4r1m4u
Feb 15 2016 08:51
ah. the submit button was reloading your page, was it? :)
Adam Camacho
@Adancode
Feb 15 2016 08:52
EXACTLY
But i didn't even realize it. Until I broke down where the issue lay.
Piece by piece.
h4r1m4u
@h4r1m4u
Feb 15 2016 08:52
nice! yeah, i've seen the same issue with other people's ziplines. you're not alone :)
Adam Camacho
@Adancode
Feb 15 2016 08:53
Man...I feel catharsis...
h4r1m4u
@h4r1m4u
Feb 15 2016 08:53
two weeks not lost. knowledge gained ;)
Adam Camacho
@Adancode
Feb 15 2016 08:53
Yeah...I'll never forget it, that's for sure. Thanks again, man...wow...
h4r1m4u
@h4r1m4u
Feb 15 2016 08:54
my pleasure
wyattelliott
@wyattwade
Feb 15 2016 09:10
Yo!
Mooli
@Mooli88
Feb 15 2016 09:49
hello ! im about to start Build a Tribute Page
and im not sure if im allowed to use css or not
kirbyedy
@kirbyedy
Feb 15 2016 09:51
@Mooli88 you can use whatever you want
Mooli
@Mooli88
Feb 15 2016 09:54
cool thanks
Casey Heath
@ExhibitArts
Feb 15 2016 10:03
Check out my logo design. Tell me what you think. - https://www.youtube.com/watch?v=k3THvhg9jBo
J Sanderson
@J-Sanderson
Feb 15 2016 10:03
Hmm, they changed the front end stuff while I was working through it! Now trying to decide what to do with my tribute page. Does it have to specifically be about a person?
kirbyedy
@kirbyedy
Feb 15 2016 10:08
I dont think so, but it would be nice
Salman Shahid
@salman-shahid
Feb 15 2016 10:24
For my open weather app, any ideas on why I get error "Use post method"? https://jsfiddle.net/himynameissal/2p3jzjxh/
In console
Salman Shahid
@salman-shahid
Feb 15 2016 10:53
I tried using a different method of retrieving data but I still have some of problem with jQuery. Here is a screencap of my console: https://www.dropbox.com/s/7in5f5nr8gr5wyz/Screenshot%202016-02-15%2020.52.50.png?dl=0
kirbyedy
@kirbyedy
Feb 15 2016 10:56
Screen Shot 2016-02-15 at 12.55.30.png
i get this
h4r1m4u
@h4r1m4u
Feb 15 2016 10:56
@mynameissal you have the jsfiddle open with https:// in the URL bar, but the API is using http://. this is what's giving you the mixed content error. it seems that jsfiddle automatically redirects to https://, so you'll have to try if the API supports https:// and use that in the API URL instead. if not, use a different service (not jsfiddle)
Salman Shahid
@salman-shahid
Feb 15 2016 10:58
@h4r1m4u Ok, thanks :)
CamperBot
@camperbot
Feb 15 2016 10:58
mynameissal sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1404 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 15 2016 10:58
np
Salman Shahid
@salman-shahid
Feb 15 2016 11:00
I wish I looked up the error on google..I thought it was something I wouldn't find info on because I thought it was API specific..Thanks again!
h4r1m4u
@h4r1m4u
Feb 15 2016 11:01
you betcha. if you use codepen, it happens there too, but codepen doesn't force you to use https:// in your URL bar, so it's easy to fix it there
just for future reference
Ankit Panwar
@coderNoob
Feb 15 2016 11:17

For some reason in my boardFull method if I call it by reference like console.log(boardFull), the entire method is printed on the screen. If I call it like console.log(boardFull());, I get Uncaught RangeError: Maximum call stack size exceeded error. Why?
Here is the method

function boardFull() {
  var count = 0;
  for (var i = 0; i < 9; i++) {
    if ($("#b" + i).hasClass("clicked"))
      count++;
  }
  if (count == 9)
    return true;
  else
    return false;
};

I've checked and it does return true only if all the boxes are full.

Salman Shahid
@salman-shahid
Feb 15 2016 11:19
You're missing {} brackets for your if and else statements
@h4r1m4u I get another error now (using codepen - I am using http) http://codepen.io/himynameissal/pen/LGaRMP that I don't understand. Do you have any ideas?
Ankit Panwar
@coderNoob
Feb 15 2016 11:24
@mynameissal You don't need {} if your if else statements have only a single statement.
Salman Shahid
@salman-shahid
Feb 15 2016 11:24
I see
Thanks :D
kirbyedy
@kirbyedy
Feb 15 2016 11:24
@mynameissal when I click on the link, it throws me an error
Salman Shahid
@salman-shahid
Feb 15 2016 11:25
Yep..I'm trying to find out why I get the error. It's related to my js script that is trying to retrieve data from an api.
kirbyedy
@kirbyedy
Feb 15 2016 11:30
well i guess its coming from this lines error: function(e) { alert('error'); console.log("error:" + e);
which means your code does not retrieves the location, so ends up throwing the error
Salman Shahid
@salman-shahid
Feb 15 2016 11:31
Yes..my URL is incorrect..
Thanks @kirbyedy
CamperBot
@camperbot
Feb 15 2016 11:31
mynameissal sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star: 469 | @kirbyedy | http://www.freecodecamp.com/kirbyedy
h4r1m4u
@h4r1m4u
Feb 15 2016 11:36

@mynameissal you need to change the API URL to this:

 var url = "http://api.openweathermap.org/data/2.5/weather?callback=?&lat=" + lat + "&lon=" + long + "&appid=" + a;

a) the API doesn't support https, you need to use http
b) adding the callback=? parameter into it changes the request to JSONP instead of plain JSON which gets you around the cross-domain request issue. if you're not familiar with JSONP and why/how it works, the wikipedia article is a decent intro: https://en.wikipedia.org/wiki/JSONP

Salman Shahid
@salman-shahid
Feb 15 2016 11:38
@h4r1m4u Thanks, I will read up now.
CamperBot
@camperbot
Feb 15 2016 11:38
mynameissal sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:warning: mynameissal already gave h4r1m4u points
h4r1m4u
@h4r1m4u
Feb 15 2016 11:38
yw
J Sanderson
@J-Sanderson
Feb 15 2016 11:57
Hi, having some issues with CSS gradients, they keep on repeating rather than stretching down the whole page. Anyone know why? It's just a random one that I pasted in to test. http://codepen.io/jsanderson/pen/WrPxWo
Salman Shahid
@salman-shahid
Feb 15 2016 12:00
J Sanderson
@J-Sanderson
Feb 15 2016 12:04
ooh, thankyou! I kept trying to find stuff, had no luck. Thanks!
Ankit Panwar
@coderNoob
Feb 15 2016 12:09

@h4r1m4u
For some reason in my boardFull method if I call it by reference like console.log(boardFull), the entire method is printed on the screen. If I call it like console.log(boardFull());, I get Uncaught RangeError: Maximum call stack size exceeded error. Why?
Here is the method

function boardFull() {
  var count = 0;
  for (var i = 0; i < 9; i++) {
    if ($("#b" + i).hasClass("clicked"))
      count++;
  }
  if (count == 9)
    return true;
  else
    return false;
};

I've checked and it does return true only if all the boxes are full.

h4r1m4u
@h4r1m4u
Feb 15 2016 12:12
@coderNoob the function itself looks ok to me. it must be something else
Ankit Panwar
@coderNoob
Feb 15 2016 12:15

@h4r1m4u This is my miniMax method

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

  if (boardFull() || scoreGame) {
    console.log(scoreGame);
    return [scoreGame, pos];
  }

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

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

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

In the first if loop, if I call the boardFull, it doesn't execute rest of the code and it gets terminated at the if loop. If I call it like boardFull(), I get the error Uncaught RangeError: Maximum call stack size exceeded.

Mooli
@Mooli88
Feb 15 2016 12:19
hi. i've finished with Build a Tribute Page
how can i include a code to my codepen ?
h4r1m4u
@h4r1m4u
Feb 15 2016 12:19
@coderNoob my best guess is that somehow the recursion of the minimax runs indefinitely and never stops.
so eventually the browser throws the stack exceeded error
Ankit Panwar
@coderNoob
Feb 15 2016 12:20
@h4r1m4u Hmm. Also, if I wait and then click the next box and so on up-to 4 boxes, the error goes away.
but it is useless this way.
h4r1m4u
@h4r1m4u
Feb 15 2016 12:21
try to investigate the recursion and make sure that it finishes running in every scenario. there are some tips on how to troubleshoot these cases here: http://stackoverflow.com/questions/6095530/maximum-call-stack-size-exceeded-error
idietmoran
@idietmoran
Feb 15 2016 12:22
@coderNoob maybe add a break when you want your if/else statements in your while loop to designate it to start over
h4r1m4u
@h4r1m4u
Feb 15 2016 12:22
what happens if you replace boardFull() in if (boardFull() || scoreGame) with a simple true or false
(sorry, dinner time for me, gonna be afk for some time)
Ankit Panwar
@coderNoob
Feb 15 2016 12:25
@h4r1m4u placed false and I still get the same error. Works fine with true.
Ankit Panwar
@coderNoob
Feb 15 2016 12:39
Okay the error persists even if I remove boardFull altogether
Thomas
@Motass
Feb 15 2016 12:49
@coderNoob can you try to replace your "else if (thisScore > bestScore)" with just "else" to see if it makes a difference ?
Thomas
@Motass
Feb 15 2016 12:54
@coderNoob Nevermind, your recursion runs indefinitely because you don't have any return statement in the last two conditions
you should return the score
jmichelot
@jmichelot
Feb 15 2016 13:31
Hi everyone ! I finished the first coding challenge (i.e. tribute page) and I blocked on something: I wanted to use bootstrap img-responsive but also display only a small part of an image... (clip?). Couldn't do it ! So I let img-responsive on the side.. my link : http://codepen.io/jmichelot/pen/EPMgaL
Si
@dr4ke90
Feb 15 2016 13:32
Hi all - just finished my portfolio project and would be grateful for some feedback :)
kirbyedy
@kirbyedy
Feb 15 2016 13:33
this is not valid in css background-size: 100% 100%;
Si
@dr4ke90
Feb 15 2016 13:35
@kirbyedy but without that the background image is completely screwed up?
Robert Uivarosi
@URobert
Feb 15 2016 13:35

@dr4ke90 looks pretty good. Buttons (beside Facebook) don't work yet. At the end you want input fields for:` Email: {Enter E-Mail Address}

Phone: {Enter Phone Number}`. You want to give that contact section some attention

kirbyedy
@kirbyedy
Feb 15 2016 13:36
you can have only 1 parameter
btw now, when I resize the window, the office is screwed up
streched
Si
@dr4ke90
Feb 15 2016 13:36
Thanks @URobert - I only put on the Facebook button link as I've not decided what I want to call it etc
CamperBot
@camperbot
Feb 15 2016 13:36
dr4ke90 sends brownie points to @urobert :sparkles: :thumbsup: :sparkles:
:star: 588 | @urobert | http://www.freecodecamp.com/urobert
Si
@dr4ke90
Feb 15 2016 13:37
Thanks @kirbyedy - so it should just be 100% instead of 100% 100%?
CamperBot
@camperbot
Feb 15 2016 13:37
dr4ke90 sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star: 470 | @kirbyedy | http://www.freecodecamp.com/kirbyedy
kirbyedy
@kirbyedy
Feb 15 2016 13:37
yes
Robert Uivarosi
@URobert
Feb 15 2016 13:37
@dr4ke90 yw
kirbyedy
@kirbyedy
Feb 15 2016 13:37
also no repeat
and cover
Si
@dr4ke90
Feb 15 2016 13:37
ah ok so it's also not responsive?
not sure what you meant by that @kirbyedy ?
kirbyedy
@kirbyedy
Feb 15 2016 13:39
well if you dont include no-repeat for the background image it will repeat itself on the page couple of times
Si
@dr4ke90
Feb 15 2016 13:40
ah ok I see!
thank you
I'll work to make it responsive as my next challenge and will add the no repeat
thank you
Other than those niggles - what do you think?
kirbyedy
@kirbyedy
Feb 15 2016 13:45
well needs more fixing, but overall you are on the good track, keep on coding :thumbsup:
thomas-duval
@thomas-duval
Feb 15 2016 14:00

Hey guys,
I'm trying to do the local weather app but I can't get the API to work :(
I've got a key that work when used directly in Firefox but not when I use Jquery.

Here is the code :

if (navigator.geolocation) {
    var lat;
    var lon;
    navigator.geolocation.getCurrentPosition(function (position) {
        lat = position.coords.latitude;
        lon = position.coords.longitude;
        $("#city").html("latitude: " + lat + "<br>longitude: " + lon);
        var owpApi = '"http://api.openweathermap.org/data/2.5/weather?lat=' + lat + '&lon=' + lon + '&appid=11111111111111"';
        $("#description").html(owpApi);
        $.getJSON(owpApi, function (json) {
            $("#temperature").html(JSON.stringify(json)));
        });
    });
}

In the dev tool, I see a 404 error because it's trying to get to

http://localhost:9000/%22http://api.openweathermap.org/data/2.5/weather?lat=48.8592&lon=2.3417&appid=11111111111111%22

(I'm using Grunt to host my website on my computer and debug it)

Thanks in advance.

Bruce Young
@mutantspore
Feb 15 2016 14:03
'http://api.openweathermap.org/data/2.5/weather?lat=' + lat + '&lon=' + lon + '&appid=11111111111111’
try that. I cleaned out some unnecessary "
which is the %22 you can see in your resultant URL @thomas-duval
Jas K
@jask84
Feb 15 2016 14:07
Hi all. This has probably been asked before I'm sure but I havent logged on after several days away. The FreeCodeCamp map has changed and the "Stylise Stories on Camper News" project I'm currently working on doesn't seem to be there anymore. Could anyone tell me whether that project is placed elsewhere or has been removed now? Thanks.
thomas-duval
@thomas-duval
Feb 15 2016 14:07
Thanks @mutantspore, I don't get the 404 error now.
CamperBot
@camperbot
Feb 15 2016 14:07
thomas-duval sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1125 | @mutantspore | http://www.freecodecamp.com/mutantspore
thomas-duval
@thomas-duval
Feb 15 2016 14:09
It has been removed.
You can find the full changelog with explanation on Github
@jask84
Jas K
@jask84
Feb 15 2016 14:09
@thomas-duval thanks. Ill have a look now
CamperBot
@camperbot
Feb 15 2016 14:09
jask84 sends brownie points to @thomas-duval :sparkles: :thumbsup: :sparkles:
:star: 298 | @thomas-duval | http://www.freecodecamp.com/thomas-duval
Nairuz.Abulhul
@nairuzabulhul
Feb 15 2016 14:30
@haasDev thanks
CamperBot
@camperbot
Feb 15 2016 14:30
zeemax sends brownie points to @haasdev :sparkles: :thumbsup: :sparkles:
:star: 441 | @haasdev | http://www.freecodecamp.com/haasdev
rtc31293
@rtc31293
Feb 15 2016 14:53
I'm confused what data we need to grab from the TwitchTV API..the example URL just uses test_streams but what is the base URL?
h4r1m4u
@h4r1m4u
Feb 15 2016 14:59
This message was deleted

@h4r1m4u placed false and I still get the same error. Works fine with true.

Yeah, that to me confirms that there's an issue with the recursion - it never finishes properly. @coderNoob

mjqblade
@mjqblade
Feb 15 2016 16:07
<style>
  body {
    background-color: black;
    font-family: Monospace;
    color: green;
  }
</style>
<h1>Hello World!</h1>

it says give your h1 element the pink text help

rtc31293
@rtc31293
Feb 15 2016 16:08
@mjqblade you need to add a new selector, h1, to your style section, and then specifiy the color pink as you did for the body being green
Alex
@Jeckstex
Feb 15 2016 16:11
Hello campers! :) I am working on the "Build a Random Quote Machine". Could one tell me how to send text when I click the twitter link? In the following example, when one clicks on the "tweet icone" the text of the quote displays in the tweet box. Could someone explain me how to do this please?
mjqblade
@mjqblade
Feb 15 2016 16:11
can u do it plz i dont get it @rtc31293
Alex
@Jeckstex
Feb 15 2016 16:11
mjqblade
@mjqblade
Feb 15 2016 16:12

can u do it plz i dont get it @rtc31293

h4r1m4u
@h4r1m4u
Feb 15 2016 16:14

@Jeckstex the tweet link is just a regular <a> element with an href in a special format:

<a href="https://twitter.com/intent/tweet?text=Some+text">Tweet this</a>

where 'Some+text' is the text you want to tweet

so every time you generate a new quote, update the href attribute of the tweet link with the text of the generated quote
SilasOtoko
@SilasOtoko
Feb 15 2016 16:16
Hello, I'm on the Random Quote generator zipline and I'm a bit stuck. I have it so that the quote gets updated when the button is clicked, but I can't seem to get the tweet message to update with the new quote, even though both are set with the click event. Can anyone help or at least give me insight as to why one gets updated but not the other? http://codepen.io/SilasOtoko/pen/dGgEyJ
Alex
@Jeckstex
Feb 15 2016 16:16
@h4r1m4u Okay, I kind of see where this is going. although, I don't get what Some+text is, is it an Id?
h4r1m4u
@h4r1m4u
Feb 15 2016 16:16
@Jeckstex 'Some+text' is the text you want to tweet
Alex
@Jeckstex
Feb 15 2016 16:19
@h4r1m4u Ok I see, thank you! :)
CamperBot
@camperbot
Feb 15 2016 16:19
jeckstex sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1405 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 15 2016 16:19
@SilasOtoko the problem is that you're using the twitter widget which actually changes the structure of your DOM under the hood. you think that your tweet link looks like this: <a class="twitter-share-button" data-size="large" target='_blank'>Tweet</a>, but that's not the case as the twitter widget overwrites that with an embedded iframe
my advice, get rid off the twitter widget and use the twitter intents. i just described how that works to @Jeckstex 5 or 6 messages above
if you want to stick with the twitter widget, their documentation has a section on how to create and update the buttons
rtc31293
@rtc31293
Feb 15 2016 16:23
@mjqblade
h1 {
color: pink;
}

can anyone help me with the code for the TwitchAPI project?

usernames = ["freecodecamp", "storbeck", "terakilobyte", "habathcx","RobotCaleb","thomasballinger","noobs2ninjas","beohoff"];

$("#test").click(function(){
  getData();
  console.log(streams)
  for (i=0; i < 5; i++){
    generateContainers();
  }
})

function generateContainers(){
    jQuery('<div/>', {
    id: 'foo',
    class: 'test widthSetter',
    href: 'http://google.com',
    title: 'Become a Googler',
    rel: 'external',
    html: "hello",
}).appendTo('#contentHolder');
}

function getData(){
  URL = "https://api.twitch.tv/kraken/streams";
  streams = $.ajax( {
      url: URL,
      data: 'queryData',
      dataType: 'jsonp',
      type: 'POST',
      headers: { 'Api-User-Agent': 'Example/1.0' }
  })
  return streams;
}

I am receviing an object, but it doesn't seem to be the correct object..i.e. I can't access any of its properties

(ignore the usernames array, I just have it up there for once I figure out how to receive the object)
SilasOtoko
@SilasOtoko
Feb 15 2016 16:25
Thanks @h4r1m4u! My bad on the untimely duplicate.
h4r1m4u
@h4r1m4u
Feb 15 2016 16:27
@SilasOtoko no worries. vice versa, it's a timely question - two birds with one stone :)
Mooli
@Mooli88
Feb 15 2016 16:37
hi, is it possible to use '@media' while using bootstrap ?
h4r1m4u
@h4r1m4u
Feb 15 2016 16:37
@Mooli88 yeah, most certainly. bootstrap itself uses media queries heavily
Mooli
@Mooli88
Feb 15 2016 16:39
@h4r1m4u so this should work just fine right @media only screen and (min-width: 480px) and (max-width: 768px){}
h4r1m4u
@h4r1m4u
Feb 15 2016 16:40
@Mooli88 yup, that looks right to me
Mooli
@Mooli88
Feb 15 2016 16:42
@h4r1m4u can you please take a look at my code here and tell me why its not working
http://codepen.io/Mooli88/pen/EPMXWW?editors=1100
h4r1m4u
@h4r1m4u
Feb 15 2016 16:45

@Mooli88 the issue is the order of your CSS rules. in general, the lower defined style overrwrite the higher defined styles in the same file. hence in your case:

/*
@media
*/
@media only screen and (min-width: 480px) and (max-width: 768px){

  .main h1 {
      font-size:18px;
  }
  .btn{
  color:red;
  }
  .jumbotron {
    background:#fff;
  }
}
/*
@media end
*/
.jumbotron{
  background:#000;
  margin-bottom:0
}

.btn {
  color:#0393FF;
    border-radius:0;
  border-color:#0393FF;
  padding:6px 15px;
  background:transparent;
  transition:background 0.3s, color 0.5s;
}
.btn:hover{
border-color:#0393FF;
background:#0393FF;
color:#fff;
}

the media query styles get overriden by the general styles defined below them

flip the order (put the media query under your general rules) and it'll work fine
greg
@wearenotgroot
Feb 15 2016 16:45
@Mooli88 another thing, why not use a nav bar which is fixed at the top?
Mooli
@Mooli88
Feb 15 2016 16:46
its just an old project i just experimenting with some stuff
@h4r1m4u i thought we should put all media queries at the beginning so mobile users wont have to download unnecessary sutff
h4r1m4u
@h4r1m4u
Feb 15 2016 16:48
@Mooli88 that's the first time i hear that. the entire CSS file be downloaded, so it doesn't matter
Mooli
@Mooli88
Feb 15 2016 16:49
@h4r1m4u i'll have another look later but for now its seems you helped me with my problem so thank you very much!
CamperBot
@camperbot
Feb 15 2016 16:51
mooli88 sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1406 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
alnero
@alnero
Feb 15 2016 16:57
Hi, is there a way to make parts of my js code in Codepen to execute in different parts of the web page?
h4r1m4u
@h4r1m4u
Feb 15 2016 17:00
@Mooli88 i'll try to find something more about the topic as well. i've never heard of this and i can't actually see how it'd work. the browser has to download the entire CSS file with all the rules - unless it downloads it in its entirety, it cannot know whether there are some styles later in the file which should be applied. the only way i see this potentially working is by splitting your media queries for different breakpoints into different files, but that increases the number of HTTP requests the browser needs to make as it loads the page (something the tutorial you linked also mentions)
regardless, if you wanted to wanted to structure your CSS file that way (mobile first approach), the styles applied to all resolutions should come first, then your media queries (in the order of the increasing size of the screen)
so going back to you example, you'd do something like:
/*
@media
*/
@media only screen and (min-width: 480px) and (max-width: 768px){

  .main h1 {
      font-size:18px;
  }
  .btn{
  color:red;
  }
  .jumbotron {
    background:#fff;
  }
}
/*
@media end
*/
@media only screen (min-width: 769px){
.jumbotron{
  background:#000;
  margin-bottom:0
}

.btn {
  color:#0393FF;
    border-radius:0;
  border-color:#0393FF;
  padding:6px 15px;
  background:transparent;
  transition:background 0.3s, color 0.5s;
}
.btn:hover{
border-color:#0393FF;
background:#0393FF;
color:#fff;
}
}
this way the lower defined styles wouldn't overrwrite the higher defined styles as they're applied to a different screen size
Ivan Temchur
@ttemcha
Feb 15 2016 17:17
hello can someone help me ? please explain why an image caption font-size is so big ?
http://codepen.io/temcha/pen/ZQPzBZ
h4r1m4u
@h4r1m4u
Feb 15 2016 17:18
@ttemcha because you're using the <h1> element for it. the bootstrap has this CSS rule for <h1>s inside .jumbotron:
@media screen and (min-width: 768px)
.jumbotron .h1, .jumbotron h1 {
    font-size: 63px;
}
63px is pretty big
Ivan Temchur
@ttemcha
Feb 15 2016 17:19
@h4r1m4u but i'm using <p> for this
@h4r1m4u not <h1>
h4r1m4u
@h4r1m4u
Feb 15 2016 17:20
oops, sorry, you meant the caption, not the title:
.jumbotron p {
    margin-bottom: 15px;
    font-size: 21px;
    font-weight: 200;
}
21px
you can override it in your own CSS
e.g.
.jumbotron p {
     font-size: 16px;
 }
Ivan Temchur
@ttemcha
Feb 15 2016 17:21
@h4r1m4u oh, it was said in instructions that its only html in this project
@h4r1m4u only 1 css rule - margin-top
h4r1m4u
@h4r1m4u
Feb 15 2016 17:25

@ttemcha ok. i haven't done this zipline, it's been added after i completed the front-end cert. that's just silly. regardless, if that's the requirement, change:

<p>Dr. Norman Borlaug, second from left, trains biologists in Mexico on how to increase wheat yields - part of his life-long war on hunger.</p>

to

<div class="caption">Dr. Norman Borlaug, second from left, trains biologists in Mexico on how to increase wheat yields - part of his life-long war on hunger.</div>
Ivan Temchur
@ttemcha
Feb 15 2016 17:26
@h4r1m4u already tried =(
h4r1m4u
@h4r1m4u
Feb 15 2016 17:27
that works for me
Ivan Temchur
@ttemcha
Feb 15 2016 17:27
@ttemcha oh, wait, i tried <p class="caption">
h4r1m4u
@h4r1m4u
Feb 15 2016 17:27
yeah, it's gotta be a div
Ivan Temchur
@ttemcha
Feb 15 2016 17:27
@h4r1m4u yeah its working with div but why its not working with p
@h4r1m4u thanks for help a lot
CamperBot
@camperbot
Feb 15 2016 17:27
ttemcha sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1407 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 15 2016 17:28
because bootstrap has the style defined only for div with class caption. not for p
Ivan Temchur
@ttemcha
Feb 15 2016 17:28
@h4r1m4u now i got it ! nice, thank u very much
CamperBot
@camperbot
Feb 15 2016 17:28
ttemcha sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:warning: ttemcha already gave h4r1m4u points
h4r1m4u
@h4r1m4u
Feb 15 2016 17:28
normally you could define it yourself to make it work with a p, but since you're restricted by the requirements in this zipline, you can't
my pleasure
Keari Eggers
@kme211
Feb 15 2016 17:34

@BLayman You've probably already fixed your issue by now but I thought I'd respond just in case you haven't... If you right click on an element (or CTRL-click if you're on a Mac) and click "inspect" or maybe "inspect element" depending on your browser, it will open up your development tools to the elements tab. The element you right clicked on should be highlighted. There are other shortcuts to open dev tools but that's an easy one to remember when you're getting started.

Take the time to learn about your browser's development tools. You'll be happy you did. :smiley:

Brett Felts
@brettfelts
Feb 15 2016 17:35
I'm working on the weather app, and I have a question about my AJAX call.
The call is returning an error, and I was wondering if it was in the call itself, or something else
Naveen
@naveenm60
Feb 15 2016 17:38
how do i add text for an image?
should i use <p> element after <img> ?
Brett Felts
@brettfelts
Feb 15 2016 17:38
Do you want text when you hover, or for it to be a caption?
Naveen
@naveenm60
Feb 15 2016 17:38
caption
Ivan Temchur
@ttemcha
Feb 15 2016 17:39
Naveen
@naveenm60
Feb 15 2016 17:39
i know to use "alt text" but how do i add caption?
Brett Felts
@brettfelts
Feb 15 2016 17:39
use <p>
h4r1m4u
@h4r1m4u
Feb 15 2016 17:39
@brettfelts it's an issue with the API URL. change it to this:
url: 'http://api.openweathermap.org/data/2.5/weather?lat='+ lat + '&lon=' + lon + '&APPID=5e717baffcd231cf5909008b3aa47479'
two changes: a) https to http (https is not supported by openweather), b) ?APPID to &APPID (when chaining parameters, you use &)
Ivan Temchur
@ttemcha
Feb 15 2016 17:40
@naveenm60
<img>
<div class="caption">Caption</div>
Naveen
@naveenm60
Feb 15 2016 17:40
woah. that's it? thanks @ttemcha
CamperBot
@camperbot
Feb 15 2016 17:40
naveenm60 sends brownie points to @ttemcha :sparkles: :thumbsup: :sparkles:
:star: 269 | @ttemcha | http://www.freecodecamp.com/ttemcha
Ivan Temchur
@ttemcha
Feb 15 2016 17:40
@naveenm60 if u r using bootstrap
Brett Felts
@brettfelts
Feb 15 2016 17:40
Awesome, thanks @h4r1m4u
CamperBot
@camperbot
Feb 15 2016 17:40
brettfelts sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1408 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 15 2016 17:40
np
Naveen
@naveenm60
Feb 15 2016 17:41
and one more thing, how do i leave space between any 2 lines?
Brett Felts
@brettfelts
Feb 15 2016 17:42
<br>
Naveen
@naveenm60
Feb 15 2016 17:42
for example, i want to leave 2 line space after my image
ok thanks @brettfelts
CamperBot
@camperbot
Feb 15 2016 17:42
naveenm60 sends brownie points to @brettfelts :sparkles: :thumbsup: :sparkles:
:star: 357 | @brettfelts | http://www.freecodecamp.com/brettfelts
La Moulin
@zimmertyzim
Feb 15 2016 17:46
any algorithm help in here? no one could answer in /HelpJavaScript
Pradeep CE
@cepradeep
Feb 15 2016 17:47
@zimmertyzim What have you done so far/
La Moulin
@zimmertyzim
Feb 15 2016 17:48
it's the permutations, I can get it to work, I just have some weird behaviour that makes no sense to me
please see the comments in capitals


var test = "aab";
testA = test.split("");
permutations = [];
generatePermutations(testA, testA.length);

// generatePermutations the permutation for a given n (amount of elements) and a given array
function generatePermutations(array, arrayLength) {
    // one element means a permutation, push accordingly
    if (arrayLength === 1) {
        console.log(array); // THIS OUTPUTS DIFFERENT PERMUTATIONS
        permutations.push(array);
        console.log(permutations); // VALUES IN ARRAY ARE ALL THE SAME

        // permutations.push(array.join("")); // join now to save a loop later
        // console.log(permutations);
        // SPLITTING THE STRING MAKES IT WORK FINE?!
        return;
    }

    for (var i = 0; i < arrayLength; i += 1) {
        generatePermutations(array, arrayLength - 1);

        if (arrayLength % 2 == 0) {
            swapArrayElements(array, i, arrayLength - 1);
        } else {
            swapArrayElements(array, 0, arrayLength - 1);
        }
    }
}

function swapArrayElements(array, elementA, elementB) {
    var temp = array[elementA];
    array[elementA] = array[elementB];
    array[elementB] = temp;
}

/*
We now have our permutations.
We test each against a regular expression that tests for repeating character.
We can just filter out those that don't match,.

I guess probably better done (computation speed wise) within generatePermutations()
I'm putting it here for clarity though.
*/



// filterdResults = permutations.filter(function(element, index, array) {
//     var re = /(\w)\1+/;
//     return re.test(element);
// });
Pradeep CE
@cepradeep
Feb 15 2016 17:50
@zimmertyzim I'm behind you on the Map :grin: Someone else should explain it to you shortly :)
La Moulin
@zimmertyzim
Feb 15 2016 17:54
hehe
Laudron
@Laudron
Feb 15 2016 18:02
@zimmertyzim What is the weird behavior? The fact that splitting the input string makes a difference?
Trevor Baker
@noizehack
Feb 15 2016 18:03
is there anyone that can give me a hand with wiki api calls with ajax?
Mark David Teo
@volaix
Feb 15 2016 18:04
help bonfire chunky monkey
CamperBot
@camperbot
Feb 15 2016 18:04
no wiki entry for: bonfire chunky monkey
Mark David Teo
@volaix
Feb 15 2016 18:04
help chunky monkey
CamperBot
@camperbot
Feb 15 2016 18:04

:point_right: algorithm chunky monkey [wiki]

Explanation

Our goal for this Algorithm is to split arr (first argument) into smaller chunks of arrays with the length provided by size (second argument). There are 4 green checks (objectives) our code needs to pass in order to complete this Algorithm:

  1. (['a', 'b', 'c', 'd'], 2) is expected to be [['a', 'b'], ['c', 'd']]
  2. ([0, 1, 2, 3, 4, 5], 3) is expected to be [[0, 1, 2], [3, 4, 5]]
  3. ([0, 1, 2, 3, 4, 5], 2) is expected to be [[0, 1], [2, 3], [4, 5]]
  4. ([0, 1, 2, 3, 4, 5], 4) is expected to be [[0, 1, 2, 3], [4, 5]]

Click More information under the Algorithm title and read the helpful links if you haven't yet.

:pencil: read more about algorithm chunky monkey on the FCC Wiki

La Moulin
@zimmertyzim
Feb 15 2016 18:14
@Laudron yes, but even before that. If I console.log(array) I get a permutation as expected, (and a different one each time the function makes a cycle), when I push it onto permutation and then console.log(permutations) I get the same value over and over in the array, not different permutations
Mark David Teo
@volaix
Feb 15 2016 18:14
can anyone help explain to me why there is a potential infinite loop at line 4?
function chunk(arr, size) {

var newArray = [];
 for (var i=0; i<arr.length; i++){
   var insert = arr.splice(i*size, size);
   newArray = arr.push(insert);
 }
  return newArray;


}
chunk(["a", "b", "c", "d"], 2);
I'm not touching arr?
Trevor Baker
@noizehack
Feb 15 2016 18:16
maybe if the arr.length === 0
h4r1m4u
@h4r1m4u
Feb 15 2016 18:16
@volaix you are: newArray = arr.push(insert);. you're pushing new elements into arr
Mark David Teo
@volaix
Feb 15 2016 18:17
oh? so the push method moves things into arr?
okay i didnt know push worked like that, thanks @h4r1m4u
CamperBot
@camperbot
Feb 15 2016 18:17
volaix sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1409 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 15 2016 18:17
it adds elements into the array you call it on
if you want to add them into newArray, you should be doing newArray.push(insert)
Mark David Teo
@volaix
Feb 15 2016 18:18
yeah ive just had a look
also i find the morzilla reference website to be a bit confusing
is there any benefit for using the morzilla one?
ps thanks for trying @noizehack
CamperBot
@camperbot
Feb 15 2016 18:19
volaix sends brownie points to @noizehack :sparkles: :thumbsup: :sparkles:
:star: 280 | @noizehack | http://www.freecodecamp.com/noizehack
h4r1m4u
@h4r1m4u
Feb 15 2016 18:20
personally i prefer the mozilla site. i find it more reliable.
Mark David Teo
@volaix
Feb 15 2016 18:20
also just another quick quesiton
why does it list the method as "Array.prototype.push()"
what does the 'prototype' mean?
the way i understand it, is that Array = the type of data, then "push" is the method. Hence when you use it array.push()
and correct, push() is a method of the Array data type
Brett Felts
@brettfelts
Feb 15 2016 18:23
I'm having further trouble with my weather app.
Mark David Teo
@volaix
Feb 15 2016 18:23
ok cheers :)
In chrome, it's throwing a syntax error VM110
In Firefox, it's not showing anything in the console
Chris Katzmann
@cwkatzmann
Feb 15 2016 18:31
Hi all
Question: how do I make border padding not appear on mobile view
i want the padding when using desktop but not mobike
Brett Felts
@brettfelts
Feb 15 2016 18:33
use a media query
add the padding at (min-width: 568px)
you can fiddle with the min-width to your liking, but that should do it
Chris Katzmann
@cwkatzmann
Feb 15 2016 18:34
awesome awesome, thank's brett
Brett Felts
@brettfelts
Feb 15 2016 18:34
no problem
Chris Katzmann
@cwkatzmann
Feb 15 2016 18:34
I read something about media queries...are they part of the FCC curriculum?
Brett Felts
@brettfelts
Feb 15 2016 18:36
I don't know if they are because of how bootstrap heavy the design curriculum is, but you might be able to find it in part of the earlier curriculum
w3c has a pretty good portion about them though
Chris Katzmann
@cwkatzmann
Feb 15 2016 18:37
so, no? lol
Pradeep CE
@cepradeep
Feb 15 2016 18:37
@cwkatzmann You can also load a different CSS file based on whether it's a mobile device. Hint: "viewport"
h4r1m4u
@h4r1m4u
Feb 15 2016 18:39

@brettfelts i dont' know if this is the problem as my browser has issues with the geolocation, but two things:

// a) the $.ajax call is asynchronous. what this means is that the rest of the code doesn't wait for the response from the API before moving on
// b) the parseJSON() method is for converting a string into an object. but the response you get from the API is already an object, you don't need to convert it
 var weather = $.parseJSON($.ajax({
   url: 'http://api.openweathermap.org/data/2.5/weather?lat='+ lat + '&lon=' + lon + '&APPID=5e717baffcd231cf5909008b3aa47479',
   dataType: 'jsonp',
   error:
function(d,textStatus, error) {
        /*alert("success");
    }).fail( function(d, textStatus, error) {*/
        console.log(error("getJSON failed, status: " + textStatus + ", error: "+error))}
    }));
// this forloop would get executed before you get response from the API
 for (var i = 0; i < weather.length; i++) {
  $('#display').append('<li>'+ weather[i] + '</li>');
 }
     console.log(weather);
    }

overall, i would suggest that you add a success function to your ajax call:

$.ajax({
   url: 'http://api.openweathermap.org/data/2.5/weather?lat='+ lat + '&lon=' + lon + '&APPID=5e717baffcd231cf5909008b3aa47479',
   dataType: 'jsonp',
   success: function(apiResponse) {
     // do what you need to do with the response here, e.g.
    console.log(apiResponse);
    // the processing of the response and displaying it into the DOM would also go here
   }, 
   error:
function(d,textStatus, error) {
        /*alert("success");
    }).fail( function(d, textStatus, error) {*/
        console.log(error("getJSON failed, status: " + textStatus + ", error: "+error))}
    });
Chris Katzmann
@cwkatzmann
Feb 15 2016 18:40
@brettfelts @pradeepce thanks for your help
CamperBot
@camperbot
Feb 15 2016 18:40
cwkatzmann sends brownie points to @brettfelts and @pradeepce :sparkles: :thumbsup: :sparkles:
:star: 358 | @brettfelts | http://www.freecodecamp.com/brettfelts
:star: 335 | @pradeepce | http://www.freecodecamp.com/pradeepce
Brett Felts
@brettfelts
Feb 15 2016 18:41
no problem @cwkatzmann
SilasOtoko
@SilasOtoko
Feb 15 2016 18:41
My random quote generator works like a charm now that I am using intents instead of the twitter widget. thanks @h4r1m4u !
CamperBot
@camperbot
Feb 15 2016 18:41
silasotoko sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1410 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
Brett Felts
@brettfelts
Feb 15 2016 18:41
Thanks @h4r1m4u
CamperBot
@camperbot
Feb 15 2016 18:41
brettfelts sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1411 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
h4r1m4u
@h4r1m4u
Feb 15 2016 18:41
@SilasOtoko awesome! nice work!
@brettfelts my pleasure
Brett Felts
@brettfelts
Feb 15 2016 18:41
ajax has always been a sticking point for me
h4r1m4u
@h4r1m4u
Feb 15 2016 18:41
yeah, it takes a bit of time to take it all in
Pradeep CE
@cepradeep
Feb 15 2016 18:42
@cwkatzmann Glad :)
greg
@wearenotgroot
Feb 15 2016 18:42
@brettfelts why are you not detecting success? and only detecting error?
@brettfelts have a success callback as well
Brett Felts
@brettfelts
Feb 15 2016 18:43
Yeah, @h4r1m4u just told me the same thing
greg
@wearenotgroot
Feb 15 2016 18:43
@brettfelts
sucess: function(){},
error: function(){}
Chris Katzmann
@cwkatzmann
Feb 15 2016 18:46
@brettfelts wohoo! it worked :)
Brett Felts
@brettfelts
Feb 15 2016 18:49
Glad I could help
Chris Katzmann
@cwkatzmann
Feb 15 2016 18:49
so basically media queries tell the program to display certain types of content only when the device meets specified parameters?
in that case could I use it for other things like images, text, links etc?
Brett Felts
@brettfelts
Feb 15 2016 18:51
yes. They really form the basis of responsive design
Chris Katzmann
@cwkatzmann
Feb 15 2016 18:52
great!
this is awesome
Brett Felts
@brettfelts
Feb 15 2016 18:53
you can use them to adjust the styling for all of your html based on the size of the screen. when using them, i would suggest using the dev tools on chrome, as they have an app for viewing the code output on different devices
Chris Katzmann
@cwkatzmann
Feb 15 2016 18:53
oooo
h4r1m4u
@h4r1m4u
Feb 15 2016 18:53
@cwkatzmann yea. if you're using bootstrap, they have some responsive utility classes that allow you to show/hide elements at certain resolution breakpoints only: http://getbootstrap.com/css/#responsive-utilities.
if you want to learn more about the topic, i'd suggest you give this a read: http://learn.shayhowe.com/advanced-html-css/responsive-web-design/
Chris Katzmann
@cwkatzmann
Feb 15 2016 18:54
@h4r1m4u cool thank you
CamperBot
@camperbot
Feb 15 2016 18:54
cwkatzmann sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1412 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
Chris Katzmann
@cwkatzmann
Feb 15 2016 18:55
@brettfelts looks like I'm switching back to chrome
@h4r1m4u this is really interesting stuff
looks like I know the next thing i'll be learning
h4r1m4u
@h4r1m4u
Feb 15 2016 18:58
@cwkatzmann great. yeah, that entire book / site is pretty good.
firefox has dev tools as well (or you can download firebug if you prefer) if you're using that. but chrome is great
Chris Katzmann
@cwkatzmann
Feb 15 2016 18:59
@h4r1m4u cool thank you
CamperBot
@camperbot
Feb 15 2016 18:59
cwkatzmann sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:warning: cwkatzmann already gave h4r1m4u points
h4r1m4u
@h4r1m4u
Feb 15 2016 19:05
np
LennixM
@LennixM
Feb 15 2016 19:33
Hey guys, I just finished my weather app. Can you give me some feedback?:)
http://codepen.io/LenniXM/pen/QyYZqz
tinako97
@tinako97
Feb 15 2016 19:36
@LennixM looks nice, worked for me. I think I took the decimals off on my code.
Gabriel
@Zera99
Feb 15 2016 19:42
Question.. Does anyone know (or can give me a hint if it exists) how to link a website on my page, and have it automatically add a small thumbnail of it?
Kind of like the way the pens look when you open up your profile in codepen
Raiden357
@raiden357
Feb 15 2016 20:01
just starting "build tribute page' and i don't remember anything
don't know where to start or what to do
what's wrong with reviewing example code?
Dylan
@dhcodes
Feb 15 2016 20:22
@LennixM Looks really slick. Nice work
@LennixM You can also submit this to the /CodeReview chat channel to get more feedback about the code
Joseph Morse
@jnmorse
Feb 15 2016 20:29
@Zera99 You can provide your own screenshots, though you'll need a host that will allow you to use those images on Codepen, which is possible with Dropbox, then need some JavaScript to display the image, and/or search around for an API, service, or library that you can include in your JavaScript.
Gabriel
@Zera99
Feb 15 2016 20:32
Hm..
I have no idea how to code the previous work part of the personal portfolio challenge..
I thought making rows, with 3 col-xs-4 , a well in each, and then inside put an anchored link, with some text below it.. but I have issues with the images being different sizes
And I'm kind of blocked as to how to deal with it
Gabriel
@Zera99
Feb 15 2016 20:39
I still need to fine-tune the heights but, this is what I have so far
Jesse Jafa
@awareness481
Feb 15 2016 21:01
I'm having a bit of a hard time working with the wikipedia api project. Is this way suitable to use the wikipedia api? I'm looking to get JSON data
<script>
  $(document).ready(function() {
    $(".wikiSearch").on("click", function() {
      var wiki = "https://en.wikipedia.org/w/api.php?action=opensearch&search=Te";
      $.getJSON(wiki), function(json) {
        $(".results").html(JSON.stringify(json));
      });
    });
});
</script>
Mooli
@Mooli88
Feb 15 2016 21:38
can someone explain why there is a need in a row before col ?
Mahou Kiq
@MahouK
Feb 15 2016 21:42
@Mooli88 So you can manage your columns in rows, makes it easier to create a grid for your needs :3
Mooli
@Mooli88
Feb 15 2016 21:43
hi @MahouK . not sure totally understand what you mean
you mean so it will be easier to target with css ?
p0seur
@p0seur
Feb 15 2016 21:53
could you good people check if this spits out your correct location? http://codepen.io/p0seur/full/ZQPame/
Jesse Jafa
@awareness481
Feb 15 2016 21:59
It does for me @p0seur
Mahou Kiq
@MahouK
Feb 15 2016 21:59
@Mooli88 easier to arrange our layout.
you*
your*
oh god imsory
p0seur
@p0seur
Feb 15 2016 22:00
thanks @tstusr441
CamperBot
@camperbot
Feb 15 2016 22:00
p0seur sends brownie points to @tstusr441 :sparkles: :thumbsup: :sparkles:
:star: 243 | @tstusr441 | http://www.freecodecamp.com/tstusr441
p0seur
@p0seur
Feb 15 2016 22:00
seems to still fail for some folks though.. no idea why :(
Robert Uivarosi
@URobert
Feb 15 2016 22:02
@SaintPeter thanks !
CamperBot
@camperbot
Feb 15 2016 22:02
urobert sends brownie points to @saintpeter :sparkles: :thumbsup: :sparkles:
:star: 2493 | @saintpeter | http://www.freecodecamp.com/saintpeter
Rex Schrader
@SaintPeter
Feb 15 2016 22:03
@URobert No problem :D
tommy
@tommygebru
Feb 15 2016 22:52
is anyone interested in a HelpDesign channel as an "extension" of HelpFrontEnd, I find it helpful to get fast feedback on my illustrations for the FED projects :smile:
Casey Heath
@ExhibitArts
Feb 15 2016 22:57
Anyone know why there is a favicon on my website when I didn't even include a link to it in my HTML file. The favicon that is being displayed isn't even an image in my project. I cleared the cache and cookies but it didn't seem to do anything. Anyone know why this is occuring?
LoLRabbit
@KevinStaufy
Feb 15 2016 23:06
hey guys i just started the build a tribute page and im kind of lost on how to start it.
@ExhibitArts how do you create a favicon? i've just made a logo and saved as png
background.png
Casey Heath
@ExhibitArts
Feb 15 2016 23:23
@tommygebru Favicons have to be a certain size. My favicon for example is 32 x32.
tommy
@tommygebru
Feb 15 2016 23:23
@ExhibitArts pixels?
Casey Heath
@ExhibitArts
Feb 15 2016 23:24
@tommygebru Yes 32 x 32 px
tommy
@tommygebru
Feb 15 2016 23:26
ok im hosting the image on photobucket ...
Casey Heath
@ExhibitArts
Feb 15 2016 23:28
@tommygebru In Photoshop (assuming you have it) make a new document that is 32 x 32 px. Take the image you want as a favicon and import it into that document. Make sure the image fits the canvas. This is what the 32 x 32 px canvas looks like in Photoshop. - https://gyazo.com/0aa260d14cb4936e5531f8e589f1cf23
tommy
@tommygebru
Feb 15 2016 23:29
@ExhibitArts i have image editing software ! i will open now
Casey Heath
@ExhibitArts
Feb 15 2016 23:31
@tommygebru Your favicon size can either be 16px x 16px or 32px x 32px. I reccomend 32px x 32px considering that it'll make your favicon bigger. 16px x 16px is kinda small in my opinion. I don't even know why it's an optional size for favicons.
Casey Heath
@ExhibitArts
Feb 15 2016 23:36
If you want a free hosting service that gives you FTP access with no watermark I recommend that you use https://byet.host they're hosting a website of mine right now. - http://colinflaherty-websitedesign.byethost8.com/?ckattempt=1
@tommygebru Let me know how it goes.
tommy
@tommygebru
Feb 15 2016 23:39
@ExhibitArts I copy pasted my image from illustrator to photoshop & can't find a sizing option also im using affinity software :smile_cat:
Casey Heath
@ExhibitArts
Feb 15 2016 23:40
@tommygebru You have to make a new document than drag the image into that.
tommy
@tommygebru
Feb 15 2016 23:40
@ExhibitArts ok ill try again
Casey Heath
@ExhibitArts
Feb 15 2016 23:41
@tommygebru Here is my settings for new favicon documents. - https://gyazo.com/28e7c6957f5198f76af1db4e32a9dcc5
This is the link you need to include in your head tags. <link type="image/png" rel="favicon" href="path to your image">
Raiden357
@raiden357
Feb 15 2016 23:50
this tribute stuff is killing me. all the exercises leading up to this have helped zero percent
going to w3c for all the help just to get thsi done
this
LoLRabbit
@KevinStaufy
Feb 15 2016 23:51
@raiden357 whats w3c?
Casey Heath
@ExhibitArts
Feb 15 2016 23:51
@tommygebru Let me know if you need any futher assistance.
LoLRabbit
@KevinStaufy
Feb 15 2016 23:52
@raiden357 because im on the tribute thing aswell
Casey Heath
@ExhibitArts
Feb 15 2016 23:52
@KevinStaufy W3C "World Wide Web Consortium" is the main international standards organization for the World Wide Web.
LoLRabbit
@KevinStaufy
Feb 15 2016 23:53
@ExhibitArts ahhh
well if anyone is willing to help me real quick with my tribute let me know
Raiden357
@raiden357
Feb 15 2016 23:54
LoLRabbit
@KevinStaufy
Feb 15 2016 23:55
@raiden357 ahh wow thats actually pretty nice
Raiden357
@raiden357
Feb 15 2016 23:55
go to references if you can't remember the elements
LoLRabbit
@KevinStaufy
Feb 15 2016 23:55
@raiden357 wow thats a really nice reference thanks man
CamperBot
@camperbot
Feb 15 2016 23:55
kevinstaufy sends brownie points to @raiden357 :sparkles: :thumbsup: :sparkles:
:star: 139 | @raiden357 | http://www.freecodecamp.com/raiden357
tommy
@tommygebru
Feb 15 2016 23:57
@ExhibitArts i think i may have found a solution http://blog.teamtreehouse.com/how-to-make-a-favicon but my image is too blurry i may have to create a new icon/logo :thumbsup:
LoLRabbit
@KevinStaufy
Feb 15 2016 23:58
Rule #2: Fulfill the below user stories. Use whichever libraries you need. Give it your own personal style. i dont understand what thats asking me..
Casey Heath
@ExhibitArts
Feb 15 2016 23:59
@raiden357 You do know that w3c and w3schools are not the same right?
going to w3c for all the help just to get thsi done
tommy
@tommygebru
Feb 15 2016 23:59
@KevinStaufy a user story is essentially the requirements, for example if you are a freelance designer the user story belongs to your client... it is a guide to help you build a website based on "their" needs :smile:
LoLRabbit
@KevinStaufy
Feb 15 2016 23:59
@tommygebru alright i get that but im not sure how im suppose to put that into my tribute