Numenta Building HTM Systems, 31 May 2019

Previous Meeting Next Meeting

⏯

youtube image

►

From YouTube: BHTMS: Combined encoding (SP prep for input space) Part 1

Description

Broadcasted live on Twitch -- Watch live at https://www.twitch.tv/rhyolight_

A

Okay, put put some some chill music back on and we're gonna get to it. Let's get to building HTM systems the go-to place for this is this repository and.

A

Bht, ms is there's some info about what I'm going to be working on it's in there. It's it's a website. It's a react website, but it's showing tutorials on how to build HTM systems showing HTM concepts. We've been working on encoders and we're trying to fast forward a little bit to spatial pooling. That's the plan.

B

A

Dean, thank you.

A

So the live website I think, is on here there. It is so you can see if you click on this deal. I have mouse position. I love, I like this mouse. Was it a sec I, let my mouse there we go. If you click here, it'll bring you to the actual live site that we're building. This is the latest deployment of the site, so you can see what we're doing.

A

These are the types of components that we're creating we're making interactive visualizations and we're going to be moving on to creating a spatial pooling page today and we're going to start building out some of the things that we're going to need to make that work.

A

So so here is the plan. First of all, so the things that we want to do is we want to have a simple cyclic, encoder diagram and but we're gonna skip this. This is going to be part of the envision, but we really need right now to move on to spatial. Pooling is a streaming display. Let's, let's show you exactly what this is. What this looks like.

A

Right here is how you can get to the old version of this that I was sort of going off of and I think it is maybe at the bottom. Where is it the bottom of the input space page? This is what we need. We something like this anyway, it's basically an auto-generated spatiotemporal stream, so it just is a it's a it's a flow of data at this time. Here's a scalar data point and we don't need to make this visualization to do to get to the spatial pooling stuff, hence on here.

A

I didn't really highlight it, but we do need to do this, create this automatically generated data at the page level so that we can use it when we create react components, because that data is going to update and each data point is going to be a an update to any diagrams on the page that are displaying the current data point right, so we're gonna have, for example. This is the diagram. I want to be finished with today. This my goal is to finish this diagram.

A

Today, it's gonna be a one rectangle, essentially with a bunch of grid cells. In it not grid cells, just a bunch of cells in it square shaped cells and there will be a button or a toggle or something wait a minute. Maybe I should do this. There's a toggle on the bottom and there's two states so this swaps between the two states. This is there's not two grids here.

A

There's this when you, when you hit this toggle over here it swaps to this state, and you get to see all of the different contextual information, all the different semantic information combined into one representation that combines all the semantics so- and this is essentially our input space when I talk about input space in in HTM school. That's that's what I'm talking about good luck at chess mark?

A

If you don't know what hm school is, you should watch this series of videos a lot of these visualizations I've that I'm gonna be working through, have I've done in one aspect or in one way or another, to support this video series. So there's a ton of information, especially you probably want to watch spatial pooling the first spatial pooling video that talks about the input space and and how the spatial pooling algorithm or how a set of neurons that are performing spatial pooling connect initially to the input space.

A

That's the visualization that we're going to be building here soon, and that's what we're sort of preparing for here, because this input space diagram is we're going to be expanding upon that because we're going to talk about potential pools and we're going to want to display that streaming data in all of these charts that we're gonna create after this is going to display the show that streaming data. So the first thing that I want to do is that streaming data bit so we're gonna.

A

Do this first, okay sounds like a plan to everybody and we even have now go to our github page. I have issues and projects I've moved everything off of Trello and put it here on to github and I. Think I have this pretty well organized right now, I, there's a couple things that I'm currently working on.

A

One of them is a streaming scalar data, so under projects I've got the separated in three things: the remaining encoder stuff, which is here well I'm, keeping track of all the different things we have to do for encoders here, the bugs that aren't fixed and all that and I'll continue, adding like there's time, encoders and stuff that I don't have issues for, but we're going to focus on the spatial pulling stuff, because that's what people want to do and the first thing we need to do for that is basically set up this streaming data, so, let's without further ado, get to code here.

A

This is my chat bot. This is building HTM systems, okay, so I'm going to bring up vs code and I'm going to start a live share session as soon as this all pops up live share, and that should give me a link like I just pasted. If anyone wants to join the live share session in vs code, that's the link for it, and so let's first create a new page. Let's have a space so that we can do this and we'll call it for right now. Let's just take, this should be pretty easy.

A

Let's take a one, that's empty like this encoding time and we'll create a new file and we'll we'll just say. Maybe maybe we should just put it on the components showcase. We could work on it there. Now, let's we'll make a page for it and we'll change the name. Eventually, let's call it a spatial pool length for now and we may change the name of this as we reorganize but we'll call it spatial pooling for now.

A

Spatial pooling, so this will be a page called spatial pooling I'm just going to lay it out.

A

And make sure that it gets indexed properly, so the layout should I I'm knew it reacts still if anybody's watching me. So the layout I think how do I need to specify to the layout that I've got a new page or L, or maybe it will just automatically do it let's find out I have to run it.

A

Remember Dave: this is particularly for you, if I'm not paying attention to use. One of those sounds to get my attention about something because I seem to have a bad habit of I. Think there's a minute. I think I've a menu somewhere header there. It is header, that's all so so, let's create one called spatial pooling again: I reserve the right to change any of these names. I just want to have a space to work right now, all right, so that should work.

A

We have a spatial pooling page here. It says it couldn't be found because I named it wrong, so cooler it should be pooling.

A

All right, all right, spatial pooling encoding time coding categories coding numbers.

A

Now we will let's, let's look at our coding numbers page because it's gonna be the closest one that we have. So what we do want to have like a state object, I'm going to be copying a lot because, like I said, I'm still getting used to react so I want to I, want to look and see what I've done in other places, try and use the functionality to react as much as I can so. I definitely want a state object and the first.

C

A

I'll put in there is just a something called current data, and for now that's undefined- and this let's say this is this- will be the page, the page level data that I'll use to store that streaming, scalar value that I'm auto-generating, so anything that I give this current data to as a react component should update every time. Something within this page updates that state so I'm going to have a function on here. Essentially that steps through the state.

A

Something like.

A

Data step, I, don't know I'll, just I'll call it data step for now and I'm gonna. Do it the way I should do it a certain way right, I should do it with the arrow function with no, no I. Don't have to do that here. This should be fine, I'm thinking of something else.

A

Why doesn't that fight? Isn't it like that? Should that work? Oh.

A

Yeah yeah I have to create a render function, render no no! No. Why did it do that render oh my gosh I, don't I need a body judge to me. I just need a a render function.

A

Renderer, why does it keep changing to canvas render okay and then this can return that that should work, I, hope.

A

Is that a lint warning? Oh, it is a lint wearing I, don't like to use semicolons. So what this is new? When did this happen?.

A

Ts 1005, so what is the linter that's doing? This I must have a TS something called TS TS lint TS.

B

A

It must be running, it says it's not installed, but it must be running huh typescript yeah, but I. Don't know that I, let's see.

A

So now this is a vs code issue that I'm trying to figure out here. This.

C

Is weird I've? Never this has.

A

Never happened before at least I've never had this particular issue will.

D

It compile that.

A

C

A

No, that's it unexpected token expected. I must have something wrong in my export. Oh yeah, yeah, yeah, okay, I need to make this a class that extends react component. Can't I mean shouldn't. It should I do this if I'm gonna do it this way, I'm gonna, I'm, gonna change this around okay, that and then like I'm gonna export default.

A

Should I call spatial, puller or spatial pooling spatial pooling you don't necessarily like calling it special puller. So that's better okay, yeah I'm gonna make it a class I like making it a class. I feel like feel more secure.

A

Okay, so one of the things I need to do. I'm out, I'm gonna go look at my old code and see how I did this data step thing, because it wasn't too hard if I. Remember correctly, it was it's pretty simple, but I have to remember I think it was in the input space potential pools.

A

Set up dat GUI on these load, random potential pools, there's a function somewhere in here that, like starts up a, maybe it wasn't this. Let me let me go look again.

A

Streaming scalar data: this is on the input space page input, space.

A

Just trying to figure out what I did here input space, one of these initial perms or one of these is doing this- create, is making that happen. I, don't remember how I did it either potential pulls or initial perm. So it's an initial perms set up that GUI. That's not should be.

A

Hover box great get random perms update percent connected display, update display just draw histogram.

A

What is that bit at the bottom of the page that I did this streaming? There's got to be a component for that.

A

It's it a display.

A

I swear: it should be in here coding time unless I put it in like the wrong spot, which I might I mean. Sometimes I do so. I click to screen support code and.

A

Streaming scaler window here it is so I put it in the combined and coding section. Okay, so I have this thing called streaming: scaler window. Okay! So let's find this so there's time step slices per period. Okay, so here we go next semi random sine wave data point: that's this is the function that I need to to basically replicate. Let's see how we're using it here fill fill window with data.

A

Window size, all right so we're just after so set data after set and then I've got something that will start the timer there. We go starting a timer.

A

And this this is what actually yes, but next semi random sine sine wave. Whatever data point so I need to create a component, so you know I, don't know if I want to create this as a react component. I think it's just going to be a page element that essentially just something on the page that does this so I can attach it to the not the encoding numbers, the spatial pooling page here. So that's what I want to do. So, let's try and find the relevant code. So I know that I'm gonna want this.

A

Next semi random sine wave data point function, which probably means I'm gonna need a lot of these other things too.

A

So I'm just going to copy and paste a little bit here, and hopefully this is all I'm gonna need and the rest is just sort of minutiae, of setting everything up and doing the diagram bit. But as far as the data creation, I'm hoping this is all I need. We're gonna, try.

A

So, first of all, I know this is silly but I'm just gonna paste it in here and see the stuff we don't so so men and Max I'm, not using because I think why am I not using that? Next to my random sine wave data point.

A

This must be for looks. This must be for the display which I don't need, because so this is going to give us a value and a time marker and the value is going to be scalar. We're not we're not encoding it here. It's then the time marker is just basically the time, the time value in time.

A

So each data point is gonna return, a value in time, and you can just call it I, don't even think I need to do use this fill window thing, because that was just for the display, so really I just want something. I can just call this I think that's it. I think all I need to do is call this and it will return me that is this being used. Yes time, slices per period? Yes, yes, yes, so so now, I need to decide because data step decides at what point in the wave you're at yeah.

A

Thank you do I need that utility yeah. So let me go to I'll grab that from I had that elsewhere. Where did I have that I thought I pulled it from here.

A

A

It was in a component right.

A

Yeah, these helpers.

A

Utils we put in helpers so we're gonna need to add another helper here. So that's one thing.

A

Which is like it will be called at random, arbitrary and that's not coming from helpers. This is going to come from what components helpers components diagrams helpers, so it really shouldn't be there right. Well we're gonna, I'm gonna! Do it for now and.

A

I'm, just gonna put a fix me.

A

But that's what I'm gonna put it for now: just get random arbitrary. So let's get the go, go and get that from the old source, or was I streaming scaler window utils dots to get random arbitrary, it's simple, I! Don't! If that's all it is for now, I, don't even need to pull it and put it in helpers. If that's all, it is, but I am gonna use this in other places. So for now for I'll, do it I'll? Do it.

A

A

Okay, get random arbitrary, so that should work.

D

Don't eat this anymore.

A

Get random arbitrary time marker new dates, I'm, not using anything I, do need that those brackets okay.

A

As you can see, I opened up my IDE so that people watching can help. Oh here we go again, oh no! No! No! That was right. So you see another reason why you shouldn't declare variables on separate lines with commas. It's just confusing. It's just probably here counters data step, jitter.

A

See this is all weird: okay,.

A

So this is adding a jitter randomly.

A

This really shouldn't be done. This way, oops.

A

So Dave, what did you just change here? This was. Was this too complicated? I can't remember what it was.

A

First time, stuff.

C

A

So this time marker that I started with I just went like a year in the past. Okay, that was that's something different. The time marker is still there. Okay, that's why I thought you changed it every month, so I just wanted to start from some arbitrary time, I think in the past like a year ago and just step forward. So that's what it's gonna do.

A

The time markers is associated with like the starting point of the data and it is dependent on the time step. So the time step, let's see one of these or is a data step data step period counter is.

A

I'm trying to figure this out I remember this. This all worked, obviously, if I'm trying to figure out what it does or how I do it. I should be able to call next net semi-random sine wave data point in secession at any point and get the next step, because I'm keeping track of what is, is it that moves it's this data step, so we initially start with a data step that should probably be a member of the page class and that's what accumulates over time.

A

It's not state right, but it but it but I should put maybe I'll just call it step equals and we'll initialize it just as we did here. So so, let's, let's take this stuff down. I'm gonna. Take this stuff down I'm hoping we can get all this stuff. Whatever is necessary.

A

So now I want to add a constructor, because some of this stuff is just for a calculation I don't want it all to be members of the class like time step. I, don't think these should all be class members.

A

What I'm, what I want to end up with here.

A

Hold on a second I'm starting to hesitate and what I want to do here periods this doesn't change. Conor is oh yeah, yeah yeah, it does change yeah.

A

It just keeps track of what period of the sine wave I think we're end, and so this was a way that I could I put this in, because I thought I could add artificial patterns here so like every third period, I could change something so that you could see longer-term temporal patterns, so so I was starting to remember what I did here: I a sine wave pattern so that it was it was associated with a day.

A

So this is all was all are engineered so that the sine wave that you see here is is essentially daily with some noise and, as so as you can see, there's like there's a pattern here: there's bump bump, bump, bump, bump bump bump bump bump bump bump bump.

A

And I want to be able to change this in the future. Does it make sense to make it its own component or helper method? Probably so yeah, probably it's.

D

Not really a rat component.

A

It's just I mean I could just make it a class like.

A

Data generator stream, scalar stream generator, or something like that, initialize it with some. So there's a good question David. If I want to just create a non react, class I would want to put it in components, would I, because these are seem to be all react.

A

Components, pages and components are, but are both react if I want to create my own, but what's the what's, the thing should I put it in like a live directory, live hey Falco, you missed the beginning, because you're reading papers, the only thing that you that you missed that you might be interested in is this.

A

You can try those out. So you see what you think.

A

B

Comments below okay.

A

Oh there you go a stream jet, oh I, see so I could create it as a react component.

A

It wouldn't have any markup, though, at this point it's it's just a data component.

A

Whatever would be giving the data as a prop.

C

It's puzzling, I, don't think I've ever seen. Anything quite like this before.

A

Exactly a high order component, but it provides state so so I can use this to provide state as sort of a global page state that will then bubble down to whatever bubble up whatever you wanna call it to other react components that are listening for that state.

A

Is that the the idea, so this could generate state and then the rest of the page can use it as a state variable? Okay, let's do that? Let's create something in here. There won't be a diagram, though it's not honestly, it's not really an input. Let's just call it. Let's create a folder in here, just call it data. Does that make sense and we'll call it a stream generator stream generator JSX.

A

Does that make sense and I.

A

Will start from something I know and just pull things out, but I, don't like we'll call this stream generator. It will not be I, would get rid of all this stuff.

A

There won't be even be a render right, I'm not going to render anything.

A

There won't be any won't, be NID, opening values, I might send it. Something probably will send us something. Well, no d3.

A

We will use the helpers now, though,.

A

No encoder is no on/off color, none of this Jess and this stuff, so just a class.

A

Trying to join just what RT of not working.

A

Can you hear me, can I hear you I just can't hear you I think.

A

I'm gonna I, muted myself, an audio, but if I can hear you ever get to figure it out, but I think I'm on the right path here, I think I'm on the right path: I, don't.

D

A

There you are now I, hear you I.

D

Was muted, okay.

A

Do you do you need me to be unmuted and discord for you to hear me.

D

Can you hear me now I.

A

Can't I can hear you.

D

Okay, yeah, so the this, the higher-order component, you can do it either two ways you can either do it like with a function that says like with data string whatever or you can just make it like a react component that you pass it the Chuck, the children component like you're doing in here, and what will do it it'll just forward the props in.

A

D

State from the parent and it'll forward it to it so that it will any children, pesto will rerender whenever the data updates and then in the child component, you just take in a prop called whatever you want: data that and it'll get passed down so that so the outer component won't render anything yeah.

A

D

Just win the children that you passed. Do it so.

A

That's that's what I want to do then yeah, so you're, basically making a parent component that provides data for any children that are defined with it. Yeah.

D

A

Yeah all right that makes sense so so, like the children, I haven't defined yet yeah.

D

Yeah, the children would be spatial pulling or whatever, then whatever they can find that you're gonna render the diagram with that.

B

D

And then it would just automatically get the data for it and what's good about that is, if you wanted to, you could still use that spacing spatial pulling component and without the higher-order component and pass it data yourself, but this just makes it. You know reusable that.

A

Maybe you can, that makes sense. That's that sounds like a good plan. Do you think this is a good place to put it in data stream generator yeah.

D

I would create something like that, like like a data stream as a react component, and then that would maintain the state of the data and stuff and and since it's where a component, you can still give it props like the HTML accurate, you can pass it for like setting grading if you want, and then just, but that would handle the state of what the data is. That way. The child doesn't have to worry about it. I.

A

Could give jobs.

D

A

With the data feed and then put whatever children I want it yeah.

D

When with them helps when testing like when you mate, write a test, if you want to do for the spatial pulling component, you could pass in a static value for the data and make sure it renders code that.

A

Makes sense? Okay, so that's a good plan. This one would do let's, let's call it. Let's rename this, though, instead of a generator. Let's call this.

A

It's definitely a data streamer stream.

A

D

More, like a data provider yeah.

A

D

There's a scalar.

A

Data provider Thanks, okay, I'll change, this scalar data provider, whoops, that's weird,.

A

That's not a copy right.

A

Okay, now I want to see how I'm gonna so I can create it. Like so.

A

And I would put this so, let's get rid of those. We don't need. This, don't need any of this stuff. We're not gonna do a step. In this point, all we're gonna do is like right here. We're gonna, create a data, the provider and put whatever in it all right. I've got.

B

Nothing in it right.

A

Now, but so is there so here's a good question all right, okay, so let's, let's I, want to put something right here that shows that the data provider is doing something like the midden something every second. So should I compute it? How can I get access to its state from like this one.

D

So so, in this case the scalar data provider, would you want that wrapping spatial pooling or do you want to wrapping like another separate child diagram component.

A

I wanted to wrap only the diagram components that we'll be using its data, so individual.

B

A

Like I might have a cyclic diagram that needs to be updated by this, and that will update itself when it gets an update. I might have seven.

D

Over them, you know where they all be sharing the same data. Yes, okay! Well then this would this would wrap. I I would probably put wrap it wherever I'm using spatial, pulling wrap that in a scale their prior and just pass the data at the spatial point. That way you can pass at all the children. The.

A

Spatial fooling page yeah.

D

This spatial point: this is the page right. So yes, it's a move to space of the scalar data provider around.

D

A

D

This case, so in this case, instead of doing this, it would be like a functional high order component, we're at where we say like export default. Spatial polling, it would just say, like with scalar data provider and instead of being a component, would be a function that way just passed. The prop to this guy I know so so, if you want the scale or data provider, you need that data. If you're gonna have multiple children inside that, there's normally like an element, has one child for a wrap and put it.

D

But if you have, if you don't multiple ones in there, then it's best to just wrap the whole page in the scalar data provider.

B

D

That way, spatial pooling would have a prop called data, and then you can pass that data to whatever diagram you want. Okay, so how do I wrap the.

A

Whole page, like you, said instead of doing this, which is what I was trying to do, you said there's some way: I can put it outside of the spatial pooling page yeah.

D

A

No firetruck, it's possible.

D

Created so I'm gonna create a higher component function, all right that basically it'll be called like with where.

A

Are you creating this ID.

D

That's what I asked you that's not me, it's gonna be like this would be. A function will be called like with you know, scalar streaming data, oh.

A

Oh I see yeah so that so sort of where I'm trying to define that function right here, I mean you could do it right here right or you say, but I will.

D

A

This on other pages, that's the thing right.

D

Exactly yeah so like normally, what people do is like next to components you would have like hoc or you'll, put hoc, folder hoc.

A

Meeting and I order.

D

Yeah higher-order components, basically something that that wraps other components and provides something to it. Okay,.

A

Interesting so so, like an hoc at a sibling level of components,.

D

A

They folder hoc and.

B

A

Then I'll just move this. You know uh I'll create a file. Okay, you could.

A

Repair programming.

D

hmm It's not let me refresh I.

A

Wonder if you can try to create a file on my file system through this.

A

Air program is better than Apple programming.

A

How you did it? Okay,.

A

Interesting so.

D

Then so, basically in here right you have a class yeah.

A

D

This this would have been a normal high order component, but since you want to it's easier to kind of delegate, so then in here is where the state would be where you would have all your state and data and everything and then any time any time, gonna update data. You would just say you know this, that's a this set state and then you would update it and then what would happen?

D

Would that would rear end of this any properties you pass to this high order, one water from a great pass, but then it'll pass in a new thing like let's say, let's say that it was called scalar data yeah.

A

D

Then in here, where is a spatial pulling and here you would say: wouldn't person would import.

A

From HSE I think this, this is confusing I'm gonna take it out, because that's where we're gonna gonna do this here.

B

C

D

Now you have this, what you can do is instead of exporting this directly. You can just say, and this is kind of how yeah this is kind of how Redux works it wraps it with like this state management thing to where you can wear. You can handle rear Enders from like immutable data, but anyway, so this this would be like with scalar data.

D

Yeah, when this in here now, this guy is going to have access to this dot props, but whatever we called it scalar data so.

A

So this dot props will give me the props of whatever the scalar do.

D

Whatever you state.

A

D

Know it'll give you whatever you pass to this guy, as well as an additional problem called whatever we set this back.

A

Okay, so if I go to.

A

Alright, so so this is where I would set up state the state here, yeah.

D

This is, what's gonna manage it. Just the beta.

A

State equals yeah.

B

A

And so my data and I'm gonna put I'm gonna. Actually what what this will be is you know value comma time? Essentially, that's that's what this is going to provide an update for constantly and then here I mean I did.

D

A

That yet, but what I do you.

D

Want to pass value and time as separate props or no.

A

No I want what I want one data point that has a value at a time.

D

Okay, well then, yeah I would just wrap this in, like a data, that's.

A

Oh, oh I see, okay, so just.

D

B

It basically data.

A

All right, yeah and then here I, would say this state data, yep, I'm, gonna, call this data I.

A

Was just a cop.

A

They're on to me, my kids are selling me out. Okay, all right thanks thanks David I'm, getting I'm getting this so now since I've giving this data component, whatever I put in here. Well, when I, when I say this, stop props I should be able to say. Oh, let me amend this if, in my render here like this, this is where I want to prove out that this works, so I just want to show the snake.

D

Right here just do this drops.

A

Now there we go yeah that way, we'll get the whole day to point out and just see it so we'll see. Okay, this is great, so I can see the whole thing. That's in props, but first, but now I have to create it. If I looked at this right now, it would just be you.

D

Know look, you would have a an object with value.

A

And your time and get rid of this, let me clean this up. A little bit or I'm gonna get confessed.

D

And any other props you've passed just bishop o'linn right.

A

Okay, so so I'm just gonna put this then I just want to see something. This should work now should have I should see a value, so I just want to see something here, make sure that nothing is broken yeah, so I've got helpers, I, don't need I, think you're.

A

Not gonna use the same wire.

C

A

Layout special pooling see if ever get any errors.

A

A

I should see something here. We don't see anything.

D

Oh I know either this weirdo the importer. Here it's default exports. You don't need this one. Oh that's.

A

What the default does yeah.

D

A

Still I'll see it her. Oh there.

D

C

Is let's talk Caroline.

A

Okay, so then I just have to say dot data, all right, props, dot, data, yeah.

D

This stuff props that data- you should be there yeah.

A

There is so now, if I get this right, this should update every I want this update every second or whatever, depending on how I can figure it. So no.

B

A

Will go here and all I need to do is essentially write a trigger to kick it off. Yeah.

D

And like an interval, yeah.

A

Run next semi random, whatever every and then update my state every whatever so so, I should put that in a function right like start or something like that start yeah.

D

I would make it the start and stop and then what you see, what another thing you do here is you see how it's returning the web component? Yes, you.

A

C

D

Can even wrap any component you pass through it there's another component has like start/stop buttons: I can.

A

D

A

D

The child and go ahead all so.

A

Here's a question: how do I call this start and stop from the spatial pooling page.

D

Well, that that's I mean like the, but you could render the buttons here and then this button on wrap component like around this would say like this. That's artists, that's free.

A

For now, let's assume that it that it's just that.

D

You want the page. Well, then you just you could just say like on start equals.

A

D

In the page component, you also get a own start prop. Well, you can do what I want handle start. You start with a rabbit. Okay,.

A

Okay, okay, so so I could call. So if I did this I would just I've made this start and I just referring to the other start, then I could call this stop props dot start. Is that right.

D

A

Okay, that's that makes sense, I think that's what I want to do. I'll create a start and a stop that way. Then I can easily call it from wherever cuz.

C

I don't know exactly.

A

How I'm gonna be starting at stopping this I just want to be flexible.

C

A

So this start, this is where we need to like put the logic in so I want to have I. Think.

B

I'm gonna end up creating.

A

A constructor here, no, no, maybe I, don't I, don't need to do that. I can put it all in the start. Function all right bear with me. This is gonna, be messy for a little while yeah, okay, first I just want to see it work, and then this is actually something I I'm gonna make that a step function.

