These are chat archives for FreeCodeCamp/HelpFrontEnd

25th
Aug 2017
Gulsvi
@gulsvi
Aug 25 2017 00:00
@culturesync I think you can do that by adding this as your first line of the click function: if(window.innerWidth > 798) return;
Then it won't animate the scroll for you - if that's what you're after
CuttureSync
@culturesync
Aug 25 2017 00:01
okay... i had all of that written in the code ... except for the return park :laughing: >:P
I have it writting like this
  $(".footer-menu a").click(function(){
    if(window.innerWidth > 798) return;
    $("html, body").animate(
      {
        scrollTop: $(".container").position().top - 25
      },
      500
    );
  });
which is wrong
i'll figure it
thinsoldier
@thinsoldier
Aug 25 2017 00:06
Anyone here know canvas?
CuttureSync
@culturesync
Aug 25 2017 00:06
not me
sorry dude
@SkyC0der haha i had it on the footer instead of the main menu. Fixed it and now it works. :bow: :sparkles:
Gulsvi
@gulsvi
Aug 25 2017 00:09
Nice :) glad you got it figured out
Gulsvi
@gulsvi
Aug 25 2017 00:14
@siddarthk123 I made some updates, maybe this will help: https://s.codepen.io/anon/pen/mMjxKa?editors=0010
BrianWilliams28
@BrianWilliams28
Aug 25 2017 00:28
@anyone who's done the Smallest Common Multiple challenge, could someone give me a hint on what to do next? Here's what i have come up with so far...
function smallestCommons(arr) {
  var range = []; // [18, 19, 20, 21, 22, 23]
  var sort = arr.sort(function(a, b) { // smallestCommons(23,18) => smallestCommons(18,23);
    return a - b;
  });
 for (var i = sort[0]; i <= sort[1]; i++) {
  range.push(i);
 }

  return arr;
}


smallestCommons([23,18]);
Aaron Bell
@awb715
Aug 25 2017 00:41
Screenshot 2017-08-24 20.38.00.png
can anyone help me debug this issue, not sure why its occuring
David
@deitcode
Aug 25 2017 00:44
@BrianWilliams28 so in this case you need to return the lowest common multiple of 23 and 18? 414?
Tom
@moT01
Aug 25 2017 00:57
@awb715 got any code to show
@BrianWilliams28 why the sort?
Chris Cullen
@123xylem
Aug 25 2017 01:09
Hi,
Im making a 3 col row.. But at small size the 3rd col goes down a row leaving 2 on top spaced nice and the 3rd one looking awkward on the left..
Any good solutions?
Aaron Bell
@awb715
Aug 25 2017 01:10
@moT01 making a stackoverflow post now
Chris Cullen
@123xylem
Aug 25 2017 01:10
BTW its 2 3 col rows
iso
@iso1048
Aug 25 2017 01:14
@123xylem are you using bootstrap?
Chris Cullen
@123xylem
Aug 25 2017 01:14
@gothamknight yea
col-xs-12 col-sm-4
iso
@iso1048
Aug 25 2017 01:14
@123xylem what is the col-xs-12 for?
Chris Cullen
@123xylem
Aug 25 2017 01:18
@gothamknight when its really small make each col go full width
iso
@iso1048
Aug 25 2017 01:19
@123xylem oh ok. perhaps at smaller screen sizes, you could swap col-sm-4 for col-xs-4. (I'm not an expert, just trying to give some ideas)
thinsoldier
@thinsoldier
Aug 25 2017 01:25
Anyone here know canvas?
Pagnito
@Pagnito
Aug 25 2017 01:36
anyone know how to import and render svgs in react/webpack
Gulsvi
@gulsvi
Aug 25 2017 01:37
@123xylem It's hard to say without seeing the code, but that can happen if you add padding or margins to your bootstrap columns or have an unclosed div.
Also, <div class="col-xs-12 col-sm-4"> is the same as <div class="col-sm-4"> as long as you don't have more than 12 columns in your row.
juni
@junipberry
Aug 25 2017 01:39
var myFish = ['parrot', 'anemone', 'blue', 'trumpet', 'sturgeon'];
var removed = myFish.splice(myFish.length - 3, 2);

// myFish is ["parrot", "anemone", "sturgeon"] 
// removed is ["blue", "trumpet”]
I find it weird that it removes 2 items left to right when it starts reading right to left here
shouldnt it remove 2 items right to left in accordance with start index
Chris Cullen
@123xylem
Aug 25 2017 01:41
@SkyC0der thanks... Im just gonna use col-sm-4.. and let 3 cols be shown until small enough for 1 col a row... The problem with 3 cols being shown was that the text was going out the bottom.. Any fix for that?
CamperBot
@camperbot
Aug 25 2017 01:41
:star2: 2563 | @skyc0der |http://www.freecodecamp.com/skyc0der
123xylem sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
Gulsvi
@gulsvi
Aug 25 2017 01:41
@junipberry The start index is 2, so you could also write it:
var myFish = ['parrot', 'anemone', 'blue', 'trumpet', 'sturgeon'];
var removed = myFish.splice(2, 2);

// myFish is ["parrot", "anemone", "sturgeon"] 
// removed is ["blue", "trumpet”]
Chris Cullen
@123xylem
Aug 25 2017 01:41
@SkyC0der so far I just reduced the text :) but id prefer a better fix
Gulsvi
@gulsvi
Aug 25 2017 01:42
@123xylem Feel free to share your code, reducing the text isn't a fix, just a reduction of text lol
juni
@junipberry
Aug 25 2017 01:42
but the start index isnt 2, its .length-3
what is the array was longer, .length-3 would be a diff number..
*value
Gulsvi
@gulsvi
Aug 25 2017 01:43
var myFish = ['parrot', 'anemone', 'blue', 'trumpet', 'sturgeon'];
console.log(myFish.length - 3) // 2
var removed = myFish.splice(2, 2);

// myFish is ["parrot", "anemone", "sturgeon"] 
// removed is ["blue", "trumpet”]
myFish.length - 3 = 2
the splice method only sees the result of your calculation, it doesn't know how you arrived at it
Jasmin
@jsmnvlcrt
Aug 25 2017 01:44
Hey everyone! Could someone explain the https://www.freecodecamp.org/challenges/introducing-else-if-statements? I got the else statment easily but this just won’t click with my brain. Much appreciated if you could explain the code. Thanks!
juni
@junipberry
Aug 25 2017 01:44
I see
iso
@iso1048
Aug 25 2017 01:45
@SkyC0der could I send you a pm. wont take long (just something for you to trial)
juni
@junipberry
Aug 25 2017 01:45
I was having trouble understanding why I had to apply the removal in the opposite direction as I was going
ty @SkyC0der
Gulsvi
@gulsvi
Aug 25 2017 01:46
Sure, no problem
Same idea @junipberry here:
var myFish = ['parrot', 'anemone', 'blue', 'trumpet', 'sturgeon'];
var index = (myFish.length - 3) // 2
var removed = myFish.splice(index, 2);

// myFish is ["parrot", "anemone", "sturgeon"] 
// removed is ["blue", "trumpet”]
@jsmnvlcrt what has you confused?
@gothamknight sure
if (something) {do this} else if (something else) {do something else} else {do this}
Jasmin
@jsmnvlcrt
Aug 25 2017 02:00
@SkyC0der it THis is my code now. I’m not sure what the issue is exactly.

function testElseIf(val) {
if (val < 10) {
return "Greater than 10";
} else if (val > 10) {

if (val < 5) {
return "Smaller than 5";
} else if (val > 5) {

return "Between 5 and 10";
}

// Change this value to test
testElseIf(7);

juni
@junipberry
Aug 25 2017 02:01
anyone know why isnt this going through?
function joinArrays(arr1, arr2) {
  array.prototype.push.apply(arr1, arr2);
return array;
}
Jasmin
@jsmnvlcrt
Aug 25 2017 02:05
@SkyC0der Apologies!
function testElseIf(val) {
  if (val < 10) {
    return "Greater than 10";
  } else if (val > 10) {

  if (val < 5) {
    return "Smaller than 5";
   } else if (val > 5) {

  return "Between 5 and 10";
}

// Change this value to test
testElseIf(7);
Johnny
@jtan3
Aug 25 2017 02:06
@junipberry its Array.prototype.push.apply(arr1, arr2) and try returning arr1
Justin Crawford
@JCrawford1122
Aug 25 2017 02:07
@jsmnvlcrt should the first if statement be if (val > 10) ?
Jasmin
@jsmnvlcrt
Aug 25 2017 02:10
@JCrawford1122 Oh yes! whoops! I seem to have switched the signs! It still isn’t correct however.
function testElseIf(val) {
  if (val > 10) {
    return "Greater than 10";
  } else if (val > 10) {

  if (val < 5) {
    return "Smaller than 5";
   } else if (val < 5) {

  return "Between 5 and 10";
}

// Change this value to test
testElseIf(7);
Justin Crawford
@JCrawford1122
Aug 25 2017 02:12
Also check the sign in your first else if statement
if anyone can help me out with that!
Justin Crawford
@JCrawford1122
Aug 25 2017 02:14
@jsmnvlcrt I would reset the challenge. You really only need to change two things in the code that is given at the start.
Jasmin
@jsmnvlcrt
Aug 25 2017 02:17
Got it! I’ll try resetting. Thanks so much!
Justin Crawford
@JCrawford1122
Aug 25 2017 02:18
@jsmnvlcrt also the example given in the instructions is almost exactly what you want to do. Just different numbers.
Siddarth Krishnan
@siddarthk123
Aug 25 2017 02:21
hello
i have a question
what....
how do i pause a timer and then resume it again.
Long Nguyen
@longnt80
Aug 25 2017 02:22
@siddarthk123 store the time in a variable
use clearTimeout to stop the setTimeout/setInterval
when resume, continue with the stored time in the variable above
Siddarth Krishnan
@siddarthk123
Aug 25 2017 02:23
wait
long can u get on skype?
Long Nguyen
@longnt80
Aug 25 2017 02:23
I don't have SKype on my comp
you can PM me here
Siddarth Krishnan
@siddarthk123
Aug 25 2017 02:23
can u dl it?
Long Nguyen
@longnt80
Aug 25 2017 02:24
not right now, sorry
Siddarth Krishnan
@siddarthk123
Aug 25 2017 02:31
long
can u tell me how to do it again
should i send you my code pen?
Pagnito
@Pagnito
Aug 25 2017 02:34
anyone have problems with mobile sfari breaking their site?
Aaron Bell
@awb715
Aug 25 2017 02:34
<p id="in" name="a"onclick="redo(0,this.id)">Income</p>
why does the id come in as undefined
Pagnito
@Pagnito
Aug 25 2017 02:34
i recently went to walmart and as i was walking around i decided to check all the devices lol and see how my site looks
and all the iphones couldnt load my site at all
it was just jumble of stuff
Long Nguyen
@longnt80
Aug 25 2017 02:35
@Pagnito what kind of site?
Pagnito
@Pagnito
Aug 25 2017 02:35
pavelyeganov.com
its just regular html javascript jquery and bootstrap
Long Nguyen
@longnt80
Aug 25 2017 02:36
loads of animation
safari on mobile doesn't have the best support
Siddarth Krishnan
@siddarthk123
Aug 25 2017 02:36
long nguyen
can you help me out here?
Pagnito
@Pagnito
Aug 25 2017 02:37
if i check it in safari developer tools responsive tools it works, but not in actual iphons
Long Nguyen
@longnt80
Aug 25 2017 02:37
@Pagnito you mean the safari on your computer?
Pagnito
@Pagnito
Aug 25 2017 02:37
@longnt80 yea
juni
@junipberry
Aug 25 2017 02:37
oh, ty~ @jtan3
CamperBot
@camperbot
Aug 25 2017 02:37
:cookie: 455 | @jtan3 |http://www.freecodecamp.com/jtan3
Pagnito
@Pagnito
Aug 25 2017 02:37
in the dev tools, ther is responsive mode
CamperBot
@camperbot
Aug 25 2017 02:37
junipberry sends brownie points to @jtan3 :sparkles: :thumbsup: :sparkles:
Long Nguyen
@longnt80
Aug 25 2017 02:38
I think you need the actual mobile safari to test
Pagnito
@Pagnito
Aug 25 2017 02:38
yea
Long Nguyen
@longnt80
Aug 25 2017 02:38
responsive mode is just the viewport, it doesn't give you the actual support state of the browser
Pagnito
@Pagnito
Aug 25 2017 02:39
i fucking hate safari lol
Long Nguyen
@longnt80
Aug 25 2017 02:39
@siddarthk123 where's the code for timer? I only see canvas stuffs
Siddarth Krishnan
@siddarthk123
Aug 25 2017 02:39
its in the javascript
its like
Long Nguyen
@longnt80
Aug 25 2017 02:39
@Pagnito still better than IE/Edge
Siddarth Krishnan
@siddarthk123
Aug 25 2017 02:39
line 55
Pagnito
@Pagnito
Aug 25 2017 02:40
@longnt80 yea i should proly download that browser too and check it
Siddarth Krishnan
@siddarthk123
Aug 25 2017 02:40
clearInterval(timex)
Pagnito
@Pagnito
Aug 25 2017 02:40
it works on desktop ie tho i dunno if there is a mobile ie
Siddarth Krishnan
@siddarthk123
Aug 25 2017 02:40
97
98
line 97 98
in javascript
line 70
in javascript
that is where the time stuff is located
long
Long Nguyen
@longnt80
Aug 25 2017 02:41
@Pagnito there is the browser on Windows phones, I don't have one to test though
Siddarth Krishnan
@siddarthk123
Aug 25 2017 02:41
long
can u take a look please?
Long Nguyen
@longnt80
Aug 25 2017 02:42
@siddarthk123 can you make the timer first without integrated it with your canvas? Just a number
Siddarth Krishnan
@siddarthk123
Aug 25 2017 02:42
why
what is the reason
long nguyen
can you tell me the reason?
Pagnito
@Pagnito
Aug 25 2017 02:45
@longnt80 i just downloaded bing microsoft browser, its kinda fast, much faster than mozilla mobile
Long Nguyen
@longnt80
Aug 25 2017 02:46
@siddarthk123 if you can't make the timer alone, why integrate it with canvas. That just make things complicated
@siddarthk123 write a separated javascript codes to test the timer first
@Pagnito what phone are you using? Android? iPhone?
Siddarth Krishnan
@siddarthk123
Aug 25 2017 02:47
can you teach me that?
Pagnito
@Pagnito
Aug 25 2017 02:47
android lg g4
Long Nguyen
@longnt80
Aug 25 2017 02:49
@siddarthk123 hold on
Siddarth Krishnan
@siddarthk123
Aug 25 2017 02:50
ok
Siddarth Krishnan
@siddarthk123
Aug 25 2017 02:58
long
did u get the solution?
long
this is the code i got so far.
long nguyen
can you take a look?
can someone
Long Nguyen
@longnt80
Aug 25 2017 03:16
@siddarthk123 you might want to declare timex outside the function
Siddarth Krishnan
@siddarthk123
Aug 25 2017 03:16
why is that?
what difference does it make?
Bryan Jay B. Panesa
@bryanpanesa
Aug 25 2017 03:17
@Pagnito safari has the most fcked up compatibilities bro. That also happened on my site when I tried testing it with ppl who got safari browsers.
Siddarth Krishnan
@siddarthk123
Aug 25 2017 03:17
long
Long Nguyen
@longnt80
Aug 25 2017 03:17
@siddarthk123 because later you might want to clearTimeout from another function
Pagnito
@Pagnito
Aug 25 2017 03:18
@bryanpanesa damn, and the fucked up part is i dont even know where to look to make it work in safari, i think im just gonna leave it alone till i rebuild a new one
Long Nguyen
@longnt80
Aug 25 2017 03:18
@siddarthk123 for example, from a stop button function
Siddarth Krishnan
@siddarthk123
Aug 25 2017 03:18
long
i just use
clearTime
and setTime
Bryan Jay B. Panesa
@bryanpanesa
Aug 25 2017 03:21
@Pagnito I tried testing my site(https://bryanpanesa.github.io/) online using cross-browser testing tools but they just gave ugly results. I just gave up in the end. You can try it if you want. "cross-browser website test"
Pagnito
@Pagnito
Aug 25 2017 03:22
dude weet fucking portfolio
Bryan Jay B. Panesa
@bryanpanesa
Aug 25 2017 03:23
It's a bit outdated tho, I already have a job a month ago. :)
Pagnito
@Pagnito
Aug 25 2017 03:23
did u show this portfolio to get the job?
Bryan Jay B. Panesa
@bryanpanesa
Aug 25 2017 03:24
@Pagnito Yes, that helps a lot but they mostly targeted my projects from the university and how I did things.
Pagnito
@Pagnito
Aug 25 2017 03:26
i see, makes sense
@bryanpanesa how did u become a beta teter?
tester*
Bryan Jay B. Panesa
@bryanpanesa
Aug 25 2017 03:34
@Pagnito signing up to sites like betafamily, betabound and looking for apps in playstore that are in beta/early access. You also get paid on some apps specifically the ios ones.
Pagnito
@Pagnito
Aug 25 2017 03:34
@bryanpanesa how much does it pay?
Bryan Jay B. Panesa
@bryanpanesa
Aug 25 2017 03:38

@Pagnito before, I only got a phone with kitkat os, so I have a really low chance on being accepted in a paid test and 0 chance for ios. I only got 1 test when my phone with Nougat arrived which was a $10 test.

You get more chances if you have more ios devices. It wasn't really a big deal for me, I just wanted to test apps.

Pagnito
@Pagnito
Aug 25 2017 03:40
i feel u, its pretty cool to get to do that
Bryan Jay B. Panesa
@bryanpanesa
Aug 25 2017 03:42
@Pagnito https://betafamily.com/tests you can signup and check it out. Also go to the leaderboards to see the top testers.
Pagnito
@Pagnito
Aug 25 2017 03:44
@bryanpanesa sweet thanks
CamperBot
@camperbot
Aug 25 2017 03:44
pagnito sends brownie points to @bryanpanesa :sparkles: :thumbsup: :sparkles:
:cookie: 238 | @bryanpanesa |http://www.freecodecamp.com/bryanpanesa
Bryan Jay B. Panesa
@bryanpanesa
Aug 25 2017 03:46
@Pagnito You're welcome.
i need a solution
for my pomodoro clock
i want it to pause
but its not pausing
Long Nguyen
@longnt80
Aug 25 2017 03:53
@siddarthk123 you don't have a function to pause it
heroiczero
@heroiczero
Aug 25 2017 03:55
@siddarthk123 need something like a mouseclick or something to make it pause
Siddarth Krishnan
@siddarthk123
Aug 25 2017 03:55
i do
i got onclick
Long Nguyen
@longnt80
Aug 25 2017 03:55
@siddarthk123 which button to pause?
I only see a button to start
Siddarth Krishnan
@siddarthk123
Aug 25 2017 03:56
you click on the clock itself to pause.
but you have to click continously
in order for it to pause.
keep clicking on the circle and then it will pause.
Long Nguyen
@longnt80
Aug 25 2017 03:57
it doesn't
where's the click event for the circle in your code?
heroiczero
@heroiczero
Aug 25 2017 03:57
nope it doesn't and if you just click on the button on the bottom that just resets it
Siddarth Krishnan
@siddarthk123
Aug 25 2017 03:58
line 77.
Long Nguyen
@longnt80
Aug 25 2017 03:58
there's nothing on line 77
Siddarth Krishnan
@siddarthk123
Aug 25 2017 03:58
line 77 javascript
Long Nguyen
@longnt80
Aug 25 2017 03:59
@siddarthk123 I think you need to learn formating your code
Siddarth Krishnan
@siddarthk123
Aug 25 2017 03:59
here.
Long Nguyen
@longnt80
Aug 25 2017 04:00
Capture.JPG
heroiczero
@heroiczero
Aug 25 2017 04:00
@siddarthk123 i don't see anything on line 77
Siddarth Krishnan
@siddarthk123
Aug 25 2017 04:00
its in the javascript
line 77.
Long Nguyen
@longnt80
Aug 25 2017 04:01
no, there's nothing on line 77
Siddarth Krishnan
@siddarthk123
Aug 25 2017 04:01
how come i see it
Long Nguyen
@longnt80
Aug 25 2017 04:01
did you see the image? :point_up: August 25, 2017 11:00 AM
save the pen and give us the link again
Siddarth Krishnan
@siddarthk123
Aug 25 2017 04:01
c.onclick = function(e){
  var paused = "false"
  if(paused == "false"){
    paused = "true"
    clearInterval(timex)



  }


  if(paused == "true"){
    paused = "false"
    startTimer()

  }

}
this is what i got for the code.
heroiczero
@heroiczero
Aug 25 2017 04:01
i think i must be blind i cant see it either or he is using invisible ink
ok i saved it
here.
line 77.
is where i got the code.
Long Nguyen
@longnt80
Aug 25 2017 04:03
ok I can see it now. Remember to save it
Siddarth Krishnan
@siddarthk123
Aug 25 2017 04:03
ok
the problem is
that it evaluates
to true
and goes to the next line
and then runs that if block too.
i need some way to get around that.
Long Nguyen
@longnt80
Aug 25 2017 04:09
that's not it
Ken Haduch
@khaduch
Aug 25 2017 04:09
@siddarthk123 - you should use the javascript values of true and false instead of string values "true" and "false" - it's more typical to do that.
@siddarthk123 - you are doing something strange in that code - you are setting paused to "false", and then testing it for "false" (which should pass) then you set it to "true". Immediately after that, you are testing if ( paused == "true") and it will be because you just changed it. You have to think about what you're trying to do there, it doesn't seem like it's logical?
Long Nguyen
@longnt80
Aug 25 2017 04:17
@siddarthk123 you should try to make the timer with just number first to understand how it works before incorporate it with your canvas codes
your canvas code just make it more complicated for you to see, plus your code formating doesn't help either
Siddarth Krishnan
@siddarthk123
Aug 25 2017 04:19
what should
i do then
heroiczero
@heroiczero
Aug 25 2017 04:20
@siddarthk123 use <div> maybe
Long Nguyen
@longnt80
Aug 25 2017 04:20
@siddarthk123 https://codepen.io/longnt80/pen/qXyyjP?editors=1011
take this and try to make it work with 1 button instead of 2
work from the basic up
you're just trying many things
Siddarth Krishnan
@siddarthk123
Aug 25 2017 04:29
can you make it worth with one button?
Long Nguyen
@longnt80
Aug 25 2017 04:30
yes
you want me to do it for you?
Siddarth Krishnan
@siddarthk123
Aug 25 2017 04:31
ok
would the same logic
apply
to the .....
clicking
on the circle?
Long Nguyen
@longnt80
Aug 25 2017 04:31
should I give you my pomodoro clock too?
Siddarth Krishnan
@siddarthk123
Aug 25 2017 04:32
ok
is it the same as mine?
Long Nguyen
@longnt80
Aug 25 2017 04:32
not the same
the principle is the same
Siddarth Krishnan
@siddarthk123
Aug 25 2017 04:32
can you show me
how....
to make it work for mines
Long Nguyen
@longnt80
Aug 25 2017 04:33
@siddarthk123 if you want to make it work for you, try to make it by yourself
copy codes won't do anything
making it work with one button is very simple, if you can't make that then there's no point trying to do the clock
fefo360
@fefo360
Aug 25 2017 04:55
Hello guys, I'm new here :D
iso
@iso1048
Aug 25 2017 04:56
@fefo360 hey bro. welcome
fefo360
@fefo360
Aug 25 2017 04:56
Thank you
@siddarthk123 what's the matter ?
Barbara Pentoney
@flyfishingbarbara
Aug 25 2017 05:00
@SkyC0der no sweat...was nice to get tagged...remind me to tell you about my first hackathon...fam has been in town so havnt been doing my js lessons...but back at it this weekend...
@fefo360 welcome aboard...haha
fefo360
@fefo360
Aug 25 2017 05:01
Thanks
prakash chandra yadav
@prakashyadav008
Aug 25 2017 05:02
hellow everyone a little help here
whenever i change the size of the screen to less than 435px the search bar and button alignment changes
fefo360
@fefo360
Aug 25 2017 05:05
Did you check the property height
prakash chandra yadav
@prakashyadav008
Aug 25 2017 05:06
height is not set
Raymond
@CrazyAsianBoy
Aug 25 2017 05:07
I'm not sure but does .section1 position affect it? Because it's set to relative
prakash chandra yadav
@prakashyadav008
Aug 25 2017 05:08
ya its relative
and section1-1 is absolute
and inside section 1-1 is search bar and search button
Raymond
@CrazyAsianBoy
Aug 25 2017 05:09
try to sett the height at .section1
prakash chandra yadav
@prakashyadav008
Aug 25 2017 05:09
i hav the same problem in this one too so i was trying it separately
height ya did that doesnt matter
Raymond
@CrazyAsianBoy
Aug 25 2017 05:10
i'm sorry that's what i know. I hope others can help
prakash chandra yadav
@prakashyadav008
Aug 25 2017 05:10
i am stuck with this issue for a long tim
Raymond
@CrazyAsianBoy
Aug 25 2017 05:12
do you want to put it side by side? or under it?
Btw, try to set the width of your earch bar
search bar
prakash chandra yadav
@prakashyadav008
Aug 25 2017 05:14
i want the search bar and search button to be side by side
it is side by side until the screen size is changes to less than 435 px
at the pixel resolution the alignment changes
Chris Cullen
@123xylem
Aug 25 2017 05:15
Why is my page in mobile view got a massive gap above footer?!!!
llen-portfolio.herokuapp.com
cullen-portfolio.herokuapp.com
Raymond
@CrazyAsianBoy
Aug 25 2017 05:15
i usually use <button class="btn btn-block btn-primary">button</button>
Raymond
@CrazyAsianBoy
Aug 25 2017 05:16
the class so that i can change it on bootstrap later
^^ this in mobile view makes a massive gap pver footer for some reason?
iso
@iso1048
Aug 25 2017 05:16
@prakashyadav008 try giving .section1-1 a width of 330px
seems to work but you still need to make it responsive
fefo360
@fefo360
Aug 25 2017 05:17
It looks ok in my phone
prakash chandra yadav
@prakashyadav008
Aug 25 2017 05:18
@gothamknight https://codepen.io/prakashyadav008/pen/VzXeMP what do i do in this
fefo360
@fefo360
Aug 25 2017 05:18
The footer slightly off to the side that's it
prakash chandra yadav
@prakashyadav008
Aug 25 2017 05:18
the search button jst comes down @gothamknight
Chris Cullen
@123xylem
Aug 25 2017 05:19
@fefo360 sorry on my contact page
iso
@iso1048
Aug 25 2017 05:19
@prakashyadav008 oh i was looking at your other practice one.
Chris Cullen
@123xylem
Aug 25 2017 05:20
https://cullen-portfolio.herokuapp.com/contact
Why is this page big gap over footer ON MOBILE???
SOmeone said something to do with mobile px X2
prakash chandra yadav
@prakashyadav008
Aug 25 2017 05:20
ya that one i am jst testing all the positions because this one isnt working
iso
@iso1048
Aug 25 2017 05:20
@prakashyadav008 ok give .section1-1 a width of 390px. Again, it seems to fix it but you will still need to make it responsive
prakash chandra yadav
@prakashyadav008
Aug 25 2017 05:21
that doesnt work properly
iso
@iso1048
Aug 25 2017 05:21
works for me...
prakash chandra yadav
@prakashyadav008
Aug 25 2017 05:21
ya but when the animation starts it mislaigns again
fefo360
@fefo360
Aug 25 2017 05:22
@prakashyadav008 is it for a challange?
prakash chandra yadav
@prakashyadav008
Aug 25 2017 05:22
does anyaone know any good tutorials on positioning elements in html and css since thats the thing i am weak at i thinkg
ya Wikipedia viewer challange
iso
@iso1048
Aug 25 2017 05:22
600px?
prakash chandra yadav
@prakashyadav008
Aug 25 2017 05:22
@fefo360
iso
@iso1048
Aug 25 2017 05:23
@prakashyadav008 try codecademy
fefo360
@fefo360
Aug 25 2017 05:23
I advise you take a look at flex box and media queries if you haven't but that challange is using floats so it won't solve the challange
prakash chandra yadav
@prakashyadav008
Aug 25 2017 05:24
it is using float so i should use floats ? @fefo360 what do u mean
.?
fefo360
@fefo360
Aug 25 2017 05:25
Do you know flex grids ?
siddarthk123
prakash chandra yadav
@prakashyadav008
Aug 25 2017 05:27
@fefo360 ya but havnt used them
fefo360
@fefo360
Aug 25 2017 05:28
That helps alot with positioning
prakash chandra yadav
@prakashyadav008
Aug 25 2017 05:29
can we do it with without flex box
or grids
fefo360
@fefo360
Aug 25 2017 05:30
Unfortunately I have not learned floats too much yet
prakash chandra yadav
@prakashyadav008
Aug 25 2017 05:31
not really floats but jst using positioning
fefo360
@fefo360
Aug 25 2017 05:33
Can't really help at the moment I'm on my phone and can't resize the window to see the problem. I see it working fine in my device.
Sorin Ruse
@sorinr
Aug 25 2017 05:41
@prakashyadav008 supposed you want to achieve something like this ?
Sorin Ruse
@sorinr
Aug 25 2017 05:52
@prakashyadav008 changed the above link to work without using flex.
prakash chandra yadav
@prakashyadav008
Aug 25 2017 05:57
wait a min
Rafael Monroy
@rafaelmonroy
Aug 25 2017 05:59
can anyone tell me why this code, also fades out my button, I only want the h1 tag to fade
$(document).ready(function(){
  console.log("doc ready");
  $("#btn").click(function(){
    $("h1").fadeOut("4000");
  })
});
Gulsvi
@gulsvi
Aug 25 2017 06:00
@rafaelmonroy Did you close your <h1> tag by chance?
<h1></h1>
Long Nguyen
@longnt80
Aug 25 2017 06:01
@rafaelmonroy what does your html look like?
Rafael Monroy
@rafaelmonroy
Aug 25 2017 06:02
@SkyC0der haha thanks man, that was it
CamperBot
@camperbot
Aug 25 2017 06:02
rafaelmonroy sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2564 | @skyc0der |http://www.freecodecamp.com/skyc0der
Gulsvi
@gulsvi
Aug 25 2017 06:02
:)
had my entire page modified because of a missing closing tag once
Rafael Monroy
@rafaelmonroy
Aug 25 2017 06:04
@SkyC0der haha that sux man
Gulsvi
@gulsvi
Aug 25 2017 06:33
@prakashyadav008 Aligning inline elements within block elements gets a lot easier when you understand how those types of components work. Check out these articles, study them for a couple of hours, and try rewriting your code without the use of positioning or floats:
https://www.w3schools.com/html/html_blocks.asp
https://www.w3schools.com/css/css_boxmodel.asp
https://developer.mozilla.org/en-US/docs/Web/HTML/Block-level_elements
https://developer.mozilla.org/en-US/docs/Web/HTML/Inline_elements
practice using the various elements listed in those articles for a couple of hours - create some codepen projects and see how to center them, adjust their sizes, etc
It will save you a lot of time down the road
Rafael Monroy
@rafaelmonroy
Aug 25 2017 06:46

is there another way to add html text through jquery besides this

document.getElementById("people").innerHTML = output;

Im am trying to print out my output value into my ID people. thought this would worl but it didn’t

$(#people”).appendTo(people);

any suggestions?

Gulsvi
@gulsvi
Aug 25 2017 06:49

@rafaelmonroy The first code sample is regular javascript (not jquery). The equivalent is:

$("#people").html(output);

Or, if you're adding to existing html:

$("#people").append(output);
Rafael Monroy
@rafaelmonroy
Aug 25 2017 06:51
oh ok that makes sense,
@SkyC0der whats the difference between append, appendTo, and html ?
append and html work but not appendTo?
Gulsvi
@gulsvi
Aug 25 2017 06:53
@rafaelmonroy .append() and .appendTo() are basically the same. I usually just use .append()
.html() will overwrite all existing HTML, .append() will add to the existing HTML
Rafael Monroy
@rafaelmonroy
Aug 25 2017 06:54
appendTo doesnt seem to work on my end,
Gulsvi
@gulsvi
Aug 25 2017 06:55
.append() and .html() work, but .appendTo() does not?
Rafael Monroy
@rafaelmonroy
Aug 25 2017 06:56
var people = [
  {
   name: "Rafael",
   age: 28
  },
  {
   name: "Leslie",
   age: 27
  }

];
var output="";
for (i=0; i < people.length; i++){
output += "<li>"+people[i].name+"</li>";
}
<body>
  <div class="background">
    <div class="center-box">

      <h1>Hello</h1> 
      <button id="btn">Click</button>
      <ul id="people"></ul>
    </div>
  </div>
</body>
prakash chandra yadav
@prakashyadav008
Aug 25 2017 06:56
@sorinr it does work but the size of section 1 changes
Rafael Monroy
@rafaelmonroy
Aug 25 2017 06:56
@SkyC0der yeah, they both work except appendTo()
Gulsvi
@gulsvi
Aug 25 2017 06:57
The syntax is different, even though it does the same thing
I think it would be like $(output).appendTo("#people") ?
Rafael Monroy
@rafaelmonroy
Aug 25 2017 06:58
ahh I see, ok yeah haha they are the same thing
so .html() will erase the text inside the tags and insert new value?
@SkyC0der
Gulsvi
@gulsvi
Aug 25 2017 06:59
Yes, exactly @rafaelmonroy
So, you'd do this with .append():
var output = "";
for (i = 0; i < people.length; i++) {
  $("#people").append("<li>" + people[i].name + "</li>");
}
and this with .html:
var output = "";
for (i = 0; i < people.length; i++) {
  output += "<li>" + people[i].name + "</li>";
}

$("#people").html(output);
Rafael Monroy
@rafaelmonroy
Aug 25 2017 07:00
@SkyC0der cool man, thanks! that really cleared things up for me
CamperBot
@camperbot
Aug 25 2017 07:00
rafaelmonroy sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:warning: rafaelmonroy already gave skyc0der points
Gulsvi
@gulsvi
Aug 25 2017 07:00
No problem
prakash chandra yadav
@prakashyadav008
Aug 25 2017 07:00
@SkyC0der ya ill do that ..ill be back if i get stuck
Gulsvi
@gulsvi
Aug 25 2017 07:01
Yeah, let us know! :sparkles:
prakash chandra yadav
@prakashyadav008
Aug 25 2017 07:01
@SkyC0der
a little help
why cant i see the background-color in section1-1 class
Gulsvi
@gulsvi
Aug 25 2017 07:02
@prakashyadav008 add a border to that section and you'll see why
.section1-1{ 
  border: 1px solid black;
  position:relative;
  background-color:green;
  #left:35%;  
  width:100%;
}
it has no height
prakash chandra yadav
@prakashyadav008
Aug 25 2017 07:02
and the search button doesnt float towards left of search bar
Gulsvi
@gulsvi
Aug 25 2017 07:03
whenever a div isn't acting like it should, I temporarily add borders to all of my elements to see how the browser is trying to display them
* {
  border: 1px solid black;
}
^^ great for debugging css
prakash chandra yadav
@prakashyadav008
Aug 25 2017 07:05
i added height of 20 px to section1-1 and the search bar and search button
but they are of different height
why..?
take a look
Gulsvi
@gulsvi
Aug 25 2017 07:07
@prakashyadav008 Your <input> has padding by default - every browser has default styling for all the elements
So, it adds 1px of padding and makes it 22px instead of 20 like you want
prakash chandra yadav
@prakashyadav008
Aug 25 2017 07:08
so how can i disable default styles for any element i use
.?
Gulsvi
@gulsvi
Aug 25 2017 07:08
A lot of people use a reset.css to do that
they define the size for all the elements - go to codepen -> settings -> CSS, and select "Reset"
then you can choose a height that matches the elements you want and it will be the same on all browsers
prakash chandra yadav
@prakashyadav008
Aug 25 2017 07:10
not jst in codepen like in general
Sorin Ruse
@sorinr
Aug 25 2017 07:10
@prakashyadav008 try to reload the example and let me know if this is what you meant
Gulsvi
@gulsvi
Aug 25 2017 07:11
@prakashyadav008 Codepen just adds the common library reset.css when you do that: http://cssreset.com/scripts/eric-meyer-reset-css/
^^ That's the code for it
But honestly, try to simplify what you're doing. Remove the floats, the positioning, etc.. it really complicates things
if you want a green background that's the same height, no need to specify a height
prakash chandra yadav
@prakashyadav008
Aug 25 2017 07:13
@sorinr ya but section1-1 is width is large even when u resize the page to less than 400px
Gulsvi
@gulsvi
Aug 25 2017 07:13
if you want it centered, just use text-align: center on the parent element
if you want the search icon on the left, put it before the input box in your HTML
prakash chandra yadav
@prakashyadav008
Aug 25 2017 07:14
@SkyC0der i added positioning so that the elements dont misalign when page size changes
Gulsvi
@gulsvi
Aug 25 2017 07:14
@prakashyadav008 For that, you can just add white-space: nowrap to keep the icon from wrapping to the next line
prakash chandra yadav
@prakashyadav008
Aug 25 2017 07:14
when i use transition property i can use the positioning to add the transition
Gulsvi
@gulsvi
Aug 25 2017 07:15
transition works with margins too
no need to modify the position property and risk taking the element out of the natural document flow
prakash chandra yadav
@prakashyadav008
Aug 25 2017 07:16
i am having trouble with positioning and animation the most
Sorin Ruse
@sorinr
Aug 25 2017 07:16
@prakashyadav008 the section1-1 width is now inherited from section1 thats 100vw. be aware that also section2 and section3 are actually inside of section1
prakash chandra yadav
@prakashyadav008
Aug 25 2017 07:17
ya ...but i need a general soultion which works when the page size changes
which i can reuse later on other project
@sorinr
Long Nguyen
@longnt80
Aug 25 2017 07:17
@prakashyadav008 for css animation, you can take a look at these videos: https://www.youtube.com/watch?v=8kK-cA99SA0&list=PLqGj3iMvMa4LvJ8VctoXnPI0dtE40wfid
prakash chandra yadav
@prakashyadav008
Aug 25 2017 07:17
@longnt80 and postitioning
@SkyC0der when should i use positioning and when not
Sorin Ruse
@sorinr
Aug 25 2017 07:19
@prakashyadav008 a general solution for what? try to explain better whats the problem with the example above , so i can understand what you want to achieve
Long Nguyen
@longnt80
Aug 25 2017 07:19
@prakashyadav008 you mean the position property?
Gulsvi
@gulsvi
Aug 25 2017 07:19
@prakashyadav008 It's for very specific needs, I always try to use position as a last resort
For example, if you want one element on top of another
Maybe if you wanted your search icon to be inside of your input box, then you would use position: absolute on the icon and position: relative on the input
prakash chandra yadav
@prakashyadav008
Aug 25 2017 07:21
@sorinr i want o create a search bar that expands towards the left and and stays at the center of the page but moves to the top of the page when someone searches something
Gulsvi
@gulsvi
Aug 25 2017 07:21
otherwise, just let the element follow the natural document flow
Long Nguyen
@longnt80
Aug 25 2017 07:21
yeah, most of the time, you don't need position
prakash chandra yadav
@prakashyadav008
Aug 25 2017 07:22
@SkyC0der so for creating a search bar at the center of the page with a search button beside it i shouldnt use positioning
Gulsvi
@gulsvi
Aug 25 2017 07:22
Correct, no need for that
prakash chandra yadav
@prakashyadav008
Aug 25 2017 07:22
.?
Gulsvi
@gulsvi
Aug 25 2017 07:22
@prakashyadav008 See what I did here: https://s.codepen.io/anon/pen/qXyQVP and click the search box
prakash chandra yadav
@prakashyadav008
Aug 25 2017 07:22
and how do i handle the different page resoultions..?
since that makes the elements misalign
Gulsvi
@gulsvi
Aug 25 2017 07:23
you could do something similar on enter - but really there's very little CSS and it work on all screen sizes
prakash chandra yadav
@prakashyadav008
Aug 25 2017 07:23
@SkyC0der
Long Nguyen
@longnt80
Aug 25 2017 07:23

@prakashyadav008

and how do i handle the different page resoultions..?

media queries

prakash chandra yadav
@prakashyadav008
Aug 25 2017 07:25
media queries but i dont want the layout to change the layout should remain same as the page size changes
@longnt80
@SkyC0der
Gulsvi
@gulsvi
Aug 25 2017 07:25
I don't think you would need media queries for your current design
Sorin Ruse
@sorinr
Aug 25 2017 07:25
@prakashyadav008 using vw or vh instead of % or px will do most of the job on ensuring responsiveness
Gulsvi
@gulsvi
Aug 25 2017 07:26
max-width: 100% is really powerful sometimes too
for block/inline-block anyway
Sorin Ruse
@sorinr
Aug 25 2017 07:38
@SkyC0der yes ofc % are more powerful sometimes vs vw or vh. thats why i said "do most of the job"
Gulsvi
@gulsvi
Aug 25 2017 07:39
@sorinr Yeah, I'm finding that vh is really useful on parent containers with % inside. I haven't found a need for vw that much yet
width is the easy part with CSS :p
height is such a pain...
Sorin Ruse
@sorinr
Aug 25 2017 07:42
@SkyC0der yep. width its not a problem :)
prakash chandra yadav
@prakashyadav008
Aug 25 2017 07:58
but block elements width isnt 100%
or block inline elements
Gulsvi
@gulsvi
Aug 25 2017 07:59
inline-block expands to the width of the content inside. block elements are 100%
iso
@iso1048
Aug 25 2017 08:00
@SkyC0der another big night?
prakash chandra yadav
@prakashyadav008
Aug 25 2017 08:00
when should i define block vs inline block elemnts
.?
Gulsvi
@gulsvi
Aug 25 2017 08:00
@gothamknight :wave: I'll be asleep in an hour probably :)
prakash chandra yadav
@prakashyadav008
Aug 25 2017 08:00
or inline elements..?
@SkyC0der
Gulsvi
@gulsvi
Aug 25 2017 08:01
@prakashyadav008 block elements take up their own line (like <div>)
inline-block elements can go side-by-side all on the same line
inline elements have no width or height
Not sure if that makes sense
prakash chandra yadav
@prakashyadav008
Aug 25 2017 08:02
so two elements inside a div with display:inline-block will be side by side
Gulsvi
@gulsvi
Aug 25 2017 08:02
yes
and you can control their width + height
iso
@iso1048
Aug 25 2017 08:03
@SkyC0der yeah mate, get your sleep
prakash chandra yadav
@prakashyadav008
Aug 25 2017 08:03
so two divs inside a div will be side by side if defined inline-block
after i am a little good in front end ..i would finaly be able to do cool stuff on back end using machine learning or A.I
Gulsvi
@gulsvi
Aug 25 2017 08:03
just have to finish Exact Change before tomorrow @gothamknight
prakash chandra yadav
@prakashyadav008
Aug 25 2017 08:04
i feel such a beginner in front end
Gulsvi
@gulsvi
Aug 25 2017 08:04
@prakashyadav008 A few of us were thinking about building the next version of camperbot - a super intelligent free code camp bot :)
iso
@iso1048
Aug 25 2017 08:04
@SkyC0der I'm sure you will. did you complete any advanced projects?
Gulsvi
@gulsvi
Aug 25 2017 08:04
cbot how are you today?
CamperBot
@camperbot
Aug 25 2017 08:04
you called?
iso
@iso1048
Aug 25 2017 08:05
cbot where is the nearest toilet?
CamperBot
@camperbot
Aug 25 2017 08:05
you called?
Gulsvi
@gulsvi
Aug 25 2017 08:05
eightball will @gothamknight find a toilet
CamperBot
@camperbot
Aug 25 2017 08:05
@SkyC0der :8ball: outlook good :sparkles:
Gulsvi
@gulsvi
Aug 25 2017 08:05
:+1:
iso
@iso1048
Aug 25 2017 08:05
yeah awesome. 'cause I gotta go right now
Gulsvi
@gulsvi
Aug 25 2017 08:05
tmi
prakash chandra yadav
@prakashyadav008
Aug 25 2017 08:08
@SkyC0der count me in if u start the project
would be fun to work on it
@SkyC0der free code camp has study groups ...we should form project groups and build something cool
and learn as we build that thing
prakash chandra yadav
@prakashyadav008
Aug 25 2017 08:16
is it necessary to use a header tag instead of div tag
@SkyC0der
Gulsvi
@gulsvi
Aug 25 2017 08:18
@prakashyadav008 Not necessary, but it helps Google understand your web page better
All of the Semantic Tags help search engines
prakash chandra yadav
@prakashyadav008
Aug 25 2017 08:22
ohh thanks @SkyC0der
CamperBot
@camperbot
Aug 25 2017 08:22
prakashyadav008 sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2567 | @skyc0der |http://www.freecodecamp.com/skyc0der
prakash chandra yadav
@prakashyadav008
Aug 25 2017 08:22
how do i know the default styling of any element
@SkyC0der
Gulsvi
@gulsvi
Aug 25 2017 08:25
@prakashyadav008 This seems to be a good list: https://www.w3schools.com/cssref/css_default_values.asp
iso
@iso1048
Aug 25 2017 08:31
@SkyC0der bootstrap: framework or library?
Gulsvi
@gulsvi
Aug 25 2017 08:32
@gothamknight framework
Tai Jones
@taiJones00
Aug 25 2017 08:49
Can I have help with a javascript problem
iso
@iso1048
Aug 25 2017 08:50
@taiJones00 i could try
Tai Jones
@taiJones00
Aug 25 2017 08:56
for (var i2 = 0; i2 < arr2.length; i2++)
{
  notHere = 0;
  for (var j2 = 0; j2 < arr1.length; j2++)
    {
      if (arr2[i2] != arr1[j2] && arr1.length !== 0)
        {
          notHere++;
        }
      if (notHere == arr1.length)
        {
          newArr.push(arr2[i2]);
        }
    }
}
Checks if value from second array is in first array
diffArray([], ["snuffleupagus", "cookie monster", "elmo"]);
In the case of this^
All those words should be added. Instead new array is return as []
Gulsvi
@gulsvi
Aug 25 2017 09:00
@taiJones00 use .includes() or .indexOf()
Go through the first array and add all the items from the 2nd array that are different to a 3rd array
Go through the second array and add all the items that are different to a 3rd array
return the 3rd array
Tai Jones
@taiJones00
Aug 25 2017 09:02
function diffArray(arr1, arr2) {
  var newArr = [];
  var notHere = 0;
  // checks if value from first array is in second array
  for (var i = 0; i < arr1.length; i++)
    {
      notHere = 0;
      for (var j = 0; j < arr2.length; j++)
        {
          if (arr1[i] != arr2[j])
            {
              notHere++;
            }
          if (notHere == arr2.length)
            {
              newArr.push(arr1[i]);
            }
        }
    }
    // checks if value from second array is in first array
    for (var i2 = 0; i2 < arr2.length; i2++)
    {
      notHere = 0;
      for (var j2 = 0; j2 < arr1.length; j2++)
        {
          if (arr2[i2] != arr1[j2] && arr1.length !== 0)
            {
              notHere++;
            }
          if (notHere == arr1.length)
            {
              newArr.push(arr2[i2]);
            }
        }
    }
  // Same, same; but different.
  return newArr;
}

diffArray([], ["snuffleupagus", "cookie monster", "elmo"]);
I think I have that
Wait I have to edit this
Gulsvi
@gulsvi
Aug 25 2017 09:03
use .indexOf() or .includes() instead
Tai Jones
@taiJones00
Aug 25 2017 09:04
But it almost works
Gulsvi
@gulsvi
Aug 25 2017 09:04
no nested for loops
Tai Jones
@taiJones00
Aug 25 2017 09:04
Ohhh
Gulsvi
@gulsvi
Aug 25 2017 09:04
if it almost works, I can take a closer look
I just have this reaction to say - "simplify" then I'll take a look :)
Tai Jones
@taiJones00
Aug 25 2017 09:05
Yeah it seems like a lot but hey almost works
Gulsvi
@gulsvi
Aug 25 2017 09:06
I think I'd just add a check - if one array is empty, return the other array
  if(!arr1.length) return arr2;
  if(!arr2.length) return arr1;
add those two checks and you're done :)
iso
@iso1048
Aug 25 2017 09:08
@taiJones00 yeah i need to work on analysing other peoples js algorithms
about @SkyC0der
CamperBot
@camperbot
Aug 25 2017 09:08
:star2: 2567 | @skyc0der |http://www.freecodecamp.com/skyc0der
Tai Jones
@taiJones00
Aug 25 2017 09:09
if (arr1 == [])
     {
      return arr2;
     }
  else if (arr2 == [])
    {
      return arr1;
    }
  else
    {
      return newArr;
    }
Gulsvi
@gulsvi
Aug 25 2017 09:09
This was my answer to that challenge:
function diffArray(arr1, arr2) {
  return [].concat(
    arr2.filter(val => !arr1.includes(val)),
    arr1.filter(val => !arr2.includes(val))
  );
}
Tai Jones
@taiJones00
Aug 25 2017 09:09
what even
iso
@iso1048
Aug 25 2017 09:09
@SkyC0der i just went to look at that haha
Tai Jones
@taiJones00
Aug 25 2017 09:09
how did you know to use .includes
Gulsvi
@gulsvi
Aug 25 2017 09:09
that's why I took so long looking at your code @taiJones00
I was like, hmmmm what are you doing
I read all of the MDN articles @taiJones00
iso
@iso1048
Aug 25 2017 09:10
ALL? far out
Gulsvi
@gulsvi
Aug 25 2017 09:10
.includes() is the same as .indexOf(item) > -1
Tai Jones
@taiJones00
Aug 25 2017 09:11
You really read all of them? Would you recommend?
Gulsvi
@gulsvi
Aug 25 2017 09:11
It took me a couple of months and lots of noob questions, but it was worth it I think
Tai Jones
@taiJones00
Aug 25 2017 09:11
Is that why you know the answer to every question on here
Gulsvi
@gulsvi
Aug 25 2017 09:11
It doesn't help with problem solving, but at least helps you see the tools you can use
iso
@iso1048
Aug 25 2017 09:12
@SkyC0der i would say that helps with problem solving haha
Gulsvi
@gulsvi
Aug 25 2017 09:12
lol, 95% of the questions here are repeats
Tai Jones
@taiJones00
Aug 25 2017 09:12
I'm doing what you did now
also I pasted your code in and it said arrow functions aren't allowed
Gulsvi
@gulsvi
Aug 25 2017 09:13
you can just add these lines to the beginning of your function:
  if(!arr1.length) return arr2;
  if(!arr2.length) return arr1;
You have to add //jshint esversion: 6 to the top
// jshint esversion: 6

function diffArray(arr1, arr2) {
  return [].concat(
    arr2.filter(val => !arr1.includes(val)),
    arr1.filter(val => !arr2.includes(val))
  );
}

diffArray([1, 2, 3, 5], [1, 2, 3, 4, 5]);
Tai Jones
@taiJones00
Aug 25 2017 09:13
:0
and you knew about that too
Gulsvi
@gulsvi
Aug 25 2017 09:14
Google helped me :)
Tai Jones
@taiJones00
Aug 25 2017 09:14
What a guy
Gulsvi
@gulsvi
Aug 25 2017 09:15
Well..definitely bedtime now :(
Didn't see the time
Tai Jones
@taiJones00
Aug 25 2017 09:15
adios and arigato @SkyC0der
CamperBot
@camperbot
Aug 25 2017 09:15
taijones00 sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 2568 | @skyc0der |http://www.freecodecamp.com/skyc0der
Gulsvi
@gulsvi
Aug 25 2017 09:16
Doitashimashite :bow: :)
Chris Cullen
@123xylem
Aug 25 2017 10:05
https://cullen-portfolio.herokuapp.com/contact
Anyone know why theres massive gap at bottom on Mobile view?
Apparently its something to do with mobiles using 2 X pixels and so standard height of screen is doubled.. I tried to add a meta tag with viewpoint but it just messed my whole screen up
bjarte
@freebattie
Aug 25 2017 11:08
@123xylem you can add <meta name="viewport" content="width=device-width, initial-scale=1.0"> for it to fit but you also need to use responsive design for it to work
if you do not add the tag, moblie dvices will zoom out the page to fit on the device
Chris Cullen
@123xylem
Aug 25 2017 11:09
@freebattie
@media only screen and (min-width:899px){
    .meList{
        font-size:2rem;
    }
}
Does this count as responsive?
IE does it include mobile
bjarte
@freebattie
Aug 25 2017 11:09
no you only changing the font size there
heroiczero
@heroiczero
Aug 25 2017 11:10
@123xylem only changing the font you might want to look into bootstrap, flexbox, or CSS grid to make it responsive depending on the screen
Chris Cullen
@123xylem
Aug 25 2017 11:10
@heroiczero @freebattie I have a lot of css like that
bjarte
@freebattie
Aug 25 2017 11:10
yeah i say go flexbox
Chris Cullen
@123xylem
Aug 25 2017 11:10


 #work .projectBox{
     float:left;
  max-width:50rem;
  height:30rem;
  margin-bottom:3rem;
  margin-right:30%;
  margin-left:30%;
  text-align:center;
  padding:1rem; 
  /*background-color:white;*/
  }

     @media only screen and (min-width: 550px){
 #work .projectBox{
     float:left;
  height:30rem;
  width:100%;
  margin-bottom:3rem;
  margin-right:3rem;
  margin-left:3rem;
  text-align:center;
  padding:1rem; 
  /*background-color:white;*/
  }
}
     @media only screen and (min-width: 750px){
 #work .projectBox{
     float:left;
  max-width:35rem;
  height:30rem;
  margin-bottom:3rem;
  margin-right:1rem;
  margin-left:0rem;
  text-align:center;
  padding:1rem; 
  /*background-color:white;*/
  }
}

@media only screen and (min-width: 1200px){
 #work .row .projectBox{
     float:left;
  max-width:35rem;
  height:30rem;
  margin-bottom:3rem;
  margin-right:3rem;
  margin-left:1rem;
  text-align:center;
  padding:1rem; 
  /*background-color:white;*/
  }
}
bjarte
@freebattie
Aug 25 2017 11:13
rem will only change vs what the root is set to
you only need to add <meta name="viewport" content="width=device-width, initial-scale=1.0">
then use media to style the broken sizes
can use rem if you like, but i just get confues by it i like % or vh,vw
Chris Cullen
@123xylem
Aug 25 2017 11:18
@freebattie goddam... I spent so long on my media already
I just have one page with that bug..
That responsive google console is a LIAR! :)
Told me it was all good many a time
bjarte
@freebattie
Aug 25 2017 11:20
yeha just add the tag and it shoudl look like the console
reason it dosent now is due to phone think it has to zoom out too fit page
Shadow Walker
@khashy
Aug 25 2017 11:23
window.onscroll = function() {myFunction()};
function myFunction() {
    var navbar = document.getElementById("myNavbar");
    if (document.body.scrollTop > 100 || document.documentElement.scrollTop > 100) {
        navbar.className = "w3-bar" + " w3-card-2" + " w3-animate-top" + " w3-white";
    } else {
        navbar.className = navbar.className.replace(" w3-card-2 w3-animate-top w3-white", "");
    }
}
$(window).scroll(function() {
    var navbar = $("#myNavbar");
    if ($('body').scrollTop() > 100 || $(documentElement).scrollTop() > 100) {
        $("#myNavbar").hasClass("w3-bar" + " w3-card-2" + " w3-animate-top" + " w3-white");
    }
    else{
        $("#myNavbar").attr("w3-bar" + " w3-card-2" + " w3-animate-top" + " w3-white", " w3-card-2 w3-animate-top w3-white");
    }
});
i re wrote this code from js to jquery
is anything wrong?
Markus Kiili
@Masd925
Aug 25 2017 11:24
@khashy First could be just window.onscroll = myFunction;
Shadow Walker
@khashy
Aug 25 2017 11:25
i just did that function in an annonymos func
bjarte
@freebattie
Aug 25 2017 11:25
@123xylem also rember if you have many media you need to set max too
if you dont you will have stuff from @media only screen and (min-width: 550px) may carry over
Chris Cullen
@123xylem
Aug 25 2017 11:28
@freebattie Yea the tag fixes the contact page but throws my whole site out of whack.. Im thinking for now il stick with the 1 bug on contact page (assuming theres no more?) rather than recode the whole responsiveness
Markus Kiili
@Masd925
Aug 25 2017 11:28
@khashy Why not just assign the function? What benefit having the anonymous function there gives?
Chris Cullen
@123xylem
Aug 25 2017 11:28
@freebattie as far as i can see theres no other bugs on the site on mobile especially?
https://cullen-portfolio.herokuapp.com/
^ If anyone sees bugs please shout them out... Or if you want to compliment me please feeel free :)
Shadow Walker
@khashy
Aug 25 2017 11:29
@Masd925 yea true
bjarte
@freebattie
Aug 25 2017 11:31
@123xylem you have same problem on all pages
you just dont see it as easy
Chris Cullen
@123xylem
Aug 25 2017 11:33
@freebattie all pages have gap at bottom on mobile?
I dont see them
on iphone 5
bjarte
@freebattie
Aug 25 2017 11:34
i phone 5 works, but if u tryothers it start to get vaky
if you try to change pages while on mobile they start looking wierd on the chrome debug tool
bjarte
@freebattie
Aug 25 2017 11:40
hmm maybe a bug in the dev tool, looks fine on iphone
bjarte
@freebattie
Aug 25 2017 11:57
@123xylem dont trust the console dev tool, found this https://mobile1st.com/can-trust-chromes-built-emulator/ so yeah just use a real phone to check if it works
Chris Cullen
@123xylem
Aug 25 2017 12:08
  <ul class="navbar-right">
                <li style="display:none;  ">    <em>SEO & Web Dev Professional</em>   </li>

            </ul>
