Skip to content

Instantly share code, notes, and snippets.

@dontcallmedom

dontcallmedom/convert-to-bikeshed.html

Created October 22, 2016 10:36
Show Gist options
  • Save dontcallmedom/9132f29f4ebbb3c7204cb44bfc26a643 to your computer and use it in GitHub Desktop.
Save dontcallmedom/9132f29f4ebbb3c7204cb44bfc26a643 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
convert-to-bikeshed.html
<meta charset=utf-8>
<textarea style="width: 100%; height:100%"></textarea>
<script>
function stripIntro(doc) {
while (doc.body.firstChild.id != 'goals')
doc.body.firstChild.remove();
}
function anolisToBikeshed(doc) {
// remove all internal markup from IDL blocks
for (let idl of [].slice.call(doc.body.querySelectorAll('pre.idl'))) {
idl.textContent = idl.textContent;
}
var index = {};
for (let e of [].slice.call(doc.body.querySelectorAll('dfn'))) {
if (e.hasAttribute("title")) {
const value = e.getAttribute("title");
if (value.startsWith('concept-')) {
e.id = value;
const comps = value.split('-');
var target;
if (comps.length > 2) {
target = comps.slice(1, comps.length -1).join("-");
e.setAttribute("for", target);
}
index[value] = { text: e.textContent};
if (target) {
index[value]["for"]= target;
}
}
}
}
for (let e of [].slice.call(doc.body.querySelectorAll('span[data-anolis-ref]'))) {
var informative = e.classList.contains("informative");
var text = document.createTextNode('[['+ (informative ? '' : '!') + e.textContent + ']]');
e.parentNode.replaceChild(text, e);
}
// TODO: the same for <code data-anolis-spec>
for (let e of [].slice.call(doc.body.querySelectorAll('span[data-anolis-spec]'))) {
let a = doc.createElement('a');
const attributeNames = [].map.call(e.attributes, a => a.name);
for (let name of attributeNames) {
if (name == "title") continue;
if (name == "data-anolis-spec") {
a.setAttribute("spec", e.getAttribute(name));
continue;
}
a.setAttribute(name, e.getAttribute(name));
}
while (e.firstChild)
a.appendChild(e.firstChild);
e.parentNode.replaceChild(a, e);
}
// loop over and transform all elements/attributes
const elements = [].slice.call(doc.body.querySelectorAll('*'));
for (let e of elements) {
const attributeNames = [].map.call(e.attributes, a => a.name);
if (e.localName == 'span' && !e.classList.contains('note')) {
// <span> => <a>
let a = doc.createElement('a');
for (let name of attributeNames)
a.setAttribute(name, e.getAttribute(name));
while (e.firstChild)
a.appendChild(e.firstChild);
e.parentNode.replaceChild(a, e);
e = a;
}
for (let name of attributeNames) {
const value = e.getAttribute(name);
switch (name) {
case 'title':
if (value) {
if (e.localName == 'code') {
// wrap in <a>, Bikeshed doesn't autolink <code>
var a = doc.createElement('a');
e.parentNode.replaceChild(a, e);
a.appendChild(e);
} else if (e.localName == 'dfn') {
} else {
if (value.startsWith('concept-')) {
if (index[value]) {
if (e.textContent.toLowerCase() !== index[value].text) {
e.setAttribute('lt', index[value].text);
}
if (index[value]["for"] && attributeNames.indexOf('data-dfn-for') == -1) {
e.setAttribute('for', index[value]["for"]);
}
} else {
console.log(value + " not found in index");
}
// drop and fix with <pre class=link-defaults>
// TODO Deal with 'dom-[Interface]-[name]'
} else {
// title="foo-bar" -> lt="foo bar"
const ltValue = value.replace(/-/g, ' ');
// skip plural forms, Bikeshed understand
if (e.textContent != ltValue + 's' && e.textContent != ltValue)
e.setAttribute('lt', ltValue);
}
}
}
e.removeAttribute(name);
break;
}
}
}
}
function serialize(doc) {
var html = doc.body.innerHTML;
// strip </p> and similar
html = html.replace(/<\/(p|li|dd|dt|th|td|tr|thead|tbody)>/g, '');
// attr="" => attr
html = html.replace(/=""/g, '');
// &gt; => >
html = html.replace(/&gt;/g, '>');
// attr="no-whitespace" => attr=no-whitespace
html = html.replace(/="([^ ]+)"/g, '=$1');
return html;
}
document.querySelector('textarea').addEventListener('paste', event => {
setTimeout(() => {
const input = event.target.value;
var parser = new DOMParser();
var doc = parser.parseFromString(input, "text/html");
console.log(doc);
stripIntro(doc);
// if anolisToBikeshed() is skipped, there are no interesting differences
anolisToBikeshed(doc);
var output = serialize(doc);
event.target.value = output;
event.target.select();
}, 0);
});
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment