Skip to content

Instantly share code, notes, and snippets.

@Raynos
Created December 1, 2014 21:27
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Raynos/617c0e4f52f93acff0d4 to your computer and use it in GitHub Desktop.
Save Raynos/617c0e4f52f93acff0d4 to your computer and use it in GitHub Desktop.
Example of pure widget
var createElement = require('virtual-dom/create-element.js');
var diff = require('virtual-dom/diff');
var patch = require('virtual-dom/patch');
var document = require('global/document');
/*
A PureWrapperWidget wraps a vnode in a container.
It can do all kinds of DOM specific logic on the
container if you wanted to. Like handling
scroll and actual heights in the DOM.
*/
function PureWrapperWidget(vnode) {
this.currVnode = vnode;
}
var proto = PureWrapperWidget.prototype;
proto.init = function init() {
var elem = createElement(vnode);
var container = document.createElement('div');
container.appendChild(elem);
return container;
};
proto.update = function update(prev, elem) {
var prevVnode = prev.currVnode;
var currVnode = this.currVnode;
var patches = diff(prevVnode, currVnode);
var rootNode = elem.childNodes[0];
var newNode = patch(rootNode, patches);
if (newNode !== elem.childNodes[0]) {
elem.replaceChild(newNode, elem.childNodes[0]);
}
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment