Cleanup CSS and JS code

This commit is contained in:
djmaze 2020-10-01 11:10:40 +02:00
parent 0eea2cb5ad
commit 6c75dd12f8
19 changed files with 82 additions and 146 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 12 KiB

View file

@ -4,13 +4,10 @@
* Licensed under MIT (https://github.com/thednp/bootstrap.native/blob/master/LICENSE)
*/
window.BSN = (() => {
'use strict';
(doc => {
const setFocus = element => element.focus ? element.focus() : element.setActive();
const doc = document,
setFocus = element => element.focus ? element.focus() : element.setActive();
return {
this.BSN = {
Dropdown: function(element) {
let menu, menuItems = [];
const self = this,
@ -20,30 +17,29 @@ window.BSN = (() => {
(href && href.slice(-1) === '#') && e.preventDefault();
},
toggleEvents = () => {
let action = element.open ? 'addEventListener' : 'removeEventListener';
doc[action]('click',dismissHandler,false);
doc[action]('keydown',preventScroll,false);
doc[action]('keyup',keyHandler,false);
doc[action]('focus',dismissHandler,false);
let action = (element.open ? 'add' : 'remove') + 'EventListener';
doc[action]('click',dismissHandler);
doc[action]('keydown',preventScroll);
doc[action]('keyup',keyHandler);
doc[action]('focus',dismissHandler);
},
dismissHandler = e => {
let eventTarget = e.target,
inside = menu.contains(eventTarget),
hasData = eventTarget && (eventTarget.getAttribute('data-toggle')
|| (eventTarget.parentNode && eventTarget.parentNode.getAttribute('data-toggle')));
if ((e.type === 'focus' && (eventTarget === element || inside))
|| (hasData && inside)
if (!(hasData && inside)
&& !(e.type === 'focus' && (inside || eventTarget === element))
) {
return;
self.hide();
preventEmptyAnchor(e);
}
self.hide();
preventEmptyAnchor(e);
},
clickHandler = e => {
self.show();
preventEmptyAnchor(e);
},
preventScroll = e => (e.code === 'ArrowUp' || e.code === 'ArrowDown') && e.preventDefault(),
preventScroll = e => (e.key === 'ArrowUp' || e.key === 'ArrowDown') && e.preventDefault(),
keyHandler = e => {
let activeItem = doc.activeElement,
isSameElement = activeItem === element,
@ -52,14 +48,14 @@ window.BSN = (() => {
idx = menuItems.indexOf(activeItem);
if ( isMenuItem ) {
idx = isSameElement ? 0
: e.code === 'ArrowUp' ? (idx>1?idx-1:0)
: e.code === 'ArrowDown' ? (idx<menuItems.length-1?idx+1:idx) : idx;
: e.key === 'ArrowUp' ? (idx>1?idx-1:0)
: e.key === 'ArrowDown' ? (idx<menuItems.length-1?idx+1:idx) : idx;
menuItems[idx] && setFocus(menuItems[idx]);
}
if ( (menuItems.length && isMenuItem
|| !menuItems.length && (isInsideMenu || isSameElement)
|| !isInsideMenu )
&& element.open && e.code === 'Escape'
&& element.open && e.key === 'Escape'
) {
self.toggle();
}
@ -76,7 +72,7 @@ window.BSN = (() => {
parent.classList.add('show');
element.setAttribute('aria-expanded',true);
element.open = true;
element.removeEventListener('click',clickHandler,false);
element.removeEventListener('click',clickHandler);
setTimeout(() => {
setFocus( menu.getElementsByTagName('INPUT')[0] || element );
toggleEvents();
@ -89,10 +85,10 @@ window.BSN = (() => {
element.open = false;
toggleEvents();
setFocus(element);
setTimeout(() => element.Dropdown && element.addEventListener('click',clickHandler,false), 1);
setTimeout(() => element.Dropdown && element.addEventListener('click',clickHandler), 1);
};
self.toggle = () => (parent.classList.contains('show') && element.open) ? self.hide() : self.show();
element.addEventListener('click',clickHandler,false);
element.addEventListener('click',clickHandler);
element.open = false;
element.Dropdown = self;
},
@ -101,7 +97,10 @@ window.BSN = (() => {
constructor(element) {
this.element = element
element.Tab = this;
element.addEventListener('click', e => {e.preventDefault();this.show();});
element.addEventListener('click', e => {
e.preventDefault();
this.show();
});
}
show() {
@ -117,4 +116,4 @@ window.BSN = (() => {
}
};
})();
})(document);

View file

@ -1,7 +0,0 @@
/*!
* Native JavaScript for Bootstrap v3.0.10 (https://thednp.github.io/bootstrap.native/)
* Copyright 2015-2020 © dnp_theme
* Licensed under MIT (https://github.com/thednp/bootstrap.native/blob/master/LICENSE)
*/
window.BSN=(()=>{"use strict";const e=document,t=e=>e.focus?e.focus():e.setActive();return{Dropdown:function(s){let o,n=[];const r=this,i=s.parentNode,a=e=>{const t=e.target,s=t.href||t.parentNode&&t.parentNode.href;s&&"#"===s.slice(-1)&&e.preventDefault()},c=()=>{let t=s.open?"addEventListener":"removeEventListener";e[t]("click",d,!1),e[t]("keydown",h,!1),e[t]("keyup",p,!1),e[t]("focus",d,!1)},d=e=>{let t=e.target,n=o.contains(t),i=t&&(t.getAttribute("data-toggle")||t.parentNode&&t.parentNode.getAttribute("data-toggle"));"focus"===e.type&&(t===s||n)||i&&n||(r.hide(),a(e))},l=e=>{r.show(),a(e)},h=e=>("ArrowUp"===e.code||"ArrowDown"===e.code)&&e.preventDefault(),p=i=>{let a=e.activeElement,c=a===s,d=o.contains(a),l=a.parentNode===o||a.parentNode.parentNode===o,h=n.indexOf(a);l&&(h=c?0:"ArrowUp"===i.code?h>1?h-1:0:"ArrowDown"===i.code&&h<n.length-1?h+1:h,n[h]&&t(n[h])),(n.length&&l||!n.length&&(d||c)||!d)&&s.open&&"Escape"===i.code&&r.toggle()};r.show=(()=>{o=i.querySelector(".dropdown-menu"),n=[],[...o.children].forEach(e=>{e.children.length&&"A"===e.children[0].tagName&&n.push(e.children[0]),"A"===e.tagName&&n.push(e)}),!("tabindex"in o)&&o.setAttribute("tabindex","0"),o.classList.add("show"),i.classList.add("show"),s.setAttribute("aria-expanded",!0),s.open=!0,s.removeEventListener("click",l,!1),setTimeout(()=>{t(o.getElementsByTagName("INPUT")[0]||s),c()},1)}),r.hide=(()=>{o.classList.remove("show"),i.classList.remove("show"),s.setAttribute("aria-expanded",!1),s.open=!1,c(),t(s),setTimeout(()=>s.Dropdown&&s.addEventListener("click",l,!1),1)}),r.toggle=(()=>i.classList.contains("show")&&s.open?r.hide():r.show()),s.addEventListener("click",l,!1),s.open=!1,s.Dropdown=r},Tab:class{constructor(e){this.element=e,e.Tab=this,e.addEventListener("click",e=>{e.preventDefault(),this.show()})}show(){const t=this.element,s=t.closest("li");if(!s.classList.contains("active")){const o=t.closest("ul").querySelector(".active a");o.closest("li").classList.remove("active"),e.querySelector(o.getAttribute("href")).classList.remove("active"),s.classList.add("active"),e.querySelector(t.getAttribute("href")).classList.add("active")}}}}})();

View file

@ -130,12 +130,6 @@
@zindexModal: 1101;
// Sprite icons path
// -------------------------
@iconSpritePath: "../img/glyphicons-halflings.png";
@iconWhiteSpritePath: "../img/glyphicons-halflings-white.png";
// Input placeholder text color
// -------------------------
@placeholderText: @grayLight;