These are chat archives for FreeCodeCamp/HelpFrontEnd

17th
Apr 2016
Bruce Young
@mutantspore
Apr 17 2016 00:00
@bcnjordi9 html5 geolocate
Jordi Vilagut Treserra
@jordivilagut
Apr 17 2016 00:00
@mutantspore I've got this as well
Jordi Vilagut Treserra
@jordivilagut
Apr 17 2016 00:00
navigator.geolocation.getCurrentPosition(function(position) {
Bruce Young
@mutantspore
Apr 17 2016 00:01
ok
Jordi Vilagut Treserra
@jordivilagut
Apr 17 2016 00:01
but I dont know how to change the API call
Jeff
@adzam5
Apr 17 2016 00:01
I made an autocomplete dropdown for a text input field. It is working great. I added the following code to hide the dropdown if the input is no longer in focus. Again, works great except I can't click on anything in the dropdown because it just dismisses it. Any suggestions?
$('#search').on('focusout', function() {
     $('#results').hide();
 });
Jordi Vilagut Treserra
@jordivilagut
Apr 17 2016 00:01
so instead of lat=-27 lon=152
Bruce Young
@mutantspore
Apr 17 2016 00:01
well you’ll need to get the lat an dlon from the geolocation and give it to the api call
Jordi Vilagut Treserra
@jordivilagut
Apr 17 2016 00:01
i would like lat=position.coords.latitude
Bruce Young
@mutantspore
Apr 17 2016 00:02
yes
Jordi Vilagut Treserra
@jordivilagut
Apr 17 2016 00:02
but I cannot do:
Bruce Young
@mutantspore
Apr 17 2016 00:02
BUT youwil need to call teh weathe rapi from wityhin the geolocate or wrap the api in a function and call it from within
Jordi Vilagut Treserra
@jordivilagut
Apr 17 2016 00:02
    $.getJSON("http://api.openweathermap.org/data/2.5/weather?lat=-position.coords.latitude&lon=position.coords.longitude&APPID=d5176468543e7e1b49ab1c47a42279", function(weatherData) {
i don't know what the right syntax for this call is
Bruce Young
@mutantspore
Apr 17 2016 00:03
@bcnjordi9 well it wil need some quotes around the right bits as some is a string and some is a variable so you can concatenate it
you have a pen?
Jordi Vilagut Treserra
@jordivilagut
Apr 17 2016 00:04
yes i do
Bruce Young
@mutantspore
Apr 17 2016 00:07
@bcnjordi9 there it is sorted out.. you can see the quotes to seperate out the string from the variables.
http://codepen.io/MutantSpore/pen/BKxZvL?editors=1010
Jordi Vilagut Treserra
@jordivilagut
Apr 17 2016 00:09
ohhh! Ok I see how it works now!
Thanks a lot :D @mutantspore
CamperBot
@camperbot
Apr 17 2016 00:09
bcnjordi9 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1424 | @mutantspore | http://www.freecodecamp.com/mutantspore
Bruce Young
@mutantspore
Apr 17 2016 00:12
@bcnjordi9 if you look at it again you can see how it’s actually easier and looks better to seperate out the parameters into an object and call the getJSON in a slightly different way. I have made the changes
I have most of this working.. I am not sure what I am missing to get the tweet button to work
Bruce Young
@mutantspore
Apr 17 2016 00:30
@clnquacky make the tweet button an <A> with button class to make it look like a button and then update the href it will have using JS or jQuery.
Charlotte N.
@clnquacky
Apr 17 2016 00:33
the js/jquery, I think is where I am confused.. I have looked at several others and tried different methods but still seem to be missing something.
@mutantspore is this what you meant with the <A> ? <a><button class='btn2' onclick='tweetUrl'>Tweet Quote</button></a>
Bruce Young
@mutantspore
Apr 17 2016 00:34
@clnquacky $("#mycustomtwitterbutton").attr('href', tweeturl);
@clnquacky <a class=‘btn2' target="_blank" id="mycustomtwitterbutton" href="" >Tweet Quote</a>
Charlotte N.
@clnquacky
Apr 17 2016 00:39
@mutantspore I do that and then when I click on Tweet it does open to a new window, but it is my window and then flashes through the quotes.
Almost thinking I need to go back to the drawing board.
Bruce Young
@mutantspore
Apr 17 2016 00:41
@clnquacky don’t put onClick things in the HTML. use jQuery events like .on or .click
Charlotte N.
@clnquacky
Apr 17 2016 00:44
yeah.. back to the drawing board and reviewing jquery stuff I guess. :(
Bruce Young
@mutantspore
Apr 17 2016 00:45
you have the quotes and authors ok. so that’s the most of it done
Charlotte N.
@clnquacky
Apr 17 2016 00:47
but only if I leave the onclick = in there...
MiteyDrill
@MiteyDrill
Apr 17 2016 00:58
Yo, i'm doing a challenge, it's asking me to build a personal webpage. One of the UserStory thing is I have to have 'clicking buttons in the navigation' does this mean like buttons that go to different webpages? Or what?
Charlotte N.
@clnquacky
Apr 17 2016 01:02
@MiteyDrill Yes it means buttons that go to other places that we are (like Facebook, Twitter, CodePen, ect).
MiteyDrill
@MiteyDrill
Apr 17 2016 01:03
tell me how fam ;(
Charlotte N.
@clnquacky
Apr 17 2016 01:06
You have to create a button class.. For example. <a target="_blank" id="twitter" class="btn btn-lg btn-default" href="https://your twitter account address" role="button"><i class="fa fa-twitter"></i>Twitter</a> and so on for each of the buttons you create.
ZctrapCoding
@ZctrapCoding
Apr 17 2016 01:26
Is their any projects that fcc doesnt give you that i might want to start instead of only the one fcc offers
Justin
@daemedeor
Apr 17 2016 01:31
@ZctrapCoding you can just do your own exercises... you don't have to build the ones that are offered.. you just won't get credit :} its easier to evaluate progress with specific details
ZctrapCoding
@ZctrapCoding
Apr 17 2016 01:32
okay thx @daemedeor
CamperBot
@camperbot
Apr 17 2016 01:32
zctrapcoding sends brownie points to @daemedeor :sparkles: :thumbsup: :sparkles:
:star: 478 | @daemedeor | http://www.freecodecamp.com/daemedeor
MiteyDrill
@MiteyDrill
Apr 17 2016 01:37
@clnquacky Oh okay, I get it thanks :D !
CamperBot
@camperbot
Apr 17 2016 01:37
miteydrill sends brownie points to @clnquacky :sparkles: :thumbsup: :sparkles:
:star: 284 | @clnquacky | http://www.freecodecamp.com/clnquacky
MiteyDrill
@MiteyDrill
Apr 17 2016 01:42
Does anyone know how to make those cool buttons that'll scroll down the webpage to a certain part?
Frank XC
@tenkdayz
Apr 17 2016 01:54
@MiteyDrill using jquery or pure js?
Justin
@daemedeor
Apr 17 2016 02:05
@MiteyDrill if you don't care about the section to keep following just have <a href="#idofelement"></a>
and later on your page
<h2 id="idofelement"></h2>
@tenkdayz don't even need to use jquery or js ^.^
oh wait
"to scroll"
you do
-.-"
i lie
Bent Cardan
@reqshark
Apr 17 2016 02:48
@MiteyDrill It's done in jquery
Michael Karpinski
@karpimpski
Apr 17 2016 02:52
how can i make a keypress redirect to a click event?
for example, I want
$(document).keypress(function(e){
    console.log(e.keyCode);
    if(e==49){
      $("#one").click();
    }
  });
I want that to redirect to my $("#one").click() function
Matt Yamamoto
@MattYamamoto
Apr 17 2016 02:54
@karpimpski why not just write a function which you could then call in the keypress and the click handlers?
Michael Karpinski
@karpimpski
Apr 17 2016 02:55
@MattYamamoto yeah, that makes a lot more sense. thanks!
CamperBot
@camperbot
Apr 17 2016 02:55
karpimpski sends brownie points to @mattyamamoto :sparkles: :thumbsup: :sparkles:
:star: 959 | @mattyamamoto | http://www.freecodecamp.com/mattyamamoto
Dylan
@dhcodes
Apr 17 2016 02:55
i'm not sure why @karpimpski's code wouldn't work though?
Michael Karpinski
@karpimpski
Apr 17 2016 02:56
@dhcodes yeah, I thought it would
Michael Karpinski
@karpimpski
Apr 17 2016 03:04
is there a JQuery function to animate a button being pushed down?
I can't find one, but maybe there's a simple way to animate a button being pushed with JQuery?
Dylan
@dhcodes
Apr 17 2016 03:06
you mean like 3d?
Michael Karpinski
@karpimpski
Apr 17 2016 03:07
@dhcodes I just want to make a simple animation that makes it look like a button is being pushed
I guess that would be 3d then, yeah
Bent Cardan
@reqshark
Apr 17 2016 03:08
@karpimpski use css animations
Dylan
@dhcodes
Apr 17 2016 03:10
@karpimpski if you are using bootstrap or jquery ui, using the .click() would simulate a click
if you want it to appear held down, you could disable the button immediately after
Michael Karpinski
@karpimpski
Apr 17 2016 03:11
@dhcodes I'll try the .click() in a sec. what if I want it to appear held down only as long as I have the button/mouse held down?
@dhcodes putting <$("#three").click();> in my keypress function didn't make the button do any animations
Dylan
@dhcodes
Apr 17 2016 03:12
@karpimpski oh i see what you mean
one sec
@karpimpski what if you use make a class similar to the buttons :active class and then use jQuery to add it
Michael Karpinski
@karpimpski
Apr 17 2016 03:17
@dhcodes yeah, my idea was just to make a class with a slightly darker shade and just do that
but I was really hoping for a simpler JQuery solution. I thought there was one
Dylan
@dhcodes
Apr 17 2016 03:20
this somewhat similar question implies there's not an easier way: http://stackoverflow.com/questions/2290829/how-to-force-a-hover-state-with-jquery
Michael Karpinski
@karpimpski
Apr 17 2016 03:22
@dhcodes well what kind of CSS would you recommend for a button click?
@dhcodes for a lot of buttons it just looks like they move the button down a few pixels. how can I do that with CSS?
Dylan
@dhcodes
Apr 17 2016 03:24
@karpimpski I'd start with the color, but if you want to venture into moving it down...
translate, particularly, will do x,y
@karpimpski it looks like the bootstrap buttons just darken and add an inner shadow
on click
Michael Karpinski
@karpimpski
Apr 17 2016 03:26
@dhcodes hm, well I can't get Bootstrap to make the buttons look clicked when I type a key is the problem
Dylan
@dhcodes
Apr 17 2016 03:27
@karpimpski I'm saying you look in the Bootstrap CSS for the attributes of button:active, copy those attributes to a class and then use jQuery to add that class to your button on key press
then profit
Michael Karpinski
@karpimpski
Apr 17 2016 03:28
@dhcodes I think you forgot the "???" in between, and I see now! I know this will sound like a noob question, but how do I see Bootstrap's CSS?
Dylan
@dhcodes
Apr 17 2016 03:28
although couldn't you just have the keypress initiate the button. It's got to be easier than what I just said
Michael Karpinski
@karpimpski
Apr 17 2016 03:28
@dhcodes yeah, I tried that earlier remember?
the one guy said it was simpler the other way, but nobody ever told me how to do that
@dhcodes also, I gave a button this class, but it won't change:
.clicked{
  translate(0px,-10px);
}
I changed it to add "transform:" before translate, but no change
Dylan
@dhcodes
Apr 17 2016 03:31
@karpimpski i just looked and apparently bootstrap already has a .active class that you can add to buttons
so... $('yourbutton').addClass('active')
i suppose
as for translate, are you using addClass?
Michael Karpinski
@karpimpski
Apr 17 2016 03:32
@dhcodes yep, that works! and no, I just gave a random element that CSS class
Dylan
@dhcodes
Apr 17 2016 03:33
@karpimpski transform would need to be written as: transform:translate(0,-10px);
and then you would need to addClass('clicked'); on your keypress
to your button/div
anywho, I'm signing off. Best of luck
Michael Karpinski
@karpimpski
Apr 17 2016 03:34
@dhcodes all right, thanks for your help. sorry for being such a hassle, I'm not very good at this yet!
CamperBot
@camperbot
Apr 17 2016 03:34
karpimpski sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star: 652 | @dhcodes | http://www.freecodecamp.com/dhcodes
Dylan
@dhcodes
Apr 17 2016 03:34
not a hassle. I learned stuff too. Most of this I just b.s. and then go look and am like, "oh yeah, I'm doing that wrong"
cheers
cmf89
@cmf89
Apr 17 2016 03:35
Hey guys, I've just finished the weather page. Can some people try loading it and see if it brings up the correct weather info and icons for your area? https://codepen.io/cmf89/full/LNmbeO/
Paul Borawski
@iAmNawa
Apr 17 2016 03:43
@cmf89 It’s not loading :(
cmf89
@cmf89
Apr 17 2016 03:44
@iAmNawa if you open console on the page, can you tell me what the message says?
Bent Cardan
@reqshark
Apr 17 2016 03:44
jquery.min.js:4 Mixed Content: The page at 'https://s.codepen.io/cmf89/fullpage/LNmbeO?' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://api.openweathermap.org/data/2.5/weather?lat=37.9871251&lon=-122.5840933&appid=5e76d3b634f4ffcdb64a5119037f245f'. This request has been blocked; the content must be served over HTTPS.
I had issues with doing this project in XML as well
I ended up doing it with JSON stringify
Hector Garcia
@augmt
Apr 17 2016 03:46
@cmf89 it works for me if i'm on http and not https
Michael Karpinski
@karpimpski
Apr 17 2016 03:46
@cmf89 it won't load for me
cmf89
@cmf89
Apr 17 2016 03:47
seems this is a weird challenge... since in chrome at least... chrome won't allow the geoip functions on http, and you can't load the weather api over https
thank you @iAmNawa @reqshark @augmt @karpimpski
CamperBot
@camperbot
Apr 17 2016 03:50
cmf89 sends brownie points to @iamnawa and @reqshark and @augmt and @karpimpski :sparkles: :thumbsup: :sparkles:
:star: 382 | @augmt | http://www.freecodecamp.com/augmt
:star: 316 | @karpimpski | http://www.freecodecamp.com/karpimpski
:star: 453 | @iamnawa | http://www.freecodecamp.com/iamnawa
:star: 5 | @reqshark | http://www.freecodecamp.com/reqshark
Hector Garcia
@augmt
Apr 17 2016 03:50
@cmf89 this may be a longshot, but try to request this URL with $.getJSON: https://crossorigin.me/http://api.openweathermap.org/data/2.5/weather?lat=" + position.coords.latitude + "&lon=" + position.coords.longitude + "&appid=5e76d3b634f4ffcdb64a5119037f245f
cmf89
@cmf89
Apr 17 2016 03:52
@augmt that worked perfectly, I don't get any more mixed-content errors
thank you
Hector Garcia
@augmt
Apr 17 2016 03:53
@cmf89 that's the solution i personally use: a CORS proxy
a better solution would be to find a weather api that's served through HTTPS
openweathermap is served through HTTPS, but not for free
cmf89
@cmf89
Apr 17 2016 03:54
yeah, I think this will work perfectly for now, since it is just a test project page
Michael Karpinski
@karpimpski
Apr 17 2016 03:55
is there any way to get reset a CSS class? I want to make a new .active class for my site, but I'm using Bootstrap and i don't know how to get rid of the default
Hector Garcia
@augmt
Apr 17 2016 04:02
@karpimpski there isn't a simple way to do so across every browser. but you can create a css rule that supersedes Bootstrap's styles
Michael Karpinski
@karpimpski
Apr 17 2016 04:04
@augmt yeah, what I'm trying to do is completely override it. I made a custom "active"-type class that moves a button down by 1px if a certain number is typed. that works fine because there is no Bootstrap class for keypresses. I want to have the same animation for button clicks, but I don't want the boxes to get darker
Hector Garcia
@augmt
Apr 17 2016 04:05
@karpimpski is this on your own site or on codepen?
Michael Karpinski
@karpimpski
Apr 17 2016 04:06
@augmt CodePen. I don't know if this is why you asked, but I found a solution that would work if it was my own site and not CodePen
Hector Garcia
@augmt
Apr 17 2016 04:08
@karpimpski i asked because if it were your own site you could customize the bootstrap.css file
Michael Karpinski
@karpimpski
Apr 17 2016 04:09
@augmt yeah, that's the solution I found
Hector Garcia
@augmt
Apr 17 2016 04:09
@karpimpski but what you can do on codepen is play around with bootstrap's LESS mixins
^ that's assuming you're using buttons, but you can play with any of bootstrap's mixins
Michael Karpinski
@karpimpski
Apr 17 2016 04:14
@augmt I tried doing this:
.active{
  transform: translate(0px,1px);
  background-color: default !important;
  border-color: default !important;
}
but it doesn't work
what syntax should I use? I'd rather not find the hex colors for the buttons, but that's the only solution I can think of
Hector Garcia
@augmt
Apr 17 2016 04:16
@karpimpski i don't think default is css syntax. try initial
Michael Karpinski
@karpimpski
Apr 17 2016 04:17
@augmt that makes it white
Hector Garcia
@augmt
Apr 17 2016 04:17
ah, right
i think you may have to find the hex colors
FromMotherOwl
@FromMotherOwl
Apr 17 2016 04:18
@karpimpski ....Sorry if I'm totally out of place but did you try 'primary'
Michael Karpinski
@karpimpski
Apr 17 2016 04:19
@FromMotherOwl do you mean "background-color: primary !important"?
FromMotherOwl
@FromMotherOwl
Apr 17 2016 04:19
yes
Hector Garcia
@augmt
Apr 17 2016 04:19
@brand-primary:         #337ab7;
@brand-success:         #5cb85c;
@brand-info:            #5bc0de;
@brand-warning:         #f0ad4e;
@brand-danger:          #d9534f;
Michael Karpinski
@karpimpski
Apr 17 2016 04:19
@FromMotherOwl yeah, I tried that
FromMotherOwl
@FromMotherOwl
Apr 17 2016 04:19
Sorry I'm only half following along....I just got my nav bar to actually point down page!!! Margaritas for all
@karpimpski Well ignore me then, sorry
Michael Karpinski
@karpimpski
Apr 17 2016 04:20
@FromMotherOwl no worres, thanks for trying to help!
CamperBot
@camperbot
Apr 17 2016 04:20
karpimpski sends brownie points to @frommotherowl :sparkles: :thumbsup: :sparkles:
:star: 140 | @frommotherowl | http://www.freecodecamp.com/frommotherowl
Michael Karpinski
@karpimpski
Apr 17 2016 04:20
@augmt that's annoying because I have to set different classes based on the buttons. thanks for the help
CamperBot
@camperbot
Apr 17 2016 04:20
karpimpski sends brownie points to @augmt :sparkles: :thumbsup: :sparkles:
:star: 383 | @augmt | http://www.freecodecamp.com/augmt
FromMotherOwl
@FromMotherOwl
Apr 17 2016 04:21
So I had been using Imgur for my pictures on my project pens, but it doesn't seem to be working anymore....is that happening for everyone?
Michael Karpinski
@karpimpski
Apr 17 2016 04:22
@FromMotherOwl not sure. I personally use Google Pictures, since that's more private and you can be sure that they stay up
Hector Garcia
@augmt
Apr 17 2016 04:22
@FromMotherOwl codepen and imgur don't play nice
FromMotherOwl
@FromMotherOwl
Apr 17 2016 04:22
@karpimpski and @augmt Good to know, I guess I need to look into google pictures
Google knows everything
Michael Karpinski
@karpimpski
Apr 17 2016 04:23
@FromMotherOwl if you don't want to use Google, there are plenty of other sites. or, you could just use images straight from your computer (but make sure they're backed up!)
FromMotherOwl
@FromMotherOwl
Apr 17 2016 04:24
@karpimpski Thanks! I feel like I'm never going to finish this project, but one line at a time I guess lol
CamperBot
@camperbot
Apr 17 2016 04:24
frommotherowl sends brownie points to @karpimpski :sparkles: :thumbsup: :sparkles:
:star: 317 | @karpimpski | http://www.freecodecamp.com/karpimpski
Michael Karpinski
@karpimpski
Apr 17 2016 04:25
@FromMotherOwl which one? the portfolio site
?
FromMotherOwl
@FromMotherOwl
Apr 17 2016 04:25
@karpimpski Yep...it's never going to end
Michael Karpinski
@karpimpski
Apr 17 2016 04:26
@FromMotherOwl there are plenty of sources for help on that! I personally recommend doing the best you can, completing all of the user stories, then looking on YouTube or some blogs to see better ways of going about things
FromMotherOwl
@FromMotherOwl
Apr 17 2016 04:27
@karpimpski Yeah, that's been the general go of it so far. I have this idea that I can just keep updating it to look better and be more useful to me as I learn more. Now I've just got to get my thumb nails back up, and make social media buttons
Michael Karpinski
@karpimpski
Apr 17 2016 04:28
@FromMotherOwl that's the easy part! congratulations on (almost) finishing! :)
FromMotherOwl
@FromMotherOwl
Apr 17 2016 04:28
Also I'm not sure I did the thumbnails right...I took a screen shot of the site, saved the image and imbeded a link to the site in the image
Michael Karpinski
@karpimpski
Apr 17 2016 04:28
@FromMotherOwl there's no "right" way, but I did mine the same way!
FromMotherOwl
@FromMotherOwl
Apr 17 2016 04:29
@karpimpski Thanks, its been frustrating, but I think it I can stick with it through this I might have a shot of actually learning the thing
CamperBot
@camperbot
Apr 17 2016 04:29
frommotherowl sends brownie points to @karpimpski :sparkles: :thumbsup: :sparkles:
:warning: frommotherowl already gave karpimpski points
FromMotherOwl
@FromMotherOwl
Apr 17 2016 04:29
Good to know!!! Now I feel a bit better
Michael Karpinski
@karpimpski
Apr 17 2016 04:30
@FromMotherOwl just gotta keep trying. I won't be on for much longer, but if you need help feel free to IM me or mention my name and I'll try my best to help!
FromMotherOwl
@FromMotherOwl
Apr 17 2016 04:31
@karpimpski You're the best, no matter what the neighbors say
Michael Karpinski
@karpimpski
Apr 17 2016 04:32
@FromMotherOwl that seems like a reference to something I don't understand, but thank you!
CamperBot
@camperbot
Apr 17 2016 04:32
karpimpski sends brownie points to @frommotherowl :sparkles: :thumbsup: :sparkles:
:warning: karpimpski already gave frommotherowl points
Matthew
@mbindewald
Apr 17 2016 04:49
Hey guys, I've got a question. I'm doing the local weather app from the front end projects, but I'm doing it on my computer instead of codepen. Chrome automatically has geolocation services blocked for my site, with no way to unblock it (The project isn't hosted anywhere, just files on my computer). It works in Firefox, and other websites work in chrome. Any thoughts?
Paul Manning
@paulmanning
Apr 17 2016 04:52
I think Chrome doesn’t allow geolocation unless you have https…..something changed recently I think.
Matthew
@mbindewald
Apr 17 2016 04:53
ahhh alright. Thanks
prashant
@findname
Apr 17 2016 04:58
isn't this a soln myStr = "\ \t \t \r \n" to exercise Encode the following sequence, separated by spaces:
backslash tab tab carriage-return new-line and assign it to myStr
Jeff
@adzam5
Apr 17 2016 04:59
What would cause "Reference Error add not defined" on the following code
var max = $('.answers input[type=number]').map(function(_, el) {
    return parseInt($(el).val());
}).get();
var sum = max.reduce(add, 0);
function add(a, b) {
    return a + b;
}
It seems to be working fine on one computer, but not another
FromMotherOwl
@FromMotherOwl
Apr 17 2016 05:02
Do I need to add something to my code to allow for Font Awesome? I have bootstrap enabled, and I'm trying to link my facebook to my portfolio site by using a button, but so far I can only get it to work with the text....how do I add the icon?
Hector Garcia
@augmt
Apr 17 2016 05:05
@FromMotherOwl did you add FontAwesome to your external css?
FromMotherOwl
@FromMotherOwl
Apr 17 2016 05:05
@augmt Uhhh I did not....so just add it in the css section?
Hector Garcia
@augmt
Apr 17 2016 05:06
yep, the same way you added bootstrap, just type in FontAwesome and it should pop up
FromMotherOwl
@FromMotherOwl
Apr 17 2016 05:07
@augmt You are a genius! Thanks
CamperBot
@camperbot
Apr 17 2016 05:07
frommotherowl sends brownie points to @augmt :sparkles: :thumbsup: :sparkles:
:star: 384 | @augmt | http://www.freecodecamp.com/augmt
I think I might be ready to move on to the next section???
kirbyedy
@kirbyedy
Apr 17 2016 05:28
@FromMotherOwl well its up to you, but maybe you should spend a bit more time on small adjustments like alignments and margins
FromMotherOwl
@FromMotherOwl
Apr 17 2016 05:30
@kirbyedy That's a fair cop, overall I'm happy with how things line up in the full site. I've set the same margin left for all the far left elements, though the button for the social media icons do throw things a bit off
Jeff
@Jeffgl77
Apr 17 2016 06:16
looking for feedback / suggestions... http://codepen.io/Jeffgl77/full/KzoPjW/
cannelflow
@cannelflow
Apr 17 2016 06:21
@Jeffgl77 :+1: you can center output box perhaps
Paul Borawski
@iAmNawa
Apr 17 2016 06:21
@Jeffgl77 Looks good but that hover blue color isn’t the best choice
Zoher Ali
@Zoher-ali
Apr 17 2016 06:54
Hey every1... can any 1 tell me what twitch.tv api project means ... how can i get user information if he is online or offline and what he is streaming rightnow?
and also how can i get hid/her profile pic link?
its too confusing for me :worried:
Ashok Bakthavathsalam
@kgashok
Apr 17 2016 07:07
http://codepen.io/kgashok/pen/dMeVOV
  • I am not able to "center" my image - how can I do this?
Jackson Bates
@JacksonBates
Apr 17 2016 07:09
@Zoher-ali take some time to read the twitch api documentation linked to on the challenge page. There are a couple of end points you can use and some are more useful than others depending on whether the user is online or offline. The profile pic info is available through api calls, you just have to hunt for it a little :)
Ashok Bakthavathsalam
@kgashok
Apr 17 2016 07:14
The page look OK on the mobile, but on a browser page in the desktop, the image is not aligned.
I found the answer myself at http://stackoverflow.com/a/20396826/307454 - pity, I cannot send brownie points to myself!
Well, somebody can thank me!
Jackson Bates
@JacksonBates
Apr 17 2016 07:26
@kgashok thanks for providing your solution :)
CamperBot
@camperbot
Apr 17 2016 07:26
jacksonbates sends brownie points to @kgashok :sparkles: :thumbsup: :sparkles:
:star: 152 | @kgashok | http://www.freecodecamp.com/kgashok
Ashok Bakthavathsalam
@kgashok
Apr 17 2016 07:32
@JacksonBates :+1:
buiphuking
@buiphuking
Apr 17 2016 07:41
hi guys, is there any way to return how many number in the string
ex: var str = " 333 444" return 6
Ashok Bakthavathsalam
@kgashok
Apr 17 2016 07:41

@buiphuking

str.length provided there are no spaces in the string
str.replace(/[^0-9]/g,"").length irrespective of what the string might have (using regular expressions)

Chad Kreutzer
@ChadKreutzer
Apr 17 2016 07:48
Or are you meaning, "This 1 string has 2 numbers?"
buiphuking
@buiphuking
Apr 17 2016 07:52
i do
Validate US Telephone Numbers, my idea is use regexp , but i don't know how to return
telephoneCheck("1 555-555-5555") i want return 11
Chad Kreutzer
@ChadKreutzer
Apr 17 2016 07:52
^ @kgashok has it if that's what you mean. :)
buiphuking
@buiphuking
Apr 17 2016 07:53
This message was deleted
Ashok Bakthavathsalam
@kgashok
Apr 17 2016 07:54
@buiphuking, you need to add @kgashok to your appreciation message...
if you believe I deserve brownie points :smile:
buiphuking
@buiphuking
Apr 17 2016 07:56
@kgashok thanks!
CamperBot
@camperbot
Apr 17 2016 07:56
buiphuking sends brownie points to @kgashok :sparkles: :thumbsup: :sparkles:
:star: 153 | @kgashok | http://www.freecodecamp.com/kgashok
buiphuking
@buiphuking
Apr 17 2016 08:34
@kgashok are you there ?
Ashok Bakthavathsalam
@kgashok
Apr 17 2016 08:34
yes
buiphuking
@buiphuking
Apr 17 2016 08:36
how to get (555) in a string,
ex: var string = "gfdgdfgd (555) 543575438" , i want if the string have (555) return true
Ashok Bakthavathsalam
@kgashok
Apr 17 2016 08:39
ok...got it.
Instead of replace, you will need to use the equivalent of "find" or "match"

string.search(/\(555\)/g) returns value 9
http://www.w3schools.com/jsref/jsref_search.asp

If the pattern (555) is not there, then search returns the value -1

buiphuking
@buiphuking
Apr 17 2016 08:45
i code str.find , that why it won't works,
thanks! @kgashok
CamperBot
@camperbot
Apr 17 2016 08:45
buiphuking sends brownie points to @kgashok :sparkles: :thumbsup: :sparkles:
:warning: buiphuking already gave kgashok points
buiphuking
@buiphuking
Apr 17 2016 08:48
@kgashok why not just str.search(/(555)/i);
Ashok Bakthavathsalam
@kgashok
Apr 17 2016 08:50
To match (555), it is better you escape the symbol "(" and ")"
/i -> is for case-insensitive
and that is applicable in the case of characters
buiphuking
@buiphuking
Apr 17 2016 08:54
(555) the "\" what is that mean?
(555\)
Ashok Bakthavathsalam
@kgashok
Apr 17 2016 08:56
backslash \ is used for special characters
for e.g. if you want to search for 555*, * has a different meaning within regex
So you will need to use /555\*/
ZhengMaomao
@ZLNAlina
Apr 17 2016 09:05
i dont want to challenge"Bulid a personal portfolio webpage"now. But when i click the button to do next ,the webpage is still on. what can i do? it means i just finish it?
Justin
@daemedeor
Apr 17 2016 09:24
@ZLNAlina just choose another one if you want
Uğur
@UgurKurt
Apr 17 2016 10:19
hey guys,i need some help ,i want my header fixed on top ,but css position:fixed property doesnt work like i expect
how can ı fix it to top ?
ok i did it with bootstrap navbar-fixed-top class
but how can i do it with pure css ?
because navbar class hasnt a absolute positioning
and my other div stands behind it
h4r1m4u
@h4r1m4u
Apr 17 2016 10:28
@UgurKurt add padding-top: 81px; on body
Uğur
@UgurKurt
Apr 17 2016 10:41
why 81 ?
and wouldnt it make my site not mobil responsive
h4r1m4u
@h4r1m4u
Apr 17 2016 10:43
81px is the height of your header. and no, it wouldn't affect mobile responsiveness in any way (unless you're not showing the fixed header on mobile; in which case you can write a CSS media query and adjust the body padding for mobile specifically)
Uğur
@UgurKurt
Apr 17 2016 10:47
thanks for help.
and now my inpage links doesnt work properly
I mean when i click portfoil,it directs me 81 pixels down on the portfoil section
Nazim
@nazimkazim
Apr 17 2016 10:53
@All Hey guys!!! I want my animate.css works every time i call ajax, now it works only after page is loaded, whatshould i do? Please help!!!
http://codepen.io/nazimkazim/pen/PNRzvm
h4r1m4u
@h4r1m4u
Apr 17 2016 11:07
@nazimkazim
$(document).ready(function(){

  // Wikipedia AJAX request

$('#submit-btn').click(function(){

var foundArticle = $("#query").val(); 

console.log(foundArticle);

var wikiUrl = 'http://en.wikipedia.org/w/api.php?action=opensearch&search=' + foundArticle + '&format=json&callback=wikiCalback';

var wikiElem = $('#wikipedia-links');

// Clear content before AJAX call
wikiElem.html("");

// !!! Remove the animate.css classes so that it works on subsequent searches  
wikiElem.removeClass('animated shake');

    $.ajax({
        url:wikiUrl,
        dataType:"jsonp",
        success: function(response) {
            var articleList = response[1];
            //var articleDescr = response[2][0];
            for(var i=0; i < articleList.length; i++) {
               articleStr = articleList[i];
               articleDescr = response[2][i];
               var url = 'http://en.wikipedia.org/wiki/' + articleStr;
               wikiElem.append('<li><a href="' + url+ '" target="_blank" >' + articleStr + '</a>'+'<p class="descr">'+articleDescr+'<p>'+'</li>'); 

            };
          // !!! Add the animate.css classes
          wikiElem.addClass('animated shake');
          console.log(articleList);
          console.log(articleDescr);
        }

    })

    return false;

});

});
Stephen James
@sjames1958gm
Apr 17 2016 11:12
@nazimkazim I read that you can do the following, place after your addClass to remove the animation class.
  setTimeout(function() {
    $("ul").removeClass('animated shake');
  }, 1300);
Uğur
@UgurKurt
Apr 17 2016 11:40
text-align only makes it centered vertically
Islam Ibakaev
@dagman
Apr 17 2016 11:42
@sjames1958gm great idea with timeout
Uğur
@UgurKurt
Apr 17 2016 12:26
Hi guys how can i put some space between my images in a table ?
in portfoil section
any help will be appreciated very very much
Coira Ellison
@Coira
Apr 17 2016 12:27
@UgurKurt try changing td { margin etc} to img {margin etc }
Uğur
@UgurKurt
Apr 17 2016 12:28
i tried td margin
it didnt help
im trying img margin noe
now
it didnt help too
oh it did
thanks
Coira Ellison
@Coira
Apr 17 2016 12:30
np
Islam Ibakaev
@dagman
Apr 17 2016 13:26
hey guys need help with this one. It works strangely. Waits 3/4 of second then outputs numbers all at once instead of output one by one with 3/4 of second interval. What's wrong?
function showNums(array) {
    array.forEach(function(el) {
        setTimeout(function() {
            console.log(el);
        }, 750);
    });
}

showNums([1, 2, 3, 4, 5]);
Greg Duncan
@GregatGit
Apr 17 2016 13:35
@dagman it loops through the array as fast as anything so while it is pausing the loop is still continuing
@dagman you could turn the 750 into a variable and with new loop increase it by 750
nsloc22
@nsloc22
Apr 17 2016 13:48
@dagman this is how setTimeout works in a loop
h4r1m4u
@h4r1m4u
Apr 17 2016 13:48
@dagman
function showNums(array) {
    array.forEach(function(el, index) {
        setTimeout(function() {
            console.log(el);
        }, 750 * index);
    });
}

showNums([1, 2, 3, 4, 5]);
Jeff
@adzam5
Apr 17 2016 14:32
The following code was working fine the other day. Now I am getting the error "add is not defined" in FF, yet it still works in Chrome.
var max = $('.answers input[type=number]').map(function(_, el) {
    return parseInt($(el).val());
}).get();
var sum = max.reduce(add, 0);
function add(a, b) {
    return a + b;
}
Nazim
@nazimkazim
Apr 17 2016 14:44
@sjames1958gm @h4r1m4u Thnks guys you are awesome!
CamperBot
@camperbot
Apr 17 2016 14:44
nazimkazim sends brownie points to @sjames1958gm and @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1780 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
:star: 681 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
Chad Kreutzer
@ChadKreutzer
Apr 17 2016 14:47
@adzam5 try moving the add function definition to before it is called in max.reduce.
function add(a, b) {
    return a + b;
}
var sum = max.reduce(add, 0);
PK
@arcticfries
Apr 17 2016 14:49
Thanks Dustin. I am working thru it:)
Norman Benbrahim
@NormanBenbrahim
Apr 17 2016 14:50
Hey guys, I'm working through the advanced algorithm scripting and I'm having trouble with the Exact Change challenge. Anyone wanna pair program with me? :D
Jeff
@adzam5
Apr 17 2016 14:50
@ChadKreutzer That worked. Thanks! I could have sworn I tried that last night. Who knows though. It was getting late and I was getting frustrated that it wasn't working anymore
CamperBot
@camperbot
Apr 17 2016 14:50
adzam5 sends brownie points to @chadkreutzer :sparkles: :thumbsup: :sparkles:
:star: 583 | @chadkreutzer | http://www.freecodecamp.com/chadkreutzer
Jeff
@adzam5
Apr 17 2016 14:50
@ChadKreutzer Any idea why it was working the way I had it in FF and suddenly stopped?
Chad Kreutzer
@ChadKreutzer
Apr 17 2016 14:52
I had a similar issue. it's cause for some reason FF doesn't like looking ahead for that sort of function implementation and Chrome and IE/Edge don't mind it.
Janaya
@Janaya425
Apr 17 2016 15:06
hello all. Hope everyone is having a nice day. Im hoping to finish a made up website of my animals and me using html and css. Wish me luck!
Stephen James
@sjames1958gm
Apr 17 2016 15:07
@Janaya425 Good Luck :)
Bill
@wkernan
Apr 17 2016 15:07
@Janaya425 good luck
Islam Ibakaev
@dagman
Apr 17 2016 15:33
@GregatGit @h4r1m4u thx guys :smile:
CamperBot
@camperbot
Apr 17 2016 15:33
dagman sends brownie points to @gregatgit and @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 422 | @gregatgit | http://www.freecodecamp.com/gregatgit
:star: 1781 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
Islam Ibakaev
@dagman
Apr 17 2016 15:34
hey guys why my simon game doesn't work? Click red circle to start. http://codepen.io/dagman/pen/oxdYgW
Arminas
@ArminasBek
Apr 17 2016 15:47
Hello, I’m buildin wikipedia viewer, how can I bypass this error? XMLHttpRequest cannot load https://en.wikipedia.org/w/api.php?action=opensearch&search=Blue&limit=5&namespace=0format=jsonp. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.
?
Chad Kreutzer
@ChadKreutzer
Apr 17 2016 15:52
@ArminasBek I think it might fix itself if you add &callback=? on to the end.
Arminas
@ArminasBek
Apr 17 2016 15:54
@ChadKreutzer boom! Big thank you!
CamperBot
@camperbot
Apr 17 2016 15:54
arminasbek sends brownie points to @chadkreutzer :sparkles: :thumbsup: :sparkles:
:star: 584 | @chadkreutzer | http://www.freecodecamp.com/chadkreutzer
meetall
@meetall
Apr 17 2016 16:23
hello , is there any problem with problem the challenge Chunky Monkey. My code produce the correct outputs but the test case does not pass.

