choo: fix updates

This commit is contained in:
Yoshua Wuyts
2016-05-11 14:56:18 +07:00
parent 6699f412f7
commit 5f68a8bf3a
3 changed files with 31 additions and 17 deletions
+3 -3
View File
@@ -27,7 +27,7 @@ app.model('title', {
'update': (action, state) => ({ title: action.payload }) 'update': (action, state) => ({ title: action.payload })
}, },
effects: { effects: {
'update': (action, state, send) => (document.title = action.title) 'update': (action, state, send) => (document.title = action.payload)
} }
}) })
@@ -46,8 +46,8 @@ app.router((route) => [
route('/', mainView) route('/', mainView)
]) ])
const node = app.start() const tree = app.start()
document.body.appendChild(node) document.body.appendChild(tree)
``` ```
## Concepts ## Concepts
+3 -3
View File
@@ -7,7 +7,7 @@ app.model('title', {
'update': (action, state) => ({ title: action.payload }) 'update': (action, state) => ({ title: action.payload })
}, },
effects: { effects: {
'update': (action, state, send) => (document.title = action.title) 'update': (action, state, send) => (document.title = action.payload)
} }
}) })
@@ -26,5 +26,5 @@ app.router((route) => [
route('/', mainView) route('/', mainView)
]) ])
const node = app.start() const tree = app.start()
document.body.appendChild(node) document.body.appendChild(tree)
+25 -11
View File
@@ -23,8 +23,8 @@ function choo () {
return start return start
// start the application // start the application
// str|DOMNode -> DOMNode // null -> DOMNode
function start (query) { function start () {
const events = bootstrap(_models) const events = bootstrap(_models)
const send = sendAction({ const send = sendAction({
onaction: events.middleware, onaction: events.middleware,
@@ -32,14 +32,16 @@ function choo () {
state: events.state state: events.state
}) })
const node = _router(send.state().location, send.state(), send) const tree = _router(send.state().location, send.state(), send)
console.log(node) tree.setAttribute('id', 'choo-root')
document.body.appendChild(node) return tree
// update on every change // update on every change
function onchange (action, state) { function onchange (action, state) {
const el = document.querySelector('#main') const oldTree = document.querySelector('#choo-root')
yo.update(el, router(state.location, send, state)) const newTree = _router(state.location, state, send)
newTree.setAttribute('id', 'choo-root')
yo.update(oldTree, newTree)
} }
} }
@@ -109,13 +111,25 @@ function bootstrap (events) {
} }
function modifyState (action, state, send) { function modifyState (action, state, send) {
var _reducers = false
var _effects = false
var newState = null
if (reducers[action.type]) { if (reducers[action.type]) {
return reducers[action.type](action, state, send) newState = xtend(state, reducers[action.type](action, state))
} else if (effects[action.type]) { _reducers = true
}
if (effects[action.type]) {
effects[action.type](action, state, send) effects[action.type](action, state, send)
return state newState = newState || state
} else { _effects = true
}
if (!_reducers && !_effects) {
throw new Error('Could not find action ' + action.type) throw new Error('Could not find action ' + action.type)
} }
return newState
} }
} }