Update stylesheet.js to ES6

This commit is contained in:
Ulrik de Muelenaere 2017-11-03 12:17:35 +02:00
parent 72c57d16f4
commit ce1494e5ec

View File

@ -24,18 +24,17 @@ window._qutebrowser.stylesheet = (function() {
return window._qutebrowser.stylesheet; return window._qutebrowser.stylesheet;
} }
var funcs = {}; const funcs = {};
var xhtml_ns = "http://www.w3.org/1999/xhtml"; const xhtml_ns = "http://www.w3.org/1999/xhtml";
var svg_ns = "http://www.w3.org/2000/svg"; const svg_ns = "http://www.w3.org/2000/svg";
var root_elem; let root_elem;
var style_elem; let style_elem;
var css_content = ""; let css_content = "";
var root_observer; let root_observer;
var style_observer; let initialized = false;
var initialized = false;
// Watch for rewrites of the root element and changes to its children, // Watch for rewrites of the root element and changes to its children,
// then move the stylesheet to the end. Partially inspired by Stylus: // then move the stylesheet to the end. Partially inspired by Stylus:
@ -53,7 +52,7 @@ window._qutebrowser.stylesheet = (function() {
} }
function create_style() { function create_style() {
var ns = xhtml_ns; let ns = xhtml_ns;
if (document.documentElement.namespaceURI === svg_ns) { if (document.documentElement.namespaceURI === svg_ns) {
ns = svg_ns; ns = svg_ns;
} }
@ -69,28 +68,15 @@ window._qutebrowser.stylesheet = (function() {
// starting point for exploring the relevant code in Chromium, see // starting point for exploring the relevant code in Chromium, see
// https://github.com/qt/qtwebengine-chromium/blob/cfe8c60/chromium/third_party/WebKit/Source/core/xml/parser/XMLDocumentParser.cpp#L1539-L1540 // https://github.com/qt/qtwebengine-chromium/blob/cfe8c60/chromium/third_party/WebKit/Source/core/xml/parser/XMLDocumentParser.cpp#L1539-L1540
function check_style(node) { function check_style(node) {
var stylesheet = node.nodeType === Node.PROCESSING_INSTRUCTION_NODE && const stylesheet = node.nodeType === Node.PROCESSING_INSTRUCTION_NODE &&
node.target === "xml-stylesheet" && node.target === "xml-stylesheet" &&
node.parentNode === document; node.parentNode === document;
var known_ns = node.nodeType === Node.ELEMENT_NODE && const known_ns = node.nodeType === Node.ELEMENT_NODE &&
(node.namespaceURI === xhtml_ns || (node.namespaceURI === xhtml_ns ||
node.namespaceURI === svg_ns); node.namespaceURI === svg_ns);
return stylesheet || known_ns; return stylesheet || known_ns;
} }
function watch_added_style(mutations) {
for (var mi = 0; mi < mutations.length; ++mi) {
var nodes = mutations[mi].addedNodes;
for (var ni = 0; ni < nodes.length; ++ni) {
if (check_style(nodes[ni])) {
create_style();
style_observer.disconnect();
return;
}
}
}
}
function init() { function init() {
initialized = true; initialized = true;
// Chromium will not rewrite a document inside a frame, so add the // Chromium will not rewrite a document inside a frame, so add the
@ -99,16 +85,26 @@ window._qutebrowser.stylesheet = (function() {
create_style(); create_style();
return; return;
} }
var iter = document.createNodeIterator(document, const iter = document.createNodeIterator(document,
NodeFilter.SHOW_PROCESSING_INSTRUCTION | NodeFilter.SHOW_ELEMENT); NodeFilter.SHOW_PROCESSING_INSTRUCTION | NodeFilter.SHOW_ELEMENT);
var node; let node;
while ((node = iter.nextNode())) { while ((node = iter.nextNode())) {
if (check_style(node)) { if (check_style(node)) {
create_style(); create_style();
return; return;
} }
} }
style_observer = new MutationObserver(watch_added_style); const style_observer = new MutationObserver((mutations) => {
for (const mutation of mutations) {
for (const added of mutation.addedNodes) {
if (check_style(added)) {
create_style();
style_observer.disconnect();
return;
}
}
}
});
style_observer.observe(document, {"childList": true, "subtree": true}); style_observer.observe(document, {"childList": true, "subtree": true});
} }
@ -127,8 +123,8 @@ window._qutebrowser.stylesheet = (function() {
} }
// Propagate the new CSS to all child frames. // Propagate the new CSS to all child frames.
// FIXME:qtwebengine This does not work for cross-origin frames. // FIXME:qtwebengine This does not work for cross-origin frames.
for (var i = 0; i < window.frames.length; ++i) { for (let i = 0; i < window.frames.length; ++i) {
var frame = window.frames[i]; const frame = window.frames[i];
if (frame._qutebrowser && frame._qutebrowser.stylesheet) { if (frame._qutebrowser && frame._qutebrowser.stylesheet) {
frame._qutebrowser.stylesheet.set_css(css); frame._qutebrowser.stylesheet.set_css(css);
} }