These are chat archives for FreeCodeCamp/Help

6th
Mar 2018
Sam Goldberg
@sgoldber61
Mar 06 2018 01:04
In Mongoose, let's say I have a findOne with two conditions. If I don't get a doc result in my callback, how do I know which condition was the one that failed? Is there a way to write the code so that I can tell?
Christopher McCormack
@cmccormack
Mar 06 2018 01:41
@sgoldber61 if you need to know, why not break up the search?
Sam Goldberg
@sgoldber61
Mar 06 2018 02:00
@cmccormack How do I break up the search?
Christopher McCormack
@cmccormack
Mar 06 2018 02:00
@sgoldber61 just nest two searches
Then you can add logic to determine what to do if it's missing one criteria
Sam Goldberg
@sgoldber61
Mar 06 2018 02:10
@cmccormack OK I see. It's a little inelegant to have to search again, but I guess I have to. I'm doing the nightlife coordination app, and I'm interested in storing in a database the bars that have a nonzero amount of people going. If a user clicks on a bar, I need to check if the bar is in the database. If the bar is not in the database, then I need to put it in. But if the bar is in the database, I need to check to see if the user had already clicked "going" by seeing if the user is $in the userid array for the bar.
And I guess I have to search again within the callback...
Christopher McCormack
@cmccormack
Mar 06 2018 02:12
I don't see why that would be inelegant. You're doing different things, it's not just one query
You could always query just using one criteria and use the response documents to search for whatever else you need and then filter in JS
Kyle Holm
@thekholm80
Mar 06 2018 02:15

I need to check if the bar is in the database. If the bar is not in the database, then I need to put it in

maybe using a method like findOneAndUpdate() with upsert: true would handle that, along with the flag to return the modified (or new, if upsert) document, which you could then check on the front end to see if your user is present?

that way you only make a single query
i'm not sure if there's a mongoose equivalent to that method, i've only ever used plain mongo
Sam Goldberg
@sgoldber61
Mar 06 2018 02:17
Yeah I can do that in mongoose, but is it actually legit to check on the front end if the user is present? What if I (say, using something like Postman) ask the back end to have a user "like" a bar but the bar has already been liked?
I could linearly search through the array that has the list of users going/liking the bar using a simple JS for loop, but I take it I'm not supposed to do that.
Christopher McCormack
@cmccormack
Mar 06 2018 02:18
You can do it in the callback on the backend, doesn't have to be on the frontend
Kyle Holm
@thekholm80
Mar 06 2018 02:19
looks like i did 2 separate calls to my db
how i did it if it helps any
Sam Goldberg
@sgoldber61
Mar 06 2018 02:21
Is it better to linearly search through that array of liking users or is it better to make a 2nd call to the db? I've heard that if you linearly search through the array yourself it takes O(n) time, is it the case that making a 2nd call to the db and using $in for teh user array only takes O(log(n)) time because of how mongodb structures itself internally, or is that not true?
Christopher McCormack
@cmccormack
Mar 06 2018 02:21

But if the bar is in the database, I need to check to see if the user had already clicked "going" by seeing if the user is $in the userid array for the bar.

If you just grab all the bars in the database using @thekholm80 suggestion, you can use the results to determine if they have already clicked 'going'

@sgoldber61 it's only O(n) if unsorted
Kyle Holm
@thekholm80
Mar 06 2018 02:23
i've never had more than 1 user, so i've never worried about performance lol. I suppose it's something I should be aware of
Sam Goldberg
@sgoldber61
Mar 06 2018 02:26
So then I put the list of users in a priority queue aka heap? I.e. this: https://en.wikipedia.org/wiki/Heap_(data_structure) Does mongodb, when I add a user... do this efficiently?
Sorry for the endless questions, I'll stop, but I know so little about performance or actually how to properly do common things in an idiomatic way in mongodb/mongoose.
Kyle Holm
@thekholm80
Mar 06 2018 02:28
i wish i could help you more. i've learned just enough mongodb to do what i've needed so far, which is barely scratching the surface of what it's capable of
and if they don't release an update for debian 9 i may be ditching mongo altogether
Sam Goldberg
@sgoldber61
Mar 06 2018 02:31
Sometimes I feel like I don't know anything. It's been since last summer since I started this, and I've only gotten to the nightlife coordination app...
How are you doing Kyle? I see you here all the time lol. Are you applying soon?
Kyle Holm
@thekholm80
Mar 06 2018 02:32
i've got 3(?) projects left, then I don't know what I'm going to do
probably just hang out here and tell the newbies how good they have it and how hard it was back in my day
and it sounds like you're kicking butt, i think it's more important to understand what you're doing than to speed through the curriculum
Christopher McCormack
@cmccormack
Mar 06 2018 02:34
@sgoldber61 Probably better to get it done now and worry about performance later
Sam Goldberg
@sgoldber61
Mar 06 2018 02:34
Um... while the Javascript ecosystem is really large, there's so much version changes that it gets worse and worse in our day LOL! Yeah, I applied to a city of Los Angeles thing where they hook up young people with companies.
Kyle Holm
@thekholm80
Mar 06 2018 02:35
that sounds awesome, i hope it works out
Sam Goldberg
@sgoldber61
Mar 06 2018 02:35
@cmccormack OK then I'll just manually look through the array. It looks like there won't be zillions of users going anyway. Thanks for all your help!
CamperBot
@camperbot
Mar 06 2018 02:35
sgoldber61 sends brownie points to @cmccormack :sparkles: :thumbsup: :sparkles:
:star2: 1366 | @cmccormack |http://www.freecodecamp.org/cmccormack
Sam Goldberg
@sgoldber61
Mar 06 2018 02:36
@thekholm80 I hope so too thanks.
CamperBot
@camperbot
Mar 06 2018 02:36
sgoldber61 sends brownie points to @thekholm80 :sparkles: :thumbsup: :sparkles:
:star2: 1713 | @thekholm80 |http://www.freecodecamp.org/thekholm80
Christopher McCormack
@cmccormack
Mar 06 2018 02:36
@sgoldber61 Yeah there will be a point where that does matter, and at that point you'll have a lot more drive to optimize :)
Kyle Holm
@thekholm80
Mar 06 2018 02:37
hopefully at that point you'll have an amazing senior dev working with you to answer all your questions, too
Sam Goldberg
@sgoldber61
Mar 06 2018 02:38
Yeah, and I hope in time that all three of us will be that guy!!!
Christopher McCormack
@cmccormack
Mar 06 2018 02:38
Mongodb has some great tools to see how long a query takes, if you want you can generate a million user list and test against that
Sam Goldberg
@sgoldber61
Mar 06 2018 02:40
Got it, I will look into timing tools and see how long different ways of doing things takes.
lisa
@lisazzzs
Mar 06 2018 03:37
how to set the element for p
Christopher McCormack
@cmccormack
Mar 06 2018 03:39
@lisazzzs Not exactly sure what your question is - p element usually looks like this - <p>This is my paragraph</p>
nuejinjian102
@nuejinjian102
Mar 06 2018 04:02
<img class="small-image" src="/images/relaxing-cat.jpg">
is this code right?
Christopher McCormack
@cmccormack
Mar 06 2018 04:05
@nuejinjian102 it's correct as far as the syntax, but not sure what problem you're doing. Are you getting an error?
Buddy
@nashkell
Mar 06 2018 04:07
@cmccormack shouldn't the source be src="images/relaxing-cat.jpg" w/o the extra forward slash?
Christopher McCormack
@cmccormack
Mar 06 2018 04:08
@nashkell really depends on what you're doing
It's not a syntax problem though, may be a problem if used with an exercise if the image is relative to the current directory and not root
Buddy
@nashkell
Mar 06 2018 04:09
^ that was my reasoning for questioning the forward slash :smile:
Kyle Holm
@thekholm80
Mar 06 2018 04:26
@nuejinjian102 if you're doing the "Size your Images" lesson, the name of the class should be smaller-image
Create a class called smaller-image and use it to resize the image so that it's only 100 pixels wide.
Buddy
@nashkell
Mar 06 2018 04:30
general fyi, FCC.org is back up, and running
Mlixe
@mlixett999
Mar 06 2018 09:19
把smaller-image class 添加到<img src="/images/relaxing-cat.jpg">里面 怎么写是正确的
jxl00125
@jxl00125
Mar 06 2018 10:53
@mlixett999 <img class="smaller-image thick-green-border" src="/images/relaxing-cat.jpg">
Adegoke Fred
@Frediflexta
Mar 06 2018 13:03
Hi guys, i need some help here please, i am trying to write a function, that takes in an array of elements of integers,string and float. Removes only strings and rounds up floats, returning only an array elements of integers
This what i wrote, but it doesn't seem to be doing anything
function mySort(nums) {
    // empty array to hold only integer elements
    const num = [];

    // get rid of strings and round nums
    for (let i = 0; i < nums.length; i++)
    {
        // if a number, push to n
        if (!isNaN(nums[i]))
        {
            Math.trunc(num.push[i]);
        }
        return num;
    }
}