function chunkArrayInGroups(arr, size) {
// Break it up.

var len = arr.length/size;

var result =[];
for(var i=0;i<len;i++){
result[i]=arr.slice(isize,isize+size);
}
if(arr.length%size!==0){
result[len]=arr.slice((len-1)*size);
}
return result;
}

chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6], 3);

function chunkArrayInGroups(arr, size) {
  // Break it up.

  var len = arr.length/size;  

  var result =[];
  for(var i=0;i<len;i++){
    result[i]=arr.slice(i*size,i*size+size);
  }
  if(arr.length%size!==0){
    result[len]=arr.slice((len-1)*size);
  }
  return result;
}

chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6], 3);
Stephen James
@sjames1958gm
Apr 17 2016 16:27
@meetall I ran your code and it seems to fail the last three cases
@meetall Which is weird cause it seems to have the correct output - which is what you said :(
meetall
@meetall
Apr 17 2016 16:35
yeah, i'm wondering whether this is a bug?
codercooooder
@codercooooder
Apr 17 2016 16:36
hey all, I am very close to having this row of svgs Just as I want to. At small media queries it is fine - but when the screen get's large, it no longer does what I want. Essentially I want a max-height of 30% on the footer, but it won't take, even thought I have it marked as !important. Any suggestions? http://codepen.io/ihatecoding/pen/KzRQWO?editors=1100
Stephen James
@sjames1958gm
Apr 17 2016 16:37
@meetall Not sure what assign an array with index 1.5 is doing - this only fails when len / size != integer
meetall
@meetall
Apr 17 2016 16:38
@sjames1958gm yes, you are right. Isn't it Integer/Integer=Integer in javascript?
@sjames1958gm i'm new to java script. In c++ or java c# 5/2=2. I will google see what happens, thanks~
CamperBot
@camperbot
Apr 17 2016 16:39
meetall sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star: 685 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
Mahak Narayan Singh
@makkBit
Apr 17 2016 16:54
http://codepen.io/makkBit/full/eZEYjB/
Local Weather Api project.
I get a 'mixed active content error' as the api url is in http not in https.
Any help is highly appreciated. :)
kirbyedy
@kirbyedy
Apr 17 2016 16:58
http is fine
I dont see any weather showing
just lat and lon in the console
sardarmubashar
@sardarmubashar
Apr 17 2016 17:00
hi every one how to use jQuery .remove class
Stephen James
@sjames1958gm
Apr 17 2016 17:04
@sardarmubashar $().removeClass()
sardarmubashar
@sardarmubashar
Apr 17 2016 17:06
@sjames1958gm how to do this Remove element target4 from the page by using the .remove() function. exp please
@sjames1958gm my code <script>
$(document).ready(function() {
$("#target1").css("color", "red");
$("#target1").prop("disabled", true);
$("target4").remove("");
</script>
Stephen James
@sjames1958gm
Apr 17 2016 17:08
@sardarmubashar No parameters are needed not ("") but ()
@sardarmubashar Saying remove class confused me, .remove is a function
sardarmubashar
@sardarmubashar
Apr 17 2016 17:09
@sjames1958gm ok thanks
CamperBot
@camperbot
Apr 17 2016 17:09
sardarmubashar sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star: 688 | @sjames1958gm | http://www.freecodecamp.com/sjames1958gm
sardarmubashar
@sardarmubashar
Apr 17 2016 17:10
@sjames1958gm i did not that thank you
CamperBot
@camperbot
Apr 17 2016 17:10
sardarmubashar sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:warning: sardarmubashar already gave sjames1958gm points
usharya
@usharya
Apr 17 2016 17:13
How can I make my button like this?
http://i.imgur.com/xdI8Pf2.png
I currently have this
Ryan Fuhrman
@aressef
Apr 17 2016 17:33
Hey guys, I'm not sure why I'm getting an infinite loop error for this:
function factorialize(num) {
  for (i = 1; i <= num; i++) {
    num *= i;
  } 
  return num;
}

factorialize(5);
greg
@wearenotgroot
Apr 17 2016 17:33
@usharya you need to adjust the border radius
Alexandre
@alexandre-mouton-brady
Apr 17 2016 17:33
@aressef I think it's because of "<=". You should always use <
usharya
@usharya
Apr 17 2016 17:35
@wearenotgroot Yeah, radius set too high :/ Fixed it now. Thanks
CamperBot
@camperbot
Apr 17 2016 17:35
usharya sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
Ryan Fuhrman
@aressef
Apr 17 2016 17:35
removing the = and running it still produces the error message.
CamperBot
@camperbot
Apr 17 2016 17:35
:star: 1018 | @wearenotgroot | http://www.freecodecamp.com/wearenotgroot
cmf89
@cmf89
Apr 17 2016 17:39
@aressef it is because you are using num as your condition for exiting the loop
@aressef since you are multiplying num by i, num is always increasing
@aressef so your loop will never exit because i will always be less than num
greg
@wearenotgroot
Apr 17 2016 17:40
@aressef use another variable to store the result
usharya
@usharya
Apr 17 2016 17:40

@wearenotgroot
Do you know how I can have no padding between col elements?
This is how I want it
http://i.imgur.com/3FE1fVU.png
This is how I have it
http://i.imgur.com/pplaSSa.png

My code

<div class="container">
      <div class="row">
        <div class="no-pad">
          <div class="col-xs-12 col-sm-3 col-md-3">
            <img src="images/1.jpg" class="img-responsive">
          </div>
          <div class="col-xs-12 col-sm-3 col-md-3">
            <img src="images/2.jpg" class="img-responsive">
          </div>
          <div class="col-xs-12 col-sm-3 col-md-3">
            <img src="images/3.jpg" class="img-responsive">
          </div>
          <div class="col-xs-12 col-sm-3 col-md-3">
            <img src="images/4.jpg" class="img-responsive">
          </div>
        </div>
      </div>
    </div>

CSS

.no-pad {
    padding: 0px 0px;
}
Ryan Fuhrman
@aressef
Apr 17 2016 17:41
@cmf89 @wearenotgroot that makes perfect sense. thank you!
CamperBot
@camperbot
Apr 17 2016 17:41
aressef sends brownie points to @cmf89 and @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star: 1019 | @wearenotgroot | http://www.freecodecamp.com/wearenotgroot
:star: 320 | @cmf89 | http://www.freecodecamp.com/cmf89
Jeff
@adzam5
Apr 17 2016 17:46
@usharya You have to add custom classes for each col type you are using. For example
.col-xs-12 {
    padding-right: 0;
    padding-left: 0;
}
greg
@wearenotgroot
Apr 17 2016 17:46
@usharya try on the col div
.nopadding {
   padding: 0 !important;
   margin: 0 !important;
}
Jeff
@adzam5
Apr 17 2016 17:47
@usharya What @wearenotgroot is a much easier way
Luis Pedro Juarez Aguilar
@Luispegt
Apr 17 2016 17:49
Hi guys! does any body know where to find placeholder images. but relater to technology and web development?
ML164
@ML164
Apr 17 2016 17:52
@Luispegt i like https://stocksnap.io/
PK
@arcticfries
Apr 17 2016 17:53
how can I change color to the pallet on mine? I am trying but doesn't seem to be working
can someone please look and let me know?
usharya
@usharya
Apr 17 2016 17:53
@arcticfries
Luis Pedro Juarez Aguilar
@Luispegt
Apr 17 2016 17:53
@ML164 Thank you! so helpfull :smile:
CamperBot
@camperbot
Apr 17 2016 17:53
luispegt sends brownie points to @ml164 :sparkles: :thumbsup: :sparkles:
PK
@arcticfries
Apr 17 2016 17:53
I am trying to change the color behind the computer pictures.. not the background.. but the middle one.
CamperBot
@camperbot
Apr 17 2016 17:53
:warning: could not find receiver for ml164
usharya
@usharya
Apr 17 2016 17:53
@adzam5 @wearenotgroot Thank you so much guys. I fixed it all because of you :)
CamperBot
@camperbot
Apr 17 2016 17:53
usharya sends brownie points to @adzam5 and @wearenotgroot :sparkles: :thumbsup: :sparkles:
:warning: usharya already gave wearenotgroot points
:star: 415 | @adzam5 | http://www.freecodecamp.com/adzam5
greg
@wearenotgroot
Apr 17 2016 17:54
@usharya np :+1:
PK
@arcticfries
Apr 17 2016 17:56
I am trying to change color of the jumbotron block
and it doesn't seem to be working:(
James Hall
@James-H33
Apr 17 2016 17:57
PK
@arcticfries
Apr 17 2016 17:57
Yes..
@James-H33 Thx.. what is the best way to change font colors if i go this route?
CamperBot
@camperbot
Apr 17 2016 17:57
arcticfries sends brownie points to @james-h33 :sparkles: :thumbsup: :sparkles:
:star: 27 | @james-h33 | http://www.freecodecamp.com/james-h33
PK
@arcticfries
Apr 17 2016 17:58
let me check your code to see where you put it and i made the mistake on
James Hall
@James-H33
Apr 17 2016 18:00
@pk http://codepen.io/James-H33/pen/LNmdZJ Here: i added changed the font color to yellow
PK
@arcticfries
Apr 17 2016 18:02
@James-H33 strange.. I had done jumbotron background but it wasn't working for some reason.
@James-H33 Thx!
CamperBot
@camperbot
Apr 17 2016 18:02
arcticfries sends brownie points to @james-h33 :sparkles: :thumbsup: :sparkles:
:warning: arcticfries already gave james-h33 points
James Hall
@James-H33
Apr 17 2016 18:04
@pk no problem! Maybe you forgot the period "."?
PK
@arcticfries
Apr 17 2016 18:06
@James-H33 :) Yeah.. looks like very small stuff.. Thx!
CamperBot
@camperbot
Apr 17 2016 18:06
arcticfries sends brownie points to @james-h33 :sparkles: :thumbsup: :sparkles:
:warning: arcticfries already gave james-h33 points
PK
@arcticfries
Apr 17 2016 18:06
couple of issues.. great, thanks!
James Hall
@James-H33
Apr 17 2016 18:07
@PK :)
PK
@arcticfries
Apr 17 2016 18:07
Can you see how it looks now? http://codepen.io/arcticfries/pen/revzaQ
I know it's not the prettiest:)
but am hoping it somewhat is:).. lol
Ghost
@ghost~56ef2a8b85d51f252ab9dec9
Apr 17 2016 18:08
Hello, I'm having a problem on my wikipedia viewer, I have results from the wikipedia API but my results are not really relevant...
Do you know why?
http://codepen.io/thomlom/pen/yOpbPo
James Hall
@James-H33
Apr 17 2016 18:09
@PK it's very nice! Just keep making things!
PK
@arcticfries
Apr 17 2016 18:10
Thanks:) Yes.. I am trying to get into habit of element marking.. I think with practice it gets better
@James-H33 Thx again
CamperBot
@camperbot
Apr 17 2016 18:10
arcticfries sends brownie points to @james-h33 :sparkles: :thumbsup: :sparkles:
:warning: arcticfries already gave james-h33 points
jalley3
@jalley3
Apr 17 2016 18:16
@jsevilla274 thanks
@mutantspore thanks
CamperBot
@camperbot
Apr 17 2016 18:16
jalley3 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1425 | @mutantspore | http://www.freecodecamp.com/mutantspore
Emma Cooper
@199coopere
Apr 17 2016 18:44
hey can i change something's class when the user hovers over it using the css selector hover
Matt Yamamoto
@MattYamamoto
Apr 17 2016 18:46
@199coopere I don't think so, but you can just use the properties you want in the hover selector.
Emma Cooper
@199coopere
Apr 17 2016 18:46
haha yeah sorry i should have clarified that I'm using font awesome
i read that you can make the icons spin and wondered if i could apply that class in the hover selector
oh well :(
PK
@arcticfries
Apr 17 2016 18:48
How do I change description and add tag to my pen on codepen.io?
Emma Cooper
@199coopere
Apr 17 2016 18:48
Go to settings in the top right hand corner
Frank XC
@tenkdayz
Apr 17 2016 18:48
@199coopere you can use mouseenter i think its called
Matt Yamamoto
@MattYamamoto
Apr 17 2016 18:48
@199coopere you can do it with javascript though.
Emma Cooper
@199coopere
Apr 17 2016 18:49
how?
working on the personal portfolio, haven't done javascript yet
Matt Yamamoto
@MattYamamoto
Apr 17 2016 18:50
@199coopere If you're using jQuery this would be pretty straight forward: https://api.jquery.com/hover/
Frank XC
@tenkdayz
Apr 17 2016 18:51
@199coopere or you can use $(elem).hover()
Matt Yamamoto
@MattYamamoto
Apr 17 2016 18:51
@199coopere but as @tenkdayz mentioned you can also use mouseenter and mouseleave
Emma Cooper
@199coopere
Apr 17 2016 18:51
ah i know how to do that. seems pretty easy i think i will do that. mouseenter and mouseleave seem a bit over my head for my current abilites
thanks yall
oh wait let me do the thin
g
PK
@arcticfries
Apr 17 2016 18:52
@199coopere thx
CamperBot
@camperbot
Apr 17 2016 18:52
arcticfries sends brownie points to @199coopere :sparkles: :thumbsup: :sparkles:
:star: 139 | @199coopere | http://www.freecodecamp.com/199coopere
Emma Cooper
@199coopere
Apr 17 2016 18:52
@MattYamamoto @arcticfries thanks
CamperBot
@camperbot
Apr 17 2016 18:52
199coopere sends brownie points to @mattyamamoto and @arcticfries :sparkles: :thumbsup: :sparkles:
:star: 960 | @mattyamamoto | http://www.freecodecamp.com/mattyamamoto
:star: 142 | @arcticfries | http://www.freecodecamp.com/arcticfries
Emma Cooper
@199coopere
Apr 17 2016 18:52
HAHA
that amazing me
*amazes :/
James Hall
@James-H33
Apr 17 2016 18:53
@199coopere http://codepen.io/James-H33/pen/revdvd maybe like this
PK
@arcticfries
Apr 17 2016 18:53
I am getting an error... that says.. Illegal nesting: nesting within plain text is illegal. What does that mean?
I can't seem to fix it.. It's odd.. it just showed up when I tried to add tag and description.. before it did not do it.
any ideas?
It's now failing to load in codepen.io
codercooooder
@codercooooder
Apr 17 2016 18:56
guys can any of you help me to get this footer to respect max-height of 30%? http://codepen.io/ihatecoding/pen/KzRQWO?editors=1100
James Hall
@James-H33
Apr 17 2016 18:56
@PK click on the settings icon in the html box and change your html preprocessor to none.
PK
@arcticfries
Apr 17 2016 18:57
@James-H33 ahh.. thx. I did change that when I was adding the description.. darn it.. lol Thx!
CamperBot
@camperbot
Apr 17 2016 18:57
arcticfries sends brownie points to @james-h33 :sparkles: :thumbsup: :sparkles:
:warning: arcticfries already gave james-h33 points
James Hall
@James-H33
Apr 17 2016 18:57
@PK :)
PK
@arcticfries
Apr 17 2016 18:57
That worked. Thx!
I reckon I should not change things I don't know much about!:)
Does the tribute pen look decent?
or do I need to do lot of work to it still?
Matt Yamamoto
@MattYamamoto
Apr 17 2016 18:58
@arcticfries also, you have unclsoed tags on line 25 and 26
PK
@arcticfries
Apr 17 2016 18:58
ohh.. Thx. @MattYamamoto
CamperBot
@camperbot
Apr 17 2016 18:58
arcticfries sends brownie points to @mattyamamoto :sparkles: :thumbsup: :sparkles:
:star: 961 | @mattyamamoto | http://www.freecodecamp.com/mattyamamoto
ElvisTheStriker
@ElvisTheStriker
Apr 17 2016 18:58
@arcticfries loaded ok for me
PK
@arcticfries
Apr 17 2016 18:59
Thx. I udpated that html tag issue so should work now @ElvisTheStriker
CamperBot
@camperbot
Apr 17 2016 18:59
arcticfries sends brownie points to @elvisthestriker :sparkles: :thumbsup: :sparkles:
:star: 286 | @elvisthestriker | http://www.freecodecamp.com/elvisthestriker
PK
@arcticfries
Apr 17 2016 19:00
@MattYamamoto fixed.. thx!
CamperBot
@camperbot
Apr 17 2016 19:00
arcticfries sends brownie points to @mattyamamoto :sparkles: :thumbsup: :sparkles:
:warning: arcticfries already gave mattyamamoto points
codercooooder
@codercooooder
Apr 17 2016 19:01
@MattYamamoto are you any good with svg and css scaling?
Matt Yamamoto
@MattYamamoto
Apr 17 2016 19:02
@codercooooder I've only messed with svg on a limited basis. what are you trying to do?
codercooooder
@codercooooder
Apr 17 2016 19:02
I'll repost @MattYamamoto
@MattYamamoto I am trying to get this footer to respect max-height of 30%? http://codepen.io/ihatecoding/pen/KzRQWO?editors=1100
Matt Yamamoto
@MattYamamoto
Apr 17 2016 19:04
oh sorry... I should have scrolled up. :worried: Let me take a look
codercooooder
@codercooooder
Apr 17 2016 19:04
@MattYamamoto , no worries
@MattYamamoto I think my weakness is more html, although svg scaling could be messing this up for me too.
Emma Cooper
@199coopere
Apr 17 2016 19:12
@James-H33 yes thank you that works just like I wanted it to...had not heard of transform before this thank you for introducing it to me
CamperBot
@camperbot
Apr 17 2016 19:12
199coopere sends brownie points to @james-h33 :sparkles: :thumbsup: :sparkles:
:star: 28 | @james-h33 | http://www.freecodecamp.com/james-h33
James Hall
@James-H33
Apr 17 2016 19:13
@199coopere no problem! :)
Olivia Legge
@livmaria7891
Apr 17 2016 19:16
Can someone look at this and tell me why my Twitter Button isn’t centered..
It kinda awkwardly centers itself when I expand the window, but it’s still off
Jeremy Roe
@jeremyroe
Apr 17 2016 19:19
Anyone here know flexbox well? Having some trouble with it
Matt Yamamoto
@MattYamamoto
Apr 17 2016 19:19
@livmaria7891 add to the column div holding the tweet button the text-center class
John L.
@jomcode
Apr 17 2016 19:20
anyone done the d3 force directed graph?
Olivia Legge
@livmaria7891
Apr 17 2016 19:21
@MattYamamoto thanks! It didn’t seem to center the button on the page though..
CamperBot
@camperbot
Apr 17 2016 19:21
livmaria7891 sends brownie points to @mattyamamoto :sparkles: :thumbsup: :sparkles:
:star: 962 | @mattyamamoto | http://www.freecodecamp.com/mattyamamoto
Olivia Legge
@livmaria7891
Apr 17 2016 19:21
@MattYamamoto Oh wait.. yes it did!
Thanks for your help
codercooooder
@codercooooder
Apr 17 2016 19:21
@livmaria7891 add text-align:center; to col-md-2
Olivia Legge
@livmaria7891
Apr 17 2016 19:22
@codercooooder Ok I’ll try it, thanks!
CamperBot
@camperbot
Apr 17 2016 19:22
livmaria7891 sends brownie points to @codercooooder :sparkles: :thumbsup: :sparkles:
:star: 11 | @codercooooder | http://www.freecodecamp.com/codercooooder
codercooooder
@codercooooder
Apr 17 2016 19:22
I see @MattYamamoto answered it... @livmaria7891
@MattYamamoto any luck?
Matt Yamamoto
@MattYamamoto
Apr 17 2016 19:23
@codercooooder not yet... fun problem though, so I'll keep working at it unless somebody else is able to help.
codercooooder
@codercooooder
Apr 17 2016 19:24
@MattYamamoto reallly, that's great
kuldeep
@Guru89
Apr 17 2016 19:24
@livmaria7891 avoid horizontal scroll
codercooooder
@codercooooder
Apr 17 2016 19:24
@MattYamamoto thanks
CamperBot
@camperbot
Apr 17 2016 19:24
codercooooder sends brownie points to @mattyamamoto :sparkles: :thumbsup: :sparkles:
:star: 963 | @mattyamamoto | http://www.freecodecamp.com/mattyamamoto
Olivia Legge
@livmaria7891
Apr 17 2016 19:24
@Guru89 What do you mean?
How?
..I guess what I mean is, I didn’t intentionally add horizontal scroll. How do I get rid of it?
Dylan
@dhcodes
Apr 17 2016 19:27
@codercooooder i'm confused. your footer appears to be respecting your max-height. Why do you think it's not?
codercooooder
@codercooooder
Apr 17 2016 19:27
when you make it big, it doesn't go past the30% mark, but the bottom overflows...you have to make it big @dhcodes
Dylan
@dhcodes
Apr 17 2016 19:30
you mean you want it to stick to the bottom @codercooooder ?
codercooooder
@codercooooder
Apr 17 2016 19:30
no
Dylan
@dhcodes
Apr 17 2016 19:30
what do you mean it overflows?
codercooooder
@codercooooder
Apr 17 2016 19:30
well its strange, here is my stackOverflow post..
Dylan
@dhcodes
Apr 17 2016 19:30
i'm limited to a 13" screen so maybe I can't see it
codercooooder
@codercooooder
Apr 17 2016 19:31
then zoom out @dhcodes
Islam Ibakaev
@dagman
Apr 17 2016 19:31

