@morganmay Are you getting an error?
@morganmay let’s see what you have in codepen
@mutantspore @mutantspore actually I am getting errors on codepen right now too
All I've got is what the tiutorial recommended so far. I took out the manually-added Bootstrap CDN code. http://codepen.io/morganmay/pen/bEJENN
@morganmay if you put in BS first ..then animate. it should be ok. what are the errors.. the ones in console? you can see that bootstrap works by the styling of the H1 and the button
@kmulligan @mutantspore I got this error in Firefox:
16:03:52.695 Content Security Policy: The page's settings blocked the loading of a resource at self ("script-src http://codepen.io 'unsafe-eval' http://preprocessor.codepen.io http://*.pubnub.com https://*.pubnub.com http://platform.twitter.com http://connect.facebook.net http://www.google-analytics.com https://*.google-analytics.com https://*.google.com http://wufoo.com https://wufoo.com http://*.wufoo.com https://*.wufoo.com https://*.stripe.com https://*.instapaper.com http://*.instapaper.com http://dc8na2hxrj29i.cloudfront.net http://s3.buysellads.com http://srv.buysellads.com/ https://www.fullstory.com https://stats.buysellads.com http://stats.buysellads.com https://*.braintreegateway.com https://www.paypalobjects.com http://assets.codepen.io http://assets.codepen.io/ https://assets.codepen.io https://assets.codepen.io/ http://assets.cdpn.io").1 bEJENN
And this similar one in Chrome:
Refused to load the script 'data:application/javascript;base64,KGZ1bmN0aW9uKCkgewogICAgLy8gaHR0cHM6Ly9k…ogICAgZ2EucmVtb3ZlID0gbm9vcGZuOwogICAgd2luZG93W2dhTmFtZV0gPSBnYTsKfSkoKTs=' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval' http://preprocessor.codepen.io http://*.pubnub.com https://*.pubnub.com http://platform.twitter.com http://connect.facebook.net http://www.google-analytics.com https://*.google-analytics.com https://*.google.com http://wufoo.com https://wufoo.com http://*.wufoo.com https://*.wufoo.com https://*.stripe.com https://*.instapaper.com http://*.instapaper.com http://dc8na2hxrj29i.cloudfront.net http://s3.buysellads.com http://srv.buysellads.com/ https://www.fullstory.com https://stats.buysellads.com http://stats.buysellads.com https://*.braintreegateway.com https://www.paypalobjects.com http://assets.codepen.io http://assets.codepen.io/ https://assets.codepen.io https://assets.codepen.io/ http://assets.cdpn.io".
? well this is a fork of yours with BS added. @morganmay I’m using Safari/Mac
@morganmay looks like a list of sites you have blocked by an ad block program?
@mutantspore While testing it in Chrome I accidentally reverted to the version that had the manually-added CDN import.
@morganmay so my fork of yours (above) doesn’t work for you? Ithink youhav esome sort of ad block plugin
@mutantspore Adblock was my first thought, but Bootstrap doesn't load even when I disable it or load it in Internet Explorer (which has no ad blocker installed).
Your fork works, though.
How did you add Bootstrap? Just through the options panel?
wel all i did was put BS in the CSS before animate and save it
yes
I didn’t do anything else at all
Okay, I'm blind. Somehow I managed to remove Bootstrap from the CSS without noticing. Sigh. Thanks for your help!
@morganmay ty for looking again and not just saying it doesn’t work!
Well thank you for being so patient...
Im trying to add a color to a <h1> using bootstrap... Is it possible? Or I just use css? Because its a challenge to create a tribute page and it is supose to be using only html in codepen... Anyone?
@kauepacheco bootstrap is CSSand yes it has it’s own color set. you can override it in CSS if you want to
So I can't change color using a Bootstrap code inline? @mutantspore
Alright got it thanks man
Hello guys
Hello
Can i please get help on one of my api .getJSON calls ? I don't know why i don't get anything from that
http://codepen.io/UnlimiWorks/pen/WrWrLj
http://codepen.io/UnlimiWorks/pen/WrWrLj
@UnlimiWorks You must add jquery on the javascript part.
I don't see it in there.
Ow. Totally forgot that
Still not fixed though
I am searching....
I have the same problem
I am crazy..... Angry with that.
@mutantspore thanks! don't know how that got chopped. appreciate it!
owentemp sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1137 | @mutantspore | http://www.freecodecamp.com/mutantspore
@Theviajerock Are you using the same API ?
No
I am using the wikipedia API
But that Cross-Site thing confused me a lot...
Sometimes works with $.getJSON
And sometimes work with $.ajax
works*
@UnlimiWorks Replace the url with this one =
yep, tried that
It works for me.
@UnlimiWorks where are the docs for the api?
@UnlimiWorks I change the url like that, click at the button and it works correctly.
I transitioned to using "http://quotesondesign.com/wp-json/posts" which uses a new version of the API. And also get only 1 JSON quote instead of everything.
@mutantspore The 'docs' are stated here : http://quotesondesign.com/the-api/
@mutantspore The 'docs' are stated here : http://quotesondesign.com/the-api/
I think i need o specify some parameters to randomize
here's the link for the 4.0: http://quotesondesign.com/api-v4-0/
The problem with this specific API is that i'm not getting all the quotes even if i'm not filtering them
Mmmm but that is something with the API
Yep, I hink it might be
Yeah, is not problem with getJSON
@mutantspore Sorry, I didn't save my pen before you forked it
I guess i'll try my luck using anoher API
could someone look at my jQuery in priate convo? don't want to spam the whole chat
@Fuzyon fixed that bug you found
@Fuzyon thanks again for finding it man
wyattwade sends brownie points to @fuzyon :sparkles: :thumbsup: :sparkles:
:star: 179 | @fuzyon | http://www.freecodecamp.com/fuzyon
@Fuzyon I'll post the new version in a sec
So ive gotten to the portfolio and i haven't learned any of this stuff yet?
Yeah I know I found the same thing
@KevinStaufy but if you go to the bootstrap website will find all the info you need'
what do you mean?
@KevinStaufy http://getbootstrap.com/
do i just go to the getting started or what?
@KevinStaufy Do you understand what your assignment is?
@KevinStaufy I am working on the same project at the moment
Hi All -- I'd like some help with my Random Quote Machine pen http://codepen.io/kwhms/pen/GoPMaz. I can't figure out how to insert my custom twitter URL created in javascript into the href attribute of my a tag.
@DivaWeb no clue
@DivaWeb i made a tribute but its not very good http://codepen.io/KevinStaufy/pen/GoexQP
@KevinStaufy did you see the web site example?
@DivaWeb yea but that is like super advanced like i dont think i learned any of it
@KevinStaufy I realize that the bootstrap section that they have is very limited
@DivaWeb saddly yea :(
@KevinStaufy So let me see if I can help you get started
@DivaWeb alright cool :)
@KevinStaufy the type of website that it is called is a bootstrap scrollspy.
@kwhms I can't help you with that - would love to know what you figure out - but love your design
@DivaWeb hmm interesting
@KevinStaufy do you have your code pen account set up?
@kmulligan thanks!
kwhms sends brownie points to @kmulligan :sparkles: :thumbsup: :sparkles:
:star: 281 | @kmulligan | http://www.freecodecamp.com/kmulligan
@DivaWeb yes
i sent you a private chat
@KevinStaufy ok
Hey guys
Would anyone mind playing Tic Tac Toe to see if you can win
if you can there's a bug in my app
here it is:
Also, any other criticism is much appreciated
@mutantspore once I get rid of the bugs I will do something with the alerts
@mutantspore let me know if there's anything that doesn't look good.
@KevinStaufy I am not see it
@mutantspore or if the code looks ugly in spots
Is there any reason why my winning conditions are not working? https://www.repl.it/Bn0v
@DivaWeb its fine
@KevinStaufy do you have the bootstrap page up?
@DivaWeb im on the homepage of http://getbootstrap.com/
@kmulligan I think I got it -- $("#customTweet").attr("href", myQuoteURL);
@KevinStaufy click on getting started
@KevinStaufy did you learn about libraries?
alright i did
no i havent
@DivaWeb libraries are basically the dictionary for the language you want to use
ahh i see
@KevinStaufy so you see the cdn to copy and paste?
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
that one?
@KevinStaufy yes
@DivaWeb that is the library for bootstrap and it needs to be put into your head section of the code.
I guess what I really want to ask is it possible to test for win conditions using a one dimensional array on a two dimensional grid?
so it Always needs to go there?
@KevinStaufy there are several libraries out there and you can find the others you may need at google libraries and yes to your question
ahhh i see
anyone know if codepen has dropdown.js
@KevinStaufy if you want some more detailed info on using bootstrap here is a detailed video https://youtu.be/3cYWiU_HsgM
alright cool ill check it out
@DivaWeb do i past all of this <!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
at the top?
@KevinStaufy yes
alrighty ill get to work on it then thank you
@KevinStaufy in the <head> section of your code
@KevinStaufy I hope that gets you off on the right foot.
Hey guys
Almost done with this project
any criticism is much appreciated
and if you can beat it
that's a huge bug
also if my code just looks ugly
let me know!
@DivaWeb wait
@KevinStaufy yes
@wyattwade I didn't win I got a tie
do i put the big set of bootstrap above or in <head>
@KevinStaufy You will put it inside the <head> tag
so
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<h1 class="text-center"> Kevin Stauferland's Portfolio </h1>
thats wrong right
@KevinStaufy do you know what a deault html5 should look like?
@DivaWeb Yeah I'm trying to make it unbeatable. Someone earlier found a huge bug tho
just fixed it like 15 mins ago
@DivaWeb any suggestions on the UX?
I might make it so you can pick what color you play as
@wyattwade that would be cool because the blue is so light I didn't realize at first I was blue
@DivaWeb to an extent yea
yeah thanks for checking it out @DivaWeb
wyattwade sends brownie points to @divaweb :sparkles: :thumbsup: :sparkles:
:star: 216 | @divaweb | http://www.freecodecamp.com/divaweb
if you have any other suggestions let me know
I'll be using this for a job application tomorrow
just an apprenticeship level job
@KevinStaufy well your code should have a <head> tag and a <body> tag
@wyattwade I think most of us are
@KevinStaufy create a <head> </head> should before your body tag and put the libraries inside that
it didnt teach me <head> it taught me <h1>
@KevinStaufy give me a sec and I will so you what the basic html5 format should be.
at that point i might just go run through code academys html and css course
so i know more about it
hey guys. working on my weather app. right now im trying to make a function that will show the weather icon on my page and trying to make it so it takes my api data and adds that icon number to the url to show you an icon. i have this so far but its just showing a broken image.
function weatherIcon() {
var icon = $(updateWeather.weather[0].icon);
$("#icon").append("<img src='http://openweathermap.org/img/w/" + icon + ".png'>");
}
@andrewchar show us your pen and also you won’t need that $() around teh json object
@mutantspore oh.. i took out the $() and it works now lol
@mutantspore thanks a million!
andrewchar sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1138 | @mutantspore | http://www.freecodecamp.com/mutantspore
@KevinStaufy <!Doctype html>
<html>
<head>
//add libraries here//
<title>name of page<title>
</head>
<body>
//add what you want on your web page here.
</body>
</html>
@DivaWeb is <title> the same as <h1>?
Anyone willing to help me out with my navigation bar using bootstrap (I want to put a part on the right side and a part on the left) http://codepen.io/RobMo/pen/qbvoNj
@KevinStaufy no <title> is the name of the page. so when you look at the tab in your browser you see the name of the page and that is what that does.
OOOOOOOOOOOOOOOOOOO
@DivaWeb i see now tahnks
thanks
@KevinStaufy <h1> is the size of a header before your paragraph or list etc..... You have <h1>, <h2>,<h3>,<h4>,<h5>,<h6> and the bigger the size the smaller it gets
@DivaWeb ahhh sorry i got confused there haha thanks
kevinstaufy sends brownie points to @divaweb :sparkles: :thumbsup: :sparkles:
:star: 217 | @divaweb | http://www.freecodecamp.com/divaweb
@KevinStaufy hey no problem
I've finished the basic JS algorithms. Now I am up to the Random Quote Generator. I've looked at the sample project, but I'm not sure I have the skill set to accomplish this one yet. Which lessons/challenges should I review to be prepared for these intermediate front end projects?
@carpediem1213 I have found going to Youtube and watching videos sometimes explains things in a way that makes things look simple
does anyone know where i could find info about making a slide button, or does bootstrap offer something to make one?
@RobMo check out this section on bootstrap Component alignment
Align nav links, forms, buttons, or text, using the .navbar-left or .navbar-right utility classes. Both classes will add a CSS float in the specified direction. For example, to align nav links, put them in a separate <ul> with the respective utility class applied.
These classes are mixin-ed versions of .pull-left and .pull-right, but they're scoped to media queries for easier handling of navbar components across device sizes.
Right aligning multiple components
Navbars currently have a limitation with multiple .navbar-right classes. To properly space content, we use negative margin on the last .navbar-right element. When there are multiple elements using that class, these margins don't work as intended.
We'll revisit this when we can rewrite that component in v4.
@DivaWeb I have already tried that for two hours now, I seem unable to find a solution myself. I tried the official documentation and the w3c.
@DivaWeb Which topics would you recommend to be prepared for the intermediate challenges?
@carpediem1213 I would start by looking at the functions and etc that are listed in the projects
Working on Random Quote Machine, stuck trying to get the giant quotes into the javascript like the example. I was able to do it easily when it wasn't with the text. I just want the ion-quote to be in there but I'm not sure how to do it.
<h2 id="quote"><i class="ion-quote quotes-icon"></i>Every collection of quotes has to start somewhere!</h2></div>$("#quote").text(quotes[rand2]);That's the html and the javascript, I tried using + inside the text function but no dice
@RobMo I understand what you saying now and I am actually working on the same project. Did you try adding the left to the specific item or did you try giving it an id and float it in css?
@zackluckyf if you have a codepen, paste that
@qualitymanifest I don't I'm working in brackets
@zackluckyf well, without seeing/testing the big picture my guess is either you haven't loaded jquery in, or there's
quotes[rand2] isn't accessing what you want it to
@DivaWeb Hmm I might be able to do a manual fix with css. But that won't teach me how to do it with bootstrap.
Does this work for everyone? http://codepen.io/jayuhasz/full/KVERxy/
@jayuhasz if location and conditions wind and temp are buttons they are not working
@DivaWeb they are not buttons, just display panels
@jayuhasz can i ask why you use switch statements
@jayuhasz i am using just the icon ID that i get from the api info to give me their little icon for weather, the way you do it make different icons come up or something?
@andrewchar I didn't like their icons, so I'm using other icons and need the switch statement, it also leaves room for more granularity if I got bored later.
@jayuhasz where do you get your icons from?
@andrewchar it's in the pen's css settings, I believe
@andrewchar http://erikflowers.github.io/weather-icons/
@jayuhasz awesome thank you!
andrewchar sends brownie points to @jayuhasz :sparkles: :thumbsup: :sparkles:
:star: 296 | @jayuhasz | http://www.freecodecamp.com/jayuhasz
Hi guys. I have a question concerning a test pen i've been meddling with:
1st : Why is my second console.log() executed before my first ?
2nd : Why does my 'quotes' variable lose its value outside of $.getJSON ?
http://codepen.io/UnlimiWorks/pen/WrWrLj?editors=0010
I'm really confused about this, i'll be grateful for any help i can get
1st : Why is my second console.log() executed before my first ?
2nd : Why does my 'quotes' variable lose its value outside of $.getJSON ?
http://codepen.io/UnlimiWorks/pen/WrWrLj?editors=0010
I'm really confused about this, i'll be grateful for any help i can get
Finally fixed it up a bit. At least that one chunk of code. Couldn't have done it without you thanks again man @h4r1m4u . Have a good night
@wyattwade excellent, glad to hear that; nice work! you're most welcome
sorry h4r1m4u, you can't send brownie points to yourself! :sparkles: :sparkles:
:star: 254 | @wyattwade | http://www.freecodecamp.com/wyattwade
my geolocation is telling me that im like 200 km away from where i actually am lol
@andrewchar geolocation? or ip based system?
the location that my weather app is telling me
@andrewchar yes… but how are you working out the lat and lon.. I can’t remember how you were doing it
pen?
@andrewchar ok for me it’s accurate. How are you connected to the internet?
i know some code is out of whack im putting random stuff in to figure out how to convert my link to show C and F
satalite internet
@andrewchar that'll do it.
ok well maybe that’s were it thinks you… are
yeah, 200km is actually shorting it. for me to drive to where its telling me i am, it would take me 5-6 hours lol
i’s it 2 way satellite or sat down and phone up? (or am i showing my age?)
2 way satellite
lol maybe it thinks you are in space :) i don’t know the specifics of what it’s identifying and why but I’m sure that’s the reason
lol
i first noticed when it said it was raining here
i was like hmmm we got a foot of snow today thats not right
@andrewchar it's giving you the geolocation of your ISP's facility that's connected to their trunk line
it also explains what methods it uses to find you
@mutantspore yep still showing coatcook
oh well
@andrewchar it will be fine for most people
Why are my wells.. so close to each other? http://codepen.io/Zera99/pen/JGxQXy?editors=1100
yeah. i'm just the unlucky one who is stuck with satellite internet lol
what do you mean wells?
Bootstrap wells ^^
@h4r1m4u But can't we set
format=jsonp instead of adding the callback parameter?
@coderNoob you could - if the server is configured to know what to do with it. i might be wrong but i think wikipedia doesn't support
format=jsonp parameter. the point i was making is that "So what the call back function does is, it prevents the statement from executing until all the data is fetched from the API call." is not quite a correct explanation of the callback parameter
would anyone be able to take a look at my javascript code for a widget i'm building? i can't get the events to cooperate
@batilc1 thanks again for your help earlier if you're still on, the hint to use ajax for the wiki search page was a lifesaver
davidsonsteve sends brownie points to @batilc1 :sparkles: :thumbsup: :sparkles:
:star: 209 | @batilc1 | http://www.freecodecamp.com/batilc1
@jovjohnson it's usually better to post the question right away. then people in the room can check out what the problem is and see if they're able to help. on that note, what's the issue?
hello guys, am working on the pomodoro and this is how am thinking of tackling the project
1.have two global variable, break time and session time in secs
create functions that increases and decreases length of session and break and updates the new time when clicked
functions that starts session time and break time count by getting the time updated by the functions above and start a countdown on it
use a function to toggle between the 2 modes using a boolean to indicate when session is running and if done start break session
5.a function to pause the event using clearInterval.
That's what I can think of , thanks for your time
@Lumexralph sounds pretty good to me. here's a tip: you don't need two variables for the break and session time. have only one - let's call it mainTime. then whenever the timer reaches zero and you need to change the clock mode, get the value of the break or session from the DOM and assign it to your mainTime. that way you only need one function to start the countdown interval (or clear it). other than that, i think you're on the right track
@Lumexralph you only need one countdown function.. just feed it different variables
thanks @mutantspore @h4r1m4u .....will work on it
lumexralph sends brownie points to @mutantspore and @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1420 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
:star: 1142 | @mutantspore | http://www.freecodecamp.com/mutantspore
@Lumexralph I had pause as another var that the interval function checks, if its paused it skips decrementing the current time, until it is unpaused. stop with clearIntrerval, also I wouldn't get any values from the dom, only interaction should be outputting to the dom.
@jnmorse ..you mean the click events?
@Lumexralph in the first part of what I said, I meant when you click on paused I set a var paused to true, if you clear the interval and then start again its likely going to end up starting from the beginning, less you somehow save the state which I suppose could work.
@jnmorse if you use only one variable to track the time and update it only when the timer reaches 0 (to start a new full work or break session), then your current time on the clock will be preserved when you clear the interval for pausing. clearing the interval seems cleaner rather than having the interval constantly running in the background even if the clock is paused
@h4r1m4u the way I had it set up, the variable ended up back to its default state if I did clearinterval shrugs
@h4r1m4u http://codepen.io/jov/pen/mVoGXy
the spinners in my number fields aren't executing my jquery event
the spinners in my number fields aren't executing my jquery event
@jovjohnson and what's the result that you want? what exactly should be happening?
and they're doing wonky things when the assorted veggies div field is clicked
the green text that displays the total price should be corresponding with the quantity and price per item
ok, gotcha. let me have a look at it
@jovjohnson what is this? .. another new challenge?
Hi guys, I’ve been coding the Pomodoro timer before this project recently categorized to an advanced front-end project. So it is being coded without any framework but plain JS, and now I am stucked at the
timeCount() just won’t reach to 0 before ended and switched into breakInterval. Would really appreciate any help from anyone who’ve cleared this task. :smile: var break_length;
var session_length;
var minutes;
var interval;
var breakInterval;
var seconds = 0;
function increaseBreak(break_length) {
break_length++;
$('#break').html(break_length);
return break_length;
}
function decreaseBreak(break_length) {
break_length--;
if (break_length < 1) {
break_length = 1;
}
$('#break').html(break_length);
return break_length;
}
function increaseSession(session_length) {
session_length++;
$('#session').html(session_length);
$('#total').html(session_length);
return session_length;
}
function decreaseSession(session_length) {
session_length--;
if (session_length < 1) {
session_length = 1;
}
$('#session').html(session_length);
$('#total').html(session_length);
return session_length;
}
function countdownCtrl() {
if (seconds === 0) {
minutes--;
seconds = 59;
} else {
seconds--;
}
// Executing timeCount();
(function timeCount() {
if (minutes === 0 && seconds === 0) {
clearInterval(interval);
if (break_length) {
breakInterval = setInterval(breakcountCtrl, 1000);
}
} else {
$('#total').html(minutes + ":" + (seconds < 10 ? "0" : "") + String(seconds));
}
})();
function breakcountCtrl() {
$('#total').html(break_length--);
}
}
$(document).ready(function() {
break_length = parseInt($('#break').text());
session_length = parseInt($('#session').text());
minutes = session_length;
$('#ibl').click(function() {
break_length = increaseBreak(break_length);
});
$('#dbl').click(function() {
break_length = decreaseBreak(break_length);
});
$('#ise').click(function() {
session_length = increaseSession(session_length);
minutes = session_length;
});
$('#dse').click(function() {
session_length = decreaseSession(session_length);
minutes = session_length;
});
$('#total').click(function() {
if (interval) {
clearInterval(interval);
interval = undefined;
} else {
interval = setInterval(countdownCtrl, 50);
}
});
});
@jovjohnson You need to write a new function that deals with the counter value being changed, and make sure you're rendering the updated value on each click event. Hope that hint helps :smile:
edit: throw some console.log's in there to see if the value is actually being updated ;)
edit: throw some console.log's in there to see if the value is actually being updated ;)
Guys lemme know if you can beat this game. Would be a great help :smile:
Tic-Tac-Toe
Tic-Tac-Toe
@hman1911 hmm. thanks. not sure where to start with a new function though. i'll play around with it some more.
jovjohnson sends brownie points to @hman1911 :sparkles: :thumbsup: :sparkles:
:star: 85 | @hman1911 | http://www.freecodecamp.com/hman1911
My reset button is not working. But works fine in DevTools mode. Why?
http://codepen.io/coderNoob/pen/vLmyWN
http://codepen.io/coderNoob/pen/vLmyWN
@jovjohnson This so question should help http://stackoverflow.com/questions/16562389/get-spinner-ui-value-on-change
$(document).ready(function() {
function spinnerChange(event) {
//this function gets called when the spinner value chages.
//your code here :)
}
$('input[name=quantity]').on("click",function() {
var button = $(this).closest(".quant");
var price = button.data("price");
price = parseFloat(price);
var num = $("input[type=number]").val();
var total = (num * price).toFixed(2);
var totalPrint = $('<p class="total">($' + total + ' TOTAL)</p>');
if(num >= 2){
$('.price').find('.total').html(totalPrint);
}
});
@jovjohnson here you go:
$(document).ready(function() {
$('input[name=quantity]').on("click",function() {
var price = $(this).data("price");
price = parseFloat(price);
var num = $(this).val();
var total = (num * price).toFixed(2);
if(num >= 2){
$(this).closest('.row').find('.total').text("($" + total + " TOTAL)");
}
});
});
Help with the reset button anyone?
http://codepen.io/coderNoob/pen/vLmyWN?editors=1010
http://codepen.io/coderNoob/pen/vLmyWN?editors=1010
no wiki entry for:
with the reset button anyone httpcodepeniocodernoobpenvlmywneditors1010
Hi, I had a doubt regarding centering of the buttons for my front end project(Portfolio Page). I have used the container class made available by bootstrap css. Yet the buttons appear to be left-aligned. Here is the code.http://codepen.io/adhok/pen/PZVVPJ
@HMAN1911 thanks for the link
jovjohnson sends brownie points to @hman1911 :sparkles: :thumbsup: :sparkles:
:warning: jovjohnson already gave hman1911 points
@h4r1m4u works like a gem. would you mind briefly explaining my error?
@adhok add text-center class on the row div that holds the buttons
<div class="row text-center">
<a href="www.twitter.com" target="_blank" class="btn btn-default btn-lg "><i class="fa fa-twitter fa-fw"></i>Twitter</a>
<a href="www.twitter.com" target="_blank" class="btn btn-default btn-lg "><i class="fa fa-linkedin fa-fw"></i>LinkedIn</a>
<a href="www.twitter.com" target="_blank" class="btn btn-default btn-lg"><i class="fa fa-github fa-fw"></i>GitHub</a>
<a href="www.freecodecamp.com" target="_blank" class="btn btn-default btn-lg"><i class="fa fa-fire fa-fw"></i>FreeCodeCamp</a>
</div>
@jovjohnson i don't have your original code anymore :D do you still have it somewhere?
@h4r1m4u Thank You!
adhok sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1421 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
This message was deleted
$(document).ready(function() {
$('input[name^=quantity]').on("click",function() {
var button = $(this).closest(".quant");
var price = button.data("price");
price = parseFloat(price);
var num = $("input[type=number]").val();
var total = (num * price).toFixed(2);
var totalPrint = $('<p id="total">($' + total + ' TOTAL)</p>');
if(num >= 2){
$('.price').find('.total').html(totalPrint);
}
});
haha
$(document).ready(function() {
$('input[name^=quantity]').on("click",function() {
var button = $(this).closest(".quant"); // not needed; you're already clicking on the input which contains the price in the data-price attribute, hence you can simply use "this"
var price = button.data("price");
price = parseFloat(price);
var num = $("input[type=number]").val(); // similar to the above. it's the same input element, "this" suffices
var total = (num * price).toFixed(2);
// here you're using the jQuery selector $(), but the selector doesn't make much sense. selector should generally be a the element, class, id or combination of thereof
// i'm assuming that what you meant to do here is to construct the string for the total price. if that's the case, you'd do it without the $() selector
var totalPrint = $('<p id="total">($' + total + ' TOTAL)</p>');
if(num >= 2){
// the problem with the $('.price') selector is that it's the same in all the 3 boxes (each box has a .price paragraph). so even if you're changing
// the qty in the 3rd box, it'll rewrite the total price in the first box. we need to somehow tie it to changing the price only in the box where we're
// changing the qty - which is where "this" comes into play again
$('.price').find('.total').html(totalPrint);
}
});
Hey Guys, Does anybody know why the drop down in my navbar using bootstrap isn't working? Any help is appreciated.
http://codepen.io/kaizen7/pen/WrWGgp
http://codepen.io/kaizen7/pen/WrWGgp
@kaizen711 you forgot to import the bootstrap.js file
add this in the JS resources of the codepen: https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js
@jovjohnson sorry, forgot to tag you. my comments as to why your code was not working are 3 messages above
@h4r1m4u wow I didn't even know that existed, thank you very much, I'd been trying to see what was wrong for a while
kaizen711 sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1422 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
@kaizen711 np. yeah, basically all the functionality that's described on this page: http://getbootstrap.com/javascript/ requires the bootstrap.js library imported
@h4r1m4u awesome thanks again
kaizen711 sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:warning: kaizen711 already gave h4r1m4u points
Encode the following sequence, separated by spaces:
backslash tab tab carriage-return new-line and assign it to myStr
backslash tab tab carriage-return new-line and assign it to myStr
solution plz
stuck here
is there a table on the left with explanation codes ?
I am stucked at the
http://codepen.io/vizFlux/pen/WrmmVQ
timeCount() just won’t reach to 0 before clearInterval() and switched into breakInterval. Would really appreciate any help from anyone who’ve cleared this task. :smile:http://codepen.io/vizFlux/pen/WrmmVQ
hey guys
can i please get some help with my tic tac toe game?
the filter only works on the first press
then it stop working for some reason
hey guys
@davidsonsteve ima glad it worked, youre welcome!
which filter @pringon ?
the remaining = remaining.filter
what line?
i'll check it now
ahh i see it
Does somebody know why I am getting my string inversed in the calculator text-box? If I set this outside the text box, in a div for instance it shows it the correct way.
http://codepen.io/DiazPedroAbel/pen/pgRXWv?editors=1010
http://codepen.io/DiazPedroAbel/pen/pgRXWv?editors=1010
Someone (I cannot remember who and I cannot see previous mentions :S) told me that I have to treat op similar way as current, but I don't see how to do it, in fact, I thought I was treating both similar way by adding them to the string. eval() works perfect so...
@Abel1987 it's because of
direction: rtl;on .calculator input[type='text'] in your CSS. 'rtl' stand for right to left. instead, use text-align: right;
@h4r1m4u thats it... I copy that calculator to just get into programming it, and I guess it has this kind of inconvenients. I was looking at the html and on the javascript trying to fixt it but forget about css. Thanks a lot @h4r1m4u .
no prob
Hi, does anyone know why the carousel my page won't animate/respond? http://codepen.io/spacecortez/pen/dGLpbq?editors=1100
@Spacecortez you forgot to import jquery and bootstrap.js into your project
I quick added bootstrap in the CSS section settings, shouldn't that work?
nope. that's just the CSS library that's part of bootstrap
ohh
it's fixed, thanks :D
:thumbsup:
Sorry guys, today I know I am tremendously annoying, but I cannot fix those litle things.
http://codepen.io/DiazPedroAbel/pen/pgRXWv
I want to put a background in my calculator webpage, so I change it from the body background but it makes something weird. Looks like its broken in 3 pieces or rows...
@Abel1987 add no-reapeat fixed
also, you're setting the same background for both body and html. set it only for one of the elements
Thanks @wearenotgroot That's kind of weird because I tried this before, I mean, I put fixed no-repeat; and didn't work
abel1987 sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star: 880 | @wearenotgroot | http://www.freecodecamp.com/wearenotgroot
Thanks a lot, by the way, I am trying to move the calcultor to the bottom but setting in the calculator class align="bottom" or right does not work. Any idea? @wearenotgroot
abel1987 sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:warning: abel1987 already gave wearenotgroot points
@Abel1987 try something like margin-top: xpx; or margin-bottom: -xpx; the align only works for center left and right as far as i know
@pringon umm, is not what exactly I was looking for because If the screen is smaller the calculator gets out of it.
then you could try using percentages
instead of pixels
not sure how well it works for height
but for width it works perfectly
yep
it should work
tried it on mine
i used a margin-top of about 27 percent
you can play around with it until it works for you
Hey, guys! Can enyone help me to figure out with some incomprehensible part of inheritance in javasript?
I have a Vehicle base class
and child Car class
var Car = (function (parent) {
Car.prototype = new Vehicle();
Car.prototype.constructor = Car;
function Car(year, make, model) {
parent.call(this, year, make, model);
this.wheelQuantity = 4;
}Car.prototype.getInfo = function () {
return 'Vehicle Type: Car ' + parent.prototype.getInfo.call(this);
return Car;
})(Vehicle);
Car.prototype = new Vehicle();
Car.prototype.constructor = Car;
function Car(year, make, model) {
parent.call(this, year, make, model);
this.wheelQuantity = 4;
}Car.prototype.getInfo = function () {
return 'Vehicle Type: Car ' + parent.prototype.getInfo.call(this);
return Car;
})(Vehicle);
why we use that "Car.prototype.constructor = Car;"
If it works whithout that expression?
Thanks @pringon thats better :)
abel1987 sends brownie points to @pringon :sparkles: :thumbsup: :sparkles:
:star: 242 | @pringon | http://www.freecodecamp.com/pringon
@Abel1987 no problem mate :D
@rusaym When you call new Vehicle, the constructor of car will actually lead to Vehicle, which people think means 'was constructed by'. It actually doesn't mean that at all. Prototypal inheritance is a complicated concept, and is very different to class based inheritance. I recommend reading this free book for a great explanation:
https://github.com/getify/You-Dont-Know-JS/tree/master/this%20%26%20object%20prototypes
But regarding your question, you don't need to include that line at all for what you are doing.
Hi
When working on the Weather project, codepen doesn't prompt me for geolocation permissions and am unable to display anything. Anyone faced the same problem?
When working on the Weather project, codepen doesn't prompt me for geolocation permissions and am unable to display anything. Anyone faced the same problem?
@HMAN1911 thank you:thumbsup:
rusaym sends brownie points to @hman1911 :sparkles: :thumbsup: :sparkles:
:star: 86 | @hman1911 | http://www.freecodecamp.com/hman1911
@dshgna can you post your pen please
@rusaym the section that explains it in particular
https://github.com/getify/You-Dont-Know-JS/blob/master/this%20&%20object%20prototypes/ch5.md
https://github.com/getify/You-Dont-Know-JS/blob/master/this%20&%20object%20prototypes/ch5.md
@dshgna getCurrentLocation is disabled on insecure origins. Basically, you need to be using HTTPS for it to work. I would recommend using the coordinates of the IP address for this project.
@HMAN1911 using the ipinfo API right?
@dshgna That one would be fine, but there are others out there :)
hints? :D
@dshgna you have a typo there
@dshgna is the console returning the position for you ?
@kirbyedy where exactly?
are you getting the position in the console ?
@kirbyedy as I've mentioned earlier, it doesn't display anything
yes, because you have a typo
where's the typo?
lot = position.coords.longitude;
url = "api.openweathermap.org/data/2.5/weather?lat="; + lat + "&lon=" + lon + "APPID=" + key;
and here you use lon
thanks so much @kirbyedy for spotting.
dshgna sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star: 483 | @kirbyedy | http://www.freecodecamp.com/kirbyedy
is it returning the location now ?
@dshgna another thing
its returning the lat and lon but not displaying the data
@dshgna you have to add jquery on the js settings
@dshgna beacuse you are using $.getJSON<-------------from jquery
@wearenotgroot errgh yes!
thanks @wearenotgroot
dshgna sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star: 881 | @wearenotgroot | http://www.freecodecamp.com/wearenotgroot
@dshgna also
@dshgna your url
@dshgna you need to append in front of it------>http://
@dshgna or else it will throw an error
@wearenotgroot yes...figured that out. Thanks very much again :D
dshgna sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:warning: dshgna already gave wearenotgroot points
@dshgna YW
a quick question, is it generally better to use var when declaring a variable in all cases?
@Surya97
Guys I need some info about how to create a thumbnail which on hover should give options for download, view and delete.
can anyone please tell how to do so?
Guys I need some info about how to create a thumbnail which on hover should give options for download, view and delete.
can anyone please tell how to do so?
@dshgna if you dont use var then it will interpreted as a global variable
guys can anyone please help me?
@dshgna the problem lies if a function has a similar named variable. then if not handled properly a variable value might be overridden
@wearenotgroot yes, so its always best to declare as local variables? I was wondering in scenarios like relatively lesser logic like this.
@dshgna yep
@dshgna also it depends on where those variables are located
@dshgna right now your variables are considered global
@dshgna accessible throughout the entire page
which may be a problem if future functions modify the value right?
yes
@dshgna try and enclosed them in a function and call the function to execute down the page or with $(document).ready(function(){ "your code here" }); <------this way they are all within the scope of that function
@dshgna would look like this
$(document).ready(function(){
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
var lat = position.coords.latitude;
var lon = position.coords.longitude;
var key = "6fccda1c30c7f392d44016c2bb3b6519";
var url = "http://api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + lon + "&units=metric&APPID=" + key;
$.getJSON(url, function(data) {
var temp_celsius = data.main.temp;
var country = data.sys.country;
var city = data.country;
var weather = data.weather.main;
console.log(temp_celsius);
console.log(country);
console.log(data);
console.log(weather);
});
});
}
});or
function start(){
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
var lat = position.coords.latitude;
var lon = position.coords.longitude;
var key = "6fccda1c30c7f392d44016c2bb3b6519";
var url = "http://api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + lon + "&units=metric&APPID=" + key;
$.getJSON(url, function(data) {
var temp_celsius = data.main.temp;
var country = data.sys.country;
var city = data.country;
var weather = data.weather.main;
console.log(temp_celsius);
console.log(country);
console.log(data);
console.log(weather);
});
});
}
}
start();
@wearenotgroot Thanks so much. I'll do so.
dshgna sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:warning: dshgna already gave wearenotgroot points
@dshgna btw if you look at the api docs ------>http://openweathermap.org/current scroll down on the section for Units Format
@dshgna you can set the unit system to use for the returned result. either imperial or metric. else you will standard measurements
@wearenotgroot yes I already modified my pen for that using metric.
@dshgna ok :+1:
@wearenotgroot did you use the OWM icons or another set of icons?
@dshgna nope
@dshgna just use the icon from the site
@dshgna you can get the icon name
@dshgna from the data you received
@dshgna then jsut append the url -------->http://openweathermap.org/img/w/'+iconname+'.png'
use this as source in <img scr=>
@wearenotgroot yes that's what I meant :)
OWM = open weather map
OWM = open weather map
thanks a lot anyway @wearenotgroot :)
dshgna sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:warning: dshgna already gave wearenotgroot points
@dshgna yes i get the context :smile:
hopefully I'll be able to finish this soon!
@dshgna btw the icon name is inside the weaher property, just an fyi the weather contains an array
yes, got it :) that was a bit confusing , figuring out the array
@dshgna yep it was because on some area they have weird weather :smile:
@dshgna so the main weather is at index 0
oh...like two different types of weather :O?
that's funny
@dshgna other than that additional weather conditions are at index after
@dshgna it's mostly fog and mist mixed in the main weather condtions
@wearenotgroot ah I see. so at which project are you now at?
@dshgna Iam at tic tac toe and simon game
@dshgna not in a rush though :smile:
@dshgna also i just do what i feel like doing :smile:
@wearenotgroot both of them look rather complicated at first glance
@dshgna well it's just designing your own logic for the game that is the tricky part
@wearenotgroot what about ui?
@dshgna well if you already made it this far, that part is not that difficult
@dshgna and it's your choice to make it fancy or not :smile:
@wearenotgroot haha I really lack the patience for ui :(
@dshgna well ui is an art on its own
@wearenotgroot indeed :)
hey guys, im soooooo close to finishing my clock, but I just have a problem when the clock hits 0... it counts back to 59:59
any ideas?
@JackEdwardLyons yep
@JackEdwardLyons the -1
@JackEdwardLyons `
function countDownFrom(seconds) {
if (playing) {
if (seconds > -1) { //<-----------------culprit should be 0
setTimeout(function() {
counterValue = countDownFrom(seconds = seconds - 1)
renderTime(seconds);
}, 1000);
} else {
playing = false;
seconds = 0;
}
}
return seconds;
}
Hey everybody. Does anyone have any recommendations for some Android apps that would allow a person to code html/css/javascript in a easy way. Something like CodePen for mobile? Or at least something where you can preview your work?
good question, never heard of anything like that :)
personally for me, coding on the smartphone would be a nightmare
you guys ever experience where your brain refuses to cooperate when your trying to solve a problem?
mhm... every third day
take a break
Im going to when this project is done. Super close on my calculator, just a bug I am having a brain block about lol
I have to spend a lot of time away from my pc during regular work hours, but while I'm working I have downtime. Sometimes I'll sit and do nothing for up to 3 hours. Thought it would be a good use of time to get some coding in. I guess I'll be the Guinea pig and let you guys know what I find.
if codepen works in a mobile browser, youd just need a bluetooth keyboard or something
@FatTone225 @avanbox yeah, the codepen editor is optimized for mobile. why not use that?
@h4r1m4u I probably will. Hoping it has some kind of keyboard shortcuts for mobile
@h4r1m4u Thanks for the link!
fattone225 sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1424 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
you betcha. yeah, i don't know if it has any shortcuts. like @kirbyedy, thinking about coding on my mobile device gives me nightmares ;)
I have to admit though, CodePen is pretty darn awesome
i hate it actually haha
if i could get webstorm or something working right i would avoide codepen
hate codepen :O?
Now that I've got used to codepen, I'd hate to use an ide for web dev
critiques for my weather app please...
http://codepen.io/dshgna/full/ZQZBOq/
critiques for my weather app please...
http://codepen.io/dshgna/full/ZQZBOq/
Guys, challenge "Build a Random Quote Machine". Where i should take quotes? Some API?
@Savrov yeah, either an API or you can store them locally in your code in an array
I stored mine in an array but in the future id like to change it to an api of some sort
@Savrov I used a Mashape API
@dshgna works great for me.
@h4r1m4u thanks, one dude gave me that: http://quotesondesign.com/ (API link at bottom)
savrov sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1425 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
@dshgna thank you too)
@Savrov here's another one for you http://forismatic.com/en/api/
@dshgna if your browser doesn't support geolocation or have it enabled, all you see is a blank white page
might be a good idea to either have some sort of a fallback, or at least display an error/notification to the user
@h4r1m4u ah good feedback...Ill show an error message
@dshgna would it be possible to accept a zipcode as an input?
:thumbsup:
@avanbox you mean for the openweather api?
(alternatively you can use https://ipinfo.io/ to the get the user's IP address and then the location from that)
well if someones browser does not support location, or they deny it, could they instead just put in a zip code?
@avanbox a good idea, but there are too many variations in zip codes (and possibly duplicates). also some countries (like where i live) don't use zip codes at all
@dshgna No background images? I'm on mobile. Not sure if that makes a difference.
oh yeah. i made the american mistake assumed everyone is from here
:)
ok, I wanted to figure this out myself but im just stuck. My calculator is working ok, but there is a bug. 2+2= works great. The problem occurs when you press 2+2+2 etc. the second operator throws everything off. I did not plan for this occurrence and now I dont know how to fix it. any tips?
@FatTone225 no background image. bdw is it a requirement?
@avanbox I think I used an operator flag that gets switched on and off. Not sure how you set yours up but I had two arrays for my equations so it worked out well
This message was deleted
Lol
@avanbox: yes openweathermap supports querying from zipcode. Small caveat there though, for the same zipcode may be there for different locations. I remember once I got somewhere in China for my zipcode lol
well ideally Id like to be able to do 2+2+2+2 etc.
@dshgna I don't remember if it's a requirement but I do think it was mentioned in the video.
@avanbox You can do it with that method
@avanbox evaluate the result after the user presses number / operator / number. this then becomes your "first number" for further operator clicks
@FatTone225: oh I just went through the text: it says icon or background...but guess I'll do the background too
@dshgna Never hurts to go the extra mile :smile:
Thats it! Thanks @h4r1m4u sometimes i just cant think. Such a simple solution
avanbox sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1426 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
no probs
when I redid my weather app, I added a search bar, you can search by city, course I also redid mine in react, and might tweek it again to use redux at some point
@FatTone225 yeah and I'm wondering how to set the background image cos as I remember its a css property
is there anyway to change the image that is shown in our codepen portfolio? All mine are empty when I include the elements dynamicallly
Hmm. I think the preview updates based on probably the default image.
@dshgna I would just set a default and then overwrite it dynamically
@FatTone225 in case there's no background image? yeah...codepen doesnt show any dynamically appended elements which makes my portfolio look awful lol :(
And yeah you can set it as an attribute of the div or as a css property.
@dshgna Well I mean just set a default so your previews look better lol
Hello, In portfolio project I I created 2 principal divs for my page, the first is fixed on the left , the second which will contain the content, I used bootstrap grid to split the second div to 12 col, but it doesn't work, the grid always consider all the page as one div, can anyone help to find a trick to do that (sorry for my english :stuck_out_tongue_winking_eye: )
http://codepen.io/AnnasLab/details/XXQgZj/
http://codepen.io/AnnasLab/details/XXQgZj/
@dshgna also by setting a default background you at least display something if your JS doesn't load
HI guys .... would you please check my Tic-Tac Toe
and give me some feedback
please
@AnnasLab so you want the nav on the side and the yellow div to be the rest of the content?
@AnnasLab the head and body tags serve different purposes then what you are using them for. header would be for a page / section header, also you have container-fluid and row wrapping the section you want on the right which is partly why its not on the right
@FatTone225 yeah true there :)
@rune-jacobsen exactly
@AnnasLab When you tell the yellow div that it col-12 then it will fill all of the page
so because the nav fills some of the page i drops to the end of it
so it can spread to fill the entire page
@sandipsubedi when i play and i lose, if i dont press that i want to play again, i can keep play the old game
@rune-jacobsen so I think that if I need to do something like this bootstrap is not a good choice
@sandipsubedi and i can override the already used fields
@AnnasLab you can use bootstrap but you should see your nav as a col too
Hey guys,
I'm doing the Wikipedia project and I want to select the text inside an input. Any idea ? I can't remember how to do it using Jquery.
Thanks.
I'm doing the Wikipedia project and I want to select the text inside an input. Any idea ? I can't remember how to do it using Jquery.
Thanks.
@rune-jacobsen but I can't give it a fix width, I can just give it 1 unit of the grid
@thomas-duval http://api.jquery.com/val/
@h4r1m4u perfect, thanks.
thomas-duval sends brownie points to @h4r1m4u :sparkles: :thumbsup: :sparkles:
:star: 1427 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
np
@AnnasLab you could also give it 2 or 3? I dont think a fixed with would be the best choice to use for the nav
@rune-jacobsen okay I'll give it try thanks for help have a great day
annaslab sends brownie points to @rune-jacobsen :sparkles: :thumbsup: :sparkles:
:star: 287 | @rune-jacobsen | http://www.freecodecamp.com/rune-jacobsen
@AnnasLab No worries - put it in the same container if you want it side by side, or else it will also jump down
@rune-jacobsen Yes i'll make the nav horizental in small screen ;)
Exactly @AnnasLab, think responsive ;)
@jnmorse thanks bto i'll take your notes in consideration
annaslab sends brownie points to @jnmorse :sparkles: :thumbsup: :sparkles:
:star: 393 | @jnmorse | http://www.freecodecamp.com/jnmorse
Thanks guys have a great days :D
Hello again, i have a quote generator here with one issue: after the first opening of page there is no quote. I need to push a Generate button. How i can do it automatically?
http://codepen.io/Savrov/pen/VeNMgP
http://codepen.io/Savrov/pen/VeNMgP
can anyone tell me why is it only filtering the first element i click on?
@Savrov I did something like this: $(document).ready(function() {
insertQuote();
insertQuote();
!rooms
rooms
See all the FreeCodeCamp rooms at gitter.im/FreeCodeCamp/roomsOr check this wiki article for a shortlist
can someone tell me how to link to my pens in code pen? Whenever I put the URL in, I get a 404 error.
@hintcj can you try posting a url?
@dickfink http://codepen.io/hintcj/pen/jWRYGV
worked for me
me too
if your trying to link to them its better is you replace "pen" with full
Alright, yeah, I don't know what the problem was then. Thank you @dickfink @avanbox
hintcj sends brownie points to @dickfink and @avanbox :sparkles: :thumbsup: :sparkles:
:star: 208 | @avanbox | http://www.freecodecamp.com/avanbox
:star: 168 | @dickfink | http://www.freecodecamp.com/dickfink
np
avanbox — great tip w/ “full"
@avanbox Why does changing to full make a difference?
i belive it just changes how it’s displayed (code minimized)
oh okay, that makes sense then. First time using code pen!
yeah it makes it full screen
@vizFlux could it have something to do with your countdownCrt() function checking for seconds === 0 and resetting seconds to 59 before executing timeCount()? That seems like it could be problematic….
Im trying to make my navbar button active when you scroll, can someone help?
@cesarrodas You’re going to have to detect the scroll position of your page and the (vertical) position of the sections on your page, and then based on that, give the corresponding menu item in your menu a specific class.
http://api.jquery.com/scrollTop/
http://api.jquery.com/position/
Something like this (not tested):
if ( $('body').scrollTop() > $('.section-a').position.top ) {
$('.menu-items').removeClass('selected');
$('.menu-a').addClass('selected');
}
if ( $('body').scrollTop() > $('.section-b').position.top ) {
$('.menu-items').removeClass('selected');
$('.menu-b').addClass('selected');
}
if ( $('body').scrollTop() > $('.section-c').position.top ) {
$('.menu-items').removeClass('selected');
$('.menu-c').addClass('selected');
}
unable to filter json
$.getJSON('https://en.wikipedia.org/w/api.php?format=json&action=query&generator=search&prop=extracts&exlimit=max&explaintext&exintro&exsentences=1&gsrsearch=suits&callback=?',function(json){
json = json.filter(function(val) {
return (val.index !== 1);
});
$(".message").html(JSON.stringify(json));
});
I want to filter the entries not having index 1
but no nothing displays, whereas when I simply stringify json, output is as expected, filter seems like ruining the thing, kindly help
Hi, how can I put images from my pc in codepen? we need a special account for hosting?
@victoriasimonetti you need to host them somewhere online and point to the URL, there are lots of free services which do that (imgur.com comes to mind)
@dickfink thanks, i'm interested in getting mines to work, however. I thought I want close.
cesarrodas sends brownie points to @dickfink :sparkles: :thumbsup: :sparkles:
:star: 169 | @dickfink | http://www.freecodecamp.com/dickfink
$.getJSON('https://en.wikipedia.org/w/api.php?format=json&action=query&generator=search&prop=extracts&exlimit=max&explaintext&exintro&exsentences=1&gsrsearch=suits&callback=?',function(json){
json = json.filter(function(val) {
return (val.index !== 1);
});
$(".message").html(JSON.stringify(json));
});
json is not filtered, help please
@dickfink thanks! =)
victoriasimonetti sends brownie points to @dickfink :sparkles: :thumbsup: :sparkles:
:star: 170 | @dickfink | http://www.freecodecamp.com/dickfink
is there any1 , who can help?
@hiresh see http://api.jquery.com/filter/#filter-function
the index you’re calling in that code indicates " indicates the 0-based position of the element within the unfiltered set of matched elements"
eg if you had a page with a bunch of “li” elements:
$( "li" )
.filter(function( index ) {
return index % 3 === 2;
})
.css( "background-color", "red" );would cause third and sixth list items to be highlighted.
i think you need to iterate through each of the “pages” object and filter out the one that has pages.index === 1
(but i’m just learning too, so take what i say with a grain of salt)
Reviews Please:
http://codepen.io/maulikdarji/full/LGqEdE
http://codepen.io/maulikdarji/full/LGqEdE
Hi i need help in the Weather app zipline
I dont get a response from the openweather api, if i put the urrl in the browser searchbar it loads but when i call it with the ajax jquery function i get nothing.
Here is my code:
$(document).ready(function(){
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position){
var apiUrl= "api.openweathermap.org/data/2.5/weather?lat="+ position.coords.latitude + "&lon=" + position.coords.longitude + "&units=metric&APPID=388b9dfad805b961ba54355aedb86991"
$.ajax({
url:apiUrl,
success: function(weather){
console.log(weather);
},
})
});
}else {
$('#location-header').html('Geolocation is not available')
};
});Thanks
Here is the pen link: http://codepen.io/SpiralOut17/pen/XXQmxM?editors=0011
hello all
how is everyone today?
@DivaWeb Great! you?
i have got a problem programming the weather app
i cant get my longtitude
@LDiek- Im working on that ziplite too
@SpiralOut17 lol I almost through my computer through the window over a space in my code lolololololo
@SpiralOut17 i've seen it in CodeReview :D
@LDiek- Haha i just solved that problem i had
what was the problem?
@SpiralOut17
@LDiek- I couldnt get the JSON from the api because i was missing // at the beggining of the url
@LDiek- I was going nuts
@SpiralOut17 do i need the // always in js urls?
@LDiek- apparently it allows either http and https so it works with either
hmm ok thx
@dickfink but the error I am facing in console is "filter is not a function"
@SpiralOut17 I dont get any longtitude nor an output in the div with the class "weather".This is my code:`function printweather(pos) {
var lon = pos.coords.longtitude;
var lat = pos.coords.latitude;
var url = "//api.openweathermap.org/data/2.5/weather?lat="; + lat + "&lon=" + lon + "&units=metric&APPID=6ffb926f18657b3913623a729923200f";
$.getJSON(url, function(data) {
$(".weather").html(data);
});
}
$(document).ready(function() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(printweather);
}
});`
function printweather(pos) {
var lon = pos.coords.longtitude;
var lat = pos.coords.latitude;
var url = "//api.openweathermap.org/data/2.5/weather?lat="; + lat + "&lon=" + lon + "&units=metric&APPID=6ffb926f18657b3913623a729923200f";
$.getJSON(url, function(data) {
$(".weather").html(data);
});
}
$(document).ready(function() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(printweather);
}
});
oh the indents are gone :O
@LDiek- You are not getting output because you are not getting nothing from the api since the lon variable is empty
@SpiralOut17 do you have an idea why lon could be empty?
@LDiek- Try using the position.coords.longitude and dont use the variables in the url
@LDiek- you can put the var url within the if statement and call the api from there
@SpiralOut17 ok i have got an output now... i just had to stringify the data object :D
but still i have got the {"cod":"404","message":"Error: Not found city"} message @SpiralOut17
@LDiek- Did you get de longitude?
no
@SpiralOut17 i just spelled longitude longtitude... thanks for your help!:D
ldiek- sends brownie points to @spiralout17 :sparkles: :thumbsup: :sparkles:
:star: 279 | @spiralout17 | http://www.freecodecamp.com/spiralout17
This message was deleted
@LDiek- You are welcome! Havea nice day
I just can't understand how to implemente the minimax algorithm in my tic tac toe game
it just feels like the way I've structure my code is not compatible with the algorithm at all and I'm not sure how to rebuild it
Hey Guys ...new guy just dropping a line
hey guys can someone please point me in the direction to fix my quote button |
http://codepen.io/drewpiper/pen/BjbjOW/?editors=0110
looking at how to get rid of that blue border when i click it, thank you
@andrewp89 outline:none;
@andrewp89
.btn:focus {outline: none;}
This message was deleted
@andrewp89 Hi Andrew, outline: none; will indeed solve your problem, but keep in mind that the outline also serves users with a screenreader
thanks guys!! been pulling my hair out for a bit :+1:
hello peoples!
If anyone knows how ot convince CodePen to display an image (the <img> tag works well if browsing locally) I would appreciate getting a clue or two. I even tried adding the 'target="_blank"' trick used for the anchor tag <a href= ...>. Thanks in advance!
.o0( looks empty here, I guess I'll stop by again later)
what do you mean?
hey guys I'm working on the dedication page an am trying to center an image, anyone know how that would work?
@andrewp89 you can use bootstrap and add the class text-center
@cooperreck you could use bootstrap, or use a div wrapper, then mod the class like `.wrapper{text-align:center;} - that should do it
Yes, and study this post to be safe & sound in the future: https://css-tricks.com/centering-css-complete-guide/
Centering in CSS can be a B*tch ;)
@cooperreck Here is a finddle on how to do it: https://jsfiddle.net/66oxm294/
@URobert @Aidenbuis Thanks guys!
cooperreck sends brownie points to @urobert and @aidenbuis :sparkles: :thumbsup: :sparkles:
:star: 593 | @urobert | http://www.freecodecamp.com/urobert
:star: 134 | @aidenbuis | http://www.freecodecamp.com/aidenbuis
@cooperreck yw
hey guys i tried putting btn:focus {outline:none;} but it doesnt seem to work (Also tried to add outline:none into my other .btn's and also outline:0; (as per google serach) but still getting that box on my button. thanks guys http://codepen.io/drewpiper/pen/MKRVzy
Hey just made this tribute page... Please tell me what should I do to make it look better? http://codepen.io/shakib609/full/jWRyQE/
@andrewp89 Add !important, outline: none !important;
@andrewp89 I suggest you fulfill the user stories before attempting to personalise it.
Made some minor changes. http://codepen.io/shakib609/full/jWRyQE/
yoyooooooo!
@shakib609 Hi Shakib, some design questions: the blue nav has a huge height in comparison to the logo and the nav items, you could play with the font size and the line-height to vertically center them. I also sugget u make them inline by using only 1 row. Last point, the box shadow is not subtle, you can check out Google’s Material design and how they use shadows (They the boxshadowbosses)
@wyattwade Wasssup
@Aidenbuis champion!!
@Aidenbuis hangin out man... just been working on this project for so long
Changed the nav to use a single row.. I'll have to look about the box shadow. @Aidenbuis thanks
shakib609 sends brownie points to @aidenbuis :sparkles: :thumbsup: :sparkles:
:star: 135 | @aidenbuis | http://www.freecodecamp.com/aidenbuis
Tic Tac Toe
I think it's done. If anyone is able to beat it or has any criticism, it's much appreciated
@wyattwade Aiii I didn’t do that one yet, let me see !
thanks man @Aidenbuis . This one took a while for whatever reason
wyattwade sends brownie points to @aidenbuis :sparkles: :thumbsup: :sparkles:
:star: 136 | @aidenbuis | http://www.freecodecamp.com/aidenbuis
@wyattwade there is a bug
check the image
this happened in the middle of the game
Changed the box shadow to use the mdl's default box-shadow class http://codepen.io/shakib609/full/jWRyQE/
@kirbyedy oops lemme get rid of that. Was using that for testing my bad
Ok I just updated/saved it
thanks for taking a look @kirbyedy . Fixed that. Let me know if you find anything else
wyattwade sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star: 492 | @kirbyedy | http://www.freecodecamp.com/kirbyedy
I am working on Accessing Nested Arrays in JSON and could use some help. Don't know how to pick an object from a nested object.
@ghcarrolljr Ok, post your formatted code and we'll have a look.
help format
:point_right: code formatting [wiki]
Inline code
This an inline `<paste code here>` code formatting with a single backtick(`) at start and end around the code.
Code Block
```js ⇦ Type 3 backticks and then press [shift + enter ⏎] (type js or html or css)
<paste your code here>,
then press [shift + enter ⏎]``` ⇦ Type 3 backticks, then press [enter ⏎]
See also: ☛ How to type Backticks | ☯ Compose Mode | ❄ Gitter Formatting Basics
This is what I have so far "var secondTree = myPlants.type[trees].list1;" but does not work. any help?
@ghcarrolljr maybe if you post all your code we can.
// Setup
var myPlants = [
{
type: "flowers",
list: [
"rose",
"tulip",
"dandelion"
]
},
{
type: "trees",
list: [
"fir",
"pine",
"birch"
]
}
];
// Only change code below this line
var secondTree = myPlants.type.trees.list[1]; // Change this line
@ghcarrolljr can you post your formatted code as requested please
help format
:point_right: code formatting [wiki]
Inline code
This an inline `<paste code here>` code formatting with a single backtick(`) at start and end around the code.
Code Block
```js ⇦ Type 3 backticks and then press [shift + enter ⏎] (type js or html or css)
<paste your code here>,
then press [shift + enter ⏎]``` ⇦ Type 3 backticks, then press [enter ⏎]
See also: ☛ How to type Backticks | ☯ Compose Mode | ❄ Gitter Formatting Basics
hello
can someone help me drive my car?
its the green vehicle on the right side of the screen
if i click it, it does drive around the bend
but it doesnt move forward
it should
@cragsify
@cragsify // Setup
var myPlants = [
{
type: "flowers",
list: [
"rose",
"tulip",
"dandelion"
]
},
{
type: "trees",
list: [
"fir",
"pine",
"birch"
]
}
];
// Only change code below this line
var secondTree = myPlants.type.trees.list[1]; // Change this line
// Setup
var myPlants = [
{
type: "flowers",
list: [
"rose",
"tulip",
"dandelion"
]
},
{
type: "trees",
list: [
"fir",
"pine",
"birch"
]
}
];
// Only change code below this line
var secondTree = myPlants.type.trees.list[1]; // Change this line
sigh...
@ghcarrolljr ok, since I don't know what the challenge is I don't know what you are trying to do.
Hey guys
if anyone has a chance can you check out my project
@ghcarrolljr myPlants.type == "flowers" and has no trees property.
criticism is much appreciated
and please let me know if you can beat it. That means there's a bug
ok I need something explained to me about bootstrap
@cragsify write a variable that gets the second tree in the tree list
does a container in bootstrap have default sizes?
@ghcarrolljr OK, so you know that the object has two nested arrays.
@wyattwade i cant beat it. but there is somthing wrong. sometimes, comp skips a move. so player can go twice
And you want to access the second array and then the second object within that arary. @ghcarrolljr
Hey all... Was hoping someone could help with my weather app... I''m almost there. Having trouble changing the city. I'm trying to do it with url.replace(city, newcity)... Any help would be appreciated! http://codepen.io/RDaniels34/pen/zreZwy
@RDaniels34 Why do you want to view cities location? The user story states that you need to show the weather at the current location?
crap
@cragsify I can get the weather for my location just by putting the name in, but I want anyone who wants to see their location to enter a city name and have it come up..
thanks @ronstarcool I'll check that out
wyattwade sends brownie points to @ronstarcool :sparkles: :thumbsup: :sparkles:
:star: 329 | @ronstarcool | http://www.freecodecamp.com/ronstarcool
@RDaniels34 Why don't you just use geo-location to enable people to view the weather at their location?
@ronstarcool crap it just happened I see what you me an
@cragsify what if they want to see the weather somewhere else?
@RDaniels34 Also how are you handling people that input the cities name differently than the API asks?
@RDaniels34 let them put in the coords
@rune-jacobsen thank you ... fixed both of them
sandipsubedi sends brownie points to @rune-jacobsen :sparkles: :thumbsup: :sparkles:
:star: 288 | @rune-jacobsen | http://www.freecodecamp.com/rune-jacobsen
@cragsify Does anyone you know know what their coords are?
@cragsify What are the coords for Tucson?
@RDaniels34 32.2217° N, 110.9264° W
How do I link a picture in dropbox to put it in a img tag?
@cragsify I want to do it my way, if you can't help then...
@RDaniels34 I don't know how to get it to give me the weather in my City, Perth, Scotland, given that if I type inPerth, it will take me to Australia, but I know how to find my coords and input them.
@cragsify you just us UK in the json
@RDaniels34 use
@cragsify or at least the country code for Scotland
@Zera99 I used http://tinypic.com/
@RDaniels34 If you want to pull data from your input field, then you will need to add an on-clcik listener to the button and disable the loading of the page when the button is clicked.
@cragsify so my onclick event would be outside the onready function?
@RDaniels34 inside.
or document.ready function
@cragsify it is inside already
@cragsify Sorry was out for a min. Yes and Yes.
@RDaniels34 I tested it, it doesn't work.
@ghcarrolljr So can you think of a way to access entries within an array?
@Zera99 link me the image please?
I did it ^^ Thanks though. @cragsify
zera99 sends brownie points to @cragsify :sparkles: :thumbsup: :sparkles:
:star: 316 | @cragsify | http://www.freecodecamp.com/cragsify
@cragsify arrayName[position]
@ghcarrolljr ok ,so do that in your code. access the 2nd array, then the 2nd array again.
@cragsify I know it doesn't work. That's why I came here to the chat.
@RDaniels34 OK, I'd recommend putting the event listener in you JS and linkin to the element by reference to it's ID.
@cragsify ?
@cragsify I'll give that a try....
@ronstarcool k fixed that issue
Ok this may be another stupid question... for the portfolio zipline, do I HAVE to have a nav bar that stays at the top as you scroll down, or can i just have buttons that link to each section of the page
If anyone can beat this pleeasee let me know
@cragsify Waht is the first array? type
or if you have any criticism
good job @wyattwade
not sure :)
@ghcarrolljr myPlants
@ronstarcool i thiiiiink i fixed the issue
did about 20 test runs
@cragsify so what is the second?
@hajeansonne What do the user stories say.
y, you fixed it
nice gameflow!
@ghcarrolljr If you use
myPlants[1] then you are inside the 2nd element in the main array, then if you do [1], you will access the 2nd, 2nd element
@cragsify I navigate to different sections of the webpage by clicking buttons in the navigation, by "in the navigation" do they mean nav bar?
@ghcarrolljr
myPlants[1][1]
@hajeansonne That's open to interpretation i suppose.
@ronstarcool thank you man
wyattwade sends brownie points to @ronstarcool :sparkles: :thumbsup: :sparkles:
:warning: wyattwade already gave ronstarcool points
@cragsify god i hope so, i just put so much work into the home section
I have to send this project in for an application
just want to make sure it works alright
@cragsify thank you
hajeansonne sends brownie points to @cragsify :sparkles: :thumbsup: :sparkles:
:star: 317 | @cragsify | http://www.freecodecamp.com/cragsify
@ghcarrolljr what I did was
var secondTree = myPlants[1].list[1];
@cragsify thanks
how do you put multiple style elements into a inline style like this style="margin-top: 40px"
@caleb272 leave a space between them.
@caleb272 although it is bad practice.
o ok
i guess i will just create a css element
@caleb272 I would advise it :D
why do I have an odd man out? http://codepen.io/DivaWeb/pen/XXOdEX
it is in section 3
wow that looks good divaWeb
@caleb272 thank you but it is still a work in progress lolol
divaweb sends brownie points to @caleb272 :sparkles: :thumbsup: :sparkles:
:star: 132 | @caleb272 | http://www.freecodecamp.com/caleb272
https://htmlpreview.github.io/?https://github.com/zackluckyf/random-quote-machine/blob/master/Random-Quote-Generator/index.html
Random quote machine completed except for the fact that all the quotes are hard programmed in js and not from an api. I know nothing of how to do that, should I go learn some php and ajax to be able to do it all?
Random quote machine completed except for the fact that all the quotes are hard programmed in js and not from an api. I know nothing of how to do that, should I go learn some php and ajax to be able to do it all?
@zackluckyf just do it in JS.
@cragsify I'm not sure where to start is there a resource to learn about api's and how to use them?
@zackluckyf each api is slightly different. What i would aim to learn is the way of sending get requests, such as jQuery's $.get and $.ajax
guys i uploaded images to imgur to use in my codepen and when i go full page view they dont load.any idea why?
@gxenos post your codepen link
@cragsify okay I'll give that a go, thank you
zackluckyf sends brownie points to @cragsify :sparkles: :thumbsup: :sparkles:
:star: 318 | @cragsify | http://www.freecodecamp.com/cragsify
So I want to change the text under the picture independently from the main text but they are only changing together, can someone help? http://codepen.io/Cjreck/pen/PZLrpy?editors=1100
@gxenos It workds for me.
can you open it in a new tab and check it?
@cooperreck color: black;
@cooperreck not text-color:black;
@gxenos I have.
@cragsify well,when i refresh it,the images get lost
@cooperreck place the image and paragraph in a div, style the div.
@cragsify Thank You!!1
cooperreck sends brownie points to @cragsify :sparkles: :thumbsup: :sparkles:
:star: 320 | @cragsify | http://www.freecodecamp.com/cragsify
@gxenos it seems to work intermittantly — but i think you should wrap the url in quotes in your css
nice green color i hope you don’t mind me stealing it for my project
can someone check out my project http://codepen.io/thecoder15/full/wMZgVw/
I'm working on the wikipedia app. Does anyone know how to add the Access-Control-Allow-Origin hedaer for that?
@dickfink alright,i fixed it,i uploaded them in imageshack instead.Do you like it though?
does anyone here live in Montana
hi how do i get the table borders completely transparent? http://codepen.io/LDiek-/full/PZgQwG/
@gxenos yup, that works now. there’s a lot of un-used verticle whitespace (but if you like it go for it!), and the social buttons act oddly when the window is narrow. Otherwise it looks very nice (much nicer than mine)
@dickfink yeah its not responsive
@dickfink i like its simplicity
now does anyone know how I would center the image of Bowie and the facts below him? http://codepen.io/Cjreck/pen/PZLrpy?editors=1100
hmm i tried that @wearenotgroot and didn't seem to change things...
still says 59:59...
@cooperreck Try text-align: center; in .mainBody
actually i got it work @wearenotgroot thanks for the help :)
jackedwardlyons sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
api offline
@brettfelts Ah doing that centers the text of the facts but keeps the list on the right
you can add ul to the beginning of .list, then add a text-align: center to that. It will center the text, but leave the bullet points on the left
hmm.
@cooperreck On the other hand: .list {
margin-left: 6.5%;
text-align: justify;
list-style-type: square;
font-family: Times New Roman;
font-size: 18px;
width: 700px;
}
margin-left: 6.5%;
text-align: justify;
list-style-type: square;
font-family: Times New Roman;
font-size: 18px;
width: 700px;
}
Time to start the weather challenge. I am so nervous
@Swoozeki You got this! It took me a few days, but once I realized my problems were just an extra if statement, it all made sense
can someone check out my project http://codepen.io/thecoder15/full/wMZgVw/
That looks much better, thanks! @brettfelts
cooperreck sends brownie points to @brettfelts :sparkles: :thumbsup: :sparkles:
:star: 360 | @brettfelts | http://www.freecodecamp.com/brettfelts
So I used position:absolute to position links over particular parts of the background image, and when I go to full page view, they are no longer where I want them. I am VERY new to this and I am not sure how to fix this
any api recommendations for the random quote machine?
@cooperreck No problem. If it has trouble when responsive, try setting the left and right margins to the same amount
@caleb272 I would suggest adding a bit of padding around your text, and making it a bit smaller
the list items are a bit overwhelming
so ive been working on this calculator, think im done, go to submit it and the project is gone from the map?
@hajeansonne instead of using px or em, use %
@caleb272 nice work man.you can maybe try to change the a tag text color
@zackluckyf i just used an array
@avanbox Calculator's been moved from basic front-end to intermediate front-end, I think
oh really? Guess I got a head start then haha
it must have moved while i was working on it
Yup, congrats :D Your learning curve is going to appreciate it
Hey guys
I'm about to submit my tic tac toe challenge for an application
Yoo whssup campers ^^, anyone know how to use local font file on codepen something like host the files on dropbox work ?
anyones critissm is much appreciated
I'm trying to create an indexOf function for an assignment and for some reason my checkDuplicate object always shows the array item = NaN, like the +1 in the for loop isn't working. Why doesn't it work and how can I fix this issue? Advice appreciated :)
indexOf([11,33, 22,33], 33);
2
3 function indexOf(array, value) {
4 var result = -1;
5 var checkDuplicate = {};
6
7 for(var i = 0; i < array.length; i++) {
8 if(array[i] === value) {
9 checkDuplicate[array[i]] += 1;
10 if(checkDuplicate[array[i]] !== 1) {
11 result = i;
12 }
13 }
14 }
15
16 return result;
17
18 }
Where my error is: http://goo.gl/BmkhUc
@Swoozeki its not as bad, but still moves out of alignment with the background
criticism much appreciated
if you can beat it pleeasee let me knwo
updated code
indexOf([11,33, 22,33], 33);
function indexOf(array, value) {
var result = -1;
var checkDuplicate = {};
for(var i = 0; i < array.length; i++) {
if(array[i] === value) {
checkDuplicate[array[i]] += 1;
if(checkDuplicate[array[i]] > 1) {
result = i;
}
}
}
return result;
}
nvm ty :)
I think some of the problem I had with links moving when I went into page view, has something to do with the editor layout that i was using, is that possible?
<div class="navi">
<ul>
<li>About</li>
<li>Work</li>
<li>Team</li>
<li>Contact</li>
</ul>
</div>
.navi {
display: inline;
tex-align: center;
}
how isn't this working? keeps displaying as a block text
the css above is in a css stylesheet
.... can only get it to work if i post class="navi" into each LI
@declanPaz well inline doesnt work this way
i thought it would put all items that inherit the class with inline onto one line
@declanPaz you can use
''' .navi *{ display: inline; }
:bulb: to format code use backticks! ``` more info
.navi *{ display: inline; }
@declanPaz does this work?
yes.. ty @gxenos
@gxenos thanks
declanpaz sends brownie points to @gxenos :sparkles: :thumbsup: :sparkles:
:star: 246 | @gxenos | http://www.freecodecamp.com/gxenos
@declanPaz do you understand how it works though?
not entirely, i understand the * works as a "get all"
but i thought all children of parents would inherit every trait of the class assigned to the parent
@declanPaz basicly you apply the styles to all the children elements of the div
var lat;
var long;
if(navigator.geolocation){
navigator.geolocation.getCurrentPosition(function(position){
lat=position.coords.latitude;
long=position.coords.longitude;
});
}
$("#temperature").html(lat+" and " + long);
I get undefined and undefined as result...
@Swoozeki i have no idea what the if does exactly but if the if is false the variables never get defined
@Swoozeki try giving them a value when you define them,before the if statement to check it out
@gxenos if I assign lat and long=0, the end result will be 0 and 0
var lat=0;
var long=0;
if(navigator.geolocation){
navigator.geolocation.getCurrentPosition(function(position){
lat=position.coords.latitude;
long=position.coords.longitude;
$("#temperature").html(lat+" and " + long);
});
}
However, I'm unable to use lat and long outside of the function
Hey guys tomorrow I'll create my portfolio project ^^ so I created a small HTML/CSS made logo to warming-up, take a look ^^
http://codepen.io/AnnasLab/full/mVgGba/
http://codepen.io/AnnasLab/full/mVgGba/
Can someone explain to me why on my portfolio page I have lonely floater out of place:http://codepen.io/DivaWeb/pen/XXOdEX
@AnnasLab you should begin assigning ids or classes right away, and applying css for ids and classes instead of the elements as a whole
@Swoozeki thanks for the advice I'll do ^^
@DivaWeb Woah, your page takes forever to load. What's up with that?
@Swoozeki beats me because it loads right up for me
must be my old computer, sigh...
he just used a rather large img as background: https://static.pexels.com/photos/28325/pexels-photo.jpg
i would like to see how someone add FCC to their resume. i finished the frontend section and would liek to add it to my resume. an HR said it should be added to my resume
please message me
@Swoozeki check the pm i sent you
@Swoozeki sorry can you help me with my problem:(
@DivaWeb it is in a new row -fluid in a row-fluid
Anyone willing to critique my weather app? It takes too long to load the data for my taste. I think it's because of the callback function hell I wrote. I can't think of a way to streamline it or even a different way to write it. Apparently you can't return data from asynchronous functions? So my code looks like a mess. Not sure how to fix it. Appreciate any ideas! Weather app
@DivaWeb did you fix it?
@disjfa thank you for your help but I am not understanding what you are saying
divaweb sends brownie points to @disjfa :sparkles: :thumbsup: :sparkles:
:star: 83 | @disjfa | http://www.freecodecamp.com/disjfa
@gxenos no I have not fixed it yet still racking the marbles in my head lol
@Swoozeki is this the proper way to implement the logo in code or there's a smarter way (best practice) I used an ID instead of Class because there just single logo in the page, thanks
http://codepen.io/AnnasLab/full/mVgGba/
http://codepen.io/AnnasLab/full/mVgGba/
annaslab sends brownie points to @swoozeki :sparkles: :thumbsup: :sparkles:
:star: 289 | @swoozeki | http://www.freecodecamp.com/swoozeki
@DivaWeb remove the </div><div id="row2"..> and click tidy on top so you can see your code more correct
Anyone willing to critique my weather app? It takes too long to load the data for my taste. I think it's because of the callback function hell I wrote. I can't think of a way to streamline it or even a different way to write it. Apparently you can't return data from asynchronous functions? So my code looks like a mess. Not sure how to fix it. Appreciate any ideas! Weather app
@chumswap Woah, it's amazing! I just started the weather app as well, and maybe just finally starting to get the gist of JSON. But that seems like the only way to do it so far
@chumswap instead of all that addClass and removeClass, try toggleClass to shorten
nice weather app looks great very simplistic i like @Swoozeki
@Swoozeki I will look into toggleClass but I think the bigger issue is the getting the data. Thanks. :)
chumswap sends brownie points to @swoozeki :sparkles: :thumbsup: :sparkles:
:star: 290 | @swoozeki | http://www.freecodecamp.com/swoozeki
@caleb272 That's @chumswap , my friend
o ok sorry
but it looks good
@chumswap your weather app looks very simplistic which is good
how long have you guys been on this site
I have been here for a month now
New Server Live
Report any "Oops" messages here, please.
I started in December. I put anywhere from 1 to 18 hours a week into it.
nice i learned of this site about a month ago and i did like 3 hours a day in Jan but i just started 3 days ago this site is the best
@Swoozeki how far along are you?
and i mean 3 hours on one of the days not each day
i heard it on the changelog podcast this week, so couple of hours now :+1:
I agree I think this has been the best free resource I have found. I did a bunch on Odin Project first but then switched to FCC.
ya i have been programming for 3 years but i needed to learn front and back end stuff so this is where i came
definitely the best website I've come across in my whole search
I'm currently doing the weather project @caleb272
I have kind of put 60% of my eggs in FCC, so I do this very often
ya are you in the states?
well, in web development, I mean
Canada
nice ya i have put all my web dev eggs in FCC too i stayed up all night doing last night
do you have stuff on your git
im having a hard time addin FCC to my resume....god
why is that^
I have a private repo, but that's dedicated for school project _(ツ)_/¯
@incognitonerd what's up?
Same i need to really start working on some opensource projects te build my resume
i need an example of addin online courses to a resume
@Swoozeki i need an example of addin online courses to a resume