mirror of
https://github.com/a2nt/meta-lightbox.git
synced 2024-10-22 17:05:53 +02:00
Compare commits
5 Commits
690a6671a9
...
75f404f249
| Author | SHA1 | Date | |
|---|---|---|---|
| 75f404f249 | |||
| 745ad254a0 | |||
| 9aca2b359c | |||
| 36c80160eb | |||
| b6b8bf23d2 |
2
dist/js/app.js
vendored
2
dist/js/app.js
vendored
@ -1 +1 @@
|
||||
!function(){"use strict";var t={758:function(t){t.exports=function makeYoutubeEmbed(t){if("string"===typeof t){var a=function getId(t){var a=t.match(/^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/);if(a&&11==a[2].length)return a[2]}(t);return a?"//www.youtube.com/embed/"+a:void 0}}}},a={};function __webpack_require__(o){var i=a[o];if(void 0!==i)return i.exports;var c=a[o]={exports:{}};return t[o](c,c.exports,__webpack_require__),c.exports}!function(){var t="ajax-load",a="load-ready";function _typeof(t){return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},_typeof(t)}var o=function e(t){function r(t,a,o){var i,c={};if(Array.isArray(t))return t.concat(a);for(i in t)c[o?i.toLowerCase():i]=t[i];for(i in a){var s=o?i.toLowerCase():i,l=a[i];c[s]=s in c&&"object"==_typeof(l)?r(c[s],l,"headers"===s):l}return c}function n(a,o,i,c){"string"!=typeof a&&(a=(o=a).url);var s={config:o},l=r(t,o),d={},u=c||l.data;(l.transformRequest||[]).map((function(t){u=t(u,l.headers)||u})),u&&"object"==_typeof(u)&&"function"!=typeof u.append&&(u=JSON.stringify(u),d["content-type"]="application/json");var p="undefined"!=typeof document&&document.cookie.match(RegExp("(^|; )"+l.xsrfCookieName+"=([^;]*)"));if(p&&(d[l.xsrfHeaderName]=p[2]),l.auth&&(d.authorization=l.auth),l.baseURL&&(a=a.replace(/^(?!.*\/\/)\/?(.*)$/,l.baseURL+"/$1")),l.params){var m=~a.indexOf("?")?"&":"?";a+=m+(l.paramsSerializer?l.paramsSerializer(l.params):new URLSearchParams(l.params))}return(l.fetch||fetch)(a,{method:i||l.method,body:u,headers:r(l.headers,d,!0),credentials:l.withCredentials?"include":"same-origin"}).then((function(t){for(var a in t)"function"!=typeof t[a]&&(s[a]=t[a]);var o=l.validateStatus?l.validateStatus(t.status):t.ok;return"stream"==l.responseType?(s.data=t.body,s):t[l.responseType||"text"]().then((function(t){s.data=t,s.data=JSON.parse(t)})).catch(Object).then((function(){return o?s:Promise.reject(s)}))}))}return t=t||{},n.request=n,n.get=function(t,a){return n(t,a,"get")},n.delete=function(t,a){return n(t,a,"delete")},n.head=function(t,a){return n(t,a,"head")},n.options=function(t,a){return n(t,a,"options")},n.post=function(t,a,o){return n(t,o,"post",a)},n.put=function(t,a,o){return n(t,o,"put",a)},n.patch=function(t,a,o){return n(t,o,"patch",a)},n.all=Promise.all.bind(Promise),n.spread=function(t){return function(a){return t.apply(this,a)}},n.CancelToken="function"==typeof AbortController?AbortController:Object,n.defaults=t,n.create=e,n}();function _toConsumableArray(t){return function _arrayWithoutHoles(t){if(Array.isArray(t))return _arrayLikeToArray(t)}(t)||function _iterableToArray(t){if("undefined"!==typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||function _unsupportedIterableToArray(t,a){if(!t)return;if("string"===typeof t)return _arrayLikeToArray(t,a);var o=Object.prototype.toString.call(t).slice(8,-1);"Object"===o&&t.constructor&&(o=t.constructor.name);if("Map"===o||"Set"===o)return Array.from(t);if("Arguments"===o||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(o))return _arrayLikeToArray(t,a)}(t)||function _nonIterableSpread(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function _arrayLikeToArray(t,a){(null==a||a>t.length)&&(a=t.length);for(var o=0,i=new Array(a);o<a;o++)i[o]=t[o];return i}function _classCallCheck(t,a){if(!(t instanceof a))throw new TypeError("Cannot call a class as a function")}function _defineProperties(t,a){for(var o=0;o<a.length;o++){var i=a[o];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}function _defineProperty(t,a,o){return a in t?Object.defineProperty(t,a,{value:o,enumerable:!0,configurable:!0,writable:!0}):t[a]=o,t}var i=window,c=function(){function MetaWindow(){var t=this,a=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{shown:!1},c=arguments.length>1?arguments[1]:void 0;_classCallCheck(this,MetaWindow),_defineProperty(this,"state",{content:"",type:["empty"],shown:!1,loading:!1,error:!1,embed:!1,collections:[],current:null,target:null,extraClass:null}),_defineProperty(this,"show",(function(){var a=t;console.log("".concat(a.name,": show")),a.setState({shown:!0}),i.dispatchEvent(new Event("{ui.name}.show"))})),_defineProperty(this,"hide",(function(){var a=t;console.log("".concat(a.name,": hide")),a.setState({shown:!1}),i.dispatchEvent(new Event("{ui.name}.hide"))})),_defineProperty(this,"next",(function(){var a=t,o=a.state.current.getAttribute("data-gallery"),c=a._currIndex();c<a.state.collections[o].length-1?c++:c=0,a.state.collections[o][c].click(),console.log("".concat(a.name,": next")),i.dispatchEvent(new Event("{ui.name}.next"))})),_defineProperty(this,"prev",(function(){var a=t,o=a.state.current.getAttribute("data-gallery"),c=a._currIndex();c>0?c--:c=a.state.collections[o].length-1,a.state.collections[o][c].click(),console.log("".concat(a.name,": prev")),i.dispatchEvent(new Event("{ui.name}.prev"))})),_defineProperty(this,"reset",(function(){t.setState({content:"",type:["empty"],shown:!1,loading:!1,error:!1,embed:!1})})),_defineProperty(this,"load",(function(a){var o=t,c=o.axios;o.reset(),o.setState({loading:!0}),o.show(),c.get(a,{responseType:"arraybuffer"}).then((function(t){console.log("".concat(o.name,": response content-type: ").concat(t.headers["content-type"]));switch(t.headers["content-type"]){case"image/jpeg":case"image/png":case"image/svg+xml":case"image/bmp":case"image/gif":case"image/tiff":case"image/webp":case"image/jpg":case"image/svg":o.setContent('<img src="data:'.concat(t.headers["content-type"],";base64,").concat(o._imageEncode(t.data),'" />'),"meta-".concat(o.name,"--image"));break;case"application/json":case"application/ld+json":case"application/json; charset=UTF-8":o.setContent("".concat((!1).Content),["meta-".concat(o.name,"--text"),"meta-".concat(o.name,"--html"),"meta-".concat(o.name,"--json")]);break;case"video/mp4":o.setContent('<video controls autoplay><source src="'.concat(a,'" type="video/mp4">Your browser does not support the video tag.</video>'),["meta-".concat(o.name,"--image"),"meta-".concat(o.name,"--video")]);break;case"text/html":case"application/xhtml+xml":case"text/plain":case"text/html; charset=UTF-8":case"application/xhtml+xml; charset=UTF-8":case"text/plain; charset=UTF-8":o.setContent(o._abToString(t.data),["meta-".concat(o.name,"--text"),"meta-".concat(o.name,"--html"),"meta-".concat(o.name,"--pajax")]);break;default:console.warn("".concat(o.name,": Unknown response content-type!"))}i.dispatchEvent(new Event("{ui.name}.loaded"))})).catch((function(t){console.error(t);var a="";if(t.response)switch(t.response.status){case 404:a="Not Found.";break;case 500:a="Server issue, please try again latter.";break;default:a="Something went wrong."}else t.request?a="No response received":console.warn("Error",t.message);o.setState({error:a}),i.dispatchEvent(new Event("{ui.name}.error"))})).then((function(){o.setState({loading:!1}),setTimeout((function(){o.state.current.classList.remove("loading")}),3e3)}))})),_defineProperty(this,"_currIndex",(function(){var a=t,o=a.state.current,i=o.getAttribute("data-gallery");return a.state.collections[i].indexOf(o)})),_defineProperty(this,"embed",(function(a){var o=t;console.log("".concat(o.name,": embed")),o.reset(),o.setState({embed:a,loading:!1,type:["meta-".concat(o.name,"--embed"),"meta-".concat(o.name,"--video")]}),o.show()})),_defineProperty(this,"setCaption",(function(a){var o=t;console.log("".concat(o.name,": setCaption")),o.state.caption=a})),_defineProperty(this,"addExtraClass",(function(a){var o=t;a.length&&(console.log("".concat(o.name,": addExtraClass(").concat(a,")")),o.state.extraClass=a)})),_defineProperty(this,"getCaption",(function(){return t.state.caption})),_defineProperty(this,"_abToString",(function(t){return String.fromCharCode.apply(null,new Uint8Array(t))})),_defineProperty(this,"_imageEncode",(function(t){new Uint8Array(t);return btoa([].reduce.call(new Uint8Array(t),(function(t,a){return t+String.fromCharCode(a)}),""))})),_defineProperty(this,"setContent",(function(a,o){var i=t;console.log("".concat(i.name,": setContent"));var c=o||["meta-".concat(i.name,"--html"),"meta-".concat(i.name,"--text")];Array.isArray(c)||(c=o.split(" ")),i.setState({content:a,type:c})})),_defineProperty(this,"getHtml",(function(){var a=t;if(a.state.embed){var o=__webpack_require__(758)(a.state.embed);a.state.content='<iframe width="600" height="380" src="'.concat(o,'" frameborder="0"></iframe>')}return a.state.content}));var s=this;switch(s.name=s.constructor.name,console.log("".concat(s.name,": init")),s.axios=o,s.setState(a),c){case"show":case"hide":s.hide()}i.dispatchEvent(new Event("{ui.name}.init"))}return function _createClass(t,a,o){return a&&_defineProperties(t.prototype,a),o&&_defineProperties(t,o),Object.defineProperty(t,"prototype",{writable:!1}),t}(MetaWindow,[{key:"init",value:function init(){var t=this;console.log("MetaWindow: [links] init"),document.querySelectorAll('[data-toggle="lightbox"],[data-gallery="${gallery}"]').forEach((function(a){var o=a.getAttribute("data-gallery");o&&(t.state.collections[o]=[],document.querySelectorAll('[data-toggle="lightbox"][data-gallery="'.concat(o,'"]')).forEach((function(a){t.state.collections[o].push(a)}))),a.addEventListener("click",(function(a){a.preventDefault(),console.log("MetaWindow: [link] click");var o=a.currentTarget,i=o.getAttribute("href")||o.getAttribute("data-href"),c=o.getAttribute("data-embed");o.classList.add("loading"),t.state.current=o,c?t.embed(i):t.load(i);var s=o.getAttribute("data-title");s&&t.setCaption(s),t.addExtraClass(o.getAttribute("data-lightbox-class"))}))}))}},{key:"setState",value:function setState(t){var a=this;a.state=Object.assign({},a.state,t),a.render()}},{key:"render",value:function render(){var t,a=this,o=a.name,i=a.state.current;a.state.target.innerHTML="";var c=document.createElement("div");c.classList.add("meta-".concat(o)),(t=c.classList).add.apply(t,_toConsumableArray(a.state.type)),a.state.target.append(c);var s=document.createElement("div");s.classList.add("meta-".concat(o,"-overlay")),a.state.shown&&s.classList.add("meta-".concat(o,"-overlay--open")),a.state.loading&&s.classList.add("meta-".concat(o,"-overlay--loading")),a.state.error&&s.classList.add("meta-".concat(o,"-overlay--error")),c.append(s);var l=document.createElement("div");l.classList.add("meta-content"),s.append(l);var d=document.createElement("button");if(d.classList.add("meta-nav","meta-close","a"),d.innerHTML='<i class="icon fa fas fa-times"></i> <span class="visually-hidden">Close</span>',d.addEventListener("click",(function(t){t.preventDefault(),a.hide()})),l.append(d),i){var u=i.getAttribute("data-gallery");if(u&&a.state.collections[u].length>1){var p=document.createElement("nav");p.classList.add("meta-navs");var m=document.createElement("button");m.classList.add("meta-nav","meta-nav-arrow","meta-nav-arrow__prev","a"),m.innerHTML='<i class="icon fa fas fa-chevron-left"></i> <span class="visually-hidden">Previous</span>',m.addEventListener("click",(function(t){t.preventDefault(),a.prev()})),p.append(m);var f=document.createElement("button");f.classList.add("meta-nav","meta-nav-arrow","meta-nav-arrow__next","a"),f.innerHTML='<i class="icon fa fas fa-chevron-right"></i> <span class="visually-hidden">Next</span>',f.addEventListener("click",(function(t){t.preventDefault(),a.next()})),p.append(f),l.append(p)}}var v=document.createElement("section");if(v.classList.add("meta-wrap","typography"),a.state.extraClass&&v.classList.add(a.state.extraClass),v.innerHTML=a.getHtml(),l.append(v),a.state.error){var y=document.createElement("div");y.classList.add("meta-error"),y.innerHTML=a.state.error,l.append(y)}else if(a.state.caption){var h=document.createElement("div");h.classList.add("meta-caption"),h.innerHTML=a.getCaption(),l.append(h)}return"undefined"!==typeof window.FontAwesome&&window.FontAwesome.dom.i2svg(),a}}]),MetaWindow}(),s=c,l=document.getElementById("MetaLightboxApp");l||console.log("MetaWindow: missing container #MetaLightboxApp");var d=function init(){var t=window.MetaWindow;"undefined"===typeof t&&(t=new s({target:l}),window.MetaWindow=t),t.init()};window.addEventListener("".concat(a),d),window.addEventListener("".concat(t),d),window.addEventListener("MetaWindow.initLinks",d)}()}();
|
||||
!function(){"use strict";var e={826:function(e){e.exports=function makeYoutubeEmbed(e){if("string"===typeof e){var t=function getId(e){var t=e.match(/^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/);if(t&&11==t[2].length)return t[2]}(e);return t?"//www.youtube.com/embed/"+t:void 0}}}},t={};function __webpack_require__(a){var n=t[a];if(void 0!==n)return n.exports;var r=t[a]={exports:{}};return e[a](r,r.exports,__webpack_require__),r.exports}!function(){var e="ajax-load",t="load-ready";function _toConsumableArray(e){return function _arrayWithoutHoles(e){if(Array.isArray(e))return _arrayLikeToArray(e)}(e)||function _iterableToArray(e){if("undefined"!==typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function _unsupportedIterableToArray(e,t){if(!e)return;if("string"===typeof e)return _arrayLikeToArray(e,t);var a=Object.prototype.toString.call(e).slice(8,-1);"Object"===a&&e.constructor&&(a=e.constructor.name);if("Map"===a||"Set"===a)return Array.from(e);if("Arguments"===a||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(a))return _arrayLikeToArray(e,t)}(e)||function _nonIterableSpread(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function _arrayLikeToArray(e,t){(null==t||t>e.length)&&(t=e.length);for(var a=0,n=new Array(t);a<t;a++)n[a]=e[a];return n}function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function _defineProperties(e,t){for(var a=0;a<t.length;a++){var n=t[a];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function _defineProperty(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}var a=window,n=function(){function MetaWindow(){var e=this,t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{shown:!1},n=arguments.length>1?arguments[1]:void 0;_classCallCheck(this,MetaWindow),_defineProperty(this,"state",{content:"",type:["empty"],shown:!1,loading:!1,error:!1,embed:!1,collections:[],current:null,target:null,extraClass:null}),_defineProperty(this,"show",(function(){var t=e;console.log("".concat(t.name,": show")),t.setState({shown:!0}),a.dispatchEvent(new Event("{ui.name}.show"))})),_defineProperty(this,"hide",(function(){var t=e;console.log("".concat(t.name,": hide")),t.setState({shown:!1}),a.dispatchEvent(new Event("{ui.name}.hide"))})),_defineProperty(this,"next",(function(){var t=e,n=t.state.current.getAttribute("data-gallery"),r=t._currIndex();r<t.state.collections[n].length-1?r++:r=0,t.state.collections[n][r].click(),console.log("".concat(t.name,": next")),a.dispatchEvent(new Event("{ui.name}.next"))})),_defineProperty(this,"prev",(function(){var t=e,n=t.state.current.getAttribute("data-gallery"),r=t._currIndex();r>0?r--:r=t.state.collections[n].length-1,t.state.collections[n][r].click(),console.log("".concat(t.name,": prev")),a.dispatchEvent(new Event("{ui.name}.prev"))})),_defineProperty(this,"reset",(function(){e.setState({content:"",type:["empty"],shown:!1,loading:!1,error:!1,embed:!1})})),_defineProperty(this,"load",(function(t){var n=e;n.reset(),n.setState({loading:!0}),n.show(),window.fetch(t).then((function(e){var r=e.headers.get("content-type");console.log(e),console.log("".concat(n.name,": response content-type: ").concat(r));switch(r){case"image/jpeg":case"image/png":case"image/svg+xml":case"image/bmp":case"image/gif":case"image/tiff":case"image/webp":case"image/jpg":case"image/svg":e.arrayBuffer().then((function(e){n.setContent('<img src="data:'.concat(r,";base64,").concat(n._imageEncode(e),'" />'),"meta-".concat(n.name,"--image"))}));break;case"application/json":case"application/ld+json":case"application/json; charset=UTF-8":n.setContent("".concat((!1).Content),["meta-".concat(n.name,"--text"),"meta-".concat(n.name,"--html"),"meta-".concat(n.name,"--json")]);break;case"video/mp4":n.setContent('<video controls autoplay><source src="'.concat(t,'" type="video/mp4">Your browser does not support the video tag.</video>'),["meta-".concat(n.name,"--image"),"meta-".concat(n.name,"--video")]);break;case"text/html":case"application/xhtml+xml":case"text/plain":case"text/html; charset=UTF-8":case"application/xhtml+xml; charset=UTF-8":case"text/plain; charset=UTF-8":n.setContent(e.data,["meta-".concat(n.name,"--text"),"meta-".concat(n.name,"--html"),"meta-".concat(n.name,"--pajax")]);break;default:console.warn("".concat(n.name,": Unknown response content-type!"))}a.dispatchEvent(new Event("{ui.name}.loaded"))})).catch((function(e){console.error(e);var t="";if(e.response)switch(e.response.status){case 404:t="Not Found.";break;case 500:t="Server issue, please try again latter.";break;default:t="Something went wrong."}else e.request?t="No response received":console.warn("Error",e.message);n.setState({error:t}),a.dispatchEvent(new Event("{ui.name}.error"))})).then((function(){n.setState({loading:!1}),setTimeout((function(){n.state.current.classList.remove("loading")}),1e3)}))})),_defineProperty(this,"_currIndex",(function(){var t=e,a=t.state.current,n=a.getAttribute("data-gallery");return t.state.collections[n].indexOf(a)})),_defineProperty(this,"embed",(function(t){var a=e;console.log("".concat(a.name,": embed")),a.reset(),a.setState({embed:t,loading:!1,type:["meta-".concat(a.name,"--embed"),"meta-".concat(a.name,"--video")]}),a.show()})),_defineProperty(this,"setCaption",(function(t){var a=e;console.log("".concat(a.name,": setCaption")),a.state.caption=t})),_defineProperty(this,"addExtraClass",(function(t){var a=e;t&&t.length&&(console.log("".concat(a.name,": addExtraClass(").concat(t,")")),a.state.extraClass=t)})),_defineProperty(this,"getCaption",(function(){return e.state.caption})),_defineProperty(this,"_imageEncode",(function(e){var t="";return[].slice.call(new Uint8Array(e)).forEach((function(e){t+=String.fromCharCode(e)})),window.btoa(t)})),_defineProperty(this,"setContent",(function(t,a){var n=e;console.log("".concat(n.name,": setContent"));var r=a||["meta-".concat(n.name,"--html"),"meta-".concat(n.name,"--text")];Array.isArray(r)||(r=a.split(" ")),n.setState({content:t,type:r})})),_defineProperty(this,"getHtml",(function(){var t=e;if(t.state.embed){var a=__webpack_require__(826)(t.state.embed);t.state.content='<iframe width="600" height="380" src="'.concat(a,'" frameborder="0"></iframe>')}return t.state.content}));var r=this;switch(r.name=r.constructor.name,console.log("".concat(r.name,": init")),r.setState(t),n){case"show":case"hide":r.hide()}a.dispatchEvent(new Event("{ui.name}.init"))}return function _createClass(e,t,a){return t&&_defineProperties(e.prototype,t),a&&_defineProperties(e,a),Object.defineProperty(e,"prototype",{writable:!1}),e}(MetaWindow,[{key:"cleanLinks",value:function cleanLinks(){document.querySelectorAll('[data-toggle="lightbox"]').forEach((function(e){e.classList.remove("loading")}))}},{key:"collectGaleries",value:function collectGaleries(e){var t=this;e&&(t.state.collections[e]=[],document.querySelectorAll('[data-toggle="lightbox"][data-gallery="'.concat(e,'"]')).forEach((function(a){t.state.collections[e].push(a)})))}},{key:"toggle",value:function toggle(e){var t=this;t.cleanLinks();var a=e.getAttribute("href")||e.getAttribute("data-href"),n=e.getAttribute("data-embed");e.classList.add("loading"),t.state.current=e;var r=e.getAttribute("data-title");r&&t.setCaption(r),n?t.embed(a):t.load(a),t.addExtraClass(e.getAttribute("data-lightbox-class"))}},{key:"init",value:function init(){var e=this;console.log("MetaWindow: [links] init"),document.querySelectorAll('[data-toggle="lightbox"],[data-gallery]').forEach((function(t){var a=t.getAttribute("data-gallery");e.collectGaleries(a),t.addEventListener("click",(function(t){t.preventDefault(),console.log("MetaWindow: [link] click");var a=t.currentTarget;e.toggle(a)}))}))}},{key:"setState",value:function setState(e){var t=this;t.state=Object.assign({},t.state,e),t.render()}},{key:"render",value:function render(){var e,t=this,a=t.name,n=t.state.current;t.state.target.innerHTML="";var r=document.createElement("div");r.classList.add("meta-".concat(a)),(e=r.classList).add.apply(e,_toConsumableArray(t.state.type)),t.state.target.append(r);var o=document.createElement("div");o.classList.add("meta-".concat(a,"-overlay")),t.state.shown&&o.classList.add("meta-".concat(a,"-overlay--open")),t.state.loading&&o.classList.add("meta-".concat(a,"-overlay--loading")),t.state.error&&o.classList.add("meta-".concat(a,"-overlay--error")),r.append(o);var i=document.createElement("div");i.classList.add("meta-content"),o.append(i);var c=document.createElement("button");if(c.classList.add("meta-nav","meta-close","a"),c.innerHTML='<i class="icon fa fas fa-times"></i> <span class="visually-hidden">Close</span>',c.addEventListener("click",(function(e){e.preventDefault(),t.hide()})),i.append(c),n){var s=n.getAttribute("data-gallery");if(s&&t.state.collections[s].length>1){var l=document.createElement("nav");l.classList.add("meta-navs");var d=document.createElement("button");d.classList.add("meta-nav","meta-nav-arrow","meta-nav-arrow__prev","a"),d.innerHTML='<i class="icon fa fas fa-chevron-left"></i> <span class="visually-hidden">Previous</span>',d.addEventListener("click",(function(e){e.preventDefault(),t.prev()})),l.append(d);var u=document.createElement("button");u.classList.add("meta-nav","meta-nav-arrow","meta-nav-arrow__next","a"),u.innerHTML='<i class="icon fa fas fa-chevron-right"></i> <span class="visually-hidden">Next</span>',u.addEventListener("click",(function(e){e.preventDefault(),t.next()})),l.append(u),i.append(l)}}var m=document.createElement("section");if(m.classList.add("meta-wrap","typography"),t.state.extraClass&&m.classList.add(t.state.extraClass),m.innerHTML=t.getHtml(),i.append(m),t.state.error){var p=document.createElement("div");p.classList.add("meta-error"),p.innerHTML=t.state.error,i.append(p)}else if(t.state.caption){var f=document.createElement("div");f.classList.add("meta-caption"),f.innerHTML=t.getCaption(),i.append(f)}return"undefined"!==typeof window.FontAwesome&&window.FontAwesome.dom.i2svg(),t}}]),MetaWindow}(),r=n,o=document.getElementById("MetaLightboxApp");o||console.log("MetaWindow: missing container #MetaLightboxApp");var i=function init(){var e=window.MetaWindow;"undefined"===typeof e&&(e=new r({target:o}),window.MetaWindow=e),e.init()};window.addEventListener("".concat(t),i),window.addEventListener("".concat(e),i),window.addEventListener("MetaWindow.initLinks",i)}()}();
|
||||
8
dist/records.json
vendored
8
dist/records.json
vendored
@ -39,12 +39,12 @@
|
||||
},
|
||||
"modules": {
|
||||
"byIdentifier": {
|
||||
"./node_modules/.pnpm/babel-loader@8.2.4_acba72ea4bf9d339cdfcd8f55cdb7006/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/youtube-embed@1.0.0/node_modules/youtube-embed/index.js": 758,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.4_acba72ea4bf9d339cdfcd8f55cdb7006/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./src/js/test-build.js|1ed43bc8d29104c7b835ffb17c3534db": 929
|
||||
"./node_modules/.pnpm/babel-loader@8.2.5_rb5fcebzp6kx3hqg3ucus54t3m/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/youtube-embed@1.0.0/node_modules/youtube-embed/index.js": 826,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.5_rb5fcebzp6kx3hqg3ucus54t3m/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./src/js/test-build.js|bb7e39ae93eb42f5e247580063dd4b68": 348
|
||||
},
|
||||
"usedIds": [
|
||||
758,
|
||||
929
|
||||
348,
|
||||
826
|
||||
]
|
||||
}
|
||||
}
|
||||
4
dist/report.html
vendored
4
dist/report.html
vendored
@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="UTF-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
||||
<title>@a2nt/meta-lightbox-js [12 Apr 2022 at 13:43]</title>
|
||||
<title>@a2nt/meta-lightbox-js [3 May 2022 at 20:59]</title>
|
||||
<link rel="shortcut icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAABrVBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////+O1foceMD///+J0/qK1Pr7/v8Xdr/9///W8P4UdL7L7P0Scr2r4Pyj3vwad8D5/f/2/f+55f3E6f34+/2H0/ojfMKpzOd0rNgQcb3F3O/j9f7c8v6g3Pz0/P/w+v/q+P7n9v6T1/uQ1vuE0vqLut/y+v+Z2fvt+f+15Pzv9fuc2/vR7v2V2Pvd6/bg9P7I6/285/2y4/yp3/zp8vk8i8kqgMT7/P31+fyv4vxGkcz6/P6/6P3j7vfS5PNnpNUxhcbO7f7F6v3O4vHK3/DA2u631Ouy0eqXweKJud5wqthfoNMMbLvY8f73+v2dxeR8sNtTmdDx9/zX6PSjyeaCtd1YnNGX2PuQveCGt95Nls42h8dLlM3F4vBtAAAAM3RSTlMAAyOx0/sKBvik8opWGBMOAe3l1snDm2E9LSb06eHcu5JpHbarfHZCN9CBb08zzkdNS0kYaptYAAAFV0lEQVRYw92X51/aYBDHHS2O2qqttVbrqNq9m+TJIAYIShBkWwqIiCgoWvfeq7Z2/s29hyQNyUcR7LveGwVyXy6XH8/9rqxglLfUPLxVduUor3h0rfp2TYvpivk37929TkG037hffoX0+peVtZQc1589rigVUdXS/ABSAyEmGIO/1XfvldSK8vs3OqB6u3m0nxmIrvgB0dj7rr7Y9IbuF68hnfFaiHA/sxqm0wciIG43P60qKv9WXWc1RXGh/mFESFABTSBi0sNAKzqet17eCtOb3kZIDwxEEU0oAIJGYxNBDhBND29e0rtXXbcpuPmED9IhEAAQ/AXEaF8EPmnrrKsv0LvWR3fg5sWDNAFZOgAgaKvZDogHNU9MFwnnYROkc56RD5CjAbQX9Ow4g7upCsvYu55aSI/Nj0H1akgKQEUM94dwK65hYRmFU9MIcH/fqJYOZYcnuJSU/waKDgTOEVaVKhwrTRP5XzgSpAITYzom7UvkhFX5VutmxeNnWDjjswTKTyfgluNDGbUpWissXhF3s7mlSml+czWkg3D0l1nNjGNjz3myOQOa1KM/jOS6ebdbAVTCi4gljHSFrviza7tOgRWcS0MOUX9zdNgag5w7rRqA44Lzw0hr1WqES36dFliSJFlh2rXIae3FFcDDgKdxrUIDePr8jGcSClV1u7A9xeN0ModY/pHMxmR1EzRh8TJiwqsHmKW0l4FCEZI+jHio+JdPPE9qwQtTRxku2D8sIeRL2LnxWSllANCQGOIiqVHAz2ye2JR0DcH+HoxDkaADLjgxjKQ+AwCX/g0+DNgdG0ukYCONAe+dbc2IAc6fwt1ARoDSezNHxV2Cmzwv3O6lDMV55edBGwGK9n1+x2F8EDfAGCxug8MhpsMEcTEAWf3rx2vZhe/LAmtIn/6apE6PN0ULKgywD9mmdxbmFl3OvD5AS5fW5zLbv/YHmcsBTjf/afDz3MaZTVCfAP9z6/Bw6ycv8EUBWJIn9zYcoAWWlW9+OzO3vkTy8H+RANLmdrpOuYWdZYEXpo+TlCJrW5EARb7fF+bWdqf3hhyZI1nWJQHgznErZhbjoEsWqi8dQNoE294aldzFurwSABL2XXMf9+H1VQGke9exw5P/AnA5Pv5ngMul7LOvO922iwACu8WkCwLCafvM4CeWPxfA8lNHcWZSoi8EwMAIciKX2Z4SWCMAa3snCZ/G4EA8D6CMLNFsGQhkkz/gQNEBbPCbWsxGUpYVu3z8IyNAknwJkfPMEhLyrdi5RTyUVACkw4GSFRNWJNEW+fgPGwHD8/JxnRuLabN4CGNRkAE23na2+VmEAUmrYymSGjMAYqH84YUIyzgzs3XC7gNgH36Vcc4zKY9o9fgPBXUAiHHwVboBHGLiX6Zcjp1f2wu4tvzZKo0ecPnDtQYDQvJXaBeNzce45Fp28ZQLrEZVuFqgBwOalArKXnW1UzlnSusQKJqKYNuz4tOnI6sZG4zanpemv+7ySU2jbA9h6uhcgpfy6G2PahirDZ6zvq6zDduMVFTKvzw8wgyEdelwY9in3XkEPs3osJuwRQ4qTkfzifndg9Gfc4pdsu82+tTnHZTBa2EAMrqr2t43pguc8tNm7JQVQ2S0ukj2d22dhXYP0/veWtwKrCkNoNimAN5+Xr/oLrxswKbVJjteWrX7eR63o4j9q0GxnaBdWgGA5VStpanIjQmEhV0/nVt5VOFUvix6awJhPcAaTEShgrG+iGyvb5a0Ndb1YGHFPEwoqAinoaykaID1o1pdPNu7XsnCKQ3R+hwWIIhGvORcJUBYXe3Xa3vq/mF/N9V13ugufMkfXn+KHsRD0B8AAAAASUVORK5CYII=" type="image/x-icon" />
|
||||
|
||||
<script>
|
||||
@ -31,7 +31,7 @@
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script>
|
||||
window.chartData = [{"label":"js/app.js","isAsset":true,"statSize":25769,"parsedSize":12568,"gzipSize":4149,"groups":[{"label":"node_modules/.pnpm/youtube-embed@1.0.0/node_modules/youtube-embed","path":"./node_modules/.pnpm/youtube-embed@1.0.0/node_modules/youtube-embed","statSize":577,"groups":[{"id":758,"label":"index.js","path":"./node_modules/.pnpm/youtube-embed@1.0.0/node_modules/youtube-embed/index.js","statSize":577,"parsedSize":265,"gzipSize":218}],"parsedSize":265,"gzipSize":218},{"label":"src","path":"./src","statSize":25192,"groups":[{"label":"js","path":"./src/js","statSize":20884,"groups":[{"id":929,"label":"test-build.js + 4 modules (concatenated)","path":"./src/js/test-build.js + 4 modules (concatenated)","statSize":20884,"parsedSize":12303,"gzipSize":4017,"concatenated":true,"groups":[{"label":"src/js","path":"./src/js/test-build.js + 4 modules (concatenated)/src/js","statSize":17978,"groups":[{"id":null,"label":"test-build.js","path":"./src/js/test-build.js + 4 modules (concatenated)/src/js/test-build.js","statSize":300,"parsedSize":176,"gzipSize":57,"inaccurateSizes":true},{"id":null,"label":"app.js","path":"./src/js/test-build.js + 4 modules (concatenated)/src/js/app.js","statSize":815,"parsedSize":480,"gzipSize":156,"inaccurateSizes":true},{"id":null,"label":"_events.js","path":"./src/js/test-build.js + 4 modules (concatenated)/src/js/_events.js","statSize":1366,"parsedSize":804,"gzipSize":262,"inaccurateSizes":true},{"id":null,"label":"window.js","path":"./src/js/test-build.js + 4 modules (concatenated)/src/js/window.js","statSize":15497,"parsedSize":9129,"gzipSize":2980,"inaccurateSizes":true}],"parsedSize":10591,"gzipSize":3458,"inaccurateSizes":true},{"label":"node_modules/.pnpm/redaxios@0.4.1/node_modules/redaxios/dist","path":"./src/js/test-build.js + 4 modules (concatenated)/node_modules/.pnpm/redaxios@0.4.1/node_modules/redaxios/dist","statSize":2906,"groups":[{"id":null,"label":"redaxios.module.js","path":"./src/js/test-build.js + 4 modules (concatenated)/node_modules/.pnpm/redaxios@0.4.1/node_modules/redaxios/dist/redaxios.module.js","statSize":2906,"parsedSize":1711,"gzipSize":558,"inaccurateSizes":true}],"parsedSize":1711,"gzipSize":558,"inaccurateSizes":true}]}],"parsedSize":12303,"gzipSize":4017},{"label":"scss","path":"./src/scss","statSize":4308,"groups":[{"id":null,"label":"app.scss","path":"./src/scss/app.scss","statSize":4308}],"parsedSize":0,"gzipSize":0}],"parsedSize":12303,"gzipSize":4017}]}];
|
||||
window.chartData = [{"label":"js/app.js","isAsset":true,"statSize":22926,"parsedSize":10608,"gzipSize":3367,"groups":[{"label":"node_modules/.pnpm/youtube-embed@1.0.0/node_modules/youtube-embed","path":"./node_modules/.pnpm/youtube-embed@1.0.0/node_modules/youtube-embed","statSize":577,"groups":[{"id":826,"label":"index.js","path":"./node_modules/.pnpm/youtube-embed@1.0.0/node_modules/youtube-embed/index.js","statSize":577,"parsedSize":265,"gzipSize":217}],"parsedSize":265,"gzipSize":217},{"label":"src","path":"./src","statSize":22349,"groups":[{"label":"js","path":"./src/js","statSize":18041,"groups":[{"id":348,"label":"test-build.js + 3 modules (concatenated)","path":"./src/js/test-build.js + 3 modules (concatenated)","statSize":18041,"parsedSize":10343,"gzipSize":3233,"concatenated":true,"groups":[{"label":"src/js","path":"./src/js/test-build.js + 3 modules (concatenated)/src/js","statSize":18041,"groups":[{"id":null,"label":"test-build.js","path":"./src/js/test-build.js + 3 modules (concatenated)/src/js/test-build.js","statSize":302,"parsedSize":173,"gzipSize":54,"inaccurateSizes":true},{"id":null,"label":"app.js","path":"./src/js/test-build.js + 3 modules (concatenated)/src/js/app.js","statSize":817,"parsedSize":468,"gzipSize":146,"inaccurateSizes":true},{"id":null,"label":"_events.js","path":"./src/js/test-build.js + 3 modules (concatenated)/src/js/_events.js","statSize":1366,"parsedSize":783,"gzipSize":244,"inaccurateSizes":true},{"id":null,"label":"window.js","path":"./src/js/test-build.js + 3 modules (concatenated)/src/js/window.js","statSize":15556,"parsedSize":8918,"gzipSize":2787,"inaccurateSizes":true}],"parsedSize":10343,"gzipSize":3233,"inaccurateSizes":true}]}],"parsedSize":10343,"gzipSize":3233},{"label":"scss","path":"./src/scss","statSize":4308,"groups":[{"id":null,"label":"app.scss","path":"./src/scss/app.scss","statSize":4308}],"parsedSize":0,"gzipSize":0}],"parsedSize":10343,"gzipSize":3233}]}];
|
||||
window.defaultSizes = "parsed";
|
||||
</script>
|
||||
</body>
|
||||
|
||||
32
package.json
32
package.json
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@a2nt/meta-lightbox-js",
|
||||
"version": "4.2.0",
|
||||
"version": "4.2.3",
|
||||
"description": "Universal lightbox",
|
||||
"author": "Tony Air <tony@twma.pro>",
|
||||
"license": "BSD-2-Clause",
|
||||
@ -52,21 +52,21 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"es6-template": "^1.0.4",
|
||||
"eslint-scope": "^7.1.1",
|
||||
"material-design-color": "^2.3.2",
|
||||
"redaxios": "^0.4.1",
|
||||
"youtube-embed": "^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@a2nt/image-sprite-webpack-plugin": "^0.2.5",
|
||||
"@babel/core": "^7.17.9",
|
||||
"@babel/core": "^7.17.10",
|
||||
"@babel/eslint-parser": "^7.17.0",
|
||||
"@babel/plugin-proposal-class-properties": "^7.16.7",
|
||||
"@babel/plugin-proposal-object-rest-spread": "^7.17.3",
|
||||
"@babel/plugin-syntax-jsx": "^7.16.7",
|
||||
"@babel/plugin-syntax-top-level-await": "^7.14.5",
|
||||
"@babel/plugin-transform-react-jsx": "^7.17.3",
|
||||
"@babel/plugin-transform-runtime": "^7.17.0",
|
||||
"@babel/preset-env": "^7.16.11",
|
||||
"@babel/plugin-transform-runtime": "^7.17.10",
|
||||
"@babel/preset-env": "^7.17.10",
|
||||
"@babel/preset-react": "^7.16.7",
|
||||
"@babel/runtime": "^7.17.9",
|
||||
"@googlemaps/markerclustererplus": "*",
|
||||
@ -78,8 +78,8 @@
|
||||
"animate.css": "^4.1.1",
|
||||
"ansi-html": "^0.0.9",
|
||||
"ansi-regex": "^6.0.1",
|
||||
"autoprefixer": "^10.4.4",
|
||||
"babel-loader": "^8.2.4",
|
||||
"autoprefixer": "^10.4.7",
|
||||
"babel-loader": "^8.2.5",
|
||||
"classnames": "^2.3.1",
|
||||
"copy-webpack-plugin": "^10.2.4",
|
||||
"croppie": "^2.6.5",
|
||||
@ -87,7 +87,7 @@
|
||||
"css-loader": "^6.7.1",
|
||||
"css-minimizer-webpack-plugin": "^3.4.1",
|
||||
"debug": "^4.3.4",
|
||||
"eslint": "^8.13.0",
|
||||
"eslint": "^8.14.0",
|
||||
"eslint-plugin-import": "^2.26.0",
|
||||
"eslint-plugin-jquery": "^1.5.1",
|
||||
"eslint-plugin-react": "^7.29.4",
|
||||
@ -102,17 +102,17 @@
|
||||
"file-loader": "^6.2.0",
|
||||
"graphql-tag": "^2.12.6",
|
||||
"hoist-non-react-statics": "^3.3.2",
|
||||
"html-dom-parser": "^1.1.1",
|
||||
"html-dom-parser": "^1.2.0",
|
||||
"html-entities": "^2.3.3",
|
||||
"html-loader": "^3.1.0",
|
||||
"html-react-parser": "^1.4.10",
|
||||
"html-react-parser": "^1.4.12",
|
||||
"html-webpack-plugin": "^5.5.0",
|
||||
"img-optimize-loader": "^1.0.7",
|
||||
"loglevel": "^1.8.0",
|
||||
"mini-css-extract-plugin": "^2.6.0",
|
||||
"ms": "^2.1.3",
|
||||
"msw": "^0.39.2",
|
||||
"node-fetch": "^3.2.3",
|
||||
"node-fetch": "^3.2.4",
|
||||
"object-assign": "^4.1.1",
|
||||
"optimism": "^0.16.1",
|
||||
"postcss-loader": "^6.2.1",
|
||||
@ -120,10 +120,10 @@
|
||||
"punycode": "^2.1.1",
|
||||
"querystring": "^0.2.1",
|
||||
"raw-loader": "^4.0.2",
|
||||
"react": "^18.0.0",
|
||||
"react-dom": "^18.0.0",
|
||||
"react": "^18.1.0",
|
||||
"react-dom": "^18.1.0",
|
||||
"react-hot-loader": "^4.13.0",
|
||||
"react-is": "^18.0.0",
|
||||
"react-is": "^18.1.0",
|
||||
"react-lifecycles-compat": "^3.0.4",
|
||||
"regenerator-runtime": "^0.13.9",
|
||||
"resolve-url-loader": "^5.0.0",
|
||||
@ -134,7 +134,7 @@
|
||||
"sass-lint-auto-fix": "^0.21.2",
|
||||
"sass-lint-fix": "^1.12.1",
|
||||
"sass-loader": "^12.6.0",
|
||||
"scheduler": "^0.21.0",
|
||||
"scheduler": "^0.22.0",
|
||||
"shallowequal": "^1.1.0",
|
||||
"strip-ansi": "^7.0.1",
|
||||
"style-loader": "^3.3.1",
|
||||
@ -143,7 +143,7 @@
|
||||
"symbol-observable": "^4.0.0",
|
||||
"terser-webpack-plugin": "^5.3.1",
|
||||
"ts-invariant": "^0.9.4",
|
||||
"tslib": "^2.3.1",
|
||||
"tslib": "^2.4.0",
|
||||
"url": "^0.11.0",
|
||||
"url-loader": "^4.1.1",
|
||||
"webpack": "^5.72.0",
|
||||
|
||||
@ -41,4 +41,4 @@ export default {
|
||||
FORM_STEPPED_FIRST_STEP: 'form-first-step',
|
||||
FORM_STEPPED_LAST_STEP: 'form-last-step',
|
||||
FORM_FIELDS: 'input,textarea,select',
|
||||
};
|
||||
}
|
||||
|
||||
@ -4,38 +4,38 @@
|
||||
*
|
||||
*/
|
||||
|
||||
import Events from './_events';
|
||||
import MetaWindow from './window';
|
||||
import Events from './_events'
|
||||
import MetaWindow from './window'
|
||||
|
||||
const container = document.getElementById('MetaLightboxApp');
|
||||
const container = document.getElementById('MetaLightboxApp')
|
||||
if (!container) {
|
||||
console.log(`MetaWindow: missing container #MetaLightboxApp`);
|
||||
console.log('MetaWindow: missing container #MetaLightboxApp')
|
||||
}
|
||||
|
||||
const init = () => {
|
||||
let ui = window.MetaWindow;
|
||||
let ui = window.MetaWindow
|
||||
|
||||
if (typeof ui === 'undefined') {
|
||||
ui = new MetaWindow({
|
||||
target: container,
|
||||
});
|
||||
})
|
||||
|
||||
window.MetaWindow = ui;
|
||||
window.MetaWindow = ui
|
||||
}
|
||||
|
||||
ui.init();
|
||||
};
|
||||
ui.init()
|
||||
}
|
||||
|
||||
window.addEventListener(`${Events.LOADEDANDREADY}`, init);
|
||||
window.addEventListener(`${Events.AJAX}`, init);
|
||||
window.addEventListener(`MetaWindow.initLinks`, init);
|
||||
window.addEventListener(`${Events.LOADEDANDREADY}`, init)
|
||||
window.addEventListener(`${Events.AJAX}`, init)
|
||||
window.addEventListener('MetaWindow.initLinks', init)
|
||||
|
||||
/*function importAll(r) {
|
||||
/* function importAll(r) {
|
||||
return r.keys().map(r);
|
||||
}
|
||||
|
||||
const images = importAll(
|
||||
require.context('../img/', false, /\.(png|jpe?g|svg)$/),
|
||||
);*/
|
||||
); */
|
||||
|
||||
export default MetaWindow;
|
||||
export default MetaWindow
|
||||
|
||||
@ -1,2 +1,2 @@
|
||||
import styles from "../scss/window.scss";
|
||||
import "./app.js";
|
||||
import '../scss/window.scss'
|
||||
import './app.js'
|
||||
|
||||
@ -4,16 +4,16 @@
|
||||
*
|
||||
*/
|
||||
|
||||
import ui from "./app";
|
||||
import "../scss/app.scss";
|
||||
import "../scss/test-build.scss";
|
||||
import ui from './app'
|
||||
import '../scss/app.scss'
|
||||
import '../scss/test-build.scss'
|
||||
|
||||
/*function importAll(r) {
|
||||
/* function importAll(r) {
|
||||
return r.keys().map(r);
|
||||
}
|
||||
|
||||
const images = importAll(
|
||||
require.context('../img/', false, /\.(png|jpe?g|svg)$/),
|
||||
);*/
|
||||
); */
|
||||
|
||||
export default ui;
|
||||
export default ui
|
||||
|
||||
607
src/js/window.js
607
src/js/window.js
@ -1,10 +1,8 @@
|
||||
/*
|
||||
* Lightbox window
|
||||
*/
|
||||
import axios from "redaxios";
|
||||
|
||||
import Events from './_events';
|
||||
const W = window;
|
||||
// import Events from './_events'
|
||||
const W = window
|
||||
|
||||
class MetaWindow {
|
||||
state = {
|
||||
@ -18,139 +16,160 @@ class MetaWindow {
|
||||
current: null,
|
||||
target: null,
|
||||
extraClass: null,
|
||||
};
|
||||
}
|
||||
|
||||
init() {
|
||||
const ui = this;
|
||||
console.log(`MetaWindow: [links] init`);
|
||||
|
||||
// collect new collections
|
||||
document
|
||||
.querySelectorAll('[data-toggle="lightbox"],[data-gallery="${gallery}"]')
|
||||
cleanLinks () {
|
||||
document.querySelectorAll('[data-toggle="lightbox"]')
|
||||
.forEach((el) => {
|
||||
const gallery = el.getAttribute('data-gallery');
|
||||
if (gallery) {
|
||||
ui.state.collections[gallery] = [];
|
||||
document
|
||||
.querySelectorAll(
|
||||
`[data-toggle="lightbox"][data-gallery="${gallery}"]`
|
||||
)
|
||||
.forEach((el) => {
|
||||
ui.state.collections[gallery].push(el);
|
||||
});
|
||||
}
|
||||
el.classList.remove('loading')
|
||||
})
|
||||
}
|
||||
|
||||
collectGaleries (gallery) {
|
||||
const ui = this
|
||||
|
||||
if (!gallery) {
|
||||
return
|
||||
}
|
||||
|
||||
ui.state.collections[gallery] = []
|
||||
document
|
||||
.querySelectorAll(
|
||||
`[data-toggle="lightbox"][data-gallery="${gallery}"]`
|
||||
)
|
||||
.forEach((el) => {
|
||||
ui.state.collections[gallery].push(el)
|
||||
})
|
||||
}
|
||||
|
||||
toggle (el) {
|
||||
const ui = this
|
||||
|
||||
ui.cleanLinks()
|
||||
|
||||
const link = el.getAttribute('href') || el.getAttribute('data-href')
|
||||
const embed = el.getAttribute('data-embed')
|
||||
el.classList.add('loading')
|
||||
ui.state.current = el
|
||||
|
||||
const title = el.getAttribute('data-title')
|
||||
if (title) {
|
||||
ui.setCaption(title)
|
||||
}
|
||||
|
||||
if (embed) {
|
||||
ui.embed(link)
|
||||
} else {
|
||||
ui.load(link)
|
||||
}
|
||||
|
||||
ui.addExtraClass(el.getAttribute('data-lightbox-class'))
|
||||
}
|
||||
|
||||
init () {
|
||||
const ui = this
|
||||
console.log('MetaWindow: [links] init')
|
||||
|
||||
document
|
||||
.querySelectorAll('[data-toggle="lightbox"],[data-gallery]')
|
||||
.forEach((el) => {
|
||||
const gallery = el.getAttribute('data-gallery')
|
||||
ui.collectGaleries(gallery)
|
||||
|
||||
// click handler
|
||||
el.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
console.log(`MetaWindow: [link] click`);
|
||||
e.preventDefault()
|
||||
console.log('MetaWindow: [link] click')
|
||||
|
||||
const el = e.currentTarget;
|
||||
const link = el.getAttribute('href') || el.getAttribute('data-href');
|
||||
const embed = el.getAttribute('data-embed');
|
||||
el.classList.add('loading');
|
||||
ui.state.current = el;
|
||||
|
||||
if (embed) {
|
||||
ui.embed(link);
|
||||
} else {
|
||||
ui.load(link);
|
||||
}
|
||||
|
||||
const title = el.getAttribute('data-title');
|
||||
if (title) {
|
||||
ui.setCaption(title);
|
||||
}
|
||||
|
||||
ui.addExtraClass(el.getAttribute('data-lightbox-class'));
|
||||
});
|
||||
});
|
||||
const el = e.currentTarget
|
||||
ui.toggle(el)
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
constructor(
|
||||
constructor (
|
||||
state = {
|
||||
shown: false,
|
||||
},
|
||||
action
|
||||
) {
|
||||
const ui = this;
|
||||
const ui = this
|
||||
|
||||
ui.name = ui.constructor.name;
|
||||
console.log(`${ui.name}: init`);
|
||||
ui.axios = axios;
|
||||
ui.name = ui.constructor.name
|
||||
console.log(`${ui.name}: init`)
|
||||
|
||||
ui.setState(state);
|
||||
ui.setState(state)
|
||||
switch (action) {
|
||||
case 'show':
|
||||
ui.hide();
|
||||
break;
|
||||
ui.hide()
|
||||
break
|
||||
case 'hide':
|
||||
ui.hide();
|
||||
break;
|
||||
ui.hide()
|
||||
break
|
||||
}
|
||||
|
||||
W.dispatchEvent(new Event(`{ui.name}.init`));
|
||||
W.dispatchEvent(new Event('{ui.name}.init'))
|
||||
}
|
||||
|
||||
show = () => {
|
||||
const ui = this;
|
||||
console.log(`${ui.name}: show`);
|
||||
const ui = this
|
||||
console.log(`${ui.name}: show`)
|
||||
|
||||
ui.setState({
|
||||
shown: true,
|
||||
});
|
||||
})
|
||||
|
||||
W.dispatchEvent(new Event(`{ui.name}.show`));
|
||||
};
|
||||
W.dispatchEvent(new Event('{ui.name}.show'))
|
||||
}
|
||||
|
||||
hide = () => {
|
||||
const ui = this;
|
||||
const ui = this
|
||||
|
||||
console.log(`${ui.name}: hide`);
|
||||
console.log(`${ui.name}: hide`)
|
||||
ui.setState({
|
||||
shown: false,
|
||||
});
|
||||
W.dispatchEvent(new Event(`{ui.name}.hide`));
|
||||
};
|
||||
})
|
||||
W.dispatchEvent(new Event('{ui.name}.hide'))
|
||||
}
|
||||
|
||||
next = () => {
|
||||
const ui = this;
|
||||
const el = ui.state.current;
|
||||
const gallery = el.getAttribute('data-gallery');
|
||||
const ui = this
|
||||
const el = ui.state.current
|
||||
const gallery = el.getAttribute('data-gallery')
|
||||
|
||||
let i = ui._currIndex();
|
||||
let i = ui._currIndex()
|
||||
if (i < ui.state.collections[gallery].length - 1) {
|
||||
i++;
|
||||
i++
|
||||
} else {
|
||||
i = 0;
|
||||
i = 0
|
||||
}
|
||||
|
||||
ui.state.collections[gallery][i].click();
|
||||
ui.state.collections[gallery][i].click()
|
||||
|
||||
console.log(`${ui.name}: next`);
|
||||
W.dispatchEvent(new Event(`{ui.name}.next`));
|
||||
};
|
||||
console.log(`${ui.name}: next`)
|
||||
W.dispatchEvent(new Event('{ui.name}.next'))
|
||||
}
|
||||
|
||||
prev = () => {
|
||||
const ui = this;
|
||||
const el = ui.state.current;
|
||||
const gallery = el.getAttribute('data-gallery');
|
||||
const ui = this
|
||||
const el = ui.state.current
|
||||
const gallery = el.getAttribute('data-gallery')
|
||||
|
||||
let i = ui._currIndex();
|
||||
let i = ui._currIndex()
|
||||
if (i > 0) {
|
||||
i--;
|
||||
i--
|
||||
} else {
|
||||
i = ui.state.collections[gallery].length - 1;
|
||||
i = ui.state.collections[gallery].length - 1
|
||||
}
|
||||
|
||||
ui.state.collections[gallery][i].click();
|
||||
ui.state.collections[gallery][i].click()
|
||||
|
||||
console.log(`${ui.name}: prev`);
|
||||
W.dispatchEvent(new Event(`{ui.name}.prev`));
|
||||
};
|
||||
console.log(`${ui.name}: prev`)
|
||||
W.dispatchEvent(new Event('{ui.name}.prev'))
|
||||
}
|
||||
|
||||
reset = () => {
|
||||
const ui = this;
|
||||
const ui = this
|
||||
|
||||
ui.setState({
|
||||
content: '',
|
||||
@ -159,343 +178,327 @@ class MetaWindow {
|
||||
loading: false,
|
||||
error: false,
|
||||
embed: false,
|
||||
//collections: [],
|
||||
//current: null,
|
||||
//target: null,
|
||||
});
|
||||
};
|
||||
// collections: [],
|
||||
// current: null,
|
||||
// target: null,
|
||||
})
|
||||
}
|
||||
|
||||
load = (link) => {
|
||||
const ui = this;
|
||||
const axios = ui.axios;
|
||||
const ui = this
|
||||
|
||||
ui.reset();
|
||||
ui.reset()
|
||||
ui.setState({
|
||||
loading: true,
|
||||
});
|
||||
ui.show();
|
||||
})
|
||||
ui.show()
|
||||
|
||||
axios
|
||||
.get(link, {
|
||||
responseType: 'arraybuffer',
|
||||
})
|
||||
.then((resp) => {
|
||||
// handle success
|
||||
console.log(
|
||||
`${ui.name}: response content-type: ${resp.headers['content-type']}`
|
||||
);
|
||||
const json = false;
|
||||
window.fetch(link).then((resp) => {
|
||||
// handle success
|
||||
const type = resp.headers.get('content-type')
|
||||
console.log(resp)
|
||||
|
||||
switch (resp.headers['content-type']) {
|
||||
case 'image/jpeg':
|
||||
case 'image/png':
|
||||
case 'image/svg+xml':
|
||||
case 'image/bmp':
|
||||
case 'image/gif':
|
||||
case 'image/tiff':
|
||||
case 'image/webp':
|
||||
// irregular types:
|
||||
case 'image/jpg':
|
||||
case 'image/svg':
|
||||
//json = JSON.parse(ui._abToString(resp.data));
|
||||
console.log(
|
||||
`${ui.name}: response content-type: ${type}`
|
||||
)
|
||||
const json = false
|
||||
|
||||
switch (type) {
|
||||
case 'image/jpeg':
|
||||
case 'image/png':
|
||||
case 'image/svg+xml':
|
||||
case 'image/bmp':
|
||||
case 'image/gif':
|
||||
case 'image/tiff':
|
||||
case 'image/webp':
|
||||
case 'image/jpg':
|
||||
case 'image/svg':
|
||||
// json = JSON.parse(ui._abToString(resp.data));
|
||||
resp.arrayBuffer().then((buffer) => {
|
||||
ui.setContent(
|
||||
`<img src="data:${
|
||||
resp.headers['content-type']
|
||||
};base64,${ui._imageEncode(resp.data)}" />`,
|
||||
`<img src="data:${type};base64,${ui._imageEncode(buffer)}" />`,
|
||||
`meta-${ui.name}--image`
|
||||
);
|
||||
break;
|
||||
case 'application/json':
|
||||
case 'application/ld+json':
|
||||
// irregular types:
|
||||
case 'application/json; charset=UTF-8':
|
||||
ui.setContent(`${json['Content']}`, [
|
||||
`meta-${ui.name}--text`,
|
||||
`meta-${ui.name}--html`,
|
||||
`meta-${ui.name}--json`,
|
||||
]);
|
||||
)
|
||||
})
|
||||
break
|
||||
case 'application/json':
|
||||
case 'application/ld+json':
|
||||
case 'application/json; charset=UTF-8':
|
||||
ui.setContent(`${json.Content}`, [
|
||||
`meta-${ui.name}--text`,
|
||||
`meta-${ui.name}--html`,
|
||||
`meta-${ui.name}--json`,
|
||||
])
|
||||
|
||||
break;
|
||||
case 'video/mp4':
|
||||
ui.setContent(`<video controls autoplay><source src="${link}" type="video/mp4">Your browser does not support the video tag.</video>`, [
|
||||
`meta-${ui.name}--image`,
|
||||
`meta-${ui.name}--video`,
|
||||
]);
|
||||
break;
|
||||
case 'text/html':
|
||||
case 'application/xhtml+xml':
|
||||
case 'text/plain':
|
||||
// irregular types:
|
||||
case 'text/html; charset=UTF-8':
|
||||
case 'application/xhtml+xml; charset=UTF-8':
|
||||
case 'text/plain; charset=UTF-8':
|
||||
ui.setContent(ui._abToString(resp.data), [
|
||||
`meta-${ui.name}--text`,
|
||||
`meta-${ui.name}--html`,
|
||||
`meta-${ui.name}--pajax`,
|
||||
]);
|
||||
break;
|
||||
default:
|
||||
console.warn(`${ui.name}: Unknown response content-type!`);
|
||||
break;
|
||||
}
|
||||
break
|
||||
case 'video/mp4':
|
||||
ui.setContent(`<video controls autoplay><source src="${link}" type="video/mp4">Your browser does not support the video tag.</video>`, [
|
||||
`meta-${ui.name}--image`,
|
||||
`meta-${ui.name}--video`,
|
||||
])
|
||||
break
|
||||
case 'text/html':
|
||||
case 'application/xhtml+xml':
|
||||
case 'text/plain':
|
||||
case 'text/html; charset=UTF-8':
|
||||
case 'application/xhtml+xml; charset=UTF-8':
|
||||
case 'text/plain; charset=UTF-8':
|
||||
ui.setContent(resp.data, [
|
||||
`meta-${ui.name}--text`,
|
||||
`meta-${ui.name}--html`,
|
||||
`meta-${ui.name}--pajax`,
|
||||
])
|
||||
break
|
||||
default:
|
||||
console.warn(`${ui.name}: Unknown response content-type!`)
|
||||
break
|
||||
}
|
||||
|
||||
W.dispatchEvent(new Event(`{ui.name}.loaded`));
|
||||
})
|
||||
W.dispatchEvent(new Event('{ui.name}.loaded'))
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error(error);
|
||||
console.error(error)
|
||||
|
||||
let msg = '';
|
||||
let msg = ''
|
||||
|
||||
if (error.response) {
|
||||
switch (error.response.status) {
|
||||
case 404:
|
||||
msg = 'Not Found.';
|
||||
break;
|
||||
msg = 'Not Found.'
|
||||
break
|
||||
case 500:
|
||||
msg = 'Server issue, please try again latter.';
|
||||
break;
|
||||
msg = 'Server issue, please try again latter.'
|
||||
break
|
||||
default:
|
||||
msg = 'Something went wrong.';
|
||||
break;
|
||||
msg = 'Something went wrong.'
|
||||
break
|
||||
}
|
||||
} else if (error.request) {
|
||||
msg = 'No response received';
|
||||
msg = 'No response received'
|
||||
} else {
|
||||
console.warn('Error', error.message);
|
||||
console.warn('Error', error.message)
|
||||
}
|
||||
|
||||
ui.setState({
|
||||
error: msg,
|
||||
});
|
||||
})
|
||||
|
||||
W.dispatchEvent(new Event(`{ui.name}.error`));
|
||||
W.dispatchEvent(new Event('{ui.name}.error'))
|
||||
})
|
||||
.then(() => {
|
||||
ui.setState({
|
||||
loading: false,
|
||||
});
|
||||
})
|
||||
|
||||
setTimeout(() => {
|
||||
ui.state.current.classList.remove('loading');
|
||||
}, 3000);
|
||||
});
|
||||
};
|
||||
ui.state.current.classList.remove('loading')
|
||||
}, 1000)
|
||||
})
|
||||
}
|
||||
|
||||
_currIndex = () => {
|
||||
const ui = this;
|
||||
const el = ui.state.current;
|
||||
const gallery = el.getAttribute('data-gallery');
|
||||
const ui = this
|
||||
const el = ui.state.current
|
||||
const gallery = el.getAttribute('data-gallery')
|
||||
|
||||
return ui.state.collections[gallery].indexOf(el);
|
||||
};
|
||||
return ui.state.collections[gallery].indexOf(el)
|
||||
}
|
||||
|
||||
embed = (link) => {
|
||||
const ui = this;
|
||||
console.log(`${ui.name}: embed`);
|
||||
const ui = this
|
||||
console.log(`${ui.name}: embed`)
|
||||
|
||||
ui.reset();
|
||||
ui.reset()
|
||||
ui.setState({
|
||||
embed: link,
|
||||
loading: false,
|
||||
type: [`meta-${ui.name}--embed`, `meta-${ui.name}--video`],
|
||||
});
|
||||
})
|
||||
|
||||
ui.show();
|
||||
};
|
||||
ui.show()
|
||||
}
|
||||
|
||||
setCaption = (title) => {
|
||||
const ui = this;
|
||||
console.log(`${ui.name}: setCaption`);
|
||||
const ui = this
|
||||
console.log(`${ui.name}: setCaption`)
|
||||
|
||||
ui.state.caption = title;
|
||||
};
|
||||
ui.state.caption = title
|
||||
}
|
||||
|
||||
addExtraClass = (cls) => {
|
||||
const ui = this;
|
||||
const ui = this
|
||||
|
||||
if (!cls.length) {
|
||||
return;
|
||||
if (!cls || !cls.length) {
|
||||
return
|
||||
}
|
||||
|
||||
console.log(`${ui.name}: addExtraClass(${cls})`);
|
||||
ui.state.extraClass = cls;
|
||||
};
|
||||
console.log(`${ui.name}: addExtraClass(${cls})`)
|
||||
ui.state.extraClass = cls
|
||||
}
|
||||
|
||||
getCaption = () => {
|
||||
const ui = this;
|
||||
return ui.state.caption;
|
||||
};
|
||||
const ui = this
|
||||
return ui.state.caption
|
||||
}
|
||||
|
||||
_abToString = (arrayBuffer) => {
|
||||
/* _abToString = (arrayBuffer) => {
|
||||
return String.fromCharCode.apply(null, new Uint8Array(arrayBuffer));
|
||||
};
|
||||
}; */
|
||||
|
||||
_imageEncode = (arrayBuffer) => {
|
||||
const u8 = new Uint8Array(arrayBuffer);
|
||||
const b64encoded = btoa(
|
||||
[].reduce.call(
|
||||
new Uint8Array(arrayBuffer),
|
||||
(p, c) => {
|
||||
return p + String.fromCharCode(c);
|
||||
},
|
||||
|
||||
''
|
||||
)
|
||||
);
|
||||
|
||||
return b64encoded;
|
||||
};
|
||||
_imageEncode = (buffer) => {
|
||||
let binary = ''
|
||||
const bytes = [].slice.call(new Uint8Array(buffer))
|
||||
bytes.forEach((b) => {
|
||||
binary += String.fromCharCode(b)
|
||||
})
|
||||
return window.btoa(binary)
|
||||
}
|
||||
|
||||
setContent = (html, type) => {
|
||||
const ui = this;
|
||||
console.log(`${ui.name}: setContent`);
|
||||
const ui = this
|
||||
console.log(`${ui.name}: setContent`)
|
||||
|
||||
let typeArr = type
|
||||
? type
|
||||
: [`meta-${ui.name}--html`, `meta-${ui.name}--text`];
|
||||
let typeArr = type || [`meta-${ui.name}--html`, `meta-${ui.name}--text`]
|
||||
if (!Array.isArray(typeArr)) {
|
||||
typeArr = type.split(' ');
|
||||
typeArr = type.split(' ')
|
||||
}
|
||||
|
||||
ui.setState({
|
||||
content: html,
|
||||
type: typeArr,
|
||||
});
|
||||
};
|
||||
|
||||
getHtml = () => {
|
||||
const ui = this;
|
||||
|
||||
if (ui.state.embed) {
|
||||
const youtubeEmbed = require('youtube-embed');
|
||||
const embedLink = youtubeEmbed(ui.state.embed);
|
||||
ui.state.content = `<iframe width="600" height="380" src="${embedLink}" frameborder="0"></iframe>`;
|
||||
}
|
||||
|
||||
return ui.state.content;
|
||||
};
|
||||
|
||||
setState(state) {
|
||||
const ui = this;
|
||||
ui.state = Object.assign({}, ui.state, state);
|
||||
ui.render();
|
||||
})
|
||||
}
|
||||
|
||||
render() {
|
||||
const ui = this;
|
||||
const name = ui.name;
|
||||
getHtml = () => {
|
||||
const ui = this
|
||||
|
||||
const navs = null;
|
||||
const el = ui.state.current;
|
||||
if (ui.state.embed) {
|
||||
const youtubeEmbed = require('youtube-embed')
|
||||
const embedLink = youtubeEmbed(ui.state.embed)
|
||||
ui.state.content = `<iframe width="600" height="380" src="${embedLink}" frameborder="0"></iframe>`
|
||||
}
|
||||
|
||||
ui.state.target.innerHTML = '';
|
||||
const meta = document.createElement('div');
|
||||
meta.classList.add(`meta-${name}`);
|
||||
meta.classList.add(...ui.state.type);
|
||||
ui.state.target.append(meta);
|
||||
return ui.state.content
|
||||
}
|
||||
|
||||
const metaOverlay = document.createElement('div');
|
||||
metaOverlay.classList.add(`meta-${name}-overlay`);
|
||||
setState (state) {
|
||||
const ui = this
|
||||
ui.state = Object.assign({}, ui.state, state)
|
||||
ui.render()
|
||||
}
|
||||
|
||||
render () {
|
||||
const ui = this
|
||||
const name = ui.name
|
||||
const el = ui.state.current
|
||||
|
||||
ui.state.target.innerHTML = ''
|
||||
const meta = document.createElement('div')
|
||||
meta.classList.add(`meta-${name}`)
|
||||
meta.classList.add(...ui.state.type)
|
||||
ui.state.target.append(meta)
|
||||
|
||||
const metaOverlay = document.createElement('div')
|
||||
metaOverlay.classList.add(`meta-${name}-overlay`)
|
||||
if (ui.state.shown) {
|
||||
metaOverlay.classList.add(`meta-${name}-overlay--open`);
|
||||
metaOverlay.classList.add(`meta-${name}-overlay--open`)
|
||||
}
|
||||
|
||||
if (ui.state.loading) {
|
||||
metaOverlay.classList.add(`meta-${name}-overlay--loading`);
|
||||
metaOverlay.classList.add(`meta-${name}-overlay--loading`)
|
||||
}
|
||||
|
||||
if (ui.state.error) {
|
||||
metaOverlay.classList.add(`meta-${name}-overlay--error`);
|
||||
metaOverlay.classList.add(`meta-${name}-overlay--error`)
|
||||
}
|
||||
|
||||
meta.append(metaOverlay);
|
||||
meta.append(metaOverlay)
|
||||
|
||||
const metaContent = document.createElement('div');
|
||||
metaContent.classList.add('meta-content');
|
||||
metaOverlay.append(metaContent);
|
||||
const metaContent = document.createElement('div')
|
||||
metaContent.classList.add('meta-content')
|
||||
metaOverlay.append(metaContent)
|
||||
|
||||
const btnClose = document.createElement('button');
|
||||
btnClose.classList.add('meta-nav', 'meta-close', 'a');
|
||||
const btnClose = document.createElement('button')
|
||||
btnClose.classList.add('meta-nav', 'meta-close', 'a')
|
||||
btnClose.innerHTML =
|
||||
'<i class="icon fa fas fa-times"></i>' +
|
||||
' <span class="visually-hidden">Close</span>';
|
||||
' <span class="visually-hidden">Close</span>'
|
||||
btnClose.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
ui.hide();
|
||||
});
|
||||
metaContent.append(btnClose);
|
||||
e.preventDefault()
|
||||
ui.hide()
|
||||
})
|
||||
metaContent.append(btnClose)
|
||||
|
||||
if (el) {
|
||||
const gallery = el.getAttribute('data-gallery');
|
||||
const gallery = el.getAttribute('data-gallery')
|
||||
if (gallery && ui.state.collections[gallery].length > 1) {
|
||||
const navs = document.createElement('nav');
|
||||
navs.classList.add('meta-navs');
|
||||
const navs = document.createElement('nav')
|
||||
navs.classList.add('meta-navs')
|
||||
|
||||
const prevBtn = document.createElement('button');
|
||||
const prevBtn = document.createElement('button')
|
||||
prevBtn.classList.add(
|
||||
'meta-nav',
|
||||
'meta-nav-arrow',
|
||||
'meta-nav-arrow__prev',
|
||||
'a'
|
||||
);
|
||||
)
|
||||
prevBtn.innerHTML =
|
||||
'<i class="icon fa fas fa-chevron-left"></i>' +
|
||||
' <span class="visually-hidden">Previous</span>';
|
||||
' <span class="visually-hidden">Previous</span>'
|
||||
prevBtn.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
ui.prev();
|
||||
});
|
||||
navs.append(prevBtn);
|
||||
e.preventDefault()
|
||||
ui.prev()
|
||||
})
|
||||
navs.append(prevBtn)
|
||||
|
||||
const nextBtn = document.createElement('button');
|
||||
const nextBtn = document.createElement('button')
|
||||
nextBtn.classList.add(
|
||||
'meta-nav',
|
||||
'meta-nav-arrow',
|
||||
'meta-nav-arrow__next',
|
||||
'a'
|
||||
);
|
||||
)
|
||||
nextBtn.innerHTML =
|
||||
'<i class="icon fa fas fa-chevron-right"></i>' +
|
||||
' <span class="visually-hidden">Next</span>';
|
||||
' <span class="visually-hidden">Next</span>'
|
||||
nextBtn.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
ui.next();
|
||||
});
|
||||
navs.append(nextBtn);
|
||||
e.preventDefault()
|
||||
ui.next()
|
||||
})
|
||||
navs.append(nextBtn)
|
||||
|
||||
metaContent.append(navs);
|
||||
metaContent.append(navs)
|
||||
}
|
||||
}
|
||||
|
||||
const content = document.createElement('section');
|
||||
content.classList.add('meta-wrap', 'typography');
|
||||
const content = document.createElement('section')
|
||||
content.classList.add('meta-wrap', 'typography')
|
||||
if (ui.state.extraClass) {
|
||||
content.classList.add(ui.state.extraClass);
|
||||
content.classList.add(ui.state.extraClass)
|
||||
}
|
||||
|
||||
content.innerHTML = ui.getHtml();
|
||||
metaContent.append(content);
|
||||
content.innerHTML = ui.getHtml()
|
||||
metaContent.append(content)
|
||||
|
||||
if (ui.state.error) {
|
||||
const error = document.createElement('div');
|
||||
error.classList.add('meta-error');
|
||||
error.innerHTML = ui.state.error;
|
||||
metaContent.append(error);
|
||||
const error = document.createElement('div')
|
||||
error.classList.add('meta-error')
|
||||
error.innerHTML = ui.state.error
|
||||
metaContent.append(error)
|
||||
} else if (ui.state.caption) {
|
||||
const caption = document.createElement('div');
|
||||
caption.classList.add('meta-caption');
|
||||
caption.innerHTML = ui.getCaption();
|
||||
metaContent.append(caption);
|
||||
const caption = document.createElement('div')
|
||||
caption.classList.add('meta-caption')
|
||||
caption.innerHTML = ui.getCaption()
|
||||
metaContent.append(caption)
|
||||
}
|
||||
|
||||
// update fontawesome dome
|
||||
if (typeof window.FontAwesome !== 'undefined') {
|
||||
window.FontAwesome.dom.i2svg();
|
||||
window.FontAwesome.dom.i2svg()
|
||||
}
|
||||
|
||||
return ui;
|
||||
return ui
|
||||
}
|
||||
}
|
||||
|
||||
export default MetaWindow;
|
||||
export default MetaWindow
|
||||
|
||||
Loading…
Reference in New Issue
Block a user