These are chat archives for FreeCodeCamp/HelpJavaScript

2nd
Sep 2017
Murrium
@Murrium123
Sep 02 2017 00:04
@piteto Was that helpful?
We are not graded on our algoriths
Long Nguyen
@longnt80
Sep 02 2017 00:16

@piteto

maybe I should add code comments to explain my thought process

no, there's no grading. But it can be helpful later on when you go back and see what you did.

piteto
@piteto
Sep 02 2017 01:40
Okay, good to know. Appreciate the help!
Roxroy
@roxroy
Sep 02 2017 02:17
@legendinraze , I see that you have added bootstrap.min.js, but you also need to add the css styles, bootstrap.min.css. Once you have the styles in place you will see the menu side by side
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 03:00
Why doesn't my background image fit the body?
lfvpCO
@lfvpCO
Sep 02 2017 03:06
guys I am starting with JS and. I dont know Why when I want to work in JS with an external file I can not do it.
but when I place the code inside the script in the body, the code works
mstellaluna
@mstellaluna
Sep 02 2017 03:07
@lfvpCO have you linked your external JS file inside the head tags of your html?
lfvpCO
@lfvpCO
Sep 02 2017 03:08
i put my link at the end of the body
mstellaluna
@mstellaluna
Sep 02 2017 03:09
how did you add it? if you can copy/paste the code?
lfvpCO
@lfvpCO
Sep 02 2017 03:10
<script src="/script/js1.html"></script>
</body>
</html>
mstellaluna
@mstellaluna
Sep 02 2017 03:11
@lfvpCO javascript files are saved as .js files for example
<script src="app.js"></script>
it could be the reason its not working, your file extension is wrong
lfvpCO
@lfvpCO
Sep 02 2017 03:11
ok
ill check
mstellaluna
@mstellaluna
Sep 02 2017 03:11
:)
lfvpCO
@lfvpCO
Sep 02 2017 03:11
hahahaha
mstellaluna
@mstellaluna
Sep 02 2017 03:12
?
@lfvpCO i guess since your laughing its working now with the .js extension?
lfvpCO
@lfvpCO
Sep 02 2017 03:13
I am checking my extension
yes guys It was my extension plus the .html
mstellaluna
@mstellaluna
Sep 02 2017 03:15
so it should be like my example js1.js for external javascript files and you specify it in your HTML file like my example at the end before the closing body tag
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 05:17
@Refath
Hi guys
On my website, I have all my files linked, but the layout of the page is messed up. https://refath.github.io/Niva/
Any help is appreciated
prakash chandra yadav
@prakashyadav008
Sep 02 2017 05:27
@prakashyadav008
hey everyone
a little help
https://codepen.io/prakashyadav008/pen/WEaWeB?editors=1010
```
$("#input").keyup(function(event){
  var input_val;
  if(event.which === 13){
    $("#search-button").click();
  }else if(event.which === 8){
      input_val = $("#input").val();
      if(input_val == ''){

        $("#input").css("background-color","white");
      }
  }
})
```
the "backspace" event handler isnt working
can anyone help me out
Jan Shah
@JanShah
Sep 02 2017 07:02
@prakashyadav008 seems to work ok, what is it you're trying to do?
Jan Shah
@JanShah
Sep 02 2017 07:56

@prakashyadav008

/*even handler for when user gives an input*/
$("#input").on("click",function() {  
  if($("#input").val() !== '') {
    $("#input").css("background-color","white");  
  } else {
    $("#input").css("background-color","rgb(164, 168, 173)");  
  }  
  $("#input").keyup(function(event) {
    if($("#input").val() !== '') {
      $("#input").css("background-color","white");   
    } else {
      $("#input").css("background-color","rgb(164, 168, 173)");  
    }
  });
});

this makes the box grey when empty and white if there is any text. focus and keydown event listeners probably aren't needed

Mai Thinh
@mthinh
Sep 02 2017 08:10
 $(this).addClass('active');
   setTimeout(function(){
     $(this).removeClass('active');
   },1000)
anybody knows why setTimeout doest work after addClass
Jan Shah
@JanShah
Sep 02 2017 08:15
@mthinh it does work. is it in an event handler?
Mai Thinh
@mthinh
Sep 02 2017 08:16
@JanShah yah it works, i just point to wrong object, that's why i didnt work
410204369
@410204369
Sep 02 2017 08:55

function wordBlanks(myNoun, myAdjective, myVerb, myAdverb) {
var result = "";
// 请把你的代码写在这条注释以下

// 请把你的代码写在这条注释以上
return result;
}

wordBlanks("dog", "big", "ran", "quickly"); // 你可以修改这一行来测试你的代码

hillsie
@Hillsie
Sep 02 2017 09:08
Hi, It’s been a while. What’s the best way to sort an array of strings?
var stringArray =["Yellow Pail", "Supermajority", "Beast vs Bananas","Tinfoild", "Haught or Naught", "Animals of Tin"]
stringArray.sort(function(a, b) {
  return a > b ; 
});
console.log(stringArray);
Long Nguyen
@longnt80
Sep 02 2017 09:13

@Hillsie

var stringArray =["Yellow Pail", "Supermajority", "Beast vs Bananas","Tinfoild", "Haught or Naught", "Animals of Tin"]
stringArray.sort();
console.log(stringArray);

same result

hillsie
@Hillsie
Sep 02 2017 09:16
@longnt80 thanks, yes, I neglected to say I’m testing it out. StringArray is and object with title:”Yellow Pail” …etc
CamperBot
@camperbot
Sep 02 2017 09:16
hillsie sends brownie points to @longnt80 :sparkles: :thumbsup: :sparkles:
:cookie: 542 | @longnt80 |http://www.freecodecamp.com/longnt80
hillsie
@Hillsie
Sep 02 2017 09:17
let me put it together as explained and repost
What I am trying to figure out are the advantage and disadvantages of sort() and if there is an acceptable best practice?
alpox
@alpox
Sep 02 2017 09:28
@Hillsie i believe its the best you can do for sorting :)
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 09:28
Hi, I was wondering if anyone here could help me figure out why my website http://refath.github.io/Niva/ isn't functioning
alpox
@alpox
Sep 02 2017 09:28
@Hillsie but i would
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 09:28
I checked the console; There were no errors, which makes it all the more confusing
Screen Shot 2017-09-02 at 5.25.05 AM.png
alpox
@alpox
Sep 02 2017 09:29
@Hillsie i would use string.localCompare(otherString) for proper comparison
Marco Galizzi
@Tezenn
Sep 02 2017 09:30
hello guys, i made the calculator one in my pc and the other in codpen.. the one in codepen works fine but the one i made locally with the same code when i press "0" it doesnt show on the small screen of the calculator, appears only when i push = but the code is the same
hillsie
@Hillsie
Sep 02 2017 09:30
thanks @alpox
CamperBot
@camperbot
Sep 02 2017 09:30
hillsie sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
:star2: 1322 | @alpox |http://www.freecodecamp.com/alpox
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 09:30
Any ideas guys?
Any help is appreciated!
alpox
@alpox
Sep 02 2017 09:31
@Refath What do you mean with isn't functioning?
hillsie
@Hillsie
Sep 02 2017 09:32
@Refath yip, dito
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 09:32
@alpox If you go there, you'll see that the 4 outer circles are rotating for no reason
alpox
@alpox
Sep 02 2017 09:33
@Refath yea because of animation: around 30s infinite ease-in;
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 09:34
@alpox Oh, I see
Because that's independent to everything else.
I deleted it, and it's still hapennign
Oh my god these bugs drive me crazy
alpox
@alpox
Sep 02 2017 09:37
@Refath reset the cache and then reload the page
Or just ctrl-f5
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 09:38
Great, now the circles aren't even moving around the center
Thanks for the help anyways
alpox
@alpox
Sep 02 2017 09:38
@Refath np :D
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 09:40
Is it to much to ask to ask why they're not moving?
alpox
@alpox
Sep 02 2017 09:41
@Refath Well the whole circle moves for me ^^
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 09:41
forget it; thanks man @alpox
CamperBot
@camperbot
Sep 02 2017 09:41
refath sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
:star2: 1323 | @alpox |http://www.freecodecamp.com/alpox
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 09:41
@alpox Wait, really??
alpox
@alpox
Sep 02 2017 09:41
@Refath yea
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 09:42
whatever, I've seen enough bugs for a day; thx for the help
prakash chandra yadav
@prakashyadav008
Sep 02 2017 09:46
@JanShah i found a solution https://codepen.io/prakashyadav008/pen/WEaWeB
works fine now
hillsie
@Hillsie
Sep 02 2017 09:54

@alpox I’ve been trying to figure out how to use the local compare in my previous example. How do I use it on an object?

product.sort(function(a, b) {
  return a.title.localeCompare(b.title);
});
console.log(product.title);

I changed the last line <gibersish translation>

hillsie
@Hillsie
Sep 02 2017 10:00
Got it, I think. Still have to use map
Long Nguyen
@longnt80
Sep 02 2017 10:17

@Hillsie

let arr = product.sort( (a,b) => {
  var titleA = a.title;
  var titleB = b.title;

  if (titleA < titleB) {
    return -1;
  }
  if (titleA > titleB) {
    return 1;
  }
  return 0;
});

result:

