vndb/mithril-vndb
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Clean up tests, resolve style differences, reduce upstream diff

Browse source 
This is in preparation for a PR, to reduce potential for merge conflicts
with either my PR or others', since mine will modify a large amount of
the main file.
This commit is contained in:
impinball 2015-07-23 05:24:48 -04:00
parent 565f9cf334
commit 3de01a1554
14 changed files with 1987 additions and 3578 deletions
Download patch file Download diff file Expand all files Collapse all files

164
docs/layout/tools/template-converter.js
View file

@ -1,128 +1,90 @@
/* globals m */
var templateConverter = {}
var templateConverter = {};
templateConverter.DOMFragment = function(markup) {
"use strict"
if (markup.indexOf("<!doctype") > -1) {
return [
new DOMParser().parseFromString(markup, "text/html").childNodes[1]
]
}
var container = document.createElement("div")
container.insertAdjacentHTML("beforeend", markup)
return container.childNodes
if (markup.indexOf("<!doctype") > -1) return [new DOMParser().parseFromString(markup, "text/html").childNodes[1]]
var container = document.createElement("div");
container.insertAdjacentHTML("beforeend", markup);
return container.childNodes;
}
templateConverter.VirtualFragment = function recurse(domFragment) {
"use strict"
var virtualFragment = []
for (var i = 0; i < domFragment.length; i++) {
var el = domFragment[i]
if (el.nodeType === 3) {
virtualFragment.push(el.nodeValue)
} else if (el.nodeType === 1) {
var attrs = {}
for (var j = 0; el.attributes.length; j++) {
var attr = el.attributes[j]
attrs[attr.name] = attr.value
var virtualFragment = [];
for (var i = 0, el; el = domFragment[i]; i++) {
if (el.nodeType == 3) {
virtualFragment.push(el.nodeValue);
}
else if (el.nodeType == 1) {
var attrs = {};
for (var j = 0, attr; attr = el.attributes[j]; j++) {
attrs[attr.name] = attr.value;
}
virtualFragment.push({
tag: el.nodeName.toLowerCase(),
attrs: attrs,
children: recurse(el.childNodes)
})
virtualFragment.push({tag: el.nodeName.toLowerCase(), attrs: attrs, children: recurse(el.childNodes)});
}
}
return virtualFragment
return virtualFragment;
}
templateConverter.Template = function recurse() {
"use strict"
if (Object.prototype.toString.call(arguments[0]) === "[object String]") {
return new recurse(new templateConverter.VirtualFragment(
new templateConverter.DOMFragment(arguments[0])))
if (Object.prototype.toString.call(arguments[0]) == "[object String]") {
return new recurse(new templateConverter.VirtualFragment(new templateConverter.DOMFragment(arguments[0])));
}
var virtualFragment = arguments[0]
var level = arguments[1]
if (!level) level = 1
var tab = "\n" + new Array(level + 1).join("\t")
var virtuals = []
for (var i = 0; i < virtualFragment.length; i++) {
var el = virtualFragment[i]
if (typeof el === "string") {
if (el.match(/\t| {2,}/g) && el.trim().length === 0) {
virtuals.indented = true
} else {
virtuals.push('"' + el
.replace(/"/g, '\\"')
.replace(/\r/g, "\\r")
.replace(/\n/g, "\\n") + '"')
}
} else {
var virtual = ""
if (el.tag !== "div") virtual += el.tag
if (el.attrs.class) {
virtual += "." + el.attrs.class
.replace(/\t+/g, " ")
.split(" ")
.join(".")
delete el.attrs.class
var virtualFragment = arguments[0], level = arguments[1]
if (!level) level = 1;
var tab = "\n" + new Array(level + 1).join("\t");
var virtuals = [];
for (var i = 0, el; el = virtualFragment[i]; i++) {
if (typeof el == "string") {
if (el.match(/\t| {2,}/g) && el.trim().length == 0) virtuals.indented = true;
else virtuals.push('"' + el.replace(/"/g, '\\"').replace(/\r/g, "\\r").replace(/\n/g, "\\n") + '"');
}
else {
var virtual = "";
if (el.tag != "div") virtual += el.tag;
if (el.attrs["class"]) {
virtual += "." + el.attrs["class"].replace(/\t+/g, " ").split(" ").join(".");
delete el.attrs["class"];
}
var attrNames = Object.keys(el.attrs).sort()
for (var j = 0; j < attrNames.length; j++) {
var attrName = attrNames[j]
if (attrName !== "style") {
virtual += "[" + attrName + "='" +
el.attrs[attrName].replace(/'/g, "\\'") + "']"
}
for (var j = 0, attrName; attrName = attrNames[j]; j++) {
if (attrName != "style") virtual += "[" + attrName + "='" + el.attrs[attrName].replace(/'/g, "\\'") + "']";
}
if (virtual === "") virtual = "div"
virtual = '"' + virtual + '"'
if (virtual == "") virtual = "div"
virtual = '"' + virtual + '"';
var style = ""
if (el.attrs.style) {
virtual += ", {style: " + ("{\"" + el.attrs.style
.replace(/:/g, "\": \"")
.replace(/;/g, "\", \"") + "}")
.replace(/, "}|"}/, "}") + "}"
virtual += ", {style: " + ("{\"" + el.attrs.style.replace(/:/g, "\": \"").replace(/;/g, "\", \"") + "}").replace(/, "}|"}/, "}") + "}"
}
if (el.children.length > 0) {
virtual += ", " + recurse(el.children, level + 1)
virtual += ", " + recurse(el.children, level + 1);
}
virtual = "m(" + virtual + ")"
virtuals.push(virtual)
virtual = "m(" + virtual + ")";
virtuals.push(virtual);
}
}
if (!virtuals.indented) tab = ""
var isInline = virtuals.length === 1 && virtuals[0].charAt(0) === '"'
var template = isInline ?
virtuals.join(", ") :
"[" + tab + virtuals.join("," + tab) + tab.slice(0, -1) + "]"
return new String(template) // eslint-disable-line no-new-wrappers
if (!virtuals.indented) tab = "";
var isInline = virtuals.length == 1 && virtuals[0].charAt(0) == '"';
var template = isInline ? virtuals.join(", ") : "[" + tab + virtuals.join("," + tab) + tab.slice(0, -1) + "]";
return new String(template);
}
templateConverter.controller = function() {
"use strict"
this.source = m.prop("")
this.output = m.prop("")
this.source = m.prop("");
this.output = m.prop("");
this.convert = function() {
return this.output(new templateConverter.Template(this.source()))
}
}
return this.output(new templateConverter.Template(this.source()));
};
};
templateConverter.view = function(ctrl) {
"use strict"
return m("div", [
m("textarea", {
autofocus: true,
style: {width: "100%", height: "40%"},
onchange: m.withAttr("value", ctrl.source)
}, ctrl.source()),
m("textarea", {autofocus: true, style: {width:"100%", height: "40%"}, onchange: m.withAttr("value", ctrl.source)}, ctrl.source()),
m("button", {onclick: ctrl.convert.bind(ctrl)}, "Convert"),
m("textarea", {style: {width: "100%", height: "40%"}}, ctrl.output())
])
}
m("textarea", {style: {width:"100%", height: "40%"}}, ctrl.output())
]);
};