fix(v1): convert scripts to ES5 syntax for IE 10 (#2063)

This commit is contained in:
Huáng Jùnliàng 2019-11-28 14:44:11 -05:00 committed by Yangshun Tay
parent 25207df4a7
commit 34e942e835
2 changed files with 27 additions and 20 deletions

View file

@ -4,27 +4,27 @@
* This source code is licensed under the MIT license found in the * This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree. * LICENSE file in the root directory of this source tree.
*/ */
// Turn off ESLint for this file because it's sent down to users as-is. // Turn off ESLint for this file because it's sent down to users as-is.
/* eslint-disable */ /* eslint-disable */
window.addEventListener('load', function() { window.addEventListener('load', function() {
// add event listener for all tab // add event listener for all tab
document.querySelectorAll('.nav-link').forEach(function(el) { document.querySelectorAll('.nav-link').forEach(function(el) {
el.addEventListener('click', function(e) { el.addEventListener('click', function(e) {
const groupId = e.target.getAttribute('data-group'); var groupId = e.target.getAttribute('data-group');
document document
.querySelectorAll(`.nav-link[data-group=${groupId}]`) .querySelectorAll('.nav-link[data-group='.concat(groupId, ']'))
.forEach(function(el) { .forEach(function(el) {
el.classList.remove('active'); el.classList.remove('active');
}); });
document document
.querySelectorAll(`.tab-pane[data-group=${groupId}]`) .querySelectorAll('.tab-pane[data-group='.concat(groupId, ']'))
.forEach(function(el) { .forEach(function(el) {
el.classList.remove('active'); el.classList.remove('active');
}); });
e.target.classList.add('active'); e.target.classList.add('active');
document document
.querySelector(`#${e.target.getAttribute('data-tab')}`) .querySelector('#'.concat(e.target.getAttribute('data-tab')))
.classList.add('active'); .classList.add('active');
}); });
}); });

View file

@ -5,50 +5,56 @@
* LICENSE file in the root directory of this source tree. * LICENSE file in the root directory of this source tree.
*/ */
/* eslint-disable prefer-arrow-callback */ /* eslint-disable */
(function scrollSpy() { (function scrollSpy() {
const OFFSET = 10; var OFFSET = 10;
let timer; var timer;
let headingsCache; var headingsCache;
const findHeadings = function findHeadings() {
var findHeadings = function findHeadings() {
return headingsCache || document.querySelectorAll('.toc-headings > li > a'); return headingsCache || document.querySelectorAll('.toc-headings > li > a');
}; };
const onScroll = function onScroll() {
var onScroll = function onScroll() {
if (timer) { if (timer) {
// throttle // throttle
return; return;
} }
timer = setTimeout(function() { timer = setTimeout(function() {
timer = null; timer = null;
let activeNavFound = false; var activeNavFound = false;
const headings = findHeadings(); // toc nav anchors var headings = findHeadings(); // toc nav anchors
/** /**
* On every call, try to find header right after <-- next header * On every call, try to find header right after <-- next header
* the one whose content is on the current screen <-- highlight this * the one whose content is on the current screen <-- highlight this
*/ */
for (let i = 0; i < headings.length; i++) {
for (var i = 0; i < headings.length; i++) {
// headings[i] is current element // headings[i] is current element
// if an element is already active, then current element is not active // if an element is already active, then current element is not active
// if no element is already active, then current element is active // if no element is already active, then current element is active
let currNavActive = !activeNavFound; var currNavActive = !activeNavFound;
/** /**
* Enter the following check up only when an active nav header is not yet found * Enter the following check up only when an active nav header is not yet found
* Then, check the bounding rectangle of the next header * Then, check the bounding rectangle of the next header
* The headers that are scrolled passed will have negative bounding rect top * The headers that are scrolled passed will have negative bounding rect top
* So the first one with positive bounding rect top will be the nearest next header * So the first one with positive bounding rect top will be the nearest next header
*/ */
if (currNavActive && i < headings.length - 1) { if (currNavActive && i < headings.length - 1) {
const heading = headings[i + 1]; var heading = headings[i + 1];
const next = decodeURIComponent(heading.href.split('#')[1]); var next = decodeURIComponent(heading.href.split('#')[1]);
const nextHeader = document.getElementById(next); var nextHeader = document.getElementById(next);
if (nextHeader) { if (nextHeader) {
const top = nextHeader.getBoundingClientRect().top; var top = nextHeader.getBoundingClientRect().top;
currNavActive = top > OFFSET; currNavActive = top > OFFSET;
} else { } else {
console.error('Can not find header element', { console.error('Can not find header element', {
id: next, id: next,
heading, heading: heading,
}); });
} }
} }
@ -56,6 +62,7 @@
* Stop searching once a first such header is found, * Stop searching once a first such header is found,
* this makes sure the highlighted header is the most current one * this makes sure the highlighted header is the most current one
*/ */
if (currNavActive) { if (currNavActive) {
activeNavFound = true; activeNavFound = true;
headings[i].classList.add('active'); headings[i].classList.add('active');