These are chat archives for FreeCodeCamp/HelpFrontEnd

23rd
Jun 2018
buiphuking
@buiphuking
Jun 23 2018 04:14

hi guys, can i ask something?
i have

<p>Hi</p> i set color: black;
i want to change color: red each 5 seconds between black and red; how can i do that?

Dhaval Vira
@dhavalveera
Jun 23 2018 04:16
means
?
buiphuking
@buiphuking
Jun 23 2018 04:21
i have the answer, thanks guys
mpmaan
@mpmaan
Jun 23 2018 05:51
if arr=[1,2,3] then doing arr.slice().splice(1,1) will mutate arr?
Aditya
@ezioda004
Jun 23 2018 06:55
@mpmaan It'll make a new copy and mutate that copy, but it wont mutate arr.
mpmaan
@mpmaan
Jun 23 2018 06:57
@ezioda004 if you are in helpJavascript room, will you look into my problem..otherwise i'll be repeating same thing in 2 rooms
Dany Din
@danydin
Jun 23 2018 08:14
hey does someone want to work on a website with me?
Dhaval Vira
@dhavalveera
Jun 23 2018 08:15
Yes, I can help @danydin
Mandeep Sharma
@mandeephub
Jun 23 2018 10:43
Needing help with marquee
Dhaval Vira
@dhavalveera
Jun 23 2018 10:44
what help you need with Marquee
Mandeep Sharma
@mandeephub
Jun 23 2018 11:03
I want to make it continues
Have a look at www.esicindia.online
Dhaval Vira
@dhavalveera
Jun 23 2018 11:04
just use <marquee></marquee>
it will work continusaly
Mandeep Sharma
@mandeephub
Jun 23 2018 11:11
I'm using direction up but that is creating a big gap I want to remove that
Dhaval Vira
@dhavalveera
Jun 23 2018 11:12
what direction you need
Default or Up Ditection
Mandeep Sharma
@mandeephub
Jun 23 2018 11:17
Im needing up direction
But it creates a gap at last i want to remove that and make marquee moving continues without any gap
Dhaval Vira
@dhavalveera
Jun 23 2018 11:18
then it will take gap as per requirement
set default then it will not take more gap
B.Oussama
@0usssama
Jun 23 2018 12:44
hello,
this is my survey challenge i don't know if it's a bug or a mistake i have 15/17 on the test, can you help me with a fix thnx,
https://codepen.io/B-oussama/full/gKKRRX/
Tom
@moT01
Jun 23 2018 13:26
@0usssama the user stories say that those fields are required
fix that and it should pass
B.Oussama
@0usssama
Jun 23 2018 13:29
@moT01 thank you man, it works ! :D
Tom
@moT01
Jun 23 2018 13:31
@0usssama :thumbsup: although I had issues with the group of checkboxes
B.Oussama
@0usssama
Jun 23 2018 13:34
@moT01 how where exactly ?
Tom
@moT01
Jun 23 2018 13:34
try and click the checkboxes
B.Oussama
@0usssama
Jun 23 2018 13:35
Tom
@moT01
Jun 23 2018 13:36
really
well, it's not working for me cause of duplicate id's on the checkboxes and the for property on the labels
you must have fixed it?
oh - it's when you click the text and not the actual checkbox
you must have copy/pasted those inputs and didn't change the those properties
B.Oussama
@0usssama
Jun 23 2018 13:40
@moT01 hhhhhhhhh oh god didnt fix it hhhh i fixed the 4 above didnt continue hhh dont know why
@moT01 lesson learned thnx again :D
mpmaan
@mpmaan
Jun 23 2018 14:11
what is glitch(glitch.com) ?
Tom
@moT01
Jun 23 2018 14:17
@mpmaan a place to build some projects
kinda like codepen
but you can use node
mpmaan
@mpmaan
Jun 23 2018 14:18
so i can see my project live even with backend?
Tom
@moT01
Jun 23 2018 14:19
yes
Lisa Copeland
@lisacopeland
Jun 23 2018 14:25
@moT01 Hi
Tom
@moT01
Jun 23 2018 14:32
hey @lisacopeland
Lisa Copeland
@lisacopeland
Jun 23 2018 14:33
@moT01 Hows it goin
Tom
@moT01
Jun 23 2018 14:33
good - how are you
Lisa Copeland
@lisacopeland
Jun 23 2018 14:33
pretty good - my code is going through some growing pains as I try to break it up into feature modules
Tom
@moT01
Jun 23 2018 14:36
whatcha workin on?
Lisa Copeland
@lisacopeland
Jun 23 2018 14:40
I am working on an angular 5 front-end app for a start up
how about you?
Tom
@moT01
Jun 23 2018 14:42
nothing
Lisa Copeland
@lisacopeland
Jun 23 2018 14:42
are you taking a class?
Tom
@moT01
Jun 23 2018 14:43
nope
just helping people with their bugs
Lisa Copeland
@lisacopeland
Jun 23 2018 14:43
It's good to take a break now and then
Tom
@moT01
Jun 23 2018 14:43
thats a nice spin
Lisa Copeland
@lisacopeland
Jun 23 2018 14:44
do you want to work on something?
Or learn something new?
Tom
@moT01
Jun 23 2018 14:44
i need a designer to make a layout for a portfolio for me since I really suck at design
ive been contributing to the fcc repos - with a number of things I want to fix but im waiting on a different fix for me to be able to work on stuff
Lisa Copeland
@lisacopeland
Jun 23 2018 14:45
you should check out Erik Kennedy - I feel the same way about design but he has some great stuff on Medium and on his own blog that I think helps alot
Tom
@moT01
Jun 23 2018 14:45
a number of other things I have in the viewfinder
home server with my raspberry pi is on the list
here - did this recently - http://fish-finder.glitch.me/ - how is it
Lisa Copeland
@lisacopeland
Jun 23 2018 14:49
Wow - that's pretty cool! What did you write it in
Tom
@moT01
Jun 23 2018 14:50
just javascript
couple libraries
lotta pre project data collection and analysis
Lisa Copeland
@lisacopeland
Jun 23 2018 14:51
Nice - do you want to do front end or back end development?
Tom
@moT01
Jun 23 2018 14:52
probly back end in the long run
Lisa Copeland
@lisacopeland
Jun 23 2018 14:52
have you done nodeJS or Python?
Tom
@moT01
Jun 23 2018 14:53
yes - ive done plenty of node
no python
Lisa Copeland
@lisacopeland
Jun 23 2018 14:54
well if you decide to work on your portfolio and you need eyes on it - let me know!
Tom
@moT01
Jun 23 2018 14:55
i will
is there anything specific about erik you could point me to
i can look up design advice all over - but i just dont have that visual creativity in me - that's why I would chose backend
Omar Tan
@wheelhot
Jun 23 2018 15:23

HTML

<input type="text" id="name" name="name" placeholder="Enter your name" required>

JS

var name = document.getElementById('name')
name.addEventListener('click', function () {
  console.log('clicked!')
})

Why doesn't this work? I get the error "Uncaught Type Error: name.addEventListener is not a function"

The external JS script is added right before the </body> tag

Christopher McCormack
@cmccormack
Jun 23 2018 15:29
@wheelhot is your javascript loaded prior to your html being rendered to the DOM?
Omar Tan
@wheelhot
Jun 23 2018 15:35
It's rendered after
cause I put the script tag right before the </body> tag
Scratching my head why it's not working :/
Omar Tan
@wheelhot
Jun 23 2018 15:40
ooh, somehow it has to do with the variable name
Christopher McCormack
@cmccormack
Jun 23 2018 15:40
Try wrapping it anyway:
document.addEventListener("DOMContentLoaded", function(event) {
  var name = document.getElementById('name')
  name.addEventListener('click', function () {
    console.log('clicked!')
  })
});
Omar Tan
@wheelhot
Jun 23 2018 15:40
name is somehow reserved?
I changed to var name to var userName
and that seemed to work
Christopher McCormack
@cmccormack
Jun 23 2018 15:41
yeah that might be it, it may be on the global object
Omar Tan
@wheelhot
Jun 23 2018 15:41
interesting, never expected name to be a global object
Christopher McCormack
@cmccormack
Jun 23 2018 15:42
it's a property of the global object it looks like
Omar Tan
@wheelhot
Jun 23 2018 15:43
how do you find this info, I tried googling but can't seem to find it
mpmaan
@mpmaan
Jun 23 2018 15:43
yeah..that's interesting because using window.onload also worked
name is a property of window object
@cmccormack can you explain a bit more why it was not working
Christopher McCormack
@cmccormack
Jun 23 2018 15:45

I personally just did

console.log(name)

and because it actually gave me a value I assumed it was a property of the global object

you can log the global object and see all the values
Omar Tan
@wheelhot
Jun 23 2018 15:46
aah, never thought of using console.log in that way
thanks!
learning something new everyday! LD
:D
Christopher McCormack
@cmccormack
Jun 23 2018 15:46
use it for everything!
mpmaan
@mpmaan
Jun 23 2018 15:46
what's the global object?
Christopher McCormack
@cmccormack
Jun 23 2018 15:47
@mpmaan sorry why what isn't working? name?
Moisés Man
@moigithub
Jun 23 2018 15:47
window @mpmaan
Christopher McCormack
@cmccormack
Jun 23 2018 15:47
@mpmaan https://developer.mozilla.org/en-US/docs/Glossary/Global_object this is very helpful as it can be different depending on the environment
mpmaan
@mpmaan
Jun 23 2018 15:47
thanks @cmccormack @moigithub
Moisés Man
@moigithub
Jun 23 2018 15:57
u can use console.dir instead of console.log
to list properties/methods if log doesnt shows
mpmaan
@mpmaan
Jun 23 2018 15:58
the challenge says
Next, the onreadystatechange event listener handles a change in the state of the request. A readyState of 4 means the operation is complete, and a status of 200 means it was a successful request.
which operation has been completed?
req=new XMLHttpRequest();
req.open("POST",url,true);
req.setRequestHeader('Content-Type','text/plain');
req.onreadystatechange=function(){
  if(req.readyState==4 && req.status==200){
    document.getElementsByClassName('message')[0].innerHTML=req.responseText;
  }
};
req.send(userName);
also at whixh url do we need to create request?
Christopher McCormack
@cmccormack
Jun 23 2018 16:03
I believe the operation is the loading of the remote URL but I'm not 100%
Christopher McCormack
@cmccormack
Jun 23 2018 16:13
@mpmaan no idea what the url should be, was there another url in a previous exercise?
mpmaan
@mpmaan
Jun 23 2018 16:14
there was ../json/cats.json but this won't work
using a variable worked url
like req.open('POST", url, true)
Christopher McCormack
@cmccormack
Jun 23 2018 16:17
yeah they must be passing it so they can use whatever url they want in the tests
mpmaan
@mpmaan
Jun 23 2018 16:19
i checked the test cases in github repo and one of them was a regex text where the regex included url that's why i thought this should work
David Vondrovic
@sindat
Jun 23 2018 17:35
hey guys
ive completed everything required for a certification
every challenge
yet it still says i havent
when i want to claim my certification
anyone else having this problem?
Stephen
@stephepush
Jun 23 2018 17:38
So I’m working through ES6: Use Destructuring assignment to pass an object as a functions parameters
And the console logs at the end are returning the correct numbers with my code:
const stats = {
  max: 56.78,
  standard_deviation: 4.34,
  median: 34.54,
  mode: 23.87,
  min: -0.75,
  average: 35.85
};
const half = (function() {
  "use strict"; // do not change this line

  // change code below this line
  return function half(stats) {
    const { max, standard_deviation, median, mode, min, average } = stats;
    return (stats.max + stats.min) / 2.0;
  };
  // change code above this line

})();
console.log(stats); // should be object
console.log(half(stats)); // should be 28.015
So I don’t understand what I need to do...
Aditya
@ezioda004
Jun 23 2018 17:44
@stephepush You arent using destructuring on function parameters, check this example
const profileUpdate = ({ name, age, nationality, location }) => {
  /* do something with these fields */
}
You need to use destructuring here function half(stats) where stat is.
And use those variables to find the average.
Stephen
@stephepush
Jun 23 2018 17:45
Oh...
They challenge isn’t really clear
the*
Thanks though, Aditya
Aditya
@ezioda004
Jun 23 2018 17:46
Yes, these destructuring challenges in particular are confusing, especially that str.length one.
Stephen
@stephepush
Jun 23 2018 17:59
Either I don’t remember that one or I haven’t gotten to it yet...
Mandeep Sharma
@mandeephub
Jun 23 2018 18:42
hello to all
<audio id="my_clip" controls>
<source src="https://s3.amazonaws.com/freecodecamp/screen-reader.mp3" type="audio/mpeg"/>
</audio>
it is showing error "CLOSE AUDIO TAG BUT ITS ALREADY CLOSED"
include*engine
@newtothat
Jun 23 2018 19:32
in case if you are looking for
include*engine
@newtothat
Jun 23 2018 19:50
im learning git right now and im getting this MING32 ~ (master)
i tried to go backwards and forwards but i stuck in MING32 ~(master)
can anyone help how to get out of there using git bash
Christopher McCormack
@cmccormack
Jun 23 2018 19:52
@newtothat are you trying to go up a directory, or into a directory?
include*engine
@newtothat
Jun 23 2018 19:52
i went back like so cd ~
now im trying cd pc-user
and i get 'bash: cd: pc-user: No such file or directory'
Christopher McCormack
@cmccormack
Jun 23 2018 19:53
type ls to see what directories are avaialble
include*engine
@newtothat
Jun 23 2018 19:56
for free code.png
Christopher McCormack
@cmccormack
Jun 23 2018 19:57
just ls not cd ls
include*engine
@newtothat
Jun 23 2018 19:57
ohh ok
Christopher McCormack
@cmccormack
Jun 23 2018 19:57
ls lists files and directories, cd is change directory
include*engine
@newtothat
Jun 23 2018 19:58
ohh i got a lot of colorful text lol
@cmccormack thanks Cryss
Christopher McCormack
@cmccormack
Jun 23 2018 19:58
haha
include*engine
@newtothat
Jun 23 2018 19:58
tell me
once i used this cd ~
how i go forward?
Christopher McCormack
@cmccormack
Jun 23 2018 19:59
well going forward in this context would mean going into a directory with the ~ directory
Just in case you don't know, ~ is a shortcut for your a user's home directory, usually something like /Users/[username]
so when you did cd ~ you went to the home directory. You can confirm this by typing pwd (print working directory)
~ is convenient if you store all of your personal files/projects in your home directory
so if you have a folder inside your home directory, say a folder called my_stuff, you can enter that folder by typing cd ~/my_stuff, or if you're already in your home directory just cd my_stuff
include*engine
@newtothat
Jun 23 2018 20:03
home directory is like user's stuff for example like windows account user?
Christopher McCormack
@cmccormack
Jun 23 2018 20:04
correct
You'll find some config files in there by default, and maybe a few other files
include*engine
@newtothat
Jun 23 2018 20:05
Ok Chryss you helped a lot .without knowing it i couldnt continue tutorial from youtube for about 10 days lol
Christopher McCormack
@cmccormack
Jun 23 2018 20:05
but being able to type cd ~ makes it a convenient place to add your files/directories
NP if you have more command line questions feel free to direct message me
include*engine
@newtothat
Jun 23 2018 20:06
ohh ill keep that in mind
ok I will
thanks a lot man
Christopher McCormack
@cmccormack
Jun 23 2018 20:07
np
DarkxPunk
@DarkxPunk
Jun 23 2018 20:07
Hey hey hey
Christopher McCormack
@cmccormack
Jun 23 2018 20:07
hi
DarkxPunk
@DarkxPunk
Jun 23 2018 20:07
Any designers around?
Christopher McCormack
@cmccormack
Jun 23 2018 20:08
heh it might depend on the question who might be able to answer that in the affirmative
DarkxPunk
@DarkxPunk
Jun 23 2018 20:10
Well anyone who has creativity in regards to design XD
Hey guys, how can I assign an id or class to these colors?
DarkxPunk
@DarkxPunk
Jun 23 2018 20:20
You can’t with how you designed it
Christopher McCormack
@cmccormack
Jun 23 2018 20:21
yeah better to split that out into separate elements
Uriel Guzmán
@Burinson
Jun 23 2018 20:21
How?
Christopher McCormack
@cmccormack
Jun 23 2018 20:21
you can do 4 divs in a box shape and apply border radius to one corner, that's one thought
Uriel Guzmán
@Burinson
Jun 23 2018 20:21
Okay, I'll give it a try, thanks
include*engine
@newtothat
Jun 23 2018 20:26
can't you use vars in css?
Christopher McCormack
@cmccormack
Jun 23 2018 20:31
@Burinson I wanted to see how to do it myself so mocked this up, let me know if it helps
Uriel Guzmán
@Burinson
Jun 23 2018 20:35
@cmccormack Yeah, that's how I wanted it
How did you make the black circle though_
?
Christopher McCormack
@cmccormack
Jun 23 2018 20:36
@Burinson using absolute positioning. You can see all the CSS in the pen
basically you set the black div as absolute (parent must be relative I believe) then set the left and top to 50%, and translate the position by -50% to get it perfectly centered
Uriel Guzmán
@Burinson
Jun 23 2018 20:38
Alright, thanks. Gonna try a bit
Uriel Guzmán
@Burinson
Jun 23 2018 20:43
https://codepen.io/Burinson/pen/NzaMpM?editors=1100 Why is it not getting centered?
include*engine
@newtothat
Jun 23 2018 20:47
maybe you should give
transform etc. to parent element ?
like so?
try with class .simon
Uriel Guzmán
@Burinson
Jun 23 2018 20:50
So what are the properties I will give to .simon?
Christopher McCormack
@cmccormack
Jun 23 2018 20:50
@Burinson don't use bootstrap rows if you aren't going to put them in the proper containers. Better not to use them at all
you may not even know bootstrap is messing up your display
Uriel Guzmán
@Burinson
Jun 23 2018 20:51
You're right. I did not know
Christopher McCormack
@cmccormack
Jun 23 2018 20:51
Also I think if the parents don't have a specific size the absolute element may use a different parent
Christopher McCormack
@cmccormack
Jun 23 2018 21:32
@Burinson if you want to center your board on the page, I find this to be very useful:
html, body {
  width: 100%;
  height: 100%;
}

body { 
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}