These are chat archives for FreeCodeCamp/HelpFrontEnd

12th
Apr 2018
Brad
@bradtaniguchi
Apr 12 2018 00:01
@Ohshi60 You can do whatever you want, take a screenshot, paste, code, iframe your actual work in. Anything. If you take a screenshot you might need to use gimp/photoshop to format your image for your site. (make it smaller/crop it)
tonytrrr
@tonytrrr
Apr 12 2018 00:09
is there anyone here starting or already working on the tic-tac-toe project?
John Kuizon
@jkuizon
Apr 12 2018 00:22
hello!
Christopher McCormack
@cmccormack
Apr 12 2018 00:26
@jkuizon hiya
JoEezy
@JoEeeezy_twitter
Apr 12 2018 00:32
what's the equivalent of return array.filter(item => item == what).length; in es5?
Christopher McCormack
@cmccormack
Apr 12 2018 00:34
@JoEeeezy_twitter pass an anonymous function or callback instead
JoEezy
@JoEeeezy_twitter
Apr 12 2018 00:35
@cmccormack how would i write (item == what).length ?
Christopher McCormack
@cmccormack
Apr 12 2018 00:35
.length is a method of array
return array.filter(function(item) { return item === what; }).length;
JoEezy
@JoEeeezy_twitter
Apr 12 2018 00:37
oooh.. so it's not even part of the function then
@cmccormack makes much more sense ty
CamperBot
@camperbot
Apr 12 2018 00:37
joeeeezy_twitter sends brownie points to @cmccormack :sparkles: :thumbsup: :sparkles:
:star2: 1412 | @cmccormack |http://www.freecodecamp.org/cmccormack
Christopher McCormack
@cmccormack
Apr 12 2018 00:37
np
include*engine
@newtothat
Apr 12 2018 00:47
when employers ask you for cv what exactly they expect from you in that cv?
Michael S
@Ohshi60
Apr 12 2018 00:49
education, past employment, recommendations, skills
TrendsDVSN
@TrendsDVSN
Apr 12 2018 00:57
Hi guys! Just signed up yesterday. Excited to learn coding.
Just beginning my Tribute Site. Anyone able to point me to any materials to study/help retain the material? I feel like it is easy to breeze through the teaching and I would like to see how to make it stick in my memory without having to look everything up.
Norvin Burrus
@ndburrus
Apr 12 2018 01:07
@TrendsDVSN welcome aboard! glad to see you here :+1: i think repetition helps... i try to reinforce the material with other sources - reading, YouTube videos, podcasts, etc. :)
TrendsDVSN
@TrendsDVSN
Apr 12 2018 01:07
Thanks!
Norvin Burrus
@ndburrus
Apr 12 2018 01:07
@TrendsDVSN your'e welcome! what subject are you looking to bolster? html, css, bootstrap, jquery, javascript...?
TrendsDVSN
@TrendsDVSN
Apr 12 2018 01:08
Nothing in particular. Just my second day into coding. I'm guessing it's gonna take a lot of time to ingrain
Norvin Burrus
@ndburrus
Apr 12 2018 01:09
@TrendsDVSN it sounds like you're doing very well.. :fire: there are tons of resources available...
you might enjoy these: :)
TrendsDVSN
@TrendsDVSN
Apr 12 2018 01:10
https://codepen.io/TrendsDVSN/pen/bvJpBj Been on this for about 10ish minutes
John Kuizon
@jkuizon
Apr 12 2018 01:10
Hello everyone! I'm new here. is the "general" room for gitter not available anymore? :)
abraham anak agung
@padunk
Apr 12 2018 01:12
@jkuizon Hello, the general room is already retired .
John Kuizon
@jkuizon
Apr 12 2018 01:13
@padunk Where do you guys post/chat about career related stuff?
abraham anak agung
@padunk
Apr 12 2018 01:15
@jkuizon in the forum i suggest.
Norvin Burrus
@ndburrus
Apr 12 2018 01:16
@jkuizon ...some background info: :sparkles:
  • freeCodeCamp/freeCodeCamp#15581