How can I get the above Navbar to dissapear at under 960px width?

@media only screen and (max-width:960){
    #myNavbar > ul.navbar-right{
display:block;
content:" <em>SEO & Web Dev Professional</em>";

    }

}
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Aug 25 2017 13:29
@123xylem You need to specify the unit for max-width @media only screen and (max-width:960px)
Here is a working example: https://codepen.io/A_A/pen/VzBowV
Ahmed raza
@Raza403
Aug 25 2017 13:37
Can any one suggest me how can I render from JSON to html here? I recieved data from api (Data is shown in console) but i can't render it in html here is the link https://codepen.io/raza403/pen/vJaqbV
Chris Cullen
@123xylem
Aug 25 2017 13:37
@Otto-AA @Otto-AA Yes thankyou.. silly mistake for me
CamperBot
@camperbot
Aug 25 2017 13:37
:cookie: 384 | @otto-aa |http://www.freecodecamp.com/otto-aa
123xylem sends brownie points to @otto-aa :sparkles: :thumbsup: :sparkles:
Ahmed raza
@Raza403
Aug 25 2017 13:40
My problem is solved
why is my circle
not showing up?
Siddarth Krishnan
@siddarthk123
Aug 25 2017 14:28
i need help
i need help
with my
project
can someone
help me with my pomodoro
clock project?
Tom
@moT01
Aug 25 2017 14:33
@siddarthk123 whats up
buiphuking
@buiphuking
Aug 25 2017 14:33
anyone good at xampp?
Siddarth Krishnan
@siddarthk123
Aug 25 2017 14:34
tom m
can we get on skype
and talk?
Tom
@moT01
Aug 25 2017 14:34
no
we can talk here
Siddarth Krishnan
@siddarthk123
Aug 25 2017 14:34
so
i need to click on the circle
now
and stop
and resume the time
for the pomodoro clock
here is my code.
Tom
@moT01
Aug 25 2017 14:35
i dont see a circle
k
an updated link
Tom
@moT01
Aug 25 2017 14:36
you sure you want to use canvas?
i personally would scrap the canvas
Siddarth Krishnan
@siddarthk123
Aug 25 2017 14:36
yeah
i want to use it
Tom
@moT01
Aug 25 2017 14:36
you can make a circle with a border radius of 50%
i think it would make things easier
but i dont know much about canvas
Siddarth Krishnan
@siddarthk123
Aug 25 2017 14:36
its fine
lets just stick with this
just help me out with the timer
when i click on the circle
i want to pause and resume time.
Tom
@moT01
Aug 25 2017 14:38
i think canvas is over complicating things
here's what i found
Therefore, to get a click event on a canvas element (shape), you need to 
capture click events on the canvas HTML element and use some math to 
determine which element was clicked, provided you are storing the 
elements' width/height and x/y offset.
you could look for a library that makes working with canvas easier
Michael Norris
@Norrismi
Aug 25 2017 14:44
Is is possible to bold the author's names inside the array?
$(document).ready(function(){
            const quotes = ['"You\'re here for a purpose, live it daily." - Paula Pant',
            '"Motivation is what gets you started. Habit is what keeps you going." - Jim Ryun',
            '"Our greatest motivation in life comes from not knowing the future." - Thomas Frey',
            '"Let\'s make our future now, and let\'s make our dreams tomorrow\'s reality." - Malala Yousafzai',
            '"The power of imagination makes us infinite." - John Muir'];
Tom
@moT01
Aug 25 2017 14:45
@Norrismi the array will only hold strings and other data types, you could put a <b> tag around it so that when its rendered it turns bold
Michael Norris
@Norrismi
Aug 25 2017 14:47
ok, I was trying to use the <strong> tag, but no luck. Will have to change the parentheses with the <b> tag?
Tom
@moT01
Aug 25 2017 14:47
do you have a pen to show? strong should work as well
Michael Norris
@Norrismi
Aug 25 2017 14:48
I am working in atom. I'll give it a shot! thanks @moT01
CamperBot
@camperbot
Aug 25 2017 14:48
norrismi sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 810 | @mot01 |http://www.freecodecamp.com/mot01
Tom
@moT01
Aug 25 2017 14:48
quotes = [' "<strong>quote here</strong>" - Author ']
but i would maybe separate the quote and author into a sub array or something and put the styling in later
Michael Norris
@Norrismi
Aug 25 2017 14:49
hmm ok
Tom
@moT01
Aug 25 2017 14:49
but it should work either way
Daniel Feldman
@Feldbot
Aug 25 2017 14:55
Hi, I'm working on the Chunky Monkey basic algorithm and am not getting something about how I am using a loop and slices together. When I push to my array, I keep getting the same slice rather than having it update at a new index. Can anyone offer any pointers?
// Write a function that splits an array (first argument) into groups the length of size (second argument) and returns them as a two-dimensional array.

function chunkArrayInGroups(arr, size) {
  // Break it up.
  var monkeyArr = [];
  // console.log(arr);
  for (var i = 0; i < arr.length; i++) {
    monkeyArr.push(arr.slice(0, size));
    console.log(monkeyArr);
  }
  return arr;
}
chunkArrayInGroups([0, 1, 2, 3, 4, 5], 4); // => [[0, 1, 2, 3], [4, 5]]
Tom
@moT01
Aug 25 2017 14:58
one thing i see is you're slicing the same thing every time
try slice (i, size) and instead of i++ try i+=size
and your returning arr, which is your parameter that you never change
Daniel Feldman
@Feldbot
Aug 25 2017 15:15
@moT01 This looks closer, Tom, but it now is returning [[0, 1 , 2, 3][0]]...
Tom
@moT01
Aug 25 2017 15:16
now what do you have
Daniel Feldman
@Feldbot
Aug 25 2017 15:19
@moT01 Want to try it here: https://jsfiddle.net/feldbot/h91fceyk/
Tom
@moT01
Aug 25 2017 15:24
its the second slice
the size is the same
first slice 0-4
second slice 4-4
so change the size somehow
Stephen James
@sjames1958gm
Aug 25 2017 15:31
@Feldbot The second parameter to slice is not the size of the slice, but the index after the end of the slice
so (0, size) then (size, size + size)
Tom
@moT01
Aug 25 2017 15:33
i, i+size
what i came up with
Ahmed raza
@Raza403
Aug 25 2017 15:37
Hi can any one help me my code is not getting json from FCC weather API, While the same code was working an hour before, was displaying data in console. here is the link https://codepen.io/raza403/pen/vJaqbV
Tom
@moT01
Aug 25 2017 15:39
@Raza403 works for me, getting any errors?
Ahmed raza
@Raza403
Aug 25 2017 15:42
@moT01 I am not having data in consoleboth at code pen as well as my local server
Tom
@moT01
Aug 25 2017 15:42
@sarthakcoder check the example code
sarthakcoder
@sarthakcoder
Aug 25 2017 15:43
i have checked but not getting it

// Setup
var myStorage = {
"car": {
"inside": {
"glove box": "maps",
"passenger seat": "crumbs"
},
"outside": {
"trunk": "jack"
}
}
};

// Only change code below this line

var gloveBoxContents = "myStorage.car["inside"].glove box; // Change this line

Roxroy
@roxroy
Aug 25 2017 15:44
@sarthakcoder , you will need to user the dot notation to access the item that has the map value. The dot notation is like this .. ourStorage.desk.drawer;
sarthakcoder
@sarthakcoder
Aug 25 2017 15:45
but i have done that
Roxroy
@roxroy
Aug 25 2017 15:46
@sarthakcoder , you need to wrap glove box in a quote, remove the quote for myStorage
Daniel Feldman
@Feldbot
Aug 25 2017 15:46
@moT01 Thanks Tom, i, i+size worked. I wonder what is an easier way to understand these types of solutions. I really struggle with modifying the loop iterations to get different results.
CamperBot
@camperbot
Aug 25 2017 15:46
feldbot sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 811 | @mot01 |http://www.freecodecamp.com/mot01
Tom
@moT01
Aug 25 2017 15:47
@Raza403 not sure, maybe a cors issue? no errors in the console?
sarthakcoder
@sarthakcoder
Aug 25 2017 15:47
@roxroy i have done but no result
Tom
@moT01
Aug 25 2017 15:47
@Feldbot play it through step by step, typing the values
//loop 1
//i=0
//slice(0,4)

//loop 2
//i=4
//slice(4,8)
Roxroy
@roxroy
Aug 25 2017 15:50
@sarthakcoder , paste the code with the line for var gloveBoxContents
sarthakcoder
@sarthakcoder
Aug 25 2017 15:50
var gloveBoxContents = myStorage.car["inside"].glove box;
Daniel Feldman
@Feldbot
Aug 25 2017 15:51
@moT01 So you write them out in pseudocode each time just to better understand what needs to be done?
Roxroy
@roxroy
Aug 25 2017 15:52
@sarthakcoder , you need to add the quote around glove box, just link you did for "inside". Paste the line after making the changes
Tom
@moT01
Aug 25 2017 15:53
if im struggling its one way to figure stuff out
Daniel Feldman
@Feldbot
Aug 25 2017 15:53
@moT01 Cool, thanks for the tip, I'll try that!
CamperBot
@camperbot
Aug 25 2017 15:53
feldbot sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:warning: feldbot already gave mot01 points
Tom
@moT01
Aug 25 2017 15:54
on the code you first showed me you would have seen
//loop 1
//slice (0,4)

//loop 2 
//slice (0,4)
sarthakcoder
@sarthakcoder
Aug 25 2017 15:55
var gloveBoxContents = myStorage.car["inside"].["glove box"];
Roxroy
@roxroy
Aug 25 2017 15:56
@sarthakcoder , to access the item as an array , remove the . between inside and glovebox ,
Daniel Feldman
@Feldbot
Aug 25 2017 15:56
@moT01 Right, I knew that was happening in the first example. Maybe writing it down helps show that both the counter i and the slice needed to be adjusted. I couldn't figure out if it was one or the other.
sarthakcoder
@sarthakcoder
Aug 25 2017 15:57
Use dot and bracket notation to access myStorage???
still prob
Gulsvi
@gulsvi
Aug 25 2017 16:01
@sarthakcoder For that object, it would be: myStorage.car.inside["glove box"]
This would also work: myStorage.car["inside"]["glove box"]
sarthakcoder
@sarthakcoder
Aug 25 2017 16:02
thnx bro @SkyC0der it worked
Gulsvi
@gulsvi
Aug 25 2017 16:03
Use dot .notation or [bracket] notation, not .[both] at same time :)
Mahesh
@mahis929
Aug 25 2017 16:10
hey i want to change the color of jumbotron
pls help anyone
Tom
@moT01
Aug 25 2017 16:16
try adding another selector in the css
@mahi929
div.jumbotron {color: purplish; }
it would help if you shared some code or a pen
Gulsvi
@gulsvi
Aug 25 2017 16:27

@mahi929 This works fine for changing the background color of a jumbotron:

.jumbotron {
  background-color: #2874A6;
}

But you need to make sure that your CSS loads after Bootstrap's CSS. If you have a link to bootstrap in your codepen's HTML panel, it needs to go in Settings instead.

aRtoo
@artoodeeto
Aug 25 2017 17:00
whats good fam! just wanted to ask. is this called cheating?? on my algo problem it wasnt stated that i should use parseIntbut i did. to conver the binary to charCode. and you have another solution for this algo?? heres the code:

function binaryAgent(str) {

  str = str.split(' ');
  var binVal = [];
   var parseVal; 

  for(var i=0; i<str.length; i++) {
    parseVal = parseInt(str[i],2);

    binVal.push(String.fromCharCode(parseVal));
  }

  return binVal.join('');

}
Tom
@moT01
Aug 25 2017 17:05
@artoodeeto looks fine to me if it works
Sly Fox
@Gurukorgi
Aug 25 2017 17:08
wow am back for good this time
Gulsvi
@gulsvi
Aug 25 2017 17:09
@artoodeeto Your solution is great. This is cheating :)
function binaryAgent(str) {
  if (str == "01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111") {
    return "Aren't bonfires fun!?";
  } else {
    return "I love FreeCodeCamp!";
  }
}
welcome back @Gurukorgi
aRtoo
@artoodeeto
Aug 25 2017 17:12
@SkyC0der hahaha. idol iba ka talaga. master!!! wag kana nga mag english. pinoy ka naman eh. haha
Gulsvi
@gulsvi
Aug 25 2017 17:13
lmao tito
Gustó ko ng Tagalog! Maaarì bang magpraktis ako kasama ka? Ang gandá ng pangalan mo. Maging masayá sana ang araw mo!
aRtoo
@artoodeeto
Aug 25 2017 17:18
@SkyC0der hahaha. tangina this!! ang lalim ng tagalog mo tol. kasama mo ba nanay mo?? haha
Andrew Horn
@sophyphreak
Aug 25 2017 17:28
@BurakAy Yeah, thanks for your help
CamperBot
@camperbot
Aug 25 2017 17:28
sophyphreak sends brownie points to @burakay :sparkles: :thumbsup: :sparkles:
:cookie: 317 | @burakay |http://www.freecodecamp.com/burakay
Chris
@bestintown23
Aug 25 2017 18:18
Hello how can i center my table? https://codepen.io/bestintown23/pen/zdpXjB
Vamshi Gudipati
@vamshikrishna144
Aug 25 2017 18:20
@bestintown23
table{
  width:80%;
  background-color:#cc99ff;
  margin: 0 auto;
}
Chris
@bestintown23
Aug 25 2017 18:23
@vamshikrishna144 thanks
CamperBot
@camperbot
Aug 25 2017 18:23
bestintown23 sends brownie points to @vamshikrishna144 :sparkles: :thumbsup: :sparkles:
:cookie: 4 | @vamshikrishna144 |http://www.freecodecamp.com/vamshikrishna144
Roxroy
@roxroy
Aug 25 2017 18:36
@bestintown23 , it would be nice to see the prices line up, add this to your css
table td:nth-child(3) {  
  text-align:right; 
}
just1witness
@just1witness
Aug 25 2017 18:45
I know this is nonsense, I am just playing around and learning a lot by seeing what different things do. Can anyone tell me why this for loop only runs once?
 var answer = ["TWENTY,","20","TWENTY,","20","TWENTY,","20","TWENTY,","20","TEN,","10","FIVE,","5","ONE,","1","QUARTER,","0.25","QUARTER,","0.25","DIME,","0.10","DIME,","0.10","PENNY,","0.01","PENNY,","0.01","PENNY,","0.01","PENNY,","0.01",]


 for(var i = 0; answer.length; i++){
   if(answer[i] === answer[i+2]){
     var sum =  +answer[i +1] + +answer[i + 3];
    return answer[i]  + sum;
   }
 }
     return answer;
