These are chat archives for FreeCodeCamp/HelpFrontEnd

27th
Aug 2016
Alex
@Sevohan
Aug 27 2016 00:09
@dcgoings I love that! Still working on understanding how to format the new href so it works but you helped me out a ton
Dan
@dcgoings
Aug 27 2016 00:11
@Sevohan thanks! and no problem, let me know if you have any trouble figuring it out. you should be able to reverse-engineer it by looking at my code, but if you need anything else explained, feel free to ask.
CamperBot
@camperbot
Aug 27 2016 00:11
dcgoings sends brownie points to @sevohan :sparkles: :thumbsup: :sparkles:
:cookie: 353 | @sevohan |http://www.freecodecamp.com/sevohan
Jai Hashim
@jaihashim
Aug 27 2016 00:19
Hi guys, I'm having trouble with getting my latitude and longitude for the weather app. The method used in freeCodeCamp's Get Geolocation challenge doesn't seem to work because of the error "Only secure origins are allowed" when you try to use it in Codepen. I'm a bit lost as to what other approach to take.
vínαч puppαl
@vinaypuppal
Aug 27 2016 00:20
@jaihashim you need to load our pen over https:// for geo location to work on chrome
Alex
@Sevohan
Aug 27 2016 00:48
@dcgoings I tried to follow along with what I thought applied to my code but I must have missed something http://codepen.io/Sevohan/pen/NAkdag
Rada
@Radascript
Aug 27 2016 00:57
hey guys. I'm using bootstrap carousel and I want to trigger a function on mouseover (up opacity of a caption div), and another one on mouseout. It's working ok, EXCEPT that the changing of the slides is considered a mouseout and messes up my thing. Is there anyway to make it not consider the change of slides a mouseout?
Aaron
@apalm1341
Aug 27 2016 01:19
@khaduch Thank-you very much for your feedback
CamperBot
@camperbot
Aug 27 2016 01:19
apalm1341 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1583 | @khaduch |http://www.freecodecamp.com/khaduch
Tyler Moeller
@TylerMoeller
Aug 27 2016 01:52
@Radascript Could you use :hover in your CSS instead to change the opacity?
It would help to see the code if not
Jai Hashim
@jaihashim
Aug 27 2016 02:01
@vinaypuppal Thanks! That was easy
CamperBot
@camperbot
Aug 27 2016 02:01
jaihashim sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 470 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
Armaan Roshani
@armaanhammer
Aug 27 2016 02:01
Hey guys, I'm confused about what + does in regular expressions. In the waypoints at the end of the javascript section, the output doesn't seem to matter if I have a + in the expression or not.
The waypoint that introduces + says it: "allows this regular expression to match one or more digits." I don't understand that though. Doesn't g at the end of the expression do that?
Ken Haduch
@khaduch
Aug 27 2016 02:12
@armaanhammer - the + is used in building the expression that you are trying to match. Sometimes the "g" has the same effect. It depends on what you're trying to achieve.
Armaan Roshani
@armaanhammer
Aug 27 2016 02:14
@khaduch Ah, so you could use something like and+or to find the sum of both statements, or \d+\s to find the sum of digits and whitespace?
If that's the case, I still don't get why it's used in this situation: /\d+/g
purpldaze1
@purpldaze1
Aug 27 2016 02:15
im trying to inherent the body style
<style>
body {
color:green;
font-family:Monospace;
<h1>Hello World </h1>
}