const array = [ 90, 45, 66, 'bye', 100.5 ];
console.log(mySort(array));
Aditya
@ezioda004
Mar 06 2018 13:10
@Frediflexta First you'd want to fix num.push[i] it should be num.push(nums[i]). Second you'd want to return num after the loop is over cause rn it returns num after first iteration.
Adegoke Fred
@Frediflexta
Mar 06 2018 13:11
So that means the return should be outside the for loop
Aditya
@ezioda004
Mar 06 2018 13:11
Correct
Adegoke Fred
@Frediflexta
Mar 06 2018 13:11
Alright, please can you just hang on a bit
let me get back to you with the correction
Aditya
@ezioda004
Mar 06 2018 13:13
Also, thats incorrect usage of Math.truncsince it returns the truncated value so basically you'd want to do this num.push(Math.trunc(nums[i])); instead
Adegoke Fred
@Frediflexta
Mar 06 2018 13:14
Awesome, cause i just realised it was working, was trying something else
Alright, That works now... one more question please
So, i want to sort the array in ascending order, but the twist is that i want to sort odd numbers first, before sorting even numbers
As in sorting an array like this [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] should return [1, 3, 5, 7, 9, 2, 4, 6, 8]
i know i can use .sort(function (a,b) {})
Adegoke Fred
@Frediflexta
Mar 06 2018 13:20
but how do i test for the odds in such a way that it will first finish sorting the odd before sorting evens
@ezioda004 You there?
Aditya
@ezioda004
Mar 06 2018 13:23
@Frediflexta Yes, this is an ugly solution but it should work
let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
let arr1 = [];
let arr2 = [];
arr.forEach(x=>x%2 !==0?arr1.push(x):arr2.push(x))
arr1.concat(arr2);
Adegoke Fred
@Frediflexta
Mar 06 2018 13:23
Hahahaha...
Aditya
@ezioda004
Mar 06 2018 13:24
If the array isnt sorted first then you need to sort before
Adegoke Fred
@Frediflexta
Mar 06 2018 13:25
Wow.. trying to read the code, so you used a switch operator, and concatenated to arrays?
can you explain the forEach loop please?
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 13:27
@ezioda004 a more efficient way of identifying even/odd is to test for odd using binary and operation
a & 1 === 1 ? 'odd' : 'even'
where a is a number
Aditya
@ezioda004
Mar 06 2018 13:28
Ternary operator, its short for if else, so it checks elements if its odd it pushes to first array, and if its even it pushes to 2nd array and then concat concatenates them.
So its equivalent of
arr.forEach(function(x){
   if (x%2 !==0){
       arr1.push(x)
    }
   else {
     arr2.push(x)
   }
})
@SweetCodingInc Ah, I have yet to learn bitwise operators, funny I was thinking about it yesterday
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 13:37
and a more functional way would be
function mySort(nums) {
   return nums
   .filter(n => !isNaN(n))
   .map(n => Math.round(n))
   .sort((a,b) => a-b)
}

const array = [ 90, 45, 66, 'bye', 100.5 ];

const output = mySort(array);

const odds = output.filter(n => n&1);

const evens = output.filter(n => n&1 ? false: true);

console.log(output); // [ 45, 66, 90, 101 ]
console.log(odds); // [ 45, 101 ]
console.log(evens); // [ 66, 90 ]
Adegoke Fred
@Frediflexta
Mar 06 2018 13:40
Wow.. okay, i won't your code went over my head
this is functional programming right?
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 13:41
yes
Adegoke Fred
@Frediflexta
Mar 06 2018 13:43
Okay i just started learning JS january this year, please don't blow my brains
i am still just grasping OOP
Be mercyful to us noobs
There is a lil bug with my solution
Aditya
@ezioda004
Mar 06 2018 13:46
@Frediflexta This is more non-ugly solution
let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
arr.sort((a, b)=> b % 2 - a % 2 || a - b) //[1, 3, 5, 7, 9, 2, 4, 6, 8, 10]
Adegoke Fred
@Frediflexta
Mar 06 2018 13:46
function mySort(nums) {
    const num = [];

    // get rid of strings and round nums
    for (let i = 0; i < nums.length; i++)
    {
        // if a number, push to n
        if (!isNaN(nums[i]))
        {
            num.push(Math.trunc(nums[i]));
        }
    }
     let odd = [];
     let even = [];

     // loop through num and push accordinly to the appropriate array
     num.forEach( function (x) {
        x % 2 !== 0 ? odd.push(x) : even.push(x);
     });
     // return both arrays added
     return odd.concat(even);
}
i understand it better this way
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 13:47
@Frediflexta If you just started, ignore everything I just posted.. You're coding the right way... The approach you're using will take you a long way... fancy, short hands will not...
Aditya
@ezioda004
Mar 06 2018 13:47
^
Adegoke Fred
@Frediflexta
Mar 06 2018 13:47
it is in line with my logic, was just having problems with the check n push
i didn't think of having two arrays n concat'in them
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 13:48
@Frediflexta Also, if you're staying away from functional, avoid using this as well num.forEach
and even .push and .sort
and .concat too
Adegoke Fred
@Frediflexta
Mar 06 2018 13:49
Huh, they are functions provided to make things a bit easier
i think
lol
Not like i am staying away, i just have'nt gotten there yet
Aditya
@ezioda004
Mar 06 2018 13:49
Well I think hes talking about FP approach, but there needs to be transition at one point I suppose
Adegoke Fred
@Frediflexta
Mar 06 2018 13:49
of course i will, and when that time comes, i will
Aditya
@ezioda004
Mar 06 2018 13:50
@SweetCodingInc Why .push()?
Adegoke Fred
@Frediflexta
Mar 06 2018 13:50
There is room for improvement
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 13:50
@ezioda004 to precisely understand pre and post increment
Adegoke Fred
@Frediflexta
Mar 06 2018 13:51
I just finished CS50x, so i think i have an okay understanding of lower implementation of data structures
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 13:51
@ezioda004 Have you studied math/calculus ?
Aditya
@ezioda004
Mar 06 2018 13:51
@SweetCodingInc Yes, in highschool
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 13:52
Right.. so you know derivatives and intergration.. at least conceptually?
Adegoke Fred
@Frediflexta
Mar 06 2018 13:52
Hey guys, so one small bug, when i run my code with test [ 90, 45, 66, 'bye', 100.5 ];
i get [ 45, 90, 66, 100 ]
Aditya
@ezioda004
Mar 06 2018 13:52
Yes, hated integrals tho
Adegoke Fred
@Frediflexta
Mar 06 2018 13:53
instead of [ 45, 66, 90, 100 ]
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 13:53

intergration - higher order function
derivative - lower level, pure function...

combined together it's functional math - thus the name, functional programming...

in order to understand function, you must be aware of both derivation and intergration
Aditya
@ezioda004
Mar 06 2018 13:54
@Frediflexta You need to sort array before doing forEach
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 13:54
.push higher order
.concat higher order
.sort higher order
Aditya
@ezioda004
Mar 06 2018 13:55
That I understand but how else would you add elements to an array
Nazar
@IsaakNazar
Mar 06 2018 13:55
any thoughts about Wes Bos react and es6 courses?
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 13:58

