From 44f6a9a64df4a59ecc0980db7990962ce7ad54c1 Mon Sep 17 00:00:00 2001 From: Barney Date: Fri, 7 Nov 2014 10:23:23 +0000 Subject: [PATCH] Warning not to invoke background m.request as m.prop in modules --- archive/v0.1.23/mithril-tests.js | 3200 +++++++++++++++++++++++++++++ archive/v0.1/getting-started.html | 10 +- archive/v0.1/mithril.prop.html | 10 +- docs/mithril.request.md | 2 + 4 files changed, 3212 insertions(+), 10 deletions(-) create mode 100644 archive/v0.1.23/mithril-tests.js diff --git a/archive/v0.1.23/mithril-tests.js b/archive/v0.1.23/mithril-tests.js new file mode 100644 index 00000000..99bac36d --- /dev/null +++ b/archive/v0.1.23/mithril-tests.js @@ -0,0 +1,3200 @@ +Mithril = m = new function app(window, undefined) { + var sObj = "[object Object]", sArr = "[object Array]", sStr = "[object String]" + function type(obj) {return {}.toString.call(obj)} + function isObj(obj) {return obj != null && type(obj) == sObj} + function isArr(obj) {return type(obj) == sArr} + function isFn(obj) {return typeof obj == "function"} + function isStr(obj){ return type(obj) == sStr} + var parser = /(?:(^|#|\.)([^#\.\[\]]+))|(\[.+?\])/g, attrParser = /\[(.+?)(?:=("|'|)(.*?)\2)?\]/ + var voidElements = /AREA|BASE|BR|COL|COMMAND|EMBED|HR|IMG|INPUT|KEYGEN|LINK|META|PARAM|SOURCE|TRACK|WBR/ + + /* + * @typedef {String} Tag + * A string that looks like -> div.classname#id[param=one][param2=two] + * Which describes a DOM node + */ + + /* + * + * @param {Tag} The DOM node tag + * @param {Object=[]} optional key-value pairs to be mapped to DOM attrs + * @param {...mNode=[]} Zero or more Mithril child nodes. Can be an array, or splat (optional) + * + */ + function m() { + var args = [].slice.call(arguments) + var hasAttrs = isObj(args[1]) && !("tag" in args[1]) && !("subtree" in args[1]) + var attrs = hasAttrs ? args[1] : {} + var classAttrName = "class" in attrs ? "class" : "className" + var cell = {tag: "div", attrs: {}} + var match, classes = [] + while (match = parser.exec(args[0])) { + if (match[1] == "" && match[2]) cell.tag = match[2] + else if (match[1] == "#") cell.attrs.id = match[2] + else if (match[1] == ".") classes.push(match[2]) + else if (match[3][0] == "[") { + var pair = attrParser.exec(match[3]) + cell.attrs[pair[1]] = pair[3] || (pair[2] ? "" :true) + } + } + if (classes.length > 0) cell.attrs[classAttrName] = classes.join(" ") + + + var children = hasAttrs ? args[2] : args[1] + if (isArr(children)) { + cell.children = children + } + else { + cell.children = hasAttrs ? args.slice(2) : args.slice(1) + } + + for (var attrName in attrs) { + if (attrName == classAttrName) cell.attrs[attrName] = (cell.attrs[attrName] || "") + " " + attrs[attrName] + else cell.attrs[attrName] = attrs[attrName] + } + return cell + } + function build(parentElement, parentTag, parentCache, parentIndex, data, cached, shouldReattach, index, editable, namespace, configs) { + //`build` is a recursive function that manages creation/diffing/removal of DOM elements based on comparison between `data` and `cached` + //the diff algorithm can be summarized as this: + //1 - compare `data` and `cached` + //2 - if they are different, copy `data` to `cached` and update the DOM based on what the difference is + //3 - recursively apply this algorithm for every array and for the children of every virtual element + + //the `cached` data structure is essentially the same as the previous redraw's `data` data structure, with a few additions: + //- `cached` always has a property called `nodes`, which is a list of DOM elements that correspond to the data represented by the respective virtual element + //- in order to support attaching `nodes` as a property of `cached`, `cached` is *always* a non-primitive object, i.e. if the data was a string, then cached is a String instance. If data was `null` or `undefined`, cached is `new String("")` + //- `cached also has a `configContext` property, which is the state storage object exposed by config(element, isInitialized, context) + //- when `cached` is an Object, it represents a virtual element; when it's an Array, it represents a list of elements; when it's a String, Number or Boolean, it represents a text node + + //`parentElement` is a DOM element used for W3C DOM API calls + //`parentTag` is only used for handling a corner case for textarea values + //`parentCache` is used to remove nodes in some multi-node cases + //`parentIndex` and `index` are used to figure out the offset of nodes. They're artifacts from before arrays started being flattened and are likely refactorable + //`data` and `cached` are, respectively, the new and old nodes being diffed + //`shouldReattach` is a flag indicating whether a parent node was recreated (if so, and if this node is reused, then this node must reattach itself to the new parent) + //`editable` is a flag that indicates whether an ancestor is contenteditable + //`namespace` indicates the closest HTML namespace as it cascades down from an ancestor + //`configs` is a list of config functions to run after the topmost `build` call finishes running + + //there's logic that relies on the assumption that null and undefined data are equivalent to empty strings + //- this prevents lifecycle surprises from procedural helpers that mix implicit and explicit return statements + //- it simplifies diffing code + if (data == null) data = "" + if (data.subtree === "retain") return cached + var cachedType = type(cached), dataType = type(data) + if (cached == null || cachedType != dataType) { + if (cached != null) { + if (parentCache && parentCache.nodes) { + var offset = index - parentIndex + var end = offset + (dataType == sArr ? data : cached.nodes).length + clear(parentCache.nodes.slice(offset, end), parentCache.slice(offset, end)) + } + else if (cached.nodes) clear(cached.nodes, cached) + } + cached = new data.constructor + if (cached.tag) cached = {} //if constructor creates a virtual dom element, use a blank object as the base cached node instead of copying the virtual el (#277) + cached.nodes = [] + } + + if (dataType == sArr) { + data = flatten(data) + var nodes = [], intact = cached.length === data.length, subArrayCount = 0 + + //keys algorithm: sort elements without recreating them if keys are present + //1) create a map of all existing keys, and mark all for deletion + //2) add new keys to map and mark them for addition + //3) if key exists in new list, change action from deletion to a move + //4) for each key, handle its corresponding action as marked in previous steps + //5) copy unkeyed items into their respective gaps + var DELETION = 1, INSERTION = 2 , MOVE = 3 + var existing = {}, unkeyed = [], shouldMaintainIdentities = false + for (var i = 0; i < cached.length; i++) { + if (cached[i] && cached[i].attrs && cached[i].attrs.key != null) { + shouldMaintainIdentities = true + existing[cached[i].attrs.key] = {action: DELETION, index: i} + } + } + if (shouldMaintainIdentities) { + for (var i = 0; i < data.length; i++) { + if (data[i] && data[i].attrs) { + if (data[i].attrs.key != null) { + var key = data[i].attrs.key + if (!existing[key]) existing[key] = {action: INSERTION, index: i} + else existing[key] = { + action: MOVE, + index: i, + from: existing[key].index, + element: parentElement.childNodes[existing[key].index] || window.document.createElement("div") + } + } + else unkeyed.push({index: i, element: parentElement.childNodes[i] || window.document.createElement("div")}) + } + } + var actions = Object.keys(existing).map(function(key) {return existing[key]}) + var changes = actions.sort(function(a, b) {return a.action - b.action || a.index - b.index}) + var newCached = cached.slice() + + for (var i = 0, change; change = changes[i]; i++) { + if (change.action == DELETION) { + clear(cached[change.index].nodes, cached[change.index]) + newCached.splice(change.index, 1) + } + if (change.action == INSERTION) { + var dummy = window.document.createElement("div") + dummy.key = data[change.index].attrs.key + parentElement.insertBefore(dummy, parentElement.childNodes[change.index] || null) + newCached.splice(change.index, 0, {attrs: {key: data[change.index].attrs.key}, nodes: [dummy]}) + } + + if (change.action == MOVE) { + if (parentElement.childNodes[change.index] !== change.element && change.element !== null) { + parentElement.insertBefore(change.element, parentElement.childNodes[change.index] || null) + } + newCached[change.index] = cached[change.from] + } + } + for (var i = 0; i < unkeyed.length; i++) { + var change = unkeyed[i] + parentElement.insertBefore(change.element, parentElement.childNodes[change.index] || null) + newCached[change.index] = cached[change.index] + } + cached = newCached + cached.nodes = [] + for (var i = 0, child; child = parentElement.childNodes[i]; i++) cached.nodes.push(child) + } + //end key algorithm + + for (var i = 0, cacheCount = 0; i < data.length; i++) { + //diff each item in the array + var item = build(parentElement, parentTag, cached, index, data[i], cached[cacheCount], shouldReattach, index + subArrayCount || subArrayCount, editable, namespace, configs) + if (item === undefined) continue + if (!item.nodes.intact) intact = false + subArrayCount += isArr(item) ? item.length : 1 + cached[cacheCount++] = item + } + if (!intact) { + //diff the array itself + + //update the list of DOM nodes by collecting the nodes from each item + for (var i = 0; i < data.length; i++) { + if (cached[i] != null) nodes = nodes.concat(cached[i].nodes) + } + //remove items from the end of the array if the new array is shorter than the old one + //if errors ever happen here, the issue is most likely a bug in the construction of the `cached` data structure somewhere earlier in the program + for (var i = 0, node; node = cached.nodes[i]; i++) { + if (node.parentNode != null && nodes.indexOf(node) < 0) clear([node], [cached[i]]) + } + //add items to the end if the new array is longer than the old one + for (var i = cached.nodes.length, node; node = nodes[i]; i++) { + if (node.parentNode == null) parentElement.appendChild(node) + } + if (data.length < cached.length) cached.length = data.length + cached.nodes = nodes + } + } + else if (data != null && dataType == sObj) { + //if an element is different enough from the one in cache, recreate it + if (data.tag != cached.tag || Object.keys(data.attrs).join() != Object.keys(cached.attrs).join() || data.attrs.id != cached.attrs.id) { + clear(cached.nodes) + if (cached.configContext && isFn(cached.configContext.onunload)) cached.configContext.onunload() + } + if (!isStr(data.tag)) return + + var node, isNew = cached.nodes.length === 0 + if (data.attrs.xmlns) namespace = data.attrs.xmlns + else if (data.tag === "svg") namespace = "http://www.w3.org/2000/svg" + else if (data.tag === "math") namespace = "http://www.w3.org/1998/Math/MathML" + if (isNew) { + node = namespace === undefined ? window.document.createElement(data.tag) : window.document.createElementNS(namespace, data.tag) + cached = { + tag: data.tag, + //set attributes first, then create children + attrs: setAttributes(node, data.tag, data.attrs, {}, namespace), + children: build(node, data.tag, undefined, undefined, data.children, cached.children, true, 0, data.attrs.contenteditable ? node : editable, namespace, configs), + nodes: [node] + } + //edge case: setting value on