</style>
help?
Armaan Roshani
@armaanhammer
Aug 27 2016 02:21
Ah, I found the answer here: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions in case anyone else has my same question.
Ken Haduch
@khaduch
Aug 27 2016 02:22
@armaanhammer - no, it is not an "addition" or "sum" operation. The expressions that you wrote /\d+/g means to match one or more digit characters in a string that you are testing. The /g means to match that anywhere in the string. Just in the way of explanation, your expression of /and+or/ would match a string "andor", or "anddor", or "andddor", etc. The + is a modifier on the previous expression - in this case of and+or the d is the character that matches one or more times. In an expression like \d+ it means one or more digits. I would say for that example, the /g is just about meaningless, because if it matches one time within the string under test, then it will be a match. The /g/ is more useful in a situation where you are using the "memory" feature - such as /(\d+)/g- in that case, you will have a collection of matches throughout the string that match that expression, and you can use those in the code that follows to extract those strings, replace them, etc.
paulrishworth
@paulrishworth
Aug 27 2016 02:28
Hi guys ... newbie here. Working on the tribute page project and cannot figure out how to get the photo to appear. This is what I have coded. Any suggestions?
<img src="https://www.flickr.com/photos/rabbit-empire/3015742219/" alt="Masanobu Fukuoka">
Ken Haduch
@khaduch
Aug 27 2016 02:29
@paulrishworth - you need to have a file name such as "picture.jpg" tacked on the end of that URL. Look for a way on the flickr page to find the hard link to the page - something like "embed" or "share" - I forget exactly what it is.
paulrishworth
@paulrishworth
Aug 27 2016 02:35
wow! thanks so much @khaduch ... found it under the view page info setting of the image. That was really doing my head in. You are a star!
CamperBot
@camperbot
Aug 27 2016 02:35
paulrishworth sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1584 | @khaduch |http://www.freecodecamp.com/khaduch
paulrishworth
@paulrishworth
Aug 27 2016 02:36
by the way ... what is this brownies points thingy?
Ken Haduch
@khaduch
Aug 27 2016 02:37
@paulrishworth - try looking at the photo page, and look for the "download" option - select the size of photo and you'll see a link for that photo. Or look for the "Share" option and look for the "BBCode", then get the URL from that link that they generate, and use the part that is between the [img] and [/img] delimiters. This is an example of one of my photos. [url=https://flic.kr/p/dcyfuv][img]https://c6.staticflickr.com/9/8031/8007055005_b085a9d469_c.jpg[/img][/url][url=https://flic.kr/p/dcyfuv]IMG_8173[/url] by [url=https://www.flickr.com/photos/kjh_flickr_photos/]Kenneth Haduch[/url], on Flickr I would take the link https://c6.staticflickr.com/9/8031/8007055005_b085a9d469_c.jpg and use that for my image. https://c6.staticflickr.com/9/8031/8007055005_b085a9d469_c.jpg
Ken Haduch
@khaduch
Aug 27 2016 02:54
@paulrishworth - they used to have a help note that would explain - let's see if it is still there
help brownie
CamperBot
@camperbot
Aug 27 2016 02:54
no wiki entry for: brownie
Ken Haduch
@khaduch
Aug 27 2016 02:59
@paulrishworth - "brownie points" represent a camper's participation in the site. They are displayed on your freecodecamp dashboard in the upper right hand corner as a number in square brackets. You get a point for each lesson or challenge that you complete, and if you are participating in the chat room offering help, and the person acknowledges you by your @name with the word thanks, then you also get a point. You'll see some people who are very active helpers in the chat rooms (and only in the main chat rooms, the private chat rooms are not included in this) with a lot of "brownie points". Again, it is just showing your level of activity either completing lessons or helping people who acknowledge you by name.
paulrishworth
@paulrishworth
Aug 27 2016 03:09
thanks @khaduch ... bit overwhelmed by all this. really appreciate your help.
CamperBot
@camperbot
Aug 27 2016 03:09
paulrishworth sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:warning: paulrishworth already gave khaduch points
Ken Haduch
@khaduch
Aug 27 2016 03:23
and I think that you can only give one BP per hour, or something like that... ;) And you're welcome. There is a lot to learn here, and I wish you good luck!
roninjedi
@roninjedi
Aug 27 2016 03:37
You know, I've never really questioned how long people get to work on stuff in the corporate world. Like would i be expected to do a full site in x time or just one aspect of it, and what does x=. I mean i like web development but i would say I'm kind of slow at it since it took me a day to make my tribute page.
Jai Hashim
@jaihashim
Aug 27 2016 04:09
I'm having trouble with my weather app. When it tries to use to openweathermap API, it gives the error: Failed to load resource: net::ERR_CONNECTION_REFUSED and I can't find what this means.https://s.codepen.io/jaihashim/debug/Gqbywd#
Jai Hashim
@jaihashim
Aug 27 2016 04:18
Looks like it has something to do with needing to be https to get the lat/long and needing to be http to use openweathermap. Is there an easy alternative to getting the lat/long without https? I had a look at Google Maps API but couldn't see what I needed to get the lat/long
Norvin Burrus
@ndburrus
Aug 27 2016 04:21
@paulrishworth :sparkles:
Dan
@dcgoings
Aug 27 2016 04:26
Jai Hashim
@jaihashim
Aug 27 2016 04:32
Thanks Daniel. I found that one but I'm still having trouble with it also. This was my attempt to get the JSON data and display it, but I get a similar error "jquery-2.2.4.min.js:4 GET http://ip-api.com/json net::ERR_BLOCKED_BY_CLIENT"
  $.getJSON("http://ip-api.com/json", function(json) {
    $("#weather").text(JSON.stringify(json));
  });
Ethan Rose
@ethanrose
Aug 27 2016 04:33
can someone help me.. what am I doing wrong here?? I just get "false" everytime.. it should be changing between true and false with each click right??
var strict = false;
$(".strict").click(function(){
  if (strict = false){
    console.log("true");
    $(".strict").css("background-color", "green");
    strict = true;
  }
  if (strict = true){
    console.log("false");
    $(".strict").css("background-color", "black");
    strict = false;
  }
})
but it's just acting like "strict" is always true..
Dan
@dcgoings
Aug 27 2016 04:36
@jaihashim weird. this is what mine is:
var lat;
    var lon;

    $.getJSON('http://ip-api.com/json', function(data) {
        lat = data.lat;
        lon = data.lon;

        var api = 'http://api.openweathermap.org/data/2.5/weather?lat=' + lat + '&lon=' + lon + '&appid=APPIDGOESHERE&units=imperial';
Jai Hashim
@jaihashim
Aug 27 2016 04:36
@aidansven Looks like you used = instead of ==
Ethan Rose
@ethanrose
Aug 27 2016 04:40
@jaihashim oh my gosh.. haha. I must be too tired to code ;) thank you.
CamperBot
@camperbot
Aug 27 2016 04:40
aidansven sends brownie points to @jaihashim :sparkles: :thumbsup: :sparkles:
:cookie: 306 | @jaihashim |http://www.freecodecamp.com/jaihashim
Jai Hashim
@jaihashim
Aug 27 2016 04:41
Haha, only because I do that all the time
Rada
@Radascript
Aug 27 2016 05:44
hey guys can someone recommend how I can make the textbox on the portfolio carousel take up more width? I can't understand why it's taking up such a small part of the box. I have width: 100% set everywhere and it's not helping:
https://radascript.github.io/portfolio/index.html
Andrea Rocca
@sfogo5
Aug 27 2016 06:32
@Radascript it’s all a matter of margin - I just tried setting the margin to 0 and indeed goes full width :)
@TylerMoeller thanks a lot for the inputs! Yeah that’s why the button is not working. You guessed it right I wrote it in c9 (I prefer it to codepen). I’m going to add bootstrap.js asap! :)
CamperBot
@camperbot
Aug 27 2016 06:33
sfogo5 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 781 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
csyasir
@csyasir
Aug 27 2016 07:18
hello
Andrea Rocca
@sfogo5
Aug 27 2016 07:20
Hello!
Michael Karpinski
@karpimpski
Aug 27 2016 07:44
hey, can anybody help with my mouseover and mouseout event listeners?
for(var j = 0; j < boxes.length; j++){
    boxes[j].addEventListener('mouseover',function(){
        this.className = this.className.replace(/\bbox-mouse-out\b/,'');
        this.className += ' box-mouse-in';
    });
    boxes[j].addEventListener('mouseout',function(){
        this.className = this.className.replace(/\bbox-mouse-in\b/,'');
        this.className += ' box-mouse-out';
    });
}
that's the code for my listeners. they work fine, but if I move the mouse while inside of the box, my mouseover effect dies
Michael Karpinski
@karpimpski
Aug 27 2016 08:03
now I added if statements and they work great until you click. then it glitches out again
for(var j = 0; j < boxes.length; j++){
    boxes[j].addEventListener('mouseover',function(){
        if(this.className.includes('box-mouse-in') == false){
            this.className = this.className.replace(/\bbox-mouse-out\b/,'');
            this.className += ' box-mouse-in';
        }
    });
    boxes[j].addEventListener('mouseout',function(){
        if(this.className.includes('box-mouse-in')){
            this.className = this.className.replace(/\bbox-mouse-in\b/,'');
            this.className += ' box-mouse-out';
        }
    });
    boxes[j].addEventListener('click',function(){
        this.className = this.className.replace(/\bbox-mouse-in\b/,'');
        this.className = this.className.replace(/\bbox-mouse-out\b/,'');
    });
}
Michael Karpinski
@karpimpski
Aug 27 2016 08:32
I fixed it! in my code, on click, I manually set the element's background to a certain color. so in my box-mouse-out class I set the box's background color as !important. ik using !important isn't best practice, but idk how else to solve my problem
CasiqueJhon
@CasiqueJhon
Aug 27 2016 10:12
morning!!
one question, how did I make my navigation bar options take me to the specific area?
I mean, if a call portfolio, how can I make the button take me there?
Thanks
khawajah
@khawajah
Aug 27 2016 10:34
hello guys.. how can i share my text in twitter using tweet button ?!!
Karayel
@Karayel
Aug 27 2016 10:49
I have some problems about codepen . can anybody help me ?
khawajah
@khawajah
Aug 27 2016 10:56
@Karayel so how to get my txt and added to the link (random text so every text will change after click in button)
Karayel
@Karayel
Aug 27 2016 10:59
$('your id or class' ).html();
@khawajah $('your id or class' ).html();
@khawajah this gives you data in the html
khawajah
@khawajah
Aug 27 2016 11:04
@Karayel thnx :)
CamperBot
@camperbot
Aug 27 2016 11:04
khawajah sends brownie points to @karayel :sparkles: :thumbsup: :sparkles:
:cookie: 257 | @karayel |http://www.freecodecamp.com/karayel
Bogdan Cublesan
@cuble27
Aug 27 2016 11:54
Hey guys, I have a question. How can I make elements from inside a div stay inline even if they are outside of the div? I'm trying to move something outside the div, with overflow:hidden; but they are still going on multiple lines when they hit the margin..
Joshua Swift
@joshuaswift
Aug 27 2016 12:00
I have a bug in my quote generator where seemingly at random the quote will not appear, at first thought it was a css issue when the quotes were too long but after further investigation that doesn't seem to be it.
Would appreciate any help or guidance http://codepen.io/Joshuaswift/full/bpXoEo/
vínαч puppαl
@vinaypuppal
Aug 27 2016 12:23

@Joshuaswift hey hi, just i made few changes it worked, i should have told you yesterday only but forgot
in getQuote() change like this

$("#quoteContent").html("<i class = 'fa fa-quote-left fa-2x quote-mark'></i>" + json.quoteText + "<br>" + "<h3>" + json.quoteAuthor + "</h3>").fadeIn("slow");
  });

and in removeQuote() just this is enough

$("#quoteContent").fadeOut("slow")
@Joshuaswift and still on small screens css issue is not fixed once check that also
vínαч puppαl
@vinaypuppal
Aug 27 2016 12:32
@cuble27 can you show me in your Pen what you want to achieve.
Bogdan Cublesan
@cuble27
Aug 27 2016 12:33
@vinaypuppal Yea, 2min to paste it to codepen
Joshua Swift
@joshuaswift
Aug 27 2016 12:39
@vinaypuppal hi there, thanks again but this solution isn't working for me, so frustrating!
CamperBot
@camperbot
Aug 27 2016 12:39
:cookie: 472 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
joshuaswift sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
vínαч puppαl
@vinaypuppal
Aug 27 2016 12:40
@Joshuaswift not working?? okay use this pen as reference http://codepen.io/vinaypuppal/full/vKogdY/
Bogdan Cublesan
@cuble27
Aug 27 2016 12:45
problem.png
@vinaypuppal the screens are before and after the animation
vínαч puppαl
@vinaypuppal
Aug 27 2016 12:47
@cuble27 the code is not visible properly. Is it not on codepen??
Bogdan Cublesan
@cuble27
Aug 27 2016 12:48
no, it;s just a screen, i'm not really used to codepen
but let me try to put it there
can i also upload images there?
ridjis
@ridjis
Aug 27 2016 12:52
Does anyone know why this transition not working?
@vinaypuppal
Ken Haduch
@khaduch
Aug 27 2016 13:32
@ridjis - are you just looking for the change in the gradient on the button? Looks like it is working when I try it?
Angel Castrellon
@ACastrellon
Aug 27 2016 14:58
Does anyone know how to implement jQuerys function in code pen?
Stephen James
@sjames1958gm
Aug 27 2016 14:59
@ACastrellon The JS section has a setup (gear icon) where you can load jquery library
coffeebeanzz
@coffeebeanzz
Aug 27 2016 15:00
@ACastrellon just be sure to put jQuery first then javascript
Angel Castrellon
@ACastrellon
Aug 27 2016 15:01
I believe I have added the library. However when I write jQuery commands in the HTML editor between the script tags, it sodenst seem to be executing them.
coffeebeanzz
@coffeebeanzz
Aug 27 2016 15:03
your jQuery code should be in the JS tab @ACastrellon
Angel Castrellon
@ACastrellon
Aug 27 2016 15:06
Ahh I see @coffeebeanzz @sjames1958gm thanks . I tried putting the $(document).ready(function{}); and it was telling me there was an unexpected token. I took it way and it worked.
CamperBot
@camperbot
Aug 27 2016 15:06
:star2: 2892 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
:star2: 1014 | @coffeebeanzz |http://www.freecodecamp.com/coffeebeanzz
acastrellon sends brownie points to @coffeebeanzz and @sjames1958gm :sparkles: :thumbsup: :sparkles:
Stephen James
@sjames1958gm
Aug 27 2016 15:06
@ACastrellon :+1:
coffeebeanzz
@coffeebeanzz
Aug 27 2016 15:08
you're welcome @ACastrellon :)
vtarun
@vtarun
Aug 27 2016 15:21
Hi all, for javascript problem "No repeats please" i dont how to proceed. I need help.
John
@jden3725
Aug 27 2016 15:46
Hello, I am trying to add a thumbnail image of one of my pen projects to my Portfolio Webpage. I want the image of a prior project to display (not the code). Does anyone know how to use <img src=" "> to show an image of a pen project? My link in codepen doesnt work. Thanks
Ken Haduch
@khaduch
Aug 27 2016 16:03
@jden3725 - I would just use something to get a screenshot of your site. (Well, this is what I did for one of mine so far), save it to a place where you can access over http:// (Perhaps postimg.org, or other place that you can use.) Then get the URL for it and link it on your page in the src attribute. Other suggestions / comments welcome!
John
@jden3725
Aug 27 2016 16:05
@khaduch How do I get the screenshot of the full page display of my project?
ridjis
@ridjis
Aug 27 2016 16:28
@khaduch should be ease transition on hover, but instead its linear
Arlind
@ArlindXh
Aug 27 2016 16:35
guys can some1 help me with my portfolio page, my background image isnt fully covered,a small part is still white...
Arlind
@ArlindXh
Aug 27 2016 16:47
i used background-size:cover; but still...
Eric Freeburg
@Er-c
Aug 27 2016 16:52
Hey guys, re: portfolio page project. What is the optimal method for preventing body divs from partially hiding under the fixed-navbar. I found the following on Stack, which seems to suggest adding: padding-top: 70px; to a body selector. Is there a better way to do this?
Moisés Man
@moigithub
Aug 27 2016 16:56
@ArlindXh probably ur image have a white border
Ken Haduch
@khaduch
Aug 27 2016 16:57
@jden3725 - get your front page of your application set up in a browser window. if you are on Microsoft Windows, use the "snipping tool" - if you're on a mac or otherwise, there's probably a key sequence that you can use? (I don't have a mac, unfortunately) - but Google tells me that Apple does: https://support.apple.com/en-us/HT201361 :) --- I hope that helps?
Eric Freeburg
@Er-c
Aug 27 2016 17:00
@jden3725 re: @khaduch - on mac use command - shift - 4 to get a selection box that is similar to snipping tool on windows
elizabeth awino
@beth6
Aug 27 2016 17:00
Hey
Ken Haduch
@khaduch
Aug 27 2016 17:02
@ridjis - here is an article - says that you cannot animate gradients, but has some solutions: https://medium.com/@dave_lunny/animating-css-gradients-using-only-css-d2fd7671e759#.6e8n2vj92 - I haven't tried them yet. But according to the docs, they are "not animatable". The author there does show an example and code to make it work...
James Leaver
@jaymsDooku
Aug 27 2016 17:14
I am doing the Local Weather project and I need to enable mixed content because I'm accessing geolocation as well as using the free open weather map api, can anyone help me out?
Jai Hashim
@jaihashim
Aug 27 2016 17:16
@jaymsDooku I had trouble with that because geolocation only works with https and free open weather map api only works with http. Check out http://ip-api.com/json
James Leaver
@jaymsDooku
Aug 27 2016 17:18
McAfee just blocked me from going to that website.
Jai Hashim
@jaihashim
Aug 27 2016 17:21
Hmm, sorry. That's the only solution I found. You might need to try and find another API to get latitude and longitude?
James Leaver
@jaymsDooku
Aug 27 2016 17:22
I've disabled netguard for the meantime.
Thanks by the way.
Jai Hashim
@jaihashim
Aug 27 2016 17:26

Can someone help me understand some puzzling behaviour in my Local Weather Project code? I got to here and it works how I expect. You click the button and it displays the weather.
codepen.io/jaihashim/pen/mENAJO

Then I tried to change the code so that it displays the weather when the page loads without having to press the button.

I changed this:

("#getWeather").on("click", getWeather);

to just this:

getWeather();

And suddenly it breaks. From having a look at the console it looks like now when it calls the getWeather function, "url" is undefined. But I can't see any reason why that should change?
codepen.io/jaihashim/pen/bZXWpk

Ken Haduch
@khaduch
Aug 27 2016 17:33
@jaihashim - you need to make sure that you get the location information, and therefore initialize the var url before you can invoke the getWeather() function - if you move the call to getWeather() inside of the callback for your location acquisition code, I think it will work.
@jaihashim - move it directly after the code where you set up the url variable.
Jai Hashim
@jaihashim
Aug 27 2016 17:39
It works! Thanks. But I'm still confused and can't see why. Hmm
Does the script run the $ functions after the other functions?
Andrew1024
@Andrew1024
Aug 27 2016 17:43
Hello, my page reload when I click Enter http://codepen.io/Andrew1024/pen/dXBpxJ
Could anybody help?
Ken Haduch
@khaduch
Aug 27 2016 17:44
@jaihashim - As soon as the ready function kicks off, you have an undefined url - the $.getJSON('http://ip-api.com/json', function(data) { call is made, and that takes some time to respond. (You still have an undefined url until that callback executes.) You define function getWeather(), then call it - this all happens probably while waiting for the location data to return, so you have an undefined url. Then the location returns, you build the contents of the url variable, but it is too late for your initial call to getWeather();
Jai Hashim
@jaihashim
Aug 27 2016 17:48
@khaduch I see! Thanks so much. Interesting.
CamperBot
@camperbot
Aug 27 2016 17:48
jaihashim sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1588 | @khaduch |http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Aug 27 2016 17:48
@jaihashim - you're welcome.
@Andrew1024 - try adding event.preventDefault(); at the beginning of your function search(){ code.
Andrew1024
@Andrew1024
Aug 27 2016 17:58
@khaduch It works but not corrent. When I write a word in the first time it doesn't work. But when I select a word from drop-down menu it works.
Islam Ibakaev
@dagman
Aug 27 2016 18:01
hey guys what's the lodash method name that return object from list that includes some key-value pair.
for example i have a list const list = [{a: 1, b: 1}, {a: 2, b: 2}, {a: 3, b: 3}] and i want get returned an object from list that consist a: 3.
i mean list.someMethod({a: 3}) should return {a:3, b: 3}
Ken Haduch
@khaduch
Aug 27 2016 18:04
@Andrew1024 - that's strange - I had it work one time (opened a new tab with the search) and now not working at all?
Andrew1024
@Andrew1024
Aug 27 2016 18:05
@khaduch What browser do you use?
Ken Haduch
@khaduch
Aug 27 2016 18:10
@Andrew1024 - I am using Chrome. I just removed your <form> and </form> tags from the HTML panel as a test - it worked when I did that, so I think that it is reloading the form event with the event.preventDefault(); calls in there? I g uess I don't know where the event value is coming from, that might be a problem?
@Andrew1024 - looks like the latest change you made is working?
Andrew1024
@Andrew1024
Aug 27 2016 18:15
@khaduch I made onsubmit="return false;" to the form tag and it works
Ken Haduch
@khaduch
Aug 27 2016 18:15
looks good then?
Andrew1024
@Andrew1024
Aug 27 2016 18:15
Yes, thank you for help @khaduch
CamperBot
@camperbot
Aug 27 2016 18:15
andrew1024 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1589 | @khaduch |http://www.freecodecamp.com/khaduch
RHCPsnow
@RHCPsnow
Aug 27 2016 18:18
Can anyone help me figure out why nothing inside my $.getJSON is working? here is the link to my codepen: https://codepen.io/RHCPsnow/pen/Meabgw?editors=0011
Ken Haduch
@khaduch
Aug 27 2016 18:22

@RHCPsnow - you cannot use https:// for the free version of the openweather API, and (at least on Chrome) you have to use https:// for the geolocation... so that is probably what is going on. You might have to change the way you are getting your location info, use something like the (probably less accurate) http://ip-api.com/json to get IP-based location info, or try geolocation and then fall back to the IP-based solution?

Probably if you try firefox and only use http:// to open the page and access the openweather API, it will work.

@RHCPsnow - I just tried it, and it does work - open the page as http://codepen.io/RHCPsnow/pen/Meabgw?editors=0011, change the access for the openweather to http:// and it works.
RHCPsnow
@RHCPsnow
Aug 27 2016 18:28
@khaduch so all i have to do is remove the s?
John
@jden3725
Aug 27 2016 18:34
I am working on my portfolio website, and when I click "John" on the upper left side of the nav bar, the page does not scroll all the way up to the top. For example, if I'm viewing the middle of the page, it scrolls up when I click "John" on the nav bar, but it doesn't go to the very top of the page. The upper inch appears cutoff. I tried adjusting padding but was unable to fix it. Are you able to help? Thanks. https://codepen.io/John9167/full/VjJqpm/
Ken Haduch
@khaduch
Aug 27 2016 18:37
@RHCPsnow - in both the URL to open the page, and the URL to access the openweather site. But geolocation will not work in Chrome unless you use https://! So that opens the need for another location method - people have been using http://ip-api.com/json - not as accurate, I guess? But if it works, it's probably good enough?
@Andrew1024 - you're welcome...
Marc Droz
@b1tc0de
Aug 27 2016 18:41
what files or links do i need on my codepen for @mediaqueries to work
Ken Haduch
@khaduch
Aug 27 2016 18:42

@jden3725 - I added this CSS:


#John {
  padding-top: 50px;
}

It works - maybe not ideal? What do you think?

Ken Haduch
@khaduch
Aug 27 2016 18:48
@b1tc0de - I think that they should just work, it's standard CSS?
Daniel
@DanielMW34
Aug 27 2016 18:48
@RHCPsnow I just finished this exercise, private message me, I will be happy to help you and, as you move on to the next challenge(s) would really like to collaborate with you
Marc Droz
@b1tc0de
Aug 27 2016 18:48
thanks @khaduch i was just looking at someones codepen and it confirms what you said
CamperBot
@camperbot
Aug 27 2016 18:48
b1tc0de sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1590 | @khaduch |http://www.freecodecamp.com/khaduch
Daniel
@DanielMW34
Aug 27 2016 18:50
Hello Everybody. I am working on the wikipedia api challenge, does anyone know if we should be using the REST API or the "regular" API ?
Also, I want to make sure I am reading the correct documentation, anyone want to point me in the right direction and, perhaps more importantly, let me know if I am heading off in the wrong direction?
Marc Droz
@b1tc0de
Aug 27 2016 19:13
hi everyone! can someone take a look at my media queries, they are not working....is the first time i try to use them ..
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 19:37
how do I set the max height of the screenshots here: http://codepen.io/TheJaredWilcurt/pen/qNZmVV?editors=0100
That's a flexbox question
Yuriy Medentsii
@hvuntokrul
Aug 27 2016 19:41
@b1tc0de try changing font size values
@b1tc0de you write h1, h2, but these are html tags, aren't they?
@b1tc0de if you want to adjust font size, you need to use appropriate units, such as px, em, vm or something else
Juan Sierra
@juan-sierra
Aug 27 2016 19:48
hi anyone here familiar or uses gulp frequently?
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 19:51
what about it
Juan Sierra
@juan-sierra
Aug 27 2016 19:53
@TheJaredWilcurt I’m trying to get gulp-responsive working, but I’m just having a hard time setting up
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 19:55
are you on OSX
Juan Sierra
@juan-sierra
Aug 27 2016 19:56
yep! @TheJaredWilcurt
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 19:56
If you are using Mac OS then before installing gulp-responsive you should install the libvips library.
try that
Juan Sierra
@juan-sierra
Aug 27 2016 19:59
yeah I did that, let me see if the libvips it’s in node_modules
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 20:06
Flexbox question, how do I set the max-height of these screenshots
http://codepen.io/TheJaredWilcurt/pen/qNZmVV?editors=0100
Ethan Rose
@ethanrose
Aug 27 2016 20:16
This message was deleted
Jquery Question, it looks like when I use
$(".myClass").css("opacity", "1");
it's removing my hover effect in my CSS
anybody know if that's the true behavior, and a good workaround?
here's my codepen:
not hover... I mean active*
as in, the buttons should be lighting up when they are clicked.. and they do at first.. but once the game starts, they don't anymore
Ethan Rose
@ethanrose
Aug 27 2016 20:21
because in javascript I'm messing with the opacity.. so it's like the css is ignoring the :active pseudo
is there a way in jquery to change the css on active?
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 20:23
Why aren't you handling your CSS in your CSS
Do everything there. If you need some form of style update caused by JS, just add/remove classes
.cow:active { opacity: 0.5; }
.moo:active: {opacity: 1.0; }
$('.milk').click(function () {
    $('.cow').addClass('.moo').removeClass('.cow');
});
Ethan Rose
@ethanrose
Aug 27 2016 20:30
ohhh... does toggleClass work as well?
That is soo much better too.. thank you @TheJaredWilcurt
CamperBot
@camperbot
Aug 27 2016 20:30
:warning: could not find receiver for thejaredwilcurt
aidansven sends brownie points to @thejaredwilcurt :sparkles: :thumbsup: :sparkles:
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 20:30
yep it will add/remove that class
Ethan Rose
@ethanrose
Aug 27 2016 20:30
brilliant! :)
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 20:31
$('.milk').click(function () {
    $('.cow').toggleClass('.moo');
});
Ethan Rose
@ethanrose
Aug 27 2016 20:38
@TheJaredWilcurt so I adjusted my code:
    $(buttonsPlay[chain[i]]).toggleClass(".active");
    setTimeout(function(){
      $(buttonsPlay[chain[i-1]]).toggleClass(".active");
    }, 400);
and my css
.active {
  opacity: 1;
}
this fixed the :active, but the toggleClass doesn't seem to be working
I know the variables are good because it was just working with .css
the opacity should be going from 0.6 to 1 ..... but it's just staying at 0.6
Marc Droz
@b1tc0de
Aug 27 2016 20:44
thanks @hvuntokrul for your time i appreciate it that was is very helpful
CamperBot
@camperbot
Aug 27 2016 20:44
b1tc0de sends brownie points to @hvuntokrul :sparkles: :thumbsup: :sparkles:
:cookie: 325 | @hvuntokrul |http://www.freecodecamp.com/hvuntokrul
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 20:44
you have a specificity issue
you need to make .active more specific so it's style doesn't get overridden
in your css target .app-circle .active instead of just .active
Ethan Rose
@ethanrose
Aug 27 2016 20:46
ohhhh.... you're right! I just moved .active to the bottom of my css... because it was getting overridden by the button styling
and it worked!!!
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 20:46
yep
Ethan Rose
@ethanrose
Aug 27 2016 20:47
Thank you so much!!! @TheJaredWilcurt
CamperBot
@camperbot
Aug 27 2016 20:47
aidansven sends brownie points to @thejaredwilcurt :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for thejaredwilcurt
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 20:47
they had the same specificity value (10) so it defaulted to whichever came last in the CSS document
Ethan Rose
@ethanrose
Aug 27 2016 20:48
yep..! Ah and the other little thing I noticed is apparently toggleClass("doNotPutADotHere")
it doesn't work with the dot, but it works without it ;)
Thank you so much Jared
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 20:48
correct, any of the jQuery .xClass methods already expect a class
.addClass('className')
Ethan Rose
@ethanrose
Aug 27 2016 20:49
ahh.. good. got it! :)
There's a graph I made, you can paste in any CSS to have it evaluate CSS Specificity
Ethan Rose
@ethanrose
Aug 27 2016 20:50
ah very cool!
ManBearPigg
@ManBearPigg
Aug 27 2016 21:01
...

'

// Setup
function phoneticLookup(val) {
var result = "";

// Only change code below this line
var lookup = {
"alpha": "Adams",

"bravo": "Boston",

"charlie": "Chicago",

"delta": "Denver",

"echo": "Easy",

"foxtrot": "Frank",

};
result = lookup.val;
// Only change code above this line
return result;
}

// Change this value to test
console.log(phoneticLookup("charlie"));
'

That printed weird
Anyways, return lookup.charlie works, but lookup.val does not work
val = charlie
I don't get it
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 21:02
```
surround your code with three graves
```
ManBearPigg
@ManBearPigg
Aug 27 2016 21:04
ok
I figured it out
It didn't like the dot notation

// Setup
function phoneticLookup(val) {
  var result = "";

  // Only change code below this line
  var lookup = {
    "alpha": "Adams",

    "bravo": "Boston",

    "charlie": "Chicago",

    "delta": "Denver",

    "echo": "Easy",

    "foxtrot": "Frank",

  };
  result = lookup[val];
  // Only change code above this line
  return result;
}

// Change this value to test
console.log(phoneticLookup("charlie"));
It likes lookup[val] but would not accept lookup.val
why is that?
Tyler Moeller
@TylerMoeller
Aug 27 2016 21:08
@ManBearPigg bracket notation is required when referencing variables or values with special characters. Otherwise, you can use dot notation.
ManBearPigg
@ManBearPigg
Aug 27 2016 21:09
I like to use bracket notation, but it was telling me often that "dot notation would be better here". Why was it giving me those notifications?
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 21:09
if you did console.log(lookup.foxtrot) what do you think you would see in the console
Tyler Moeller
@TylerMoeller
Aug 27 2016 21:20
@ManBearPigg That's a code styling issue with jshint - should be a yellow warning, not a red error I think. Typically, dot notation is a little faster to write and cleaner to read, so for styling lookup.alpha would be better than lookup['alpha']
Alex
@Sevohan
Aug 27 2016 21:28
Hey Everyone I'm finishing up my quote Machine and got it to work last night but messed something up between then and now. Can anyone help me understand why it doesn't work now?
'''
$("twitter-share-button").attr("href","https://twitter.com/intent/tweet?text=" + encodeURIComponent(text) + "");
'''
CamperBot
@camperbot
Aug 27 2016 21:28
:bulb: to format code use backticks! ``` more info
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 21:32
you are targeting a tag called twitter-share-button. jQuery is looking through the DOM for an element that looks like <twitter-share-button></twitter-share-button>
Joel Santos
@St3ps
Aug 27 2016 21:34
Can anyone tell me why my media query is not working?
https://jsfiddle.net/hr2p1e45/
Alex
@Sevohan
Aug 27 2016 21:35
@TheJaredWilcurt I tried $(".twitter-share-button") and $("#twitter-share-button") nothing worked for me.
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 21:35
you aren't targeting anything in the media query
@media screen and (max-width: 300px) {
    .moo {
        background-color: #F00;
    }
}
John Doe
@codingisfun11
Aug 27 2016 21:36
how can I improve?
blob
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 21:37
@Sevohan send me a link
Joel Santos
@St3ps
Aug 27 2016 21:37
@TheJaredWilcurt god i feel stupid. Thank you
CamperBot
@camperbot
Aug 27 2016 21:37
st3ps sends brownie points to @thejaredwilcurt :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for thejaredwilcurt
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 21:38
@codingisfun11 detect an empty string being passed in and return. use an object and not a switch case
@Sevohan I'm not looking at that until you get rid of all the single character variable names. Use meaningful names.
Alex
@Sevohan
Aug 27 2016 21:46
@TheJaredWilcurt Someone told me to use that section from twitter to make the tweet button look correct. I'll work through it and figure out better names
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 21:50
Your code works correctly, If you inspect element, that <a> tag's href is being updated, it just contains no text, so nothing is displayed on the page
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 21:56
if you ware wanting to target the button that is visible on screen, then you need to target the ID for it
Alex
@Sevohan
Aug 27 2016 22:20
@TheJaredWilcurt Thank you for your help. I think I just have some kind of mental disconnect as to how to target the ID for some reason.
CamperBot
@camperbot
Aug 27 2016 22:20
sevohan sends brownie points to @thejaredwilcurt :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for thejaredwilcurt
CompGeekGirl
@LisaRamos
Aug 27 2016 22:21
function diff(arr1, arr2) {
  var newArr = arr1.concat(arr2);

  function check(item) {
    if (arr1.indexOf(item) === -1 || arr2.indexOf(item) === -1) {
      return item;
    } else if (arr2.indexOf(item) > -1) {
      console.log(item + ' exists in the collection.');
    }
  }

  return newArr.filter(check);
}

diffArray([1, 2, 3, 5], [1, 2, 3, 4, 5]);
Hello, I'm having difficulty with Front End: Diff Two Arrays. It says to compare two arrays and return a new array with any items only found in one of the two given arrays, but not both. In other words, return the symmetric difference of the two arrays. The message I got was diffArray is not defined. Now how can I solve this problem in order to get this thing to run?
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 22:23
you are trying to run a function called diffArray, but that is not defined anywhere. You are however defining a function called diff
karocann
@karocann
Aug 27 2016 22:24
Starting to build my Tribute page. It would be fairly easy to build with a table, but based on the exersizes I think we are supposed to use <div> elements. Is there a preference for how we construct the page?
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 22:25
Tables should only be used for displaying tabular data
divs should only be used when there is no more-specific tag name that would be applicable

for example

BAD:

<div id="footer">This is the footer of my page</div>

GOOD:

<footer>This is the footer of my page</footer>
karocann
@karocann
Aug 27 2016 22:26
OK. Second question - the instructions say no CSS. Does that include inline style tags as well or do they mean no linking to a CSS page?
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 22:27
send me a link to what you are talking about
karocann
@karocann
Aug 27 2016 22:28
OK. The page is a mess right now, but will try to resurrect it and send you a link.
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 22:28
nevermind
what they mean is, you should be using Bootstrap classes and not doing any custom styles
karocann
@karocann
Aug 27 2016 22:28
OK. Thanks-
tyl-er
@tyl-er
Aug 27 2016 22:30

Hey guys I'm almost done with my random quote generator. I need help making the tweet button work. My quotes are stored as strings in a an array. Is there away to add them on to the end of my href like this: href='http://twitter.com/home/?status=string ?

http://codepen.io/tyl-er/pen/KrjWVA?editors=1000

Alex
@Sevohan
Aug 27 2016 22:34
@tyl-er Thats actually what I'm working on right now. I had it working for a few minutes but now it's acting strange. You may be able to use something like this
encodeURIComponent(text);
AshenGregory
@AshenGregory
Aug 27 2016 22:35
I have an image to use in the Tribute exercise, where do I save the pic so that it is available to Codepen?
The Jared Wilcurt
@TheJaredWilcurt
Aug 27 2016 22:35
cloudinary, github, dropbox
Bob Evermore
@BeeQuickest
Aug 27 2016 22:36
@AshenGregory You can simply link to them at a location on the internet if they exist there. I pulled mine from Wikipedia.
AshenGregory
@AshenGregory
Aug 27 2016 22:37
dropbox is giving me issues, I'll try github. Thanks!! (These are my own images)
cwynn69
@cwynn69
Aug 27 2016 22:49
looking for help on create a form element
"Make sure your form has an action attribute which is set to /submit-cat-photo"

cant seem to get this last bit..... this is how i have the code.....<form>

<input type="text" placeholder="cat photo URL">
</form>

can anyone help?
Stephen James
@sjames1958gm
Aug 27 2016 22:53
@cwynn69 which challenge?
@cwynn69 Add the code listed into your form element.
cwynn69
@cwynn69
Aug 27 2016 22:56
this is Create a Form Element
Stephen James
@sjames1958gm
Aug 27 2016 22:56
action="/submit-cat-photo"
cwynn69
@cwynn69
Aug 27 2016 22:57
in place of the PLaceholder?
I dont know where Action needs to be...
Stephen James
@sjames1958gm
Aug 27 2016 22:57
@cwynn69 In your form element not your input element
@cwynn69 The action is related to the form so goes in there
cwynn69
@cwynn69
Aug 27 2016 22:58
ok, so have a form element seperately.... ok let me try that thanks
Stephen James
@sjames1958gm
Aug 27 2016 22:59
@cwynn69 Modify the existing form element
cwynn69
@cwynn69
Aug 27 2016 23:04
thanks @sjames1958gm thats really helped..... bit of a mind block on that one
CamperBot
@camperbot
Aug 27 2016 23:04
cwynn69 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 2903 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Stephen James
@sjames1958gm
Aug 27 2016 23:11
@cwynn69 :+1:
Aaron
@apalm1341
Aug 27 2016 23:26
@apalm1341
http://codepen.io/ap1341/pen/XKvggq
Can someone help please?
Somehow my h1 element text got hidden up by the background and I can no longer see it
Also, I think I hotlinked since I used url from unsplash site
Am I allowed to do that if that is what I am doing?
or do I need to use a site like imgur or dropbox?
Tyler Moeller
@TylerMoeller
Aug 27 2016 23:39
@apalm1341 Your H1 is hidden because you have margin-top: -10% in your CSS for the .pageOne class. Hotlinking is seen as bandwidth theft by some. Use dropbox or postimage.org, imgur doesn't work with codepen.
Aaron
@apalm1341
Aug 27 2016 23:43
@TylerMoeller what would you recommend doing then?
wuksha
@wuksha
Aug 27 2016 23:43
Can somebody help me about first project?
Tyler Moeller
@TylerMoeller
Aug 27 2016 23:44
@apalm1341 I recommend using bootstrap's fixed-to-top navbar instead and adding padding to avoid the whitespace issue. https://getbootstrap.com/components/#navbar-fixed-top
coffeebeanzz
@coffeebeanzz
Aug 27 2016 23:44
What is your question? @wuksha
wuksha
@wuksha
Aug 27 2016 23:45
@coffeebeanzz I build page like they provide me, on my way with a lot of css and I think on hard way. Should I post this?
coffeebeanzz
@coffeebeanzz
Aug 27 2016 23:47
@wuksha it doesnt have to be jus like the example as long as you meet the user stories like having a link fir more info. CSS is good !
sure u can copy and paste the url here
wuksha
@wuksha
Aug 27 2016 23:48
@coffeebeanzz thanks
Look at this if you have time https://codepen.io/wuksha/pen/KrOvkA
CamperBot
@camperbot
Aug 27 2016 23:48
wuksha sends brownie points to @coffeebeanzz :sparkles: :thumbsup: :sparkles:
:star2: 1019 | @coffeebeanzz |http://www.freecodecamp.com/coffeebeanzz
coffeebeanzz
@coffeebeanzz
Aug 27 2016 23:53
@wuksha looks good! :+1: i would change copyrite to copyright
wuksha
@wuksha
Aug 27 2016 23:53
@coffeebeanzz Oooo my mistake, but i can not publish this, right?
coffeebeanzz
@coffeebeanzz
Aug 27 2016 23:55
@wuksha you can include it in your portfolio if you want to as an example of your work
wuksha
@wuksha
Aug 27 2016 23:57
@coffeebeanzz Ok, but i shouldn't click "I've complete this challenge" on course whit this simple project? I'm afraid
coffeebeanzz
@coffeebeanzz
Aug 27 2016 23:59
@wuksha even after u complete the challenge, you can go back and make changes as you learn more. It will update.