It returns TWENTY, 40
I', trying to add the sum of the duplicates, btw
Tom
@moT01
Aug 25 2017 18:49
answer.length
just1witness
@just1witness
Aug 25 2017 18:50
ingnore me, lol I see it
@moT01 tahnk you!
@moT01 Thank you
CamperBot
@camperbot
Aug 25 2017 18:50
just1witness sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 812 | @mot01 |http://www.freecodecamp.com/mot01
Renan Teixeira Ferraz
@RTFerraz
Aug 25 2017 19:44
Hi there
I'm having a trouble finishing the random quote machine
Tom
@moT01
Aug 25 2017 19:50
whats up @RTFerraz
Renan Teixeira Ferraz
@RTFerraz
Aug 25 2017 19:50
Hi @moT01
I've been all day trying to finish the random quote machine
trying to create the tweet button
iso
@iso1048
Aug 25 2017 19:51
@SkyC0der safe travels
Renan Teixeira Ferraz
@RTFerraz
Aug 25 2017 19:52
I found one that can tweet the title of the page
this was the better one I found
Tom
@moT01
Aug 25 2017 19:52
you can hard code a pre-filled tweet into a url, i see most people doing it like this
mine - https://twitter.com/intent/tweet/?text=" + $(".quote").text() + " " + $(".author").text()
Renan Teixeira Ferraz
@RTFerraz
Aug 25 2017 19:54
hmm
and insert this as a href in hyperlink tag?
Tom
@moT01
Aug 25 2017 19:55
yea, that would work
my whole function
  $("#tweet").on("click", function() {
      window.open("https://twitter.com/intent/tweet/?text=" + $(".quote").text() + " " + $(".author").text());             
});
Renan Teixeira Ferraz
@RTFerraz
Aug 25 2017 19:57
hmm
tnx
I'll try this
Christopher McCormack
@cmccormack
Aug 25 2017 19:58
you may want to clean up the string first as well:
...
  $("#btn-tweet").attr("href", twitter_url + fixedEncodeURIComponent(quote + ' - ' + author))
}

function fixedEncodeURIComponent (str) {
  return encodeURIComponent(str).replace(/[!'()*]/g, function(c) {
    return '%' + c.charCodeAt(0).toString(16)
  })
}
Gulsvi
@gulsvi
Aug 25 2017 20:00
Thanks @gothamknight
CamperBot
@camperbot
Aug 25 2017 20:00
skyc0der sends brownie points to @gothamknight :sparkles: :thumbsup: :sparkles:
:cookie: 397 | @gothamknight |http://www.freecodecamp.com/gothamknight
Renan Teixeira Ferraz
@RTFerraz
Aug 25 2017 20:00
clean up?
Christopher McCormack
@cmccormack
Aug 25 2017 20:01
Certain characters are not permitted in a URI. If it's just text you're probably fine, but it's good to try and cover some marginal cases
Renan Teixeira Ferraz
@RTFerraz
Aug 25 2017 20:01
Why would I have to clean it?
OK
thanks
Carlos Reyes
@carloskappa
Aug 25 2017 20:07
How can i affect an element whose parent doesnt have certain class
Christopher McCormack
@cmccormack
Aug 25 2017 20:07
using css or js?
Carlos Reyes
@carloskappa
Aug 25 2017 20:10
only css
with js is pretty easy but i can't use it in this case
Christopher McCormack
@cmccormack
Aug 25 2017 20:11
you can select an element with a child if your child has a class or element
parent > child { prop: value; }
if you want the parent, you need to target the parent
Renan Teixeira Ferraz
@RTFerraz
Aug 25 2017 20:22
there is a error message showing up
ReferenceError: $ is not defined
Tom
@moT01
Aug 25 2017 20:24
@RTFerraz that's jquery, probly not added
Renan Teixeira Ferraz
@RTFerraz
Aug 25 2017 20:24
I checked here
it's added
<script src="js/jquery-3.2.1.min.js" type="text/javascript" language="javascript"></script>
In the end of the document
gulptech
@gulptech
Aug 25 2017 20:27
and all your code is within the document.ready function ?
Renan Teixeira Ferraz
@RTFerraz
Aug 25 2017 20:28
I found out the why
Christopher McCormack
@cmccormack
Aug 25 2017 20:28
@RTFerraz you have jquery downloaded?
Renan Teixeira Ferraz
@RTFerraz
Aug 25 2017 20:28
I put the reference in the top of the document
it worked
it was in the end
Moisés Man
@moigithub
Aug 25 2017 20:47
...ur own script should be after jquery .. cuz loading order
Renan Teixeira Ferraz
@RTFerraz
Aug 25 2017 20:50
Kkk thanks
Now I'll finish this project fast
Renan Teixeira Ferraz
@RTFerraz
Aug 25 2017 21:09
thanks @moigithub @cmccormack @gulptech @moT01
CamperBot
@camperbot
Aug 25 2017 21:09
rtferraz sends brownie points to @moigithub and @cmccormack and @gulptech and @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 813 | @mot01 |http://www.freecodecamp.com/mot01
:star2: 1169 | @cmccormack |http://www.freecodecamp.com/cmccormack
:cookie: 324 | @gulptech |http://www.freecodecamp.com/gulptech
:star2: 3606 | @moigithub |http://www.freecodecamp.com/moigithub
Mercy Manrique
@mers89
Aug 25 2017 22:25
Im working on the twitch API project. From the user stories, it mentioned to use https://wind-bow.gomix.me/twitch-api but when you try to look at the documentation it says bad request error message
iso
@iso1048
Aug 25 2017 22:30
@mers89 that is just the endpoint to use. you can use e.g. https://wind-bow.gomix.me/twitch-api/streams/freecodecamp (which has 'stream' : null when user is offline) or https://wind-bow.gomix.me/twitch-api/channels/freecodecamp. (replace freecodecamp with the usernames.) does that address your issue?
aRtoo
@artoodeeto
Aug 25 2017 22:36
yow fam. how can i return one single value? so on the everything be true algo challenge i need to loop thru the collection and check the keys if it has a true value. if not return false. but its returning me multiple bool. heres the code fam. thanks