@TrendsDVSN ...provided some :point_up: sources...
TrendsDVSN
@TrendsDVSN
Apr 12 2018 01:23
Great!
Ty
Brad
@bradtaniguchi
Apr 12 2018 01:24
@jkuizon The room was removed a week or so ago
Norvin Burrus
@ndburrus
Apr 12 2018 01:26
@TrendsDVSN you're welcome! :sparkles:
Steven Muniz
@smuniz18
Apr 12 2018 01:27
Hey Guys
abraham anak agung
@padunk
Apr 12 2018 01:31
@smuniz18 :wave:
TrendsDVSN
@TrendsDVSN
Apr 12 2018 01:33
https://codepen.io/TrendsDVSN/pen/bvJpBj Think this is good enough? Anything I should attempt to add on/correct before I move to the next assignment?
Terry Reynolds
@terryjreynolds
Apr 12 2018 01:51
Can someone point me toward a good resource for learning how to use GitHub?
Michael S
@Ohshi60
Apr 12 2018 01:51
@beowulfskin you need help with github or Git?
Terry Reynolds
@terryjreynolds
Apr 12 2018 01:52
I must really need help. I don't know the difference...
Michael S
@Ohshi60
Apr 12 2018 01:52
git is the technology, there is a course on codecademy :)
Terry Reynolds
@terryjreynolds
Apr 12 2018 01:53
I'll look at it. Thanks.
Dhaval Vira
@dhavalveera
Apr 12 2018 01:53
@beowulfskin on GitHub you can deploy any HTML, CSS & JS Files to share everyone how your Website Look like & Git you can Deploy any PHP, NodeJS Files
Michael S
@Ohshi60
Apr 12 2018 01:54
@dhavalveera that is nonsense sorry :)
Dhaval Vira
@dhavalveera
Apr 12 2018 01:54
@Ohshi60 then why you said that you don't the difference
if it is nonsense then
Michael S
@Ohshi60
Apr 12 2018 01:55
@beowulfskin git is the technology, which is basically a version control system. Github is a service provider
Dhaval Vira
@dhavalveera
Apr 12 2018 01:55
only this is not enough
more info is required
Michael S
@Ohshi60
Apr 12 2018 01:55
@dhavalveera github for html css and js and git for phph and nodeJS? that is utter nonsense
Dhaval Vira
@dhavalveera
Apr 12 2018 01:55
it is for you
Michael S
@Ohshi60
Apr 12 2018 01:56
no its simple!
Dhaval Vira
@dhavalveera
Apr 12 2018 01:56
find on here
CamperBot
@camperbot
Apr 12 2018 01:56
find on here
nothing found
Dhaval Vira
@dhavalveera
Apr 12 2018 01:56
there too many people don't know what is the use of GitHub
Terry Reynolds
@terryjreynolds
Apr 12 2018 01:56
@Ohshi60 @dhavalveera I think it is GitHub that I need to learn about. I'll check out codecademy. Maybe there's a medium article...idk
Michael S
@Ohshi60
Apr 12 2018 01:57
@beowulfskin hi Terry. You learn git and then use a site like github or gitlab or whatever as a service provider. So i would recommend you start with the course on codecademy :)
Dhaval Vira
@dhavalveera
Apr 12 2018 01:57
@beowulfskin Sir I mean to say that there are lot of people are here who don't know exactly how to use GitHub, so normally I just clarify that, so anyone who don't know the Use of GitHub they will get Information for this
Terry Reynolds
@terryjreynolds
Apr 12 2018 01:59
@Ohshi60 navigating there right now. Thanks again.
CamperBot
@camperbot
Apr 12 2018 01:59
beowulfskin sends brownie points to @ohshi60 :sparkles: :thumbsup: :sparkles:
:cookie: 169 | @ohshi60 |http://www.freecodecamp.org/ohshi60
John Kuizon
@jkuizon
Apr 12 2018 02:13
@padunk @ndburrus @bradtaniguchi thanks!
CamperBot
@camperbot
Apr 12 2018 02:13
jkuizon sends brownie points to @padunk and @ndburrus and @bradtaniguchi :sparkles: :thumbsup: :sparkles:
:cookie: 485 | @padunk |http://www.freecodecamp.org/padunk
:star2: 2202 | @ndburrus |http://www.freecodecamp.org/ndburrus
:cookie: 455 | @bradtaniguchi |http://www.freecodecamp.org/bradtaniguchi
Norvin Burrus
@ndburrus
Apr 12 2018 02:14
@jkuizon you're welcome! :+1:
Claudio Restifo
@Marmiz
Apr 12 2018 04:39

@beowulfskin just to make a clarification:

  • git: a version control language created by Linus Torvalds (yes, the creator of the Linux kernel).
    its purpose is to keep track of changes on files, thus used to but not limited to, manage source code in software development.
  • GitHub: a web based hosting provider that uses git to provide versioning control. Plus it adds its own feature like bug tracking, feature requests....

There are other web-based provider that provides version controls besides github, another popular one is Bitbucket for example.

Make sense? :+1:

Darren
@DarrenfJ
Apr 12 2018 05:37
@beowulfskin my goto for GitHub when I was first learning it: GitHub for Noobs plus the DevTips vids are fun too
@coderNewby got your PM
coderNewby
@coderNewby
Apr 12 2018 05:38
thanks @DarrenfJ
CamperBot
@camperbot
Apr 12 2018 05:38
codernewby sends brownie points to @darrenfj :sparkles: :thumbsup: :sparkles:
:star2: 2459 | @darrenfj |http://www.freecodecamp.org/darrenfj
coderNewby
@coderNewby
Apr 12 2018 05:39
that looks like a good vid too
Markus Kiili
@Masd925
Apr 12 2018 05:47
@n1zzy
function sumPrimes(num) {
  var primes = [];
  for (var i=2; i<=num; i++) {
    if (primes.every(function(prime){
      return i%prime!==0;
    })) primes.push(i);
  }
  return primes.reduce(function(prev,curr){
    return prev+curr;
  });
}
kirbyedy
@kirbyedy
Apr 12 2018 06:40
that is nice, I just checked my account, and all the solutions are gone :worried:
wanted to see how I did this sumPrimes challenge
Markus Kiili
@Masd925
Apr 12 2018 06:46
@kirbyedy They should be there if you check them from code portfolio (clicking your avatar).
kirbyedy
@kirbyedy
Apr 12 2018 06:48
ou right, I see it now, I went to the challenge page instead of my profile page, I guess things have changed :)
thank you @Masd925
CamperBot
@camperbot
Apr 12 2018 06:48
kirbyedy sends brownie points to @masd925 :sparkles: :thumbsup: :sparkles:
:star2: 4776 | @masd925 |http://www.freecodecamp.org/masd925
n1zzy
@n1zzy
Apr 12 2018 07:16
@Masd925 oh now I understand...well that looks kinda advanced for me, but thanks for sharing
Markus Kiili
@Masd925
Apr 12 2018 07:19
@n1zzy Also take note that that solution is somewhere between brute force and really efficient solution. Sieve of Erastothenes is about as simple as that solution, but much more efficient.
n1zzy
@n1zzy
Apr 12 2018 07:26
@Masd925 as I understand from what you're saying you can somehow benchmark your code's performance?
Markus Kiili
@Masd925
Apr 12 2018 07:29
@n1zzy Algorithms can be classified by how the number of significant operations behaves as the size of the input data raises (Big O notation). You can approximate it by looking at the code yourself. For known problems, you can find information about such things by googling. It is also possible to test it by running the code repeatedly on the browser or using a benchmark site like jsperf.
n1zzy
@n1zzy
Apr 12 2018 07:47
@Masd925 wow this is awesome! I've just compared my code against yours and it seems mine is faster but yours does less operations per second, this doesn't seem right
https://jsperf.com/sumprimestest1
n1zzy
@n1zzy
Apr 12 2018 08:05
also I really don't understand this https://en.wikipedia.org/wiki/Sieve_of_Eratosthenes
Input: an integer n > 1.

 Let A be an array of Boolean values, indexed by integers 2 to n,
 initially all set to true.

 for i = 2, 3, 4, ..., not exceeding √n:
   if A[i] is true:
     for j = i2, i2+i, i2+2i, i2+3i, ..., not exceeding n:
       A[j] := false.

 Output: all i such that A[i] is true.
 Let A be an array of Boolean values, indexed by integers 2 to n,
 initially all set to true.
so A[0] and A[1] are left empty? why?
Markus Kiili
@Masd925
Apr 12 2018 08:38
@n1zzy 0 and 1 are not primes.
We mark all numbers 2,3,... as possible primes and exclude multiples of 2, multiples of 3, etc and that way what are left are the primes.
Square root limit means that if we are looking at primes up to 100, we only have to exclude multiples of numbers 2,3,4,5,6,7,8,9,10. Why the limit works is not very easy to prove if I remember correctly.
Edwin Rifa
@EdwinSilvaDK
Apr 12 2018 08:43
I´m not on how to use the rxjs observable to make a call every 2min to the rest api
n1zzy
@n1zzy
Apr 12 2018 09:06

@Masd925 here is my attempt at recreating sieve of Eratosthenes in JS:

function sumPrimes(num) {
var A = [];
var y = 1;
var final_arr = [];
for (var k = 2; k <= num; k++) {
    A[k] = true;
}
for (var i = 2; i < Math.sqrt(num); i++) {
    if (A[i]) {
        for (var j = Math.pow(i,2); j < num; j = Math.pow(i,2) + y*i) {
            A[j] = false;
            y++;
        }
    }
}
for (k = 0; k < A.length; k++) {
    if (A[k]) {
        final_arr.push(k);
    }
}
console.log(final_arr);
}

it seems I've messed something 'cuz it doesn't work...

Markus Kiili
@Masd925
Apr 12 2018 09:10
@n1zzy I have an implementation that is much simpler. I can show it if you can't get it to work.
n1zzy
@n1zzy
Apr 12 2018 09:12
sure. leave it here and I'll have a look at it once I give up trying...
Markus Kiili
@Masd925
Apr 12 2018 09:14
function sumPrimes(num) {
    var sieve = [];
    var sqrt = Math.sqrt(num);
    for (var i=2;i<=sqrt;i++) {
        if (!sieve[i]) {
            for (var j=i*i;j<=num;j+=i) {
                sieve[j]=true;
            }
        }
    }
    var result=0;
    for (i=2;i<=num;i++) {
        if (!sieve[i]) result+=i;
    }
    return result;
}
Daniel Romero
@Ranacode
Apr 12 2018 09:20
I know this is not a frontend question but I want to do something in git that I don't know if it's possible
I have 3 branchs now (master,develop and a feature)
the thing is, I update the develop from my team last push and I want to include that changes on the feature that I'm working on
without deleting this branch and cloning a new one from this new develop
Daniel Romero
@Ranacode
Apr 12 2018 09:26
Nothing, I solved it, thanks by the wya
way*
Elia
@elia-russad
Apr 12 2018 09:28
u welcome
n1zzy
@n1zzy
Apr 12 2018 09:35

@Masd925 oh I see. I found out what I was doing wrong after looking at your code.

j = i2, i2+i, i2+2i, i2+3i, ...

this damn expression confused me...

Fernando L. Estuesta
@champolot
Apr 12 2018 11:31
hey
Stephen James
@sjames1958gm
Apr 12 2018 11:52
@champolot :wave:
Fernando L. Estuesta
@champolot
Apr 12 2018 12:17
can someone here could help me?
currently learning html tags
Markus Kiili
@Masd925
Apr 12 2018 12:17
@champolot Just post your question here.
You should have an ordered list for "Top 3 things cats hate:"
i got this code but IDK whats really the problem
<ol>
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
</ol>
ExpressyCode
@ExpressyCode
Apr 12 2018 12:18
Hey guys am doing the local weather project, I was just wondering if the https://fcc-weather-api.glitch.me/ only works in US? I'm in Sweden.
I get weird responseText back :/
Fernando L. Estuesta
@champolot
Apr 12 2018 12:20

Elia
@elia-russad
Apr 12 2018 12:27
@ExpressyCode works even in russia
what coords do u send?
ExpressyCode
@ExpressyCode
Apr 12 2018 12:38
I use

if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function (position) {
latitude = position.coords.latitude;
console.log(position.coords.latitude);
longitude = position.coords.longitude;
console.log(position.coords.longitude);

});

} else {
console.log("Geolocation is not supported by this browser.");
}

and get lat 61 long 14
Am getting shuzenji in Japan and response :worried:
as
look in console
Fernando L. Estuesta
@champolot
Apr 12 2018 12:46
eh?

hmmmfff
this is sad :(
Norvin Burrus
@ndburrus
Apr 12 2018 12:55
@champolot we need to: :sparkles:
  • provide the ordered list items for:
    The top 3 things cats hate
  • add an opening <ol> tag
Stephen James
@sjames1958gm
Apr 12 2018 12:56
@ExpressyCode There is a known bug in the FCC interface to openweather in that it sometimes returns a location in Japan
ExpressyCode
@ExpressyCode
Apr 12 2018 12:57
@sjames1958gm Okey, thanks for telling :+1:
CamperBot
@camperbot
Apr 12 2018 12:57
expressycode sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 9194 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
Fernando L. Estuesta
@champolot
Apr 12 2018 13:03
@ndburrus where do i add the opening tag it only requires 1 ol tag
Norvin Burrus
@ndburrus
Apr 12 2018 13:04

@champolot the opening and closing tags surround the list items... we have an opening <ol> tag, just change its' position
use the same format as the unordered list:

<p>Things cats love:</p>
     <ul>
          <li>cat nip</li>
          <li>laser pointers</li>
          <li>lasagna</li>
     </ul>

...make sense?

Fernando L. Estuesta
@champolot
Apr 12 2018 13:13
sorry no
<ol>
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
</ol>
i did that but error
tsk i got seen zoned
NikolaNbgd
@NikolaNbgd
Apr 12 2018 13:26
Hey guys, Im working on chat animations with slides, something like this https://ben.co/
Norvin Burrus
@ndburrus
Apr 12 2018 13:28

@champolot the opening ordered list tag <ol> should be placed before:

<p>Top 3 things cats hate:</p>
</ol>

then, the ordered list items should be placed inside the opening & closing list tags <li>, </li>

NikolaNbgd
@NikolaNbgd
Apr 12 2018 13:28
but I have a problem to make a chat animation
here is html
.slider_chat
    .owl-carousel
        .slideshow
            .chat1(style='visibility: hidden') 1
            .chat2(style='visibility: hidden') 2
            .chat3(style='visibility: hidden') 3
            .chat4(style='visibility: hidden') 4
        .slideshow
            .chat1(style='visibility: hidden') 5
            .chat2(style='visibility: hidden') 6
            .chat3(style='visibility: hidden') 7
            .chat4(style='visibility: hidden') 8
        .slideshow
            .chat1(style='visibility: hidden') 9
            .chat2(style='visibility: hidden') 10
            .chat3(style='visibility: hidden') 11
            .chat4(style='visibility: hidden') 12
        .slideshow
            .chat1(style='visibility: hidden') 13
            .chat2(style='visibility: hidden') 14
            .chat3(style='visibility: hidden') 15
            .chat4(style='visibility: hidden') 16
and this is JavaDamnScript
 let c1 = document.querySelectorAll(".chat1");
        let c2 = document.querySelectorAll(".chat2");
        let c3 = document.querySelectorAll(".chat3");
        let c4 = document.querySelectorAll(".chat4");
        let divs = [
            c1, c2, c3, c4
        ];
            let count = 0;
            let timer = null;
            let vis = "visible";
            let clearCycle = 0;

            timer = setInterval(function () {
                if (count === divs.length && !clearCycle) {
                    clearCycle = 2;
                } else if (clearCycle == 2) {
                    if (--clearCycle === 0) {
                        divs.forEach(ele => {ele.style.visibility = 'hidden'});
                        count = 0;
                    }

                } else {
                    divs.forEach(div => {
                        div[count++].style.visibility = vis;
                    })

                }


            }, 1000);
the problem is, when program is run, first div '1' is showing up, but then program skip next four elements, and shows 6 element
does anybody of you guys can help me with this?
Terry Reynolds
@terryjreynolds
Apr 12 2018 13:33
@Marmiz @DarrenfJ Thanks for the info. and explanation. Much appreciated.
CamperBot
@camperbot
Apr 12 2018 13:33
beowulfskin sends brownie points to @marmiz and @darrenfj :sparkles: :thumbsup: :sparkles:
:star2: 1206 | @marmiz |http://www.freecodecamp.org/marmiz
:star2: 2460 | @darrenfj |http://www.freecodecamp.org/darrenfj
Ken Haduch
@khaduch
Apr 12 2018 13:46
@NikolaNbgd - do you have a CodePen or other place to look at the code in action?
NikolaNbgd
@NikolaNbgd
Apr 12 2018 13:49
@khaduch actually this is a part of one big project, we can communicate via teamviewer, or skype if you want
@khaduch I can share my screen to you
Ken Haduch
@khaduch
Apr 12 2018 13:50
@NikolaNbgd - well, one problem is that you have multiple elements with the same class, which is fine, but I think that might be causing some issues with the way your code is working? Check your developer console and you'll see a list of errors....
NikolaNbgd
@NikolaNbgd
Apr 12 2018 13:53
@khaduch the problem is in skipping divs, when program is run, first element is shown, and that is fine
but then
program skip next 4 elements
and when slide is changed, program shows 6 element
Ken Haduch
@khaduch
Apr 12 2018 13:54
I'm looking at this in the debugger, because it's too early in the morning for me to just figure it out in myhead... :)
NikolaNbgd
@NikolaNbgd
Apr 12 2018 13:54
I can share my screen with you, that could help us both :D
to see whole code
Ken Haduch
@khaduch
Apr 12 2018 13:55
it's too early in the morning for that, too... :)
Michael S
@Ohshi60
Apr 12 2018 13:56
@khaduch im just curious, what do you use to debug html?
Ken Haduch
@khaduch
Apr 12 2018 13:56
@Ohshi60 - I'm using the browser devtools, putting a debugger statement into the JS, and starting the action, then stepping through and observing what's going on.
Michael S
@Ohshi60
Apr 12 2018 13:57
I will have to research that, coming from a c# and java background i miss my debugger :+1:
NikolaNbgd
@NikolaNbgd
Apr 12 2018 13:58
@khaduch do you have any idea how to not skip next for divs?
Ken Haduch
@khaduch
Apr 12 2018 14:03
@NikolaNbgd - the problem is that your code to do this: divs.forEach(div => { div[count++].style.visibility = vis;} is not correct. I'm still looking at this becuase I had made a slight change to thte code, but basically witnin the divs.forEach you would have to have another looping construct, maybe another div.forEach to access each element within the sub-array of divs.
NikolaNbgd
@NikolaNbgd
Apr 12 2018 14:06
got this error TypeError: Cannot read property 'style' of undefined
Ken Haduch
@khaduch
Apr 12 2018 14:06
@NikolaNbgd - and actually, if you want them to appear sequentially one per second, it has to be more complicated than this, because the .forEach() is only going to run in one shot. So what you have is definitely not going to do that.
Marc
@MWBauer
Apr 12 2018 14:11
Hey everyone!
Ken Haduch
@khaduch
Apr 12 2018 14:15

@NikolaNbgd - what you have (I'm not sure how this is going to paste in) is an array of sub-arrays with each div with the same class grouped together in each sub-array:

(4) [NodeList(4), NodeList(4), NodeList(4), NodeList(4)]
    0: NodeList(4) [div.chat1, div.chat1, div.chat1, div.chat1]
    1: NodeList(4) [div.chat2, div.chat2, div.chat2, div.chat2]
    2: NodeList(4) [div.chat3, div.chat3, div.chat3, div.chat3]
    3: NodeList(4) [div.chat4, div.chat4, div.chat4, div.chat4]
length: 4__proto__: Array(0)

that is what ends up in the divs structure (copied and pasted and tweaked from the browser devtools console.)

So you can see that if you go through each of the sub-arrays, you'll access each of the divs that have .chat1 as their class, then the .chat2, etc. So if you wanted to get the first .chat1, and the first .chat2, etc. then you would need to access them as divs[0][0], and then divs[1][0], and divs[2][0] to set the visibility of each.

@MWBauer - hey there!
NikolaNbgd
@NikolaNbgd
Apr 12 2018 14:20

@khaduch yes, I get it, but when I do what you said, when I change

                    divs.forEach(div => {
                        div[count++].style.visibility = vis;
                    })

with

                    divs.forEach(div => {
                        div.forEach(di =>{
                            di[count++].style.visibility = vis;
                        })
                    })

I got this error 'TypeError: Cannot read property 'style' of undefined'

Marc
@MWBauer
Apr 12 2018 14:25
Is anyone free to help me figure something out in my playground?
Ken Haduch
@khaduch
Apr 12 2018 14:26
@NikolaNbgd - I would think that you have a problem with the indexing and count variable... because then you are accessing the individual elements of the sub-array via the variable di - so you don't need that indexing at that level.
Tom
@moT01
Apr 12 2018 14:29
@MWBauer whats the problem
Ken Haduch
@khaduch
Apr 12 2018 14:31

@NikolaNbgd - oh, so as I think about it a couple minutes later, if you want to sequentially display the divs, that nested .forEachcode structure is just going to zoom through setting those properties on all of the divs. You have to use some indexing and control the counts of each index each second that would give you the indexing like I mentioned above: divs[0][0], and then divs[1][0], and divs[2][0].

It might be easier to make one flat array of all of the divs and process it that way, but I don't know why you have divided them up in to the .slideshow sections - you might have something else that you're trying to do.

NikolaNbgd
@NikolaNbgd
Apr 12 2018 14:36
@khaduch slideshow sections are just for owl-carousel, nothing else
Ken Haduch
@khaduch
Apr 12 2018 14:37
I don't know what owl-carousel is...
NikolaNbgd
@NikolaNbgd
Apr 12 2018 14:38
its a simple slider
like bootstrap slider, but better
like slick slider
ando so on
Ken Haduch
@khaduch
Apr 12 2018 14:39
so, is there some other javascript plugin or something that is supposed to be running the slideshow? It seems to me if you have this setup then something is going to actually run the slideshow behind the scenes, as it were?
NikolaNbgd
@NikolaNbgd
Apr 12 2018 14:40
yes, exactly
I use plugin for slider
and slides are on
that is not a problem
just chat animation
Ken Haduch
@khaduch
Apr 12 2018 14:49
@NikolaNbgd - how should the chat be displayed relative to the pictures? Do they go together or independently? I'm guessing that the owl-slider could potentially have something like a caption option?
Marc
@MWBauer
Apr 12 2018 14:51
@moT01 I'm trying to get an image to appear near my text, but it won't.
It's near the bottom.
NikolaNbgd
@NikolaNbgd
Apr 12 2018 14:52
@khaduch they go independently, each slide takes 7s, and none of that has anything to do with chat animation
Ken Haduch
@khaduch
Apr 12 2018 14:52
@MWBauer - side by side of the text with the image next to it? like the gunshop?
Marc
@MWBauer
Apr 12 2018 14:52
like...95% of the way down. You'll see a note that says "this isn't working. I also cant seem to get my background image working.
Alvin
@AlvinW89
Apr 12 2018 14:52
tried bootstrap? @MWBauer
like row and col
or floats
Marc
@MWBauer
Apr 12 2018 14:53
I'm working out of a book and it didn't go that way. I could but I figured I would follow the book so much as I can.
NikolaNbgd
@NikolaNbgd
Apr 12 2018 14:53
@khaduch its a matter of time, each chat bubble takes 1s, so whole process in one slide is 4s, then it takes 3 seconds for the user to look at it
Marc
@MWBauer
Apr 12 2018 14:53
@khaduch gunshop?
Ken Haduch
@khaduch
Apr 12 2018 14:54
@NikolaNbgd - okay. So the way that you have that set up right now, the chat divs, they are going to flow down the page. Would you want them to appear in sequence under the row of pictures?
Alvin
@AlvinW89
Apr 12 2018 14:54
I realized I clicked on the wrong name
XD
NikolaNbgd
@NikolaNbgd
Apr 12 2018 14:55
@khaduch which row of pictures?
Marc
@MWBauer
Apr 12 2018 14:56
Are <hr/> supposed to be visual or just there?
Ken Haduch
@khaduch
Apr 12 2018 14:56
@NikolaNbgd - the slideshow is going to be somewhere, probably moving across the page (at least looking at the owl-carousel examples?) I'm trying to figure out where you actually want to have the chat appear? Somewhere near the slideshow pictures, or just anywhere on the page?
NikolaNbgd
@NikolaNbgd
Apr 12 2018 14:57
@khaduch into the slideshows, like this https://ben.co/
Ken Haduch
@khaduch
Apr 12 2018 14:57
@MWBauer - <hr/> are visible elements - should be a line going across the page.
Marc
@MWBauer
Apr 12 2018 14:57
Ok. Thought so. That's not working either.
Do I need a space between <hr and />
NikolaNbgd
@NikolaNbgd
Apr 12 2018 14:58
@MWBauer doesn't matter
Marc
@MWBauer
Apr 12 2018 14:58
grr...
Is that found under Bootstrap or plain CSS or what
?
Ken Haduch
@khaduch
Apr 12 2018 14:59
@MWBauer - it is there right above the text on the page that says level 5 - tables - very hard to see...
NikolaNbgd
@NikolaNbgd
Apr 12 2018 14:59
hr is html tag which represents gray line, nothing else, you can put it <hr/> or <hr />
zootechdrum
@zootechdrum
Apr 12 2018 15:00
HEY GUYS
Marc
@MWBauer
Apr 12 2018 15:00
Hi Zoot
zootechdrum
@zootechdrum
Apr 12 2018 15:00
it seems like I am one of
Ken Haduch
@khaduch
Apr 12 2018 15:00
@zootechdrum - hey there
zootechdrum
@zootechdrum
Apr 12 2018 15:00
@MWBauer whats up lol good morning
Marc
@MWBauer
Apr 12 2018 15:01
@khaduch thanks for seeing that. I'm using it on another playground too.
CamperBot
@camperbot
Apr 12 2018 15:01
mwbauer sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 3871 | @khaduch |http://www.freecodecamp.org/khaduch
zootechdrum
@zootechdrum
Apr 12 2018 15:01
I seem to be one of in my code, In my mind it makes sense lol
Marc
@MWBauer
Apr 12 2018 15:01
It's just the angle of the screen, it disappears.
I move down a little and there it is.
Thanks for your help.
zootechdrum
@zootechdrum
Apr 12 2018 15:01
function rot13(str) { // LBH QVQ VG!

  var split = str.split("");
  var ans = [];
  var second13 = ["N","O","P","Q","R","S","T","U","V","W","X","Y","Z"];
  var setNumber = 65;

  for(var i = 0; i < str.length; i++){
      if (str.charCodeAt(i) === 32 ){
            ans.push(" ");
    } else if(str.charCodeAt(i) < 77 && str.charCodeAt(i) !== 32 ){
       ans.push(String.fromCharCode(str.charCodeAt(i) + 13)); 
    } else if(str.charCodeAt(i) > 77){
        ans.push(String.fromCharCode(setNumber + second13.indexOf(i)));
    }


   }
    return ans;
  }



// Change the inputs below to test
rot13("ZBC A");
Ken Haduch
@khaduch
Apr 12 2018 15:01
@MWBauer - you can style it with a different color...
Marc
@MWBauer
Apr 12 2018 15:02
really?
Ok. So now, why isn't my image showing up?
Ken Haduch
@khaduch
Apr 12 2018 15:02
@MWBauer - you can do crazy things with <hr/> element - I think the CSS-tricks site has a page on it,.
Marc
@MWBauer
Apr 12 2018 15:03
Near the end there's a paragraph about Deitel and there should be an image just bottom right of it.
@MWBauer - or you can change the background-color to a different color. Not that you want to, but maybe if you want it to be more visible you could select another color.
Marc
@MWBauer
Apr 12 2018 15:08
yeah. I'm playing around with it. You can pull up a list of those 8 different styles, then you can find the code. I would put the code in CSS, but how would you call it in the HTML?
Ken Haduch
@khaduch
Apr 12 2018 15:15
@MWBauer - if you generate the style using hr as the selector, it will apply it to all hr elements. If you want to apply it to a specific one, make it into a class selector (for example .myHrStyle), and add the class="myHrStyle" to the hr element.
but you'd probably want them all to be the same style, just for consistency and appearance...
@zootechdrum - do you have a problem with your rot13 code, or do you want comments?
Marc
@MWBauer
Apr 12 2018 15:17
hr.style-seven { overflow: visible; /* For IE */ height: 30px; border-style: solid; border-color: black; border-width: 1px 0 0 0; border-radius: 20px; } hr.style-seven:before { /* Not really supposed to work, but does */ display: block; content: ""; height: 30px; margin-top: -31px; border-style: solid; border-color: black; border-width: 0 0 1px 0; border-radius: 20px; }
Ick.
Not sure why it popped up like that.
hr.style-seven { overflow: visible; /* For IE */ 
height: 30px; 
border-style: solid; 
border-color: black; 
border-width: 1px 0 0 0; 
border-radius: 20px; } 
hr.style-seven:before { /* Not really supposed to work, but does */ 
display: block; 
content: ""; 
height: 30px; 
margin-top: -31px; 
border-style: solid; 
border-color: black; 
border-width: 0 0 1px 0; 
border-radius: 20px; }
I tried <hr/> and <hr.style-seven/>
neither worked.
zootechdrum
@zootechdrum
Apr 12 2018 15:20
kinda fixed it
wont pass all the tests yet
function rot13(str) { // LBH QVQ VG!

  var split = str.split("");
  var ans = [];
  var second13 = ["N","O","P","Q","R","S","T","U","V","W","X","Y","Z"];
  var setNumber = 65;

  for(var i = 0; i < str.length; i++){
      if (str.charCodeAt(i) === 32 ){
            ans.push(" ");
    } else if(str.charCodeAt(i) < 77 && str.charCodeAt(i) !== 32 ){
       ans.push(String.fromCharCode(str.charCodeAt(i) + 13)); 
    } else if(str.charCodeAt(i) > 77){
      console.log(str.charCodeAt(i));
        ans.push(String.fromCharCode(setNumber + second13.indexOf(str[i])));
    }


   }
    return ans.join('');
  }



// Change the inputs below to test
Ill figure it out
Marc
@MWBauer
Apr 12 2018 15:21
I loved this one.
Probably because I could work out what needed done in my head.
There was a logical process that I could see.
That's how I work on these.
Marc
@MWBauer
Apr 12 2018 15:43
Ya'll ran away?
Ken Haduch
@khaduch
Apr 12 2018 15:44
@MWBauer - well, only temporarily...
Aditya
@ezioda004
Apr 12 2018 15:45
:running:
ijhar
@ijhar8
Apr 12 2018 15:45
https://codepen.io/ijhar8/pen/BrEbJg help i want every div inside box div in one line ..
Ken Haduch
@khaduch
Apr 12 2018 15:47
@zootechdrum - your best thing to do is only to handle characters in the range where you shift the code. Anything else just pass through, like I see you're detecting the space character - you would have to do that for any other characters. Also looks like the code that you have above is missing boundary cases, like converting the "M" to "Z"
Michael S
@Ohshi60
Apr 12 2018 15:48
@ijhar8 try placing it in a 'div class="row"`
Ken Haduch
@khaduch
Apr 12 2018 15:50
@MWBauer - when I was looking at your playground code, it looks you might have multiple <head> sections, and different embedded <style> sections? That might not work too well, it will probably be all confused by the browser...
ijhar
@ijhar8
Apr 12 2018 15:50
@Ohshi60 already tried bt its not working ..
Ken Haduch
@khaduch
Apr 12 2018 15:52
@ijhar8 - each of those elements would have to be in a separate div with class="col-*-*" to align them in one row. There is probably an easier way to do what you want.
ijhar
@ijhar8
Apr 12 2018 15:52
Ken Haduch
@khaduch
Apr 12 2018 16:03
@ijhar8 - do you want it to look something like this:
image.png
ijhar
@ijhar8
Apr 12 2018 16:03
no
Ken Haduch
@khaduch
Apr 12 2018 16:03
ok
Michael S
@Ohshi60
Apr 12 2018 16:04
i have session and break on same line but the buttons are not on the same row, i would guess a combination would be ideal :)
Marc
@MWBauer
Apr 12 2018 16:14
@khaduch I was worried that might happen. Do you think that's what is making the images not appear?
wei_xin1
@wx312212
Apr 12 2018 16:31
my English is poooooor ,and I can not understand the teaching video,can someone give me some advice?
i am learning English now but it
is too hard for me to catch what the teacher say
im learning English now
Amira
@Mera77
Apr 12 2018 16:45
@wx312212 Do you use captions?
Ken Haduch
@khaduch
Apr 12 2018 16:48
@MWBauer - well, it could be. Are you familiar with using the browser developer tools to examine the HTML elements and the styles that are being applied?
Ken Haduch
@khaduch
Apr 12 2018 16:54
@MWBauer - is it the section that says <title>Background Images</title> in the HTML code. Note that that would appear as the title of the page in the browser tab, and it isn't. So that's a clue right there that you aren't seeing things work as you might hope they would.
The other thing that is wrong (for CodePen) is that your URL for that image is a local disk image, and it won't load it on codepen, for sure.
Marco Galizzi
@Tezenn
Apr 12 2018 16:58
hello guys can you tell me why those quarter circles are out of align? thanks a lot!
https://codepen.io/Tezenn/pen/bLGKbe
Ken Haduch
@khaduch
Apr 12 2018 16:59
@MWBauer - I am going away from the computer to work outside. But if you change the URL for the background image that you have in your CSS panel, it will become a background image. Not sure if that's what you are going for? I'll check in later.
good luck!
Ben Thomas
@jub8jive
Apr 12 2018 17:09
hi
how does this work?
Marco Galizzi
@Tezenn
Apr 12 2018 17:14
@jub8jive hi you mean the chat room?
Ben Thomas
@jub8jive
Apr 12 2018 17:15
yes
Michael S
@Ohshi60
Apr 12 2018 17:17
Hi guys: what is an ideal size for a full size background image for a website? i am currently using a 5000x4000 pixel 4,5 megabyte image (JPG) and it loads very very slow
Marco Galizzi
@Tezenn
Apr 12 2018 17:18
@jub8jive you just ask about things and maybe link your codepen so people can see the code and hopefully someone who knows can help you
usually works
Stephen James
@sjames1958gm
Apr 12 2018 17:19
@Ohshi60 That seem quite large. I wouldn't go beyond 1920 for the width.
Michael S
@Ohshi60
Apr 12 2018 17:21
@sjames1958gm okay i will try to scale it to FHD dimensions and see how much it helps :)
Stephen James
@sjames1958gm
Apr 12 2018 17:37
I would start smaller and see how it looks and only scale up if absolutely needed - I would think load speed would be more critical to most users
LydaTech
@lydatech
Apr 12 2018 17:47
@sjames1958gm you on linux?
Stephen James
@sjames1958gm
Apr 12 2018 17:48
@lydatech I am on mac
LydaTech
@lydatech
Apr 12 2018 17:48
@sjames1958gm ahh ok
Muhammad Hasham
@MohammadHasham
Apr 12 2018 20:24
how can i achieve this black effect on background on this website
include*engine
@newtothat
Apr 12 2018 20:25
hello i need your feedback on my tribute page
include*engine
@newtothat
Apr 12 2018 20:34
its not responsive
Genesis Self
@GenesisSelf
Apr 12 2018 20:42
I want to run a friend's pr locally using git. I've tried git fetch origin pull/ID/head:BRANCHNAME but no success. I wonder how others do it?
JoEezy
@JoEeeezy_twitter
Apr 12 2018 20:45
function convertToRoman(num) {

  //var arr = (""+num).split("").map(Number);

  var answer = [];

  var roman = [
    [1000, "M"],
    [500, "D"],
    [100, "C"],
    [50, "L"],
    [10, "X"],
    [5, "V"],
    [1, "I"], 
  ];

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

  if (num / roman[i][0] >= 1) {   
     for (var j = 0; j <= num / roman[i][0]; j++){     
      answer.push(roman[i][1]);
      num -= roman[i][0];    
    }
  }
}

 return num;
 //return answer.join('');
}

convertToRoman(36);
can someone help me please... for some reason num returns 2
even though i have num -= roman[i][0]; which should deduct the roman number value equivalent
Brad
@bradtaniguchi
Apr 12 2018 20:47
@JoEeeezy_twitter For starters it seems like your "roman" array could be done as a map, instead of an array, or switch statement. Would make it simplier
Like A LOT simplier
JoEezy
@JoEeeezy_twitter
Apr 12 2018 20:49
:eyes: i'm still a little weak on array methods but i'll give it a try
Brad
@bradtaniguchi
Apr 12 2018 20:51

So like your data looks like this:

var roman = {
    1000: 'M',
    500: 'D'
// so on
}

You might need restructure the program tho, to get what you want instead of dealing with iterating through the values and what not

JoEezy
@JoEeeezy_twitter
Apr 12 2018 20:53
i tried using an object earlier but was having trouble with getting specific keys to check , actually just switched to that array
i'll go back and look thru the docs again thanks for the suggestion :+1:
Genesis Self
@GenesisSelf
Apr 12 2018 20:57
@newtothat Hello, I think you achieved the goal of the project. Just a couple of minor things, I don't understand the VS button styles on the span. I would suggest creating a separate class for that because the bootstrap style makes it act like you can click on it when that's not the purpose. (pointer finger click icon appears) In the code, I would clean it up a bit and have end tags in their own line and remove commented out sections.
include*engine
@newtothat
Apr 12 2018 21:02
@GenesisSelf thank you for you feedback .Actually im not good in bootstrap yet.I learn on youtube first then come to fcc.Actually yesterday was my first bootstrap lesson i took on fcc.and finished almost all but what i remembered from my first bootstap from yesterday i added in span
CamperBot
@camperbot
Apr 12 2018 21:02
newtothat sends brownie points to @genesisself :sparkles: :thumbsup: :sparkles:
:cookie: 296 | @genesisself |http://www.freecodecamp.org/genesisself
zootechdrum
@zootechdrum
Apr 12 2018 21:23
need some help guys
i can get the following param to return no such contact exists

var contacts = [
    {
        "firstName": "Akira",
        "lastName": "Laine",
        "number": "0543236543",
        "likes": ["Pizza", "Coding", "Brownie Points"]
    },
    {
        "firstName": "Harry",
        "lastName": "Potter",
        "number": "0994372684",
        "likes": ["Hogwarts", "Magic", "Hagrid"]
    },
    {
        "firstName": "Sherlock",
        "lastName": "Holmes",
        "number": "0487345643",
        "likes": ["Intriguing Cases", "Violin"]
    },
    {
        "firstName": "Kristian",
        "lastName": "Vos",
        "number": "unknown",
        "likes": ["Javascript", "Gaming", "Foxes"]
    }
];


function lookUpProfile(firstName, prop){
// Only change code below this line
  for(var i = 0; i < contacts.length; i++){
       if (contacts[i].hasOwnProperty(prop) === false){
        return "No such property";
      }else if (contacts[i].hasOwnProperty(prop) === true && contacts[i].firstName === firstName){
        return contacts[i][prop];
      } 

    }



// Only change code above this line


// Change these values to test your function

// Only change code above this line
}

// Change these values to test your function
lookUpProfile("Bob", "number");
thats the code
Stephen James
@sjames1958gm
Apr 12 2018 21:25
@zootechdrum When your loop ends without already returning you know there is no such contact.
A more correct implementation would only check for no such property on a contact that matches the first name
zootechdrum
@zootechdrum
Apr 12 2018 22:10
@sjames1958gm Yeah, but when I add an else statement the first 3 parameters change to "X" on freecodecamp
@sjames1958gm So what used to work no longer works.
I dont understand why though
Ken Haduch
@khaduch
Apr 12 2018 22:20
@zootechdrum - as @sjames1958gm pointed out - the first thing to do is to check for a match on the first name that is being sent in the firstName function argument. If you get a match on the name, then check for the existence of the property. Only if you get a name match and a property match, then you return something (the property given in prop). Only when you have exhausted all of the contacts in the loop (after the close of your for loop body) you can then make the return (which you don't seem to have at all) of "No such contact".
You have a lot of the pieces in place, you just need to reorganize them to get the priorities straight!
zootechdrum
@zootechdrum
Apr 12 2018 22:49
@khaduch thanks man
CamperBot
@camperbot
Apr 12 2018 22:49
zootechdrum sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 3873 | @khaduch |http://www.freecodecamp.org/khaduch
zootechdrum
@zootechdrum
Apr 12 2018 22:49
@sjames1958gm and thank you too
CamperBot
@camperbot
Apr 12 2018 22:49
zootechdrum sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 9195 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
zootechdrum
@zootechdrum
Apr 12 2018 22:49
function lookUpProfile(firstName, prop){
// Only change code below this line
  for(var i = 0; i < contacts.length; i++){
       if (contacts[i].firstName === firstName & contacts[i].hasOwnProperty(prop)){
         return contacts[i][prop];
      }else if(contacts[i].hasOwnProperty(prop) === false){
        return "No such property";
      } 
    }
  return "No such contact"; 

}

// Change these values to test your function
lookUpProfile("Akira", "address");
This was acceptable. After I ready your what you wrote 10X something clicked .
creator0323
@Amasian
Apr 12 2018 23:27

What do I need to add to the API provide the information of my location? I know I am missing something but I am not sure what it is. Any help will appreciated.

https://codepen.io/Amasian/pen/LdqwRY?editors=0010

Aditya
@ezioda004
Apr 12 2018 23:38
@Amasian You need to make use of Navigator object which fetches geo-location of the user. Heres the fcc challenge that'll help you out. Its another Async request so make sure you get geo-location of user before you make request from the weather API.
creator0323
@Amasian
Apr 12 2018 23:45
@ezioda004 ah so I need to deliver information of current user location with geolocation API! thank you so much!
CamperBot
@camperbot
Apr 12 2018 23:45
amasian sends brownie points to @ezioda004 :sparkles: :thumbsup: :sparkles:
:cookie: 535 | @ezioda004 |http://www.freecodecamp.org/ezioda004