A

Now I'm gonna I'm gonna, keep it the same name for now and.

A

Figure out how I can just call this straight-up.

A

So at interval.

A

I'll just hurt you.

D

Honey for a moment you just passed Knicks I, like we didn't sign. We as the first point. Oh.

A

Yeah I could that I should I put this dot next semi-random. Oh.

D

Where, where yeah.

A

D

A

Then, if I want to bind this properly, don't I need to do that. Arrow function, no.

D

In order to be found, because if you look at the start and stop method.

B

D

In the rep component, I put that as an arrow function. So what that'll do is that already find this.

A

D

So if you just passed like this dot start yeah to the child, then you'd have to bind it in the constructor or.

A

B

A

A

Alright, that makes sense all right, so I so I have access to this here. This time step slices per period, I'm gonna, try and leave as much as this as I. Can it's I'm trying to figure out what used to be a member, because, what's I, think it's data step that ends up being no and counter data step?

A

That's how far to step ahead in time. Okay, that's that should not change. Okay, it's the counter that changes. I, think that may be the only thing.

C

A

Important to keep track of as like a member.

A

So if I want to introduce a member variable here when I call start that I can access down here and next semi-random wait whatever. Is it just this counter.

D

Yeah, you would put counter up here: okay, people and then this doc counter you, okay,.

D

Somebody's might having this.

A

Counter here, I also need to. Why am I using X like this I, don't know, I think I was I, need that okay, adding the data step juicer help.

B

D

A

Marker, so I need this also, this time marker needs to be set on start, so this is also.

A

Updated per time step.

A

Periods, something I can have here.

A

Let's move this down, we're.

A

Just trying I'm figuring out I, don't I can I can put this all down in this function. Most likely am I using.

D

Time send yes, so.

A

These are all gonna go down in here and once it's I can see it working I'll work on cleaning it up, so these are the only two things that need to be set on start all the rest of the stuff are or do not change. They're. Essentially, parameters of the generation function.

A

Yeah, that's that's! All we need to do is instead of returning is set the state, the perfect.

A

The new data points great.

A

Okay, so when we start we'll start this, let's I'm gonna pull this out update rate I, think that should be.

A

Probably the only.

D

A

That I want to.

D

A

This is update rate, so I'm gonna call that the stop props done update rate and down here. I. Don't should I um yeah.

B

I'll just leave it.

A

At this I'm assuming I'm gonna, get it update rate in milliseconds. So how do that's gonna be something I'll put here with.

B

How do I specify.

A

A property when I create the scalar data thing.

A

D

Yeah, you think you want to pass a prop when you call that which skill yeah.

A

Exactly I want to send an update rate as a property I.

A

C

To I could hard code it right.

A

Now and come back to it, it would be nice to see it change dynamically.

D

So that's worse,.

B

D

It's right so in here.

D

A

In I'm, at the top no I see I found the button to find your cursor.

A

B

A

It seems it seems like the natural way to do it is to send the props into this function. Somehow.

B

A

Guys hungry yet.

A

Hey everybody: what's going on everybody out there following along I, mean big big hand for David trim and helped me out with all this.

A

What was it Oh Michael.

D

D

What would be in time, yeah.

A

Like a thousand would be perfect, so you send the props first, oh wait! A minute yeah.

D

So this is a function, call and that's gonna return.

A

Okay, that's magic.

C

There's a lot of magic and react.

A

Okay, do you think it's gonna work now.

D

Yeah I mean you're, not saving the handle in the interval, but look that's fun. Yeah.

A

D

You said I'll start now.

A

I have to call start and like every time, I it's it's getting a new one. So now I just have to call start from the spatial pooling here and I can call start right here right. This props start.

A

What's going on.

D

You put a button, no.

A

No, no I, don't I want it to automatically start I, don't need a button. Oh uh this is gonna run all the time. This.

D

Is a class, then you just do it like a component good mouth? Oh.

A

Right, okay, and so this will be easy. I will programmatically pause it at some point. So I had a pause button and we'll deal with that, but for right now, I just want to see it working Oh get random arbitraries not to find that was I'm, gonna I'm, just gonna inline that because it was so simple where was to get random arbitrary, it's basically, this math.random min/max.

A

Here we go random, arbitrary.

A

B

Why I had lets.

A

In equal zero, oddly I could parameterize a lot of this stuff, but I don't know that I'll need to so.

A

So basically, this is my jitter.

B

A

I get time of undefined time. Marker, okay, so I, don't have a time marker that was 70. Oh.

A

Right right: well, isn't it where's? Am I calling this before yes anymore,.

B

A

Okay, let's pause.

B

A

Don't think we really need to I.

A

Don't know where the debugger thing went. Oh well, oh.

D

I can't see your server not sure oh yeah,.

A

Yeah, hey, let me do it, let's see, how did I do this last time.

A

A

I'm gonna do this last time, I remember doing it on.

D

The live share, server.

A

Got it localhost, 3000 I, don't know why it won't do it unless I put that in and then it changes it.

A

Okay, that pop-up okay can I drink it. I'm still don't have a time marker when I'm at right here.

A

And my debugger is not working. Oh.

D

Because this time, markers on the fire, are you default in time worker Oh time workers not even declared up here? Oh.

A

Right right right so just like counter I need to yeah.

D

Time with marker.

A

And it's initially gonna be on well, no, no I can just set it to this I guess and then once well start needs to do the same thing. These can both start out at undefined I'm gonna. Do that just to be explicit, knowing that initially nothing is happening, you have to call start for those to actually be initialized.

A

Then we set the interval. Okay, let me get the debugger out of there.

A

Okay, we're still at time marker good time has not defined. Oh.

D

Well, because of this isn't.

A

D

That time outside said.

B

A

Still don't know why? Because.

D

You're doing the set interval and you're passing just the method right here. Yeah, let's see what just the same look we do. This is an arrow function. Oh.

A

I see okay, yeah.

A

Okay, that's the counter! That's because I'm, not using this I, think.

A

It's counter I'm, probably this time marker here, it's okay, Oh.

D

Mess sign this counter. There.

A

It goes hey, that's fast! That's too fast! That's weird! Yeah I expected it to be once a second yep.

D

A

I I might have.

D

And may not be picking up this quickly, I.

A

Might have messed.

D

A

With it, I might have assumed it was gonna, be something different.

D

Okay, so this should be props up the gauntlets.

A

There we go all right, yes,.

B

You get it yeah, yeah.

A

That's what we need. That's exactly what we need, so it started off May 31st and it's moving forward an hour, a step. So this should this would go a long time before it goes into the future.

A

That's exactly what we want! Okay, perfect! So that's I'm, gonna, I'm, gonna, look through this I'm gonna clean up and commit and see- and at least we'll have a step. It sounds yep you have to bang sounds to list the sounds and then sound space, sound name. You probably want one for a cow. Don't you that's yeah I!

A

B

D

A

I, don't know where the cow came from.

A

But this sound was I, can I should definitely have the cheer I'll. Let you guys I'll add some more sounds later, but here's all of them are there. Thank sounds so, let's in the right place, guys while I'm, while I'm code reviewing you guys, can look outside.

A

Let's see what we have here.

A

In the header, I added a special cooler tab and the helpers I added this and then didn't use it I'm gonna, remove it and with scalar data is entirely new and I can get rid of all of this stuff.

A

A

This is a wrap.

A

This is a wrapper. Stens react component data value to new date and.

A

Make this undefined initially just like we did in the previous one, or so it's obvious that it's no data! Initially you go! You put in an interval handle.

A

Where else is the interval handle? Oh you've got a stop. Okay, cool wait, a minute. You called it interval here there you go great, so we have start and stop. Let's do let's test this, stop! Let's do this set timer this! Oh my gosh, you see that autocomplete those awful.

A

Let's set it to stop updating in three seconds, see if that works. What.

D

Is that set timer.

A

Oh, it's that time that work. It's that timeout sorry I.

A

Spelled it wrong set Tim out, Tim gets a timeout.

C

A

Right, it's that updated a few times, but it didn't stop you that's.

D

Because you called start again, did you want to stop? Yes,.

A

Yeah, that's why it started going faster and faster and faster, because now there's a bunch of them. Okay, initial data should update twice, maybe three times: okay, it sounds great cool.

D

A

Awesome all right so we're starting the data. I'm gonna continue with our review here. Interval Hanna, so we're using the counter time marker and an interval handle to keep track of the data initializing the loop all of this stuff. Could this could be a constant.

D

And I made every time you click start it just resets. I, don't know if you want that. Yet every.

A

Time, I click started it resets, yeah.

D

That's ok. That's.

A

Fine for now it'll it'll, be obvious. I mean we'll end up pausing it at some point, but for now I don't mind. I just want to make progress and as we get further along and we get some of these more complex diagrams, we'll come back and and mess with some of this to add new features. But I don't want to over engineer anything at the moment.

D

A

Is constant is that all gonna work out yeah data step is constant.

A

The value is not counters, not the min is constant. Max is constant again. These are things that maybe I'll parameter ties parameterize in the future, but for now doesn't matter. Jitter is constant.

A

A

It's not yeah, and this is something that I could change. This is where I could add more patterns. So this is the pattern that that I'm, adding I'm saying if it's the, if we're, if we're in the three period, then then we're going to add more value to it. So that's when you look at this thing, that's why every third one there's a dip and so there's a group of three something like that: I added that arbitrarily, but we can do stuff like that here, using this periods keeping track of years.

A

So this all looks good to me. Stop is a clear interval for the handle. This is perfect.

A

Okay, okay, great- and this is also great we're going to.

B

A

That now that I see how this is used, I want to call this start data, because in this context I don't know it start means. So so let's go back here and instead of.

A

Start all its start, data.

A

Anywhere else, actually, no, that's. That's fine! We'll keep this start whoa a little over. How did I get here.

A

Okay, we'll leave that start. What I want to name is this start data and stop data right? That makes sense, because.

B

That that's just the interface.

A

I'm, exposing two components that are using it I could keep using start and stop here. So here, I'll use, start data layout and all we're doing is dumping the data to the screen. Let's make sure that I didn't break anything everything looks still looks good, let's commit this so hold on hold on. Let me go look at my what we're working on we're working on this scalar stream thing temporal data, let's go to this issue, I think I should be able to say fixes number 26 and my commit message and will automatically close.

A

This fix particle.

C

A

A

Automatic spatial data generator react.

A

Let's get it done.

D

uh Neck that closes it when it's merged. Yes,.

A

So I'm gonna commit it and I'll push it to it'll close it if it gets pushed upstream or if it gets put in the PR. Let's put it in a PR. Let's do that. Let's do the right thing.

A

Building a few systems, I could say: git push, origin data stream.

A

Upstream ization community origin is I. Think, oh, that's, right, get push origin master data stream, okay! So now I have a remote branch called data stream with what's on my local master right here and I should be able to create a floor quest pretty easily yeah yeah. This is the stuff, create a pull request so and see if you've got your changes in here.

A

That added you, because of the co-author thing, that's cool files changed. So if we once we merge this, which I will I'm not paying attention to the travesty I think we don't have any tests anyway, once we merge, this I should be able to see. This is closed. Awesome all right. So now we look at our projects. We got some stuff done because that was we needed. We needed this whoops to close off some Mikoto diagrams we're going to need this spatial, this random data thing for the combined encoder diagram, which is here all right.

A

So, let's back to spatial pooling the next one, is create the combined coding one. So this is sort of the big deal, the the hard one we're going to do, see three GS and we're going to create a command encoding.

A

Essentially that has that takes that data point and turn and encodes it into this space in different ways. So that's the that's! What we're gonna work on now and I'm gonna take a quick break before we do that, but that's next, and so that's all merged get full upstream master. I should get sync yep and I even got what did I get some stuff I did earlier.

A

The automatic spatial data generator- oh yeah, I added a diagram warning. That's just for down here. This diagram is horribly broken, so I just made a note that the diagram is broken. You can see why it's broken right there, but I'm not gonna fix that right. Now, okay, guys, let's go we're gonna work on this one.

A

Now close this close, this I've already got it open a quick break, I'm going to take a walk around the building, just to get the blood flowing a little bit thanks for watching I'll be right back play with the sounds, while I'm out feel free.

B

A

Super fun, I, don't do the no one. It's it's a note. It's awful.

B

C

Sorry, Dave I'm afraid I can't do that.

C

This conversation can serve no purpose anymore. Goodbye.

A

We know here's your Hyundai's and you figure them and use the change, but they ask you to change, but they downstairs for lunch.

A

A

Done a good thing.

A

Falco saw an interesting lecture by Professor Nancy kanwisher I have never heard of her before you'll have to post a link or something on discord, or here or wherever and I'll try and take a look.

A

So oh yeah yeah. Let me show you.

A

You know I'm not actively looking for neuroscientists to interview now you wrote a forum post about it. Maybe I missed it. I'm not looking for a neuroscientist at the moment to interview its that was a I would do it if Lisa Feldman Barrett agreed to join, but to do it but um I'm not actively pursuing it. Alright, so we did the auto-generated data or not we're not gonna. Do this diagram right now, I've got a ticket for that later. That's the display diagram. We're not gonna. Do that.

A

So now we need to do this combined encoding diagram. So what we'll need to do for this? Since we have we've got like it's gonna be drawing mojo on here, we've got. What do we have? We've got a a data point and then- and it has a scalar value and a time so we need to the scalar value- will double use in. We have to encode all this stuff, so we have to encode the scalar value and then we have to encode the time and decide what exactly we're going to encode. Well, I wanted code.

A

Let's see what I usually like to code and for this will be a day a week weekend day a month an hour of day, so that will be.

A

So this is also code day week weekend our month, our.

D

A

Basically day Oh week weekend, our Oh a month our Oh day, I think it was, was it our of month, day of month, sorry I, don't know why I was eating our day a month and our of day, so that so this time encoding is going to is going to essentially encompass I'm gonna highlight time encoding. This is all the time encoding and this and the scaler encoding is going to be this bit up here, so they each get their own section and the time encoder is going to be broken up.

A

You know this there's one section is for this part of it. This section is for another part of it. This section is for that party cetera so dave week weekend, Dave month our day, and then this is going to show them all together. That's the plan, so first we need to draw well first, we need to encode. First thing we need to do is do all this encoding and this is going to turn into bit arrays.

A

So we'll have them we'll have an array here of encoding, 0, 0, 0, 1, 0, 0, 0 or whatever, and we're gonna have one per day of week and one for weekend and one for day a month and one for hour of day, so we're gonna have all these and coatings. When we're done with this they're all going to be coming out here, we also need to combine them into essentially just one large encoding.

A

That is all of them at once. Okay, and so we're going to use this I want to use the same data source. So the easiest way to do this I think is to essentially take all of this all of these in codings at once that we get here and put them all into one array, but instead of having you know, an array of 0 1, 0 0 0. Instead of that, we'll have an array and we'll have a data object and we'll just tell okay. Is it on? Let's just give it a color.

A

All it really needs is a is a color, so whether so we're gonna recreate this data array. Every time someone interacts with the diagram or I can I move, okay or or the data update. So if the data updates, we have to do the encoding step to get all of these together and then turn it into something that provides a color I mean it could be simple.

A

I mean it could be like a hex, color, comma, another hex color, whatever whatever we could just turn them into colors a different color for day a week versus weekend versus day a month. So let's try that so before we do any components before we create any any reacts or like any displays any d3 stuff at all.

A

We should really just be talking about how we take that scalar data point and encode it into an array of something that we can display, because in the end, all this display needs is an array of values and we can write the d3 to to render it properly all right. So there's our plan, we're gonna push through on this until my kids get hungry.

A

Mom will be here in like an hour, so I'm getting hungry, yeah.

A

I'm, not the kid I'm, not the kid all right.

A

Rocco's getting hungry too.

A

You're not gonna, be hungry for a few more hours.

A

Okay, all right, so, let's write a component. We want to combine them coding, so we do need a space for this, so we want. We definitely want to create a racked, a react component for this, and it's gonna be a diagram, even though initially we're not gonna render anything so we'll create a new diagram in here. I want to move this helpers out eventually, but for right now, I'm gonna leave it so we're gonna call this a combined encoding, I I'm hesitate.

A

I almost want to call it input space, but but I think this illustration is more about illustrating the combined nature of encoding. Several things into one space.

A

Falco says: why did you code, the spatial polar I have not coded the spatial polar, yet all I'm doing is making making space to show spatial pooling visualizations. So if not I'm gonna I'm, not gonna, write the spatial cooler until I have to and I will have to as soon as we get like. This doesn't need so we're all the way up here. This is where we are next is going to be potential pools. I still, don't need to write a spatial way for this. Next is going to be receptive fields.

A

I still, don't need to write a special polar for this initial permanence is: don't need to write a spatial polar I, don't need to write a spatial polar until we get to inhibition until we get to the mini column. Competition and, as you can see, right here, must run a spatial polar to get this mini column chart.

A