function truthCheck(collection, pre) {

return  collection.map(function(collection){

      if(collection[pre]){
        return true;
      }else {
        return false;
      }    
  });

}
Mercy Manrique
@mers89
Aug 25 2017 22:39
@gothamknight thanks ill try it
CamperBot
@camperbot
Aug 25 2017 22:39
mers89 sends brownie points to @gothamknight :sparkles: :thumbsup: :sparkles:
:cookie: 398 | @gothamknight |http://www.freecodecamp.com/gothamknight
Siddarth Krishnan
@siddarthk123
Aug 25 2017 22:50
can someone answer my question
why does it skip the set interval
and go to the second if statement.
Gulsvi
@gulsvi
Aug 25 2017 22:54
@siddarthk123 Have you done the quote machine yet?
Siddarth Krishnan
@siddarthk123
Aug 25 2017 22:55
no but why?
can u answer my question sky
like
why does it go to the second if
Gulsvi
@gulsvi
Aug 25 2017 22:55
Because the Pomodoro Clock is an advanced front-end project
Siddarth Krishnan
@siddarthk123
Aug 25 2017 22:55
and it skips the setInterval.
Gulsvi
@gulsvi
Aug 25 2017 22:55
You might want to start with the easier projects first
Siddarth Krishnan
@siddarthk123
Aug 25 2017 22:55
i almost finished it
sky
can u explain me though
why
does it skip the setinterval
and go to the second if
Gulsvi
@gulsvi
Aug 25 2017 22:55
I tried looking at your code, and I can't understand it very well
That's why I asked if you've done the earlier projects yet
It will help you a lot with this project if you finish all of the algorithms, especially the advanced ones
Mercy Manrique
@mers89
Aug 25 2017 22:58
@gothamknight do you mind looking at my code. Still with the twitch API https://codepen.io/mers89/pen/wqEMxz
with the code it should pull up the api to say whether or not FCC is online or offline but it doesnt show
Mercy Manrique
@mers89
Aug 25 2017 23:03
@gothamknight originally I was trying to use https://api.twitch.tv/kraken/streams/freecodedecamp
iso
@iso1048
Aug 25 2017 23:04

