These are chat archives for FreeCodeCamp/HelpJavaScript

28th
Jan 2018
Dan Lafferty
@DanLaff
Jan 28 2018 00:01
@surferpilgrim for chrome extensions?
Idowu Wasiu
@Hoxtygen
Jan 28 2018 00:01
@DanLaff thanks man, any links or videos on how to use fetch?
CamperBot
@camperbot
Jan 28 2018 00:01
hoxtygen sends brownie points to @danlaff :sparkles: :thumbsup: :sparkles:
api offline
Dan Lafferty
@DanLaff
Jan 28 2018 00:01
Otherwise, there's the audio tag for any browser: https://www.w3schools.com/tags/tag_audio.asp
@Hoxtygen This is a good start, but typical MDN tech docs may not be so fun to read :) https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
You may get a better idea of how to use fetch() by searching for "fetch" in codepen and studying code from other people
Idowu Wasiu
@Hoxtygen
Jan 28 2018 00:04
@DanLaff oh, thanks. that didnt come to mind
CamperBot
@camperbot
Jan 28 2018 00:04
hoxtygen sends brownie points to @danlaff :sparkles: :thumbsup: :sparkles:
api offline
aRtoo
@artoodeeto
Jan 28 2018 03:10
hey fam i made a simple modal to practice why is this not working and how can i make it work?
let modulePattern = (function(){

  return{
    addBoth: function(aA,bB){
      return aA + bB;
    },

    putAhere: function(a){
      addBoth(a);
    },

    putBhere: function(b){
      addBoth(b);
    }
  }

}())

// modulePattern.addBoth(2,3); //working

modulePattern.putAhere(2); // notworking
modulePattern.putBhere(2); //not working
Ken Haduch
@khaduch
Jan 28 2018 03:37
@artoodeeto - how about in the places within putAHere and putBhere you reference this.addBoth() using this.? Although I'm not sure what you're trying to get as a final result, but that allows the invocation of addBoth from within those two member functions.
aRtoo
@artoodeeto
Jan 28 2018 03:43
@khaduch i wanted to pass a value on each put function then addBoth function will those 2 num
@khaduch but let me try
@khaduch not working bro
Ken Haduch
@khaduch
Jan 28 2018 03:47
@artoodeeto - so could you give some examples of what kind of output you want to see with different inputs?
would you want putAhere to set a value for a, and then putBhere to set a value for b?
Sweet Coding :)
@SweetCodingInc
Jan 28 2018 06:58
@artoodeeto you need local variables to store a and b
@artoodeeto
let modulePattern = (function(){
  var aA,bB;
  return{
    addBoth: function(){
      return aA + bB;
    },

    putAhere: function(a){
      aA = a;
    },

    putBhere: function(b){
      bB = b;
    }
  }

}())

modulePattern.putAhere(2); // sets valua of local variable aA
modulePattern.putBhere(3); // sets valua of local variable bB

modulePattern.addBoth(2,3); // 5
Razvan Jackson
@RazvanJackson
Jan 28 2018 09:00
Guys
How it's called this
statement ? true : false
Kelechi Chinaka
@ke1echi
Jan 28 2018 09:01
tenary operator @RazvanJackson
Aditya
@ezioda004
Jan 28 2018 09:01
@RazvanJackson Its ternary operator, short for if else
Razvan Jackson
@RazvanJackson
Jan 28 2018 09:02
Thanks @kelechy & @ezioda004
CamperBot
@camperbot
Jan 28 2018 09:02
razvanjackson sends brownie points to @kelechy and @ezioda004 :sparkles: :thumbsup: :sparkles:
:cookie: 324 | @kelechy |http://www.freecodecamp.org/kelechy
:cookie: 420 | @ezioda004 |http://www.freecodecamp.org/ezioda004
bilaal-s
@bilaal-s
Jan 28 2018 09:08
hello guys
anyone here have experience with sql server by any chance?
Tiago Correia
@tiagocorreiaalmeida
Jan 28 2018 10:22
Hey what are you trying to do?
Tom
@moT01
Jan 28 2018 14:42

