mirror of
https://github.com/the-djmaze/snappymail.git
synced 2026-09-03 22:47:03 +03:00
More jQuery to native (including bootstrap.js)
This commit is contained in:
djmaze
parent
bdb36ec128
commit
69fcc240e9
39 changed files with 496 additions and 344 deletions
221
vendors/bootstrap/js/bootstrap.native.js
vendored
Normal file
221
vendors/bootstrap/js/bootstrap.native.js
vendored
Normal file
|
|
@ -0,0 +1,221 @@
|
|||
/*!
|
||||
* 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 transitionEndEvent = 'transitionend',
|
||||
doc = document,
|
||||
body = doc.body;
|
||||
|
||||
function getElementTransitionDuration(element) {
|
||||
var duration = parseFloat(getComputedStyle(element).transitionDuration);
|
||||
duration = typeof duration === 'number' && !isNaN(duration) ? duration * 1000 : 0;
|
||||
return duration;
|
||||
}
|
||||
|
||||
function emulateTransitionEnd(element,handler){
|
||||
var called = 0, duration = getElementTransitionDuration(element);
|
||||
duration ? element.addEventListener( transitionEndEvent, function transitionEndWrapper(e){
|
||||
!called && handler(e), called = 1;
|
||||
element.removeEventListener( transitionEndEvent, transitionEndWrapper);
|
||||
})
|
||||
: setTimeout(() => { !called && handler(), called = 1; }, 17);
|
||||
}
|
||||
|
||||
function queryElement(selector, parent) {
|
||||
var lookUp = parent && parent instanceof Element ? parent : doc;
|
||||
return selector instanceof Element ? selector : lookUp.querySelector(selector);
|
||||
}
|
||||
|
||||
function setFocus (element){
|
||||
element.focus ? element.focus() : element.setActive();
|
||||
}
|
||||
|
||||
function Dropdown(element) {
|
||||
var self = this,
|
||||
parent, menu, menuItems = [];
|
||||
function preventEmptyAnchor(anchor) {
|
||||
(anchor.href && anchor.href.slice(-1) === '#' || anchor.parentNode && anchor.parentNode.href
|
||||
&& anchor.parentNode.href.slice(-1) === '#') && this.preventDefault();
|
||||
}
|
||||
function toggleDismiss() {
|
||||
var 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);
|
||||
}
|
||||
function dismissHandler(e) {
|
||||
var eventTarget = e.target,
|
||||
hasData = eventTarget && (eventTarget.getAttribute('data-toggle')
|
||||
|| eventTarget.parentNode && eventTarget.parentNode.getAttribute
|
||||
&& eventTarget.parentNode.getAttribute('data-toggle'));
|
||||
if ( e.type === 'focus' && (eventTarget === element || eventTarget === menu || menu.contains(eventTarget) ) ) {
|
||||
return;
|
||||
}
|
||||
if ( hasData && (eventTarget === menu || menu.contains(eventTarget)) ) { return; }
|
||||
self.hide();
|
||||
preventEmptyAnchor.call(e,eventTarget);
|
||||
}
|
||||
function clickHandler(e) {
|
||||
self.show();
|
||||
preventEmptyAnchor.call(e,e.target);
|
||||
}
|
||||
function preventScroll(e) {
|
||||
var key = e.which || e.keyCode;
|
||||
if( key === 38 || key === 40 ) { e.preventDefault(); }
|
||||
}
|
||||
function keyHandler(e) {
|
||||
var key = e.which || e.keyCode,
|
||||
activeItem = doc.activeElement,
|
||||
isSameElement = activeItem === element,
|
||||
isInsideMenu = menu.contains(activeItem),
|
||||
isMenuItem = activeItem.parentNode === menu || activeItem.parentNode.parentNode === menu,
|
||||
idx = menuItems.indexOf(activeItem);
|
||||
if ( isMenuItem ) {
|
||||
idx = isSameElement ? 0
|
||||
: key === 38 ? (idx>1?idx-1:0)
|
||||
: key === 40 ? (idx<menuItems.length-1?idx+1:idx) : idx;
|
||||
menuItems[idx] && setFocus(menuItems[idx]);
|
||||
}
|
||||
if ( (menuItems.length && isMenuItem
|
||||
|| !menuItems.length && (isInsideMenu || isSameElement)
|
||||
|| !isInsideMenu )
|
||||
&& element.open && key === 27
|
||||
) {
|
||||
self.toggle();
|
||||
}
|
||||
}
|
||||
self.show = () => {
|
||||
menu.classList.add('show');
|
||||
parent.classList.add('show');
|
||||
element.setAttribute('aria-expanded',true);
|
||||
element.open = true;
|
||||
element.removeEventListener('click',clickHandler,false);
|
||||
setTimeout(() => {
|
||||
setFocus( menu.getElementsByTagName('INPUT')[0] || element );
|
||||
toggleDismiss();
|
||||
},1);
|
||||
};
|
||||
self.hide = () => {
|
||||
menu.classList.remove('show');
|
||||
parent.classList.remove('show');
|
||||
element.setAttribute('aria-expanded',false);
|
||||
element.open = false;
|
||||
toggleDismiss();
|
||||
setFocus(element);
|
||||
setTimeout(() => element.Dropdown && element.addEventListener('click',clickHandler,false), 1);
|
||||
};
|
||||
self.toggle = () => (parent.classList.contains('show') && element.open) ? self.hide() : self.show();
|
||||
parent = element.parentNode;
|
||||
menu = queryElement('.dropdown-menu', parent);
|
||||
Array.from(menu.children).forEach(child => {
|
||||
child.children.length && (child.children[0].tagName === 'A' && menuItems.push(child.children[0]));
|
||||
child.tagName === 'A' && menuItems.push(child);
|
||||
});
|
||||
if ( !element.Dropdown ) {
|
||||
!('tabindex' in menu) && menu.setAttribute('tabindex', '0');
|
||||
element.addEventListener('click',clickHandler,false);
|
||||
}
|
||||
element.open = false;
|
||||
element.Dropdown = self;
|
||||
}
|
||||
|
||||
function Modal(modal) {
|
||||
var scrollBarWidth;
|
||||
function setScrollbar() {
|
||||
var openModal = body.classList.contains('modal-open'),
|
||||
bodyPad = parseInt(getComputedStyle(body).paddingRight),
|
||||
bodyOverflow = doc.documentElement.clientHeight !== doc.documentElement.scrollHeight
|
||||
|| body.clientHeight !== body.scrollHeight,
|
||||
modalOverflow = modal.clientHeight !== modal.scrollHeight;
|
||||
scrollBarWidth = measureScrollbar();
|
||||
modal.style.paddingRight = !modalOverflow && scrollBarWidth ? scrollBarWidth + "px" : '';
|
||||
body.style.paddingRight = modalOverflow || bodyOverflow
|
||||
? (bodyPad + (openModal ? 0:scrollBarWidth)) + "px"
|
||||
: '';
|
||||
}
|
||||
function resetScrollbar() {
|
||||
body.style.paddingRight = '';
|
||||
modal.style.paddingRight = '';
|
||||
}
|
||||
function measureScrollbar() {
|
||||
var scrollDiv = doc.createElement('div'), widthValue;
|
||||
scrollDiv.className = 'modal-scrollbar-measure';
|
||||
body.appendChild(scrollDiv);
|
||||
widthValue = scrollDiv.offsetWidth - scrollDiv.clientWidth;
|
||||
body.removeChild(scrollDiv);
|
||||
return widthValue;
|
||||
}
|
||||
function toggleEvents(action) {
|
||||
action = action ? 'addEventListener' : 'removeEventListener';
|
||||
window[action]( 'resize', () => modal.classList.contains('show') && setScrollbar(), { passive: true });
|
||||
}
|
||||
function beforeShow() {
|
||||
modal.style.display = 'block';
|
||||
setScrollbar();
|
||||
!doc.getElementsByClassName('modal show')[0] && body.classList.add('modal-open');
|
||||
modal.classList.add('show');
|
||||
modal.setAttribute('aria-hidden', false);
|
||||
modal.classList.contains('fade') ? emulateTransitionEnd(modal, triggerShow) : triggerShow();
|
||||
}
|
||||
function triggerShow() {
|
||||
setFocus(modal);
|
||||
modal.isAnimating = false;
|
||||
toggleEvents(1);
|
||||
}
|
||||
function triggerHide() {
|
||||
modal.style.display = '';
|
||||
body.classList.remove('modal-open');
|
||||
resetScrollbar();
|
||||
toggleEvents();
|
||||
modal.isAnimating = false;
|
||||
}
|
||||
this.show = () => {
|
||||
if (!modal.classList.contains('show') || !modal.isAnimating) {
|
||||
modal.isAnimating = true;
|
||||
doc.getElementsByClassName('modal show')[0] ? beforeShow() : setTimeout( beforeShow, 0 );
|
||||
}
|
||||
};
|
||||
this.hide = () => {
|
||||
if (modal.classList.contains('show') ) {
|
||||
modal.isAnimating = true;
|
||||
modal.classList.remove('show');
|
||||
modal.setAttribute('aria-hidden', true);
|
||||
modal.classList.contains('fade') ? emulateTransitionEnd(modal, triggerHide) : triggerHide();
|
||||
}
|
||||
};
|
||||
modal.isAnimating = false;
|
||||
modal.Modal = this;
|
||||
}
|
||||
|
||||
class Tab {
|
||||
constructor(element) {
|
||||
this.element = element
|
||||
element.Tab = this;
|
||||
element.addEventListener('click', e => {e.preventDefault();this.show();});
|
||||
}
|
||||
|
||||
show() {
|
||||
const el = this.element, li = el.closest('li');
|
||||
if (!li.classList.contains('active')) {
|
||||
const previous = el.closest('ul').querySelector('.active a');
|
||||
previous.closest('li').classList.remove('active');
|
||||
queryElement(previous.getAttribute('href')).classList.remove('active');
|
||||
li.classList.add('active');
|
||||
queryElement(el.getAttribute('href')).classList.add('active');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
Dropdown: Dropdown,
|
||||
Modal: Modal,
|
||||
Tab: Tab
|
||||
};
|
||||
|
||||
})();
|
||||
7
vendors/bootstrap/js/bootstrap.native.min.js
vendored
Normal file
7
vendors/bootstrap/js/bootstrap.native.min.js
vendored
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
/*!
|
||||
* 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="transitionend",t=document,n=t.body;function s(t,n){var s=0;(function(e){var t=parseFloat(getComputedStyle(e).transitionDuration);return t="number"!=typeof t||isNaN(t)?0:1e3*t})(t)?t.addEventListener(e,function i(a){!s&&n(a),s=1,t.removeEventListener(e,i)}):setTimeout(()=>{!s&&n(),s=1},17)}function i(e,n){var s=n&&n instanceof Element?n:t;return e instanceof Element?e:s.querySelector(e)}function a(e){e.focus?e.focus():e.setActive()}return{Dropdown:function(e){var n,s,o=this,c=[];function r(e){(e.href&&"#"===e.href.slice(-1)||e.parentNode&&e.parentNode.href&&"#"===e.parentNode.href.slice(-1))&&this.preventDefault()}function l(){var n=e.open?"addEventListener":"removeEventListener";t[n]("click",d,!1),t[n]("keydown",u,!1),t[n]("keyup",m,!1),t[n]("focus",d,!1)}function d(t){var n=t.target,i=n&&(n.getAttribute("data-toggle")||n.parentNode&&n.parentNode.getAttribute&&n.parentNode.getAttribute("data-toggle"));("focus"!==t.type||n!==e&&n!==s&&!s.contains(n))&&(i&&(n===s||s.contains(n))||(o.hide(),r.call(t,n)))}function h(e){o.show(),r.call(e,e.target)}function u(e){var t=e.which||e.keyCode;38!==t&&40!==t||e.preventDefault()}function m(n){var i=n.which||n.keyCode,r=t.activeElement,l=r===e,d=s.contains(r),h=r.parentNode===s||r.parentNode.parentNode===s,u=c.indexOf(r);h&&(u=l?0:38===i?u>1?u-1:0:40===i&&u<c.length-1?u+1:u,c[u]&&a(c[u])),(c.length&&h||!c.length&&(d||l)||!d)&&e.open&&27===i&&o.toggle()}o.show=(()=>{s.classList.add("show"),n.classList.add("show"),e.setAttribute("aria-expanded",!0),e.open=!0,e.removeEventListener("click",h,!1),setTimeout(()=>{a(s.getElementsByTagName("INPUT")[0]||e),l()},1)}),o.hide=(()=>{s.classList.remove("show"),n.classList.remove("show"),e.setAttribute("aria-expanded",!1),e.open=!1,l(),a(e),setTimeout(()=>e.Dropdown&&e.addEventListener("click",h,!1),1)}),o.toggle=(()=>n.classList.contains("show")&&e.open?o.hide():o.show()),n=e.parentNode,s=i(".dropdown-menu",n),Array.from(s.children).forEach(e=>{e.children.length&&"A"===e.children[0].tagName&&c.push(e.children[0]),"A"===e.tagName&&c.push(e)}),e.Dropdown||(!("tabindex"in s)&&s.setAttribute("tabindex","0"),e.addEventListener("click",h,!1)),e.open=!1,e.Dropdown=o},Modal:function(e){var i;function o(){var s,a,o=n.classList.contains("modal-open"),c=parseInt(getComputedStyle(n).paddingRight),r=t.documentElement.clientHeight!==t.documentElement.scrollHeight||n.clientHeight!==n.scrollHeight,l=e.clientHeight!==e.scrollHeight;(a=t.createElement("div")).className="modal-scrollbar-measure",n.appendChild(a),s=a.offsetWidth-a.clientWidth,n.removeChild(a),i=s,e.style.paddingRight=!l&&i?i+"px":"",n.style.paddingRight=l||r?c+(o?0:i)+"px":""}function c(t){t=t?"addEventListener":"removeEventListener",window[t]("resize",()=>e.classList.contains("show")&&o(),{passive:!0})}function r(){e.style.display="block",o(),!t.getElementsByClassName("modal show")[0]&&n.classList.add("modal-open"),e.classList.add("show"),e.setAttribute("aria-hidden",!1),e.classList.contains("fade")?s(e,l):l()}function l(){a(e),e.isAnimating=!1,c(1)}function d(){e.style.display="",n.classList.remove("modal-open"),n.style.paddingRight="",e.style.paddingRight="",c(),e.isAnimating=!1}this.show=(()=>{e.classList.contains("show")&&e.isAnimating||(e.isAnimating=!0,t.getElementsByClassName("modal show")[0]?r():setTimeout(r,0))}),this.hide=(()=>{e.classList.contains("show")&&(e.isAnimating=!0,e.classList.remove("show"),e.setAttribute("aria-hidden",!0),e.classList.contains("fade")?s(e,d):d())}),e.isAnimating=!1,e.Modal=this},Tab:class{constructor(e){this.element=e,e.Tab=this,e.addEventListener("click",e=>{e.preventDefault(),this.show()})}show(){const e=this.element,t=e.closest("li");if(!t.classList.contains("active")){const n=e.closest("ul").querySelector(".active a");n.closest("li").classList.remove("active"),i(n.getAttribute("href")).classList.remove("active"),t.classList.add("active"),i(e.getAttribute("href")).classList.add("active")}}}}})();
|
||||
|
|
@ -6,7 +6,7 @@
|
|||
.fade {
|
||||
opacity: 0;
|
||||
.transition(opacity .15s linear);
|
||||
&.in {
|
||||
&.show {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
4
vendors/bootstrap/less/modals.less
vendored
4
vendors/bootstrap/less/modals.less
vendored
|
|
@ -25,7 +25,7 @@
|
|||
}
|
||||
|
||||
.modal-backdrop,
|
||||
.modal-backdrop.fade.in {
|
||||
.modal-backdrop.fade.show {
|
||||
.opacity(80);
|
||||
}
|
||||
|
||||
|
|
@ -49,7 +49,7 @@
|
|||
.transition(e('opacity .3s linear, top .3s ease-out'));
|
||||
top: -25%;
|
||||
}
|
||||
&.fade.in { top: 50%; }
|
||||
&.fade.show { top: 50%; }
|
||||
}
|
||||
.modal-header {
|
||||
padding: 9px 15px;
|
||||
|
|
|
|||
|
|
@ -98,7 +98,7 @@
|
|||
right: 20px;
|
||||
width: auto;
|
||||
margin: 0;
|
||||
&.fade.in { top: auto; }
|
||||
&.fade.show { top: auto; }
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue