-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Christopher Baker
committed
Oct 30, 2017
1 parent
c133e4c
commit 0a51a5e
Showing
7 changed files
with
769 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,79 @@ | ||
/*react-view-model@0.5.9#component*/ | ||
define([ | ||
'require', | ||
'exports', | ||
'module', | ||
'react', | ||
'can-define/map', | ||
'can-util/js/assign', | ||
'./observer', | ||
'./helpers/make-enumerable', | ||
'./helpers/autobind-methods', | ||
'can-util/js/dev', | ||
'can-namespace' | ||
], function (require, exports, module) { | ||
var React = require('react'); | ||
var DefineMap = require('can-define/map'); | ||
var assign = require('can-util/js/assign'); | ||
var Observer = require('./observer'); | ||
var makeEnumerable = require('./helpers/make-enumerable'); | ||
var autobindMethods = require('./helpers/autobind-methods'); | ||
var dev = require('can-util/js/dev'); | ||
var namespace = require('can-namespace'); | ||
if (React) { | ||
var Component = function Component() { | ||
React.Component.call(this); | ||
if (this.constructor.ViewModel) { | ||
autobindMethods(this.constructor.ViewModel, true); | ||
makeEnumerable(this.constructor.ViewModel, true); | ||
} | ||
this._observer = new Observer(); | ||
if (typeof this.shouldComponentUpdate === 'function') { | ||
this._shouldComponentUpdate = this.shouldComponentUpdate; | ||
} | ||
this.shouldComponentUpdate = function () { | ||
return false; | ||
}; | ||
}; | ||
Component.prototype = Object.create(React.Component.prototype); | ||
assign(Component.prototype, { | ||
constructor: Component, | ||
componentWillReceiveProps: function (nextProps) { | ||
var props = {}; | ||
for (var key in nextProps) { | ||
if (!(key in this.props) || nextProps[key] !== this.props[key]) { | ||
props[key] = nextProps[key]; | ||
} | ||
} | ||
this.viewModel.assign(props); | ||
}, | ||
componentWillMount: function () { | ||
var ViewModel = this.constructor.ViewModel || DefineMap; | ||
this.viewModel = new ViewModel(this.props); | ||
this._observer.startLisening(function () { | ||
if (typeof this._shouldComponentUpdate !== 'function' || this._shouldComponentUpdate()) { | ||
this.forceUpdate(); | ||
} | ||
}.bind(this)); | ||
}, | ||
componentDidMount: function () { | ||
this._observer.stopListening(); | ||
}, | ||
componentWillUpdate: function () { | ||
this._observer.startLisening(); | ||
}, | ||
componentDidUpdate: function () { | ||
this._observer.stopListening(); | ||
}, | ||
componentWillUnmount: function () { | ||
this._observer.stop(); | ||
this.viewModel = null; | ||
} | ||
}); | ||
module.exports = namespace.ReactViewModelComponent = Component; | ||
} else { | ||
module.exports = namespace.ReactViewModelComponent = function Component() { | ||
throw new Error('You must provide React before can.all.js'); | ||
}; | ||
} | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,40 @@ | ||
/*react-view-model@0.5.9#helpers/autobind-methods*/ | ||
define([ | ||
'require', | ||
'exports', | ||
'module', | ||
'can-util/js/each', | ||
'can-define/map' | ||
], function (require, exports, module) { | ||
var each = require('can-util/js/each'); | ||
var DefineMap = require('can-define/map'); | ||
var METHODS_TO_AUTOBIND_KEY = '_methodsToAutobind-react-view-models'; | ||
module.exports = function autobindMethods(ViewModel) { | ||
if (ViewModel[METHODS_TO_AUTOBIND_KEY]) { | ||
return; | ||
} | ||
var setup = ViewModel.prototype.setup; | ||
var methods = getMethods(ViewModel.prototype, {}); | ||
Object.defineProperty(ViewModel, METHODS_TO_AUTOBIND_KEY, { | ||
enumerable: false, | ||
value: methods | ||
}); | ||
ViewModel.prototype.setup = function setUpWithAutobind() { | ||
for (var key in methods) { | ||
this[key] = methods[key].bind(this); | ||
} | ||
return setup.apply(this, arguments); | ||
}; | ||
}; | ||
function getMethods(proto, methods) { | ||
if (proto && proto !== Object.prototype && proto !== DefineMap.prototype) { | ||
each(proto._define.methods, function (property, key) { | ||
if (!(key in methods) && key !== 'constructor') { | ||
methods[key] = property; | ||
} | ||
}); | ||
return getMethods(Object.getPrototypeOf(proto), methods); | ||
} | ||
return methods; | ||
} | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,43 @@ | ||
/*react-view-model@0.5.9#helpers/make-enumerable*/ | ||
define([ | ||
'require', | ||
'exports', | ||
'module', | ||
'can-util/js/each' | ||
], function (require, exports, module) { | ||
var each = require('can-util/js/each'); | ||
module.exports = function makeEnumerable(Type, recursive) { | ||
if (isEnumerable(Type)) { | ||
return; | ||
} | ||
if (recursive === undefined) { | ||
recursive = true; | ||
} | ||
var setup = Type.prototype.setup; | ||
Type.prototype.setup = function () { | ||
if (this._define) { | ||
var map = this; | ||
each(this._define.definitions, function (value, prop) { | ||
var parent = Object.getOwnPropertyDescriptor(map.constructor.prototype, prop); | ||
Object.defineProperty(map, prop, { | ||
enumerable: true, | ||
get: parent.get, | ||
set: parent.set | ||
}); | ||
if (recursive && value.Type) { | ||
makeEnumerable(value.Type, recursive); | ||
} | ||
}); | ||
} | ||
return setup.apply(this, arguments); | ||
}; | ||
Object.defineProperty(Type, '__isEnumerable', { | ||
enumerable: false, | ||
value: true | ||
}); | ||
}; | ||
function isEnumerable(Type) { | ||
return !!Type.__isEnumerable; | ||
} | ||
module.exports.isEnumerable = isEnumerable; | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,45 @@ | ||
/*react-view-model@0.5.9#helpers/observable-promise*/ | ||
define([ | ||
'exports', | ||
'can-define/map', | ||
'can-stache-key' | ||
], function (exports, _map, _canStacheKey) { | ||
'use strict'; | ||
Object.defineProperty(exports, '__esModule', { value: true }); | ||
var _map2 = _interopRequireDefault(_map); | ||
var _canStacheKey2 = _interopRequireDefault(_canStacheKey); | ||
function _interopRequireDefault(obj) { | ||
return obj && obj.__esModule ? obj : { default: obj }; | ||
} | ||
exports.default = _map2.default.extend('ObservablePromise', { | ||
init: function init(promise) { | ||
this.promise = promise; | ||
}, | ||
promise: 'any', | ||
isPending: { | ||
get: function get() { | ||
return _canStacheKey2.default.read(this, _canStacheKey2.default.reads('promise.isPending')).value; | ||
} | ||
}, | ||
isResolved: { | ||
get: function get() { | ||
return _canStacheKey2.default.read(this, _canStacheKey2.default.reads('promise.isResolved')).value; | ||
} | ||
}, | ||
isRejected: { | ||
get: function get() { | ||
return _canStacheKey2.default.read(this, _canStacheKey2.default.reads('promise.isRejected')).value; | ||
} | ||
}, | ||
reason: { | ||
get: function get() { | ||
return _canStacheKey2.default.read(this, _canStacheKey2.default.reads('promise.reason')).value; | ||
} | ||
}, | ||
value: { | ||
get: function get() { | ||
return _canStacheKey2.default.read(this, _canStacheKey2.default.reads('promise.value')).value; | ||
} | ||
} | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,45 @@ | ||
/*react-view-model@0.5.9#observer*/ | ||
define([ | ||
'require', | ||
'exports', | ||
'module', | ||
'can-observation', | ||
'can-util/js/assign' | ||
], function (require, exports, module) { | ||
var Observation = require('can-observation'); | ||
var assign = require('can-util/js/assign'); | ||
function Observer() { | ||
var self = this; | ||
Observation.call(self, null, null, function () { | ||
return self.listener && self.listener(); | ||
}); | ||
} | ||
Observer.prototype = Object.create(Observation.prototype); | ||
Observer.prototype.constructor = Observer; | ||
assign(Observer.prototype, { | ||
start: function () { | ||
this.value = {}; | ||
}, | ||
startLisening: function (listener) { | ||
this.listener = listener || this.listener; | ||
this.bound = true; | ||
this.oldObserved = this.newObserved || {}; | ||
this.ignore = 0; | ||
this.newObserved = {}; | ||
Observation.observationStack.push(this); | ||
}, | ||
stopListening: function () { | ||
if (Observation.observationStack[Observation.observationStack.length - 1] !== this) { | ||
var index = Observation.observationStack.indexOf(this); | ||
if (index === -1) { | ||
throw new Error('Async observations stopped out of order.'); | ||
} | ||
Observation.observationStack.splice(index, 1); | ||
Observation.observationStack.push(this); | ||
} | ||
Observation.observationStack.pop(); | ||
this.updateBindings(); | ||
} | ||
}); | ||
module.exports = Observer; | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,65 @@ | ||
/*react-view-model@0.5.9#react-view-model*/ | ||
define([ | ||
'require', | ||
'exports', | ||
'module', | ||
'can-util/js/assign', | ||
'./component', | ||
'can-namespace', | ||
'./helpers/observable-promise', | ||
'./helpers/autobind-methods', | ||
'./helpers/make-enumerable' | ||
], function (require, exports, module) { | ||
var assign = require('can-util/js/assign'); | ||
var Component = require('./component'); | ||
var namespace = require('can-namespace'); | ||
var ObservablePromise = require('./helpers/observable-promise'); | ||
var autobindMethods = require('./helpers/autobind-methods'); | ||
var makeEnumerable = require('./helpers/make-enumerable'); | ||
module.exports = namespace.reactViewModel = function reactViewModel(displayName, ViewModel, render) { | ||
if (arguments.length === 1) { | ||
render = arguments[0]; | ||
ViewModel = null; | ||
displayName = null; | ||
} | ||
if (arguments.length === 2) { | ||
render = arguments[1]; | ||
if (typeof arguments[0] === 'string') { | ||
displayName = arguments[0]; | ||
ViewModel = null; | ||
} else { | ||
ViewModel = arguments[0]; | ||
displayName = null; | ||
} | ||
} | ||
if (!displayName) { | ||
displayName = (render.displayName || render.name || 'ReactVMComponent') + 'Wrapper'; | ||
} | ||
function App() { | ||
Component.call(this); | ||
} | ||
App.ViewModel = ViewModel; | ||
App.displayName = displayName; | ||
App.prototype = Object.create(Component.prototype); | ||
assign(App.prototype, { | ||
constructor: App, | ||
render: function () { | ||
return render(this.viewModel); | ||
} | ||
}); | ||
try { | ||
Object.defineProperty(App, 'name', { | ||
writable: false, | ||
enumerable: false, | ||
configurable: true, | ||
value: displayName | ||
}); | ||
} catch (e) { | ||
} | ||
return App; | ||
}; | ||
module.exports.Component = Component; | ||
module.exports.ObservablePromise = ObservablePromise; | ||
module.exports.autobindMethods = autobindMethods; | ||
module.exports.makeEnumerable = makeEnumerable; | ||
}); |
Oops, something went wrong.