UNPKG

phonon

Version:

Phonon is an open source HTML, CSS and JavaScript agnostic framework that allows to create a website or a hybrid Web app.

25 lines (23 loc) 17.6 kB
!function(t){var e={};function n(o){if(e[o])return e[o].exports;var r=e[o]={i:o,l:!1,exports:{}};return t[o].call(r.exports,r,r.exports,n),r.l=!0,r.exports}n.m=t,n.c=e,n.d=function(t,e,o){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:o})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var o=Object.create(null);if(n.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var r in t)n.d(o,r,function(e){return t[e]}.bind(null,r));return o},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=0)}([function(t,e,n){t.exports=n(1)},function(t,e,n){const o=n(2);document.querySelector("#createModal").addEventListener("click",function(){new o({title:"Modal title",message:"Modal body text goes here."}).show()})},function(t,e,n){"use strict"; /*! * Modal v2.0.0-alpha.1 (https://github.com/quark-dev/Phonon-Framework) * Copyright 2015-2019 qathom * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) */var o,r=(o=n(3))&&"object"==typeof o&&"default"in o?o.default:o,i=function(t,e){return(i=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,e)}; /*! ***************************************************************************** Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0 THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABLITY OR NON-INFRINGEMENT. See the Apache Version 2.0 License for specific language governing permissions and limitations under the License. ***************************************************************************** */function a(t,e){var n,o,r,i,a={label:0,sent:function(){if(1&r[0])throw r[1];return r[1]},trys:[],ops:[]};return i={next:s(0),throw:s(1),return:s(2)},"function"==typeof Symbol&&(i[Symbol.iterator]=function(){return this}),i;function s(i){return function(s){return function(i){if(n)throw new TypeError("Generator is already executing.");for(;a;)try{if(n=1,o&&(r=2&i[0]?o.return:i[0]?o.throw||((r=o.return)&&r.call(o),0):o.next)&&!(r=r.call(o,i[1])).done)return r;switch(o=0,r&&(i=[2&i[0],r.value]),i[0]){case 0:case 1:r=i;break;case 4:return a.label++,{value:i[1],done:!1};case 5:a.label++,o=i[1],i=[0];continue;case 7:i=a.ops.pop(),a.trys.pop();continue;default:if(!(r=(r=a.trys).length>0&&r[r.length-1])&&(6===i[0]||2===i[0])){a=0;continue}if(3===i[0]&&(!r||i[1]>r[0]&&i[1]<r[3])){a.label=i[1];break}if(6===i[0]&&a.label<r[1]){a.label=r[1],r=i;break}if(r&&a.label<r[2]){a.label=r[2],a.ops.push(i);break}r[2]&&a.ops.pop(),a.trys.pop();continue}i=e.call(t,a)}catch(t){i=[6,t],o=0}finally{n=r=0}if(5&i[0])throw i[1];return{value:i[0]?i[1]:void 0,done:!0}}([i,s])}}}var s=function(t){function e(e,n){void 0===n&&(n=!0);var o=t.call(this,"modal",{title:null,message:null,cancelable:!0,background:null,cancelableKeyCodes:[27,13],buttons:[{event:"confirm",text:"Ok",dismiss:!0,class:"btn btn-primary"}],center:!0},e)||this;return o.backdropSelector="modal-backdrop",o.elementGenerated=!1,o.setTemplate('<div class="modal" tabindex="-1" role="modal" data-no-boot><div class="modal-inner" role="document"><div class="modal-content"><div class="modal-header"><h5 class="modal-title"></h5><button type="button" class="icon-close" data-dismiss="modal" aria-label="Close"><span class="icon" aria-hidden="true"></span></button></div><div class="modal-body"><p></p></div><div class="modal-footer"></div></div></div></div>'),n&&null===o.getElement()&&o.build(),o}return function(t,e){function n(){this.constructor=t}i(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}(e,t),e.attachDOM=function(){r.Observer.subscribe({componentClass:"modal",onAdded:function(t,n){n(new e({element:t}))},onRemoved:function(t,e){e("Modal",t)}}),document.addEventListener(r.Event.CLICK,function(t){var e=t.target;if(e){var n=e.getAttribute("data-toggle");if(n&&"modal"===n){var o=e.getAttribute("data-target");if(!o)return;var i=document.querySelector(o);if(!i)return;var a=r.Observer.getComponent("modal",{element:i});if(!a)return;e.blur(),a.show()}}})},e.prototype.build=function(){var t=this;this.elementGenerated=!0;var e=document.createElement("div");e.innerHTML=this.getTemplate(),this.setElement(e.firstChild);var n=this.getElement(),o=this.getProp("title");null!==o&&(n.querySelector(".modal-title").innerHTML=o);var r=this.getProp("message");null!==r?n.querySelector(".modal-body").firstChild.innerHTML=r:this.removeTextBody(),this.getProp("cancelable")||(n.querySelector(".close").style.display="none");var i=this.getProp("buttons");Array.isArray(i)&&i.length>0?i.forEach(function(e){n.querySelector(".modal-footer").appendChild(t.buildButton(e))}):this.removeFooter(),document.body.appendChild(n)},e.prototype.show=function(){var t,e,n,o,i=this,s=this.getElement();return null===s&&this.build(),!s.classList.contains("show")&&(document.body.style.overflow="hidden",t=i,e=void 0,o=function(){var t,e=this;return a(this,function(n){switch(n.label){case 0:return[4,r.sleep(20)];case 1:return n.sent(),this.triggerEvent(r.Event.SHOW),this.buildBackdrop(),this.attachEvents(),t=function(){e.triggerEvent(r.Event.SHOWN),s.removeEventListener(r.Event.TRANSITION_END,t)},s.addEventListener(r.Event.TRANSITION_END,t),this.getProp("center")&&this.center(),s.classList.add("show"),[2]}})},new((n=void 0)||(n=Promise))(function(r,i){function a(t){try{c(o.next(t))}catch(t){i(t)}}function s(t){try{c(o.throw(t))}catch(t){i(t)}}function c(t){t.done?r(t.value):new n(function(e){e(t.value)}).then(a,s)}c((o=o.apply(t,e||[])).next())}),!0)},e.prototype.hide=function(){var t=this,e=this.getElement();if(!e.classList.contains("show"))return!1;document.body.style.overflow="visible",this.triggerEvent(r.Event.HIDE),this.detachEvents(),e.classList.add("hide"),e.classList.remove("show");var n=this.getBackdrop();return n&&(n.addEventListener(r.Event.TRANSITION_END,function o(){n&&(document.body.removeChild(n),n.removeEventListener(r.Event.TRANSITION_END,o)),e.classList.remove("hide"),t.triggerEvent(r.Event.HIDDEN),t.elementGenerated&&document.body.removeChild(e)}),n.classList.add("fadeout")),!0},e.prototype.onElementEvent=function(t){if("keyup"!==t.type)if(t.type!==r.Event.START){if(t.type===r.Event.CLICK){var e=t.target,n=e.getAttribute("data-event");n&&this.triggerEvent(n);var o=r.Selector.closest(e,"[data-dismiss]");o&&"modal"===o.getAttribute("data-dismiss")&&this.hide()}}else this.hide();else this.getProp("cancelableKeyCodes").find(function(e){return e===t.keyCode})&&this.hide()},e.prototype.setBackgroud=function(){var t=this.getElement(),e=this.getProp("background");e&&(t.classList.contains("modal-"+e)||t.classList.add("modal-"+e),t.classList.contains("text-white")||t.classList.add("text-white"))},e.prototype.buildButton=function(t){var e=document.createElement("button");return e.setAttribute("type","button"),e.setAttribute("class",t.class||"btn"),e.setAttribute("data-event",t.event),e.innerHTML=t.text,t.dismiss&&e.setAttribute("data-dismiss","modal"),e},e.prototype.buildBackdrop=function(){var t=document.createElement("div");t.setAttribute("data-id",this.getId()),t.classList.add(this.backdropSelector),document.body.appendChild(t)},e.prototype.getBackdrop=function(){return document.querySelector("."+this.backdropSelector+'[data-id="'+this.getId()+'"]')},e.prototype.removeTextBody=function(){var t=this.getElement();t.querySelector(".modal-body").removeChild(t.querySelector(".modal-body").firstChild)},e.prototype.removeFooter=function(){var t=this.getElement(),e=t.querySelector(".modal-footer");t.querySelector(".modal-content").removeChild(e)},e.prototype.center=function(){var t=this.getElement(),e=window.getComputedStyle(t);if(e&&e.height){var n=e.height.slice(0,e.height.length-2),o=window.innerHeight/2-parseFloat(n)/2;t.style.top=o+"px"}},e.prototype.attachEvents=function(){var t=this,e=this.getElement();Array.from(e.querySelectorAll("[data-dismiss], .modal-footer button")||[]).forEach(function(e){return t.registerElement({target:e,event:r.Event.CLICK})});var n=this.getProp("cancelable"),o=this.getBackdrop();n&&o&&(this.registerElement({target:o,event:r.Event.START}),this.registerElement({target:document,event:"keyup"}))},e.prototype.detachEvents=function(){var t=this,e=this.getElement();if(Array.from(e.querySelectorAll("[data-dismiss], .modal-footer button")||[]).forEach(function(e){return t.unregisterElement({target:e,event:r.Event.CLICK})}),this.getProp("cancelable")){var n=this.getBackdrop();this.unregisterElement({target:n,event:r.Event.START}),this.unregisterElement({target:document,event:"keyup"})}},e}(function(){function t(t,e,n){var o=this;this.template="",this.id=null,this.eventHandlers=[],this.registeredElements=[],this.name=t;var i="string"==typeof n.element?document.querySelector(n.element):n.element,a={};if(i){var s=r.Selector.attrConfig(i);s&&(a=s)}this.defaultProps=e,this.props=Object.assign(e,a,n,{element:i}),this.id=this.uid(),this.elementListener=function(t){return o.onBeforeElementEvent(t)},this.setEventsHandler()}return t.prototype.setTemplate=function(t){this.template=t},t.prototype.getTemplate=function(){return this.template},t.prototype.getElement=function(){return this.getProp("element")||null},t.prototype.setElement=function(t){this.props.element=t},t.prototype.getId=function(){return this.id},t.prototype.uid=function(){return Math.random().toString(36).substr(2,10)},t.prototype.getName=function(){return this.name},t.prototype.getProps=function(){return this.props},t.prototype.getProp=function(t){var e=this.defaultProps[t];return void 0!==this.props[t]?this.props[t]:e},t.prototype.updateProps=function(t){var e=Object.assign({},t);delete e.element,this.props=Object.assign(this.props,e)},t.prototype.registerElements=function(t){var e=this;t.forEach(function(t){return e.registerElement(t)})},t.prototype.registerElement=function(t){t.target.addEventListener(t.event,this.elementListener),this.registeredElements.push(t)},t.prototype.unregisterElements=function(){var t=this;this.registeredElements.forEach(function(e){t.unregisterElement(e)})},t.prototype.unregisterElement=function(t){var e=this.registeredElements.findIndex(function(e){return e.target===t.target&&e.event===t.event});e>-1?(t.target.removeEventListener(t.event,this.elementListener),this.registeredElements.splice(e,1)):console.error("Warning! Could not remove element: "+t.target+" with event: "+t.event+".")},t.prototype.triggerEvent=function(t,e,n){var o=this;void 0===e&&(e={}),void 0===n&&(n=!1);var i=t.split(".").reduce(function(t,e,n){return 0===n?e:t+e.charAt(0).toUpperCase()+e.slice(1)}),a="on"+i.charAt(0).toUpperCase()+i.slice(1),s=this.getProps();if(this.eventHandlers.forEach(function(t){"function"==typeof t[i]&&t[i].apply(o,[e]),"function"==typeof t[a]&&s[a].apply(o,[e])}),!n){var c=this.getElement();c?r.Dispatch.elementEvent(c,t,this.name,e):r.Dispatch.winDocEvent(t,this.name,e)}},t.prototype.preventClosable=function(){return!1},t.prototype.destroy=function(){this.unregisterElements()},t.prototype.onElementEvent=function(t){},t.prototype.setEventsHandler=function(){var t=this.getProps(),e=Object.keys(t).reduce(function(e,n){return"function"==typeof t[n]&&(e[n]=t[n]),e},{});Object.keys(e).length>0&&this.eventHandlers.push(e)},t.prototype.onBeforeElementEvent=function(t){this.preventClosable()||this.onElementEvent(t)},t}());s.attachDOM(),t.exports=s},function(t,e,n){"use strict"; /*! * Util v2.0.0-alpha.1 (https://github.com/quark-dev/Phonon-Framework) * Copyright 2015-2019 qathom * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) */var o={elementEvent:function(t,e,n,o){void 0===o&&(o={});var r=e+".ph."+n;t.dispatchEvent(new CustomEvent(r,{detail:o}))},pageEvent:function(t,e,n){void 0===n&&(n={});var o=e+"."+t;window.dispatchEvent(new CustomEvent(o,{detail:n})),document.dispatchEvent(new CustomEvent(o,{detail:n}))},winDocEvent:function(t,e,n){void 0===n&&(n={});var o=t+".ph."+e;window.dispatchEvent(new CustomEvent(o,{detail:n})),document.dispatchEvent(new CustomEvent(o,{detail:n}))}};var r=["mousedown","mousemove","mouseup"],i=!1;"undefined"!=typeof window&&(("ontouchstart"in window||window.DocumentTouch&&document instanceof window.DocumentTouch)&&(i=!0,r=["touchstart","touchmove","touchend","touchcancel"]),window.navigator.pointerEnabled?r=["pointerdown","pointermove","pointerup","pointercancel"]:window.navigator.msPointerEnabled&&(r=["MSPointerDown","MSPointerMove","MSPointerUp","MSPointerCancel"]));var a=window.document.createElement("div"),s=[{name:"transition",start:"transitionstart",end:"transitionend"},{name:"MozTransition",start:"transitionstart",end:"transitionend"},{name:"msTransition",start:"msTransitionStart",end:"msTransitionEnd"},{name:"WebkitTransition",start:"webkitTransitionStart",end:"webkitTransitionEnd"}].find(function(t){return void 0!==a.style[t.name]}),c=[{name:"animation",start:"animationstart",end:"animationend"},{name:"MozAnimation",start:"animationstart",end:"animationend"},{name:"msAnimation",start:"msAnimationStart",end:"msAnimationEnd"},{name:"WebkitAnimation",start:"webkitAnimationStart",end:"webkitAnimationEnd"}].find(function(t){return void 0!==a.style[t.name]}),u=s?s.start:"transitionstart",l=s?s.end:"transitionend",d=c?c.start:"animationstart",p=c?c.end:"animationend",m={TOUCH_SCREEN:i,NETWORK_ONLINE:"online",NETWORK_OFFLINE:"offline",NETWORK_RECONNECTING:"reconnecting",NETWORK_RECONNECTING_SUCCESS:"reconnect.success",NETWORK_RECONNECTING_FAILURE:"reconnect.failure",SHOW:"show",SHOWN:"shown",HIDE:"hide",HIDDEN:"hidden",HASH:"hash",START:r[0],MOVE:r[1],END:r[2],CANCEL:void 0===r[3]?null:r[3],CLICK:"click",TRANSITION_START:u,TRANSITION_END:l,ANIMATION_START:d,ANIMATION_END:p,ITEM_SELECTED:"itemSelected"};function f(t){return 1===t.nodeType}var v={attrConfig:function(t){if(!t)return null;var e=t.getAttribute("data-config");if(!e)return null;try{return JSON.parse(e)}catch(t){}var n=(e.match(/(\w+)\s*:\s*(["'])?/gim)||[]).map(function(t){return t.replace(/(\w+)\s*:\s*(["'])?/gim,"$1")}),o=e.match(/[^:]+(?=,|$)/gim)||[],r={};return n.forEach(function(t,e){var n=o[e].replace(/ /g,"").replace(/\'|"/g,""),i="";i="true"===n||"false"===n?"true"===n:isNaN(n)?n:parseFloat(n),r[t]=i}),r},removeClasses:function(t,e,n){void 0===n&&(n=null),e.forEach(function(e){var o=n?n+"-"+e:e;t.classList.contains(o)&&t.classList.remove(o)})},closest:function(t,e){Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector;var n=t;do{if(n.matches(e))return n;n=n.parentElement||n.parentNode}while(null!==n&&1===n.nodeType);return null},isElement:f},h={};function E(t){return"string"==typeof t?t.toLowerCase():t.constructor.name.toLowerCase()}var y={addComponent:function(t){var e=E(t);h[e]||(h[e]=[]),h[e].push(t)},getComponent:function(t,e){var n=E(t),o=e.element;if(!o)return null;var r="string"==typeof o?document.querySelector(o):o,i=(h[n]||[]).find(function(t){return t.getElement()===r});return i?(e&&i.updateProps(e),i):null},removeComponent:function(t,e){var n=E(t),o=(h[n]||[]).findIndex(function(t){return t.getElement()===e});-1!==o&&(h[n][o].destroy(),h[n].splice(o,1))}},g=[];function b(t,e){for(var n=[],o=2;o<arguments.length;o++)n[o-2]=arguments[o];var r=t[e];r&&r.apply(r,n)}function w(t,e){void 0===e&&(e=!0),function(t,e){void 0===e&&(e=!0);var n=t,o=n.className.split(" "),r=g.find(function(t){return o.indexOf(t.componentClass)>-1});if(r){var i=e?"onAdded":"onRemoved",a=e?[n,y.addComponent]:[n,y.removeComponent];b.apply(void 0,[r,i].concat(a))}}(t,e);for(var n=t.firstElementChild;n;){var o=n.nextElementSibling;f(n)&&w(n,e),n=o}}function C(t){return Array.from(t).filter(function(t){return f(t)&&!t.getAttribute("data-no-boot")})}function S(){new MutationObserver(function(t){return t.forEach(function(t){if("attributes"!==t.type){var e=t.addedNodes,n=t.removedNodes;C(e).forEach(function(t){return w(t,!0)}),C(n).forEach(function(t){return w(t,!1)})}})}).observe(document,{childList:!0,subtree:!0,characterData:!0,attributes:!0})}!function(){if("MutationObserver"in window)if(document.body)S();else{var t=new MutationObserver(function(){document.body&&(t.disconnect(),S())});t.observe(document,{childList:!0,subtree:!0})}}();var T={subscribe:function(t){g.push(t),document.body&&Array.from(document.body.querySelectorAll("."+t.componentClass)||[]).filter(function(t){return!t.getAttribute("data-no-boot")}).forEach(function(e){b(t,"onAdded",e,y.addComponent)})},getComponent:y.getComponent};"undefined"!=typeof window&&window.addEventListener("error",function(t){console.error("-- Phonon Error --"),console.error("An error has occured! You can pen an issue here: https://github.com/quark-dev/Phonon-Framework/issues"),console.error(JSON.stringify(t))});var N={sleep:function(t){return new Promise(function(e){setTimeout(e,t)})},Event:m,Dispatch:o,Selector:v,Observer:T};t.exports=N}]);