« first day (2440 days earlier)      last day (2733 days later) » 

A K
A K
00:00
async/await is pretty epic; saves so many lines of code
but to understand the with keyword, you'll need to understand scope and execution context
that won't be wasted
how can i get the "current" width/height from my react components parent component. I have a <Graph> which uses SVG which needs a width/height to draw into. I want the <Graph> do set its <svg> to whatever the element it is a chid of happens to be at.. i guess render time.
A K
A K
can you give a use case for with?
seems pretty important
render() {
    with (this.props) {
        window.props = this.props;
        exec('("#app").html = "<div>"+props+"</span>"');
    }
}
wat?
00:02
that's redundant and a terrible example
thank you :)
A K
A K
hmm mdn is not recommending usage of with
true
A K
A K
states that it leads to a log of potential bugs
I've never even heard of the with keyword
00:03
to simplify my question, i need the components parent's dimensions since svg needs them specified explicitly (has no box model, css stuff)
monners You should forget it now, before it's too late.
Forget what? Mama? MAMA?!!
@AlexBollbach the parent should pass them in. data, like shit, rolls down hill
A K
A K
sounds like you wrap that parent component in a tag
use a lifecycle method to find that tag and get its height/width
then handle it before you render
you can make an <SvgResizer> component that get's it's own size and passes those props down to the svg.
A K
A K
00:04
dunno, im prolly wrong
my favourite javascript feature is labels
needs a goto
ndugger that dub is awesome
@Luggage no i get the props thing. but i guess i dunno how to actually get the element's/components "current" width/height .. anyway i used 100% for the svg's width/height attr's so i got my desired effect that way but i'm still curious
i rarely do it, so I forget.. something clientRect?
clientBounds?
A K
A K
00:07
google or stackover it
getBoundingClientRect
I think
rectBounds? boundRects? clientClient?
whoo, I was right
althogh that's DOM elements and not neccessarily svg elements
00:08
I use the hell out of getBoundingClientRect
looove it
i uhhh....don't use svg too much
using % worked
svg elements are dom elements in this context
so whatever the div that is the parent react component will render out my graph to the vounds
width 100% will make it the right size, but you may need the absolute dimensions to make the SVG at the proper scale (so it's not just stretched).
00:10
definitely use jQuery
flagged
there's also something called getBBox?
which apparently gives you the x,y in the svg co-ordinate system
@Luggage in what way will it be stretched? i'm aware of the user coordinate system and the viewport coordinate system. setting the svg's width and height to 100% should set its viewport to have exactly the same number of pixels as its parent dom node? is this correct?
i also have the problem of composing the right path points.. since path points won't allow %'s like the svg width/height attributes will..
@Luggage svg have an internal coordinate system that is relative to the box you define on the svg tag. height: auto will work just fine in css as well
^^ exactly. Thsoe are the coords you need
00:13
just trying to render a line graph that is defined in terms of percent.. or 0-1 . or something sensible and not absolute pixels
viewBox and preserveAspectRation are what you're looking for
the if condition is not triggering even if it has the same value.
it always end up on else (alert)
I generate all my SVGs for pdf output and always need a viewBox with known coords, so I may be mistaken
@EarvinNillCastillo Because there's a space at the start of the string on the first line?
@EarvinNillCastillo that's not really production code is it?
00:16
@monners it does have!
@derp what do you mean by production code?
@monners
@derp
ALL THE PINGS
sorry im a newbie @monners. what do you mean by pings?
Whenever you write someone's username, it pings them
@Luggage i'm having a hard time mapping the concepts of viewPort coord-sys and userCoord-sys to the size of the SVG element. i suppose the viewport is kinda like the element's absolute position on the screen? and the userCoord's is the coord system you define your paths/lines/rects in?
It's generally frowned upon to regularly ping someone
Did removing the space fix your problem?
00:20
@monners i can't understand what u mean by pinging the username. but your solution solves it. Thank you very much!
(in DOM speak its svg and viewbox) so if i set the svg (viewport) to 100%/100% and the viewBox to "0 0 100 100" that should give a nice relative coord system that will render to the full bounds of any div? provide the svg is a child of the div with no margin or border or padding?
viewPort is an html / dom thing.. and unrelated to svg (unless it's full screen). viewBox is what you seem to call userCoords
@EarvinNillCastillo
That's a ping
Try to avoid doing that to the same person multiple times in rapid succession. Also, you're welcome
lol
ohhh. in my voc, that's a tagged. Hehe. Sorry i thought the tag is not working
00:21
No problemo
Luggage is there a better place for documentation than mdn?
nice a searchable mdn, one for the bookmarks
It's not just mdn
00:27
Early morning guys.
But yeah, mdn is the go-to for js docs
Quick Q. Is there a way to get some request stack from html5 history api?
It's a good reference, but not always the best tutorials.
A K
A K
google and airbnb has a pretty good style guide and reference for js
correct me if i'm wrong but the svg width/height represents how many pxs the svg element will be. Viewbox sets a co-ordinate system within the svg so for a svg of width 200, height 200 and a viewbox of 0 0 100, a rect of width 50 and height 50 will be 100px by 100px on the screen
sorry i forgot to mention the inital size of the svg
https://jsfiddle.net/gx7yph3p/
this tells me that it is 100px x 100px but i wanted to confirm my understanding
00:33
My first driving lesson in 15 minutes.
nice knowing you.
i hated learning to drive
they just put you in the car and say drive
guys in lycra are worth extra points
thunk
A K
A K
driving is easy; its hard being a responsible driver
im a guy in lycra
00:35
thunk
@hsimah wat
I mean, how else would you learn to drive?
play mario kart
On the off chance that I might run someone over, farewell.
00:40
If pictures of India are accurate, that's likely. :)
j/k, have fun.
can you apply more than one argument to includes
i prefer carmageddon
Array.prototype.includes?
ya
Show me the signature of the method.
00:42
you can use find and pass in a function instead
No, you can't, derp.
like [1,2,3,4,5,6,4].includes.apply(argument, 0)
You are thinking of .some()
@littlepootis I dont know. I needed to sit in the car and play with the clutch/accelerator until I 'figured' it all out.
@Arrow 1. Why .apply()? 2. That's not the signature from the docs.
00:44
what do you mean by signature
the signature is the list of arguments and their types. On MDN it's in the "Syntax" section.
i was thinking of using find to return the element and testing whether or not it was undefined but yes, some is a more appropriate method to use
in the docs includes is passed arguments from a function
Paste the signature so I know you are looking at the right thing.
There are two possibilities.
1 message moved to Trash can
@Arrow Please don't post unformatted code - hit Ctrl+K before sending, use up-arrow to edit messages, and see the faq.
00:47
(function() {
  console.log([].includes.call(arguments, 'a')); // true
  console.log([].includes.call(arguments, 'd')); // false
})('a','b','c');
I told you what section it's in. If you can't even look up something in the docs when I tell you where, I can't help.
one sec
arr.includes(searchElement)
arr.includes(searchElement, fromIndex)
@derp You are jstu confusing things.
Arrow ok, good. Now compare that to developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… and see if you can figure out which takes multiple arguments and which does not
hihi, wanna ask

i want to do searching on json object

how should i do that ? is using $.grep() the right 1 to go for?
alright @Luggage, all yours
00:50
one min
The part you pasted (and the equivalent for .concat()) is the only part you need to look at to answer the question, but some of the other text also backs that up.
ya but that
obvious
I thought apply, was like iteration
Not even close.
Also your question was about .includes()
my question was about modifying includes to get to do what I want
You don't modify includes. It's a 'built-in' method.
00:56
how do you know what you can modify and what you can't is there a key word I should be looking for
You can write code that USES it.
simple. If it's not your code, you don't 'modify'.
assuming you mean 'change the code of'
well this is really more about apply call and this and less about includes
17 mins ago, by Arrow
can you apply more than one argument to includes
I see people passing arguments to functions Math.max so on
This question is answered by looking at what .includes() takes.
00:58
ya it just take two
what your looking for and where to start
the fact tht you are making it more difficult with .apply() does not mean you can give it more arguments than it takes
You do not need .apply() here.
or .call()
So I can use apply and call etc..only when those functions specifically mention taking multple arguments like concat
Math.max takes many args. check the signature
so the signature basically sums it up
Yup.
01:01
/o
i think that is highfive
I think o/ is high five. /o is a guy slapping his forehead. :)
:-)
apply/call is used because arguments is not an array
what do you mean
arguments is array-like in that it has a length but it does not have the array prototype methods such as includes
01:09
ya arguments is an object
.apply() was used with Math.max because you/they HAD an array of values and needed that use that for the argument list..
all hail vbscript!!
it is array like because it has length
@derp what are you saying? I don't think that was the issue here.
I wasn't going to talk about apply() since he doesn't need it for .includes() but you are saying some things that are confusing, so I had to jump in
however, you can use slice on arguments
01:11
in his example, you are forced to use apply to use includes since he was calling it on the arguments object
ok, true. I follow, now.
elaborate elaborate
please
hold on, creating a fiddle
Evening all, why in jQuery can I do... console.log($('tr[id*="CSCS"]').length); , but not console.log($('tr[id*=variable_name]').length);?
the arguments object in js is unfortunately array-like and you don't get the built in array methods found on this page developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
01:18
Array.from(arguments)
// easier on the eyes (imo)
function foo() {
    console.log(arguments.slice); //this is undefined because the arguments object is not a real array
    console.log([].slice); //this will return back the slice function since it is a real array
}

