76 lines
2.9 KiB
JavaScript
76 lines
2.9 KiB
JavaScript
|
(function() {
|
||
|
|
var chars = document.getElementsByClassName('ascii-char'),
|
||
|
|
search = document.getElementById('search');
|
||
|
|
|
||
|
|
function charsFilter(filter) {
|
||
|
|
if(!filter) {
|
||
|
|
for(var i = 0; i < chars.length; ++i)
|
||
|
|
chars[i].classList.remove('hidden');
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
filter = filter.toLowerCase();
|
||
|
|
|
||
|
|
for(var i = 0; i < chars.length; ++i) {
|
||
|
|
var chr = chars[i],
|
||
|
|
code = (chr.dataset.keyCode || 0).toString().toLowerCase(),
|
||
|
|
print = (chr.dataset.keyPrint || "\0").toString().toLowerCase(),
|
||
|
|
desc = (chr.dataset.keyDesc || '').toString().toLowerCase(),
|
||
|
|
html = (chr.dataset.keyHtml || "\0").toString().toLowerCase(),
|
||
|
|
codeInt = parseInt(code),
|
||
|
|
isMatch = (filter === 'printable' && (codeInt > 31 && codeInt < 127))
|
||
|
|
|| (filter === 'control' && (codeInt < 32 || codeInt === 127))
|
||
|
|
|| code == filter || print == filter
|
||
|
|
|| html == filter || desc.indexOf(filter) >= 0;
|
||
|
|
chr.classList[isMatch ? 'remove' : 'add']('hidden');
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
window.addEventListener('scroll', function() {
|
||
|
|
var hidden = document.getElementsByClassName('js-hidden-on-scroll'),
|
||
|
|
invisible = document.getElementsByClassName('js-invisible-on-scroll'),
|
||
|
|
atTop = window.scrollY === 0;
|
||
|
|
|
||
|
|
for(var i = 0; i < hidden.length; ++i)
|
||
|
|
hidden[i].classList[atTop ? 'remove' : 'add']('hidden');
|
||
|
|
for(var i = 0; i < invisible.length; ++i)
|
||
|
|
invisible[i].classList[atTop ? 'remove' : 'add']('invisible');
|
||
|
|
});
|
||
|
|
search.addEventListener('keyup', function() {
|
||
|
|
location.hash = search.value.trim();
|
||
|
|
});
|
||
|
|
window.addEventListener('hashchange', function() {
|
||
|
|
charsFilter(decodeURIComponent((location.hash || '#').substring(1)));
|
||
|
|
});
|
||
|
|
if(location.hash.length > 0) {
|
||
|
|
search.value = location.hash.substring(1).trim();
|
||
|
|
charsFilter(search.value);
|
||
|
|
}
|
||
|
|
|
||
|
|
for(var i = 0; i < chars.length; ++i) {
|
||
|
|
chars[i].addEventListener('click', function(ev) {
|
||
|
|
var target = ev.target;
|
||
|
|
|
||
|
|
while(target !== null && typeof target.dataset.copy === 'undefined') {
|
||
|
|
target = target.parentNode || null;
|
||
|
|
|
||
|
|
if(target.classList.contains('char'))
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
|
||
|
|
if(target === null || typeof target.dataset.copy === 'undefined')
|
||
|
|
return;
|
||
|
|
|
||
|
|
var doCopy = function() { navigator.clipboard.writeText(target.dataset.copy); };
|
||
|
|
|
||
|
|
if(typeof window.mozInnerScreenX !== 'undefined')
|
||
|
|
doCopy();
|
||
|
|
else
|
||
|
|
navigator.permissions.query({name: 'clipboard-write'}).then(function(res) {
|
||
|
|
if(res.state === 'granted' || res.state === 'prompt')
|
||
|
|
doCopy();
|
||
|
|
});
|
||
|
|
});
|
||
|
|
}
|
||
|
|
})();
|