That is where we are going to need to write the code of the spatial pooling algorithm, but for right now we don't need to, or just we're just talking about concepts of spatial pooling we're talking about setting up the input space. So that, then, we can define what potential pools are and we'll use these concepts when we build a spatial Buhler, but we don't necessarily have to do any of these spatial pooling computations at this point until we get to the mini columns on competition.

A

Okay, so I'm gonna leave this here because I like seeing it so imagining I had what exactly what I wanted I would that this was what I wanted to combined encoding.

A

I'm gonna go, look at I always have to look at something else. So I know the right way, yeah something like this spatial pooling.

A

This is going to be combined and coding components yeah from the DOE diagrams, and then we will add mine and coding. Here won't be anything in it and I, don't even know that we will Oh. All we need to send. It is data data. Is this? Stop prop stop data. This is brilliant. I love this this that I can do. This makes me feel better about using react.

A

That makes you feel good, dude shouldn't it be combined, encoder, No, so I'm so I'm trying to well that's not the way I'm I'm, making the diagrams very specific to the concept which I'm trying to illustrate not the things that I'm doing so. What I'm trying to illustrate here, of course, that's broken, but what I'm trying to illustrate is illustrate is is how you combine in coatings into the same input space into an input space. There's not there's nothing called a combined encoder that doesn't exist.

A

There is something a new pic called a multi encoder, but that's not really what I'm trying to show here I'm just trying to show the concept of combined encoding so I'm going to call it combined encoder all right.

A

Now I need to write the thing. I need to do the thing so I'm gonna steal his stub.

A

A

The closest thing: let's, let's steal this scalar, which diagram don't want to steal, simple scalar, discrete encoding.

A

Cyclic encoding, it doesn't matter, do.

D

You need d3 put it.

A

Yes, definitely.

B

A

D3 is is what is going to draw all the things here.

A

But first I'm not gonna. Do it yeah first I'm just going to right do the encoding zand just you know, make sure that my data is set up and then d3 is data driven and I'll just have an array that gets so every time the data gets updated here and my combined encoder I'll I'll process it I'm gonna use this.

A

Find encoding I will need an ID. I won't need a value. I'll just have data and I, don't know what that is. Can I you say, object. It's gonna be on the wrong way. Just leave that.

A

No I'm, not gonna, worry about the style. I will need. The encoder probably will need this eventually.

A

But I'm gonna take everything out. I'm gonna, take everything out for now. I know I'll need that.

A

Yeah I'm gonna take everything out for now and we're just going to worry about.

A

I need that I might need this. I definitely will need this eventually and I will need an update as well. I shouldn't have removed that there we go I'm removing too much but I'm. Just trying to set up the structure of what component did update component did mount anytime. Params change, so params are gonna change, oh yeah, the params.

A

This will change whenever the data changes right. Yeah component did update, and this is on the mountain. This should be good orient d3, I'm going to put off, but that's probably very simple, but very similar to what will actually have reset encoder I'm, gonna, I'm, gonna I know there won't be a number line. Value marker or those are specific. Output cells are specific.

D

So is this like a read-only view of the total combined encoding.

A

Yeah they come that's well. The combined encoding. Excuse me tell me: if I do you think sums wrong? The only thing that yeah, it's totally read-only, the only thing that will it will respond to is, if somebody clicks this thing and it will just change to black and white. So it's not going to change any data. It's just going to get updated. Whatever the data stream changes. These will. This will update and it will render it.

C

A

Black and white, depending on that toggle.

D

Yeah I would submit out that's just a really super simple react component I. Don't know why you need.

A

You don't know why I need what III, because d3 is how I'm going to draw all of these rectangles boxes. The colors, oh.

D

Okay, I thought you're just gonna just like gives oh no.

A

No I'm gonna use Rex I'm, gonna use SVG, okay,.

C

A

Yeah, although all this stuff and everything beyond this is all SVG all d3 renderings.

A

But I'm not doing it yet I'm, just I'm just can't I, don't know what I'm doing right now. um I just want to get get the data update. Do the encoding and get a data array that contains the information that I'm going to use d3 to render you know what I mean, so we will probably have this render output cells that has the same type of deal going on and probably the treat cells thing too, although this is very I'm gonna leave, render outfit cells for the moment.

A

But I'm not going to call it.

A

I'm gonna just come.

A

A

For our render, this again will be, it will be an SVG. This is probably all relevant style. There's not going to be an on mouse move. There's not gonna, be a hover on this one.

A

It's not going to be a number line or value marker, there's only going to be output cells for now.

A

Okay, yeah get rid of this.

A

This is gonna, be encoders. You know, I'm, not even sure, if I'm going to use this so I'm just gonna, just gonna get rid of it. This might be different.

A

The Orient is the Orient I think I'm going to use, because I need to use that to set up d3 scaling, and this one is gonna happen anytime. Our data updates.

A

So this is our mount, so we should call essentially we're gonna call this dot update anytime. The data updates.

A

Okay, so I just want to ensure that.

A

This dot drops data is updating in this component. It's.

D

A

Rendering any qualities rendering something, but it's not doing anything. So let me see if I have everything it's getting data. It's, let's see if it works. Debug Styles not defined. That's okay. I can fix that.

A

I, don't really need a debug style.

A

Okay, so I should see a console log of the value yeah, so I'm getting the updated value. It's good now I need to translate it or do do the encoding bit all right, so I need to create some encoders, the scalar ones. Pretty easy, I'm gonna see how I did this and I.

A

So I have this already in the diagram that I've already done about the encoding anyway. So let me see how I wrote the encoder and the old source.

A

There it was streaming scaler window, coder code, scaler, encoding, okay. So how did I get that coder.

A

Bounded scaler, encoder, okay, so I'm gonna have a scaler, encoder and I'm gonna have four different cyclic encoders that represent time.

A

Does that make sense to you guys why I would do that because time encoders are essentially just periodic encoders that loop over a time period, so we're gonna create one scalar encoder for the purple here and and then this is going to be a cyclic encoder for day week, a cyclic encoder for weekend, so we're not introducing any new concepts if you've followed along and you understand what cyclic encoders are and why we why we use them I'm, pretty sure there was a there should be a cyclic encoder in here.

A

Oh there's, not I, never got around to it. I, don't think I did that. Yet I did some in the time encoding. Here's here's the cyclic time encoding right so so, basically, here are the encoder parameters that I'm gonna end up using for these and codings one one for day, a month weekend, day of week and time of day, I will the same cyclic encoder I just send different parameters into those.

A

I'm not going to display the encoders we're just going to use them, so I think this is going to be useful. This time, encoder names and the coder parameters I'm going to steal that, because that's pretty much exactly what I want so in the combined encoding. Let's just set that here for now, knowing these are our time, encoder params, the labels that we'll use for them and actually colors are in here too so that'll be useful.

A

The other thing is the scaler encoder, which.

A

Which was the this bounded scaler encoder, which was essentially just given a min and Max just needed min and Max of W and N, and that's it so we're gonna want about its scaler encoder and then that's cyclic, Cir coders. So that's going to be in a way that anymore.

A

Cyclic encoder and a bounded stealer encoder we're pulling those both from simple HTM, which exists already. That code is already there. Hey David, just left for a bit.

C

This conversation can serve no purpose anymore. Goodbye I.

A

Knew there was a goodbye, I didn't remember what it was okay, so so on update. We know we have updated data, so we want to essentially do what we're doing encode the data. We were calling this reset decoder, but let's say let's call this and code and we don't.

D

A

To send anything to it, because it's gonna have this props data, so I'm gonna change this render or I already removed it there's. So we're just going to call this in code and.

A

This is going to take that data, which is this not props, idea.

A

The value is going to be this prop data down value. The time is going to be this stuff, props, updated on time.

A

Okay and the the value encoding, so one thing I want to do is create the encoders, so the scalar encoder.

A

Bounded scalar encoder, and this is going to be I.

A

Don't know what I should end in W I, don't know w11 and.

A

50 min is 0.

A

Max is it was pretty low, let's just say one justice just to see okay. So now so we've got our scaler encoder. So when we encode this, we should be able to.

D

A

Hello, soy hydrated bot thanks for joining. How do you keep hydrated with soy? That's you, toys, I! Guess, soy milk, I.

B

A

Think that person is even actually watching right now, they're, just like straight for the page and hit follow okay, so scaler encoder encode the value, and then this is gonna, be our value encoding and, let's see if that worked value encoding, let's see if we can see a value encoding along with that no exploded. Scaler encoder is not defined because I have to say this.

A

I've been live for just over 69 hours, but somebody this soy, hydrated bot, just told me, I've, been live for 69 hours. By this point my broadcast I should have consumed at least four hundred and twenty ounces of soy to maintain optimum gynecomastia.

