User:Xavier/common.js - Revision history

Xavier: Replaced content with "/* */"

2022-01-27T05:36:24Z

Replaced content with "‎: "

Show changes

Xavier at 05:33, January 27, 2022

2022-01-27T05:33:05Z

Show changes

Xavier at 05:31, January 27, 2022

2022-01-27T05:31:35Z

Xavier at 05:27, January 27, 2022

2022-01-27T05:27:28Z

Xavier at 05:25, January 27, 2022

2022-01-27T05:25:21Z

Xavier: Created page with "// Highlighting HTML Access Keys by Christian Schmidt // This code may be freely used, copied, modified, distributed etc. // Iterates through all elements that support the AC..."

2022-01-27T05:16:36Z

Created page with "// Highlighting HTML Access Keys by Christian Schmidt // This code may be freely used, copied, modified, distributed etc. // Iterates through all elements that support the AC..."

New page

// Highlighting HTML Access Keys by Christian Schmidt
// This code may be freely used, copied, modified, distributed etc.

// Iterates through all elements that support the ACCESSKEY attribute.
function highlightAccessKeys() {
//don't do anything in old browsers
if (!document.getElementsByTagName) return;

var labels = document.getElementsByTagName('LABEL');
for (var i = 0; i < labels.length; i++) {
var control = document.getElementById(labels[i].htmlFor);
if (control && control.accessKey) {
highlightAccessKey(labels[i], control.accessKey);
} else if (labels[i].accessKey) {
highlightAccessKey(labels[i], labels[i].accessKey);
}
}

var tagNames = new Array('A', 'BUTTON', 'LEGEND');
for (var j = 0; j < tagNames.length; j++) {
var elements = document.getElementsByTagName(tagNames[j]);
for (var i = 0; i < elements.length; i++) {
if (elements[i].accessKey) {
highlightAccessKey(elements[i], elements[i].accessKey);
}
}
}
}

// Highlights the specified character in the specified element
function highlightAccessKey(e, accessKey) {
if (e.hasChildNodes()) {
var childNode, txt;

//find the first text node that contains the access character
for (var i = 0; i < e.childNodes.length; i++) {
txt = e.childNodes[i].nodeValue;
if (e.childNodes[i].nodeType == 3 &&
txt.toLowerCase().indexOf(accessKey.toLowerCase()) != -1) {

childNode = e.childNodes[i];
break;
}
}

if (!childNode) {
//access character was not found
return;
}

var pos = txt.toLowerCase().indexOf(accessKey.toLowerCase());
var span = document.createElement('SPAN');
var spanText = document.createTextNode(txt.substr(pos, 1));
span.className = 'accesskey';
span.appendChild(spanText);

//the text before the access key
var text1 = document.createTextNode(txt.substr(0, pos));
//the text after the access key
var text2 = document.createTextNode(txt.substr(pos + 1));

if (text1.length > 0) e.insertBefore(text1, childNode);
e.insertBefore(span, childNode);
if (text2.length > 0) e.insertBefore(text2, childNode);

e.removeChild(childNode);
}
}

@@ Line 58: / Line 58: @@
    function doFetch() {
-     fetch('https://all.docs.genesys.com/User:Xavier/shortcutkeys.html')
+     fetch('question.mark.html')
        .then((response) => {
          return response.text();

@@ Line 58: / Line 58: @@
    function doFetch() {
-     fetch('question.mark.html')
+     fetch('https://all.docs.genesys.com/User:Xavier/shortcutkeys.html')
        .then((response) => {
          return response.text();

@@ Line 1: / Line 1: @@
-// Highlighting HTML Access Keys by Christian Schmidt
+/*
-// This code may be freely used, copied, modified, distributed etc.
+  QuestionMark.js 2.0 by Louis Lazaris
-// Iterates through all elements that support the ACCESSKEY attribute.
+(function (d) {
-function highlightAccessKeys() {
+  'use strict';
-    var labels = document.getElementsByTagName('LABEL');
+  function removeModal(helpUnderlay) {
-     for (var i = 0; i < labels.length; i++) {
+     helpUnderlay.classList.remove('help-isVisible');
-        var control = document.getElementById(labels[i].htmlFor);
-    var tagNames = new Array('A', 'BUTTON', 'LEGEND');
+  function doWhichKey(e) {
-     for (var j = 0; j < tagNames.length; j++) {
+     let charCode = e.keyCode;
-        var elements = document.getElementsByTagName(tagNames[j]);
+    // String.fromCharCode(charCode) gets the keycode if you want
-        for (var i = 0; i < elements.length; i++) {
+    return charCode;
-            if (elements[i].accessKey) {
-// Highlights the specified character in the specified element
+  // Primary function, called in checkServerResponse()
-function highlightAccessKey(e, accessKey) {
+  function doQuestionMark() {
-     if (e.hasChildNodes()) {
+     let helpUnderlay = d.getElementById('helpUnderlay'),
-        var childNode, txt;
+         helpModal = d.getElementById('helpModal'),
+        helpClose = d.getElementById('helpClose'),
-        //find the first text node that contains the access character
+         classCol;
-        var pos = txt.toLowerCase().indexOf(accessKey.toLowerCase());
+    d.addEventListener('keydown', function (e) {
-        var span = document.createElement('SPAN');
+      // 191 = '?' key
-        var spanText = document.createTextNode(txt.substr(pos, 1));
+      // '?' key toggles the modal
-         span.className = 'accesskey';
+      if (doWhichKey(e) === 191 && e.shiftKey === true) {
-        span.appendChild(spanText);
+         helpUnderlay.classList.add('help-isVisible');
-        //the text before the access key
+    d.addEventListener('keyup', function (e) {
-        var text1 = document.createTextNode(txt.substr(0, pos));
+      // 27 = ESC key
-        //the text after the access key
+      if (doWhichKey(e) === 27) {
-        var text2 = document.createTextNode(txt.substr(pos + 1));
+         removeModal(helpUnderlay);
-−
+      }
-        if (text1.length > 0) e.insertBefore(text1, childNode);
+    }, false);
-        e.removeChild(childNode);
+    // Modal is removed if the background is clicked
+    helpUnderlay.addEventListener('click', function () {
+      removeModal(helpUnderlay);