[Bf-docboard-svn] bf-manual: [9688] trunk/blender_docs/resources/theme/js/version_switch.js: version switch: drop jQuery
Tobias Heinke
noreply at blender.org
Sat Nov 12 04:07:28 CET 2022
Revision: 9688
https://developer.blender.org/rBM9688
Author: TobiasH
Date: 2022-11-12 04:07:28 +0100 (Sat, 12 Nov 2022)
Log Message:
-----------
version switch: drop jQuery
Modified Paths:
--------------
trunk/blender_docs/resources/theme/js/version_switch.js
Modified: trunk/blender_docs/resources/theme/js/version_switch.js
===================================================================
--- trunk/blender_docs/resources/theme/js/version_switch.js 2022-11-09 11:18:35 UTC (rev 9687)
+++ trunk/blender_docs/resources/theme/js/version_switch.js 2022-11-12 03:07:28 UTC (rev 9688)
@@ -1,4 +1,4 @@
-(function() {//switch: v1.3
+(function() {//switch: v1.4
"use strict";
var versionsFileUrl = "https://docs.blender.org/versions.json"
@@ -31,29 +31,33 @@
constructor(id) {
this.isOpen=false;
this.type = (id === "version-popover");
- this.$btn = $('#' + id);
- this.$dialog = this.$btn.next();
- this.$list = this.$dialog.children("ul");
+ this.btn = document.querySelector('#' + id);
+ this.dialog = this.btn.nextElementSibling;
+ this.list = this.dialog.querySelector("ul");
this.sel = null;
const that = this;
- this.$btn.on("click", function(e){that.init();e.preventDefault();e.stopPropagation();});
- this.$btn.on("keydown", function(e) { if(that.btnKeyFilter(e)){that.init();e.preventDefault();e.stopPropagation();} });
+ this.btnClickHandler = function(e) {that.init();e.preventDefault();e.stopPropagation();};
+ this.btnKeyHandler = function(e) {if(that.btnKeyFilter(e)){that.init();e.preventDefault();e.stopPropagation();} };
+ this.btn.addEventListener("click", this.btnClickHandler);
+ this.btn.addEventListener("keydown", this.btnKeyHandler);
}
init() {
- this.$btn.off("click");
- this.$btn.off("keydown");
+ this.btn.removeEventListener("click", this.btnClickHandler);
+ this.btn.removeEventListener("keydown", this.btnKeyHandler);
new Promise((resolve, reject) => {
if(all_versions === undefined) {
- this.$btn.addClass("wait");
- $.getJSON(versionsFileUrl, function(data) {
+ this.btn.classList.add("wait");
+ fetch(versionsFileUrl)
+ .then((response) => response.json())
+ .then((data) => {
all_versions = data;
resolve();
})
- .fail(() => {
+ .catch(() => {
console.error("Version Switch Error: versions.json could not be loaded.");
- this.$btn.addClass("disabled");
+ this.btn.classList.remove("disabled");
});
} else {
resolve();
@@ -71,14 +75,14 @@
const version = this.getNamed(release);
this.buildList(version, lang);
- this.$list.children(":first-child").remove();
+ this.list.firstElementChild.remove();
const that = this;
- this.$list.on("keydown", function(e) {that.keyMove(e);});
+ this.list.addEventListener("keydown", function(e) {that.keyMove(e);});
- this.$btn.removeClass("wait");
+ this.btn.classList.remove("wait");
this.btnOpenHandler();
- this.$btn.on("mousedown", function(e){that.btnOpenHandler(); e.preventDefault()});
- this.$btn.on("keydown", function(e){ if(that.btnKeyFilter(e)){that.btnOpenHandler();} });
+ this.btn.addEventListener("mousedown", function(e){that.btnOpenHandler(); e.preventDefault()});
+ this.btn.addEventListener("keydown", function(e){ if(that.btnKeyFilter(e)){that.btnOpenHandler();} });
});
}
warnOld(release, all_versions) {
@@ -96,14 +100,13 @@
if (m) {current = parseFloat(m[0]);}
if (release < current) {
const currentURL = window.location.pathname.replace(release, current);
- const warning = $(document.querySelector("template#version-warning").firstElementChild.cloneNode(true));
- warning
- .find('a')
- .attr('href', currentURL)
- .text(current);
+ const warning = document.querySelector("template#version-warning").firstElementChild.cloneNode(true);
+ const link = warning.querySelector('a');
+ link.setAttribute('href', currentURL);
+ link.textContent = current;
- let body = $("div.body");
- if (!body.length) {body = $("div.document");}
+ let body = document.querySelector("div.body");
+ if (!body.length) {body = document.querySelector("div.document");}
body.prepend(warning);
}
}
@@ -125,7 +128,7 @@
}
const that = this;
const template = document.querySelector("template#version-entry").content;
- $.each(dyn, function(ix, title) {
+ for (let [ix, title] of Object.entries(dyn)) {
let clone;
if (ix === cur) {
clone = template.querySelector("li.selected").cloneNode(true);
@@ -139,12 +142,12 @@
link.href = href;
link.innerHTML = title;
}
- that.$list.append(clone);
- });
- return this.$list;
+ that.list.append(clone);
+ };
+ return this.list;
}
getNamed(v) {
- $.each(all_versions, function(ix, title) {
+ for (let [ix, title] of Object.entries(all_versions)) {
if (ix === "dev" || ix === "latest") {
const m = title.match(/\d\.\d[\w\d\.]*/)[0];
if (parseFloat(m) == v) {
@@ -152,7 +155,7 @@
return false;
}
}
- });
+ };
return v;
}
dialogToggle(speed) {
@@ -159,25 +162,31 @@
const wasClose = !this.isOpen;
const that = this;
if(!this.isOpen) {
- this.$btn.addClass("version-btn-open");
- this.$btn.attr("aria-pressed", true);
- this.$dialog.attr("aria-hidden", false);
- this.$dialog.fadeIn(speed, function() {
- that.$btn.parent().on("focusout", function(e) {that.focusoutHandler(); e.stopImmediatePropagation();})
- that.$btn.parent().on("mouseleave", function(e){that.mouseoutHandler(); e.stopImmediatePropagation();});
+ this.btn.classList.add("version-btn-open");
+ this.btn.setAttribute("aria-pressed", true);
+ this.dialog.setAttribute("aria-hidden", false);
+ this.dialog.style.display = "block";
+ this.dialog.animate({opacity: [0, 1], easing: ['ease-in', 'ease-out']}, speed).finished
+ .then(() => {
+ this.focusoutHandlerPrime = function(e) {that.focusoutHandler(); e.stopImmediatePropagation();};
+ this.mouseoutHandlerPrime = function(e){that.mouseoutHandler(); e.stopImmediatePropagation();};
+ this.btn.parentNode.addEventListener("focusout", this.focusoutHandlerPrime);
+ this.btn.parentNode.addEventListener("mouseleave", this.mouseoutHandlerPrime);
});
this.isOpen = true;
} else {
- this.$btn.removeClass("version-btn-open");
- this.$btn.attr("aria-pressed", false);
- this.$dialog.attr("aria-hidden", true);
- this.$btn.parent().off("focusout");
- this.$btn.parent().off("mouseleave");
- this.$dialog.fadeOut(speed, function() {
- if (this.$sel) {this.$sel.attr("tabindex", -1);}
- that.$btn.attr("tabindex", 0);
+ this.btn.classList.remove("version-btn-open");
+ this.btn.setAttribute("aria-pressed", false);
+ this.dialog.setAttribute("aria-hidden", true);
+ this.btn.parentNode.removeEventListener("focusout", this.focusoutHandlerPrime);
+ this.btn.parentNode.removeEventListener("mouseleave", this.mouseoutHandlerPrime);
+ this.dialog.animate({opacity: [1, 0], easing: ['ease-in', 'ease-out']}, speed).finished
+ .then(() => {
+ this.dialog.style.display = "none";
+ if (this.sel) {this.sel.setAttribute("tabindex", -1);}
+ this.btn.setAttribute("tabindex", 0);
if(document.activeElement !== null && document.activeElement !== document && document.activeElement !== document.body) {
- that.$btn.focus();
+ this.btn.focus();
}
});
this.isOpen = false;
@@ -184,12 +193,12 @@
}
if(wasClose) {
- if (this.$sel) {this.$sel.attr("tabindex", -1);}
+ if (this.sel) {this.sel.setAttribute("tabindex", -1);}
if(document.activeElement !== null && document.activeElement !== document && document.activeElement !== document.body) {
- const $nw = this.listEnter();
- $nw.attr("tabindex", 0);
- $nw.focus();
- this.$sel = $nw;
+ const nw = this.listEnter();
+ nw.setAttribute("tabindex", 0);
+ nw.focus();
+ this.sel = nw;
}
}
}
@@ -197,10 +206,10 @@
this.dialogToggle(300);
}
focusoutHandler() {
- const list = this.$list;
+ const list = this.list;
const that = this;
setTimeout(function() {
- if (list.find(":focus").length === 0) {
+ if (!list.querySelector(":focus")) {
that.dialogToggle(200);
}
}, 200);
@@ -217,57 +226,57 @@
}
keyMove(e) {
if (e.ctrlKey || e.shiftKey) {return true;}
- let $nw = $(e.target);
+ let nw = e.target;
switch(e.key) {
- case "ArrowUp": $nw = this.listPrev($nw); break;
- case "ArrowDown": $nw = this.listNext($nw); break;
- case "Home": $nw = this.listFirst(); break;
- case "End": $nw = this.listLast(); break;
- case "Escape": $nw = this.listExit(); break;
- case "ArrowLeft": $nw = this.listExit(); break;
- case "ArrowRight": $nw = this.listExit(); break;
+ case "ArrowUp": nw = this.listPrev(nw); break;
+ case "ArrowDown": nw = this.listNext(nw); break;
+ case "Home": nw = this.listFirst(); break;
+ case "End": nw = this.listLast(); break;
+ case "Escape": nw = this.listExit(); break;
+ case "ArrowLeft": nw = this.listExit(); break;
+ case "ArrowRight": nw = this.listExit(); break;
default: return false;
}
- $nw.attr("tabindex", 0);
- $nw.focus();
- if (this.$sel) {this.$sel.attr("tabindex", -1);}
- this.$sel = $nw;
+ nw.setAttribute("tabindex", 0);
+ nw.focus();
+ if (this.sel) {this.sel.setAttribute("tabindex", -1);}
+ this.sel = nw;
e.preventDefault();
e.stopPropagation();
}
-listPrev($nw) {
- if ($nw.parent().prev().length !== 0) {
- return $nw.parent().prev().children(":first-child");
+listPrev(nw) {
+ if (nw.parentNode.previousElementSibling.length !== 0) {
+ return nw.parentNode.previousElementSibling.firstElementChild;
} else {
return this.listLast();
}
}
-listNext($nw) {
- if ($nw.parent().next().length !== 0) {
- return $nw.parent().next().children(":first-child");
+listNext(nw) {
+ if (nw.parentNode.nextElementSibling.length !== 0) {
+ return nw.parentNode.nextElementSibling.firstElementChild;
} else {
return this.listFirst();
}
}
listFirst() {
- return this.$list.children(":first-child").children(":first-child");
+ return this.list.firstElementChild.firstElementChild;
}
listLast() {
- return this.$list.children(":last-child").children(":first-child");
+ return this.list.lastElementChild.firstElementChild;
}
listExit() {
this.mouseoutHandler();
- return this.$btn;
+ return this.btn;
}
listEnter() {
- return this.$list.children(":first-child").children(":first-child");
+ return this.list.firstElementChild.firstElementChild;
}
}
-$(document).ready(function() {
+document.addEventListener('DOMContentLoaded', () => {
let lang = DOCUMENTATION_OPTIONS.LANGUAGE;
if(!lang || lang === "None") {lang = "en";}
- if(all_langs.hasOwnProperty(lang)) {$("#lang-popover").html(all_langs[lang]);}
+ if(all_langs.hasOwnProperty(lang)) {document.querySelector("#lang-popover").innerHTML = all_langs[lang];}
new Popover("version-popover");
new Popover("lang-popover");
});
More information about the Bf-docboard-svn
mailing list