A

B

A

Know it's a bot, it's a kind of bot, yeah I, don't know why they think that I've been online for 69 hours. Ok, this dot, scaler encoder! Let's see if this works all right. It's working! You see that the encoder is working. It's great, it's great, so I'm gonna stop logging. The prop, so you can just see, see how the encoding is different. It's moving it's moving along that scalar values, movement, ok, good.

C

A

Got one thing encoded, so we have this value encoding.

A

Now we need to encode, we need to use.

D

A

Other encoders, so let's see we need a time of day. Let's do day of month,.

A

Day of month and coder those new cyclic coder- oh you know what hold on before I. Do that before I? Do that I know that broke everything I have.

D

A feeling that.

A

I already have a time encoder.

A

And simple HTM I that sounds like something I might have done. Okay, so I've got a weakened encoder already.

A

Alright, so I could use that for the weekend and I have a day of week. Category so I have a day of week. Encoder and you create it. Oh you don't create with anything. You should. Oh yeah, you create it with a W, so I can use the day of week. Category encoder. This is great. Okay, so I'm gonna use the Oh okay, so yeah I got a phone call.

A

It's spam. It's a spammer! You can tell from the area codes.

A

So, okay, so the day of week, encoder! Let's do that first, since that seems pretty simple: they have week.

A

Your result, that's! Okay! No! Don't please don't ask sorry. Hydrated bought anything I.

A

Appreciate you coming in here and suggesting I drink more soy, I'm gonna, stick with water.

B

A

Son thinks you're hilarious.

A

He's just try these doing a public service.

A

Okay, so I'm not gonna. Do this stay a month thing I'm going to do.

A

What was it day of week, yeah Dave week, encoder, so we'll do that? First, it's already have one for it day of week.

A

And coder equals new and I think this is simple, because I can just pass it. Oh I can't just pass it. uh I thought I could pass at a time like a time value and it would but I don't think it. Well, that's! Okay! It's easy to get the day of week from a time we'll figure that out new.

C

A

Of week, category encoder and I'm gonna have wb11 again, so that just means that's how wide that's, how big the bucket range it's gonna, be for a day of week and it's a category encoder. So that means total. It's gonna have 77 bits for seven days, so one for each day. We could make this smaller.

D

A

You wanted to generally, you want to keep it odd. I forget why, but it has to do if I think I can't remember so. Okay, so let's try and do the day of week, encoding first, so we're encoding.

A

We have the time value here, which should be a date time and now I have to remember JavaScript get day of week from date. Is it just get day if it's get day, that's excellent, so I can just say.

A

Const day of week, encoding equals this dot day of week. Encoder got code time dot get day. Let's see how that works week, coding so we're just gonna consult log. It and.

A

Let's see what happens there.

A

Dave week, header encoder is not a constructor I really.

A

Should be maybe I'm importing it wrong.

A

Maybe it's being exported damn food category encoder.

A

This should all be there. Let's see, how am I exporting my export here in the index? Oh I, don't I'm not exporting it from simple Jas or from simple HTM I. Don't have the day of week encoder here or do I weekend at corners, so I'm gonna have to release a new version. I think I'm gonna have to release a new version because I've got a day of week, category encoder and I: don't have it I'm, not exporting it anywhere. This is an easy fix.

A

It's just sort of frustrating coders weekend coders that weekend day of week, category okay, alright, so I gotta jump over to simple Jas, real quick, which is which shouldn't be hard just bear with me here, simple, simple, HTM excuse me subways gym.

A

And I'm gonna have to release something so first of all, I need to update the index and we need to call this.

A

Yeah Dave week, category and color require SRC and coders.

A

Let's get the thing right, what did I call it? Sfc encoders Dave week, category David category.

A

You just go to package a Sun and a pump version.

A

A

So that's all we're doing is just for exposing another thing. Npm test. Okay, so did break anything.

A

um We get at index package.

A

Hey I'm, not building a singularity singularity is building me I'll. Tell you what here's, what I think about singularity.

C

It's in your nature to destroy yourselves yeah.

B

Agent Greg.

A

A

Added weekend hurt now was it weekday. It was weekday category encoder right yeah day a week, Dave week, category encoder day of week, encoder to exports, Sarah dot.

A

What did I just update it? 2:01.

A

A

Zero one two.

A

Okay and PM publish.

A

This should publish the new team package for simple HTM and then I'm gonna have to go into my package here and date this so that I get it.

B

A

Mpm install should update simple HTM to zero one two.

A

A

Got it did I get it yeah updated one package so now, I'm pretty sure I'm gonna have to run dev again what happened when I break? Oh I'm, already I'm already running it right run here.

A

Okay, okay, so ideas marked as required and combined incoming yeah I'm, not giving it an ID I can give it an ID though, and in fact it will need an ID at some point. So let's just give it an ID combined and coding because it will be a Dom element.

A

So this should work. Let's see no get day of undefined, so time is not defined times not to fine, okay. Okay, that's! This is probably something simple. So, let's just let's just see, let's, let's put a debugger right here and look into this data. Oh oh! This is the first data point and it doesn't have anything in it. So.

A

This is coming so actually on unmount I'm not going to update ya.

C

A

That'll fix it.

A

Hi David, okay, there we go. Oh look at that. That's weird something weirds going on for sure something weirds going on so that day a week. Encoding is odd.

A

A

That's, that's not right. Okay, let's.

D

A

Into this, that's weird.

A

Okay, oh I, see good-day, gives me the integer value of the day. Not the I'm. Actually I need the string get de name.

A

I really got to do this. I think I've done this like a million times before so I do have to do it like putting all the day names in a string. I've done this before I. Remember doing this at some point. Unless harmony has introduced some way of the date to get the I think you can get this from the date object somehow, but an easy, easy fix is just simply saying what did I call this days.

A

And that's the index of it and now that should work I hope.

A

At least it works no yeah yeah there we go that's better. So the day is not gonna change until about it goes to the goes through a whole 24-hour cycle. So I want to see it change so how I'm gonna see a change is, and the combined encoding.

A

Did we not give it like a an update rate right? We gave it an update rate date.

A

We're not here not not in the combined encoding. It was in the you know, I know, I know, I know bear with.

B

Me I know it does.

A

B

A professional.

A

Romy's, my kids make fun of me all the time. Stop here: okay, let's, let's make it a hundred milliseconds, okay, boo, boo, boo, boo, boo, boo, boo, boo watch that encoding change every 24 yeah next day next day next day boom, it's working alright! So we've got one aspect of time and coded and we can pretty easily change this.

A

No, no false alarm. We can pretty easily change this if we want to.

A

I mean I can change the encoder parameters here. If we want to see this would be a really big array. We could do this and all of a sudden, it's ten times bigger or a hundred times bigger, and now it's 6,800 bits.

A

We don't need that nine bits is just fine, so that's nine bits being used for each day bucket, so that means 90 total. If I made this one, it would simply be a seven bit array and it's just moving to the next bit every day, moves to the next bit to the next bit see. So it's super easy to do this type of time encoding using the periodic or cyclic and scalar encoder, which is essentially what we're doing here, like I said.

A

If I make it too it'll be twice as long and they'll eat, it'll be two bits per day: value.

A

All right, so that is good I'll leave this at I. Don't know nine I mean it depend and the way you do this is you want to weight it like how how heavy do you want your scalar value to be weighted versus your time and I will put I'll, put the scalar value at a higher weight for now than the time and we'll make this like seven for day a week, so yeah the generate, the the data isn't pre-generated. It's just generated on the fly. The function, that's generating the data.

A

Is this next semi random sine wave data point. That's what's generating all this data, you just it just starts and a year ago, and just pushes forward and I just call it over and over. So it's it's the same code, that's generating this here, so that this is essentially the wave that you're seeing pushed forward.

A

How are you, how will you show the change of Sloat else, just slow it down right.

A

I'll, slow it down or speed it up, so we'll have control over how quickly this data generates. The update rate right now is something that we can pass into that we're currently passing into this wrapped component thing as I. Do this with scalar data.

A

B

Pull here, here's.

A

The update rate so.

A

The tricky thing is, I think David's gone, but he might know how better how to do this. It would.

D

Be nice to be able over here, yeah.

A

It would be nice to be able to update this update rate on the fly like through an interface or programmatically. That's would that be hard. No.

D

Instead of doing an interval, you would just call set timeout and call itself, and then you would set the timeout interval amount to whatever the profit is. Okay,.

A

D

You're passing it in not as a prop really, but as it like a higher order component yeah.

A

That makes sense, so we can do that on another day for now I'm happy with for at, but we'll get to the point where we will want to slow it down or speed it up and we'll figure that out when we get to it. So I still need to have more encoders I have.