im having issues with my interval...

//SLIDESHOW
var delay = 7500;
var index = 0;
var leftChevron = document.getElementById('left-chevron');
var rightChevron = document.getElementById('right-chevron');
var slideInterval = setInterval(nextSlide, delay);
var slides = [
  document.getElementById('slide0'),
  document.getElementById('slide1'),
  document.getElementById('slide2'),
  document.getElementById('slide3'),
  document.getElementById('slide4'),
  document.getElementById('slide5'),
  document.getElementById('slide6')
];

leftChevron.addEventListener('click', function() {
  clearInterval(slideInterval);
  slides[index].style.opacity = '0';
  index == 0 ? index = 6 : index--;  
  slides[index].style.opacity = '100';
  slideInterval = setInterval(nextSlide, delay);
});

rightChevron.addEventListener('click', function() {
  clearInterval(slideInterval);
  nextSlide();
  slideInteral = setInterval(nextSlide, delay);
});

function nextSlide() {
  slides[index].style.opacity = '0';
  index == 6 ? index = 0 : index++;   
  slides[index].style.opacity = '100';
};

its not clearing the interval on my clicks, i make my click and it speeds up the time between slides

Tom
@moT01
Jan 28 2018 15:52
nevermind - figured it out - typo
aRtoo
@artoodeeto
Jan 28 2018 16:08
@SweetCodingInc hey bro you replied on my chat about my module pattern. thank you so much. if you could explain it to me though it would much be of help. :)
CamperBot
@camperbot
Jan 28 2018 16:08
artoodeeto sends brownie points to @sweetcodinginc :sparkles: :thumbsup: :sparkles:
:cookie: 216 | @sweetcodinginc |http://www.freecodecamp.org/sweetcodinginc
Sweet Coding :)
@SweetCodingInc
Jan 28 2018 16:13
@artoodeeto In your original code when you call either of putAhere and putBhere, you were internally calling addBoth. And addBoth takes two arguments. But you were calling it with one argument. No matter whether you are calling it from putAhere or putBhere, you only passed the first argument aA.In which case, your bB always remains undefined. And any number when added to undefined results in NaN (Not A Number)
What I told you was based on my assumption that you're implementing module pattern
where you call a separate function to set value of A and B
and then reuse these values in addBoth function.
NOTE: if that is what you're looking to do, addBoth must not take any parameters
it should reuse the values of aA and bB that are local to your module
aRtoo
@artoodeeto
Jan 28 2018 16:37
@SweetCodingInc ohhh. i got it now. i was thinking it would be a constructor
@SweetCodingInc hey bro can i PM you i have one more question of its ok.
Sweet Coding :)
@SweetCodingInc
Jan 28 2018 17:24
@artoodeeto sure
jusgoose
@gusd773
Jan 28 2018 20:12

does anybody know how to add a "well" element to my page?

I thought it was "<div class= "well" > " but I"m wrong per usual

Markus Kiili
@Masd925
Jan 28 2018 20:33
@gusd773 That should work with Bootstrap imported.
aRtoo
@artoodeeto
Jan 28 2018 20:34
hey fam got a question about git
help pleas
Tom
@moT01
Jan 28 2018 20:40
@artoodeeto just ask
aRtoo
@artoodeeto
Jan 28 2018 20:41
i want to create another branch on my project on git. ive been pushing into master, so i want to edit my JS file without pushing on the master branch. so
first what i did i created a branch named sgBranch
second i checkout the sgBranch so i could use it
third (shit part) i tried pushing it by git push origin sgBranch, i could push it. i havent forked the master because it wont let me

error says:
fatal: 'origin' does not appear to be a git repository
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.

and when i tried pushing like this git push sgBranch it says another error.

fatal: The current branch sgBranch has no upstream branch.
To push the current branch and set the remote as upstream, use

    git push --set-upstream sgBranch sgBranch

so when i tried pushing that way git push --setup-stream sgBranch sgBranch the error says

fatal: 'sgBranch' does not appear to be a git repository
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.
@moT01 there you go bro help
Tom
@moT01
Jan 28 2018 20:49
im not quite sure - that last command you typed has a typo
set-upstream not setup-stream
Marc Bradbury
@MarcBradbury
Jan 28 2018 20:51

Hey so i am kinda stuck on this page https://beta.freecodecamp.org/en/challenges/regular-expressions/reuse-patterns-using-capture-groups
my code is
/(\d*)\s\1\s\1/;

I am sure its something really dumb but i can't figure out how to get it passed the last test "Your regex should not match "42 42 42 42"." any help would be huge thanks.

alpox
@alpox
Jan 28 2018 20:57
@MarcBradbury This matches 42 42 42 42 because your pattern can match a subset of that string - as example the first 3 42 or the last 3 42.
You can prevent that by adding boundaries - a boundary for the beginning of the string and a boundary for the end of the string - namely ^ and $
aRtoo
@artoodeeto
Jan 28 2018 21:01
@moT01 its a typo bro but thanks i got it now. i read a documetation
CamperBot
@camperbot
Jan 28 2018 21:01
artoodeeto sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 968 | @mot01 |http://www.freecodecamp.org/mot01
Marc Bradbury
@MarcBradbury
Jan 28 2018 21:03
@alpox I figured that was the issue tbh i've been trying to limit it to only match 3 but I am not sure how I honestly don't think boundries were mentioned yet... so i am even more confused and the MDN doesn't seem that useful...
in this particular circumstance anyway
alpox
@alpox
Jan 28 2018 21:05
@MarcBradbury It is possible that the beta fcc is not that thorough yet - its still in beta :-)
Marc Bradbury
@MarcBradbury
Jan 28 2018 21:06
yes I have found a few issues with this and the ES6 section where the answers require info that they don't teach you till later... and alot of the ES6 area is poorly worded... so idk.
xD
thanks @alpox
CamperBot
@camperbot
Jan 28 2018 21:06
marcbradbury sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
:star2: 1529 | @alpox |http://www.freecodecamp.org/alpox
alpox
@alpox
Jan 28 2018 21:06
@MarcBradbury I now see though that it was there
DistinctWolf
@DistinctWolf
Jan 28 2018 21:06
I'm doing this reactjs to-do list and I have a list which has font awesome inside the li and which that font awesome is clicked I need a way to find the reference to the li element, so I can delete it, how would I do that
Marc Bradbury
@MarcBradbury
Jan 28 2018 21:07
@alpox so you are saying i missed it? xD
They come before it
@MarcBradbury Either that or you forgot them again :D
DistinctWolf
@DistinctWolf
Jan 28 2018 21:08
@alpox how you doing man
alpox
@alpox
Jan 28 2018 21:09
@FlashHero :wave: good, good :D got some holidays now finally and am chillin :D
DistinctWolf
@DistinctWolf
Jan 28 2018 21:09
nice
Marc Bradbury
@MarcBradbury
Jan 28 2018 21:09
ahh no i do remember those i am just confused on how to use them in this particular situation... i am pretty sure its just me derping thanks for all the help!
alpox
@alpox
Jan 28 2018 21:09
@MarcBradbury I'm sure you will figure out :-) np
Marc Bradbury
@MarcBradbury
Jan 28 2018 21:10
yeah i got it xD i just dont really understand why LOL! gonna go read on it xD
alpox
@alpox
Jan 28 2018 21:11
@FlashHero The li element should be created through some component state. The click on the icon should trigger a state change in your component (Removing an element from the state) which triggers a rerender (update) of the DOM.
Marc Bradbury
@MarcBradbury
Jan 28 2018 21:11
oh.. derrrrr thanks xD i am dumb
alpox
@alpox
Jan 28 2018 21:11
@FlashHero So there is no need for a reference to the li :-)
@MarcBradbury No problem :D happy coding!
DistinctWolf
@DistinctWolf
Jan 28 2018 21:14
@alpox yeah but wouldn't I need a way to point to that li element when creating the function to actually delete it
alpox
@alpox
Jan 28 2018 21:14
@FlashHero No, there is no need to point to the li element at all
Your render function defines the DOM which will be represented on the page. It gets rerendered - redrawn - as soon as your state changes. So what is on the page is only a representation of your state - so is the li element.
If the entry is not represented in the state anymore, the component will be rerendered and the li element will disappear.
DistinctWolf
@DistinctWolf
Jan 28 2018 21:16

