var sound = new Audio('your audio url');
sound.play();
@sharkantropo are you using JSON-P Dunno. @Dirtier https://codepen.io/Sharkantropo/full/GjQjoj/
sharkantropo sends brownie points to @jdtdesigns and @walidashri :sparkles: :thumbsup: :sparkles:
:cookie: 336 | @walidashri |http://www.freecodecamp.com/walidashri
:cookie: 676 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
walidashri sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 677 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
dhuddleston sends brownie points to @walidashri :sparkles: :thumbsup: :sparkles:
:cookie: 337 | @walidashri |http://www.freecodecamp.com/walidashri
:warning: dhuddleston already gave walidashri points
dhuddleston sends brownie points to @walidashri :sparkles: :thumbsup: :sparkles:
Hi, could anybody help?
function whatIsInAName(collection, source) {
var arr = [];
var i;
var prop;
var p1;
for(i=0; i<collection.length; i++){
for(prop in collection[i]){}
for(p1 in source){}
//console.log(collection[i][prop])
console.log(prop)// it should show a b c d, why only show a b d?
if(collection[i].hasOwnProperty(p1)===true&&source[p1]===collection[i][prop]){
arr.push(collection[i])
}
}
return arr;
}
whatIsInAName([{ "a": 1 }, { "b": 2 }, { "c": 3, "d": 4 }], { "a": 1 })
/*
whatIsInAName([{ first: "Romeo", last: "Montague" }, { first: "Mercutio", last: null }, { first: "Tybalt", last: "Capulet" }], { last: "Capulet" }) should return [{ first: "Tybalt", last: "Capulet" }].
whatIsInAName([{ "a": 1 }, { "a": 1 }, { "a": 1, "b": 2 }], { "a": 1 }) should return [{ "a": 1 }, { "a": 1 }, { "a": 1, "b": 2 }].
whatIsInAName([{ "a": 1, "b": 2 }, { "a": 1 }, { "a": 1, "b": 2, "c": 2 }], { "a": 1, "b": 2 }) should return [{ "a": 1, "b": 2 }, { "a": 1, "b": 2, "c": 2 }].
whatIsInAName([{ "a": 1, "b": 2 }, { "a": 1 }, { "a": 1, "b": 2, "c": 2 }], { "a": 1, "c": 2 }) should return [{ "a": 1, "b": 2, "c": 2 }].
*/
console.log(prop)// it should show a b c d, why only show a b d?
for(prop in collection[i]) {}
on purpose? Because there is no code inside this loop
&&source[p1]===collection[i][prop])
prop in collection[i]
times?
console.log(prop)// it should show a b c d, why only show a b d?
for(prop in collection[i])
for(p1 in source)
console.log(prop)
it will work
{}
after it the next statement will be called [for]times
function whatIsInAName(collection, source) {
var arr = [];
var i;
var prop;
var p1;
for(i=0; i<collection.length; i++){
for(prop in collection[i])
for(p1 in source)
console.log(prop)// it should show a b c d, why only show a b d?
if(collection[i].hasOwnProperty(p1)===true&&source[p1]===collection[i][prop]){
arr.push(collection[i])
}
}
return arr;
}
whatIsInAName([{ "a": 1 }, { "b": 2 }, { "c": 3, "d": 4 }], { "a": 1 })
c0d0er sends brownie points to @otto-aa :sparkles: :thumbsup: :sparkles:
:cookie: 265 | @otto-aa |http://www.freecodecamp.com/otto-aa
for(var i = 0; i < collection[i]; i++){
for(p1 in source){
if(collection[i].includes(p1))
arr.push(collection[i]
}
}
:cookie: 249 | @dirtier |http://www.freecodecamp.com/dirtier
c0d0er sends brownie points to @dirtier :sparkles: :thumbsup: :sparkles:
for (var i = 0; i < 2; i++) {
console.log('inside_1');
}
console.log('outside_1');
for (var i = 0; i < 2; i++)
console.log('inside_2');
console.log('outside_2');
// Output: inside_1 inside_1 outside_1 inside_2 inside_2 outside_2
c0d0er sends brownie points to @silver537 :sparkles: :thumbsup: :sparkles:
:cookie: 602 | @silver537 |http://www.freecodecamp.com/silver537
c0d0er sends brownie points to @otto-aa :sparkles: :thumbsup: :sparkles:
:warning: c0d0er already gave otto-aa points
navigator.geolocation.getCurrentPosition
but it doesn't work.
./css/jquery.bxslider.css
@BeerDRinker and check if it works
beerdrinker sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 598 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
$(document).ready(function(){
var secondsDwn = 10;
var minsDwn;
function interval(i) {
document.getElementById('secsDisplay').textContent = i;
setInterval(function() {
var getDoc = document.getElementById('secsDisplay');
getDoc.textContent = i;
i--;
if (i === -1) {
i = secondsDwn;
}
return interval(i);
}, 1000)
}
interval(secondsDwn);
});
it seems that this code breaks down after the second run through. Anyone know why it works well the first run through but not the second?
parleydk sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1436 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
@AmitP88
@parleydk so does FCC really focus on real world projects? and are doing the courses/tutorials really necessary to get the certifications, or can we just tackle the projects themselves headon?
The force flows through all living beings. It is what makes universe works. Look deep within your feelings and you will most certainly know the right answer. :)
sides
in and of itself. Side is determined by the intentions of the force user ;) In that, what you want to use the force for ;)
amitp88 sends brownie points to @kat-mag :sparkles: :thumbsup: :sparkles:
:cookie: 341 | @kat-mag |http://www.freecodecamp.com/kat-mag
I'll be honest @AmitP88
There will be millions of debates on efficiency. None of them will be applicable to you. (and neither for me). Those are just points of view of those who come up with it and will be applicable only to their own lives.
The most efficient way for YOU will be to do what "feels" right. Things usually sound so seductive logically that people tend to go through the motions of doing things and be under the illusion of productivity.
If you're not enjoying it, you won't get it done in your entire lifetime.
amitp88 sends brownie points to @adityaparab :sparkles: :thumbsup: :sparkles:
:cookie: 699 | @adityaparab |http://www.freecodecamp.com/adityaparab
@AmitP88 :You're welcome mate! :)
I'd suggest you go with React as of now.
@AmitP88 As you said, your time is limited, so must use it efficiently. I feel that you need to learn more, so the question is how. FCC has been a great answer for me and many other people around.
But it's up to you to take on the challenge and give it your own personal meaning. One way of looking at it is as a 'path' towards < your vision >
What is cool about FCC is that it alows you to work on your projects at your own pace. No pressure, no money involved. And to solve those projects, you'll naturally Have to explore a lot on your own. It's a self-discovery jurney. You'll learn a lot by doing those little projects one by one.
After a while, you'll feel much confident about your ability, and you'll have nicer and nicer things to show. Even if small or imperfect, you need to feel proud about them.
Then it will be much easier to talk to potential employers (in fact I'm in the process of doing I do now)
@AmitP88 : Another advice is - Throw away that outdated notion of Ready-Aim-Fire
(RAF)
Just follow Ready-Fire-Aim
. (RFA)
Surprisingly, the lower impact things (shooting a gun) need RAF approach. If you take a look at all the high impact things like Rockets that carry sattelites, nukes, explosives etc they follow RFA approach
body{
margin:0;
padding:0;
}
joshuaswift sends brownie points to @kat-mag and @adityaparab :sparkles: :thumbsup: :sparkles:
:cookie: 342 | @kat-mag |http://www.freecodecamp.com/kat-mag
:cookie: 700 | @adityaparab |http://www.freecodecamp.com/adityaparab
@AmitP88 Ok, you may work on this 'app' if you wish to do so. Just make sure it shows the right things about your, idealy one of your passion. If you make it about chemistry and atoms, might not look good, imo.
You may want to focus on your future new life. Sure, except if chemistry is truly one of your passions
passion
:D
amitp88 sends brownie points to @adityaparab :sparkles: :thumbsup: :sparkles:
:warning: amitp88 already gave adityaparab points
amitp88 sends brownie points to @kat-mag :sparkles: :thumbsup: :sparkles:
:cookie: 343 | @kat-mag |http://www.freecodecamp.com/kat-mag
amitp88 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 678 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
sharkevan sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 679 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
click
handler on .icon
so when ever you click on input
it is replacing contents inside .icon
with again <input type="text">
so you can add below code to avoid it and get the behaviour you want$('.icon i').on('click',function(){
$(this).parent().html('<input type="text">');
});
ajayt365 sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 599 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
head
and add it in CSS tab below your font-awesome
link, then the font in rendered HTML seems to work
head
in my answer refers to Stuff for <head>
in HTML tab of setting :wink:
head
-> Stuff for <head>
also its working but you need to have rel
attribute on link <link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
W
in button and check as W
differs in Raleway
font
function (board) {
if (board[0] == board[1] && board[1] == board[2]) {
return board[0];
}
else if (board[3] == board[4] && board[4] == board[5]) {
return board[3];
}
else if ...
}
// repeat for other combos
// this could be return for
return board.indexOf("") == -1 ? "draw" : "";
}
mikail1998 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 3732 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
debugger
statements, setup some breakpoints and step through your code line by line and find whats missing . If you dont know how to debug code in chrome search in google you will find many videos and articles.
<script>
$(document).ready(function() {
var html = "http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1";
$("#getMessage").on("click", function(){
// Only change code below this line.
// $(".message").html("Here is the message");// Only change code above this line.
$(".message").html(html);
});
});
</script>
$.getJSON()
.
mikail1998 sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 600 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
script
tags)to JS Panel of your codepen . And if your new to codepen read this article to learn how to codepen https://medium.freecodecamp.com/codepen-tips-and-best-practice-cf926ebd0b11
daytonpe sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 601 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
@daytonpe sorry i did not understand your above question
but you need to make a call to API to get quotes like
$.getJSON("http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&callback=", function(response) {
console.log(response);
});
After executing above line you will see a response in chrome/browser console.
function(response) {
console.log(response);
}
The above part is called callback
we are telling $.getJSON
to call this callback
function after it receives a response from API as AJAX calls are Asynchronous i.e may take a while to complete
daytonpe sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:warning: daytonpe already gave vinaypuppal points
@daytonpe more precisely like this
$("#getMessage").on("click", function(){
// Only change code below this line.
// $(".message").html("Here is the message");// Only change code above this line.
$.getJSON("http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&callback=", function(response) {
console.log(response);
$(".message").html(response[0].content);
});
});
response
is an Array
so you can access your quote like response[0].content
you will get idea how to access required data from response once you see the console.log
of response
and if you want to learn more about AJAX follow this course https://www.udacity.com/course/intro-to-ajax--ud110
@vinaypuppal When i put this in, I get: XMLHttpRequest cannot load http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&callback=. The 'Access-Control-Allow-Origin' header has a value 'http://null' that is not equal to the supplied origin. Origin 'null' is therefore not allowed access.
Googled it and it got pretty complicated very quickly.
<!DOCTYPE html>
<html>
<head>
<title>Random Quote Generator</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<link rel="stylesheet" href="stylesheet.css" type="text/css" />
</head>
<body>
<script>
$(document).ready(function() {
$("#getMessage").on("click", function(){
$.getJSON("http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&callback=", function(response) {
console.log(response);
$(".message").html(response[0].content);
});
});
});
</script>
<div class="container-fluid">
<div class = "row text-center">
<h2>Random Quote Generator</h2>
</div>
<div class = "row text-center">
<div class = "col-xs-12 well message">
The message will go here
</div>
</div>
<div class = "row text-center">
<div class = "col-xs-12">
<button id = "getMessage" class = "btn btn-primary">
Get Message
</button>
</div>
</div>
</body>
</html>
null
if i open your code locally in my browser. Still finding what's happening
?
after callback=
in AJAX URL and need to run a local server since CORS does not work over normal file
opening in browser as i read in this. http://stackoverflow.com/questions/3595515/xmlhttprequest-error-origin-null-is-not-allowed-by-access-control-allow-origin
callback=
in URL makes it JSONP call but he is opening html file directly in browser so CORS is not working
daytonpe sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:warning: daytonpe already gave vinaypuppal points
daytonpe sends brownie points to @homerrowsky :sparkles: :thumbsup: :sparkles:
:cookie: 277 | @homerrowsky |http://www.freecodecamp.com/homerrowsky
map
is index
[1,22,3].map(function(item,index){
console.log('item: ', item);
console.log('index: ', index);
});
daytonpe sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:warning: daytonpe already gave vinaypuppal points
<div class "quotes">
=
like <div class="quotes">
mrjkmullen sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 602 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
something=
at end of URL instead of callback=
. But still did not understood why , one more thing i noticed if I add something=?
its not working @jdtdesigns @sjames1958gm
something=JSON_CALLBACK
would work
<script>
$(document).ready(function() {
$("#getMessage").on("click", function(){
$.getJSON("http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&something=JSON_CALLBACK", function(response) {
console.log(response);
$(".message").html(response[0].content);
});
});
});
</script>
<!DOCTYPE html>
<html>
<head>
<title>Random Quote Generator</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<link rel="stylesheet" href="stylesheet.css" type="text/css" />
</head>
<body>
<script>
$(document).ready(function() {
$("#getMessage").on("click", function(){
$.getJSON("http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&something=JSON_CALLBACK", function(response) {
console.log(response);
$(".message").html(response[0].content);
});
});
});
</script>
<div class="container-fluid">
<div class = "row text-center">
<h2>Random Quote Generator</h2>
</div>
<div class = "row text-center">
<div class = "col-xs-12 well message">
The message will go here
</div>
</div>
<div class = "row text-center">
<div class = "col-xs-12">
<button id = "getMessage" class = "btn btn-primary">
Get Message
</button>
</div>
</div>
</body>
</html>
http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&something=JSON_CALLBACK
and used pushstate-server to serve files using a localhost
200
with no error as we got previously,
$.getJSON("http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&callback=",
function(response) {
$(".message").html(response[0].content);
});
&something=something
it will work , i mean something
can any word as long as browser thinks its unique/different from previous failed call
daytonpe sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 680 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
txsrangers sends brownie points to @eweiss17 :sparkles: :thumbsup: :sparkles:
:cookie: 331 | @eweiss17 |http://www.freecodecamp.com/eweiss17
eweiss17 sends brownie points to @txsrangers :sparkles: :thumbsup: :sparkles:
:cookie: 304 | @txsrangers |http://www.freecodecamp.com/txsrangers
file://
.null
but from above section you can you got response from API correctly. But browser thinks request is made from unknown server and rejects its with the error you got previously, so when localhost
is used it works perfectly because browsers think localhost
as valid origin
host.
$(document).ready(function){
it should be $(document).ready(function(){
andfunction(getquote){
this should be like this function getquote(){
$(document).ready(function)(){
look this $(document).ready(function(){
$(document).ready(function)/*<-- here it should not be there*/(){
:first-letter
is not animatable as some elements in CSS are only animatable so i added a span around first letter of you quote and tried the animation worked <p class="quote"> <span>T</span>esting some text here</p>
.quote span{
animation-name: changesize;
animation-duration: 3s;
animation-timing-function: ease-in-out;
}
@keyframes changesize {
0% {
font-size: 2em;
color: black;
}
100% {
font-size: 4em;
color: red;
}
}
dsilvadeepal sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 603 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
firstletter
of quote using some JS String/Array [like Capitalise string exercise in FCC JS Challenges] functions and append quote to html.
New Quote
button click.
mayurpande sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 604 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
allanpooley sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 605 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
allanpooley sends brownie points to @kat-mag :sparkles: :thumbsup: :sparkles:
:cookie: 349 | @kat-mag |http://www.freecodecamp.com/kat-mag
<div class="row">
<div class="col-md-6 col-sm-12 col-xs-12">
<img class="img-responsive img-thumbnail" src="http://vignette2.wikia.nocookie.net/firstlaw/images/d/d0/LogenNinefingers-GraphicNovel.png/revision/latest/scale-to-width-down/270?cb=20160523165747" alt="Logen Ninefingers - a long-haired, beaten man, covered in robes kneels in the snow." />
</div>
<div class="col-md-6 col-sm-12 col-xs-12">
<blockquote>
<p>"Once you've got a task to do, it's better to do it than live with the fear of it."</p>
<footer>Logen Ninefingers in <cite title="Source Title">The Blade Itself</cite></footer>
</blockquote>
</div>
</div>
allanpooley sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:warning: allanpooley already gave vinaypuppal points
tmmggmmdld sends brownie points to @kat-mag :sparkles: :thumbsup: :sparkles:
:cookie: 350 | @kat-mag |http://www.freecodecamp.com/kat-mag
sayrah901 sends brownie points to @kat-mag :sparkles: :thumbsup: :sparkles:
:cookie: 351 | @kat-mag |http://www.freecodecamp.com/kat-mag
.center-block
too, as far as I remember... again not a bootstrap fan
<div class="col-md-12 col-sm-12 col-xs-12 text-center">
allanpooley sends brownie points to @kat-mag and @sayrah901 :sparkles: :thumbsup: :sparkles:
:warning: allanpooley already gave kat-mag points
:cookie: 265 | @sayrah901 |http://www.freecodecamp.com/sayrah901
em
s. It'd be responsive enough I suppose