These are chat archives for FreeCodeCamp/HelpFrontEnd

31st
Jul 2016
William Cabell
@wbac88
Jul 31 2016 02:11
@wilcombebolger That's the best tribute page subject I've seen yet!
Hi guys, I'm having trouble finishing the local weather project because of the changing background image user story. This is my pen:
No matter how I do it, the picture always ends up covering the other info on the page or not being full screen, which is what I'm aiming for. Any thoughts or ideas?
Stephen James
@sjames1958gm
Jul 31 2016 02:14
@wbac88 Have you tried making the image a background image via css?
William Cabell
@wbac88
Jul 31 2016 02:15
I did, but something wasn't working with it, which is how I ended up with what I have now, found on csstricks.com
Stephen James
@sjames1958gm
Jul 31 2016 02:15
$("html").css("background-image", 'url(' + imgurl + ')');
William Cabell
@wbac88
Jul 31 2016 02:15
Hmm, ok I'll try that out!
@sjames1958gm Could you give an example with a random URL in there?
NM, I have this: $("html").css("background-image", "url('https://static.pexels.com/photos/110874/pexels-photo-110874.jpeg')");
is the punctuation right?
Stephen James
@sjames1958gm
Jul 31 2016 02:21
@wbac88 I don't think you need the single quotes
My single quotes were there because I was concatenating a variable
William Cabell
@wbac88
Jul 31 2016 02:21
It ends up commenting it out if I have double quotes in there
Stephen James
@sjames1958gm
Jul 31 2016 02:22
$("html").css("background-image", "url(https://static.pexels.com/photos/110874/pexels-photo-110874.jpeg)")
William Cabell
@wbac88
Jul 31 2016 02:22
Ahh, ok, that's what I was missing, I see what you mean. I'll try it.
It's not showing up as a background. Just white
Stephen James
@sjames1958gm
Jul 31 2016 02:23
hmm
William Cabell
@wbac88
Jul 31 2016 02:25
I've been working on this for weeks, I can't get anything to show up right, I don't understand it.
Luis Felipe López G.
@luishendrix92
Jul 31 2016 02:27
@wbac88 Try with body instead of html
Stephen James
@sjames1958gm
Jul 31 2016 02:27
@wbac88 I see the bottom of the image
@luishendrix92 :+1:
Luis Felipe López G.
@luishendrix92
Jul 31 2016 02:28
I'd normally do:
document.body.style.background = 'url("' + imgUrl + '")';
William Cabell
@wbac88
Jul 31 2016 02:28
Thanks @luishendrix92 Yep that did it! Thanks @sjames1958gm for your help!
Thought I'd tried that before but obviously not!
CamperBot
@camperbot
Jul 31 2016 02:28
:cookie: 827 | @luishendrix92 |http://www.freecodecamp.com/luishendrix92
wbac88 sends brownie points to @luishendrix92 and @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 2240 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
William Cabell
@wbac88
Jul 31 2016 02:30
@luishendrix92 I see, that makes sense.
William Cabell
@wbac88
Jul 31 2016 02:58

If anyone else is still here, I have another question:

      //Temperature
      var celsius = where.main.temp - 273.15;

      var fahrenheit = where.main.temp * 1.8 - 459.67;

      $("#temperature").html("<p id = 'celFahr'>Current Temperature: " + Math.floor(celsius) + "<span id='changeToFahr'> &#8451</span></p>")

      var tempCel = true;

      //Celsius to Fahrenheit
      $("#changeToFahr").click(function() {
      if (tempCel == true){ 

        tempCel = false;
        console.log(tempCel);
        $("#celFahr").html("<p id = 'celFahr'>Current Temperature: " + Math.floor(fahrenheit) + "<span id='changeToFahr'> &#8457</span></p>")

      }
      else if (tempCel == false) {

        tempCel == true;
      console.log(tempCel);

        $("#celFahr").html("<p id = 'celFahr'>Current Temperature: " + Math.floor(celsius) + "<span id='changeToFahr'> &#8451</span></p>")

      };
      });

When I click the C on my site, it switches it to Fahrenheit, but it won't switch back when I click the F, so something is missing here and I can't see it.

Ken Haduch
@khaduch
Jul 31 2016 03:09
@wbac88 - kind of hard to tell, but if you are changing the structure of the HTML, and regenerating the <span id='changeToFahr'>, you might be losing the click handler on that element?
William Cabell
@wbac88
Jul 31 2016 03:09
@khaduch OK, would there be an easier way to do this?
Luis Felipe López G.
@luishendrix92
Jul 31 2016 03:09
@wbac88 When you re-render an html element you lose the handler
don't include the button or span to change the temperature in any re-rendering process
Ken Haduch
@khaduch
Jul 31 2016 03:10
@wbac88 - well, don't re-generate that element that you are putting the click handler on, just change the text of it?
Luis Felipe López G.
@luishendrix92
Jul 31 2016 03:10
it should stay separated
William Cabell
@wbac88
Jul 31 2016 03:12
Hmm ok, thanks @luishendrix92 @khaduch, let me go re-work that. I appreciate it!
CamperBot
@camperbot
Jul 31 2016 03:12
wbac88 sends brownie points to @luishendrix92 and @khaduch :sparkles: :thumbsup: :sparkles:
:warning: wbac88 already gave luishendrix92 points
:star2: 1497 | @khaduch |http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Jul 31 2016 03:12
@wbac88 - you're welcome.
Luis Felipe López G.
@luishendrix92
Jul 31 2016 03:14
@wbac88 Instead of changing the whole HTML, you can change the text content of the paragraph with the ID of celFahr using .text(' new text') in jQuery or .textContent in vanilla js
Xavier Velez
@JonSnow08
Jul 31 2016 03:28
@khaduch you got a second to help me figure out why my simon game won't work?
@khaduch i've been at it for 3 days now and I just can't figure it out
William Cabell
@wbac88
Jul 31 2016 03:30
@luishendrix92 It's working now, thank you!
CamperBot
@camperbot
Jul 31 2016 03:30
wbac88 sends brownie points to @luishendrix92 :sparkles: :thumbsup: :sparkles:
:cookie: 828 | @luishendrix92 |http://www.freecodecamp.com/luishendrix92
Xavier Velez
@JonSnow08
Jul 31 2016 03:35
or if anybody has some helpful tips I'd appreciate it, I can't seem to figure it out
JD Tadlock
@jdtdesigns
Jul 31 2016 03:45
@JonSnow08 You have about 100 errors in your js regarding .css()
for a single css declaration, you use .css('background-color', 'red');
for multiple use
.css({
'background-color': 'red',
'color': 'blue'
}):
Xavier Velez
@JonSnow08
Jul 31 2016 03:52
@jdtdesigns ahhhh ok
JD Tadlock
@jdtdesigns
Jul 31 2016 03:55
@JonSnow08 There are numerous errors. You need to look at the browser console(ctrl/cmd + shift + j).
Everytime i fix one, there is another
Xavier Velez
@JonSnow08
Jul 31 2016 03:55
@jdtdesigns okay I will
JD Tadlock
@jdtdesigns
Jul 31 2016 03:55
It's good practice to have a console up to see any errors as you save and refresh
also work through each module/function one by one and debug them using the console
That way you won't have 100 errors stacked up.
Xavier Velez
@JonSnow08
Jul 31 2016 03:58
@jdtdesigns okay cool thank you for the advice
CamperBot
@camperbot
Jul 31 2016 03:58
jonsnow08 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 594 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
JD Tadlock
@jdtdesigns
Jul 31 2016 03:58
welcome ;)
Xavier Velez
@JonSnow08
Jul 31 2016 03:58
@jdtdesigns did you see anything else specific that will be of help to me?
JD Tadlock
@jdtdesigns
Jul 31 2016 03:59
@JonSnow08 Like i said, there are numerous errors. Go through and fix each one and then if it's not working let us know and we'll check it out. ;)
Xavier Velez
@JonSnow08
Jul 31 2016 04:00
@jdtdesigns okay cool no problem thanks
CamperBot
@camperbot
Jul 31 2016 04:00
jonsnow08 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: jonsnow08 already gave jdtdesigns points
AlexanderNelson
@AlexanderNelson
Jul 31 2016 04:04
http://codepen.io/AlexanderNelson/full/jAKrGj/ My project images have an overlay that zoom,blur and show the title and link over the image on hover. However, I broke it somehow and I've beenworking on fixing it all day. Any ideas?
Xavier Velez
@JonSnow08
Jul 31 2016 04:08
@jdtdesigns codepen is giving me a use === to compare with true, when I already have a === there
Xavier Velez
@JonSnow08
Jul 31 2016 04:16
 function onOff() {
         $('#start').toggle(function() {
               $("#start").css('background-color', '#00ff00');
            }, function() {
               $("#start").css('background-color:', "#003300");
            }
         });
ah i was about to ask about that but now i see it
nvm it has more problems lol now I see what you mean @jdtdesigns
Xavier Velez
@JonSnow08
Jul 31 2016 04:35
 function onOff() {
         $('#start').toggle(function() {
               $("#start").css('background-color', '#00ff00');
            }, function() {
               $("#start").css('background-color', '#003300');}

         });
   }
Michael Smith
@droidvoider
Jul 31 2016 04:35

@AlexanderNelson .polaroid {
position: relative;
width: 220px;
}

.polaroid img {
border: 10px solid #fff;
border-bottom: 45px solid #fff;
-webkit-box-shadow: 3px 3px 3px #777;
-moz-box-shadow: 3px 3px 3px #777;
box-shadow: 3px 3px 3px #777;
}

.polaroid p {
position: absolute;
text-align: center;
width: 100%;
bottom: 0px;
font: 400 18px/1 'Kaushan Script', cursive;
color: #888;
};
caption {
display: table-caption;
text-align: center;
}

Xavier Velez
@JonSnow08
Jul 31 2016 04:35
I can't seem to get the syntax of this function correct, anybody see something I don't?
Michael Smith
@droidvoider
Jul 31 2016 04:37
@AlexanderNelson div class="img" (for the record)
JD Tadlock
@jdtdesigns
Jul 31 2016 04:42
@AlexanderNelson Here's a way I've done it in the past to avoid blurring the whole box. ;) http://jsbin.com/licoca/edit?css,output
AlexanderNelson
@AlexanderNelson
Jul 31 2016 04:44
i appreciate both responses, @droidvoider @jdtdesigns ill check in to both
Michael Smith
@droidvoider
Jul 31 2016 04:46
@AlexanderNelson you can google the stuff I pasted, I stole that off the web.. It makes it look like a polaroid. After you get how that works you own it.
AlexanderNelson
@AlexanderNelson
Jul 31 2016 04:49
@droidvoider lol thats how i found this one i tore it apart until i understood it. it worked and then I added some code and didnt realize that the strings stopped working. the blur still works so at least thats soething
JD Tadlock
@jdtdesigns
Jul 31 2016 04:57
@JonSnow08 Still have a bunch of syntax errors. Closing functions early, .css() with an extra ')' at the end and more. Keep at it. ;)
Xavier Velez
@JonSnow08
Jul 31 2016 05:00
@jdtdesigns I believe I got them all
@jdtdesigns at least the ones that the console is showing me
but still nothing
@jdtdesigns I did see what you meant about the syntax errors with .css though. I think when i used replace function in sublime editor i messed something up
I can't seem to get it to start to even test out anything else though
AlexanderNelson
@AlexanderNelson
Jul 31 2016 05:08
@droidvoider @jdtdesigns http://codepen.io/AlexanderNelson/pen/jAKrGj?editors=0100 uggh it just fixed itself. ill never know
Xavier Velez
@JonSnow08
Jul 31 2016 05:10
hrmm hold on my start button is hiding now, I think it has to do with my toggle function
jeebus
Xavier Velez
@JonSnow08
Jul 31 2016 05:22
welp I'm gonna go to bed
back at it tomorrow I guess lol @jdtdesigns thank you for the help and hints
CamperBot
@camperbot
Jul 31 2016 05:23
jonsnow08 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 595 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
LordYamanouchi
@LordYamanouchi
Jul 31 2016 10:34
Does anyone know what code I can write to receive server requests of quotes from goodreads.com ?
'
Darth Skywalker
@adityaparab
Jul 31 2016 10:46
LordYamanouchi
@LordYamanouchi
Jul 31 2016 10:46
@adityaparab Thanks !
CamperBot
@camperbot
Jul 31 2016 10:46
lordyamanouchi sends brownie points to @adityaparab :sparkles: :thumbsup: :sparkles:
:cookie: 424 | @adityaparab |http://www.freecodecamp.com/adityaparab
Chandrahas P
@Chan11
Jul 31 2016 10:47
Hi,How to shift entire unordered list to center
Darth Skywalker
@adityaparab
Jul 31 2016 10:47
@Chan11 Show your html markup
Darth Skywalker
@adityaparab
Jul 31 2016 10:47

@LordYamanouchi

More specifically - https://www.goodreads.com/api/documentation

@Chan11 : You can use class="text-center" on a div that wraps your ul element like
<div class="text-center">
    <ul>
         <li>...
    </ul>
</div>
LordYamanouchi
@LordYamanouchi
Jul 31 2016 10:51
@adityaparab SO I need a developer key. Do most of the websites that I could get quotes from need a developer key?
Chandrahas P
@Chan11
Jul 31 2016 10:52
@adityaparab only text is moving to center. pls look at this https://codepen.io/Chan11/full/zBLLdm/
Darth Skywalker
@adityaparab
Jul 31 2016 10:52
@LordYamanouchi : No Idea mate! You will have to look around for that. :)
Chandrahas P
@Chan11
Jul 31 2016 10:53
@adityaparab Pls open my pen page in new tab. its looking odd
Darth Skywalker
@adityaparab
Jul 31 2016 10:54
@Chan11 : Yes. It will move everything to center. :) What is your desired output?
how doyou want it to look like?
Chandrahas P
@Chan11
Jul 31 2016 10:54
need to look like below page: https://codepen.io/FreeCodeCamp/full/NNvBQW/
Darth Skywalker
@adityaparab
Jul 31 2016 10:56
@Chan11 : Well.. Then. you ahve many things to fix. :)
You don't have a container in your page.
you will have to study bootstrap grid system to make your alignment look like this.
A quick solution, for now, would be
<div class="col-md-8 col-md-offset-3">
    <ul>
         <li>...
    </ul>
</div>
Mark
@cityproject
Jul 31 2016 10:59
could anyone help me with my login system? i want to load a logout button once the user is securely logged in. http://192.241.153.25:8000
$('#login_form').on('submit', function(e) { e.preventDefault()

    $.ajax({
      type:"POST",
      url: '/api/users/login/',
      data:$('#login_form').serialize(),
      error: function(response){
        alert('Not authorized.');  // Or something in a message DIV
      },
      success: function(response){
        console.log(response);
        $('.login_bar').html(response)
        $('.login_bar').html(response)
        $('#logout_form').toggleClass(show)
      // do something with response
   }
  });

});
Maulik Darji
@maulikdarji
Jul 31 2016 10:59
@Chan11 changing your <div class="text-center"> .. <ul> ..<li> .. to <div class=" container text-left"> will work
Darth Skywalker
@adityaparab
Jul 31 2016 11:00

@cityproject :smile:
Shouldn't

$('#logout_form').toggleClass(show)

be

$('#logout_form').toggleClass('show')

?

Mark
@cityproject
Jul 31 2016 11:01
yeah. those codes in the end don't really make much difference. i need to rewrite anyways
Chandrahas P
@Chan11
Jul 31 2016 11:01
@adityaparab i've learned some basics about bootstrap grid system in fcc,but have no clue how to apply. have to look at it again. Thanks for help. @maulikdarji Will try it,thanks .
CamperBot
@camperbot
Jul 31 2016 11:01
chan11 sends brownie points to @adityaparab and @maulikdarji :sparkles: :thumbsup: :sparkles:
:cookie: 425 | @adityaparab |http://www.freecodecamp.com/adityaparab
:cookie: 612 | @maulikdarji |http://www.freecodecamp.com/maulikdarji
Darth Skywalker
@adityaparab
Jul 31 2016 11:02

@cityproject

yeah. those codes in the end don't really make much difference. i need to rewrite anyways

They do make a huge difference.

show would mean a variable
'show' means a string.

Mark
@cityproject
Jul 31 2016 11:03
i mean, i don't use that code anymore.
so it will be
$('#login_form').on('submit', function(e) { e.preventDefault()

    $.ajax({
      type:"POST",
      url: '/api/users/login/',
      data:$('#login_form').serialize(),
      error: function(response){
        alert('Not authorized.');  // Or something in a message DIV
      },
      success: function(response){
        console.log(response);
   }
  });

});
instead.
I'm looking for ways to print logout button instead of login button once a user logs in.
Darth Skywalker
@adityaparab
Jul 31 2016 11:05
@cityproject : SHow your HTML markup
Mark
@cityproject
Jul 31 2016 11:06
<div class="login_div" > <!--ng-controller="login_controller"-->
<form id="login_form" method="post" action="{% url 'login' %}">
{% csrf_token %}

          <div class="field-wrap">
          <!--<label>
            Email Address
          </label>-->
          <input required="" type="text" name="username" placeholder="Username">
        </div>

        <div class="field-wrap">
          <!--<label>
            Password
          </label>-->
          <input required="" type="password" name="password" placeholder="Password">
        </div>

        <button class="progress-button forgot" data-style="rotate-angle-bottom" data-perspective data-horizontal>
          <span class="progress-wrap">
            <span class="content">Forgot Password?</span>
              <span class="progress">
              <span class="progress-inner"></span>
            </span>
          </span>
        </button>