@alpox

<li key={i.toString()}>{object}<Delete delete={this.props.delete}/><Edit edit={this.props.edit}/></li>

This is the li creating through .map and it has two component Delete and Edit

alpox
@alpox
Jan 28 2018 21:16
Yes, and on what do you do the .map? ;-)
DistinctWolf
@DistinctWolf
Jan 28 2018 21:17
the current state
alpox
@alpox
Jan 28 2018 21:17
Yep.
If you remove an element from that state
The li element will be gone
DistinctWolf
@DistinctWolf
Jan 28 2018 21:18
but I'd need an index ?
alpox
@alpox
Jan 28 2018 21:18
I can explain more precisely if you can show more of your code :D
Yes, the index is something you would indeed need, otherwise you don't know which element should be deleted
DistinctWolf
@DistinctWolf
Jan 28 2018 21:19
ok so how would I get that index through props ?
alpox
@alpox
Jan 28 2018 21:19
ofc. you can just pass it as:
<Delete delete={() => this.props.delete(i)} />
To the delete function
DistinctWolf
@DistinctWolf
Jan 28 2018 21:21
oh ok I get it, so just pass the index
alpox
@alpox
Jan 28 2018 21:21
yep
DistinctWolf
@DistinctWolf
Jan 28 2018 21:21
@alpox thanks man
CamperBot
@camperbot
Jan 28 2018 21:21
flashhero sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
:star2: 1530 | @alpox |http://www.freecodecamp.org/alpox
alpox
@alpox
Jan 28 2018 21:21
Well you create inline a new function which calls itself the delete function directly with the index which is in scope
np :-)
DistinctWolf
@DistinctWolf
Jan 28 2018 21:23
:+1:
aRtoo
@artoodeeto
Jan 28 2018 21:54
hey fam how can i embed this video on my simon game?
https://www.youtube.com/watch?v=u6vWcuys6jc
aRtoo
@artoodeeto
Jan 28 2018 22:23
@DanLaff thanks bro. youre the good
CamperBot
@camperbot
Jan 28 2018 22:23
artoodeeto sends brownie points to @danlaff :sparkles: :thumbsup: :sparkles:
api offline
aRtoo
@artoodeeto
Jan 28 2018 22:23
goat i mean
@DanLaff haha. bro i just need the mp3. any idea where to host this?
@DanLaff master i mean GOAT1
aRtoo
@artoodeeto
Jan 28 2018 22:29
@DanLaff im not bro. really i wanted this to be in mp3 like this.
https://s3.amazonaws.com/freecodecamp/simonSound2.mp3
aRtoo
@artoodeeto
Jan 28 2018 22:46

hey bros how do you host a mp3 like this
https://s3.amazonaws.com/freecodecamp/simonSound2.mp3

like i could use just the link ti embed as mp3

Mr. Frosty
@BinaryKing
Jan 28 2018 23:46
hello
How do I keep running this loop until the length of boss array is equal to 0?
function getBossOrder(boss) {
var result = []
var start = {};

for(var i = 0; i<boss.length; i++){

  if(boss[i].difficulty === 1){
    start = boss[i]
    result.push(boss[i].name)
    delete boss[i]

  }else if(start.weapon === boss[i].weakness){
    start = boss[i]
    result.push(boss[i].name)
    delete boss[i]

  }

}
return result

}