D

A question via LED string that you're showing where says like, where has like the sine wave this you the mark on there, are you so it it gives the impression that you have ADA in the future that yours that you're streaming across that's just like a d3 showing where the value is like in the past. You.

B

Know it's like.

D

To the right of that diagram, it's like is that being the generated data or is just three generated.

A

Okay, so it's a little tricky, it's I'm calling a function and because of the way I'm it's it's pre-generated, pre-generated it up to a window in the future and and then every time it Scrolls I generate the next point. The next point, the next point, this.

B

Is just an arbitrary cursor.

A

Through that window of data, so.

D

So I just call.

A

It a bunch of times enough to fill up the window and then, as time, progresses I'll just keep filling from the front as it goes so we'll do something like this eventually, but for right now all I want is the the data generation bit.

A

It's a lot of science today, nothing interesting to look at there. It's just like boring stuff out there right now. Boy I need a better camera. It's a super blurry.

A

A

Anyway, because I'm so easily distracted yeah there was one cop car earlier. Did you see that that was weird like one of them popped all the way down? Alright, okay! So let's sum onto onto more encoders.

A

Something, oh, that was me okay, so on to more encoders, we've got Dave, weak encoder so and.

A

We have a color for it too,.

A

So I've got a value, encoding and I've got a date. Weak encoding.

A

A

Day of month, so how was I doing Dave month, I think I think all I did.

A

The right way to do this would be to find the day of the month and find out how many days were in the day of the month and then and then I code. That I think the cheap way is to simply assume there are 31 days in every month. So I'm gonna do that easy and simple right now.

A

So this would be if we want to do day a month, there's 31 values and is 31. W is 5 sure, so we're gonna create a cyclic encoder for day of month. There's nothing particularly about this. We look at the simple HTML, coders I. Don't think I have one for day of month, but I might have a test that does day of month. I know I just have weekend to us. The other cyclic tests I might have set up some tests that worked on days.

A

Days of week, I did.

A

Need bit ranch per day with many bits. This was just testing yeah, okay, so I know, but basically I create a cyclic encoder because and just set it the right way. So that's what I'm gonna do I'm gonna create a cyclic encoder and we're gonna call it day of month, day of month, encoder new cyclic encoder, all right, the n is going to be less first of all, let's just make it 31 for now, because I want to see it work.

A

The excuse me, that's that's not the W! That's the N, 31 I know there's not always 31 days in a month, but the W will just make one.

A

Actually, with the cyclic and quarter, all you give it as W right now, I forgotten.

A

Now, I've totally forgotten how to do it.

A

Now you give it this, give it NW yeah.

B

That's fine, it just want it. Just supplies.

A

The bit max the bit map differently: okay, so we'll have let's, let's make 11 bits on and is I don't know, let's make this last. Let's make this like five bits on over a window of 20 bits. Why is it W of the day of week 7 it could be anything I'll make it 11. If you want it, just how big do you want the buckets? How big? How heavily do you want day of week weighted? That's the question really.

A

Min is 1 max is 31 I think, that's all that we need for day of week, encoder.

A

So, let's try this day of month. Excuse me day of month, encoder so constant day of month and coding equals this dot day of month, encoder dot, encode time get date. I think it is, is it date I forget how to do it? I always.

D

A

This JavaScript get day of month, I think it's just date and good date. That should be right. So, let's take a look see for encoding. What's reasonable.

A

Okay, so this is encoding the 31st and it looks like it's it's wrapped around, which is what we would expect it to be for the 31st when it wraps around to the first okay. Let me turn: let me turn the interval back down to like 100 milliseconds, so we can see this really speedy. This the next day should pop to the next bit yeah.

B

A

It's sliding along there we've gone to the second, the third and there's no change. You know this is how the this is, how scalar encoding works. It's it's just like a sliding window that moves along at a rate as as we go forward. If you don't know, I'm talking about I'm, looking at these bits right here and how they move forward, did you see that that just move forward again, every time we move ahead and time enough I'm going to move so I can change this too.

A

If I want to change the way, this is encoding, I could say say: okay, I want it to be bigger, so let's make it 15 bits out of 20, and now it's gonna be take a bunch more space, but it's still uncoding the day of the week day of the month. They have the month not the week. So it depends on how how you want to do this. I'm, not gonna, wait the day of the month that heavily I guess I'll, make it know and I don't know just depends whatever you want to do.

A

The min and the max, though, is specific for Dave lots of us. Okay, so I've got two elements of time: encoded right now.

A

Next is weekend and I have a specific, a specific encoder I believe the the weekend, encoder and simple HDMI.

A

It was here, I think it's just weekend, encoder weekend yeah and all that once is a w and it's gonna say weekend or weekday.

A

So we need to send it weekend or weekday, no I, don't think we do all. We have to set it as a date and it will decide okay so weekend encoder. This should be easy. This should be super easy. So if cycle encoder Dave week, encoder bounded scaler encoder. Let's put it here weekend. Decoder, let's put this at the beginning, honestly, because that's the scaler.

A

Cyclic encoder Dave. We can code a weekend decoder, okay, so the weekend encoder hooked down here weekend, encoder equals new weekend.

A

Weekend, decoder, I, don't think we need to send it anything well-known. What's headed to W, we want it to be 11 bits wide same okay, so same as everything else. Const weekend and coding equals this weekend, encoder dot encode, and then we just send it at the time because it will extract what needs to for the time it would be nice if we updated not a little salute with that so weekend encoding.

A

Let's make sure that that looks like what it should look like alright, so at some point we're in a weekday right now at some point when we moved seven there, we go now we're in a weekend and it won't stay here very long. Now, it's in a week we're in a weekday I know: let's just stay there for five days, go back to a weekend for two days still in the weekday still in the weekday weekend, one day two days and then back to the weekday.

A

Ok, so it's working Dave is telling me that I can yeah I can do that. Ok, I'll! Do that I always forget about this type of stuff.

A

I didn't know you could do that type of deconstruction, so this will actually give me time and value inside of an object. That's interesting, I had no idea. You do that. Thank you, David all right, three things encoded next is we did day of month we did weekend. I was only.

D

Four there's.

A

Only four time and cook, so the only thing we need right now is time of day and the time of day encoder can also be a cyclic encoder. I'm gonna put it down here by the other one time of day, encoder those new site like encoder.

A

A

There are 24 values, so we're just going to do this hourly and.

A

So zero to 24, so we're just gonna get hour of day, so the min it's gonna, be when I say get hour of day. Is it give me a zero indexed again JavaScript get hour of day get hours. I do not trust.

A

It turns the hour for the specified date according to local time. So I assume that's gonna be yeah, so that is the hour, not a zero indexed hour, so the min is gonna, be.

A

One and the max will be 24, I, think, okay and the W is my choosing and the N is also my choosing time of day encoder.

A

Okay, let's see if this works, so we're gonna have we're gonna, send it get ours right here, time of day, it's actually hour of day, it doesn't really matter our. Let's call it our update, but they're being pretty explicit. This dot I call this time of day, encoder denied I'll change it the code time dot, get hours a day, encoder. Let's change that to hour of day encoder, and let's just see this and make sure that it makes sense. There.

B

A

Go so I do have an off by one problem here, so perhaps this isn't quite right and I should let's see what I want to do get ours. This will tell me the problem. Console.Log I'm, pretty sure it's the get ours is returning.

A

Something out of the range I was expecting yeah, so it's 0 to 23, not that's odd, but ok, I thought, that's specifically what it told me, but doesn't really matter so 0 to 23 is perfectly fine. That should fix it, and now we've got a nice cyclic rotation. You see that this is exactly what we want right down through hours of day. So now we've got all of our encoding like, like you said you wanted to do in the first place here, we've got.

B

A

Of our encoding, we I didn't mean to draw on this one.

A

We've got all of our coatings, so we've just done this bit right here. I've got all these in coatings all in different arrays, which is perfect and we're going to combine them into one encoding. That has more information than just ones and zeroes.

A

What's not, are you guys hungry? Yet let me go see where your money find out where your mom is. If she's close, you say anything about my mom talk about your mom.

A

She's she's all the way down she's still at school. So all right, it's ten to one I'm hungry, I'm gonna, go take a break. I'm gonna make these kids eat come on. Let's go we're gonna, take a break. I'm gonna go.

A

We're gonna put the BRB up here and we're gonna go, take a break. I'm gonna be right back. You can watch the loop between the the street outside and the office inside and we'll be back in a half hour or less, hopefully less it doesn't take very long to eat. Come.

B

On guys, let's.

A

B

A

Just like your opinion.