Hello, I have a problem with the challenge "Wherefore art thou". It works only when 'source' has one key but not when it has more than that. I've tried using a loop to go through the keys but is not working. My code:
function whatIsInAName(collection, source) {
// What's in a name?
var arr = [];
// Only change code below this line
var target = Object.keys(source);
var key = target[0]; //key = source's key argument
for(var i = 0; i < collection.length; i++){
if(collection[i][key] === source[key]){
arr.push(collection[i]);
}
}
// Only change code above this line
return arr;
}
whatIsInAName([{ "a": 1, "b": 2 }, { "a": 1 }, { "a": 1, "b": 2, "c": 2 }], { "a": 1, "b": 2 });
@OlooAllaN
hello freecodecamp having some small issues with my modal every time I close my modal the backdrop does not leave with the modal. I tried $('.modal).modal('hide') but it removes the modal within two seconds. I tried putting a listener for the close button to remove the backdrop when a user clicks the button, but its not working. Any suggestion for why the back drop is not leaving when I close the modal?
https://codepen.io/OA11an/pen/XeejzO?editors=1010
hello freecodecamp having some small issues with my modal every time I close my modal the backdrop does not leave with the modal. I tried $('.modal).modal('hide') but it removes the modal within two seconds. I tried putting a listener for the close button to remove the backdrop when a user clicks the button, but its not working. Any suggestion for why the back drop is not leaving when I close the modal?
https://codepen.io/OA11an/pen/XeejzO?editors=1010
Hmm. can anyone guide me how do we link wikipedia to our search query? Cause I don't really get what I must do with wiki JSON data, I read through the documentation but not sure what I should be looking for
@wheelhot you can use this:
https://en.wikipedia.org/w/api.php?action=query&format=json&list=search&utf8=1&srsearch=' + searchTerm + '&srwhat=text&srinfo=totalhits&srprop=titlesnippet%7Csnippet
searchTerm is the variable that holds your search string
@OlooAllaN if you want an element to hide after an action you could use the method that changes the CSS directly after an action: $("element to hide").style.display = "none"
@AlexxMart
$("element to hide")[0].style.display = "none" or $("element to hide").hide()
@OlooAllaN your close button isn't working correctly because there's an extra closing </div> before it
you'll also need to add id="myModal" to your modal
<div class="modal fade" id="myModal">
Change the first HTML line of your modal to that ^ and remove the extra closing </div> on line 68. It will work fine
whats wrong with my while loop?
function sumAll(arr) {
var total = arr.reduce(function(sum, value) {
var i=0;
while (i < value) {
i++;
return i + sum;
}
});
return total;
}
sumAll([1, 4]);
@adamfaraj That while loop doesn't belong inside of
.reduce() - and return inside a while loop makes the loop exit immediately
@piteto hmm. ok
i'm trying to solve this problem
We'll pass you an array of two numbers. Return the sum of those two numbers and all numbers between them.
@adamfaraj A good starting point is to try and loop from the smallest number in that array to the biggest number (1, 2, 3, 4)
you can add those up along the way (1 + 2 + 3 + 4)
function sumAll(arr) {
var min = Math.min(...arr);
var max = Math.max(...arr);
}
sumAll([1, 4]);
@piteto a for loop?
A for loop is a great way to do that, yes
i wanna avoid for loops. haha
you could also use a while loop
or Array.from() with a .reduce() since I see you using ES6 spread operators
function sumAll(arr) {
var min = Math.min(...arr);
var max = Math.max(...arr);
var i = 0;
while (i < max) {
i++;
}
}
sumAll([1, 4]);
@piteto so i'm iterating until i get to the max
how do i get those individual numbers?
1, 2, 3, 4?
and add them up
haha
damn it
nvm, got it
@adamfaraj
function sumAll(arr) {
var min = Math.min(...arr);
var max = Math.max(...arr);
var array = [];
array.push(min);
while (min < max) {
min++;
array.push(min);
}
return array.reduce((sum, value) =>
sum + value );
}
sumAll([5, 10]);this worked
good morning everyone! :sun_with_face:
@adamfaraj sorry had to step away - good job figuring it out. It's a little simpler without pushing everything to an array and reducing:
function sumAll(arr) {
var min = Math.min(...arr),
var max = Math.max(...arr);
var sum = 0;
while (min <= max) {
sum += min++;
}
return sum;
}
sumAll([1, 4]);
@piteto dang. so simple
and clean
@adamfaraj You can use the same approach for factorialize a number, only multiplying instead of adding
I see you used fancy recursion for that one though :p
hello all
Hey, why my keypress event listener not working: https://jsfiddle.net/9smequvf/1/ ?
@h1tag
$(function(){
window.addEventListener("keypress", doKeyDown);
})();
for an IIFE, need that final
Another way to do it could be:
()Another way to do it could be:
$(init);
function init() {
window.addEventListener("keypress", doKeyDown);
}
any css pros in here?
yes, there are CSS pros here @cyberpunk1971
@piteto it's not an IIFE, it's a shorthand for document.ready
@piteto i'm trying to get my nav bar to layout the list items horizontally. But i'm not sure how. I am using a grid system in my css
do I target the nav element? or the ul element?
@h1tag The recommended way is
$( handler ), but your code does work if you add the () after
@cyberpunk1971 Which grid system are you using?
w3schools
you'll want to target the nav > ul element typically so it doesn't affect every other list on your page
it's still not working for me @piteto
or the second code example with $( handler): https://jsfiddle.net/9smequvf/3/
@piteto ok thx
cyberpunk1971 sends brownie points to @piteto :sparkles: :thumbsup: :sparkles:
:cookie: 223 | @piteto |http://www.freecodecamp.com/piteto
@cyberpunk1971 w3.css has its own navbar code at: https://www.w3schools.com/css/css_navbar.asp
I would use
nav ul though just to be a little more specific and to prevent affecting other <ul> elements on your page later on
@piteto oh, it seems that the if statements arent triggering
hmmm, I ddin't think to look at your code more closely :p
You're right
I'll try to debug
@h1tag It works if I use caps lock :)
Those are the keycodes for capital letters
@piteto it's still the same for me
I got the codes from here: http://help.adobe.com/en_US/AS2LCR/Flash_10.0/help.html?content=00000520.html
Maybe try e.which in case it's your browser? jQuery handles all the different browser implementations with e.which. If that doesn't work, replace 'keypress' with 'keyup'
(or 'keydown' if you want repeating keys)
@piteto no luck :/
This is really odd...now it works for me with lower-case and upper-case: https://jsfiddle.net/9smequvf/4/
I might need to read more about e.which
@piteto yea, your version is working :)
I wish I could explain why lol
even without that IIFE-type syntax
I learned vanillaJS first, then tried to piece together jQuery and a lot of it is still a mystery to me
I think that's better, than learning jquery first
@piteto thank you for taking the time :)
h1tag sends brownie points to @piteto :sparkles: :thumbsup: :sparkles:
:cookie: 224 | @piteto |http://www.freecodecamp.com/piteto
Good luck with the rest - nice beats :)
Thank you
@piteto
```
var states = document.getElementById('state');
var approach = document.getElementById('approach');
[states, approach].forEach(el => el.addEventListener('change', filterCards));
```
var states = document.getElementById('state');
var approach = document.getElementById('approach');
[states, approach].forEach(el => el.addEventListener('change', filterCards));
function filterCards() {
var filterState = states.value;
var filterApproach = approach.value;
/*var selector = this.id == "approach" ? '.space-approach' : '.space-state'; */
var card = $(el).closest('.card-parent');
var titleState = document.getElementsByClassName('space-state');
var titleApproach = document.getElementsByClassName('space-approach');
if(filterState == "All States"){
for (i = 0; i < card.length; i += 1) {
titleApproach[i].includes(titleApproach){
card.show();
} else{
card.hide();
}
return;
}
} else if (filterApproach == "All Learning Methods"){
for (i = 0; i < card.length; i += 1) {
titleState[i].includes(titleState){
card.show();
} else{
card.hide();
}
return;
}
} else{
for (i = 0; i < card.length; i += 1) {
if(titleState[i].includes(filterState) && titleApproach[i].includes(titleApproach)){
card.show();
} else{
card.hide();
}
return;
}
}
@piteto the code doesnt seem to work. could you guide me on whats wrong with it
@piteto
I'm writing new code. please ignore the top one
@piteto
please look at this code
var states = document.getElementById('state');
var approach = document.getElementById('approach');
[states,approach].addEventListener('change', filterCards);
function filterCards() {
console.log(states.value);
console.log(approach.value);
var filterState = states.value;
var filterApproach = approach.value;
/*var selector = this.id == "approach" ? '.space-approach' : '.space-state'; */
var card = document.getElementsByClassName('card-parent');
var state = document.getElementsByClassName('space-state');
var titleState = Array.from(state);
console.log(titleApproach);
var approach = document.getElementsByClassName('space-approach');
var titleApproach = Array.from(approach);
if(filterState == "All States"){
for (i = 0; i < card.length; i += 1) {
if(titleApproach[i].includes(filterApproach)){
parentnode.parentnode.parentnode.show();
} else{
parentnode.parentnode.parentnode.card.hide();
}
return;
}
}
else if(filterState == "All Learning Methods"){
for (i = 0; i < card.length; i += 1) {
if(titleState[i].includes(filterState)){
parentnode.parentnode.parentnode.card.show();
} else{
parentnode.parentnode.parentnode.card.hide();
}
return;
}
}
else{
for (i = 0; i < card.length; i += 1) {
if(titleState[i].includes(filterState) && titleApproach[i].includes(titleApproach)){
parentnode.parentnode.parentnode.card.show();
} else{
parentnode.parentnode.parentnode.card.hide();
}
return;
}
}
}
@piteto the event listener doesnt get added when i do [states,approach].addEventlistener
@piteto Dont know how to add eventlistener to both of them and call the function with both values available
@piteto wrote this but unable get the function to run with both values available also the code is a mess please guide
var states = document.getElementById('state');
var approach = document.getElementById('approach');
var filterState = states.value;
var filterApproach = approach.value;
var card = document.getElementsByClassName('card-parent');
var statenode = document.getElementsByClassName('space-state');
var titleState = Array.from(statenode);
var approachnode = document.getElementsByClassName('space-approach');
var titleApproach = Array.from(approachnode);
states.addEventListener('change', filterCards);
function filterCards() {
/*var filterState = states.value;
var filterApproach = approach.value; */
/*var selector = this.id == "approach" ? '.space-approach' : '.space-state'; */
if(filterState == "All States" && filterApproach == "All Learning Methods"){
$('.card-parent').show();
return;
}
else if (filterState == "All States"){
for (i = 0; i < card.length; i ++) {
if(titleApproach[i].innerHtml.includes("filterApproach")){
parentnode.parentnode.parentnode.show();
} else{
parentnode.parentnode.parentnode.hide();
}
return;
}
}
else if(filterState == "All Learning Methods"){
for (i = 0; i < card.length; i ++) {
if(titleState[i].innerHtml.includes("filterState")){
parentnode.parentnode.parentnode.show();
} else{
parentnode.parentnode.parentnode.hide();
}
return;
}
}
else{
for (i = 0; i < card.length; i += 1) {
if(titleState[i].innerHtml.includes(filterState) && titleApproach[i].innerHtml.includes(titleApproach)){
parentnode.parentnode.parentnode.show();
} else{
parentnode.parentnode.parentnode.hide();
}
return;
}
}
}@piteto i was able to do that by doing
var all = [states,approach]
and then doing
all.addEvenlist......
@piteto sorry for sending out a lot. i didnt want you to look at the issue unnecessarly after i managed to fix it
@piteto everything worked I managed to get both dropdowns to work, thanks for pushing me to do it own my own. I learned a lot in the process
alteducation sends brownie points to @piteto :sparkles: :thumbsup: :sparkles:
:cookie: 226 | @piteto |http://www.freecodecamp.com/piteto
function generate(num,arr)
{
if (num===1){
permutations.push(arr.join(''));
}
else{
for (var i=0;i<num-1;i+=1){
generate(num-1,arr);
if(num%2==0){
swap(i,num-1);
}
else{
swap(0,num-1);
}
}
}
}
generate(arr.length,arr);
can someone help me figure out why this isn't worknig
im on heaps algorithm
it only gives me one permutation-
@CyberPutty I see here that you have called the generate method inside foreach at the very beginning, it will not let the if condition execute ever
@CyberPutty try to put the generate function call below the if, else statement and then try
procedure generate(n : integer, A : array of any):
if n = 1 then
output(A)
else
for i := 0; i < n - 1; i += 1 do
generate(n - 1, A)
if n is even then
swap(A[i], A[n-1])
else
swap(A[0], A[n-1])
end if
end for
generate(n - 1, A)
end if
@bvipul its supposed to call itself and output permutations
@CyberPutty 'n' here is the length of array, right ??
yes n number of elements
sorry @CyberPutty but I stand by my point, you calling the generate method, at the very beginning of loop makes it never go below that point while executing the program. I would suggest you to take pen and a note and start shadowing what your program does for a particular input, you will get a better idea
@bvipul It will make it below that point because at some point the recursive calls reach
n = 1 and bubbles up again
@CyberPutty @alpox but if n reaches 1, it will go into your if(n == 1) condition and it will call output() function..
@bvipul https://en.wikipedia.org/wiki/Heap%27s_algorithm i do not think that wikipedia is so wrong about it ;-)
@bvipul It just outputs every permutation in
output
For each call to
generate, when n=1 is reached, a new permutation is printed
<div class="weather-icon"></div>
function getWeather() {
$.ajax({
headers: {
Accept: "application/json",
},
url: "https://fcc-weather-api.glitch.me/api/current?lat=35&lon=139",
success: function(generate) {
$(".weather-icon").text(generate.weather[0].icon);
}
});}
$(document).ready(function () {
getWeather();
});
Output: "https://cdn.glitch.com/6e8889e5-7a72-48f0-a061-863548450de5%2F01n.png?1499366020783"
How can I get image from this link? Any one help me!
@Shaikot007 what do you mean get?
I want image icon
right-click -> Download?
nop
Where can I find a list of all the inline Javascript event handlers (onchange, onclick, onmouseover, onmouseout, onkeydown, onload, etc.)?
@aguyinmontreal https://www.w3schools.com/tags/ref_eventattributes.asp
instead of placing on a
using jquery u can use
text put it on a image src and the image will be displayed @Shaikot007using jquery u can use
attr method to change programmatically the src attribute
whats up guys, could you try my calc and see if you cand find some bugs for me to fix? :)
https://codepen.io/iangracia/full/jGZQgN/
https://codepen.io/iangracia/full/jGZQgN/
@CyberPutty Thanks a lot!
aguyinmontreal sends brownie points to @cyberputty :sparkles: :thumbsup: :sparkles:
:cookie: 293 | @cyberputty |http://www.freecodecamp.com/cyberputty
Guys, your thoughts on my last website : http://bit.ly/2fVRlwT
Thanks @moigithub
@mradil16 wow looks super nice
@alteducation congrats on getting it working!
@piteto
function filterCards() {
var card = document.getElementsByClassName('card-parent');
var statenode = document.getElementsByClassName('space-state');
var titleState = Array.from(statenode);
var approachnode = document.getElementsByClassName('space-approach');
var titleApproach = Array.from(approachnode);
var filterState = states.value;
var filterApproach = approach.value;
if(filterState == "All States" && filterApproach == "All Learning Methods"){
$('.card-parent').show();
return;
}
else if (filterState == "All States" && filterApproach !== "All Learning Methods"){
for (i = 0; i < card.length; i++) {
titleApproach[i].innerText.includes(filterApproach) ? card[i].style.display = "inline-block" : card[i].style.display = "none";
}
return;
}
else if (filterApproach == "All Learning Methods" && filterState !== "All States"){
for (i = 0; i < card.length; i++) {
titleState[i].innerText.includes(filterState) ? card[i].style.display = "inline-block" : card[i].style.display = "none";
}
return;
}
else{
for (i = 0; i < card.length; i++) {
titleState[i].innerText.includes(filterState) && titleApproach[i].innerText.includes(filterApproach) ? card[i].style.display = "inline-block" : card[i].style.display = "none";
}
return;
}
}
var states = document.getElementById('state');
var approach = document.getElementById('approach');
[states,approach].forEach(function(item){
item.addEventListener('change', filterCards);
});this is the code that i wrote could you look at it and tell me how i can improve it. i feel like i used too many variables
@mradil16 professional looking design, good stuff
someone wanna help me with my calc design?
i got a prob with an element
if you calc any equation, then press equals, the keypad doesnt relocate under the orange box
even tho the element thats in the way is empty
Guys help needed
@Nightimer what's the problem?
trying to upload pic
sec
@Nightimer so what's the problem
How can i get this
left column is 1 lone text, top right is img
\and below img is text
@Nightimer Do you want to upload image from you pc?
I uploaded it on link
@Nightimer then?
@Nightimer Cleanest way would be grid but could also be done with float + flex / just flex
kbaig sends brownie points to @iangracia :sparkles: :thumbsup: :sparkles:
:cookie: 360 | @iangracia |http://www.freecodecamp.com/iangracia
@iangracia your float is messing with it so you would need a clearfix if you want to keep using float
kbaig sends brownie points to @iangracia :sparkles: :thumbsup: :sparkles:
api offline
Center is not a valid value for float btw
@Nightimer you can learn about flexbox in a kind of fun way with this app
@alteducation I'd try to use either all vanilla JS or all jQuery - pick one. Replace
innerText with textContent. If you want to reduce the list of vars at the top, remove filterState and filterApproach at the beginning and just use states.value and approach.value and then combine aproachnode and statenode into titleState and titleApproach.
var card = document.getElementsByClassName("card-parent");
var titleState = Array.from(document.getElementsByClassName("space-state"));
var titleApproach = Array.from(document.getElementsByClassName("space-approach"));"Design a cash register drawer function checkCashRegister() that accepts purchase price as the first argument (price), payment as the second argument (cash), and cash-in-drawer (cid) as the third argument.
cid is a 2D array listing available currency.
Return the string "Insufficient Funds" if cash-in-drawer is less than the change due. Return the string "Closed" if cash-in-drawer is equal to the change due.
Otherwise, return change in coin and bills, sorted in highest to lowest order."
Test:
checkCashRegister(19.50, 20.00, [["PENNY", 0.01], ["NICKEL", 0], ["DIME", 0], ["QUARTER", 0], ["ONE", 1.00], ["FIVE", 0], ["TEN", 0], ["TWENTY", 0], ["ONE HUNDRED", 0]]) should return "Insufficient Funds"Shouldn't the above test return 0.5?? and not "Insufficient Funds"
no
because you don't have the change for it
["PENNY", 0.01], ["NICKEL", 0], ["DIME", 0], ["QUARTER", 0],
I have 1.01 dollar, no?
you have a 1 dollar bill and a 1 cent coin
how do you give back 0.50 ?
okay
i understand
thanks @Gersho
iangracia sends brownie points to @gersho :sparkles: :thumbsup: :sparkles:
it is a cash register, not a bank account ;)
:cookie: 535 | @gersho |http://www.freecodecamp.com/gersho
Yeah, my fault in logic :)
the whole challenge got ALOT harder all of a sudden :laughing:
Hi. @mbosnjak01
Hi. Just a quick question about ng-repeat in Amgular JS, if anyone could answer me here (angularjs room isn't much active). Is it possible to repeat items from multiple scopes? (an array of scopes with indentical properties) ... for example <div ng-repeat ="item in arrayOfScopes"></div> ? - where array of scopes would be something like this: arrayOfScopes = [$scopeOne, $scopeTwo ... ] ? Is something like this possible?
I really don't want to have separate div element for each scope
Hi. Just a quick question about ng-repeat in Amgular JS, if anyone could answer me here (angularjs room isn't much active). Is it possible to repeat items from multiple scopes? (an array of scopes with indentical properties) ... for example <div ng-repeat ="item in arrayOfScopes"></div> ? - where array of scopes would be something like this: arrayOfScopes = [$scopeOne, $scopeTwo ... ] ? Is something like this possible?
I really don't want to have separate div element for each scope
@mbosnjak01 Can’t you make an object that has access to different properties?
…
$scope.object = {}
// later use
$scope.object.propertyOne;
$scope.object.propertyTwo;
instead of multiple scopes?
@leanjunio How would I implement that in a single div element?
I mean, is it possible ...
@mbosnjak01 I see what you mean now
@mbosnjak01 well, give it a try, create 2 arrays within a scope object, and then ng-repeat them both using 2 divs
Using 2 divs will work
But I was thinking of repeating both of them in a single div
oh, i see
what does ur html look like?
and what are you trying to feed into it?
users ... I have 2 api calls, first call get's 10 users in a scope, and second 5 users ... but my scope doesn't work properly when I do 2 calls on one scope ... so I was thinking of dinamically creating a scope (with indentical properties) on a single div, so I don't need to create multiple divs via html or js.
creating a scope for each api call
so if I could do something like ng-repeat="scope1 |scope2" would be great XD
if not, i'll have to go and create div for each scope :(
lol, doesn’t seem like that’s allowed https://docs.angularjs.org/api/ng/directive/ngRepeat
Do you have your code on Github?
can someone be able to give me some pointers on handling api with angularjs?
I don't know why it isn't working, help would be appreciated
what’s the endpoint you’re trying to hit?
you'll need to use HTTPS (and probably JSONP after that) for that API @Niloy513
angular.min.js:sourcemap:103 Mixed Content: The page at 'https://s.codepen.io/Niloy513/pen/VMQNmd?editors=1011' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://api.forismatic.com/api/1.0/?method=getQuote&format=json&lang=en'. This request has been blocked; the content must be served over HTTPS.
Also, your method, should be : ‘GET'
make a random quote appear using the variable $scope.quote I see I was confused about method because they say the method should be getQuote so it's odd. and piteto I'll try out what you advice.
@leanjunio thank you
@piteto Thank you
@leanjunio thank you
@piteto Thank you
niloy513 sends brownie points to @leanjunio and @piteto :sparkles: :thumbsup: :sparkles:
:cookie: 228 | @piteto |http://www.freecodecamp.com/piteto
:cookie: 288 | @leanjunio |http://www.freecodecamp.com/leanjunio
@Niloy513 what’s the url for the quote api?
how were you able to tell I needed https though
This request has been blocked; the content must be served over HTTPS.
I can't explain it well but that can, the url they have posted on the site doesn't work for some reason
niloy, it's a good idea to read about mixed-content. http is not secure, https is. When your web page is loaded over https everything else needs to use https too
(otherwise it's not secure)
I am not good with api yet unfortunately. may I ask how you were able to find the bug issues so quickly? I have my debugger on codepen.
@Niloy513 Have you had any experience reading about AJAX for JavaScript and how requests and responses work?
@Niloy513 That's a pretty common bug for people to get when they first start out with APIs - I know that's how I knew about it... @piteto just got to their answer first :)
@Niloy513 I used the browser's debugger instead of the one in codepen. The one in codepen only reports what you log with console.log. The one in the browser is for debugging errors.
I don't know angular well, or if this is the right way to do it, but this will get your quote logged to the console:
var app = angular.module("model", []);
app.controller("control", [
"$scope", "$http", function($scope, $http) {
$scope.newquote = () => {
$http.jsonp("https://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&lang=en&jsonp=showQuote")
};
}
]);
function showQuote(data) {
console.log(data);
}
I have but they don't make much sense if you have a link for a clear info of them I would love that. Thanks for the info and help as well guys.
@piteto I don't whether to be envious or jealous of you. I've been working on this for two days and you managed to get it in 10 minutes. Thank you very much for your wisdom.
niloy513 sends brownie points to @piteto :sparkles: :thumbsup: :sparkles:
api offline
I totally read the wrong part of this chat when I jumped in... ignore my last reply lol
@Niloy513 Totally man, here’s two links to AJAX requests (Basically what you’re trying to make earlier, you were trying to make a GET request to the quote person’s server), this is a great channel for all other stuff btw.
https://www.youtube.com/watch?v=h0ZUpPiV1ac&t=2s
and here’s the FCC vid for AJAX: https://www.youtube.com/watch?v=tHRNuBf_8xg
@Niloy513 Another nice on it seems, https://www.youtube.com/watch?v=ecT42O6I_WI
@leanjunio
@piteto thank you both very much for the videos and help, I need to leave now, life calls, I'll be sure to look at your videos that you recommended. You guys take care for now.
niloy513 sends brownie points to @piteto :sparkles: :thumbsup: :sparkles:
api offline
:sparkles: :thumbsup: :sparkles: