Comparing version 1.1.0 to 1.1.1
@@ -38,4 +38,5 @@ "use strict"; | ||
this.parent = parent; | ||
this.path = []; | ||
this.value = null; | ||
this.children = []; | ||
this.promises = []; | ||
} | ||
@@ -47,3 +48,2 @@ | ||
this.state = this.initialState; | ||
this.promises = []; | ||
} | ||
@@ -70,3 +70,3 @@ }, { | ||
var _reducePathAndValue = this.reducePathAndValue(_slots2["default"].path(path), value); | ||
var _reducePathAndValue = this.reducePathAndValue(_slots2["default"].makePath(path), value); | ||
@@ -76,2 +76,4 @@ path = _reducePathAndValue.path; | ||
this.path = path; | ||
this.value = value; | ||
log("SET %s TO %s", (0, _utils.insp)(path), (0, _utils.insp)(value)); | ||
@@ -87,13 +89,21 @@ var imValue = (0, _immutable.fromJS)(value); | ||
if ((0, _utils.isFunction)(rule)) { | ||
var val = result.getIn(path); | ||
log("RULE on path %s matched with value %s", (0, _utils.insp)(path), (0, _utils.insp)(val)); | ||
var branch = rule.call(_this.newBranch(result), (0, _utils.toJS)(val)); | ||
if ((0, _utils.isPromise)(branch)) { | ||
log("PROMISE RETURNED"); | ||
branch.bind(_this.ctx); // out of call stack | ||
} else { | ||
d("NEW BRANCH with state %s", (0, _utils.insp)(result)); | ||
result = branch.getState(); | ||
d("RESULT is %s", (0, _utils.insp)(result)); | ||
} | ||
(function () { | ||
var val = result.getIn(path); | ||
log("RULE on path %s matched with value %s", (0, _utils.insp)(path), (0, _utils.insp)(val)); | ||
var branch = rule.call(_this.newBranch(result), (0, _utils.toJS)(val)); | ||
if ((0, _utils.isPromise)(branch)) { | ||
log("PROMISE RETURNED"); | ||
branch.bind(_this.ctx); // out of call stack | ||
_this.ctx.promises.push(branch); | ||
branch.then(function () { | ||
log("PROMISE FULFILLED for SET %s", (0, _utils.insp)(path)); | ||
_this.ctx.promises.splice(_this.ctx.promises.indexOf(branch), 1); | ||
_this.ctx.commit(); | ||
}); | ||
} else { | ||
d("NEW BRANCH with state %s", (0, _utils.insp)(result)); | ||
result = branch.getState(); | ||
d("RESULT is %s", (0, _utils.insp)(result)); | ||
} | ||
})(); | ||
} | ||
@@ -144,3 +154,3 @@ if (!_immutable.Map.isMap(value)) { | ||
} | ||
path = _slots2["default"].path(path); | ||
path = _slots2["default"].makePath(path); | ||
var value = state.getIn(path); | ||
@@ -147,0 +157,0 @@ return (0, _utils.toJS)(value); |
@@ -40,2 +40,3 @@ "use strict"; | ||
this.slots = slots; | ||
this.path = []; | ||
this.branches = []; | ||
@@ -62,6 +63,7 @@ this.promises = []; | ||
this.path = path; | ||
var branch = new _branch2["default"](this.rules, this.state, this); | ||
this.branches.push(branch); | ||
this.state = branch.set(path, value).getState(); | ||
this.commit(); | ||
this.branches.splice(this.branches.indexOf(branch), 1); | ||
return this; | ||
@@ -94,3 +96,3 @@ } | ||
} | ||
path = _slots2["default"].path(path); | ||
path = _slots2["default"].makePath(path); | ||
var value = state.getIn(path); | ||
@@ -100,9 +102,9 @@ return (0, _utils.toJS)(value); | ||
}], [{ | ||
key: "path", | ||
value: function path(_path) { | ||
if (_path === null) { | ||
key: "makePath", | ||
value: function makePath(path) { | ||
if (path === null) { | ||
return null; | ||
} | ||
return isArray(_path) && _path || isString(_path) && _path.split(".") || (function () { | ||
throw new Error("path should be an array or dot-separated string or null,\n " + Object.prototype.toString.call(_path) + " given"); | ||
return isArray(path) && path || isString(path) && path.split(".") || (function () { | ||
throw new Error("path should be an array or dot-separated string or null,\n " + Object.prototype.toString.call(path) + " given"); | ||
})(); | ||
@@ -109,0 +111,0 @@ } |
@@ -70,3 +70,4 @@ "use strict"; | ||
this.contexts.push(ctx); | ||
return ctx.set(path, value); | ||
ctx.set(path, value); | ||
return ctx; | ||
} | ||
@@ -78,6 +79,11 @@ }, { | ||
if (!ctx.promises.length) { | ||
log("NO PROMISES LEFT FOR CONTEXT %s", (0, _utils.insp)(ctx.path)); | ||
this.contexts.splice(this.contexts.indexOf(ctx), 1); | ||
} | ||
log("COMMIT %s", (0, _utils.insp)(ctx.state)); | ||
if ((0, _immutable.is)(this.state, ctx.state)) { | ||
log("NO STATE CHANGES IN CONTEXT %s", (0, _utils.insp)(ctx.path)); | ||
return this; | ||
} | ||
log("COMMIT %s", (0, _utils.insp)(ctx.state)); | ||
this.state = ctx.state; | ||
@@ -119,3 +125,3 @@ if (!this.promises.length) { | ||
} | ||
path = Slots.path(path); | ||
path = Slots.makePath(path); | ||
var value = state.getIn(path); | ||
@@ -166,3 +172,3 @@ return (0, _utils.toJS)(value); | ||
value: function getRule(path) { | ||
path = Slots.path(path); | ||
path = Slots.makePath(path); | ||
return this.rules[path.join(".")]; | ||
@@ -225,9 +231,9 @@ } | ||
}, { | ||
key: "path", | ||
value: function path(_path) { | ||
if (_path === null) { | ||
key: "makePath", | ||
value: function makePath(path) { | ||
if (path === null) { | ||
return null; | ||
} | ||
return (0, _utils.isArray)(_path) && _path || (0, _utils.isString)(_path) && _path.split(".") || (function () { | ||
throw new Error("path should be an array or dot-separated string or null,\n " + Object.prototype.toString.call(_path) + " given"); | ||
return (0, _utils.isArray)(path) && path || (0, _utils.isString)(path) && path.split(".") || (function () { | ||
throw new Error("path should be an array or dot-separated string or null,\n " + Object.prototype.toString.call(path) + " given"); | ||
})(); | ||
@@ -234,0 +240,0 @@ } |
{ | ||
"name": "slt", | ||
"version": "1.1.0", | ||
"version": "1.1.1", | ||
"description": "Take care of your state", | ||
@@ -5,0 +5,0 @@ "main": "index.js", |
@@ -6,3 +6,3 @@ ## DISCLAIMER | ||
## DESCRIPTION | ||
`Slots` could be consider as a missing part of React (not only). It's like `Flux`, but better. | ||
`Slots` could be considered as a missing part of React (not only). It's like `Flux`, but better. | ||
@@ -35,3 +35,3 @@ ## TODO | ||
A great analogy is an `<img>` or `<script>` in HTML. Browser loads specified img just because of existence of this tag in the DOM (request state). The logic here is: we have `<img>` tag inserted in DOM node and it has its `src` attribute then fetch actual image from server and put it inside this node. `Slots` follows the same idea, as you can see in example. | ||
A great analogy is an `<img>` or `<script>` in HTML. Browser loads specified img just because of existence of this tag in the DOM (request state). The logic here is: we have `<img>` tag inserted in DOM node and it has its `src` attribute then fetch actual image from server and put it inside this node. `Slots` follows the same idea, as you can see in the following example. | ||
@@ -38,0 +38,0 @@ ## Use case |
@@ -14,4 +14,5 @@ import { fromJS, is, Map, List} from "immutable"; | ||
this.parent = parent; | ||
this.path = []; | ||
this.value = null; | ||
this.children = []; | ||
this.promises = []; | ||
} | ||
@@ -21,3 +22,2 @@ | ||
this.state = this.initialState; | ||
this.promises = []; | ||
} | ||
@@ -36,3 +36,5 @@ | ||
set(path = [], value = {}) { | ||
({path, value} = this.reducePathAndValue(Slots.path(path), value)); | ||
({path, value} = this.reducePathAndValue(Slots.makePath(path), value)); | ||
this.path = path; | ||
this.value = value; | ||
log("SET %s TO %s", insp(path), insp(value)); | ||
@@ -52,2 +54,8 @@ let imValue = fromJS(value); | ||
branch.bind(this.ctx); // out of call stack | ||
this.ctx.promises.push(branch); | ||
branch.then(() => { | ||
log("PROMISE FULFILLED for SET %s", insp(path)); | ||
this.ctx.promises.splice(this.ctx.promises.indexOf(branch), 1); | ||
this.ctx.commit(); | ||
}); | ||
} else { | ||
@@ -95,3 +103,3 @@ d("NEW BRANCH with state %s", insp(result)); | ||
} | ||
path = Slots.path(path); | ||
path = Slots.makePath(path); | ||
let value = state.getIn(path); | ||
@@ -98,0 +106,0 @@ return toJS(value); |
@@ -15,2 +15,3 @@ import { fromJS, is, Map, List} from "immutable"; | ||
this.slots = slots; | ||
this.path = []; | ||
this.branches = []; | ||
@@ -30,6 +31,7 @@ this.promises = []; | ||
set(path = [], value = {}) { | ||
this.path = path; | ||
let branch = new Branch(this.rules, this.state, this); | ||
this.branches.push(branch); | ||
this.state = branch.set(path, value).getState(); | ||
this.commit(); | ||
this.branches.splice(this.branches.indexOf(branch), 1); | ||
return this; | ||
@@ -50,3 +52,3 @@ } | ||
static path(path) { | ||
static makePath(path) { | ||
if (path === null) { | ||
@@ -66,3 +68,3 @@ return null; | ||
} | ||
path = Slots.path(path); | ||
path = Slots.makePath(path); | ||
let value = state.getIn(path); | ||
@@ -69,0 +71,0 @@ return toJS(value); |
@@ -40,10 +40,16 @@ import { fromJS, is, Map, List} from "immutable"; | ||
this.contexts.push(ctx); | ||
return ctx.set(path, value); | ||
ctx.set(path, value); | ||
return ctx; | ||
} | ||
commit (ctx) { | ||
if (!ctx.promises.length) { | ||
log("NO PROMISES LEFT FOR CONTEXT %s", insp(ctx.path)); | ||
this.contexts.splice(this.contexts.indexOf(ctx), 1); | ||
} | ||
log("COMMIT %s", insp(ctx.state)); | ||
if (is(this.state, ctx.state)) { | ||
log("NO STATE CHANGES IN CONTEXT %s", insp(ctx.path)); | ||
return this; | ||
} | ||
log("COMMIT %s", insp(ctx.state)); | ||
this.state = ctx.state; | ||
@@ -76,3 +82,3 @@ if (!this.promises.length) { | ||
} | ||
path = Slots.path(path); | ||
path = Slots.makePath(path); | ||
let value = state.getIn(path); | ||
@@ -117,3 +123,3 @@ return toJS(value); | ||
getRule(path) { | ||
path = Slots.path(path); | ||
path = Slots.makePath(path); | ||
return this.rules[path.join(".")]; | ||
@@ -162,3 +168,3 @@ } | ||
static path(path) { | ||
static makePath(path) { | ||
if (path === null) { | ||
@@ -165,0 +171,0 @@ return null; |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
97330
1264