@ezioda004

This part

num.forEach( function (x) {
  x % 2 !== 0 ? odd.push(x) : even.push(x);
});

can be implemented in pure fashion as

var oddCount = 0, evenCount = 0;

for(var i=0; i<num.length; num++){
  if(x%2 !== 0){
    odd[oddCount++] = num[i]
  } else {
    even[evenCount++] = num[i];
  }
}
Aditya
@ezioda004
Mar 06 2018 13:59

Ah yes but this so much work >.<

@Frediflexta This should work

function mySort(nums) {
    const num = [];

    // get rid of strings and round nums
    for (let i = 0; i < nums.length; i++)
    {
        // if a number, push to n
        if (!isNaN(nums[i]))
        {
            num.push(Math.trunc(nums[i]));
        }
    }
    num.sort((a, b)=>a-b)
     let odd = [];
     let even = [];

     // loop through num and push accordinly to the appropriate array
     num.forEach( function (x) {
        x % 2 !== 0 ? odd.push(x) : even.push(x);
     });
     // return both arrays added
     return odd.concat(even);
}
@SweetCodingInc What would you say is the advantage of the latter implementation ?
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 14:01

@ezioda004

Pros:
1) Faster
2) You understand how it works. (purely for the sake of learning)
3) Lesser abstraction

Cons:
1) Longer code

Also, can you sort an array without using native .sort method?
Adegoke Fred
@Frediflexta
Mar 06 2018 14:02
Alright, Its all good now, it worked! Thanks guys( @ezioda004 , @SweetCodingInc ,), Will be right back
CamperBot
@camperbot
Mar 06 2018 14:02
frediflexta sends brownie points to @ezioda004 and @sweetcodinginc :sparkles: :thumbsup: :sparkles:
:cookie: 341 | @sweetcodinginc |http://www.freecodecamp.org/sweetcodinginc
:cookie: 498 | @ezioda004 |http://www.freecodecamp.org/ezioda004
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 14:02
I know the argument that why not use it if it's available. You don't learn anything that way
if you go to some company for interview that pays really well, all they're gonna be interested in is how well you can navigate through loops and implement search and sort operations
Nazar
@IsaakNazar
Mar 06 2018 14:12
@SweetCodingInc you mean that you should be able to implement codes with and without native methods such as sort reduce map etc?
Aditya
@ezioda004
Mar 06 2018 14:13

@SweetCodingInc I see, so would you say that these algorithms/native ways are used in production? Cause I have no idea.

Also, can you sort an array without using native .sort method?

I think I can I've wrote a sorting algorithm for a challenge a long time ago, it was very big lol

Sweet Coding :)
@SweetCodingInc
Mar 06 2018 14:14
@IsaakNazar Yes... You must be able to produce the same result as those methods using simple loops.
Aditya
@ezioda004
Mar 06 2018 14:14
I'd say thats one of the disadvantages of learning JS before C. I havent studied DS and Algorithms but I understand the point youre trying to make and I agree. Its on my todo list, but Im already full atm with learning React and Googles scholarship and C
Mukesh Kumar Angrish
@MukeshAngrish
Mar 06 2018 14:14
Hey everyone, can anyone help me with the Recipe Box. How can I edit the recipe name and ingredients in place?
Nazar
@IsaakNazar
Mar 06 2018 14:15
@SweetCodingInc ok :+1:
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 14:16

@ezioda004

I see, so would you say that these algorithms/native ways are used in production? Cause I have no idea.

Dev and prod are completely different things. We're talking in terms of learning and becoming a badass programmer.

In real world projects, of course you would use existing libs and algorithms.
But in order for you to select the right tech, hack around it and make it useful for your usecase, you must have intimate knowledge of how things work
@MukeshAngrish I'll send you a small poc that shows in place edit concept
Aditya
@ezioda004
Mar 06 2018 14:18
Ooh, ok but why wont you use the native ways if they are faster? Isnt that a major factor? I guess that varies but still
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 14:23
@ezioda004 In real world projects or while learning?
@MukeshAngrish Check this out - https://codesandbox.io/s/1v526v8y4q
Aditya
@ezioda004
Mar 06 2018 14:25
@SweetCodingInc Real world projects, not talking about libraries but say for example sorting, you can make an algorithm for that, so wont you use that instead of .sort()since its faster? Or is the speed difference is not that much so why bother kinda thing?
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 14:26
@ezioda004 In most projects that's not an issue
not on front end at least
the native js sort is pretty decent
Aditya
@ezioda004
Mar 06 2018 14:27
@SweetCodingInc Ah okay, thanks for the info. You always comes around and give me reality check :laughing: , Ive yet to learn so much
CamperBot
@camperbot
Mar 06 2018 14:27
ezioda004 sends brownie points to @sweetcodinginc :sparkles: :thumbsup: :sparkles:
:cookie: 342 | @sweetcodinginc |http://www.freecodecamp.org/sweetcodinginc
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 14:28
@ezioda004 no worries.. keep at it
Nazar
@IsaakNazar
Mar 06 2018 14:28
badass programmer means to be the best?
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 14:28
@IsaakNazar As best as you can be
best is a relative term
and as best as is bad gramma
Aditya
@ezioda004
Mar 06 2018 14:29
Yes badass programmers who wear hoodies and their terminal font color is green like in movies duhhh
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 14:29
:laughing:
Nazar
@IsaakNazar
Mar 06 2018 14:29
ok, if I will solve 3 problems everyday in Codewars, will I become a badass programmer and good at problem solving, your opinions?
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 14:30
and a ton of VMWare themes
@IsaakNazar You're going about it the wrong way
don't put time limit on it
you need to develop your way of thinking
initially it's gonna take you a while
I remember the first time I implemented search function...
took me good 3 months
but then again, I am a very slow learner
Aditya
@ezioda004
Mar 06 2018 14:32
@SweetCodingInc I do a lot of codewars too, but I lack DS and Algorithms, complexity and stuff (I know that because Ive seen people talk about it in the main room lol). Which book/course would you suggest for that?
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 14:33
@ezioda004 Take it step by step.. Don't mean to sound insulting, but if you're asking questions like how do I add an element to array without using .push, may be it's time to master what you do know so far
the DS and algo are extension to your existing capabilities. They won't make much of a sense if you don't master the basics
and there aren't many basics
if/else
loops
search/sort
don't even go to advance ds until you can do the things mentioned above intuitively
after than, the learning curve would be a lot smoother
Mukesh Kumar Angrish
@MukeshAngrish
Mar 06 2018 14:35
@SweetCodingInc Thanks, that's quite helpful.
CamperBot
@camperbot
Mar 06 2018 14:35
mukeshangrish sends brownie points to @sweetcodinginc :sparkles: :thumbsup: :sparkles:
:cookie: 343 | @sweetcodinginc |http://www.freecodecamp.org/sweetcodinginc
Aditya
@ezioda004
Mar 06 2018 14:36
@SweetCodingInc I didnt know you were talking about native way of implementing it, so I thought there was another way method or something like that, but I'm pretty sure I could have atleast done that. I'm pretty confident with basics and feel like I'm lacking ds and stuff thats why I asked
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 14:45
@ezioda004 I see
If that't the case, this site would be great for you
Aditya
@ezioda004
Mar 06 2018 14:53
@SweetCodingInc Thanks, I'll do it after completing CS50. I've done pset0 and pset1 and I can see what you're talking about. Learning and understanding how these method works is important and helpful in becoming "badass" programmer :laughing: I think week 4 has Algorithms, excited for that but anyway thanks again :)
CamperBot
@camperbot
Mar 06 2018 14:53
ezioda004 sends brownie points to @sweetcodinginc :sparkles: :thumbsup: :sparkles:
api offline
Kaz Baig
@kbaig
Mar 06 2018 15:18
:wave:
Christopher McCormack
@cmccormack
Mar 06 2018 15:19
@kbaig yo
Kaz Baig
@kbaig
Mar 06 2018 15:19
@cmccormack How's it?
I just realized the Casual room is down
Christopher McCormack
@cmccormack
Mar 06 2018 15:19
@kbaig Good - learned today that you can do Math.floor by simply prepending with ~~, so I have that going for me :)
Kaz Baig
@kbaig
Mar 06 2018 15:20
@cmccormack The bitwise operator is a bit diff but in almost all cases does the same thing as floor
Christopher McCormack
@cmccormack
Mar 06 2018 15:20
I've used ~ in the past for making nicer indexOf lookups but never used it to coerce to an integer
close enough for what I'm using it for :)
Kaz Baig
@kbaig
Mar 06 2018 15:20
I decided to avoid them :)
Christopher McCormack
@cmccormack
Mar 06 2018 15:21
psshh elitist
can't play in the dirt with the rest of us worms
:p
Kaz Baig
@kbaig
Mar 06 2018 15:21
Nah it's more about the fact that I don't plan on using JS professionally, so I'm likely to forget a lot of shorthand if I get busy with other projects
Would rather have used the basics well
Christopher McCormack
@cmccormack
Mar 06 2018 15:23
@kbaig so you're more of a String(float).split('.')[0] kind of guy?
Kaz Baig
@kbaig
Mar 06 2018 15:23
That's my jam dude @cmccormack
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 15:23

