canjs/canjs

We CAN build the impossible! https://codepen.io/justinbmeyer/pen/yEGGoK

Gregg Roemhildt

@roemhildtg

@jeroencornelissen yup, I think that's the only way to do so.

Nico R.

@nriesco

I'm really confused when declaring observables/variables within a defineMap. I think this is probably a basic topic, but I don't know how it really works.

I've seen (so far) the following syntaxes:

export const ViewModel = DefineMap.extend({
  var1: { type: String, value: 'super' },
  var2: { type: 'string', value: 'super' },
  var3: { value: 'hello', serialize: false},
  var4: 'string',
  var5: 'any',
  var6: '*',

})

I don't really know their differences and when to use them. As for the serialize option does it mean that ViewModel.serialize() would return everything except from attributes with serialize: false option?

Thanks

Jeroen Cornelissen

@jeroencornelissen

@nriesco yes, .serialize() doesn’t return serialize: false properties. I see them as “private” properties.
var1 is incorrect and should be Type with a capital T: Type: String or Type: MyCustomMap
var5 & var6 are identical, it means that your var can be anything. If you pass an object to type: ‘*’it stays an object and isn’t converted to a DefineMap.

AntonProkofyev

@AntonProkofyev

Hi all is there any extended guide for algebra?

Kevin Phillips

@phillipskevin

@nriesco https://canjs.com/doc/can-define.types.propDefinition.html is the best place to look to learn about the differences

Nico R.

@nriesco

thanks @phillipskevin it looks like that plus https://canjs.com/doc/can-define.types.html will help me understand (also thanks @jeroencornelissen !)

Kevin Phillips

@phillipskevin

there's also https://www.youtube.com/watch?v=eXp3m-ZlL4Y if you prefer a video

Justin Meyer

@justinbmeyer

contributor meeting: https://www.youtube.com/watch?v=f9GI1V4W-L0

Justin Meyer

@justinbmeyer

actually, it will be here: https://www.youtube.com/watch?v=R4F_U_BwwWM

Frank Lemanschik

@frank-dspeed

I need a new Job i think

Viktor Busko

@Lighttree

Guys correct me if I'm wrong. I need to add items to the list, and on UI it should appear at the top of the list (currently it adds to bottom and this is expected).
I'm using real-time behavior so can.js understands when to add by itself:

save() {
        this.entity.save((entity) => {
            Entity.connection.createInstance(entity);
        });
 },

What the correct way to tell it to add to very top of the list ? custom sort function in component when my list changes ?
There is also https://canjs.com/doc/can-set.props.sort.html but not sure that my case is correct for this, because as I got this designed to understand where we need to insert item, but I know this.

Frank Lemanschik

@frank-dspeed

hmmm there was a example for that

i think todoMVC

that adds todo on top

Viktor Busko

@Lighttree

let me check

Frank Lemanschik

@frank-dspeed

but i am wondering why you tigger realtime behavier in a save function=?

shouldn't that be called from a event system?

Viktor Busko

@Lighttree

mmm...

Frank Lemanschik

@frank-dspeed

like socket.io

i mean this should get called with entity even if thats created else where and not only in your frontend or i am wrong?

or even if this is not a distributed system you should maybe tigger it from a event emitter i think

did you know that a canDefineMap is a eventEmitter?

Viktor Busko

@Lighttree

Give me a min to think about :)

Frank Lemanschik

@frank-dspeed

ya sure all no problem i understand that this is much to learn and understand :)

Viktor Busko

@Lighttree

I just based my solution on this example:

https://canjs.com/doc/can-connect/real-time/real-time.createInstance.html

as I got we have to call this createInstance right after our connection saved the instance. In my case this is not socket.io but normal ajax call based on url behavior.

or even if this is not a distributed system you should maybe trigger it from a event emitter i think
not sure that I understand the way how this should be organized.

did you know that a canDefineMap is a eventEmitter?
I know that we can call something like map.dispatch('customEvent', [data]), but not sure that I understand how this should improve the case.

Frank Lemanschik

@frank-dspeed

then i don't understand why you need to use createInstance at all

its for getting called external

Viktor Busko

@Lighttree

Mmmm this updates UI on the fly :)

so I just make save and UI updates with the new item in the list )

Frank Lemanschik

@frank-dspeed

your case looks more like return new Entity(entity)

is what you want

it sounds like you designed something wrong :)

ah UI updates

i understand the normal way for this is diffrent i think but overall when it works let it work

but in general the ui should simply update when a value changes

because defineMaps are event emitters that dispatch events

create instance is a bridge

when a creation happens outside the ViewModel of the object

for example if you write a function that polls a server for changes

it can call this to add instances from server

but its not needed if your work in your frontend only

Viktor Busko

@Lighttree

MMmmm ok I'll try to clarify the case, because I showed you just one function :)

I have 1 component that renders list of entitiy
I have another component that adds new items in this list. But this is separate component, so I have to make "something" to update the list in another component.
And real-time with createInstance do the work :) Well...not sure that this is correct way.

I had no expectations that entity adder component will update list in another component, because it knows nothing about it. It just makes POST request using connection

But maybe I'm missing something...not sure

Frank Lemanschik

@frank-dspeed

Entity Model

should have Entity.list

a instance store most time made via canDefineList

so when ever you create a Entity with some values it adds that instance to its Enitity.list i think

i think this is used in all guides look at it

Where communities thrive

People

Repo info

Activity