These are chat archives for FreeCodeCamp/HelpFrontEnd

29th
Aug 2017
Rafael Monroy
@rafaelmonroy
Aug 29 2017 00:19
what is the best way in JQuery to change the background color everytime the same button is clicked, so far i have this. but it wont change back to original color
$("body").on("click", function (){
      $(this).css("background-color", "#000ff00");
    });
Jorge
@OrangeKulture
Aug 29 2017 00:22
@rafaelmonroy u need a flag ..
Rafael Monroy
@rafaelmonroy
Aug 29 2017 00:22
@OrangeKulture a flag?
iso
@iso1048
Aug 29 2017 00:22
@rafaelmonroy you can make an array of background-colors and generate a random number each time the button is clicked which you can use to access a color in the array.
Jorge
@OrangeKulture
Aug 29 2017 00:23
let flag = false;
$("body").on("click", function (){
      if(!flag){
       $(this).css("background-color", "#000ff00");
       flag = true;
      }else
       $(this).css("background-color", "#someothercolor");
       flag = false;
    });
Rafael Monroy
@rafaelmonroy
Aug 29 2017 00:26
@OrangeKulture oh man, never seen anything like that lol I tried but didnt work
Jorge
@OrangeKulture
Aug 29 2017 00:27
i wouldnt attach a click event to the body tho
Rafael Monroy
@rafaelmonroy
Aug 29 2017 00:28
@OrangeKulture yeah you’re right
Jorge
@OrangeKulture
Aug 29 2017 00:29
@rafaelmonroy example
Trommelochse
@Trommelochse
Aug 29 2017 00:33
thanks @OrangeKulture for not letting people attaching click events to the body <3
CamperBot
@camperbot
Aug 29 2017 00:33
trommelochse sends brownie points to @orangekulture :sparkles: :thumbsup: :sparkles:
:cookie: 451 | @orangekulture |http://www.freecodecamp.com/orangekulture
Jorge
@OrangeKulture
Aug 29 2017 00:33
@Trommelochse hahah sure! :joy:
Trommelochse
@Trommelochse
Aug 29 2017 00:34
:D
Tom
@moT01
Aug 29 2017 00:34
if you just want to switch between two backgrounds check out jquerys toggleClass() method https://stackoverflow.com/questions/9714498/toggle-div-color-on-click @rafaelmonroy
Rafael Monroy
@rafaelmonroy
Aug 29 2017 00:35
@Trommelochse lol
@OrangeKulture i tried adding your code to my pen but it doesnt work as smooth as yours lol https://codepen.io/rafaelmonroy/pen/prKMXZ?editors=1111
just makes the colors go away lol
Jorge
@OrangeKulture
Aug 29 2017 00:36
yeah ussing toggle could also be useful .. depending on what you wanna do
@rafaelmonroy that's because you are doing the click event inside your ajax call, sometimes it fcks things up
try to declare the click event handler outside your ajax call
Rafael Monroy
@rafaelmonroy
Aug 29 2017 00:40
@OrangeKulture oh shit, didnt catch that lol thanks man that worked, can i just keep adding else if to switch between more colors?
CamperBot
@camperbot
Aug 29 2017 00:40
rafaelmonroy sends brownie points to @orangekulture :sparkles: :thumbsup: :sparkles:
:cookie: 452 | @orangekulture |http://www.freecodecamp.com/orangekulture
Rafael Monroy
@rafaelmonroy
Aug 29 2017 00:40
@moT01 thanks, will that work for more than 2 colors?
Jorge
@OrangeKulture
Aug 29 2017 00:42
toggle is used to switch between two states ...
how are you going to determine which color you would like to have? randomly .. or ?
Rafael Monroy
@rafaelmonroy
Aug 29 2017 00:43
yeah random
@OrangeKulture
Jorge
@OrangeKulture
Aug 29 2017 00:45
@rafaelmonroy then I would scrath the flag thing, have an array with several values and assign one value once a user clicks
Rafael Monroy
@rafaelmonroy
Aug 29 2017 00:46
@OrangeKulture ok man thanks
CamperBot
@camperbot
Aug 29 2017 00:46
rafaelmonroy sends brownie points to @orangekulture :sparkles: :thumbsup: :sparkles:
:warning: rafaelmonroy already gave orangekulture points
Jorge
@OrangeKulture
Aug 29 2017 00:49
@rafaelmonroy something like this example
only problem is that sometimes, it'll give you the color that its on, for more than 1 turn, so it may seem as if it doesnt change
u would have to implement some conditionals probs
Tom
@moT01
Aug 29 2017 00:52
you could actually generate random colors
Rafael Monroy
@rafaelmonroy
Aug 29 2017 00:55
@OrangeKulture haha yeah it looks good tho, @moT01 how can i generatae random colors?
Tom
@moT01
Aug 29 2017 00:56
one way i can think of quick is to get 3 random #'s 0-255
Ismail Hozain
@ismailhozain
Aug 29 2017 00:56
yo guys so i would like to have my input element hidden but when a button is clicked i want to show it using addclass and removeclass but it is not working
Trommelochse
@Trommelochse
Aug 29 2017 00:56
Math.floor(Math.rand() * 255)
Tom
@moT01
Aug 29 2017 00:56
and set the color with rgb
Ismail Hozain
@ismailhozain
Aug 29 2017 00:57
  $("button").removeclass("fa-5x");
  $("button").addclass("fa-3x");
whoops
Trommelochse
@Trommelochse
Aug 29 2017 00:57
@ismailhozain you have a link?
to your pen
Ismail Hozain
@ismailhozain
Aug 29 2017 00:57
so i am trying to hide one element when a button is clicked and show another but it is not working
i will get the link
Trommelochse
@Trommelochse
Aug 29 2017 00:59
so what do you want to be shown and hidden when you click what? @ismailhozain
Ismail Hozain
@ismailhozain
Aug 29 2017 01:00
so when the app is opened the input element will be hidden but when the search button is clicked the search button will be resized and the input box will be shown
Trommelochse
@Trommelochse
Aug 29 2017 01:00
@ismailhozain I see where your bug is
Ismail Hozain
@ismailhozain
Aug 29 2017 01:01
i dont
Trommelochse
@Trommelochse
Aug 29 2017 01:01
javascript is CasESensItiVe
Ismail Hozain
@ismailhozain
Aug 29 2017 01:01
?
Trommelochse
@Trommelochse
Aug 29 2017 01:01
so, you need to say $('.yourClass').removeClass
Ismail Hozain
@ismailhozain
Aug 29 2017 01:01
i am working in all lowercase
!?
Trommelochse
@Trommelochse
Aug 29 2017 01:01
and not
$('.yourClass').removeclass
same counts for addclass
all lowercase won't work
if you set up your own framework, feel free to use only lowercase (I wouldn't recommend that)
but whatever framework/library you are using
it MATTERS
if you are using caPS or NOt
var fruit = 'apple';
console.log(fruiT) // => undefined
Ismail Hozain
@ismailhozain
Aug 29 2017 01:06
so what am i supposed to do
?
Trommelochse
@Trommelochse
Aug 29 2017 01:07
'addClass' and 'removeClass' are methods on jQuery objects
if you change the upper and lower case correctly
you should be fine
(I haven't looked deep into your code, but that'S for sure something you should learn and understand)
Zachary Taylor
@Karnevore1
Aug 29 2017 01:12
hey
Trommelochse
@Trommelochse
Aug 29 2017 01:12
@ismailhozain you should also use the dev-console to find out why your program is not working - if I try your pen and click on one of the elements, I get this TypeError: $(...).removeclass is not a function
so I/you know, something is wrong with that
Zachary Taylor
@Karnevore1
Aug 29 2017 01:12
does anyone on here use the hints? i find myself having to use them more often now that im in the javascript and object oriented programming sections
Trommelochse
@Trommelochse
Aug 29 2017 01:13
try changing the 'c' into a 'C'
Rafael Monroy
@rafaelmonroy
Aug 29 2017 01:13
is it possible to set an entire ajax call to a variable?
Trommelochse
@Trommelochse
Aug 29 2017 01:13
sure
@rafaelmonroy
anything can be a variable
Zachary Taylor
@Karnevore1
Aug 29 2017 01:14
am i the only one that uses the hints lol
Rafael Monroy
@rafaelmonroy
Aug 29 2017 01:14
even this var newVar = JSON.stringify(obejct)? @Trommelochse
juni
@junipberry
Aug 29 2017 01:15
This is saying it’s not returning the number of times a character occurs in a string. Thought I did that, what am I missing?
function countCharacter(str, char) {
  let reg = new RegExp(char, "gi");
  if (reg === undefined  || "0") {
    return (0);
  } else {
  return str.match(reg).length;
} 
}
Trommelochse
@Trommelochse
Aug 29 2017 01:15
@rafaelmonroy of course.... you can save anything in a variable
juni
@junipberry
Aug 29 2017 01:15
Aren’t I making it return the count with .length?
Trommelochse
@Trommelochse
Aug 29 2017 01:17
@junipberry you need to check your regExp via the match method
juni
@junipberry
Aug 29 2017 01:18
I did return via .match..
Trommelochse
@Trommelochse
Aug 29 2017 01:18
but match returns a boolean
and you even tried to access the length of a boolean (undefined)
Ismail Hozain
@ismailhozain
Aug 29 2017 01:19
@Trommelochse thanks dude i wasnt sure if you were talking about my ids
CamperBot
@camperbot
Aug 29 2017 01:19
ismailhozain sends brownie points to @trommelochse :sparkles: :thumbsup: :sparkles:
:cookie: 321 | @trommelochse |http://www.freecodecamp.com/trommelochse
Trommelochse
@Trommelochse
Aug 29 2017 01:20
@junipberry let's cut this down: you have a string and a character
Ismail Hozain
@ismailhozain
Aug 29 2017 01:20
because i saw on the docs that it was lowercase
Trommelochse
@Trommelochse
Aug 29 2017 01:22
then, you create the RegExp and check if the character is in the string :
if (str.match(reg)) { 
// do stuff
}
else {return null}
also, you have to understand that 0 !== null !== false !== undefined
but 0 == null == false == undefined
Rafael Monroy
@rafaelmonroy
Aug 29 2017 01:31
alright guys! finally did it ! thanks to a lot of you on here and some help from youtube i finished my first javascript Intermediate Front End Development Project! wooooo lmao feel welcome to tweet some of the quotes i generated lol https://codepen.io/rafaelmonroy/full/prKMXZ/
juni
@junipberry
Aug 29 2017 01:33
@Trommelochse I was passing all but 1 test with my previous code. But now I’m passing less tests.
just1witness
@just1witness
Aug 29 2017 01:33
@rafaelmonroy It looks very nice!
juni
@junipberry
Aug 29 2017 01:34
and its telling me undefined === 0, not ==0 @Trommelochse
Rafael Monroy
@rafaelmonroy
Aug 29 2017 01:34
@just1witness thanks man
CamperBot
@camperbot
Aug 29 2017 01:34
rafaelmonroy sends brownie points to @just1witness :sparkles: :thumbsup: :sparkles:
:cookie: 303 | @just1witness |http://www.freecodecamp.com/just1witness
just1witness
@just1witness
Aug 29 2017 01:35
:)
Trommelochse
@Trommelochse
Aug 29 2017 01:38
@junipberry sorry, for confusing you, I was just trying to make you understand js basics, not to solve this problem
juni
@junipberry
Aug 29 2017 01:40
@Trommelochse it’s okay. But I’m trying to figure out where I went wrong here, not create more problems :worried:
thanks for trying though
Trommelochse
@Trommelochse
Aug 29 2017 01:44
@rafaelmonroy works well, good job! try to add body { transition: background-color 1250ms; }
to your css
for a smooth effect :)
juni
@junipberry
Aug 29 2017 01:45
just fyi, don’t think you can set 0 == undefined in a condition, its 0 ===undefined
Trommelochse
@Trommelochse
Aug 29 2017 01:46
0 === undefined is never true @junipberry
Nguyễn Đức Thuận
@thuannguyen13
Aug 29 2017 02:17
hello guy, been long time
i have a question about, animation with css, "transition". how do we reverse the animation when for example, we hover-in and hover-out
when i do hover-out it kinda instantly happening, not like an smooth transition i expected
Long Nguyen
@longnt80
Aug 29 2017 02:20
@thuannguyen13 put the transition in the original state
a {
   color: red;
   transition: color 1s;
}

a:hover {
   color: blue;
}
Nguyễn Đức Thuận
@thuannguyen13
Aug 29 2017 02:22
@longnt80 ohhhh, so we transition the property !? can we chaining with other property?
Long Nguyen
@longnt80
Aug 29 2017 02:22
@thuannguyen13 yes
Nguyễn Đức Thuận
@thuannguyen13
Aug 29 2017 02:24
@longnt80 alright, thank you anh :D :D :D, but not all property can apply transition right ?
CamperBot
@camperbot
Aug 29 2017 02:24
thuannguyen13 sends brownie points to @longnt80 :sparkles: :thumbsup: :sparkles:
:cookie: 535 | @longnt80 |http://www.freecodecamp.com/longnt80
Long Nguyen
@longnt80
Aug 29 2017 02:24
a {
   color: red;
   font-size: 1rem;
   transition: all 1s;
   transition-property: color,font-size;
}

a:hover {
   color: blue;
   font-size: 1.2rem;
}
Nguyễn Đức Thuận
@thuannguyen13
Aug 29 2017 02:24
transition: display 1s; ?
Long Nguyen
@longnt80
Aug 29 2017 02:25
đúng rồi, có một số property không transition được
Nguyễn Đức Thuận
@thuannguyen13
Aug 29 2017 02:25
okay anh, @longnt80, em đang test 1 số animation, với trick, tks anh nhiều
John
@AnonymousLords
Aug 29 2017 03:12
need a little help in JS
Jorge
@OrangeKulture
Aug 29 2017 03:21
@AnonymousLords filter() i think would be the best option
DJ Nixon
@tGxcoder
Aug 29 2017 03:25
```
var array = [1, 12, 21, 2];

// Only change code below this line.

array.sort(function(a,b){
  return b-a;
});
why is largest to smallest and not minus...?
is it bc the .sort?
Santiago Chopitea
@raka26
Aug 29 2017 03:27
Hello guys
DJ Nixon
@tGxcoder
Aug 29 2017 03:27
hey santiago
John
@AnonymousLords
Aug 29 2017 03:27
Welcome top FCC @raka26
lol
Santiago Chopitea
@raka26
Aug 29 2017 03:27
Thanks!
Guys, can i get some help?
DJ Nixon
@tGxcoder
Aug 29 2017 03:27
no....lol
Santiago Chopitea
@raka26
Aug 29 2017 03:28
T.T
DJ Nixon
@tGxcoder
Aug 29 2017 03:28
i can try no promises though
what u need
Santiago Chopitea
@raka26
Aug 29 2017 03:28
hahah thanks!
mm AJAX
DJ Nixon
@tGxcoder
Aug 29 2017 03:28
ahhahahahahahah no sorry
Santiago Chopitea
@raka26
Aug 29 2017 03:28
i
HATE
AJAX
xD!
im very lost
Jorge
@OrangeKulture
Aug 29 2017 03:29
@tGxcoder yes, that's because it's inside the sort callback
Rafael Monroy
@rafaelmonroy
Aug 29 2017 03:29
@Trommelochse oh man! that makes it so much smoother lol thanks
CamperBot
@camperbot
Aug 29 2017 03:29
rafaelmonroy sends brownie points to @trommelochse :sparkles: :thumbsup: :sparkles:
:cookie: 322 | @trommelochse |http://www.freecodecamp.com/trommelochse
DJ Nixon
@tGxcoder
Aug 29 2017 03:31
ok thanks @OrangeKulture
Jorge
@OrangeKulture
Aug 29 2017 03:31
sure thing
u guys wanna play around a bit with my project .. its not unbeatable, but it's also not completely dumb .. may have a couple bugs here n there. If u guys can, let me know what u think Game
@raka26 what seems to be the prob
Santiago Chopitea
@raka26
Aug 29 2017 03:36
hi! Im trying to do this:
upload a title, description, and image. ---> this works
im using mysql to store the url reference for the img, my title and desc ----> working
function uploadMyFiles(){
var form = $("#uploadForm")[0];
var formData = new FormData(form);
$.ajax({
method: "POST",
url: "upload.php",
data: formData,
processData: false,
contentType: false,
success: function(){
console.log("Success...");
},
error: function(xhr, status) {
console.log('Something went wrong', xhr.responseText, status);
}
});
testReload();
}
my problem is that never i get the Success text, allways the error but my upload is working
Ken Haduch
@khaduch
Aug 29 2017 03:36
@OrangeKulture - I'm not sure that I saw this happen, but I think that i saw a round where the computer supposedly moved twice but only had one "X" on the board? I don't know if it is reproducible. There were also a few times when the computer had a winning move available and didn't do it.
But whether or not those are expected / real things happening, I like the styling of your game - looks really neat! I like the font selection as well.
Long Nguyen
@longnt80
Aug 29 2017 03:37
@OrangeKulture nice design, you used the same font as mine!
Santiago Chopitea
@raka26
Aug 29 2017 03:38
@OrangeKulture and then my "testReload() ", i think should be on the success, make a div reload that make a php function call and show all my img listed
Jorge
@OrangeKulture
Aug 29 2017 03:38
@khaduch aweome stuff thanks a lot ken .. yeah definitely not the best AI, but ive spent so much time already
CamperBot
@camperbot
Aug 29 2017 03:38
orangekulture sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 3247 | @khaduch |http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Aug 29 2017 03:38
@OrangeKulture - I definitely saw a round where the player started first, and the computer, after the second move, only had one X on the board.
Jorge
@OrangeKulture
Aug 29 2017 03:38
@longnt80 ahh nice, thanks ! let me check out yours
CamperBot
@camperbot
Aug 29 2017 03:38
orangekulture sends brownie points to @longnt80 :sparkles: :thumbsup: :sparkles:
:cookie: 536 | @longnt80 |http://www.freecodecamp.com/longnt80
Ken Haduch
@khaduch
Aug 29 2017 03:39
@OrangeKulture - I just reproduced it - the player with "O" and the computer with "X", the player moves first and I put the "O" in the top center, the computer in the center, and I put the bottom center "O", the computer moved and didn't make a new mark.
Jorge
@OrangeKulture
Aug 29 2017 03:41
@khaduch great stuff .. i think i might know where the problem is .. thanks for looking into that
CamperBot
@camperbot
Aug 29 2017 03:41
orangekulture sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:warning: orangekulture already gave khaduch points
Ken Haduch
@khaduch
Aug 29 2017 03:41
@OrangeKulture - you're welcome!
Santiago Chopitea
@raka26
Aug 29 2017 03:43
@OrangeKulture OH SOLVED, on helpFrontEnd somebody help me
Jorge
@OrangeKulture
Aug 29 2017 03:44
@raka26 so sry dude .. was just looking at that, good to know u got help tho
@longnt80 looks amazing
Santiago Chopitea
@raka26
Aug 29 2017 03:50
@OrangeKulture thanks a lot! I appreciate your help.
CamperBot
@camperbot
Aug 29 2017 03:50
raka26 sends brownie points to @orangekulture :sparkles: :thumbsup: :sparkles:
:cookie: 454 | @orangekulture |http://www.freecodecamp.com/orangekulture
Jorge
@OrangeKulture
Aug 29 2017 03:51
welcome :thumbsup:
Rafael Monroy
@rafaelmonroy
Aug 29 2017 06:35

quick question, why does this code work

var x = document.getElementById("demo");
function getLocation() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(showPosition);
    } else {
        x.innerHTML = "Geolocation is not supported by this browser.";
    }
}
function showPosition(position) {
    x.innerHTML = "Latitude: " + position.coords.latitude + 
    "<br>Longitude: " + position.coords.longitude; 
}

but not this one

var x = $("#demo");
function getLocation() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(showPosition);
    } else {
        x.innerHTML = "Geolocation is not supported by this browser.";
    }
}
function showPosition(position) {
    x.innerHTML = "Latitude: " + position.coords.latitude + 
    "<br>Longitude: " + position.coords.longitude; 
}

all i did was change the way I grabbed the elememt, JQuery is activated on my pen

iso
@iso1048
Aug 29 2017 06:40
@rafaelmonroy maybe because you are using x.innerHTML rather than x.html('') in the jquery code. not sure though..
CamperBot
@camperbot
Aug 29 2017 06:40
gothamknight sends brownie points to @rafaelmonroy :sparkles: :thumbsup: :sparkles:
:cookie: 268 | @rafaelmonroy |http://www.freecodecamp.com/rafaelmonroy
Rafael Monroy
@rafaelmonroy
Aug 29 2017 06:42
@gothamknight is it because it has to be consistent ?
if i start with jquery the code that follows should also be jquery
iso
@iso1048
Aug 29 2017 06:45
@rafaelmonroy not sure, but i assume you cannot just merge two 'languages' like that. since you variable is a jQuery selector, then maybe you need to manipulate it with jQuery. It would be good to get some clarification from someone more knowledgeable though.
Markus Kiili
@Masd925
Aug 29 2017 06:45
@rafaelmonroy You can mix jQuery and JS as you like.
But make sure you use jQuery methods on jQuery objects and JS methods on JS objects like elements and nodes etc.
Rafael Monroy
@rafaelmonroy
Aug 29 2017 06:49

@Masd925 @gothamknight i switched it to jQuery

var coordinates = $('#demo');
function getLocation() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(showPosition);
    } else {
        $('#coordinates').html("Geolocation is not supported by this browser.");
    }
}
function showPosition(position) {
    $('#coordinates').html("Latitude: " + position.coords.latitude + 
    "<br>Longitude: " + position.coords.longitude)
}

the code still wont run :/ but when i change my view to debug, it works? why is that ?

iso
@iso1048
Aug 29 2017 06:50
@rafaelmonroy just try coordinates.html ...(unless coordinates is an actual id, in which case, my bad)
Markus Kiili
@Masd925
Aug 29 2017 06:51
@rafaelmonroy Where are you calling getLocation ?
Rafael Monroy
@rafaelmonroy
Aug 29 2017 06:54
@Masd925 @gothamknight not sure, I grabbed this code from w3 schools, and Im trying to understand it better so I decided to switch some stuff around to see if the code would still deliver the same results. All i’ve done really is change the way I grabbed the elements from JS to Jquery and the code wont excute, im trying to understand why….
Markus Kiili
@Masd925
Aug 29 2017 06:55
@rafaelmonroy Just declaring functions doesn't do anything. Try calling the function with getLocation();
Rafael Monroy
@rafaelmonroy
Aug 29 2017 06:57
@Masd925 I just saw that I call that function when I click on my button… should this also be update to Jquery?
<button onclick="getLocation()">Try It</button>

<p id="demo"></p>
Markus Kiili
@Masd925
Aug 29 2017 06:58
@rafaelmonroy That seems fine. Is your jQuery code wrapped inside $(document).ready(function(){...}) ?
Rafael Monroy
@rafaelmonroy
Aug 29 2017 06:59
@Masd925 its not, let me update and see if that helps
Markus Kiili
@Masd925
Aug 29 2017 06:59
@rafaelmonroy If not, you might be trying to access the dom before the page is ready.
@rafaelmonroy With JS, you could place the code inside document.addEventListener("DOMContentLoaded",function(){...}); or window.addEventListener("load",function(){...});
JQuery wrapper does the same as the first JS code I posted there.
Rafael Monroy
@rafaelmonroy
Aug 29 2017 07:10
@Masd925 ok so the problem was i was wrapping coordinates in the $(“#) when it was already a variable lol
@gothamknight looks like you had it bro. thanks !
CamperBot
@camperbot
Aug 29 2017 07:11
rafaelmonroy sends brownie points to @gothamknight :sparkles: :thumbsup: :sparkles:
:cookie: 407 | @gothamknight |http://www.freecodecamp.com/gothamknight
Rafael Monroy
@rafaelmonroy
Aug 29 2017 07:11
@Masd925 thanks for the help too, was driving me crazy
Markus Kiili
@Masd925
Aug 29 2017 07:12
@rafaelmonroy :+1:
Dhananjay Sood
@DhananjaySood
Aug 29 2017 12:39
Hi
dryyyyy
@dryyyyy
Aug 29 2017 13:26
Hi all! How can I place a text to the left of an image but not make it wrap around the image?
Santiago Chopitea
@raka26
Aug 29 2017 14:36
hello!
Daniel
@Feldbot
Aug 29 2017 15:13
@ Does someone have some time to help walk me through the Seek and Destroy challenge? I spent all day yesterday reading docs and still can't reason through how to set up the callback structure.
Garrus Napp
@GarrusNapp
Aug 29 2017 15:21
@Feldbot sure
@Feldbot show your code and we'll see
Daniel
@Feldbot
Aug 29 2017 15:26
@GarrusNapp It doesn't make sense yet, not sure if I need to create multiple functions or if the callback is just supposed to be what the filter method returns.
function filterer() {
  console.log("i got called");
  var newArr1 = argArr.filter(function() {
    return newArr1;
  });
  console.log(newArr1);
}

function destroyer(arr) {
  console.log(arguments.length); // logs destroyer function's arguments' length => 3
  var argArr = Array.prototype.slice.call(arguments); // one way of converting arguments into real array
  console.log(argArr); // logs new argument array
  var filteredArr = argArr.filter(function(filter){
    return ; 
  });  
}

destroyer([1, 2, 3, 1, 2, 3], 2, 3);

// var args = [].slice.call(arguments); // another way of converting arguments into real array
Garrus Napp
@GarrusNapp
Aug 29 2017 15:27
@Feldbot Ok so you got the good idea with creating two functions, I did the same
it's not nescessery, but useful for clarity imo
first you need to understand the filter, because you messed up it a bit
arr.filter(yourFilteringFunction);
arr is an array of stuff, that filter will go through, sending each element to a yourFilteringFunction. That function should return true or false
Daniel
@Feldbot
Aug 29 2017 15:30
@GarrusNapp Where yourFilteringFunction is the callback to my other filterer function?
Garrus Napp
@GarrusNapp
Aug 29 2017 15:31
yes, that function is the callback
see this example
function isBigEnough(value) {
  return value >= 10;
}

var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered is [12, 130, 44]
Hemakshi Sachdev
@hemakshis
Aug 29 2017 15:32
Hello everyone.. I need some help with bootstrap
Garrus Napp
@GarrusNapp
Aug 29 2017 15:33
@hemakshis hello, what's the issue
Hemakshi Sachdev
@hemakshis
Aug 29 2017 15:34
i want to add classes col-md-4 and col-xs-6 both in the same div
that when it is a desktop a row should have 3 columns but in small screens it shoud have 2 columns
Daniel
@Feldbot
Aug 29 2017 15:34
@GarrusNapp Okay, I'll try some things with that structure...
Hemakshi Sachdev
@hemakshis
Aug 29 2017 15:35
but by doing this i get 4 rows first one having two columns 2nd one also has 2 but the 2nd column is blank 3rd is same as 1st nd 4th same as 2nd
image.png
@GarrusNapp Hii.. output comes somewhat like this.. which i don't want
Garrus Napp
@GarrusNapp
Aug 29 2017 15:37
@hemakshis can you share the part of the code with those cols?
Hemakshi Sachdev
@hemakshis
Aug 29 2017 15:37
okay..pls wait for 1 or 2 mins :sweat_smile:
Hemakshi Sachdev
@hemakshis
Aug 29 2017 15:42
@GarrusNapp here you go https://codepen.io/hemakshis/pen/xLQRJB
Garrus Napp
@GarrusNapp
Aug 29 2017 15:47
@hemakshis To my understanding that is because you have two rows
@hemakshis the 3rd column gets to next "row" when shrinked. but there's nothing more in this row, since your next projects are in their own explicit row
@hemakshis the easiest thing to do would be using even number of columns I suppose
Daniel
@Feldbot
Aug 29 2017 15:52
@GarrusNapp I got the callback working, but now I'm not sure what to filter. I'm thinking if I use a method like includes or indexOf, I'll need to filter to create two arrays to compare one with the other. Does this seem right or am I on the wrong track or making that overly complicated?
Garrus Napp
@GarrusNapp
Aug 29 2017 15:53
@Feldbot yea, the indexOf would work
@Feldbot you need now to extract the array, and the rest of arguments
so you have both the thing you want to work on, and the things you filter with
Daniel
@Feldbot
Aug 29 2017 15:54
@GarrusNapp Into two separate arrays? So I'd be filtering twice?
Garrus Napp
@GarrusNapp
Aug 29 2017 15:54
@Feldbot no, I meant [array].filter(call back function that uses the rest of the arguments)
because they give you stuff like [1, 2, 3, 1, 2, 3], 2, 3
Daniel
@Feldbot
Aug 29 2017 15:55
@GarrusNapp Righto. I'll try that out...
Hemakshi Sachdev
@hemakshis
Aug 29 2017 16:16
@GarrusNapp I tried to have two columns per row but then in desktop I get only two columns not three :cry:
Garrus Napp
@GarrusNapp
Aug 29 2017 16:17
@hemakshis maybe use flexbox instead?
Hemakshi Sachdev
@hemakshis
Aug 29 2017 16:18
@GarrusNapp I haven't used them earlier but let me try it out.
Thanks :)
CamperBot
@camperbot
Aug 29 2017 16:18
hemakshis sends brownie points to @garrusnapp :sparkles: :thumbsup: :sparkles:
:cookie: 841 | @garrusnapp |http://www.freecodecamp.com/garrusnapp
Garrus Napp
@GarrusNapp
Aug 29 2017 16:19
@hemakshis I recently did something similar. Wrap all the projects divs in one div, and give it this:
display: inline-flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
Hemakshi Sachdev
@hemakshis
Aug 29 2017 16:20
@GarrusNapp row divs or the columns ??
Garrus Napp
@GarrusNapp
Aug 29 2017 16:20
<div class="container"> <div> project 1 </div> <div> project 2 </div> .... </div>
this will create as many columns as you have place for, and create another rows as needed
Hemakshi Sachdev
@hemakshis
Aug 29 2017 16:24
@GarrusNapp Okay thanks a lot =D
CamperBot
@camperbot
Aug 29 2017 16:24
hemakshis sends brownie points to @garrusnapp :sparkles: :thumbsup: :sparkles:
:warning: hemakshis already gave garrusnapp points
Garrus Napp
@GarrusNapp
Aug 29 2017 16:25
@hemakshis :+1:
Hemakshi Sachdev
@hemakshis
Aug 29 2017 16:28
@GarrusNapp It worked :grin:
Garrus Napp
@GarrusNapp
Aug 29 2017 16:28
good job
Hemakshi Sachdev
@hemakshis
Aug 29 2017 16:30
@GarrusNapp also one more thing.. please tell why is my link to the project not working (in the javascript project i have added a link within a paperclip icon) nd it is not working
Rahul Tiwari
@invinciblycool
Aug 29 2017 16:31
Can anyone help me out with this.
Daniel
@Feldbot
Aug 29 2017 16:32
@GarrusNapp Still stuck... Do I need to create two filter callbacks, or is the one filter function supposed to separate both parts of the array?
Rahul Tiwari
@invinciblycool
Aug 29 2017 16:32
The answer might be correct but I didn't understand the solution and what to do to fix it.
Garrus Napp
@GarrusNapp
Aug 29 2017 16:33
@Feldbot no, the callback will be the thing that will get the elements of the array one by one and decide wether to keep it (return true) or not
so only one callback function
to separate the arguments, you can use the default function they create for you. Separate them, and call the filter from the inside
@hemakshis I can't see it in the codepen, there's no <a> at all, and no adding this in JS
Daniel
@Feldbot
Aug 29 2017 16:36
@GarrusNapp And I need to do that with the filterer function? What default function?
Garrus Napp
@GarrusNapp
Aug 29 2017 16:36
@Feldbot they call it destroyer or whatever
it goes like this:
Hemakshi Sachdev
@hemakshis
Aug 29 2017 16:38
@GarrusNapp there is one but only for the calculator
hover on the calculator's pic
Garrus Napp
@GarrusNapp
Aug 29 2017 16:41
function destroyer(x) {
//for now x is like [1,2,3,4,5],2,1. 
// unpack it here so you have variable with only [1,2,3,4,5]
//also I created a global variable with the rest of the argument: 2,3
//[1,2,3,4,5].filter(callback)
}

function callback(valueSentByFilter) {
//indexOf here using the global variable from above to decide whether return true or not
}
@Feldbot
Daniel
@Feldbot
Aug 29 2017 16:44
@GarrusNapp Thanks Garrus, this is part of what I didn't understand—which functions were supposed to do what, and which one needed to call the other. I'll work on this again.
CamperBot
@camperbot
Aug 29 2017 16:44
feldbot sends brownie points to @garrusnapp :sparkles: :thumbsup: :sparkles:
:cookie: 842 | @garrusnapp |http://www.freecodecamp.com/garrusnapp
Jorge
@OrangeKulture
Aug 29 2017 16:44
hey whats happening guys
What's new and exciting? :sunglasses:
Rahul Tiwari
@invinciblycool
Aug 29 2017 16:47
HI, can you help me out with this. https://stackoverflow.com/q/45905844/6793666
The answer might be correct but I didn't understand the solution and what to do to fix it.
Jorge
@OrangeKulture
Aug 29 2017 16:49
@invinciblycool r u talking about the modal title and the id bindings?
Rahul Tiwari
@invinciblycool
Aug 29 2017 16:50
yup
Jorge
@OrangeKulture
Aug 29 2017 16:52
i dont do django, but I can see that the person who replied is correct .. basically, u are calling a dom node which is, in essence, copied several times over
in html, if you give an element an id attribute, it's supposed to be unique
Rahul Tiwari
@invinciblycool
Aug 29 2017 16:52
Yeah even I understood that.What I am asking is how do I fix it?
Jorge
@OrangeKulture
Aug 29 2017 16:54
assign the id later, or use string templates, u know .. interpolation to give each modal a diff id
Rahul Tiwari
@invinciblycool
Aug 29 2017 16:55
okay I will need to read about it, Thanks, I will let you know if it gets fixed.
Jorge
@OrangeKulture
Aug 29 2017 16:56
sure thing
hifede
@hifede
Aug 29 2017 17:13
hiya!wondering why my pen doesnt seem to be responsive on my mobile phone... any ideas? https://codepen.io/arolf_flora/pen/XajbJa
Daniel
@Feldbot
Aug 29 2017 17:51
@GarrusNapp Still stuck. The way I'm doing this I am creating two global vars which doesn't feel right, and I'm not sure if I need to create another var in my callback function that would help push the answers to.
var destroyedArr = [];

function callback(valueSentByFilter) {
  if (initialArr.indexOf(testArgs) === -1) {
     destroyedArr.push(); // ??? push what?
//   console.log(testArgs);
//   console.log(destroyedArr);
    }
} 

function destroyer(arr) {
  // console.log(arguments.length); // logs destroyer function's arguments' length => 3
  var argArr = Array.prototype.slice.call(arguments); // one way of converting arguments into real array
  // console.log(argArr); // logs new argument array
  initialArr = argArr[0];
  testArgs = argArr.splice(1);
//  console.log(initialArr);
//  console.log(testArgs);
  initialArr.filter(callback);
  console.log(destroyedArr);
}

destroyer([1, 2, 3, 1, 2, 3], 2, 3);
Garrus Napp
@GarrusNapp
Aug 29 2017 17:52
@Feldbot valueSentByFilter is the thing you use against indexOf
[stuff you don't want].indexOf(value sent by filter) == -1
if there's -1, then it means it didn't found one. So that's the one to keep. So return true
no need to push, it's the .filter that will return elements that passed the test (those elements that taken by callback function , caused it to return true)
Daniel
@Feldbot
Aug 29 2017 18:13
@GarrusNapp If I'm not pushing anything in the callback function, what is it actually supposed to return or do?
Garrus Napp
@GarrusNapp
Aug 29 2017 18:13
@Feldbot call back returns true or not
@Feldbot the filter returns all that passed test
@Feldbot so ultimately the answer is return array.filter(callback)
Daniel
@Feldbot
Aug 29 2017 18:16
@GarrusNapp But what action does the callback function provide inside the if statement?
Garrus Napp
@GarrusNapp
Aug 29 2017 18:17
@Feldbot returns true or not, based on indexOf
Daniel
@Feldbot
Aug 29 2017 18:43
@GarrusNapp Wow, very difficult to see how this works even with the answer, much less thinking about how to set it up. Is valueSentByFilter then the same as my initialArr var?
Garrus Napp
@GarrusNapp
Aug 29 2017 18:45
It's a kind of a for loop.
[1,2,3,4,5].filter(...)
it's 1, then it's 2, etc
@Feldbot
Daniel
@Feldbot
Aug 29 2017 19:10
@GarrusNapp Are my comments correct here?
function callback(valueSentByFilter) {
  if (testArgs.indexOf(valueSentByFilter) === -1) { // syntax: arr.indexOf(searchElement[, fromIndex])  
    // -1 means it is NOT found in array
    // [2, 3] are searched for matches iteratively by [1, 2, 3, 5, 1, 2, 3]
    // since 1, 5, 1 are true they are then filtered in the destroyer function as the callback values
    return true;
  }
}
Garrus Napp
@GarrusNapp
Aug 29 2017 19:12
Yes
since 1, 5, 1 are true they are then filtered in the destroyer function as the callback values
I'd say
they are sent back to the filter to be returned
@Feldbot I have to go now, tell me when you suceed :)
gl
Daniel
@Feldbot
Aug 29 2017 19:14
@GarrusNapp Thanks very much for the help Garrus. I did get it, but still hard to see. Does it take oodles of these types of problems to see how to frame the code in callbacks? Any advice for setting them up?
CamperBot
@camperbot
Aug 29 2017 19:14
feldbot sends brownie points to @garrusnapp :sparkles: :thumbsup: :sparkles:
:cookie: 843 | @garrusnapp |http://www.freecodecamp.com/garrusnapp
Ross Scarborough
@SourceHorse
Aug 29 2017 21:37
Can anyone take a look at this and see if there are any bugs?
Simey de Klerk
@simeydk
Aug 29 2017 21:51
I'm having trouble with href's in an a in React on Codepen. I'm not sure if I'm doing something wrong in principle, or if it has something to do with how Codepen treats hrefs. https://codepen.io/simdk/pen/XaxPeg?editors=0010
When I console.log the URL i'm constructing and click on it in the console, it works right, but it doesn't seem to work when adding to an a element
Pagnito
@Pagnito
Aug 29 2017 22:02
we cant sign into beta right now?
Wael Azar
@Waelazar
Aug 29 2017 22:42
yes, when im clicking on the channel doesn't open even it is online
@SourceHorse
fix it
Ross Scarborough
@SourceHorse
Aug 29 2017 22:43
i was messing with the code, try again @Waelazar
Wael Azar
@Waelazar
Aug 29 2017 22:43
send it
the link
Wael Azar
@Waelazar
Aug 29 2017 22:45
i don't know, but still doesn't work with me
Ross Scarborough
@SourceHorse
Aug 29 2017 22:45
what browser are you using?
Wael Azar
@Waelazar
Aug 29 2017 22:45
chrome
i'm sorry body, i should go
you can check mine if you want and compare if you need to fix the bug .
else , i find it cool
Pagnito
@Pagnito
Aug 29 2017 23:02
@SkyC0der yo
iso
@iso1048
Aug 29 2017 23:04
@Pagnito he is gone bro
Pagnito
@Pagnito
Aug 29 2017 23:05
@gothamknight gone where?
iso
@iso1048
Aug 29 2017 23:05
@Pagnito spain
Pagnito
@Pagnito
Aug 29 2017 23:05
@gothamknight for how long
iso
@iso1048
Aug 29 2017 23:06
@Pagnito um i think he said 10 months or something like that
Pagnito
@Pagnito
Aug 29 2017 23:06
@gothamknight daaaaaaaaaaaaaaamn
iso
@iso1048
Aug 29 2017 23:06
apparently he is not going to code at all for that time...
Pagnito
@Pagnito
Aug 29 2017 23:06
daaaaaaaaaaamn wtf
iso
@iso1048
Aug 29 2017 23:06
@Pagnito yeah i know aye haha
Pagnito
@Pagnito
Aug 29 2017 23:07
lol
well anyways
check this shit out
i stumbled on this guy thru searching up webGL stuff
fucking love his profile
iso
@iso1048
Aug 29 2017 23:08
holy shit that is insane
Pagnito
@Pagnito
Aug 29 2017 23:09
yea
redux is confusing the shit out of me right now
i think my brain needs a rest but i dont wanna stop!
iso
@iso1048
Aug 29 2017 23:13
take a break bro
Sudeep Narkar
@sudeepnarkar
Aug 29 2017 23:15
Hello guys
Pagnito
@Pagnito
Aug 29 2017 23:15
yea im :/
Sudeep Narkar
@sudeepnarkar
Aug 29 2017 23:15
I logged in after months and all my progress is lost
Greta Piliponytė
@gpiliponyte
Aug 29 2017 23:15
the meme is real
Sudeep Narkar
@sudeepnarkar
Aug 29 2017 23:15
My solutions are saved though. Anybody else faced this issue?
Mercy Manrique
@mers89
Aug 29 2017 23:45
Hi guys, still working on the Twitch API. So been facing finding the correct endpoints. Was using the following link for channels but when I pass it through the console to see if it's working it shows it is not pulling from API https://wind-bow.glitch.me/twitch-api/channels/
Mercy Manrique
@mers89
Aug 29 2017 23:54
Nvm just figured it out :)