89 lines
3.5 KiB
JavaScript
89 lines
3.5 KiB
JavaScript
import RxClass from '../src/rx-class.js'
|
|
|
|
class Example extends RxClass {
|
|
constructor(opts={}){
|
|
super(opts)
|
|
this.test = 10
|
|
this.another = { bar:'bust', foo:3}
|
|
}
|
|
}
|
|
|
|
const example = new Example({
|
|
_rx_ : {
|
|
handler: value => {console.log('-----------default subscription handler-------', value)},
|
|
amendValue: val => val + 3
|
|
}
|
|
})
|
|
|
|
console.log('instance before doing rx on properties\n')
|
|
console.log(example)
|
|
console.log('--------------------------')
|
|
|
|
example.on('changed', prop => console.log('emitted----a property changed-----',prop))
|
|
example.on('test', (val) => console.log('emitted value of test',val))
|
|
console.log('making \'test\' reactive with default amend of add 3')
|
|
example.rxAdd('test')
|
|
example.rxSubscribe('test','early',(prop)=>console.log('>>>>>>before test changed subscription - grabs initial value',prop))
|
|
console.log('changing test to 20, 30 directly')
|
|
example.rxUnsubscribe('test','early')
|
|
example.test = 20
|
|
example.rxAmendValue() // removes global amend
|
|
example.test = 30
|
|
example.rxSubscribe('test','late',(prop)=>console.log('#############late subscription to \'test\' after 30 ############',prop))
|
|
console.log('amending emitted value with path',example.rxAmendValue('test','path'))
|
|
console.log('changing test to 40 via set')
|
|
example.set('test',40)
|
|
console.log(
|
|
'amending emitted value custom function',
|
|
example.rxAmendValue('test',val => { return { value:val+5, msg:'additional 5 was added to set value'}})
|
|
)
|
|
example.set('test',50)
|
|
|
|
console.log('removing amend function ',example.rxAmendValue('test',null))
|
|
example.set('test',60)
|
|
console.log('making a deeper property \'another.foo\' reactive')
|
|
console.log('changing any default amend function ',example.rxAmendValue(val=> val + ':amended'))
|
|
example.rxAdd('another.foo')
|
|
|
|
example.on('foo', (val,path) => { console.log('emitted via just \'foo\' ',val,'path is also emitted:',path)})
|
|
example.on('another.foo', (val,path) => { console.log('emitted via just \'another.foo\',',val,'path is undefined',path)})
|
|
|
|
example.another.foo = 7
|
|
|
|
console.log('direct access of another.foo',example.another.foo)
|
|
console.log('access via get of another.foo',example.get('another.foo'))
|
|
|
|
console.log('making a deeper property \'some.thing\' reactive that did not exist by setting property')
|
|
example.set('some.thing','this will be reactive')
|
|
console.log(example.$get('some'))
|
|
console.log(example.get('some'))
|
|
example.set('some.thing','still reactive')
|
|
example.some.thing='directly assigned'
|
|
console.log('--------------------------')
|
|
console.log('instance after adding rx to properties\n')
|
|
console.log(example)
|
|
console.log('--------------------------')
|
|
|
|
console.log('now removing reactivity from \'test\'')
|
|
example.rxRemove('test',{confirm:true})
|
|
console.log('\'test\' now holds unreactive value')
|
|
console.log('--------------------------')
|
|
console.log('instance after removing rx from \'test\'\n')
|
|
console.log(example)
|
|
console.log('--------------------------')
|
|
console.log('now removing reactivity from \'test\' again')
|
|
example.rxRemove('test',{confirm:true})
|
|
|
|
console.log('---------trying out raw $get and $set-----------')
|
|
example.a = {}
|
|
console.log('$set does to make reactive and returns value set\n',example.$set(example.a,'test.object',{do:'dah', bing:'bong'}))
|
|
console.log('getting directy:',example.a)
|
|
console.log('using $get with passed object:',example.$get(example.a.test,'object.do'))
|
|
console.log('deleting do prop only', example.$del(example.a,'test.object.do',true))
|
|
console.log('it\'s gone see:',example.a)
|
|
|
|
example.on('demo',(value) => {
|
|
console.log('shoud do simple emit of test>', value)
|
|
})
|
|
example.emit('demo','test')
|