foo();
one way around that is to use the call method like in your example which allows you to "borrow" those array operation and call them on the arguments object
Or you could just use Array.from
ok
continue derp
yup or use Array.from to turn it into a real array
01:19
That's exactly what it's for
I already know about array.from
continue with call
Why?
because call is something I need to better grasp not array.from
So you're gonna write more verbose, less readable, hacky code instead of using a built-in method specifically designed to solve your problem?
well...for learning purposes i don't blame him/her
01:22
// all of the following lines are equivalent, but some won't work on arguments, since it's not a real array.

arguments.includes('a'); // FAILS
[].includes.call(arguments, 'a'); // good
Array.prototype.includes.call(arguments, 'a'); // good
Array.from(arguments).includes('a'); // good, but makes a new array
If you're learning, then find an actual use case that's appropriate, like setting the context of this deliberately to some effect
for [].includes.call(arguments,'a' )
call lets you change the value of 'this' and executes it with the arguments provided.
So in your example of [].includes.call(arguments, 'a')
but includes is being done on an empty array
hi @Shmiddty
01:27
that would be vague equivalent of getting the includes function from the array, changing the context to your arguments object and then invoking that function with 'a'
it makes an empty array just to get to it's includes(), but .call()s that as if it was called on arguments instead. (that is what .call() does)
that empty array is wasted (but don't worry about it)
so call gets the arguments to become the array
say we wanted to play my song on my apple account on someone else's ipod
we ask someone ([]), borrow the ipod (call), change it to my account (arguments) and then paly my song ('a')
because it is putting the context of this on the includes
Oooow
so call is changing the arguments as the execution context
yes...when it gets executed
01:32
@Arrow When you call includes on arguments, what it tried to do is find the method by executing this.includes on arguments. It's not there. By calling it, you set the this context to the Array object, so instead of trying to execute arguments.includes it's actually calling Array.includes, because the this context is now no longer pointing to the arguments object but instead the Array object
so it is like arguments.includes('a') but not really becuase arguments is not an array
yes
sweet
is the same true of apply?
yes, but apply takes in parameters as an array
The only difference between call and apply is how you pass in arguments
01:33
apply - a - array
when you say parameters you mean a single value, be that an array or single values
A K
A K
and bind creates a function!
if you want single values, use call otherwise use apply if its an array
uhhh
for example, the slice method takes two arguments
.bind.apply.call.bind()
if you wanted to use slice on your arguments object
these two are equivalent
[].slice.apply(arguments, [0,3]);
[].slice.call(arguments, 0,3);
01:39
wait can you use .bind.apply.call.bind() like that
That was a joke.
But.. yes.
Don't ever.
If you go three levels deep like that, you get stuck in a function forever.
okay munch time for me!
umm... is that like a circular object or something
o/
o/ to everyone
I didn't run anyone over
@hsimah Lol he did just that
But a guy almost hit me because he was driving on the wrong side of the road
lol
01:51
driving on the wrong side of the road eh… pretty common mistake
@Cauterite You play ETS2 too? :P
ets2?
European Truck Simulator 2
Euro Truck Simulator
no, but does that mean you can drive to Britain in ETS?
01:54
Euro*
@Cauterite yes, and it's easy to forget
right off the ferry and into oncoming traffic
the english drive on the correct side of the road
Not for me. I'm left-handed.
i am too
@hsimah Well we drive on the right side of the road
01:56
*wrong side
@KendallFrey yeah but right is wrong and left is right
@Luggage I thought left-handed people are better suited for driving on the left
I drive on the spaces, not tabs, side of the road.
its interesting why we drive on the sides we do and who swapped and swapped back
I thought I read that driving on the left was ever so slightly better for most people, and just assumed that since I am left-handed then the right would be better for me.
01:58
I'm basing that on something I heard ages ago, that right-handed people tend to pass obstacles on the right
whatever merits there are for each side, are far outweighed by the inconvenience of not having a global standard
But I can do both. Driving on the left just means I need to pay more attention to traffic patterns
since I am used to looking on the other side of the road
and traffic circles feel really wierd
you mean roundabouts?
the worst way would be sitting on the same side of the vehicle as the side of the road you're on
01:59
afaik the Romans stayed left, so their right hands (sword hands) were on the side where you'd be fighting. This is why the British drive on the left. Napoleon decided to swap it so Europe would forever remember him. Then, in the States, people often used larger carriages with two horses side by side, so it was better for the right handed driver to sit on the left so he could whip all the horses. So they drive on the right.
3
@Luggage traffic circles lol
That's what we call them.

« first day (2440 days earlier)      last day (2733 days later) »