hey guys when i click wrong button it still alerts 'you are right' when should 'you are wrong'http://codepen.io/dagman/pen/oxdYgW?editors=0010

p.s. it's not the final version

kuldeep
@Guru89
Apr 17 2016 19:33
@livmaria7891 google it for more info..
body {
overflow-x: hidden !important;
max-width: 100% !important;
}
Olivia Legge
@livmaria7891
Apr 17 2016 19:33
Oh ok, Makes sense. thanks
thanks @Guru89
CamperBot
@camperbot
Apr 17 2016 19:33
livmaria7891 sends brownie points to @guru89 :sparkles: :thumbsup: :sparkles:
:star: 133 | @guru89 | http://www.freecodecamp.com/guru89
Dylan
@dhcodes
Apr 17 2016 19:34
@codercooooder k. still don't know what you mean
codercooooder
@codercooooder
Apr 17 2016 19:34
@dhcodes, don't worry about it, if you can't reproduce it it mean your screen is too small.
Dylan
@dhcodes
Apr 17 2016 19:35
@codercooooder you mean that white bar at the bottom that is part of the footer?
kuldeep
@Guru89
Apr 17 2016 19:35
@livmaria7891 yw
codercooooder
@codercooooder
Apr 17 2016 19:36
Tulio Natale
@tuliodnw
Apr 17 2016 19:36
hi im new and im doing the tribute page with codepen.io but im having problems with the bootstrap, how do i implement bootstrap with codepen, thanks
Matt Yamamoto
@MattYamamoto
Apr 17 2016 19:36
@dagman your checkUserTurn function always returns true. The return false you have in the forEach is not exiting the checkUserTurn function. Create a var in that funciton to hold the boolean value, and initialize it to true. Inside your forEach set it false inside the if statement. Then have the function return the var's value.
function checkUserTurn(arr1, arr2) {
    var success = true
    arr1.forEach(function(el, i, arr) {
        if (el[0] !== arr2[i][0]) {
            console.log(el[0], arr2[i][0])
            success = false;
        }
    });
    return success;
}
codercooooder
@codercooooder
Apr 17 2016 19:36
@dhcodes, that is the page, you see how the footer is on like 95% of the page, not cool
@dhcodes i appreciate your trying to help but im stressed as it is...i think you need a big screen.
Jared Blumer
@jaredblumer
Apr 17 2016 19:37
Hi everyone, would you mind lending a hand on my quote machine? I can't figure out why my "new quote" button doesn't work.
http://codepen.io/jaredgblumer/pen/wGyoBL
Jet Geronimo
@Humding3r
Apr 17 2016 19:38
@jaredgblumer $("#button").click(getQuote); You forgot to do getQuote as a function. It should be $("#button").click(getQuote());
Matt Yamamoto
@MattYamamoto
Apr 17 2016 19:39
@jaredgblumer it seems to work fine for me.
Islam Ibakaev
@dagman
Apr 17 2016 19:40
@MattYamamoto still alerts you are right
Tulio Natale
@tuliodnw
Apr 17 2016 19:40
https://codepen.io/tuliodnw/pen/qZYoJg i cant seem to get bootrap work with codepen help pls
Jared Blumer
@jaredblumer
Apr 17 2016 19:40
@Humding3r, still doesn't work for me
@MattYamamoto does the new quote button work for you
Matt Yamamoto
@MattYamamoto
Apr 17 2016 19:40
@Humding3r I don't think you want to call the function like that, You would either want to use it as it is, or wrap a call in an anonymous function
 $("#button").click(function(){
    getQuote();
});
@jaredgblumer yes, the button works for me.
Jet Geronimo
@Humding3r
Apr 17 2016 19:41
@MattYamamoto True, true.
Matt Yamamoto
@MattYamamoto
Apr 17 2016 19:42
@dagman I just reloaded the page and I don't see the change. Did you save it?
Jared Blumer
@jaredblumer
Apr 17 2016 19:43
@MattYamamoto @Humding3r I saved the changes, but for some reason it still isn't working for me. I'm going to try it in Firefox and see if it's a Chrome issue.
Islam Ibakaev
@dagman
Apr 17 2016 19:45
@MattYamamoto it works! thx mate :smile:
CamperBot
@camperbot
Apr 17 2016 19:45
dagman sends brownie points to @mattyamamoto :sparkles: :thumbsup: :sparkles:
:star: 964 | @mattyamamoto | http://www.freecodecamp.com/mattyamamoto
Matt Yamamoto
@MattYamamoto
Apr 17 2016 19:47
@jaredgblumer it looks like there cache issue in Chrome. You can try adding the following. I don't know enough about this to say whether this is best practice and/or what negative consequences could result... but for this project I'm sure it's fine.
$.ajaxSetup({
         cache: false
})
Dylan
@dhcodes
Apr 17 2016 19:47
yes, interesting problem @codercooooder i even tried vh to fix it
oh well, good luck, I must clean
Jared Blumer
@jaredblumer
Apr 17 2016 19:48
@MattYamamoto it worked!
thank you, @MattYamamoto
CamperBot
@camperbot
Apr 17 2016 19:49
jaredgblumer sends brownie points to @mattyamamoto :sparkles: :thumbsup: :sparkles:
:star: 965 | @mattyamamoto | http://www.freecodecamp.com/mattyamamoto
MiteyDrill
@MiteyDrill
Apr 17 2016 20:33
Yo, i'm building a Portfolio thing and I have to make navigation buttons that'll go to certain parts of my portfolio, but I have no idea how to do that. Would I make a <a href> that goes to a certain ID or Class?
Frank XC
@tenkdayz
Apr 17 2016 20:39
@MiteyDrill yeah a lot of people are doing it that way.. you just set the href = id of the element you want to go to
MiteyDrill
@MiteyDrill
Apr 17 2016 20:40
okay cool
when I click the link it opens up a random webage :((
Jet Geronimo
@Humding3r
Apr 17 2016 20:42
@MiteyDrill <a href="#certainPartOfPortfolio">
Gabe Pressman
@gpressman
Apr 17 2016 20:45
anyone have any thoughts on why my formatting gets messed up on this?
it happens in the else statement when I try and put users that are online to the top, but I don't know how to fix it
codercooooder
@codercooooder
Apr 17 2016 20:52
any luck @MattYamamoto ?
Matt Yamamoto
@MattYamamoto
Apr 17 2016 20:53
@codercooooder I was just typing a message to you! one sec, let me finish my thought
codercooooder
@codercooooder
Apr 17 2016 20:53
@MattYamamoto cool... no rush. :)
Matt Yamamoto
@MattYamamoto
Apr 17 2016 20:56
@codercooooder no luck at the moment, but I think it might make your life easier if you make the whole green box as an svg (containing the red box, and then the eye). I could get it to work okay with the css boxes, but then the boxes would strech into vertical rectangles sometimes (I was working on an anonymous fork and then forgot to save it! doh! so I can't show you where I got). I think your life would be much easier if you didn't have to worry about that. The other tricky part is the "Link" div (with the blue background) but I would worrk about that after getting the SVG to scale properly.
oh, and I should add that I'm giving up for now... if I have time later I might play around with it some more.
@gpressman your else statment is prepending info, so you need to do it in reverse order. So just switch the two content = statements in your else statement
Gabe Pressman
@gpressman
Apr 17 2016 21:01
ohhhh
that should have been obvious
I console.logged it and there was such a mess of info, but it all looked pretty on point
blamo
thanks @MattYamamoto
CamperBot
@camperbot
Apr 17 2016 21:02
gpressman sends brownie points to @mattyamamoto :sparkles: :thumbsup: :sparkles:
:star: 966 | @mattyamamoto | http://www.freecodecamp.com/mattyamamoto
MiteyDrill
@MiteyDrill
Apr 17 2016 21:03
Everytime I put in the <a href= '#pageid'> instead of taking me to a certain part of the page it opens up a new webpage :((
codercooooder
@codercooooder
Apr 17 2016 21:06
@MattYamamoto Thanks for giving it the old college try if you want keep at it, you can. I'd really like to avoid making the whole thing an svg if possible, but it is a solution - better than none.
CamperBot
@camperbot
Apr 17 2016 21:06
codercooooder sends brownie points to @mattyamamoto :sparkles: :thumbsup: :sparkles:
:star: 967 | @mattyamamoto | http://www.freecodecamp.com/mattyamamoto
Shruti Hardat
@shrutihardat
Apr 17 2016 21:16
Hey, could someone help me with changing the font color in navbar? I've tried changing it in CSS but many Bootstrap has a default that I cannot override?
Also, I'm really new to Bootstrap and I'm working on the Portfolio right now, if that helps.
Gabe Pressman
@gpressman
Apr 17 2016 21:17
link to your pen @shrutihardat
jNaya
@naranbat
Apr 17 2016 21:17
Hello guys, I’ve done twitch api assignment. http://codepen.io/naranbat/full/KzRRQx
Shruti Hardat
@shrutihardat
Apr 17 2016 21:17
I'm trying to work with colour schemes but it's really got me confused at the moment. :/
Coy Sanders
@coymeetsworld
Apr 17 2016 21:20
have you tried overriding the bootstrap style by listing your style with !important @shrutihardat?
Shruti Hardat
@shrutihardat
Apr 17 2016 21:21
@coymeetsworld Hey, yes I tried it already. Didn't work.
Coy Sanders
@coymeetsworld
Apr 17 2016 21:21
hmm really?
Shruti Hardat
@shrutihardat
Apr 17 2016 21:22
Yes.
Coy Sanders
@coymeetsworld
Apr 17 2016 21:22
you did something like this?
.navbar {
  background-color: #00FF00 !important;
}
Gabe Pressman
@gpressman
Apr 17 2016 21:22
@shrutihardat I'm walking out the door, this isn't the best solution, but you can do inline styling to change the color and it works
Shruti Hardat
@shrutihardat
Apr 17 2016 21:22
Yes precisely.
Ah okay let me try that.
Coy Sanders
@coymeetsworld
Apr 17 2016 21:23
hmm works for me when i change it
Shruti Hardat
@shrutihardat
Apr 17 2016 21:23
Okay I'll try that again as well.
Gabe Pressman
@gpressman
Apr 17 2016 21:23
 <a class="navbar-brand topnav" href="https://de.linkedin.com/in/shruti-hardat-b60826110" style="color: red" target="_blank">Shruti Hardat</a>
Coy Sanders
@coymeetsworld
Apr 17 2016 21:23
should need to do an inline style
James Hall
@James-H33
Apr 17 2016 21:24
@shrutihardat http://codepen.io/James-H33/pen/XdqqqL here you go
Coy Sanders
@coymeetsworld
Apr 17 2016 21:24
although that would override the bootstrap too
Shruti Hardat
@shrutihardat
Apr 17 2016 21:26
@James-H33 Thanks! I didn't realise that specific. :) @coymeetsworld @gpressman Thanks for the help!
CamperBot
@camperbot
Apr 17 2016 21:26
shrutihardat sends brownie points to @james-h33 and @coymeetsworld and @gpressman :sparkles: :thumbsup: :sparkles:
:star: 292 | @gpressman | http://www.freecodecamp.com/gpressman
:star: 581 | @coymeetsworld | http://www.freecodecamp.com/coymeetsworld
:star: 29 | @james-h33 | http://www.freecodecamp.com/james-h33
Coy Sanders
@coymeetsworld
Apr 17 2016 21:27
np @shrutihardat, another thing you can do to avoid overriding styles is customize bootstrap too: http://getbootstrap.com/customize/
for projects you work on outside of codepen that is
Shruti Hardat
@shrutihardat
Apr 17 2016 21:27
I have another question about the <hr> tag. When I change the colour, it doesn't show up unless I also add height. But then this "white" part also shows up which looks ugly. Any suggestions?
Thanks Coy!
Coy Sanders
@coymeetsworld
Apr 17 2016 21:27
i would avoid using the hr tag, its deprecated
Shruti Hardat
@shrutihardat
Apr 17 2016 21:28
Ah, I didn't realise. What can I use instead?
Coy Sanders
@coymeetsworld
Apr 17 2016 21:28
what are you trying to do?
Shruti Hardat
@shrutihardat
Apr 17 2016 21:29
Trying to add visual line breaks.. Like in my pen, I've used it to separate the different sections etc.
Coy Sanders
@coymeetsworld
Apr 17 2016 21:29
i would try putting each section into a div, and if you want to have line breaks maybe try giving the top border of each div a size and color
using border-top
Shruti Hardat
@shrutihardat
Apr 17 2016 21:31
Yes, they are in different divs. I was also using <hr> for other visual breaks. I'll try adding a border and get back. :)
James Hall
@James-H33
Apr 17 2016 21:31
@shrutihardat no problem! :)
Coy Sanders
@coymeetsworld
Apr 17 2016 21:31
ok sounds good, good luck
Shruti Hardat
@shrutihardat
Apr 17 2016 21:42
@coymeetsworld I couldn't make the border thing work. I'm still using <hr> for now but I've made it's border 0 so the white part doesn't show up anymore.
Coy Sanders
@coymeetsworld
Apr 17 2016 21:54
one thing I see is you're using multiple divs with container class in them, you should only use one @shrutihardat
and separate each section in rows
also for columns you want the column values to add up to 12 per row
that could be another problem you're having, not related to the border part necessarily
if you clean that part up I think you can use the border-top on the divs and itll work
Islam Ibakaev
@dagman
Apr 17 2016 22:04
i almost build my simon game .Should add audio and strict mode but for default mode it works. check it out guys and comment.http://codepen.io/dagman/pen/oxdYgW
abtak mustapha
@mustapha88
Apr 17 2016 22:16
hello
if some one check my app Tribute Page and tellwhat you think guys?
cmf89
@cmf89
Apr 17 2016 22:24
@mustapha88 the background is kinda dark which makes the text a little hard to read. also you spelled Wikipedia wrong on your link at the bottom of your page.
Juwdohr
@Juwdohr
Apr 17 2016 22:27
anyone know how to make an image disappear when the screen gets smaller (e.g. on a tablet). It'll collapse when a phone looks at it but not if the screen is big enough for a tablet.
Islam Ibakaev
@dagman
Apr 17 2016 22:28
@mustapha88 add this to css
@import url(https://fonts.googleapis.com/css?family=Montserrat:400,700);
body{
  margin-top:60px;
  background-color:grey;
  font-family: 'Montserrat';
}
looks great :smile:
@Juwdohr a u using bootstrap?
Juwdohr
@Juwdohr
Apr 17 2016 22:29
@dagman yes
@dagman it wraps it, show the picture shows below another column. want it to disappear all together.
Islam Ibakaev
@dagman
Apr 17 2016 22:32
@Juwdohr there are classes like xs-hidden or md-visible u can apply to elements to show or hide them on different breakpoints
@Juwdohr *-hidden *-visible
Juwdohr
@Juwdohr
Apr 17 2016 22:38
@dagman would it be col-md-hidden?? because that is not working. Still shows the picture just wont allow me to scroll past that point.
Islam Ibakaev
@dagman
Apr 17 2016 22:41
@Juwdohr come here http://getbootstrap.com/css/
ctr-f then put Available classes
Juwdohr
@Juwdohr
Apr 17 2016 22:49
Yeah those don't take the item away.
Marcus
@mjohnsonengr
Apr 17 2016 22:50
Does anyone have any ideas or reading material about securing API keys on the front end? It seems like the typical solution would be to keep the API keys on a server behind authentication to prevent malicious users from abusing access you have to 3rd party APIs.
For example, I found a tidbit on an article, Securing API Keys in a JavaScript Single Page App by Bill Patrianako, but I was wondering if there are client-side only approaches to at least thwart attempts to hi-jack API keys as much as possible.
tbc13315
@tbc13315
Apr 17 2016 22:53
Hi everyone, I'm working on the weather app and am in the very preliminary stages and I can't seem to extract the JSON data from the API.
Here is my code:
cmf89
@cmf89
Apr 17 2016 22:56
@mjohnsonengr There can't be any client-side only approaches that will be successful, because ultimately if the client is making the API call, then the client needs the API key.
@mjohnsonengr Normally you would have a server-side go-between to handle the API call. So the API key would not be seen by the client, only by your server.
tbc13315
@tbc13315
Apr 17 2016 22:57

<p data-height="289" data-theme-id="0" data-slug-hash="RrXweg" data-default-tab="js,result" data-user="tbc13315" data-embed-version="2" class="codepen">See the Pen <a href="http://codepen.io/tbc13315/pen/RrXweg/">RrXweg</a> by scott cameron (<a href="http://codepen.io/tbc13315">@tbc13315</a>) on <a href="http://codepen.io">CodePen</a>.</p>

<script async src="//assets.codepen.io/assets/embed/ei.js"></script>

Marcus
@mjohnsonengr
Apr 17 2016 22:58
@cmf89 Understood; the server approach I've seen a few times. I suppose that it's true though.. I was hoping to at least force someone to do some work before they could get my API key, but all they'd need to do is hit the network tab in dev tools or open Fiddler and grab it from the requests.
cmf89
@cmf89
Apr 17 2016 22:59
@mjohnsonengr pretty much. you could try to obfuscate it in the source code to make it harder to find from source code inspection but ultimately it will show up in the network tab when the client makes the request
@tbc13315 can you link to your page on codepen? I think it will be easier to see there
tbc13315
@tbc13315
Apr 17 2016 23:00
Hi, I'm sorry I was trying to attach the code in the codepen format but couldn't figure out how to
here is just the link
Marcus
@mjohnsonengr
Apr 17 2016 23:01
@cmf89 Doing the various API calling projects in CodePen (like the weather app) just makes me cringe.. I wonder if I should just set up a quick server myself to handle that.. But then I'd risk people abusing the APIs through my server, unless I forced people to authenticate (maybe just with twitter or github or something).. Not worth it, and ultimately it won't work altogether; people could still abuse it.
Marcus
@mjohnsonengr
Apr 17 2016 23:01
At least with my server, I could put in logic so that if I catch someone abusing an API, I can block them temporarily. Still not worth it.
tbc13315
@tbc13315
Apr 17 2016 23:01
oh there it is. :|
Marcus
@mjohnsonengr
Apr 17 2016 23:01
Okay, well thanks for the conversation @cmf89
CamperBot
@camperbot
Apr 17 2016 23:01
mjohnsonengr sends brownie points to @cmf89 :sparkles: :thumbsup: :sparkles:
:star: 326 | @cmf89 | http://www.freecodecamp.com/cmf89
cmf89
@cmf89
Apr 17 2016 23:02
@mjohnsonengr well, for the weather app you are using a free API key so its not really a big deal. it is also just a test project page, not a major project you are working on. if this was some project where you were using a paid API key then yes you would want to run it through your server
Marcus
@mjohnsonengr
Apr 17 2016 23:03
@cmf89 It's still some thoughts of stuff I'd want to eventually try out.
cmf89
@cmf89
Apr 17 2016 23:05
@tbc13315 in your request you don't have a & at the end of your appid before units, so the weather API is probably seeing the whole string as part of the appid
Bruce Young
@mutantspore
Apr 17 2016 23:05
@tbc13315 you’ve missed out an ‘&’ just before ‘units'
tbc13315
@tbc13315
Apr 17 2016 23:05
AAAAAHHHHHH thank you sooooo much!
Juwdohr
@Juwdohr
Apr 17 2016 23:11

This is what I have and it seems not to be working.

<div class='about'>
  <div class='aboutBckgrnd'>
    <div class='container'>
      <div class='row'>
        <div class='col-lg-12'>
          <h3 class='aboutHead'>Ashley's ePortfolio</h3>

          <div class='col-lg-6 col-md-12'>
            <p class='body'>Thank you for visiting my eportfolio! My name is Ashley and I am a freshmen at Salt Lake Community College. My first semester in school has been a really good experience and I love having the opportunity to learn and broaden my horizons. My ultimate goal is to use my education to have a positive impact on the world.<br><br>To catalogue my college experiences and be able to chart my personal growth, I have made different pages relating to the courses I have taken.  Please, feel free to take a look around.</p>
            <p class='body'>Thank you,</p>
            <p class='signature'>Ashley Marie</p>
          </div><!--/.col-lg-4 col-md-6 col-sm-12-->

          <div class='col-lg-6 visible-lg-* collapse navbar-collapse'>
            <img class='profileImg responsiveImg' src='https://lh4.googleusercontent.com/-53AqwCReyVQ/VxQAlUwGKdI/AAAAAAAAFM8/1EzaqIVqJ84tK-RnKEOQa0bsg0JbcNoNACL0B/s449-no/2016-04-17.jpg'>
          </div><!--col-lg-4 col-md-6-->

        </div><!--/.col-lg-12-->
      </div><!--/.row-->
    </div><!--/.container-->
  </div><!--/.aboutBckgrnd-->
</div><!--/.aboutSect-->

Any help would be appreciated. Trying to get image to disappear on tablets and other devices, as it wants to wrap around and shows at the bottom of the other column.

CamperBot
@camperbot
Apr 17 2016 23:11
juwdohr sends brownie points to @dagman :sparkles: :thumbsup: :sparkles:
:star: 420 | @dagman | http://www.freecodecamp.com/dagman
abtak mustapha
@mustapha88
Apr 17 2016 23:31
@dagman thank you for feedback and for your help @cmf89 thank's i will do my best
CamperBot
@camperbot
Apr 17 2016 23:31
mustapha88 sends brownie points to @dagman and @cmf89 :sparkles: :thumbsup: :sparkles:
:star: 421 | @dagman | http://www.freecodecamp.com/dagman
:star: 328 | @cmf89 | http://www.freecodecamp.com/cmf89
Coy Sanders
@coymeetsworld
Apr 17 2016 23:34
column divs shouldn't be nested in other column divs @Juwdohr
Juwdohr
@Juwdohr
Apr 17 2016 23:34
@coymeetsworld Not sure what you mean?
http://codepen.io/Rainelishes/pen/bpMrKM?editors=1100
this is what I have and it wraps the img so the bottom of the page extends wondering how to hide the image so only the text displays.
Coy Sanders
@coymeetsworld
Apr 17 2016 23:34
not sure if thats whats causing the problem or not but something to think about
you have nested divs with the col class
<div class='col-lg-12'>
   <div class='col-lg-6 col-md-12'></div>
   <div class='col-lg-6 visible-lg-* collapse navbar-collapse'></div>
</div>
Don't think that looks right