@mers89

$(document).ready(function(){
 //free code camp streaam info and status API call
 var url= "https://wind-bow.glitch.me/twitch-api/streams/freecodecamp";

 $.getJSON(url,function(data1){
 if (data1.stream===null){
  $("#fccStatus").html("Free Code Camp is currently offline");
 }
  else{
  $("#fccStatus").html("Free Code Camp is currently online");
  }
 });


   });

replace your js ode with the above. You were just missing a few brackets i think

let me know how it goes
Siddarth Krishnan
@siddarthk123
Aug 25 2017 23:07
cna someone help me with my code?
please.
Mercy Manrique
@mers89
Aug 25 2017 23:08
@gothamknight thanks. I was missing a colon. lol
CamperBot
@camperbot
Aug 25 2017 23:08
mers89 sends brownie points to @gothamknight :sparkles: :thumbsup: :sparkles:
:warning: mers89 already gave gothamknight points
iso
@iso1048
Aug 25 2017 23:08
no problem
Siddarth Krishnan
@siddarthk123
Aug 25 2017 23:08
gotham
i have a question
can you help me solve my problem
why does.....
iso
@iso1048
Aug 25 2017 23:09
@siddarthk123 sorry bro i do not know that stuff yet
Siddarth Krishnan
@siddarthk123
Aug 25 2017 23:09
oh I see.
Rafael Monroy
@rafaelmonroy
Aug 25 2017 23:28
can anyone give me a hint on how to edit this code so that only it shows quotes[0].quote on first click then quotes[1].quote on second click until i<quotes.length
var output = "";
for (i=0;i<quotes.length;i++){
  output += "<li>"+quotes[i].quote+"</li>"
}
$("#btn").click(function(){
  $("#people").append(output);
});
iso
@iso1048
Aug 25 2017 23:29
@rafaelmonroy have you declared i? You could try using .html instead of .append
Stephen James
@sjames1958gm
Aug 25 2017 23:31
@rafaelmonroy Don't do the for loop.
set i = 0 outside the click handler
Then inside
$("#people").html("<li>"+quotes[i].quote+"</li>");
i = (i + 1) % quotes.length; // use % to cycle back to zero
Use html() not append() to replace the previous quote
Rafael Monroy
@rafaelmonroy
Aug 25 2017 23:46
@sjames1958gm thanks man that work!
CamperBot
@camperbot
Aug 25 2017 23:46
rafaelmonroy sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 8388 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Justin25
@Justin25
Aug 25 2017 23:52
Does anyone here have experience with EJS (embedded javascript)?
fefo360
@fefo360
Aug 25 2017 23:57
@siddarthk123 were you able to fix the timer ?
Rafael Monroy
@rafaelmonroy
Aug 25 2017 23:58
@sjames1958gm as far as getting it to print a random quote I replace "(i+1)" to "(i + Math.floor(Math.random() * 2)" but it always starts off with the first quote and then goes random, shouldn't it be random right away?
Stephen James
@sjames1958gm
Aug 25 2017 23:59
@rafaelmonroy Put that before you do the .html() call so that you are setting i to random before selecting the quote