<br>
        <button class="ladda-button button-primary login_button" ng-click="vm.submit()"/><span class="ladda-label">Log In</span></button>

        </form>
</div>
so, when the user logs in, the login form and login button should be replaced with logout button and username.
without refreshing the page
Norvin Burrus
@ndburrus
Jul 31 2016 11:38
Phanindra M
@PhaniMaddi
Jul 31 2016 11:46
which is better Bootstrap 3 or Bootstrap 4?
Darth Skywalker
@adityaparab
Jul 31 2016 12:03
@cityproject :smile:
Sorry, I've been away from this room for a while
Mark
@cityproject
Jul 31 2016 12:04
ah it's okay.
Darth Skywalker
@adityaparab
Jul 31 2016 12:04
1) You don't have logout button on your page.
Mark
@cityproject
Jul 31 2016 12:04
i get that all the time :)
Darth Skywalker
@adityaparab
Jul 31 2016 12:04
2) I see some Angular JS things in your page!
and still you're using jquery
Mark
@cityproject
Jul 31 2016 12:04
yes.
i am not good at angular :(
so certain things must be done using jQuery.
Darth Skywalker
@adityaparab
Jul 31 2016 12:05
@cityproject lol. With Angular, this will be a piece of cake!
anyway, let's solve your log out button problem first
Mark
@cityproject
Jul 31 2016 12:06
i thought that, replacing login button with logout button can be done using html tag
so yeah
Darth Skywalker
@adityaparab
Jul 31 2016 12:07
Put this at the end of your template
<div><button id="logout" style="display:none;">Log Out</button></div>
and your ajax

    $.ajax({
      type:"POST",
      url: '/api/users/login/',
      data:$('#login_form').serialize(),
      error: function(response){
        alert('Not authorized.');  // Or something in a message DIV
      },
      success: function(response){
        console.log(response);
        $(this).css('display','none');
        $('button#logout').css('display','block');
   }
  });
Mark
@cityproject
Jul 31 2016 12:11
oh yrah
yeah*
why didn't i think of this solution?
Darth Skywalker
@adityaparab
Jul 31 2016 12:14
You wnat to solve it using Angular way?
Mark
@cityproject
Jul 31 2016 12:14
if that's more seamless yes
Darth Skywalker
@adityaparab
Jul 31 2016 12:15
It's seamless for everyone :D
do you have any angular code already?
Mark
@cityproject
Jul 31 2016 12:16
ah yes. i have one for displaying the contents.
Darth Skywalker
@adityaparab
Jul 31 2016 12:17
Share that code
let's modify it
Mark
@cityproject
Jul 31 2016 12:17
sec
Darth Skywalker
@adityaparab
Jul 31 2016 12:20
What directive is for login?
Mark
@cityproject
Jul 31 2016 12:20
login's just ajax
Darth Skywalker
@adityaparab
Jul 31 2016 12:21
does that code belong to posts.html?
the html code i mean
Mark
@cityproject
Jul 31 2016 12:21
you can try with test, test1234 for id and password each
sec.
login's inside the index.html
the angular js code has two templates
post.html and posts.html
i have to leave my room for 15 minutes though :(
brb
Muhammad Sirajuddeen
@sirajtechy
Jul 31 2016 12:25
Let's continue mark. Post ur questions
Come back let's try
Dariusz Biskupski
@Visiona
Jul 31 2016 12:26
Hi all, I wonder if anyone can help me understand why a bunch of divs position: relative is overlapping my top navbar positioned as fixed
Muhammad Sirajuddeen
@sirajtechy
Jul 31 2016 12:30
Try this
<div id="nav"><!-- here u put your options --></div><script>
position : relative;
top :0%;
height :100px;</script>
Hi Dariusz ,try this and lemme know.
Mark
@cityproject
Jul 31 2016 12:38
and I'm back.
Dariusz Biskupski
@Visiona
Jul 31 2016 12:41
I haven't added script to html yet, I have <header class="navbar">...</header> ... I put this script underneath but didn't help:(
Norvin Burrus
@ndburrus
Jul 31 2016 12:56
@Visiona are you using nested divs?
Muhammad Sirajuddeen
@sirajtechy
Jul 31 2016 12:58
Send me ur navbar properties
Vishal Bansal
@Vishal0024
Jul 31 2016 13:14
hi all...i need help with Random quote machine...
anybody can help?
d1sr3
@d1sr3
Jul 31 2016 13:20
hello does anybody know about some recent changes in openweahtermap api, I just realised my project has stoped working, ajax call is suddenly returning an error
Dylan
@dhcodes
Jul 31 2016 13:40
@d1sr3 i'm assuming you're on chrome
in which case, chrome stopped allowing html5 location to be transmitted over http (requires https)
you could get location via ip and it would still work in chrome but not be quite as accurate @d1sr3
d1sr3
@d1sr3
Jul 31 2016 13:53
@dhcodes firefox
Andrew Perrin
@Pezz18
Jul 31 2016 14:00
Hi all, a few months back i completed the weather API challenge, last night I was browsing through my code pen account and noticed this particular pen appears to be no longer working as expected,, can anyone help me work out whats gone wrong??? http://codepen.io/pezz18/pen/EKYpNO
Stephen James
@sjames1958gm
Jul 31 2016 14:01
@Pezz18 If you are running chrome then navigator.geolocation.getCurrentPosition this no longer works from http urls
Andrew Perrin
@Pezz18
Jul 31 2016 14:01
@sjames1958gm ah, ok, so is there an alternative?
ajayadav09
@ajayadav09
Jul 31 2016 14:02
can some one help me understand what is async and sunc in javascript?
Andrew Perrin
@Pezz18
Jul 31 2016 14:02
let me test it in firefox too..
Ademola Adegbuyi
@ooade
Jul 31 2016 14:02
@Pezz18 use http://ipinfo.io as an alternative
d1sr3
@d1sr3
Jul 31 2016 14:02
@Pezz18 i have got the same problem as u and I'm using firefox
Stephen James
@sjames1958gm
Jul 31 2016 14:02
@Pezz18 Also ip-api.com/json
Andrew Perrin
@Pezz18
Jul 31 2016 14:03
ok, @sjames1958gm are these pretty easy to implement then?
Stephen James
@sjames1958gm
Jul 31 2016 14:03
@Pezz18 Yeah, just have to use getJSON to get the data rather than getCurrentPosition.
@Pezz18 I had to make the same change.
Ademola Adegbuyi
@ooade
Jul 31 2016 14:04
same ere
Andrew Perrin
@Pezz18
Jul 31 2016 14:04
ok, i will have a look,,, how do ip address locations work? as i am based in Leicestershire UK, yet i notice the positions always pull my ip address as being located in Reading UK!
Stephen James
@sjames1958gm
Jul 31 2016 14:06
@Pezz18 Yeah, not real accurate, but I guess good enough for this kind of challenge. A real application would run under https:// and not have this problem
d1sr3
@d1sr3
Jul 31 2016 14:06
@sjames1958gm is it surely the problem? When I tried to console.log my position I got it withour problems
Stephen James
@sjames1958gm
Jul 31 2016 14:08
@d1sr3 getCurrentPosition() and watchPosition() are deprecated on insecure origins. To use this feature, you should consider switching your application to a secure origin, such as HTTPS. See https://goo.gl/rStTGz for more details. this is from the console when I run his pen from chrome. At least a newish chrome
Chrome/51.0.2704.103
d1sr3
@d1sr3
Jul 31 2016 14:14
@sjames1958gm I set up my coordinates manually and got the same error
Ademola Adegbuyi
@ooade
Jul 31 2016 14:15
@d1sr3 are you using openweather??
Ademola Adegbuyi
@ooade
Jul 31 2016 14:15
@d1sr3 openweather don't allow unsecured calls again
@d1sr3 make use of https://
d1sr3
@d1sr3
Jul 31 2016 14:19
@marhyorh It didn't help
Ademola Adegbuyi
@ooade
Jul 31 2016 14:19
@d1sr3 how did you make the call?
@d1sr3 they still allow http:// tho
d1sr3
@d1sr3
Jul 31 2016 14:21
@marhyorh $.ajax({ url: 'http://api.openweathermap.org/data/2.5/find?lat=10&lon=10&cnt=1&appid=14c16869c29c68a5909a55fb623e1397', success: function(response) { console.log(response); } });
Thomas Burgess
@ThomasBurgess2000
Jul 31 2016 14:22
Hey, for the JavaScript basic algorithm challenge "Return Largest Number in Array" this is the code I was trying, and it seemed to output the exact results it was looking for, but for some reason it's not accepting it as the solution.
var largestNumbers=[];
function largestOfFour(arr) {
  for (i=0; i<4; i++){
    var highest=0;
    for (a=0;a<4;a++){
      if (arr[i][a]>highest){
        highest=arr[i][a];        
      }
    }
    largestNumbers.push(highest);
  }
  return largestNumbers;
}
largestOfFour([[4, 5, 1, 3], [13, 27, 18, 26], [32, 35, 37, 39], [1000, 1001, 857, 1]]);
Stephen James
@sjames1958gm
Jul 31 2016 14:22
@ThomasBurgess2000 Cannot use globals as FCC will run your code multiple times and the global is not reset
Ademola Adegbuyi
@ooade
Jul 31 2016 14:23
@d1sr3 it works here!
Joel Abees
@JoelAbees
Jul 31 2016 14:23
Hey guys, I need help.
Ademola Adegbuyi
@ooade
Jul 31 2016 14:23
@d1sr3 use $.getJSON() if your ajax call don't work but its working ere.. Share your pen
Thomas Burgess
@ThomasBurgess2000
Jul 31 2016 14:24
Thank you so much, that fixed it @sjames1958gm
CamperBot
@camperbot
Jul 31 2016 14:24
thomasburgess2000 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 2249 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
CloudyShows
@CloudyShows
Jul 31 2016 14:24
I'm making a portfolio site and i've made a navbar by looking at some examples on w3schools (I hope this isn't cheating). How do I make it so when I click a button on the navbar to scrolls to that part of the page? I'm guessing it has something to do with making an ID at each part of the page I want navigated to then using some sort of page scroll to id function? Thanks!
Joel Abees
@JoelAbees
Jul 31 2016 14:26
I'm doing the random quote machine.
here is a skeletal version.
http://codepen.io/JoelAbees/full/JKBBOz/
my problem: Each time I press the button, A different quote should be displayed. I don't know how to do this. can you guys help me, what should I search for in google? can you fram my search? or help me with some links?
d1sr3
@d1sr3
Jul 31 2016 14:29
@marhyorh $.getJSON didn't help https://codepen.io/d1sr3/pen/mEBxYd?editors=1111
Joel Abees
@JoelAbees
Jul 31 2016 14:29
@CloudyShows you need to enclose each segments( home, contact, works) inside <div>
give Id to the divs and link the id to the buttons in the nav bar
Ademola Adegbuyi
@ooade
Jul 31 2016 14:30
@d1sr3 navigator.geolocation is aving issues
d1sr3
@d1sr3
Jul 31 2016 14:31
@marhyorh When I disabled it and set coordinates manually it didn't work either
Ademola Adegbuyi
@ooade
Jul 31 2016 14:32
@d1sr3 because its wrapped inside navigator.geolocation function
demmak
@demmak
Jul 31 2016 14:33
@JoelAbees You can try to put your quotes in js array and use random funtion to put a different one each time to your page
Dariusz Biskupski
@Visiona
Jul 31 2016 14:33
Thanks for checking all involved, it occured simple z-index: 100; sorted whole problem... No need for scripts thankfully
d1sr3
@d1sr3
Jul 31 2016 14:36
@marhyorh I said I have tried it without the navigator.geolocation function and it hasn't helped
Joel Abees
@JoelAbees
Jul 31 2016 14:36
@demmak will give it a go.
Ademola Adegbuyi
@ooade
Jul 31 2016 14:42
@d1sr3 read the log message. The request was blocked because you're trying to access it via https://
@d1sr3 openweather don't av an https for now
Joel Abees
@JoelAbees
Jul 31 2016 14:47
@demmak coluld you look at my code and tell me what needs to be done?
Andrew Perrin
@Pezz18
Jul 31 2016 14:49
hi, im back, struggling to understand how to get my getJSON call to run correctly,,,
how do you get it to set the lat data to a variable??
demmak
@demmak
Jul 31 2016 14:50
@JoelAbees sorry, but my laptop just discharged, are you ok if I'll check it in few hours ?
Andrew Perrin
@Pezz18
Jul 31 2016 14:50

current code ive been using is:

$.getJSON('http://ipinfo.io/', function(data){
lat = data.lat;
long = data.lon;
});

Xavier Velez
@JonSnow08
Jul 31 2016 14:52
@Pezz18 i'll see if I can help you out
@Pezz18 you're trying to get location data?
Andrew Perrin
@Pezz18
Jul 31 2016 14:54
@JonSnow08 thanks, yeah, im re-visiting my weather API challenge since the geo.location option has stopped working, so it was suggested to use a get JSON request to pull the long / lat data instead...
CamperBot
@camperbot
Jul 31 2016 14:54
pezz18 sends brownie points to @jonsnow08 :sparkles: :thumbsup: :sparkles:
:cookie: 307 | @jonsnow08 |http://www.freecodecamp.com/jonsnow08
Andrew Perrin
@Pezz18
Jul 31 2016 14:54
Xavier Velez
@JonSnow08
Jul 31 2016 14:54
@Pezz18 that api you're using doesn't seperate latt and long
@Pezz18 so that call you're using wont return anything
Andrew Perrin
@Pezz18
Jul 31 2016 14:56
ok, i see, i've switched to an alternative...ap-api.com
in the code pen, you can see this commented out,
Xavier Velez
@JonSnow08
Jul 31 2016 14:57
@Pezz18 I tried going to ap-api.com but documentation wont load
@Pezz18 your geolocation isn't working?
Andrew Perrin
@Pezz18
Jul 31 2016 14:58
Xavier Velez
@JonSnow08
Jul 31 2016 14:58
ah ip-api not ap lol
okay cool
Andrew Perrin
@Pezz18
Jul 31 2016 15:00
when i first completed the challenge a few months ago, it all worked fine, yet it no longer is, i queried it on here, and some people suggested that google chrome no longer support geo.location for non https requests..
Anthony
@EpocVargVici
Jul 31 2016 15:00
Could someone tell me a different way on doing this? Challenge Check for Palindromes
function palindrome(str) {
  // Good luck!

  var strReplaced = str.replace(/[\s+.,\/#!$%\^&\*;:{}=\-_`~()]/g,"");
  var strLowerCase = strReplaced.toLowerCase();
  var strSplitted = strLowerCase.split("");
  var strReversed = strSplitted.reverse();
  var strJoined = strReversed.join('');


  if(strLowerCase === strJoined) {
    return true;
  } else {
    return false;
  }
}



palindrome("_eye");
Mikail Bayram
@mikail1998
Jul 31 2016 15:02
@EpocVargVici is yout code wotking ?
working**
your*
Anthony
@EpocVargVici
Jul 31 2016 15:02
It has been accepted as correct yes
Mikail Bayram
@mikail1998
Jul 31 2016 15:03
@EpocVargVici so you just want to see another way of doing it?
Anthony
@EpocVargVici
Jul 31 2016 15:03
Yes
Andrew Perrin
@Pezz18
Jul 31 2016 15:03
@JonSnow08 so do you see what i mean now?
Xavier Velez
@JonSnow08
Jul 31 2016 15:03
@Pezz18 yup
i had to do the exact same thing
Mikail Bayram
@mikail1998
Jul 31 2016 15:04
@EpocVargVici I would like to help, you but I have done it the same way hahahaha
Anthony
@EpocVargVici
Jul 31 2016 15:04
@mikail1998 Alrigthy then ^^
Xavier Velez
@JonSnow08
Jul 31 2016 15:07

$.get('http://ip-api.com/json', function(loc){
lat = loc.lat;
long = loc.lon ;
});
@Pezz18
Andrew Perrin
@Pezz18
Jul 31 2016 15:09
@JonSnow08 ok, so i understand how that should work, but i can see that my pen is still not showing any data,, and when i do an alert on the lat variable, it returns "undefined"
Xavier Velez
@JonSnow08
Jul 31 2016 15:10
@Pezz18 link codepen again plz
Joel Abees
@JoelAbees
Jul 31 2016 15:10
@demmak Yeah sure.
Sjy
@sanj1591
Jul 31 2016 15:13
var myStr = "FirstLine \n \SecondLine\ \r ThirdLine"; // Change this line
Need Help :confused:
Christopher
@subtlefluids01
Jul 31 2016 15:16
hi guys can someone check what's wrong with my code on falsy bouner challenge
Norvin Burrus
@ndburrus
Jul 31 2016 15:19
@sanj1591
ok, we need to take the given string, here:
"FirstLine newline backslash SecondLine backslash carriage-return ThirdLine" (ignore the spacing) and replace the appropriate text (bold words) with the escape coding (use the Code/Output chart)...
@subtlefluids01 code?
Christopher
@subtlefluids01
Jul 31 2016 15:21

function isFalsy(n){
return n !== null && n !== undefined && n !== false && n !== 0 && n !== "" && n!== isNaN(true);

}
function bouncer(arr) {
// Don't show a false ID to this bouncer.

return arr.filter(isFalsy);
}

bouncer([7, "ate", "",false, null, 9, null, undefined, NaN]);

it didnt work out for isNaN(true), i tried changing the value for isNaN() parameter but never worked out well
Norvin Burrus
@ndburrus
Jul 31 2016 15:23
@subtlefluids01 did you consider using the boolean object?
Andrew Perrin
@Pezz18
Jul 31 2016 15:23
@JonSnow08 hey, how are you getting on!? hope my code isnt too confusing!
Christopher
@subtlefluids01
Jul 31 2016 15:24
@ndburrus I googled about it, but i thought arr.filter is easier ?
Xavier Velez
@JonSnow08
Jul 31 2016 15:24
@Pezz18 no not at all just reading through right now
stonefmagiecurata
@stonefmagiecurata
Jul 31 2016 15:24
@subtlefluids01 'n!== isNaN(true)' is bad
@subtlefluids01 !isNaN(n)
Christopher
@subtlefluids01
Jul 31 2016 15:25
@stonefmagiecurata what's the correct way ? tell me bro
ah okay
stonefmagiecurata
@stonefmagiecurata
Jul 31 2016 15:25
@subtlefluids01 you have to pass the param to isNaN
@subtlefluids01 and that will return true or false
Christopher
@subtlefluids01
Jul 31 2016 15:25
@stonefmagiecurata oh thanks dude!
CamperBot
@camperbot
Jul 31 2016 15:25
subtlefluids01 sends brownie points to @stonefmagiecurata :sparkles: :thumbsup: :sparkles:
:cookie: 273 | @stonefmagiecurata |http://www.freecodecamp.com/stonefmagiecurata
Norvin Burrus
@ndburrus
Jul 31 2016 15:25

@subtlefluids01

The Boolean object represents two values, either "true" or "false". If value parameter is omitted or is 0, -0, null, false, NaN, undefined, or the empty string (""), the object has an initial value of false.

Christopher
@subtlefluids01
Jul 31 2016 15:26
@ndburrus got it solved, thanks mate!
CamperBot
@camperbot
Jul 31 2016 15:26
subtlefluids01 sends brownie points to @ndburrus :sparkles: :thumbsup: :sparkles:
:star2: 1228 | @ndburrus |http://www.freecodecamp.com/ndburrus
Norvin Burrus
@ndburrus
Jul 31 2016 15:26
@subtlefluids01 way to go! :+1:
Christopher
@subtlefluids01
Jul 31 2016 15:27
the idea behind using boolean, because all falsy will return false immediately ? @ndburrus
Xavier Velez
@JonSnow08
Jul 31 2016 15:27
@Pezz18 move the var lat; var lon; declarations inside the document ready function
@Pezz18 should fix your issue
$(document).ready(function(){
  var long;
var lat;
  $.getJSON("http://ip-api.com/json/", function(data) {
   lat = data.lat;
    long = data.lon;
    console.log(lat);
   });

  getWeather(metric[0], metric[1], metric[2], sun);
@ndburrus hey buddy how are you?
Norvin Burrus
@ndburrus
Jul 31 2016 15:28
@subtlefluids01 well, it takes care of all the falsy values....
@JonSnow08 im good! how are you? nice to see you!
Andrew Perrin
@Pezz18
Jul 31 2016 15:29
@JonSnow08 ahhh, thanks alot :) seems so simple! got there in the end! cheers
CamperBot
@camperbot
Jul 31 2016 15:29
pezz18 sends brownie points to @jonsnow08 :sparkles: :thumbsup: :sparkles:
:warning: pezz18 already gave jonsnow08 points
Xavier Velez
@JonSnow08
Jul 31 2016 15:30
@Pezz18 its always the simplest things, I spent hours trying to find mistakes in my code last night only to find out my .css calls weren't closed properly. every single one, I messed up when I used a replace function sublime text has
@ndburrus not much man, almost done with my front end. once I finish the Simon game I'm all done
Andrew Perrin
@Pezz18
Jul 31 2016 15:31
ah yeah, thats my next task now,, converting my codepen into a html, css and js script files to load from my desktop
Norvin Burrus
@ndburrus
Jul 31 2016 15:31
@JonSnow08 nice work! :sparkles:
Xavier Velez
@JonSnow08
Jul 31 2016 15:32
@Pezz18 you can export it to github and then you just have to put the css and js links in there
@Pezz18 if you need help, let me know
@ndburrus thank you, how are you?
CamperBot
@camperbot
Jul 31 2016 15:32
jonsnow08 sends brownie points to @ndburrus :sparkles: :thumbsup: :sparkles:
:star2: 1229 | @ndburrus |http://www.freecodecamp.com/ndburrus
Andrew Perrin
@Pezz18
Jul 31 2016 15:37
@JonSnow08 well, i have copied and pasted the html, css and js into their own files, the html and css appear to be linked, but the js isnt running, ive added a script tag in my head - and think i have linked jquery correctly too?
Xavier Velez
@JonSnow08
Jul 31 2016 15:43
I'm having a bit of trouble with my simon game if anybody has a second
@Pezz18 do you have them in the same folder?
Andrew Perrin
@Pezz18
Jul 31 2016 15:45
yeah. have a main folder, then an assets folder with stylesheets, js etc,,
Xavier Velez
@JonSnow08
Jul 31 2016 15:45
whats your script link look like
Andrew Perrin
@Pezz18
Jul 31 2016 15:47
@JonSnow08 <script type="text/javascript" src="assets/javascript/script.js"></script>
i converted over the random quote generator challenge ok though!
Norvin Burrus
@ndburrus
Jul 31 2016 15:48
@JonSnow08 :point_up: July 31, 2016 11:28 AM
Andrew Perrin
@Pezz18
Jul 31 2016 15:50
@JonSnow08 i also have these links: not sure what each one is actually for though!
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<script type="text/javascript" src="assets/javascript/script.js"></script>
<script src="//use.edgefonts.net/quicksand.js"></script>
Xavier Velez
@JonSnow08
Jul 31 2016 15:58
that first one is for jquery
the second is jqueryui
the third is your js link
and the fourth is for quicksand
if anybody has a moment to help me figure out why my simon game isn't working i'd appreciate it
im getting an error in browser console when i click start that I dont understand
Karolis
@Karoliss
Jul 31 2016 16:23
Hello everyone . Can anyone tell me how to do photo and text like this how its done here ? https://codepen.io/FreeCodeCamp/full/NNvBQW/ I tried like this - but it isn't the same <img class="smaller-image" src="http://static1.squarespace.com/static/5256f6e4e4b086e2b62842e2/t/54bbbd61e4b077c90273b411/1421589862757/" alt"dr norman borlaug" style='display:under;'/>
<p style='display:under;'> 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>
Don Price
@KingHippo
Jul 31 2016 16:41
Can anyone tell my why this code is not parsing json?
  // link to profile id
  var profile = 'https://peaceful-springs-7920.herokuapp.com/profile/';
  // link to articles
  var content = 'https://peaceful-springs-7920.herokuapp.com/content/';

    $.getJSON(profile, function(json){
        console.log(json.profileId);
    });


 });
Nicolas Crumrine
@CrumrineCoder
Jul 31 2016 16:47
Try console logging json
Don Price
@KingHippo
Jul 31 2016 16:50
@CrumrineCoder ok
@CrumrineCoder It's not working. I get an error in console "CORS header 'Access-Control-Allow-Origin' missin"
I am able to get data back when I use node.js but not jquery
Ken Haduch
@khaduch
Jul 31 2016 16:54
@Luomint you do not have a file name for your photo, "something.jpg", at the end of your url. And it should be "alt="
Mahak Narayan Singh
@makkBit
Jul 31 2016 16:54
I'm starting with build a pomodoro clock project, Can someone please provide me some references on how to deal with the timer/clock ?
Nicolas Crumrine
@CrumrineCoder
Jul 31 2016 16:56
Try opening dev tools and see if you're getting an error there
@KingHippo
Honestly I don't really know I'm just spitballing
Xavier Velez
@JonSnow08
Jul 31 2016 17:06
@makkBit you'll want to use setInterval
@makkBit you'll also have to use Math.floor() and modulo to get it to display time properly
@makkBit if you need more help once you've started writing, let me know
Anshul Jain
@ajain706
Jul 31 2016 17:08
need help
In Word Blanks lesson
Xavier Velez
@JonSnow08
Jul 31 2016 17:09
@ajain706 post your code
Anshul Jain
@ajain706
Jul 31 2016 17:10

function wordBlanks(myNoun, myAdjective, myVerb, myAdverb) {
var result = "";
// Your code below this line

// Your code above this line
return result;
}

// Change the words here to test your function
wordBlanks("dog", "big", "ran", "quickly");

Xavier Velez
@JonSnow08
Jul 31 2016 17:10
@ajain706 but you'll want to go to the Javascript help channel in the future for stuff like this
help formatting
CamperBot
@camperbot
Jul 31 2016 17:10
no wiki entry for: formatting
Xavier Velez
@JonSnow08
Jul 31 2016 17:10
help format
CamperBot
@camperbot
Jul 31 2016 17:10

:point_right: code formatting [wiki]

Multi line Code

```js ⇦ Type 3 backticks and then press [shift + enter ⏎] (type js or html or css)

<paste your code here>,
then press [shift + enter ⏎]

``` ⇦ Type 3 backticks, then press [enter ⏎]

Single line Code

This an inline `<paste code here>` code formatting with a single backtick() at _start_ and _end_ around thecode`.

See also: ☛ How to type Backticks | ☯ Compose Mode | ❄ Gitter Formatting Basics

:pencil: read more about code formatting on the FCC Wiki

Xavier Velez
@JonSnow08
Jul 31 2016 17:11
@ajain706 i can't help you if you haven't even written anything mate...
Mahak Narayan Singh
@makkBit
Jul 31 2016 17:11
thanks @JonSnow08
CamperBot
@camperbot
Jul 31 2016 17:11
makkbit sends brownie points to @jonsnow08 :sparkles: :thumbsup: :sparkles:
:cookie: 308 | @jonsnow08 |http://www.freecodecamp.com/jonsnow08
Xavier Velez
@JonSnow08
Jul 31 2016 17:11
@ajain706 you gotta give some effort and then we can talk about why what you tried did or didnt work
@makkBit np
Anshul Jain
@ajain706
Jul 31 2016 17:12
i tried but then i reset my code @JonSnow08
Xavier Velez
@JonSnow08
Jul 31 2016 17:12
what did you try?
Anshul Jain
@ajain706
Jul 31 2016 17:12
i tried to put the variables in the result variable
then i tried to change the strings
but i not able to understand what the challage is
challenge*
Xavier Velez
@JonSnow08
Jul 31 2016 17:14
@ajain706 you have to create a sentence using the variables from the function
so lets say I had this
Japneet Singh
@japsuchiha
Jul 31 2016 17:15
how to make a one page scroll using jquery ??
Anshul Jain
@ajain706
Jul 31 2016 17:15
ok @JonSnow08
Xavier Velez
@JonSnow08
Jul 31 2016 17:16
function madLib(adj, noun,){
var sentence =  "My " + noun + "is" + adj;
return sentence 
}
Don Price
@KingHippo
Jul 31 2016 17:17
@CrumineCoder I get an error in console "CORS header 'Access-Control-Allow-Origin' missing"
Xavier Velez
@JonSnow08
Jul 31 2016 17:17
if noun was dog and adj was cool return sentence would return "My dog is cool"
@ajain706 get it now?
Anshul Jain
@ajain706
Jul 31 2016 17:18
yea ok @JonSnow08
Xavier Velez
@JonSnow08
Jul 31 2016 17:18
@ajain706 give it a try and tell me what you get
Anshul Jain
@ajain706
Jul 31 2016 17:18
yup bro thanks @JonSnow08
CamperBot
@camperbot
Jul 31 2016 17:18
ajain706 sends brownie points to @jonsnow08 :sparkles: :thumbsup: :sparkles:
:cookie: 309 | @jonsnow08 |http://www.freecodecamp.com/jonsnow08
Xavier Velez
@JonSnow08
Jul 31 2016 17:19
@ajain706 don't forget to put spaces into your string or add a noun + " " + "is"
Anshul Jain
@ajain706
Jul 31 2016 17:19
yes bro @JonSnow08
Xavier Velez
@JonSnow08
Jul 31 2016 17:19
any problems let me know
Zeeshan Haider
@zeeshan72
Jul 31 2016 17:35
I just finished the weather app.
Ben Line
@Benwebdev
Jul 31 2016 17:37
Here for a while if anyone needs front end help :smile:
Rich
@richard-ball
Jul 31 2016 17:51
How can I select the object I am hovering over?
this $(this.id).mouseover(function(){ $(this.id).hide(); }); doesn't work
bsandusky
@bsandusky
Jul 31 2016 17:56
@richard-ball here’s an example of what you want to do: https://jsfiddle.net/zs45B/
@richard-ball You should be calling the event on ‘body’ and then targeting the event target for the second function
Ben Line
@Benwebdev
Jul 31 2016 17:57
@bsandusky your right 😃😎
jadczakd
@jadczakd
Jul 31 2016 17:58
This message was deleted
Ben Line
@Benwebdev
Jul 31 2016 18:00
It's the url 😏
readytocode123
@readytocode123
Jul 31 2016 18:05
@Benwebdev i'm just playing with building creativecode.co using a template, but having trouble actually going through the process of developing a sustainable website.. like is there a good resource of what checklist of things i need to decide on and then build? what advice do you have so i can get more clarity going through building it or rebuilding it from start to finish?
Rich
@richard-ball
Jul 31 2016 18:08
@bsandusky thanks
CamperBot
@camperbot
Jul 31 2016 18:08
richard-ball sends brownie points to @bsandusky :sparkles: :thumbsup: :sparkles:
:cookie: 326 | @bsandusky |http://www.freecodecamp.com/bsandusky
Damian Collier
@damianpcollier
Jul 31 2016 18:10
Hi, Just having a go at the random quote generator.
Where can you pull the quotes from?
I've tried a number of places but just seem to get errors
Thanks
Darth Skywalker
@adityaparab
Jul 31 2016 18:19
@damianpcollier goodreads.com has pretty good api for that
Rich
@richard-ball
Jul 31 2016 18:21
How do I access an object within an array by name? e.g. [{name: bob}, {name:jeff}]
Darth Skywalker
@adityaparab
Jul 31 2016 18:23

@richard-ball
by index?

like, assuming your array is called arr

var arr = [{name: bob}, {name:jeff}];

var myObj = arr[0];

console.log(myObj.name);
Additionally, you have syntax error (assuming bob and jeff are not variables declared somewhere)
it should be [{name: "bob"}, {name:"jeff"}]
RHCPsnow
@RHCPsnow
Jul 31 2016 18:26
is it a bad thing if other people can see my API key
Darth Skywalker
@adityaparab
Jul 31 2016 18:28
@RHCPsnow :I'd say, yes.
RHCPsnow
@RHCPsnow
Jul 31 2016 18:28
Thanks
Rich
@richard-ball
Jul 31 2016 18:28
@adityaparab I don't know the index.
Darth Skywalker
@adityaparab
Jul 31 2016 18:28
Do you know name?
Rich
@richard-ball
Jul 31 2016 18:29
yes
Darth Skywalker
@adityaparab
Jul 31 2016 18:29
I see your question now..
You can iterate over array.
var myObj;
var name = "bob";
for( var i=0; i < arr.length; i++){
    if(arr[i].name === name){
        myObj = arr[i];
        break;
    }
}

console.log(myObj);
Darth Skywalker
@adityaparab
Jul 31 2016 18:34
ES6 Equivalent
var arr = [{name: "bob"}, {name:"jeff"}];
var name = "bob";

var filtered = arr.filter(x=>x.name === name);

var myObj = filtered[0];
Rich
@richard-ball
Jul 31 2016 18:35
thanks
How do i get the ID of the element that I am hover over?
Darth Skywalker
@adityaparab
Jul 31 2016 18:41
What is the element that you're hovering?
div, span, label or something else?
you can bind an event to that type of element. like
$('div').on('mouseover', function(e){
    var t = e.currentTarget;
    console.log(t.attr('id'));
});
Rich
@richard-ball
Jul 31 2016 18:47
an img
Darth Skywalker
@adityaparab
Jul 31 2016 18:48
then
$('img').on('mouseover', function(e){
    var t = e.currentTarget;
    console.log(t.attr('id'));
});
Rich
@richard-ball
Jul 31 2016 18:48
what is e?
Darth Skywalker
@adityaparab
Jul 31 2016 18:48
e is an event object that is passed implicitly by the JS
Rich
@richard-ball
Jul 31 2016 18:49
thanks
Darth Skywalker
@adityaparab
Jul 31 2016 18:49
in this case it will be an mouseover event object
Rich
@richard-ball
Jul 31 2016 18:49
can you recommend a good book on jquery?
Darth Skywalker
@adityaparab
Jul 31 2016 18:51
That's a tough one!
Becuase I come from pure javascript background.
I'd suggest you master pure javascript first if you REALLY want to be awesome. Then jQuery and whatever library framework will be a piece of cake
Rich
@richard-ball
Jul 31 2016 18:52
which books are good for javascript?
Darth Skywalker
@adityaparab
Jul 31 2016 18:52
There are many... You don't know JS is my gavorite
*favorite
Rich
@richard-ball
Jul 31 2016 18:52
I am getting t.attr is not a function error with the above code
You Don't Know JS: Scope & Closures?
Darth Skywalker
@adityaparab
Jul 31 2016 18:53

@richard-ball Sorry my bad.

it should be

var t = $(e.currentTarget);
Rich
@richard-ball
Jul 31 2016 18:56
thanks for these! :)
Darth Skywalker
@adityaparab
Jul 31 2016 18:59
Roger!
max77p
@max77p
Jul 31 2016 19:18
hi can anyone help me with my text overflow on my twitch app please
how do implement it when the description is larger than one line??
Darth Skywalker
@adityaparab
Jul 31 2016 19:30
@max77p : Can you explain what's the problem here?
max77p
@max77p
Jul 31 2016 19:34
@adityaparab i can't seem to get the .... if i shrink the size of the box holding the text
so lets say the description is "freecode camp is the best"
then if the box holding this description is smaller, it cuts off whatever word or words and displays something like this "freecode camp is..."
@adityaparab right now it just cuts off the words that are outside..but doesn't add the ... at end
if you play around with the width size
Mark
@cityproject
Jul 31 2016 19:36
@adityaparab hi
Darth Skywalker
@adityaparab
Jul 31 2016 19:38
@cityproject Greetings!
Mark
@cityproject
Jul 31 2016 19:38
hi.
it's 4:30 AM for me
just woke up..
Darth Skywalker
@adityaparab
Jul 31 2016 19:39
@max77p Alright. Let me see. Must be an issue with ellipsis
@cityproject You wake up too early!
Mark
@cityproject
Jul 31 2016 19:39
yep
max77p
@max77p
Jul 31 2016 19:40
@adityaparab please refresh the link i gave so you have updated one i am working with.
Darth Skywalker
@adityaparab
Jul 31 2016 19:41
okay
Mark
@cityproject
Jul 31 2016 19:42
so are you good at angular and django @adityaparab ?
Darth Skywalker
@adityaparab
Jul 31 2016 19:42
Angular. Not much of a fond of django
Mark
@cityproject
Jul 31 2016 19:43
okay.
well the site I'm creating is built using django, and i'm having some problem with it
max77p
@max77p
Jul 31 2016 19:47
@adityaparab any luck?
Darth Skywalker
@adityaparab
Jul 31 2016 19:48
Yeah.. can you wrap your text inside a span?
Mark
@cityproject
Jul 31 2016 19:48
I'm still new to angular, and i need a bit of help with it.
Darth Skywalker
@adityaparab
Jul 31 2016 19:49
@cityproject :Sure.. the code that you shared before... I didn't see any index.html there
Mark
@cityproject
Jul 31 2016 19:49
index.html is this : http://192.241.153.25:8000
i wrapped it inside a span
Mark
@cityproject
Jul 31 2016 19:49
post and posts.html, i can give source to you.
but i'll wait till you finish helping others.
Darth Skywalker
@adityaparab
Jul 31 2016 19:53
@max77p : You will have to make many changes.
First you're using container-fluid
class
max77p
@max77p
Jul 31 2016 19:54
@adityaparab why is that bad?
Darth Skywalker
@adityaparab
Jul 31 2016 19:54
so the container-fluid expects that it has rows
It's bad because, if you see the width of span, it goes way beyond your p tag.
max77p
@max77p
Jul 31 2016 19:56
@adityaparab ohh ok, so just make it container?
what else would i have to change?
Darth Skywalker
@adityaparab
Jul 31 2016 19:56
so your structure should be something like
<div class="container-fluid">
  <div class="row">
    <div class="col-xs-2">
      your image goes here.
    </div>
    <div class="col-xs-10">
      your text goes here
    </div>
  </div>
</div>
And you will have muliple "row"s
max77p
@max77p
Jul 31 2016 19:57
@adityaparab ohhh ok
so whenever i use container-fluid i should be having rows correct?
Darth Skywalker
@adityaparab
Jul 31 2016 19:57
yes.
max77p
@max77p
Jul 31 2016 19:57
or setting the row classes that is
ahh ok thanks @adityaparab ...something new i just learned lol
CamperBot
@camperbot
Jul 31 2016 19:57
max77p sends brownie points to @adityaparab :sparkles: :thumbsup: :sparkles:
:cookie: 432 | @adityaparab |http://www.freecodecamp.com/adityaparab
Darth Skywalker
@adityaparab
Jul 31 2016 19:57
Please read official documentation of bootstrap's grid system
These problems come up because you're now using bootstrap as it is intended
max77p
@max77p
Jul 31 2016 19:58
@adityaparab what if i just remove container?
err container-fluid
hehe, then you might get rid of bootstrap as well :D
studying it properly will save you a lot of efforts.
max77p
@max77p
Jul 31 2016 19:59
@adityaparab ahh so its better to have bootstrap than do everything manually is what i think you are saying?
Darth Skywalker
@adityaparab
Jul 31 2016 19:59
Correct...
max77p
@max77p
Jul 31 2016 19:59
@adityaparab sweet, thanks again!
CamperBot
@camperbot
Jul 31 2016 19:59
max77p sends brownie points to @adityaparab :sparkles: :thumbsup: :sparkles:
:warning: max77p already gave adityaparab points
Darth Skywalker
@adityaparab
Jul 31 2016 20:00
You're welcome :)
mnghm
@mnghm
Jul 31 2016 20:06
Hey guys, please could you check out my Pen for the Tribute Page? Please let me know your thoughts, thanks! :D
Pete
@petegarvin1
Jul 31 2016 20:11
hey @nghm looks good :D
like the timeline
hey has anyone completed the Simon game? Ive got the basic structure made, but I'm having trouble balancing timers. any help appreciated
mnghm
@mnghm
Jul 31 2016 20:14
@petegarvin1 Hey, thanks so much!
CamperBot
@camperbot
Jul 31 2016 20:14
nghm sends brownie points to @petegarvin1 :sparkles: :thumbsup: :sparkles:
:cookie: 433 | @petegarvin1 |http://www.freecodecamp.com/petegarvin1
fadyboy
@fadyboy
Jul 31 2016 20:24
Hi guys, I've just finished by random quote generator project, please see code here http://codepen.io/aofadero/full/jApLYd/
Anshul Jain
@ajain706
Jul 31 2016 20:42
hy
need help
max77p
@max77p
Jul 31 2016 20:47
@adityaparab you there?
or anyone, need help on border property for each stream section
having trouble getting a single white border around each stream section
help anyone?
CamperBot
@camperbot
Jul 31 2016 20:47
no wiki entry for: anyone
Joakim Bajoul Kakaei
@Todai88
Jul 31 2016 20:49
Yo boys,
Already asked in /help, but got no real suggestions there.
Basically I need help since my navbar button's :hover aren't firing off when I scroll the website and hit the sections / headers.
Here is the pen. Any help would be great!
https://codepen.io/Todai/pen/grKvjO
Anshul Jain
@ajain706
Jul 31 2016 20:50
@max77p what you want to do
max77p
@max77p
Jul 31 2016 20:50
@ajain706 i want a sepearte white border around each stream
in the sample each one is separated by its own white border
having trouble replicating that in my pen
Anshul Jain
@ajain706
Jul 31 2016 20:52
ok let me try @max77p
max77p
@max77p
Jul 31 2016 21:05
@ajain706 anyluck?
Anshul Jain
@ajain706
Jul 31 2016 21:05
no bro still trying @max77p and yo?
you?
max77p
@max77p
Jul 31 2016 21:08
@ajain706 got the different color for online to spread over text and image but still having trouble with the white border
Joakim Bajoul Kakaei
@Todai88
Jul 31 2016 21:08
Yo boys,
Already asked in /help, but got no real suggestions there.
Basically I need help since my navbar button's :hover aren't firing off when I scroll the website and hit the sections / headers.
Here is the pen. Any help would be great!
https://codepen.io/Todai/pen/grKvjO
Anshul Jain
@ajain706
Jul 31 2016 21:18
@max77p
.off, .off1{
height:3em;
padding:0px;
margin:0px
} go for this in your css
this will help you
after that use border
max77p
@max77p
Jul 31 2016 21:20
add border: 2px solid white;?
Anshul Jain
@ajain706
Jul 31 2016 21:21
first try with black
not getting the border effect
Anshul Jain
@ajain706
Jul 31 2016 21:25
bro
@max77p
are you there?
max77p
@max77p
Jul 31 2016 21:25
@ajain706 yes
max77p
@max77p
Jul 31 2016 21:26
@ajain706 right, this is what i got
Anshul Jain
@ajain706
Jul 31 2016 21:26
ok listen
put an semi-coln on margin:0px
@max77p
max77p
@max77p
Jul 31 2016 21:27
@ajain706 oh jesus i am dumb lol
Anshul Jain
@ajain706
Jul 31 2016 21:27
and height is 3em;
yes bro lol
now you done ? @max77p
max77p
@max77p
Jul 31 2016 21:28
yes updated that
so now i get the border
Anshul Jain
@ajain706
Jul 31 2016 21:28
yes
max77p
@max77p
Jul 31 2016 21:28
however, brings me back to my initial problem was that i need a single border around each image and text
not image separated from the text
Anshul Jain
@ajain706
Jul 31 2016 21:29
ok we will solve this out dont worry
send me the updated link
max77p
@max77p
Jul 31 2016 21:29
CamperBot
@camperbot
Jul 31 2016 21:29
max77p sends brownie points to @ajain706 :sparkles: :thumbsup: :sparkles:
:cookie: 175 | @ajain706 |http://www.freecodecamp.com/ajain706
max77p
@max77p
Jul 31 2016 21:34
@ajain706 i have a question (maybe a solution)...wouldn't it be better to use keep the container white color...and use jquery to change online streams to whatever color...and offline streams to another color?
so that it also looks like there is a border?
however implementing this in jquery is different problem for me lol
Anshul Jain
@ajain706
Jul 31 2016 21:35
lol
lets try
@max77p
Jacob Stewart
@JacobStewart1
Jul 31 2016 21:36
does anybody know what -> does in javascript?
Anshul Jain
@ajain706
Jul 31 2016 21:41
@max77p
you there
max77p
@max77p
Jul 31 2016 21:42
@ajain706 yes sir
Anshul Jain
@ajain706
Jul 31 2016 21:42
Capture.JPG
take a look at this @max77p
max77p
@max77p
Jul 31 2016 21:43
@ajain706 yes but each blurb of text corresponds to the specific image
so shouldn't they be on same line?
Anshul Jain
@ajain706
Jul 31 2016 21:44
they can come on the same line but we need to try much harder and i m not sir i m still 21
@max77p
max77p
@max77p
Jul 31 2016 21:45
@ajain706 so i think i figured out the alternative way
@ajain706 in jquery i separated functions for when online and when offline so that it puts out the different color..but kept background color for the container white, so it creates the border effect
but thanks for your help anyway @ajain706 !
CamperBot
@camperbot
Jul 31 2016 21:46
max77p sends brownie points to @ajain706 :sparkles: :thumbsup: :sparkles:
:warning: max77p already gave ajain706 points
Anshul Jain
@ajain706
Jul 31 2016 21:46
nice bro
@max77p
just do a thing put height : 3em; instead of 5em;
@max77p
max77p
@max77p
Jul 31 2016 21:47
@ajain706 why is that? it makes it look smaller no?
Anshul Jain
@ajain706
Jul 31 2016 21:48
no it looks normal
@max77p
Anshul Jain
@ajain706
Jul 31 2016 22:27
@max77p are you there
anyone is there
Unknown
@Unknownhezipaz
Jul 31 2016 22:28
@dhcodes thanks bro it worked.You know for the portfolio part do I just put h2 tag and then write what I have to for that.Or do I have to create a separate div for that
CamperBot
@camperbot
Jul 31 2016 22:28
majedmahmood27 sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1284 | @dhcodes |http://www.freecodecamp.com/dhcodes
max77p
@max77p
Jul 31 2016 22:31
@ajain706 yes
Anshul Jain
@ajain706
Jul 31 2016 22:31
lesson Stand in Line
stuck
@max77p
max77p
@max77p
Jul 31 2016 22:33
which one?
Anshul Jain
@ajain706
Jul 31 2016 22:34

function nextInLine(arr, item) {
// Your code here
testArr.push(10);
return testArr.shift();
}

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

// Display Code
console.log("Before: " + JSON.stringify(testArr));
console.log(nextInLine(testArr, 1)); // Modify this line to test
console.log("After: " + JSON.stringify(testArr));

this one @max77p
done bro
max77p
@max77p
Jul 31 2016 22:40
@ajain706 sorry which lesson we talking about?
Norvin Burrus
@ndburrus
Jul 31 2016 22:40
@ajain706 instead of testArr, we need to use arr..., also we need to use a variable with the push method :sparkles:
Ryan Williams
@Ryanwfile
Jul 31 2016 22:42
Can someone please help me with this code for the simon project, I am having trouble getting the buttons to light up after one another instead of all at once. Thank you.
repeat = ['yellow', 'blue', 'green', 'red', 'yellow', 'green', 'blue', 'green', 'yellow'];
   repeat.forEach(function(el,idx){
   console.log(idx,el);
    if (el == "red"){
             $('#red').css('background-color',"#FF0000");
             sound0.play(); 
             setTimeout(function(){ $('#red').css('background-color','#aa0000') },1100);
        }
        else if (el == "green"){
             $('#green').css('background-color',"#00FF00");
             sound1.play();
             setTimeout(function(){ $('#green').css('background-color','#00aa00') },1100);
        }
        else if (el == "blue"){
            $("#blue").css('background-color',"#0000FF");
            sound2.play();
            setTimeout(function(){ $('#blue').css('background-color','#0000aa') },1100);
       }
        else if (el == "yellow"){
            $("#yellow").css('background-color',"#FFFF66");
            sound3.play();
            setTimeout(function(){ $('#yellow').css('background-color','yellow') },1100);
       }

  })
Anshul Jain
@ajain706
Jul 31 2016 22:44
thanks guyz i already done
@max77p @ndburrus
Rada
@Radascript
Jul 31 2016 22:59
@Ryanwfile can we see your pen?
Ryan Williams
@Ryanwfile
Jul 31 2016 22:59
@Radascript Sure it's http://codepen.io/Ryanwfile/pen/OXwEwK , thank you
CamperBot
@camperbot
Jul 31 2016 22:59
ryanwfile sends brownie points to @radascript :sparkles: :thumbsup: :sparkles:
:cookie: 378 | @radascript |http://www.freecodecamp.com/radascript
Rada
@Radascript
Jul 31 2016 23:09
@Ryanwfile put your soundX.play()s INSIDE the setTimeOUts for starters
and after that, make sure each setTimeOut adds 1100 to itself
like so:
setTimeout(function() {
          $('#green').css('background-color', '#00aa00');
          sound1.play();
        }, 1100 * (idx + 1));
Ryan Williams
@Ryanwfile
Jul 31 2016 23:11
ok I will do that, thank you very much for the help
Anshul Jain
@ajain706
Jul 31 2016 23:12
@Radascript hy
Rada
@Radascript
Jul 31 2016 23:13
@Ryanwfile you welcome. That only solves the issue with the sounds though. You may need to nest the SetTimeOuts - do one for lighting them up and one for turning them off.
You could also write a function altogether that takes in arguments (color, sound, button) and then you don't have to copy paste as much, but that's a personal choice.
Ryan Williams
@Ryanwfile
Jul 31 2016 23:15
@Radascript That makes sense I will try that, having them altogether in one function would be better as well
Rada
@Radascript
Jul 31 2016 23:16
@Ryanwfile good luck!
Ryan Williams
@Ryanwfile
Jul 31 2016 23:16
@Radascript Thank you again for all of the help
CamperBot
@camperbot
Jul 31 2016 23:16
ryanwfile sends brownie points to @radascript :sparkles: :thumbsup: :sparkles:
:warning: ryanwfile already gave radascript points
Ryan Williams
@Ryanwfile
Jul 31 2016 23:21
@Radascript The code you posted with the (idx +1) is working very well, that's exactly what it needed
Rada
@Radascript
Jul 31 2016 23:27
@Ryanwfile awesome happy to help!
Dylan
@dhcodes
Jul 31 2016 23:46
@majedmahmood27 up to you, but I think most people make separate sections (divs). It's your portfolio though so you can make it whatever you want as long as you complete the user stories