// [ { id: 6, title: 'Animals of Tin' },
//   { id: 3, title: 'Beast vs Bananas' },
//   { id: 5, title: 'Haught or Naught' },
//   { id: 2, title: 'Supermajority' },
//   { id: 4, title: 'Tinfoild' },
//   { id: 1, title: 'Yellow Pail' } ]
hillsie
@Hillsie
Sep 02 2017 10:20
thanks @longnt80 I also have this which I am trying to figure out how to use with the arrow function.
product.sort(function(a, b) {
   a.title.localeCompare(b.title);
});
const newOrder = product.map(product => product.title);
console.log(newOrder);
CamperBot
@camperbot
Sep 02 2017 10:20
hillsie sends brownie points to @longnt80 :sparkles: :thumbsup: :sparkles:
:cookie: 543 | @longnt80 |http://www.freecodecamp.com/longnt80
Long Nguyen
@longnt80
Sep 02 2017 10:22
@Hillsie product.sort( (a, b) => a.title.localeCompare(b.title) );
hillsie
@Hillsie
Sep 02 2017 10:27
@longnt80 aha, cheers thanks
hillsie
@Hillsie
Sep 02 2017 11:26
@longnt80 do you know if there is a way to combine the localeCompare and the map?
Long Nguyen
@longnt80
Sep 02 2017 11:36
@Hillsie let newOrder = product.map( (p) => p.title).sort();
hillsie
@Hillsie
Sep 02 2017 11:37
A double double arrow :clap: . I haven’t seen that before.
Long Nguyen
@longnt80
Sep 02 2017 11:38
@Hillsie it's called chaining
actually, this is better: let newOrder = product.map( (p) => p.title).sort();
WAINGOR
@WAINGOR
Sep 02 2017 11:39
Hi all, does anybody here know what a self invoking function with (this) behind it does? It looks like this:
```
(function test(){
//function here})(this)):
(function test(){
//function here})(this)):
(function test(){
})(this)):
:)
hillsie
@Hillsie
Sep 02 2017 11:40
thanks @longnt80 , I’ll look further into it.
CamperBot
@camperbot
Sep 02 2017 11:40
hillsie sends brownie points to @longnt80 :sparkles: :thumbsup: :sparkles:
:cookie: 544 | @longnt80 |http://www.freecodecamp.com/longnt80
Long Nguyen
@longnt80
Sep 02 2017 11:41
@Hillsie np
@WAINGOR is that a : at the end?
WAINGOR
@WAINGOR
Sep 02 2017 11:41
sorry it should be a semicolo @longnt80
semicolon
Long Nguyen
@longnt80
Sep 02 2017 11:43
@WAINGOR I think you need to provide more context of that code to know what this is
Emmanuel Akodia
@akodiaemma
Sep 02 2017 12:20
i want to be able to send form data to a specific list of emails... once the viewer taps submit7
how can i achieve that
koder3
@koder3
Sep 02 2017 12:28
i cant use a credit card on cloud 9, are there any alternatives to using cloud 9 to finish the node.js challenges
have to add the hover tooltip thing
Henry
@GitHub-Henry
Sep 02 2017 13:12
My understanding is that anything that hosts an internet web application can be used to host a FCC front end project. Is the rule similar for the back end certificate, is any service acceptable as long as the service can host an internet node.js application?
Sandip Shrestha
@saninmersion
Sep 02 2017 13:50
any nodejs experts in the house
Abhinav Mishra
@abhinav-m
Sep 02 2017 14:00
@GitHub-Henry i think so. I'm not completely sure though.
Dennise.C
@DenniseChoo
Sep 02 2017 14:02
Hi guys. I'm newbie and would like get some explanation bout the code that I saw online.
if(billAmount === "" || serviceQuality == 0){
window.alert("Please enter some values !");
return;
}
Maybe it sounds silly, but may I know why we have to add the "return" at the end?
Markus Kiili
@Masd925
Sep 02 2017 14:04
@DenniseChoo It stops the function execution there.
Dennise.C
@DenniseChoo
Sep 02 2017 14:06
@Masd925 Thanks for answering my question~ Does it necessary to add the "return"? What if I just leave it without the "return"?
CamperBot
@camperbot
Sep 02 2017 14:06
dennisechoo sends brownie points to @masd925 :sparkles: :thumbsup: :sparkles:
:star2: 4464 | @masd925 |http://www.freecodecamp.com/masd925
Markus Kiili
@Masd925
Sep 02 2017 14:06
There might be some code in the function after that if block, and without the return it would be executed.
If there is no code there, the return is redundant.
Because JS functions return undefined by default and that return; does the same.
Dennise.C
@DenniseChoo
Sep 02 2017 14:12
I think I got your idea,probably~ But is there any example showing me, so I can get the idea clearer ?
Kelechi Chinaka
@ke1echi
Sep 02 2017 14:13
function keysAndValues(data){
  let k = Object.keys(data), v = Object.values(data)
  return v
}
whats wrong with this code @Masd925
trying to get the keys and values
Markus Kiili
@Masd925
Sep 02 2017 14:14
@kelechy Comma operator returns the last operand to that assignment.
Kelechi Chinaka
@ke1echi
Sep 02 2017 14:15
i know
Markus Kiili
@Masd925
Sep 02 2017 14:15
So those keys vanish into thin air.
Kelechi Chinaka
@ke1echi
Sep 02 2017 14:15
v return an error
Markus Kiili
@Masd925
Sep 02 2017 14:16
@kelechy Sorry, I didn't see that it was a variable declaration.
Kelechi Chinaka
@ke1echi
Sep 02 2017 14:16
function keysAndValues(data){
  let k = Object.values(data)
  return k
}
this returns an error
runs on chrome but CW return error
Markus Kiili
@Masd925
Sep 02 2017 14:17
@kelechy Object.values has poor browser support.
Kelechi Chinaka
@ke1echi
Sep 02 2017 14:18
oh i see
Stephen James
@sjames1958gm
Sep 02 2017 14:35
"morning" all
Markus Kiili
@Masd925
Sep 02 2017 14:36
@sjames1958gm Morning.
Elizabeth Paul
@Kowalatam
Sep 02 2017 14:39
evening...
Kelechi Chinaka
@ke1echi
Sep 02 2017 14:46
:wave: @sjames1958gm
Abhinav Mishra
@abhinav-m
Sep 02 2017 15:04
@sjames1958gm :wave: good morning
Kelechi Chinaka
@ke1echi
Sep 02 2017 15:10
thanks @moigithub
CamperBot
@camperbot
Sep 02 2017 15:10
kelechy sends brownie points to @moigithub :sparkles: :thumbsup: :sparkles:
:star2: 3621 | @moigithub |http://www.freecodecamp.com/moigithub
so i'm trying to make it when i click next or previous, the picture gallery responds to it
could i get a little bit of assistance
koder3
@koder3
Sep 02 2017 15:16
what are some of the more important concepts to focus on in Node.js
Pethaf
@Pethaf
Sep 02 2017 15:21
Learn about the event loop.
Stephen James
@sjames1958gm
Sep 02 2017 15:22
@lawrencelee93 Neither of these work at all you transferred to codepen from somewhere else?
koder3
@koder3
Sep 02 2017 15:24
@Pethaf thanks
CamperBot
@camperbot
Sep 02 2017 15:24
koder3 sends brownie points to @pethaf :sparkles: :thumbsup: :sparkles:
:cookie: 399 | @pethaf |http://www.freecodecamp.com/pethaf
Pethaf
@Pethaf
Sep 02 2017 15:25
I repeat my suggestion.
Get your 3 months of free pluralsight from microsoft.
Go through the nodejs content there.
koder3
@koder3
Sep 02 2017 15:45
@Pethaf thanks a lot!
CamperBot
@camperbot
Sep 02 2017 15:45
koder3 sends brownie points to @pethaf :sparkles: :thumbsup: :sparkles:
:warning: koder3 already gave pethaf points
luccifer00
@luccifer00
Sep 02 2017 15:53
i am getting crazy with the buttons, someone can take a look?? https://codepen.io/luccifer00/pen/RZQYdM?editors=0011
i would like to use the 'display: block or none' to show each container
i am testing to diplay: none when i push the All button, but i can't...
Stephen James
@sjames1958gm
Sep 02 2017 15:58
@luccifer00 counter[i].getlElementById('bloq').style counter[i] is already an element with id "bloq"
Having multiple elements with the same id is asking for problems
luccifer00
@luccifer00
Sep 02 2017 16:00
@sjames1958gm i used that, to test, but i also try with counter[i].style and no results
Stephen James
@sjames1958gm
Sep 02 2017 16:03
@luccifer00 It may because querySelectorAll is a non-live list of elements
luccifer00
@luccifer00
Sep 02 2017 16:04
@sjames1958gm i dont know where to use the click. buttons function on the JS, i am starting at the end .... but i dont know if i should used it at the begining or inside the Ajax or a for loop that i have it... i am getting crazy with that ..
Stephen James
@sjames1958gm
Sep 02 2017 16:06
@luccifer00 Your for loop doesn't initialize i either
Since your buttons are in the HTML you can put the click handlers anywhere
luccifer00
@luccifer00
Sep 02 2017 16:06
@sjames1958gm i use querySelectorAll to check how many bloqs are in the page.... so it show 14 bloqs..... after this i would like to test how many of them are online... or how many of them are offline.... and so change the css property with .styleto show or hide it....
Stephen James
@sjames1958gm
Sep 02 2017 16:08
@luccifer00 Your for loop didn't initialize i so it never looped
you had
for (i;i<counter.length;i++){
should be
for (i = 0;i<counter.length;i++){
luccifer00
@luccifer00
Sep 02 2017 16:09
but i have the i variable definied before... i think....
Tom
@moT01
Sep 02 2017 16:10
how can i change the attributes of css * with js?
Markus Kiili
@Masd925
Sep 02 2017 16:13
@moT01 You usually mutate the DOM with JS. Classes and id's of elements and inline styles etc. There is an api for accessing the style sheets but I have never seen it used.
luccifer00
@luccifer00
Sep 02 2017 16:13
@moT01 document.getElementById(id).style.property = new style
Tom
@moT01
Sep 02 2017 16:14
@Masd925 yea, i just thought of that
i think ill have to find another way
Markus Kiili
@Masd925
Sep 02 2017 16:15
@moT01 That .style property @luccifer00 showed is for accessing and mutating the inline styles.
luccifer00
@luccifer00
Sep 02 2017 16:15
@sjames1958gm i fixed with your advice i=0 i thought if i had definited the variable, i didnt need to re definite
Tom
@moT01
Sep 02 2017 16:15
trying to add/remove
*
 { cursor: wait; }
but, yea, js doesn't play with css does it
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 16:18
Hey guys
I was wondering if someone could help me figure out what's wrong with my website?
Tiago Correia
@tiagocorreiaalmeida
Sep 02 2017 16:19
syre
sure
do you ahve it in a pen or something?
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 16:20
Uh no; The site is http://refath.github.io/Niva
Markus Kiili
@Masd925
Sep 02 2017 16:20
@moT01 There is https://developer.mozilla.org/en-US/docs/Web/API/Document/styleSheets but that is really not the way to do it. Better to have fixed CSS and change the DOM.
Razvan Jackson
@RazvanJackson
Sep 02 2017 16:20
Can you do node js dynamic pages like in php?
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 16:20
The problem is that the 4 circles are rotating for no reason
Tiago Correia
@tiagocorreiaalmeida
Sep 02 2017 16:20
they are not?
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 16:20
Even when I fixed that previously; the speed animation wouldn't work
@tiagocorreiaalmeida Let me check
Tiago Correia
@tiagocorreiaalmeida
Sep 02 2017 16:21
ctrl+f5
clears cache or something I Think
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 16:21
Yeah, I guess I fixed that
Tiago Correia
@tiagocorreiaalmeida
Sep 02 2017 16:21
ehhehe nice then
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 16:21
But the circles aren't moving in a path
Razvan Jackson
@RazvanJackson
Sep 02 2017 16:22
Can you do node js dynamic pages like in php?
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 16:22
@tiagocorreiaalmeida You know what I mean?
Tiago Correia
@tiagocorreiaalmeida
Sep 02 2017 16:22
I think so you want them to move like in circle?
Tom
@moT01
Sep 02 2017 16:23
yea, ill have to find another way. thanks @Masd925 @luccifer00
CamperBot
@camperbot
Sep 02 2017 16:23
mot01 sends brownie points to @masd925 and @luccifer00 :sparkles: :thumbsup: :sparkles:
:cookie: 264 | @luccifer00 |http://www.freecodecamp.com/luccifer00
:star2: 4465 | @masd925 |http://www.freecodecamp.com/masd925
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 16:23
@tiagocorreiaalmeida Yup; It was working in the pen, but not here
@tiagocorreiaalmeida This is the pen: https://codepen.io/Refath/pen/BdMvZx?editors=0100
Everything was working perfectly, and then when I moved everything to GitHub, it got messed up
Tiago Correia
@tiagocorreiaalmeida
Sep 02 2017 16:28
@Refath just tell me 1 thing
everythign you got in the pen is equal to the things you on the webpage right?
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 16:29
Right.
Tiago Correia
@tiagocorreiaalmeida
Sep 02 2017 16:29
ok tjen sec
Razvan Jackson
@RazvanJackson
Sep 02 2017 16:29
Node > PHP?
Pethaf
@Pethaf
Sep 02 2017 16:30
I would say node and PHP are incomensurable.
korzo
@korzo
Sep 02 2017 16:33
@RazvanJackson depends of problem you are trying to solve
Tiago Correia
@tiagocorreiaalmeida
Sep 02 2017 16:33
@Refath sorry mate no idea :|
Ghost
@ghost~55a04b725e0d51bd787af54c
Sep 02 2017 16:40
I DID IT!
I DID IT!!!
NO MORE BUGS!!! YESSSS
WHOOOOOOOO
Razvan Jackson
@RazvanJackson
Sep 02 2017 16:55
Who knows node and can talk in private?
luccifer00
@luccifer00
Sep 02 2017 17:13
$('#all').click(function(){
 var counter= document.querySelectorAll('#bloq');  
 for (i = 1;i<counter.length;i++){
     counter[i].style = "display: block";
   } 
 });
 $('#red').click(function(){
 var counter= document.querySelectorAll('#bloq');
 var red=document.querySelectorAll('.on-line');
 for (i=1;i<counter.length;i++){
  red[i].parentNode.parentNode.style = "display: none";
    }  
 });
  $('#green').click(function(){
  var counter= document.querySelectorAll('#bloq');
  var green=document.querySelectorAll('.off-line');
 for (i=1;i<counter.length;i++){
 green[i].parentNode.parentNode.style = "display: none";

    } // end for
    console.log(counter[1].css);
 });
i have something wrong withm my buttons... they work fine, at the first time....
if i press offline to see the offline users, it is ok. but if i filter to show the online, the way i am doing so, is hidding the offline users... so i have empty result.... i add the code pen i one one can take a look!
https://codepen.io/luccifer00/pen/RZQYdM?editors=0011
Stephen James
@sjames1958gm
Sep 02 2017 17:20

@luccifer00 Write a function that takes a selector and a style then call the function

function change(select, style) {
  var items=document.querySelectorAll(selector);
 for ( var i=1;i<items.length;i++){
     items[i].parentNode.parentNode.style = style;
    } 
}

Then use the function when
all - call function with online, block and offline, block
offline - call function with online, none and offline, block
online - call function with online, block and offline, none

@Refath :+1:
@RazvanJackson
PHP is a language that can be used by a browser to implement backend
node is a platform that be used for many things including implementing a backend.
They aren't really comparable, but since node can do so much more . . .
luccifer00
@luccifer00
Sep 02 2017 17:23
@sjames1958gm thanks so much! i hope to understand all hehe
CamperBot
@camperbot
Sep 02 2017 17:23
luccifer00 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 8428 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Markus Kiili
@Masd925
Sep 02 2017 17:36
@sjames1958gm Isn't PHP usually used by a web server and not a browser?
luccifer00
@luccifer00
Sep 02 2017 18:19
 function change(selector, style) {
  var status=document.querySelectorAll(selector);;
 for ( var i=1;i<status.length;i++){
     status[i].parentNode.parentNode.style = style;
    } 
}
  var styleON = "display: block";
  var styleOFF = "display: none";
  var red='.on-line';
  var green='.off-line';
  $('#all').click(function(){
 change(red, styleON);
 change(green, styleON);
 });
 $('#red').click(function(){
 change(green, styleON);
 change(red, styleOFF);
 });
  $('#green').click(function(){
 change(red, styleON);
 change(green, styleOFF);
 });
@sjames1958gm something like this is ok?? finaly i get it!!
i think i finish with this challenge if you want to check it! i am opend to listen every comment!
Markus Kiili
@Masd925
Sep 02 2017 18:27
@luccifer00 Instead of the for loop you could also use forEach method that Nodelist's have.
But nothing wrong with a for loop.
luccifer00
@luccifer00
Sep 02 2017 18:31
@Masd925 at first i would like to do it with forEach but in the IE dosent support, so i start codepen in Firefox, after Reading about i saw forEach is deprecated for ECMA-357 (E4X) i didnt know what is exactly but the mdn recomend for loop instead so i did so...
Markus Kiili
@Masd925
Sep 02 2017 18:34
@luccifer00 Yes, that seems to be the case with IE.
luccifer00
@luccifer00
Sep 02 2017 18:34
also with the codepen analyzer tool i saw an alert saying "Don't make functions within a loop"..... but i did, i dont know how to do it with out that
Gersho
@Gersho
Sep 02 2017 18:35
"i needed to do it this way because of IE" grabs popcorn
Markus Kiili
@Masd925
Sep 02 2017 18:37
@luccifer00 I think Nodelist is on DOM specification and not on the ECMAScript standard.
@Gersho Lots of people use IE and will use it for a long time.
Gersho
@Gersho
Sep 02 2017 18:39
didn't microsoft force a switch to edge ? i stopped reading IE news a long time ago
luccifer00
@luccifer00
Sep 02 2017 18:39
if you test my codepen on IE (my versión is Edge explorer) it dosent run... @Gersho @Masd925
Gersho
@Gersho
Sep 02 2017 18:40
i'll trust you on that :D don't plan to install IE ^^
BrianWilliams28
@BrianWilliams28
Sep 02 2017 18:41
to anyone that's done the Drop It algorithm, how do you test whether the argument function is true / false against the array argument?
function dropElements(arr, func) {
 var args = Array.prototype.slice.call(arguments);
 let filtered = [];

  return arr;
}

dropElements([1, 2, 3], function(n) {return n < 3; });
luccifer00
@luccifer00
Sep 02 2017 18:41
the most importat thing i can not get it , is the way to use the API for the real streamers..... i am using when it is true or false, if they stream to under18 years old or not....
there is no way to get the api info if the twitcher is streaming or not....
Markus Kiili
@Masd925
Sep 02 2017 18:42
@BrianWilliams28 You can loop the array elements and test the looped element.
BrianWilliams28
@BrianWilliams28
Sep 02 2017 18:43
@Masd925 yes i know, but the function changes each time
@Masd925 dropElements([1, 2, 3, 4], function(n) {return n >= 3;}) should return [3, 4].
dropElements([0, 1, 0, 1], function(n) {return n === 1;}) should return [1, 0, 1].
dropElements([1, 2, 3], function(n) {return n > 0;}) should return [1, 2, 3].
dropElements([1, 2, 3, 4], function(n) {return n > 5;}) should return [].
dropElements([1, 2, 3, 7, 4], function(n) {return n > 3;}) should return [7, 4].
dropElements([1, 2, 3, 9, 2], function(n) {return n > 2;}) should return [3, 9, 2].
Gersho
@Gersho
Sep 02 2017 18:43
you use func as an argument
you don't copy it, you use it as is
Markus Kiili
@Masd925
Sep 02 2017 18:43
@BrianWilliams28 No need to slice call here. Just use arr and func that hold the passed array and function.
BrianWilliams28
@BrianWilliams28
Sep 02 2017 18:44
so i can use a for loop to go until func = false?
Gersho
@Gersho
Sep 02 2017 18:45
a for loop, a foreach, array.map, whatever suits your style more
BrianWilliams28
@BrianWilliams28
Sep 02 2017 18:45
i'm just not sure how to compare func being true/false against arr[i]
like not sure how i would write that, never dealt with a function as the argument
Gersho
@Gersho
Sep 02 2017 18:46
how would you do it if you had to do it on paper with a pen ?
Markus Kiili
@Masd925
Sep 02 2017 18:46
@BrianWilliams28 Non-mutating solution just finds the index of the first element that returns true when passed into that function func. Mutating solution can splice the first element away as long as it returns false when passed into func.
Gersho
@Gersho
Sep 02 2017 18:46
well you write your code as you would, exept for the conditional part (since it can change) and there, instead of writing a function, you pass the argument
Joseph
@Big-jo
Sep 02 2017 19:27
is it possible to check if input boxes have been filled ?
Markus Kiili
@Masd925
Sep 02 2017 19:32
@Big-jo One way is to use HTML5 form validation and required attribute. Another way is to use submit event and your own function that check input values and validates them.
Ademola Adegbuyi
@ooade
Sep 02 2017 19:33
@Big-jo Yea
Joseph
@Big-jo
Sep 02 2017 19:37
@Masd925 @ooade thanks
CamperBot
@camperbot
Sep 02 2017 19:37
big-jo sends brownie points to @masd925 and @ooade :sparkles: :thumbsup: :sparkles:
:star2: 4466 | @masd925 |http://www.freecodecamp.com/masd925
:cookie: 871 | @ooade |http://www.freecodecamp.com/ooade
Maxime Laforet
@Macxim
Sep 02 2017 20:27
Hi
There is something I don't understand about nested arr.forEach.
Is anyone available?
Markus Kiili
@Masd925
Sep 02 2017 20:28
@Macxim Yes.
Maxime Laforet
@Macxim
Sep 02 2017 20:36
Here you go @Masd925
It's easier to explain with code
I want to access the offices that are nested into each object.
For each partner, I want to display the corresponding offices.
When I console.log(office) in line 11, every office is displayed in the console but when I actually want to return it within the view, only the last ones for each object is displayed :confused:
Markus Kiili
@Masd925
Sep 02 2017 20:44
@Macxim You need to append something into the DOM inside that inner forEach that iterates over the offices.
Maxime Laforet
@Macxim
Sep 02 2017 20:45
Yes, I tried that.
And only the last ones for each object are displayed.
Why?
Markus Kiili
@Masd925
Sep 02 2017 20:51
@Macxim Maybe you are overwriting something on each loop? Maybe with innerHTML or something like that?
Maxime Laforet
@Macxim
Sep 02 2017 20:53
Not that I know of.
Ellyria
@Ellyria
Sep 02 2017 20:54
Just curious, but why do you use office at the top of the code and offices at the bottom?
Maxime Laforet
@Macxim
Sep 02 2017 20:55
@Masd925 My guess is that it's because they are two objects in the array partners.
@Ellyria What do you mean, top and bottom?
Ellyria
@Ellyria
Sep 02 2017 20:56
For example: console.log(office); and offices: Array[2].
Maxime Laforet
@Macxim
Sep 02 2017 20:57
in the console.log it's the argument of the callback function of forEach, it could have been bananas.
Markus Kiili
@Masd925
Sep 02 2017 20:57
@Ellyria office is the parameter of the forEach callback that holds each office (partner.offices element) in its turn.
Ellyria
@Ellyria
Sep 02 2017 20:58
Okay, thanks. I like bananas better.
Maxime Laforet
@Macxim
Sep 02 2017 20:58
I'll change it then ;)
Ellyria
@Ellyria
Sep 02 2017 20:59
Heh, no need.
Maxime Laforet
@Macxim
Sep 02 2017 20:59
@Masd925 The same happens if I use a simple for loop.
    for (var i = 0; i < partner.offices.length; i++) {
      viewOffices = document.createElement('div');
      viewOffices.innerHTML = "<h6>"+ partner.offices[i].location +"</h6>";
    }
Weird.
Ellyria
@Ellyria
Sep 02 2017 21:01
I could be completely off base here, and feel free to ignore my theory if I am, but I seem to recall reading somewhere that a function that you call behaves differently from a function that is automatically loaded. It's possible that that has something to do with it.
Markus Kiili
@Masd925
Sep 02 2017 21:01
@Macxim You need to append viewOffices to the DOM on each loop.
Ellyria @Ellyria crawls back under a rock.
Markus Kiili
@Masd925
Sep 02 2017 21:03
@Macxim The problem is that innerHTML is overwritten on each loop. You need to append to it.
Maxime Laforet
@Macxim
Sep 02 2017 21:03
Mmh I see.
Markus Kiili
@Masd925
Sep 02 2017 21:04
Maybe just viewOffices.innerHTML = viewOffices.innerHTML + "<h6>"+ partner.offices[i].location +"</h6>";
That would generate more HTML on each loop instead of overwriting.
Maxime Laforet
@Macxim
Sep 02 2017 21:05
I'll give it a shot.
Joseph
@Big-jo
Sep 02 2017 21:34
 var input_tag = document.getElementsByTagName('input').value;
     if(input_tag == " "){
         $("#alertbox").fadeTo("fast",1);
     }
i'm trying to check if some input boxes have values, if they don't , then i want to show the div i have which is styled with display:none property.
Markus Kiili
@Masd925
Sep 02 2017 21:38
@Big-jo document.getElementsByTagName method returns a HTMLCollection.
Markus Kiili
@Masd925
Sep 02 2017 21:44
@Big-jo That method returns an array-like object that holds the elements by that tag name: https://developer.mozilla.org/en-US/docs/Web/API/HTMLCollection That collection needs to be iterated or looped so you can access the elements and check the input values.
Joseph
@Big-jo
Sep 02 2017 21:44
@Masd925 oh thank you
luccifer00
@luccifer00
Sep 02 2017 21:59

function diffArray(arr1, arr2) {
  var newArr = [];
  newArr = arr1.concat(arr2);
 var newArr1 = newArr.filter(function(by){
    return arr1.indexOf(by) ==-1 || arr2.indexOf(by) ==-1;
  });

  return newArr1;
}

diffArray([1, 2, 3, 5], [1, 2, 3, 4, 5]);
hi there i was on Diff Two Arrays Challenge and i was Reading about, but the people do it with a long code.... i dont know if i am lucky and i get any tricky way, or if the code is right written... someone can take a look?
Margaret
@Margaret2
Sep 02 2017 22:01
@luccifer00 that's fine, that's how my solution is
you can also chain the methods return arr1.concat(...).filter(...)
luccifer00
@luccifer00
Sep 02 2017 22:03
@Margaret2 i dont get it....
u mean to write in one line??
korzo
@korzo
Sep 02 2017 22:03
@luccifer00 You can chain concat().filter() and save 3 lines
Margaret
@Margaret2
Sep 02 2017 22:04
@luccifer00 i mean you don't have to set up new variables like newArr and newArr1
just use concat and filter to provide a modified copy of the array
Tiago Correia
@tiagocorreiaalmeida
Sep 02 2017 22:04
do you guys see any syntax error
axios.get(geocodeUrl).then((response)=>{
  if(response.data.status==="ZERO_RESULTS"){
    throw new Error("Unable to find the address");
  }
  console.log(response.data);
}).catch((e)=>{
  if(e.response.status === 404){
  console.log("Unable to connect to API SERVERS");
}else{
  console.log(e.message);
}
});
korzo
@korzo
Sep 02 2017 22:05
@luccifer00
function diffArray(arr1, arr2) {
  return arr1.concat(arr2)
      .filter(function(by){
    return arr1.indexOf(by) ==-1 || arr2.indexOf(by) ==-1;
  });
}
luccifer00
@luccifer00
Sep 02 2017 22:10
thanks @korzo and @Margaret2 , i dont need the return line, and i can "chain" that lines :+1: lol, at the begining i didnt understand the meaning of "chain" i get it now! thanks
CamperBot
@camperbot
Sep 02 2017 22:10
luccifer00 sends brownie points to @korzo and @margaret2 :sparkles: :thumbsup: :sparkles:
:cookie: 443 | @korzo |http://www.freecodecamp.com/korzo
:star2: 2900 | @margaret2 |http://www.freecodecamp.com/margaret2
korzo
@korzo
Sep 02 2017 22:10
@tiagocorreiaalmeida catch() will catch error thrown in then()
Otherwise I think it's ok.
Tiago Correia
@tiagocorreiaalmeida
Sep 02 2017 22:11
im getting this on node
image.png
if I remove that if and simply run console.log(response.data) I te this
get
strange thing
image.png
korzo
@korzo
Sep 02 2017 22:26
@tiagocorreiaalmeida I think there is some problem, that data is undefined
@tiagocorreiaalmeida Oh, I got it
iso
@iso1048
Sep 02 2017 22:28
@korzo would you be able to help me out with an issue regarding the textarea tag?
korzo
@korzo
Sep 02 2017 22:28
@tiagocorreiaalmeida If you throw error in then, your error has no response property.
That's the error you got in console
Tiago Correia
@tiagocorreiaalmeida
Sep 02 2017 22:29
so I need to change my else statement?
korzo
@korzo
Sep 02 2017 22:29
@gothamknight I will try
@tiagocorreiaalmeida Yes, because your thrown error has not the same interface as rejection response
iso
@iso1048
Sep 02 2017 22:31
@korzo cool. The problem I am having is that when the textarea is expanded, it does not push down the content below it, so it overlaps. https://codepen.io/gothamknight/pen/jLzrBm?editors=0100 (make the screen width smaller so that the 'convert' btn is below the textarea)
korzo
@korzo
Sep 02 2017 22:31
@tiagocorreiaalmeida I think
if(e.response && e.response.status === 404)
should do the trick
iso
@iso1048
Sep 02 2017 22:31
wr.gif
that is what is currently occurring
proper.gif
and that is what I want to occur
Joseph
@Big-jo
Sep 02 2017 22:40
function Validate(args) 
{
    if (args == " ")
    {
        return true;
    }
}
please can someone check if this is alright
Gersho
@Gersho
Sep 02 2017 22:41
what are you trying to do with that ?
also prefer === to == when possible
Joseph
@Big-jo
Sep 02 2017 22:42
is there any difference?
Gersho
@Gersho
Sep 02 2017 22:42
yes
Maxime Laforet
@Macxim
Sep 02 2017 22:42
@Masd925 Thanks for earlier. ;)
CamperBot
@camperbot
Sep 02 2017 22:42
macxim sends brownie points to @masd925 :sparkles: :thumbsup: :sparkles:
:star2: 4467 | @masd925 |http://www.freecodecamp.com/masd925
Gersho
@Gersho
Sep 02 2017 22:42
=== also compare types
"0" === 0 // false
"0" == 0 // true
Joseph
@Big-jo
Sep 02 2017 22:43
@Gersho i need to pass the argument of the function into the if statemnt
@Gersho oh i'm not trying to compare types
Gersho
@Gersho
Sep 02 2017 22:44
sure why not ? the way you've written it, your function will return true if args is a string containing a single space
if you want to compare for empty string use ""
Joseph
@Big-jo
Sep 02 2017 22:46
@Gersho i'm trying to check if the argument is empty, the argument is an input box
Gersho
@Gersho
Sep 02 2017 22:46
then use ""
Joseph
@Big-jo
Sep 02 2017 22:46
@Gersho thanks a bunch
CamperBot
@camperbot
Sep 02 2017 22:46
big-jo sends brownie points to @gersho :sparkles: :thumbsup: :sparkles:
:cookie: 392 | @gersho |http://www.freecodecamp.com/gersho
Gersho
@Gersho
Sep 02 2017 22:47
hmm i think there's some html way to make an input box mandatory
Stephen James
@sjames1958gm
Sep 02 2017 22:48
There is the required attribute
Gersho
@Gersho
Sep 02 2017 22:49
required HTML5
This attribute specifies that the user must fill in a value before submitting a form. It cannot be used when the type attribute is hidden, image, or a button type (submit, reset, or button). The :optional and :required CSS pseudo-classes will be applied to the field as appropriate.
korzo
@korzo
Sep 02 2017 22:50
@gothamknight It's some issue with flex.
Gersho
@Gersho
Sep 02 2017 22:50
oh that looks crappy on long string
Joseph
@Big-jo
Sep 02 2017 22:53
function Validate(args) 
{
    if(args=="")
    {
        return true;
    }
}
console.log(Validate(Uname));
so i got an undefined error.
Gersho
@Gersho
Sep 02 2017 22:54
what is it supposed to return if it's not an empty string ?
Joseph
@Big-jo
Sep 02 2017 22:55
@Gersho the string is empty, i made sure of it
iso
@iso1048
Sep 02 2017 22:55
@korzo yeah you are right. I also need to add display: inline-block to the .input-txtarea-div css rule to get it to work. Thanks
CamperBot
@camperbot
Sep 02 2017 22:55
gothamknight sends brownie points to @korzo :sparkles: :thumbsup: :sparkles:
:cookie: 444 | @korzo |http://www.freecodecamp.com/korzo
Gersho
@Gersho
Sep 02 2017 22:56
@Big-jo are you doing that on freecodecamp's code editor ?
Joseph
@Big-jo
Sep 02 2017 22:56
no sublime :smile:
Gersho
@Gersho
Sep 02 2017 22:58
could you show the full thing ? maybe the problem is somewhere else ? (or try doing the same thing with console.log(Uname); right before your console log, also try adding a "else return true;" just in case ^^
Joseph
@Big-jo
Sep 02 2017 22:59
@Gersho i just figured it out :laughing: i didnt get the value of the input boxes
Gersho
@Gersho
Sep 02 2017 23:00
\o/
murp9702
@murp9702
Sep 02 2017 23:01
Having a little trouble with this one. Without the else statement the code returns the correct missing letter. When I add in the else statement the undefined returns when it should but the missing letters will not. What am I missing here?
function fearNotLetter(str) {

  var missingLetter ="";
  for (var i=0;i<str.length;i++) {

    var minusOne = str.charCodeAt(i-1);
    console.log(minusOne);
    if (str.charCodeAt(i) - minusOne  != 1) {
      missingLetter = String.fromCharCode((str.charCodeAt(i)-1));
      }


    else {
      return undefined;
    }
  }

  return missingLetter;
}

fearNotLetter("abce");
Gersho
@Gersho
Sep 02 2017 23:05

try having the end of the if, the else, and the start of the else on the same line

} else {

i don't know if it's related to your issue but that's how i see it written everywhere

korzo
@korzo
Sep 02 2017 23:05
@murp9702 Why would you return undefined ?
murp9702
@murp9702
Sep 02 2017 23:08
@korzo It is what the challenge wants. I get the green check for the two that need to be undefined. The problem is now it wont let my if statement pass. The if statement works without else running , so I am starting to think it is a bug?
@Gersho Gave it a shot and didn't help.
korzo
@korzo
Sep 02 2017 23:09
@murp9702 Yes, but you should return undefined if no letter is missing.
you return undefined, when you find first not missing letter
@murp9702 also you should add missing letter to missingLetter
missingLetter += String.fromCharCode((str.charCodeAt(i)-1));
Stephen James
@sjames1958gm
Sep 02 2017 23:50
@murp9702 The key is to return the missingLetter immediately from inside the loop
If the loop ends with no missing letter found then return undefined
@murp9702 var minusOne = str.charCodeAt(i-1); this is trying to get the char code of a number not the value from str
Ginger
@GingerChew
Sep 02 2017 23:56
Hey guys, I just need a concept check. I'm looking at the docs and googling and its still not getting through. What does recursive mean when making a function?