UI: GraphQL active pages
This commit is contained in:
Tony Air
parent
4b79371f82
commit
61bb002544
|
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
"version": "3.0.5",
|
||||
"version": "3.0.6",
|
||||
"name": "@a2nt/ss-bootstrap-ui-webpack-boilerplate-react",
|
||||
"description": "This UI Kit allows you to build Bootstrap 5 webapp with some extra UI features. It's easy to extend and easy to convert HTML templates to CMS templates.",
|
||||
"icons": {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
"version": "3.0.5",
|
||||
"version": "3.0.6",
|
||||
"api_version": 1,
|
||||
"layout": {
|
||||
"logo": "yandex-browser-50x50.png",
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<!doctype html><html lang="en"><head><title>Webpack Bootstrap 4 UI Demo</title><meta charset="utf-8"/><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"/><meta name="description" content="UI Kit"/><meta name="author" content="Tony Air <tony@twma.pro>"/><meta name="ping" content="/Security/ping"/><meta name="api_url" content="http://127.0.0.1/graphql"/><meta name="api_static_domain" content="http://127.0.0.1"/><meta name="swversion" content="sw-1614088295878"/><base href="http://127.0.0.1:3001"/><script defer="defer" src="js/app.js"></script><script defer="defer" src="js/app_sw.js"></script><link href="css/app.css" rel="stylesheet"></head><body data-default-lng="0" data-default-lat="0"><div class="wrapper"><style>@keyframes lds-ellipsis1{0%{transform:scale(0)}100%{transform:scale(1)}}@keyframes lds-ellipsis3{0%{transform:scale(1)}100%{transform:scale(0)}}@keyframes lds-ellipsis2{0%{transform:translate(0,0)}100%{transform:translate(1.35rem,0)}}body,html{font-size:14px;margin:0;padding:0;background:#fff;color:#333;overflow-x:hidden}@media (min-width:2000px){body,html{font-size:.9vw}}#PageLoading{position:fixed;left:0;top:0;margin:0;width:100%!important;height:100%!important;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;z-index:2000;will-change:opacity;background:#212529;color:#212529}#PageLoading .logo{filter:invert(1);margin-left:20px;margin-left:2vw;width:100px;width:12.5vw}.main-bn{position:fixed;top:0;left:0;width:100%;z-index:99999999;padding:.5rem 1rem;text-align:center;color:#fff;background:red}iframe,img{max-width:100%}.loading-spinner{text-align:center}.lds-ellipsis{display:inline-block;position:relative;width:4.57rem;height:1rem;color:#fff}.lds-ellipsis div{position:absolute;top:.15rem;width:.78rem;height:.78rem;border-radius:50%;background:#888;animation-timing-function:cubic-bezier(0,1,1,0)}.lds-ellipsis div:nth-child(1){left:.42rem;animation:lds-ellipsis1 .6s infinite}.lds-ellipsis div:nth-child(2){left:.9rem;animation:lds-ellipsis2 .6s infinite}.lds-ellipsis div:nth-child(3){left:1.85rem;animation:lds-ellipsis2 .6s infinite}.lds-ellipsis div:nth-child(4){left:3.21rem;animation:lds-ellipsis3 .6s infinite}@keyframes lds-text{from{font-size:1em}to{font-size:1.5em}}.lds-text{position:absolute;top:50%;left:50%;margin-left:-5rem;margin-top:8rem;font-size:.8rem;letter-spacing:.25em;color:#fff}.lds-text b{font-weight:300;animation:lds-text 5s ease infinite alternate}.lds-text b:nth-child(1){animation-delay:.5s}.lds-text b:nth-child(2){animation-delay:1s}.lds-text b:nth-child(3){animation-delay:1.5s}.lds-text b:nth-child(4){animation-delay:2s}.lds-text b:nth-child(5){animation-delay:2.5s}.lds-text b:nth-child(6){animation-delay:3s}.lds-text b:nth-child(7){animation-delay:3.5s}.lds-text b:nth-child(8){animation-delay:4s}.lds-text b:nth-child(9){animation-delay:4.5s}.lds-text b:nth-child(10){animation-delay:5s}@media (orientation:portrait){#PageLoading .logo{width:50vw}}</style><div id="PageLoading"><div class="loading-spinner"><img class="logo" src="../fonts/logo.svg" width="200" alt="UI Kit"/><br/><div class="lds-ellipsis"><div></div><div></div><div></div><div></div></div><br/><div class="lds-placeholder">LOADING...</div><div class="lds-text"><b>L</b> <b>O</b> <b>A</b> <b>D</b> <b>I</b> <b>N</b> <b>G</b> <b>.</b> <b>.</b> <b>.</b></div></div></div><div id="SiteWideAlerts" class="offline-message"><div class="alert alert-danger alert-offline alert-dismissible fade show" role="alert"><div class="typography">The Internet connection is missing right now, but you're able to browse previously opened pages offline.</div><button type="button" class="btn btn-danger btn-close" data-bs-dismiss="alert" aria-label="Close"><i class="fas fa-times"></i></button></div><noscript><div class="main-bn alert alert-fixed-top alert-danger" role="alert">Please, enable javascript.</div></noscript><!--[if lt IE 11
|
||||
<!doctype html><html lang="en"><head><title>Webpack Bootstrap 4 UI Demo</title><meta charset="utf-8"/><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"/><meta name="description" content="UI Kit"/><meta name="author" content="Tony Air <tony@twma.pro>"/><meta name="ping" content="/Security/ping"/><meta name="api_url" content="http://127.0.0.1/graphql"/><meta name="api_static_domain" content="http://127.0.0.1"/><meta name="swversion" content="sw-1614166370977"/><base href="http://127.0.0.1:3001"/><script defer="defer" src="js/app.js"></script><script defer="defer" src="js/app_sw.js"></script><link href="css/app.css" rel="stylesheet"></head><body data-default-lng="0" data-default-lat="0"><div class="wrapper"><style>@keyframes lds-ellipsis1{0%{transform:scale(0)}100%{transform:scale(1)}}@keyframes lds-ellipsis3{0%{transform:scale(1)}100%{transform:scale(0)}}@keyframes lds-ellipsis2{0%{transform:translate(0,0)}100%{transform:translate(1.35rem,0)}}body,html{font-size:14px;margin:0;padding:0;background:#fff;color:#333;overflow-x:hidden}@media (min-width:2000px){body,html{font-size:.9vw}}#PageLoading{position:fixed;left:0;top:0;margin:0;width:100%!important;height:100%!important;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;z-index:2000;will-change:opacity;background:#212529;color:#212529}#PageLoading .logo{filter:invert(1);margin-left:20px;margin-left:2vw;width:100px;width:12.5vw}#PageLoading .tagline{color:#fff;font-size:1.8rem;font-size:4vh;letter-spacing:.25em}.main-bn{position:fixed;top:0;left:0;width:100%;z-index:99999999;padding:.5rem 1rem;text-align:center;color:#fff;background:red}iframe,img{max-width:100%}.loading-spinner{text-align:center}.lds-ellipsis{display:inline-block;position:relative;width:4.57rem;height:1rem;color:#fff}.lds-ellipsis div{position:absolute;top:.15rem;width:.78rem;height:.78rem;border-radius:50%;background:#888;animation-timing-function:cubic-bezier(0,1,1,0)}.lds-ellipsis div:nth-child(1){left:.42rem;animation:lds-ellipsis1 .6s infinite}.lds-ellipsis div:nth-child(2){left:.9rem;animation:lds-ellipsis2 .6s infinite}.lds-ellipsis div:nth-child(3){left:1.85rem;animation:lds-ellipsis2 .6s infinite}.lds-ellipsis div:nth-child(4){left:3.21rem;animation:lds-ellipsis3 .6s infinite}@keyframes lds-text{from{font-size:1em}to{font-size:1.5em}}.lds-text{position:absolute;top:50%;left:50%;margin-left:-5rem;margin-top:8rem;font-size:.8rem;letter-spacing:.25em;color:#fff}.lds-text b{font-weight:300;animation:lds-text 5s ease infinite alternate}.lds-text b:nth-child(1){animation-delay:.5s}.lds-text b:nth-child(2){animation-delay:1s}.lds-text b:nth-child(3){animation-delay:1.5s}.lds-text b:nth-child(4){animation-delay:2s}.lds-text b:nth-child(5){animation-delay:2.5s}.lds-text b:nth-child(6){animation-delay:3s}.lds-text b:nth-child(7){animation-delay:3.5s}.lds-text b:nth-child(8){animation-delay:4s}.lds-text b:nth-child(9){animation-delay:4.5s}.lds-text b:nth-child(10){animation-delay:5s}@media (orientation:portrait){#PageLoading .logo{width:50vw}#PageLoading .tagline{font-size:4vw}}</style><div id="PageLoading"><div class="loading-spinner"><img class="logo" src="../fonts/logo.svg" width="200" alt="UI Kit"/><br/><div class="lds-ellipsis"><div></div><div></div><div></div><div></div></div><br/><div class="lds-placeholder">LOADING...</div><div class="lds-text"><b>L</b> <b>O</b> <b>A</b> <b>D</b> <b>I</b> <b>N</b> <b>G</b> <b>.</b> <b>.</b> <b>.</b></div></div></div><div id="SiteWideAlerts" class="offline-message"><div class="alert alert-danger alert-offline alert-dismissible fade show" role="alert"><div class="typography">The Internet connection is missing right now, but you're able to browse previously opened pages offline.</div><button type="button" class="btn btn-danger btn-close" data-bs-dismiss="alert" aria-label="Close"><i class="fas fa-times"></i></button></div><noscript><div class="main-bn alert alert-fixed-top alert-danger" role="alert">Please, enable javascript.</div></noscript><!--[if lt IE 11
|
||||
]><div class="main-bn alert alert-danger" role="alert">
|
||||
<a
|
||||
href="https://www.google.com/chrome/browser/desktop/"
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -1 +1 @@
|
|||
!function(){var e={4904:function(e){e.exports=function log(e){false}},4546:function(e){Cache.prototype.add||(Cache.prototype.add=function add(e){return this.addAll([e])}),Cache.prototype.addAll||(Cache.prototype.addAll=function addAll(e){var t=this;function NetworkError(e){this.name="NetworkError",this.code=19,this.message=e}return NetworkError.prototype=Object.create(Error.prototype),Promise.resolve().then((function(){if(arguments.length<1)throw new TypeError;return e=e.map((function(e){return e instanceof Request?e:String(e)})),Promise.all(e.map((function(e){"string"===typeof e&&(e=new Request(e));var t=new URL(e.url).protocol;if("http:"!==t&&"https:"!==t)throw new NetworkError("Invalid scheme");return fetch(e.clone())})))})).then((function(n){return Promise.all(n.map((function(n,r){return t.put(e[r],n)})))})).then((function(){}))}),CacheStorage.prototype.match||(CacheStorage.prototype.match=function match(e,t){var n=this;return this.keys().then((function(r){var o;return r.reduce((function(r,a){return r.then((function(){return o||n.open(a).then((function(n){return n.match(e,t)})).then((function(e){return o=e}))}))}),Promise.resolve())}))}),e.exports=self.caches}},t={};function __webpack_require__(n){if(t[n])return t[n].exports;var r=t[n]={exports:{}};return e[n](r,r.exports,__webpack_require__),r.exports}!function(){var e="".concat("@a2nt/ss-bootstrap-ui-webpack-boilerplate-react","-sw"),t="".concat("3.0.5","-sw"),n=__webpack_require__(4904),r=__webpack_require__(4546);if("string"!==typeof e)throw new Error("Cache Name cannot be empty");self.addEventListener("fetch",(function(t){if("GET"===t.request.method){var o=new URL(t.request.url);if(o.pathname.indexOf("admin")>=0||o.pathname.indexOf("Security")>=0||o.pathname.indexOf("/dev")>=0)n("SW: skip admin ".concat(t.request.url));else{var a=t.request.clone(),c=t.request.clone();t.respondWith(fetch(a).then((function(n){var o=n.clone();return r.open(e).then((function(e){var n=t.request.clone();e.put(n,o)})),n})).catch((function(e){return n("SW: fetch failed"),r.match(c)})))}}})),self.addEventListener("activate",(function(o){n("SW: activated: ".concat(t)),o.waitUntil(r.delete(e))})),self.addEventListener("install",(function(e){n("SW: installing version: ".concat(t))}))}()}();
|
||||
!function(){var e={4904:function(e){e.exports=function log(e){false}},4546:function(e){Cache.prototype.add||(Cache.prototype.add=function add(e){return this.addAll([e])}),Cache.prototype.addAll||(Cache.prototype.addAll=function addAll(e){var t=this;function NetworkError(e){this.name="NetworkError",this.code=19,this.message=e}return NetworkError.prototype=Object.create(Error.prototype),Promise.resolve().then((function(){if(arguments.length<1)throw new TypeError;return e=e.map((function(e){return e instanceof Request?e:String(e)})),Promise.all(e.map((function(e){"string"===typeof e&&(e=new Request(e));var t=new URL(e.url).protocol;if("http:"!==t&&"https:"!==t)throw new NetworkError("Invalid scheme");return fetch(e.clone())})))})).then((function(n){return Promise.all(n.map((function(n,r){return t.put(e[r],n)})))})).then((function(){}))}),CacheStorage.prototype.match||(CacheStorage.prototype.match=function match(e,t){var n=this;return this.keys().then((function(r){var o;return r.reduce((function(r,a){return r.then((function(){return o||n.open(a).then((function(n){return n.match(e,t)})).then((function(e){return o=e}))}))}),Promise.resolve())}))}),e.exports=self.caches}},t={};function __webpack_require__(n){if(t[n])return t[n].exports;var r=t[n]={exports:{}};return e[n](r,r.exports,__webpack_require__),r.exports}!function(){var e="".concat("@a2nt/ss-bootstrap-ui-webpack-boilerplate-react","-sw"),t="".concat("3.0.6","-sw"),n=__webpack_require__(4904),r=__webpack_require__(4546);if("string"!==typeof e)throw new Error("Cache Name cannot be empty");self.addEventListener("fetch",(function(t){if("GET"===t.request.method){var o=new URL(t.request.url);if(o.pathname.indexOf("admin")>=0||o.pathname.indexOf("Security")>=0||o.pathname.indexOf("/dev")>=0)n("SW: skip admin ".concat(t.request.url));else{var a=t.request.clone(),c=t.request.clone();t.respondWith(fetch(a).then((function(n){var o=n.clone();return r.open(e).then((function(e){var n=t.request.clone();e.put(n,o)})),n})).catch((function(e){return n("SW: fetch failed"),r.match(c)})))}}})),self.addEventListener("activate",(function(o){n("SW: activated: ".concat(t)),o.waitUntil(r.delete(e))})),self.addEventListener("install",(function(e){n("SW: installing version: ".concat(t))}))}()}();
|
||||
|
|
@ -70,6 +70,56 @@
|
|||
898
|
||||
]
|
||||
},
|
||||
"mini-css-extract-plugin /mnt/data/srv/dist/repositories/webpack-bootstrap-ui-kit/node_modules/.pnpm/css-loader@5.0.2_webpack@5.23.0/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/.pnpm/resolve-url-loader@3.1.2/node_modules/resolve-url-loader/index.js!./node_modules/.pnpm/sass-loader@11.0.1_node-sass@5.0.0+webpack@5.23.0/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[3]!./node_modules/.pnpm/@a2nt/meta-lightbox-react@3.0.4/node_modules/@a2nt/meta-lightbox-react/src/scss/_window.scss": [
|
||||
{
|
||||
"chunks": {
|
||||
"byName": {
|
||||
"child": 396
|
||||
},
|
||||
"bySource": {
|
||||
"0 child": 396
|
||||
},
|
||||
"usedIds": [
|
||||
396
|
||||
]
|
||||
},
|
||||
"modules": {
|
||||
"byIdentifier": {
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_2c88fa80e813acf2bb735191f3f77062/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/css-loader@5.0.2_webpack@5.23.0/node_modules/css-loader/dist/runtime/api.js": 588,
|
||||
"./node_modules/.pnpm/css-loader@5.0.2_webpack@5.23.0/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/.pnpm/resolve-url-loader@3.1.2/node_modules/resolve-url-loader/index.js!./node_modules/.pnpm/sass-loader@11.0.1_node-sass@5.0.0+webpack@5.23.0/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[3]!./node_modules/.pnpm/@a2nt/meta-lightbox-react@3.0.4/node_modules/@a2nt/meta-lightbox-react/src/scss/_window.scss": 330
|
||||
},
|
||||
"usedIds": [
|
||||
330,
|
||||
588
|
||||
]
|
||||
}
|
||||
}
|
||||
],
|
||||
"mini-css-extract-plugin /mnt/data/srv/dist/repositories/webpack-bootstrap-ui-kit/node_modules/.pnpm/css-loader@5.0.2_webpack@5.23.0/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/.pnpm/resolve-url-loader@3.1.2/node_modules/resolve-url-loader/index.js!./node_modules/.pnpm/sass-loader@11.0.1_node-sass@5.0.0+webpack@5.23.0/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[3]!./src/scss/app.scss": [
|
||||
{
|
||||
"chunks": {
|
||||
"byName": {
|
||||
"child": 396
|
||||
},
|
||||
"bySource": {
|
||||
"0 child": 396
|
||||
},
|
||||
"usedIds": [
|
||||
396
|
||||
]
|
||||
},
|
||||
"modules": {
|
||||
"byIdentifier": {
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_2c88fa80e813acf2bb735191f3f77062/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/css-loader@5.0.2_webpack@5.23.0/node_modules/css-loader/dist/runtime/api.js": 588,
|
||||
"./node_modules/.pnpm/css-loader@5.0.2_webpack@5.23.0/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/.pnpm/resolve-url-loader@3.1.2/node_modules/resolve-url-loader/index.js!./node_modules/.pnpm/sass-loader@11.0.1_node-sass@5.0.0+webpack@5.23.0/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[3]!./src/scss/app.scss": 714
|
||||
},
|
||||
"usedIds": [
|
||||
588,
|
||||
714
|
||||
]
|
||||
}
|
||||
}
|
||||
],
|
||||
"modules": {
|
||||
"byIdentifier": {
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_2c88fa80e813acf2bb735191f3f77062/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/@apollo/client@3.3.11_graphql@15.5.0+react@17.0.1/node_modules/@apollo/client/cache/index.js|98663193128bdee4f4bd78c722201262": 5864,
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<head>
|
||||
<meta charset="UTF-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
||||
<title>@a2nt/ss-bootstrap-ui-webpack-boilerplate-react [23 Feb 2021 at 20:55]</title>
|
||||
<title>@a2nt/ss-bootstrap-ui-webpack-boilerplate-react [24 Feb 2021 at 18:36]</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>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@a2nt/ss-bootstrap-ui-webpack-boilerplate-react",
|
||||
"version": "3.0.5",
|
||||
"version": "3.0.6",
|
||||
"description": "This UI Kit allows you to build Bootstrap 5 webapp with some extra UI features. It's easy to extend and easy to convert HTML templates to CMS templates.",
|
||||
"author": "Tony Air <tony@twma.pro>",
|
||||
"license": "BSD-2-Clause",
|
||||
|
|
|
|||
|
|
@ -9,191 +9,192 @@ import { Collapse } from 'bootstrap';
|
|||
import SpinnerUI from './_main.loading-spinner';
|
||||
|
||||
const MainUILinks = ((W) => {
|
||||
const NAME = '_main.links';
|
||||
const D = document;
|
||||
const BODY = D.body;
|
||||
const NAME = '_main.links';
|
||||
const D = document;
|
||||
const BODY = D.body;
|
||||
|
||||
class MainUILinks {
|
||||
static init() {
|
||||
const ui = this;
|
||||
ui.GraphPage = null;
|
||||
class MainUILinks {
|
||||
static init() {
|
||||
const ui = this;
|
||||
ui.GraphPage = null;
|
||||
|
||||
console.log(`${NAME}: init`);
|
||||
console.log(`${NAME}: init`);
|
||||
|
||||
ui.loaded();
|
||||
ui.loaded();
|
||||
|
||||
// history state switch
|
||||
W.addEventListener('popstate', (e) => {
|
||||
ui.popState(e);
|
||||
});
|
||||
}
|
||||
|
||||
static loaded() {
|
||||
const ui = this;
|
||||
|
||||
D.querySelectorAll('.graphql-page').forEach((el, i) => {
|
||||
const el_id = el.getAttribute('href');
|
||||
el.setAttribute(`data-${ui.name}-id`, el_id);
|
||||
|
||||
el.addEventListener('click', ui.loadClick);
|
||||
});
|
||||
}
|
||||
|
||||
static reset() {
|
||||
// reset focus
|
||||
D.activeElement.blur();
|
||||
|
||||
// remove active and loading classes
|
||||
D.querySelectorAll('.graphql-page,.nav-item').forEach((el2) => {
|
||||
el2.classList.remove('active');
|
||||
el2.classList.remove('loading');
|
||||
});
|
||||
}
|
||||
|
||||
static popState(e) {
|
||||
const ui = this;
|
||||
|
||||
SpinnerUI.show();
|
||||
|
||||
if (e.state && e.state.page) {
|
||||
console.log(`${NAME}: [popstate] load`);
|
||||
const state = JSON.parse(e.state.page);
|
||||
|
||||
state.current = null;
|
||||
state.popstate = true;
|
||||
|
||||
ui.reset();
|
||||
D.querySelectorAll(`[data-${ui.name}-id="${e.state.link}"]`).forEach(
|
||||
(el) => {
|
||||
el.classList.add('active');
|
||||
},
|
||||
);
|
||||
|
||||
if (!ui.GraphPage) {
|
||||
console.log(
|
||||
`${NAME}: [popstate] GraphPage is missing. Have to render it first`,
|
||||
);
|
||||
|
||||
ui.GraphPage = ReactDOM.render(
|
||||
<Page />,
|
||||
document.getElementById('MainContent'),
|
||||
);
|
||||
// history state switch
|
||||
W.addEventListener('popstate', (e) => {
|
||||
ui.popState(e);
|
||||
});
|
||||
}
|
||||
|
||||
ui.GraphPage.setState(state);
|
||||
SpinnerUI.hide();
|
||||
static loaded() {
|
||||
const ui = this;
|
||||
|
||||
window.dispatchEvent(new Event(Events.AJAX));
|
||||
} else if (e.state && e.state.landing) {
|
||||
console.log(`${NAME}: [popstate] go to landing`);
|
||||
W.location.href = e.state.landing;
|
||||
} else {
|
||||
console.warn(`${NAME}: [popstate] state is missing`);
|
||||
console.log(e);
|
||||
SpinnerUI.hide();
|
||||
}
|
||||
}
|
||||
D.querySelectorAll('.graphql-page').forEach((el, i) => {
|
||||
const el_id = el.getAttribute('href');
|
||||
el.setAttribute(`data-${ui.name}-id`, el_id);
|
||||
|
||||
// link specific event {this} = current event, not MainUILinks
|
||||
static loadClick(e) {
|
||||
console.groupCollapsed(`${NAME}: load on click`);
|
||||
const ui = MainUILinks;
|
||||
ui.reset();
|
||||
el.addEventListener('click', ui.loadClick);
|
||||
});
|
||||
}
|
||||
|
||||
e.preventDefault();
|
||||
|
||||
const el = e.currentTarget;
|
||||
|
||||
// hide parent mobile nav
|
||||
const navs = getParents(el, '.collapse');
|
||||
if (navs.length) {
|
||||
navs.forEach((nav) => {
|
||||
const collapseInst = Collapse.getInstance(nav);
|
||||
if (collapseInst) {
|
||||
collapseInst.hide();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// hide parent dropdown
|
||||
/*const dropdowns = getParents(el, '.dropdown-menu');
|
||||
if (dropdowns.length) {
|
||||
const DropdownInst = Dropdown.getInstance(dropdowns[0]);
|
||||
DropdownInst.hide();
|
||||
}*/
|
||||
|
||||
if (!ui.GraphPage) {
|
||||
ui.GraphPage = ReactDOM.render(
|
||||
<Page />,
|
||||
document.getElementById('MainContent'),
|
||||
);
|
||||
}
|
||||
|
||||
const link = el.getAttribute('href') || el.getAttribute('data-href');
|
||||
|
||||
ui.GraphPage.state.current = el;
|
||||
|
||||
el.classList.add('loading');
|
||||
|
||||
el.classList.remove('response-404');
|
||||
el.classList.remove('response-500');
|
||||
el.classList.remove('response-523');
|
||||
|
||||
SpinnerUI.show();
|
||||
BODY.classList.add('ajax-loading');
|
||||
|
||||
ui.GraphPage.load(link)
|
||||
.then((response) => {
|
||||
el.classList.remove('loading');
|
||||
el.classList.add('active');
|
||||
|
||||
if (ui.GraphPage.state.Link) {
|
||||
window.history.pushState(
|
||||
{
|
||||
page: JSON.stringify(ui.GraphPage.state),
|
||||
link: el.getAttribute(`data-${ui.name}-id`),
|
||||
},
|
||||
ui.GraphPage.state.Title,
|
||||
ui.GraphPage.state.Link,
|
||||
static setActiveLinks(link) {
|
||||
const ui = this;
|
||||
D.querySelectorAll(`[data-${ui.name}-id="${link}"]`).forEach(
|
||||
(el) => {
|
||||
el.classList.add('active');
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
BODY.classList.remove('ajax-loading');
|
||||
SpinnerUI.hide();
|
||||
static reset() {
|
||||
// reset focus
|
||||
D.activeElement.blur();
|
||||
|
||||
window.dispatchEvent(new Event(Events.AJAX));
|
||||
console.groupEnd(`${NAME}: load on click`);
|
||||
})
|
||||
.catch((e) => {
|
||||
console.log(e);
|
||||
// remove active and loading classes
|
||||
D.querySelectorAll('.graphql-page,.nav-item').forEach((el2) => {
|
||||
el2.classList.remove('active', 'loading');
|
||||
});
|
||||
}
|
||||
|
||||
el.classList.remove('loading');
|
||||
el.classList.add(`response-${e.status}`);
|
||||
/*switch (e.status) {
|
||||
case 404:
|
||||
el.classList.add('not-found');
|
||||
break;
|
||||
case 523:
|
||||
el.classList.add('unreachable');
|
||||
break;
|
||||
}*/
|
||||
static popState(e) {
|
||||
const ui = this;
|
||||
|
||||
BODY.classList.remove('ajax-loading');
|
||||
SpinnerUI.hide();
|
||||
SpinnerUI.show();
|
||||
|
||||
window.dispatchEvent(new Event(Events.AJAX));
|
||||
console.groupEnd(`${NAME}: load on click`);
|
||||
});
|
||||
if (e.state && e.state.page) {
|
||||
console.log(`${NAME}: [popstate] load`);
|
||||
const state = JSON.parse(e.state.page);
|
||||
|
||||
state.current = null;
|
||||
state.popstate = true;
|
||||
|
||||
ui.reset();
|
||||
ui.setActiveLinks(e.state.link);
|
||||
|
||||
if (!ui.GraphPage) {
|
||||
console.log(
|
||||
`${NAME}: [popstate] GraphPage is missing. Have to render it first`,
|
||||
);
|
||||
|
||||
ui.GraphPage = ReactDOM.render(
|
||||
<Page />,
|
||||
document.getElementById('MainContent'),
|
||||
);
|
||||
}
|
||||
|
||||
ui.GraphPage.setState(state);
|
||||
SpinnerUI.hide();
|
||||
|
||||
window.dispatchEvent(new Event(Events.AJAX));
|
||||
} else if (e.state && e.state.landing) {
|
||||
console.log(`${NAME}: [popstate] go to landing`);
|
||||
W.location.href = e.state.landing;
|
||||
} else {
|
||||
console.warn(`${NAME}: [popstate] state is missing`);
|
||||
console.log(e);
|
||||
SpinnerUI.hide();
|
||||
}
|
||||
}
|
||||
|
||||
// link specific event {this} = current event, not MainUILinks
|
||||
static loadClick(e) {
|
||||
console.groupCollapsed(`${NAME}: load on click`);
|
||||
e.preventDefault();
|
||||
|
||||
const ui = MainUILinks;
|
||||
const el = e.currentTarget;
|
||||
|
||||
SpinnerUI.show();
|
||||
|
||||
ui.reset();
|
||||
el.classList.add('loading');
|
||||
el.classList.remove('response-404', 'response-500', 'response-523');
|
||||
BODY.classList.add('ajax-loading');
|
||||
|
||||
// hide parent mobile nav
|
||||
const navs = getParents(el, '.collapse');
|
||||
if (navs.length) {
|
||||
navs.forEach((nav) => {
|
||||
const collapseInst = Collapse.getInstance(nav);
|
||||
if (collapseInst) {
|
||||
collapseInst.hide();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// hide parent dropdown
|
||||
/*const dropdowns = getParents(el, '.dropdown-menu');
|
||||
if (dropdowns.length) {
|
||||
const DropdownInst = Dropdown.getInstance(dropdowns[0]);
|
||||
DropdownInst.hide();
|
||||
}*/
|
||||
|
||||
if (!ui.GraphPage) {
|
||||
ui.GraphPage = ReactDOM.render(
|
||||
<Page />,
|
||||
document.getElementById('MainContent'),
|
||||
);
|
||||
}
|
||||
|
||||
const link = el.getAttribute('href') || el.getAttribute('data-href');
|
||||
|
||||
ui.GraphPage.state.current = el;
|
||||
|
||||
ui.GraphPage.load(link)
|
||||
.then((response) => {
|
||||
BODY.classList.remove('ajax-loading');
|
||||
el.classList.remove('loading');
|
||||
el.classList.add('active');
|
||||
|
||||
if (ui.GraphPage.state.Link) {
|
||||
window.history.pushState({
|
||||
page: JSON.stringify(ui.GraphPage.state),
|
||||
link: el.getAttribute(`data-${ui.name}-id`),
|
||||
},
|
||||
ui.GraphPage.state.Title,
|
||||
ui.GraphPage.state.Link,
|
||||
);
|
||||
|
||||
ui.setActiveLinks(ui.GraphPage.state.Link)
|
||||
}
|
||||
|
||||
SpinnerUI.hide();
|
||||
|
||||
window.dispatchEvent(new Event(Events.AJAX));
|
||||
console.groupEnd(`${NAME}: load on click`);
|
||||
})
|
||||
.catch((e) => {
|
||||
console.log(e);
|
||||
|
||||
BODY.classList.remove('ajax-loading');
|
||||
el.classList.remove('loading');
|
||||
el.classList.add('error', `response-${e.status}`);
|
||||
/*switch (e.status) {
|
||||
case 404:
|
||||
el.classList.add('not-found');
|
||||
break;
|
||||
case 523:
|
||||
el.classList.add('unreachable');
|
||||
break;
|
||||
}*/
|
||||
|
||||
SpinnerUI.hide();
|
||||
|
||||
window.dispatchEvent(new Event(Events.AJAX));
|
||||
console.groupEnd(`${NAME}: load on click`);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
W.addEventListener(`${Events.LOADED}`, () => {
|
||||
MainUILinks.init();
|
||||
});
|
||||
W.addEventListener(`${Events.LOADED}`, () => {
|
||||
MainUILinks.init();
|
||||
});
|
||||
|
||||
W.addEventListener(`${Events.AJAX}`, () => {
|
||||
MainUILinks.loaded();
|
||||
});
|
||||
W.addEventListener(`${Events.AJAX}`, () => {
|
||||
MainUILinks.loaded();
|
||||
});
|
||||
})(window);
|
||||
|
||||
export default MainUILinks;
|
||||
|
|
|
|||
|
|
@ -6,112 +6,112 @@ import Events from '../_events';
|
|||
import 'jquery.instagramFeed/jquery.instagramFeed';
|
||||
|
||||
const InstagramFeed = (($) => {
|
||||
// Constants
|
||||
const NAME = 'jsInstagramFeed';
|
||||
const DATA_KEY = NAME;
|
||||
const W = window;
|
||||
const D = document;
|
||||
// Constants
|
||||
const NAME = 'jsInstagramFeed';
|
||||
const DATA_KEY = NAME;
|
||||
const W = window;
|
||||
const D = document;
|
||||
|
||||
class InstagramFeed {
|
||||
constructor(el) {
|
||||
const ui = this;
|
||||
const $el = $(el);
|
||||
class InstagramFeed {
|
||||
constructor(el) {
|
||||
const ui = this;
|
||||
const $el = $(el);
|
||||
|
||||
ui._el = el;
|
||||
ui.dispose();
|
||||
ui._el = el;
|
||||
ui.dispose();
|
||||
|
||||
console.log(`${NAME}: init`);
|
||||
$el.data(DATA_KEY, this);
|
||||
console.log(`${NAME}: init`);
|
||||
$el.data(DATA_KEY, this);
|
||||
|
||||
const ID = $el.data('username') + $el.data('tag');
|
||||
const ID = $el.data('username') + $el.data('tag');
|
||||
|
||||
$.instagramFeed({
|
||||
username: $el.data('username'),
|
||||
tag: $el.data('tag') || null,
|
||||
display_profile: $el.data('display-profile'),
|
||||
display_biography: $el.data('display-biography'),
|
||||
display_gallery: $el.data('display-gallery'),
|
||||
display_captions: $el.data('display-captions'),
|
||||
cache_time: 120,
|
||||
callback: (data) => {
|
||||
console.log(`${NAME}: data response received`);
|
||||
$.instagramFeed({
|
||||
username: $el.data('username'),
|
||||
tag: $el.data('tag') || null,
|
||||
display_profile: $el.data('display-profile'),
|
||||
display_biography: $el.data('display-biography'),
|
||||
display_gallery: $el.data('display-gallery'),
|
||||
display_captions: $el.data('display-captions'),
|
||||
cache_time: 120,
|
||||
callback: (data) => {
|
||||
console.log(`${NAME}: data response received`);
|
||||
|
||||
$el.append(`<div class="${NAME}-list row"></div>`);
|
||||
const $list = $el.find(`.${NAME}-list`);
|
||||
$el.append(`<div class="${NAME}-list row"></div>`);
|
||||
const $list = $el.find(`.${NAME}-list`);
|
||||
|
||||
data['edge_owner_to_timeline_media']['edges'].forEach(
|
||||
(el, i) => {
|
||||
const item = el['node'];
|
||||
const preview = ui.ig_media_preview(
|
||||
item['media_preview'],
|
||||
);
|
||||
data['edge_owner_to_timeline_media']['edges'].forEach(
|
||||
(el, i) => {
|
||||
const item = el['node'];
|
||||
const preview = ui.ig_media_preview(
|
||||
item['media_preview'],
|
||||
);
|
||||
|
||||
$list.append(
|
||||
`<div class="a col ${NAME}-item"` +
|
||||
$list.append(
|
||||
`<div class="a col ${NAME}-item"` +
|
||||
` data-lightbox-gallery="${NAME}-${ID}" data-href="${item['display_url']}" data-force="image">` +
|
||||
`<img id="${NAME}-${ID}-${item['id']}" src="${item['display_url']}" alt="${item['accessibility_caption']}"` +
|
||||
`style="background:url(${preview})" />` +
|
||||
'</div>',
|
||||
);
|
||||
},
|
||||
);
|
||||
);
|
||||
},
|
||||
);
|
||||
|
||||
$(W).trigger('MetaLightboxUI.init');
|
||||
},
|
||||
styling: false,
|
||||
items: $el.data('items'),
|
||||
lazy_load: true,
|
||||
on_error: (e) => {
|
||||
console.error(`${NAME}: ${e}`);
|
||||
},
|
||||
});
|
||||
$(W).trigger('MetaLightboxUI.init');
|
||||
},
|
||||
styling: false,
|
||||
items: $el.data('items'),
|
||||
lazy_load: true,
|
||||
on_error: (e) => {
|
||||
console.error(`${NAME}: ${e}`);
|
||||
},
|
||||
});
|
||||
|
||||
$el.addClass(`${NAME}-active`);
|
||||
}
|
||||
$el.addClass(`${NAME}-active`);
|
||||
}
|
||||
|
||||
ig_media_preview(base64data) {
|
||||
var jpegtpl =
|
||||
ig_media_preview(base64data) {
|
||||
var jpegtpl =
|
||||
'/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEABsaGikdKUEmJkFCLy8vQkc/Pj4/R0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0cBHSkpNCY0PygoP0c/NT9HR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR//AABEIABQAKgMBIgACEQEDEQH/xAGiAAABBQEBAQEBAQAAAAAAAAAAAQIDBAUGBwgJCgsQAAIBAwMCBAMFBQQEAAABfQECAwAEEQUSITFBBhNRYQcicRQygZGhCCNCscEVUtHwJDNicoIJChYXGBkaJSYnKCkqNDU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6g4SFhoeIiYqSk5SVlpeYmZqio6Slpqeoqaqys7S1tre4ubrCw8TFxsfIycrS09TV1tfY2drh4uPk5ebn6Onq8fLz9PX29/j5+gEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoLEQACAQIEBAMEBwUEBAABAncAAQIDEQQFITEGEkFRB2FxEyIygQgUQpGhscEJIzNS8BVictEKFiQ04SXxFxgZGiYnKCkqNTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqCg4SFhoeIiYqSk5SVlpeYmZqio6Slpqeoqaqys7S1tre4ubrCw8TFxsfIycrS09TV1tfY2dri4+Tl5ufo6ery8/T19vf4+fr/2gAMAwEAAhEDEQA/AA==',
|
||||
t = atob(base64data),
|
||||
p = t.slice(3).split(''),
|
||||
o = t
|
||||
.substring(0, 3)
|
||||
.split('')
|
||||
.map((e) => {
|
||||
return e.charCodeAt(0);
|
||||
}),
|
||||
c = atob(jpegtpl).split('');
|
||||
c[162] = String.fromCharCode(o[1]);
|
||||
c[160] = String.fromCharCode(o[2]);
|
||||
return base64data
|
||||
? `data:image/jpeg;base64,${btoa(c.concat(p).join(''))}`
|
||||
: null;
|
||||
}
|
||||
t = atob(base64data),
|
||||
p = t.slice(3).split(''),
|
||||
o = t
|
||||
.substring(0, 3)
|
||||
.split('')
|
||||
.map((e) => {
|
||||
return e.charCodeAt(0);
|
||||
}),
|
||||
c = atob(jpegtpl).split('');
|
||||
c[162] = String.fromCharCode(o[1]);
|
||||
c[160] = String.fromCharCode(o[2]);
|
||||
return base64data
|
||||
? `data:image/jpeg;base64,${btoa(c.concat(p).join(''))}`
|
||||
: null;
|
||||
}
|
||||
|
||||
// Public methods
|
||||
dispose() {
|
||||
console.log(`${NAME}: dispose`);
|
||||
const ui = this;
|
||||
// Public methods
|
||||
dispose() {
|
||||
console.log(`${NAME}: dispose`);
|
||||
const ui = this;
|
||||
|
||||
const $el = $(ui._el);
|
||||
$.removeData(ui._el, DATA_KEY);
|
||||
ui._el = null;
|
||||
$el.removeClass(`${NAME}-active`);
|
||||
}
|
||||
}
|
||||
const $el = $(ui._el);
|
||||
$.removeData(ui._el, DATA_KEY);
|
||||
ui._el = null;
|
||||
$el.removeClass(`${NAME}-active`);
|
||||
}
|
||||
}
|
||||
|
||||
const init = () => {
|
||||
$(`.${NAME}`).each((i, el) => {
|
||||
new InstagramFeed(el);
|
||||
});
|
||||
};
|
||||
const init = () => {
|
||||
$(`.${NAME}`).each((i, el) => {
|
||||
new InstagramFeed(el);
|
||||
});
|
||||
};
|
||||
|
||||
// auto-apply
|
||||
$(W).on(`${NAME}.init ${Events.AJAX} ${Events.LOADED}`, () => {
|
||||
init();
|
||||
});
|
||||
// auto-apply
|
||||
$(W).on(`${NAME}.init ${Events.AJAX} ${Events.LOADED}`, () => {
|
||||
init();
|
||||
});
|
||||
|
||||
return InstagramFeed;
|
||||
return InstagramFeed;
|
||||
})($);
|
||||
|
||||
export default InstagramFeed;
|
||||
|
|
|
|||
Loading…
Reference in New Issue