@kbaig

The bitwise operator is a bit diff but in almost all cases does the same thing as floor

and a hell of a lot faster

Christopher McCormack
@cmccormack
Mar 06 2018 15:23
HAHA
is it faster in JS? I thought JS was slow with bitwise operators
Kaz Baig
@kbaig
Mar 06 2018 15:24
Pfff who needs performant code :shipit:
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 15:24
Not true
Christopher McCormack
@cmccormack
Mar 06 2018 15:24
could still be faster no clue
Mukesh Kumar Angrish
@MukeshAngrish
Mar 06 2018 15:29
@SweetCodingInc The code you gave me, it is editing on character at a time for my code. Can you help me with that
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 15:29
@MukeshAngrish let me check
but did you understand the general idea behind it?
Mukesh Kumar Angrish
@MukeshAngrish
Mar 06 2018 15:31
Yeah I understood it, but I think your code works because you have the text called from the state whereas I am calling it from props
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 15:32
@MukeshAngrish Yeah.. so you call that props.onUpdateRecipe function, which updates your component and resets the state
@MukeshAngrish I'd suggest when you're in edit mode, you replace that edit button with let's say, save button
and call this.props.onUpdateRecipe on click of save button
Mukesh Kumar Angrish
@MukeshAngrish
Mar 06 2018 15:36
@SweetCodingInc The check icon is identical to a save button.
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 15:39
oh right.. then call this.props.onUpdateRecipe on click of that
instead of inside handleNameUpdate
Mukesh Kumar Angrish
@MukeshAngrish
Mar 06 2018 15:40
@SweetCodingInc How will the edit in state change to false then?
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 15:42
@MukeshAngrish Ideally you should have maintained a state for that component, but for now you can use element ref like this
Mukesh Kumar Angrish
@MukeshAngrish
Mar 06 2018 15:42
@SweetCodingInc I think what I can do is on the click on check icon, I can call the handleNameUpdate and inside it, I can change the editand call the this.props.onUpdateRecipe. But the only problem here is I need to pass either the input element's text or target value
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 15:44
{this.state.edit && (
<input
  ref={(input) => { this.recipeTitle = input; }}
  className = "recipe-name-input"
  onChange = { this.handleNameUpdate }
  value = { this.props.name } />
)}
and then
{this.state.edit && (
  <i
  className = "fas fa-check edit-name"
  id = { "edit-name-" + this.props.index }
  onClick = { () => {
    this.setState({ edit : false });
    this.props.onUpdateRecipe(this.props.index, this.recipeTitle.value, this.props.ingredients);
  }}>
  </i>
)}
Kyle Holm
@thekholm80
Mar 06 2018 15:45
man you folks are at it early today
Christopher McCormack
@cmccormack
Mar 06 2018 15:46
@thekholm80 to continue my 'we're all worms' metaphor, we're just trying to avoid the early birds :)
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 15:46
@MukeshAngrish Yes.. You could do that.. but with the code in your current state it would be a pain in the ass
Kyle Holm
@thekholm80
Mar 06 2018 15:46
:D
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 15:46
so easier way would be to use ref
@thekholm80 Ser Kyle :wave:
Mukesh Kumar Angrish
@MukeshAngrish
Mar 06 2018 16:00
@SweetCodingInc The code doesn't work.😬
Sweet Coding :)
@SweetCodingInc
Mar 06 2018 16:00
@MukeshAngrish hold on.. will take a look in another 30 mins
I have a meeting to attend now
Daniel
@dkapexhiu
Mar 06 2018 16:38
hi! is it possible to add new objects on a map by doubleclicking it? i am using google maps javascript api
Ken Haduch
@khaduch
Mar 06 2018 16:40
@MukeshAngrish - I have been doing a React course (currently have stepped away from it for a few weeks, but...) I wonder if the way that React handles updates to the screen is not impacting the way your function (editing the recipe title is the current issue, correct?) requires more interaction to do live editing? For example, editing a form in an application that is being used in the course, the input elements have "onChange" handlers set up that set the state for the input element, which, if I recall correctly, would then trigger an event to have React update the text. I might not be remembering all of that correctly, but I'm just looking at the code for the project and sort of remembering how it worked.
Ken Haduch
@khaduch
Mar 06 2018 16:54
@MukeshAngrish - this article deals with that problem (if it is the problem...)
Mukesh Kumar Angrish
@MukeshAngrish
Mar 06 2018 17:06
@khaduch I don't know if I completely understand your point but here's what I can say about it. As you said, in React the application is changed with the help of handlers that set the state of the components.
Now the simple solution to what I'm doing is that I can declare the state of each component and keep the copy of the data that is passed through props to that component in its state. That is what @SweetCodingInc suggested initially. But there is one big rule in React. "There should only one source of truth". That is, no two components should have the same data in their states. I know that in a small project like this, the rule can be violated without any consequences. But I don't want to.
The problem I'm currently facing is that React is re-rendering on every key stroke, i.e., on every character change. And I want it to update after I'm finished with editing the text.
Darren
@DarrenfJ
Mar 06 2018 17:06
morning fCC
:wave: @khaduch
Ken Haduch
@khaduch
Mar 06 2018 17:07
@DarrenfJ - howdy Darren - how are things today?
Darren
@DarrenfJ
Mar 06 2018 17:07
the usual.. workyworking and busy.. and you?
Ken Haduch
@khaduch
Mar 06 2018 17:12
@DarrenfJ - just puttering around at the moment, reading some React info about handling input elements (refreshing my partially-acquired knowledge from my React course.) The perpetual quest to try and learn a bunch of stuff... :)
Kyle Holm
@thekholm80
Mar 06 2018 17:13
@DarrenfJ @khaduch :wave:
Ken Haduch
@khaduch
Mar 06 2018 17:18
@thekholm80 :wavy_dash: :wave: :wavy_dash:
Darren
@DarrenfJ
Mar 06 2018 17:24
@thekholm80 hey brutha! :D
@khaduch ack! yah... have to revisit React.. been on the backburner on back-end stuff too.. node blah blah etc etc.. too much to learn
Stephen James
@sjames1958gm
Mar 06 2018 17:31
@DarrenfJ :wave:
@thekholm80 :wave:
@khaduch :wave:
Darren
@DarrenfJ
Mar 06 2018 17:51
@sjames1958gm hello hello!
Ken Haduch
@khaduch
Mar 06 2018 18:08
@sjames1958gm - :wave: :wave:
Kyle Holm
@thekholm80
Mar 06 2018 19:22
@sjames1958gm :wave:
alpox
@alpox
Mar 06 2018 19:26
@MukeshAngrish best way to go for that is to debounce the update. Means any time an input comes in, you trigger a future update of the state - like 500ms after the change. If another input change comes in until then, you cancel the last timeout (delay) and create a new one. That way the state will only be set after you are done with writing or make a pause. You could also put it in a temporary state when a change comes in and only put it into the right state when the focus on the input is lost
AbdellWeb
@abdelwahabe
Mar 06 2018 21:53
hi