From 8f854ff287e45c11f45bf33db0383fdc81570447 Mon Sep 17 00:00:00 2001 From: Bachir Soussi Chiadmi Date: Tue, 1 Dec 2020 21:10:06 +0100 Subject: [PATCH] minor fixe on blabla's article: lightbox, flag/unflag --- .../custom/materiotheme/assets/dist/main.css | 1 + .../custom/materiotheme/assets/dist/main.js | 18 ++++++++++++++++-- .../custom/materiotheme/assets/scripts/main.js | 1 + .../vuejs/components/Pages/Article.vue | 2 +- 4 files changed, 19 insertions(+), 3 deletions(-) diff --git a/web/themes/custom/materiotheme/assets/dist/main.css b/web/themes/custom/materiotheme/assets/dist/main.css index 4e73540d..c1d8c9e0 100644 --- a/web/themes/custom/materiotheme/assets/dist/main.css +++ b/web/themes/custom/materiotheme/assets/dist/main.css @@ -74,6 +74,7 @@ h4[data-v-4e9a834e]{ vertical-align: top; } +.cool-lightbox{position:fixed;left:0;bottom:0;top:0;display:flex;align-items:center;justify-content:center;right:0;transition:all .3s ease}.cool-lightbox .cool-lightbox-zoom{position:absolute;bottom:15px;left:50%;display:flex;z-index:99999;background-color:rgba(15,15,15,.8);border-radius:8px;padding:0 12px;align-items:center;transform:translateX(-50%)}.cool-lightbox .cool-lightbox-zoom input[type=range]{-webkit-appearance:none;margin:10px 0;width:105px;background:0 0}.cool-lightbox .cool-lightbox-zoom input[type=range]:focus{outline:0}.cool-lightbox .cool-lightbox-zoom input[type=range]::-webkit-slider-runnable-track{width:100%;height:4px;cursor:pointer;animate:.2s;box-shadow:0 0 0 #000;background:#e6e6e6;border-radius:11px;border:0 solid #000}.cool-lightbox .cool-lightbox-zoom input[type=range]::-webkit-slider-thumb{box-shadow:1px 1px 1px #000;border:1px solid #000;height:12px;width:12px;border-radius:13px;background:#fff;cursor:pointer;-webkit-appearance:none;margin-top:-4.5px}.cool-lightbox .cool-lightbox-zoom input[type=range]:focus::-webkit-slider-runnable-track{background:#e6e6e6}.cool-lightbox .cool-lightbox-zoom input[type=range]::-moz-range-track{width:100%;height:4px;cursor:pointer;animate:.2s;box-shadow:0 0 0 #000;background:#e6e6e6;border-radius:11px;border:0 solid #000}.cool-lightbox .cool-lightbox-zoom input[type=range]::-moz-range-thumb{box-shadow:1px 1px 1px #000;border:1px solid #000;height:12px;width:12px;border-radius:13px;background:#fff;cursor:pointer}.cool-lightbox .cool-lightbox-zoom input[type=range]::-ms-track{width:100%;height:4px;cursor:pointer;animate:.2s;background:0 0;border-color:transparent;color:transparent}.cool-lightbox .cool-lightbox-zoom input[type=range]::-ms-fill-lower{background:#e6e6e6;border:0 solid #000;border-radius:22px;box-shadow:0 0 0 #000}.cool-lightbox .cool-lightbox-zoom input[type=range]::-ms-fill-upper{background:#e6e6e6;border:0 solid #000;border-radius:22px;box-shadow:0 0 0 #000}.cool-lightbox .cool-lightbox-zoom input[type=range]::-ms-thumb{box-shadow:1px 1px 1px #000;border:1px solid #000;height:12px;width:12px;border-radius:13px;background:#fff;cursor:pointer}.cool-lightbox .cool-lightbox-zoom input[type=range]:focus::-ms-fill-lower{background:#e6e6e6}.cool-lightbox .cool-lightbox-zoom input[type=range]:focus::-ms-fill-upper{background:#e6e6e6}.cool-lightbox .cool-lightbox-zoom .cool-lightbox-zoom__icon{height:15px;width:15px;color:#fff}.cool-lightbox .cool-lightbox-zoom .cool-lightbox-zoom__icon:first-of-type{margin-right:10px}.cool-lightbox .cool-lightbox-zoom .cool-lightbox-zoom__icon:last-of-type{margin-left:10px}.cool-lightbox .cool-lightbox-thumbs{position:absolute;height:100vh;overflow-y:auto;width:102px;right:-102px;top:0;overflow-x:hidden;transition:none;background-color:#ddd;scrollbar-width:thin;scrollbar-color:#fa4242 rgba(175,175,175,.9)}@media (min-width:767px){.cool-lightbox .cool-lightbox-thumbs{transition:all .3s ease}}.cool-lightbox .cool-lightbox-thumbs::-webkit-scrollbar{width:6px;height:6px}.cool-lightbox .cool-lightbox-thumbs::-webkit-scrollbar-button{width:0;height:0}.cool-lightbox .cool-lightbox-thumbs::-webkit-scrollbar-thumb{background:#fa4242;border:0 none #fff;border-radius:50px}.cool-lightbox .cool-lightbox-thumbs::-webkit-scrollbar-thumb:hover{background:#fff}.cool-lightbox .cool-lightbox-thumbs::-webkit-scrollbar-thumb:active{background:#000}.cool-lightbox .cool-lightbox-thumbs::-webkit-scrollbar-track{background:#e1e1e1;border:0 none #fff;border-radius:8px}.cool-lightbox .cool-lightbox-thumbs::-webkit-scrollbar-track:hover{background:#666}.cool-lightbox .cool-lightbox-thumbs::-webkit-scrollbar-track:active{background:#333}.cool-lightbox .cool-lightbox-thumbs::-webkit-scrollbar-corner{background:0 0}@media (min-width:767px){.cool-lightbox .cool-lightbox-thumbs{width:212px;right:-212px}}.cool-lightbox .cool-lightbox-thumbs .cool-lightbox-thumbs__list{display:flex;flex-wrap:wrap;padding:2px;padding-right:0}.cool-lightbox .cool-lightbox-thumbs .cool-lightbox-thumbs__list .cool-lightbox__thumb{background-color:#000;width:100%;margin-right:2px;margin-bottom:2px;display:block;height:75px;position:relative}@media (min-width:767px){.cool-lightbox .cool-lightbox-thumbs .cool-lightbox-thumbs__list .cool-lightbox__thumb{width:calc(100%/2 - 2px)}}.cool-lightbox .cool-lightbox-thumbs .cool-lightbox-thumbs__list .cool-lightbox__thumb:before{top:0;left:0;right:0;bottom:0;opacity:0;content:'';z-index:150;transition:all .3s ease;position:absolute;visibility:hidden;border:3px solid #fa4242}.cool-lightbox .cool-lightbox-thumbs .cool-lightbox-thumbs__list .cool-lightbox__thumb img{width:100%;height:100%;object-fit:cover}.cool-lightbox .cool-lightbox-thumbs .cool-lightbox-thumbs__list .cool-lightbox__thumb.is-video .cool-lightbox__thumb__icon{position:absolute;z-index:100;top:50%;left:50%;width:25px;height:25px;transform:translate(-50%,-50%)}.cool-lightbox .cool-lightbox-thumbs .cool-lightbox-thumbs__list .cool-lightbox__thumb.is-video .cool-lightbox__thumb__icon path{fill:#fff}.cool-lightbox .cool-lightbox-thumbs .cool-lightbox-thumbs__list .cool-lightbox__thumb.is-video:after{content:'';top:0;left:0;right:0;bottom:0;z-index:50;position:absolute;background:rgba(0,0,0,.6)}.cool-lightbox .cool-lightbox-thumbs .cool-lightbox-thumbs__list .cool-lightbox__thumb.active:before,.cool-lightbox .cool-lightbox-thumbs .cool-lightbox-thumbs__list .cool-lightbox__thumb:hover:before{opacity:1;visibility:visible}.cool-lightbox .cool-lightbox__inner{padding:60px 0;position:absolute;top:0;left:0;right:0;bottom:0;overflow:hidden;transition:none}@media (min-width:767px){.cool-lightbox .cool-lightbox__inner{transition:all .3s ease}}.cool-lightbox .cool-lightbox__progressbar{position:absolute;top:0;left:0;right:0;height:2px;z-index:500;transform-origin:0;transform:scaleX(0);transition:transform 3s linear;display:block}.cool-lightbox.cool-lightbox--is-swipping{cursor:-webkit-grabbing;cursor:grabbing}.cool-lightbox.cool-lightbox--is-swipping iframe{pointer-events:none}.cool-lightbox.cool-lightbox--is-swipping .cool-lightbox__slide{transition:none}.cool-lightbox.cool-lightbox--is-swipping .cool-lightbox__slide.cool-lightbox__slide--hide{display:flex;z-index:50}.cool-lightbox.cool-lightbox--zoom-disabled .cool-lightbox__slide .cool-lightbox__slide__img{transform:translate3d(-50%,-50%,0)}.cool-lightbox.cool-lightbox--can-zoom .cool-lightbox__slide img{cursor:zoom-in}.cool-lightbox.cool-lightbox--is-zooming .cool-lightbox__slide img{cursor:move;cursor:grab;cursor:-moz-grab;cursor:-webkit-grab}.cool-lightbox.cool-lightbox--is-zooming .cool-lightbox-caption{opacity:0}.cool-lightbox.cool-lightbox--thumbs-right.cool-lightbox--show-thumbs .cool-lightbox__inner{right:102px}@media (min-width:767px){.cool-lightbox.cool-lightbox--thumbs-right.cool-lightbox--show-thumbs .cool-lightbox__inner{right:212px}}.cool-lightbox.cool-lightbox--thumbs-right.cool-lightbox--show-thumbs .cool-lightbox-thumbs{right:0}.cool-lightbox.cool-lightbox--thumbs-bottom .cool-lightbox-thumbs{width:100%;left:0;right:0;top:auto;height:70px;bottom:-70px;overflow:auto}@media (min-width:767px){.cool-lightbox.cool-lightbox--thumbs-bottom .cool-lightbox-thumbs{bottom:-79px;height:79px}}.cool-lightbox.cool-lightbox--thumbs-bottom .cool-lightbox-thumbs .cool-lightbox-thumbs__list{width:100%;flex-wrap:nowrap;justify-content:center}.cool-lightbox.cool-lightbox--thumbs-bottom .cool-lightbox-thumbs .cool-lightbox-thumbs__list .cool-lightbox__thumb{width:100px;flex-shrink:0;margin-bottom:0;height:65px}@media (min-width:767px){.cool-lightbox.cool-lightbox--thumbs-bottom .cool-lightbox-thumbs .cool-lightbox-thumbs__list .cool-lightbox__thumb{height:75px}}.cool-lightbox.cool-lightbox--thumbs-bottom.cool-lightbox--show-thumbs .cool-lightbox__inner{bottom:70px}@media (min-width:767px){.cool-lightbox.cool-lightbox--thumbs-bottom.cool-lightbox--show-thumbs .cool-lightbox__inner{bottom:79px}}.cool-lightbox.cool-lightbox--thumbs-bottom.cool-lightbox--show-thumbs .cool-lightbox-thumbs{bottom:0}.cool-lightbox *{box-sizing:border-box;padding:0;margin:0}.cool-lightbox button{background:0 0;border:none;cursor:pointer;outline:0}.cool-lightbox svg path,.cool-lightbox svg rect{fill:currentColor}.cool-lightbox .cool-lightbox-button{padding:21px 16px 21px 4px;height:100px;opacity:1;z-index:800;color:#ccc;transition:all .3s ease;position:absolute;top:calc(50% - 50px);width:54px;transition:all .3s ease;visibility:visible}@media (min-width:767px){.cool-lightbox .cool-lightbox-button{width:70px;padding:31px 26px 31px 6px}}.cool-lightbox .cool-lightbox-button.hidden{opacity:0;visibility:hidden}.cool-lightbox .cool-lightbox-button:hover{color:#fff}.cool-lightbox .cool-lightbox-button>.cool-lightbox-button__icon{padding:7px;display:flex;align-items:center;justify-content:center;background:rgba(30,30,30,.6)}.cool-lightbox .cool-lightbox-button>.cool-lightbox-button__icon>svg{width:100%;height:100%}.cool-lightbox .cool-lightbox-button.cool-lightbox-button--prev{left:0}.cool-lightbox .cool-lightbox-button.cool-lightbox-button--next{right:0;padding:21px 4px 21px 16px}@media (min-width:767px){.cool-lightbox .cool-lightbox-button.cool-lightbox-button--next{padding:31px 6px 31px 26px}}.cool-lightbox .cool-lightbox-pdf{max-width:100%}.cool-lightbox .cool-lightbox__iframe{width:100%;display:flex;top:50%;left:50%;align-items:center;justify-content:center;position:relative;transform:translate3d(-50%,-50%,0) scale3d(1,1,1)}.cool-lightbox .cool-lightbox__iframe iframe{width:100%;height:100%}@media (min-width:767px){.cool-lightbox .cool-lightbox__iframe iframe{max-width:80vw;max-height:80vh}}.cool-lightbox .cool-lightbox__wrapper{width:100%;height:100%;position:relative}.cool-lightbox .cool-lightbox__wrapper.cool-lightbox__wrapper--swipe{display:flex;align-items:center}.cool-lightbox .cool-lightbox__wrapper.cool-lightbox__wrapper--swipe .cool-lightbox__slide{flex-shrink:0;display:flex;position:relative;height:100%;opacity:.4;transition:opacity .3s linear}.cool-lightbox .cool-lightbox__wrapper.cool-lightbox__wrapper--swipe .cool-lightbox__slide.cool-lightbox__slide--current{opacity:1}.cool-lightbox .cool-lightbox__slide{width:100%;top:0;bottom:0;left:0;right:0;z-index:100;display:none;position:absolute;margin-right:30px;transition:transform .3s ease}.cool-lightbox .cool-lightbox__slide:last-of-type{margin-right:0}.cool-lightbox .cool-lightbox__slide.cool-lightbox__slide--current{display:flex}.cool-lightbox .cool-lightbox__slide .cool-lightbox__slide__img{position:absolute;height:100%;width:100%;left:50%;top:50%;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:translate3d(-50%,-50%,0) scale3d(1,1,1);transition:all .3s ease;display:flex}.cool-lightbox .cool-lightbox__slide img{max-width:100%;max-height:100%;margin:auto;z-index:9999;-webkit-backface-visibility:hidden;backface-visibility:hidden;-ms-transform:translateZ(0);-webkit-transform:translateZ(0);transform:translateZ(0);box-shadow:0 0 1.5rem rgba(0,0,0,.45)}.cool-lightbox-toolbar{position:absolute;top:0;right:0;opacity:1;display:flex;transition:all .3s ease;visibility:visible}.cool-lightbox-toolbar.hidden{opacity:0;visibility:hidden}.cool-lightbox-toolbar .cool-lightbox-toolbar__btn{background:rgba(30,30,30,.6);border:0;border-radius:0;box-shadow:none;cursor:pointer;justify-content:center;align-items:center;display:inline-flex;margin:0;padding:9px;position:relative;transition:color .2s;vertical-align:top;visibility:inherit;width:40px;height:40px;color:#ccc}@media (min-width:767px){.cool-lightbox-toolbar .cool-lightbox-toolbar__btn{width:44px;height:44px;padding:10px}}.cool-lightbox-toolbar .cool-lightbox-toolbar__btn>svg{width:100%;height:100%}.cool-lightbox-toolbar .cool-lightbox-toolbar__btn:hover{color:#fff}.cool-lightbox-caption{bottom:0;color:#eee;font-size:14px;font-weight:400;left:0;opacity:1;line-height:1.5;padding:18px 28px 16px 24px;right:0;text-align:center;direction:ltr;position:absolute;transition:opacity .25s ease,visibility 0s ease .25s;z-index:99997;background:linear-gradient(0deg,rgba(0,0,0,.75) 0,rgba(0,0,0,.3) 50%,rgba(0,0,0,.15) 65%,rgba(0,0,0,.075) 75.5%,rgba(0,0,0,.037) 82.85%,rgba(0,0,0,.019) 88%,transparent)}@media (min-width:767px){.cool-lightbox-caption{padding:22px 30px 23px 30px}}.cool-lightbox-caption a{color:#eee;text-decoration:underline}.cool-lightbox-caption h6{font-size:14px;margin:0 0 6px 0;line-height:130%}@media (min-width:767px){.cool-lightbox-caption h6{font-size:16px;margin:0 0 6px 0}}.cool-lightbox-caption p{font-size:13px;line-height:130%;color:#ccc}@media (min-width:767px){.cool-lightbox-caption p{font-size:15px}}.cool-lightbox-caption p a{color:#ccc}.cool-lightbox-caption p a:hover{color:#eee}.cool-lightbox-modal-enter-active,.cool-lightbox-modal-leave-active{transition:opacity .35s}.cool-lightbox-modal-enter,.cool-lightbox-modal-leave-to{opacity:0}.cool-lightbox-slide-change-enter-active,.cool-lightbox-slide-change-leave-active{transition:opacity .27s}.cool-lightbox-slide-change-enter,.cool-lightbox-slide-change-leave-to{opacity:0}.cool-lightbox-loading-wrapper{top:50%;left:50%;position:absolute;transform:translate(-50%,-50%)}.cool-lightbox-loading-wrapper .cool-lightbox-loading{animation:cool-lightbox-rotate 1s linear infinite;background:0 0;border:4px solid #888;border-bottom-color:#fff;border-radius:50%;height:50px;opacity:.7;padding:0;width:50px;z-index:500}@keyframes cool-lightbox-rotate{100%{transform:rotate(360deg)}} body { background: white; } diff --git a/web/themes/custom/materiotheme/assets/dist/main.js b/web/themes/custom/materiotheme/assets/dist/main.js index c9fac946..0d2aa2e5 100644 --- a/web/themes/custom/materiotheme/assets/dist/main.js +++ b/web/themes/custom/materiotheme/assets/dist/main.js @@ -689,7 +689,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n})); /***/ ((__unused_webpack_module, exports, __webpack_require__) => { "use strict"; -eval("\n\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n}));\nexports.default = void 0;\n\nvar _route = _interopRequireDefault(__webpack_require__(/*! vuejs/route */ \"./web/themes/custom/materiotheme/vuejs/route/index.js\"));\n\nvar _store = _interopRequireDefault(__webpack_require__(/*! vuejs/store */ \"./web/themes/custom/materiotheme/vuejs/store/index.js\"));\n\nvar _jsonAxios = __webpack_require__(/*! vuejs/api/json-axios */ \"./web/themes/custom/materiotheme/vuejs/api/json-axios.js\");\n\nvar _querystringEs = _interopRequireDefault(__webpack_require__(/*! querystring-es3 */ \"./node_modules/querystring-es3/index.js\"));\n\nvar _Card = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Content/Card */ \"./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue\"));\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.common.js\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _createForOfIteratorHelper(o, allowArrayLike) { var it; if (typeof Symbol === \"undefined\" || o[Symbol.iterator] == null) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === \"number\") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError(\"Invalid attempt to iterate non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = o[Symbol.iterator](); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }\n\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\n\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n\nfunction _wrapRegExp(re, groups) { _wrapRegExp = function _wrapRegExp(re, groups) { return new BabelRegExp(re, undefined, groups); }; var _RegExp = _wrapNativeSuper(RegExp); var _super = RegExp.prototype; var _groups = new WeakMap(); function BabelRegExp(re, flags, groups) { var _this = _RegExp.call(this, re, flags); _groups.set(_this, groups || _groups.get(re)); return _this; } _inherits(BabelRegExp, _RegExp); BabelRegExp.prototype.exec = function (str) { var result = _super.exec.call(this, str); if (result) result.groups = buildGroups(result, this); return result; }; BabelRegExp.prototype[Symbol.replace] = function (str, substitution) { if (typeof substitution === \"string\") { var groups = _groups.get(this); return _super[Symbol.replace].call(this, str, substitution.replace(/\\$<([^>]+)>/g, function (_, name) { return \"$\" + groups[name]; })); } else if (typeof substitution === \"function\") { var _this = this; return _super[Symbol.replace].call(this, str, function () { var args = []; args.push.apply(args, arguments); if (_typeof(args[args.length - 1]) !== \"object\") { args.push(buildGroups(args, _this)); } return substitution.apply(this, args); }); } else { return _super[Symbol.replace].call(this, str, substitution); } }; function buildGroups(result, re) { var g = _groups.get(re); return Object.keys(g).reduce(function (groups, name) { groups[name] = result[g[name]]; return groups; }, Object.create(null)); } return _wrapRegExp.apply(this, arguments); }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }\n\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } return _assertThisInitialized(self); }\n\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\n\nfunction _wrapNativeSuper(Class) { var _cache = typeof Map === \"function\" ? new Map() : undefined; _wrapNativeSuper = function _wrapNativeSuper(Class) { if (Class === null || !_isNativeFunction(Class)) return Class; if (typeof Class !== \"function\") { throw new TypeError(\"Super expression must either be null or a function\"); } if (typeof _cache !== \"undefined\") { if (_cache.has(Class)) return _cache.get(Class); _cache.set(Class, Wrapper); } function Wrapper() { return _construct(Class, arguments, _getPrototypeOf(this).constructor); } Wrapper.prototype = Object.create(Class.prototype, { constructor: { value: Wrapper, enumerable: false, writable: true, configurable: true } }); return _setPrototypeOf(Wrapper, Class); }; return _wrapNativeSuper(Class); }\n\nfunction _construct(Parent, args, Class) { if (_isNativeReflectConstruct()) { _construct = Reflect.construct; } else { _construct = function _construct(Parent, args, Class) { var a = [null]; a.push.apply(a, args); var Constructor = Function.bind.apply(Parent, a); var instance = new Constructor(); if (Class) _setPrototypeOf(instance, Class.prototype); return instance; }; } return _construct.apply(null, arguments); }\n\nfunction _isNativeReflectConstruct() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }\n\nfunction _isNativeFunction(fn) { return Function.toString.call(fn).indexOf(\"[native code]\") !== -1; }\n\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar _default = {\n name: \"Article\",\n router: _route.default,\n store: _store.default,\n props: ['item'],\n data: function data() {\n return {\n index: -1,\n prevnext: {},\n uuid: null,\n content: null,\n loading: true,\n lightbox_index: null\n };\n },\n computed: _objectSpread({}, (0, _vuex.mapState)({\n items: function items(state) {\n return state.Blabla.items;\n }\n })),\n created: function created() {\n this.getArticle();\n },\n methods: _objectSpread(_objectSpread({}, (0, _vuex.mapActions)({\n getItems: 'Blabla/getItems',\n getItemIndex: 'Blabla/getItemIndex',\n getPrevNextItems: 'Blabla/getPrevNextItems'\n })), {}, {\n getArticle: function getArticle() {\n var _this = this;\n\n console.log(this.$route); // get the article uuid\n\n if (this.$route.query.uuid) {\n // we come from internal link with vuejs\n // directly record uuid\n this.uuid = this.$route.query.uuid;\n } else if (drupalDecoupled.entity_type == 'node' && drupalDecoupled.entity_bundle == 'article') {\n // we landed in an internal page\n // get the uuid from drupalDeclouped, provided by materio_decoupled.module\n this.uuid = drupalDecoupled.entity_uuid;\n }\n\n if (this.uuid) {\n this.loadArticle(); // get the prev next items\n\n if (!this.items.length) {\n // if items list not yet loaded preload them\n this.getItems().then(function () {\n // then get the index\n _this.getIndex();\n });\n } else {\n // or directly get the index\n this.getIndex();\n }\n } else {\n // if for any reason we dont have the uuid\n // redirect to home\n this.$route.replace('home');\n }\n },\n getIndex: function getIndex() {\n var _this2 = this;\n\n console.log(\"Article getIndex\");\n this.getItemIndex(this.uuid).then(function (index) {\n _this2.index = index; // console.log('article index', index, this);\n\n _this2.getPrevNextItems(index).then(function (pn) {\n _this2.prevnext = pn;\n });\n });\n },\n loadArticle: function loadArticle() {\n var _this3 = this;\n\n console.log('loadArticle', this.uuid);\n this.loading = true;\n var params = {\n include: 'field_linked_materials.images,field_showroom,field_tags,field_thesaurus,field_visuel,uid'\n };\n\n var q = _querystringEs.default.stringify(params);\n\n _jsonAxios.JSONAPI.get(\"node/article/\".concat(this.uuid, \"?\").concat(q)).then(function (_ref) {\n var data = _ref.data;\n console.log('loadArticle data', data);\n\n _this3.parseData(data);\n }).catch(function (error) {\n console.warn('Issue with loadArticle', error);\n Promise.reject(error);\n });\n },\n parseData: function parseData(data) {\n var _this4 = this;\n\n var attrs = data.data.attributes;\n var relations = data.data.relationships;\n console.log('relations', relations);\n var inc = data.included;\n console.log('included', inc);\n this.content = {\n title: attrs.title,\n body: attrs.body.value\n }; // build lightbox array\n // will be filled by videos and field_visuel\n\n this.content.lightbox_items = []; // parse embeded videos pushing it in lightbox\n\n for (var key in attrs.field_video) {\n var videolink = attrs.field_video[key]; // console.log('videolink', videolink);\n\n var provider_regex = /*#__PURE__*/_wrapRegExp(/https:\\/\\/(www\\.)?(youtube|vimeo)\\.com\\/.+/, {\n provider: 2\n });\n\n var match = provider_regex.exec(videolink); // console.log('provider', match.groups.provider);\n\n var video_id = null;\n var video_thumb = null;\n\n switch (match.groups.provider) {\n case 'vimeo':\n var vimeo_regex = /*#__PURE__*/_wrapRegExp(/https:\\/\\/vimeo\\.com\\/([0-9]+)/, {\n id: 1\n });\n\n video_id = vimeo_regex.exec(videolink).groups.id || null; // TODO: get the vimeo thumb https://coderwall.com/p/fdrdmg/get-a-thumbnail-from-a-vimeo-video\n\n video_thumb = \"http://blogpeda.ac-poitiers.fr/ent-lyc/files/2015/06/Vimeo_icon_block.png\";\n break;\n\n case 'youtube':\n var youtube_regex = /*#__PURE__*/_wrapRegExp(/https:\\/\\/(www\\.)?youtube\\.com\\/watch\\?v=(.+)/, {\n id: 2\n });\n\n video_id = youtube_regex.exec(videolink).groups.id || null;\n video_thumb = \"http://img.youtube.com/vi/\" + video_id + \"/0.jpg\";\n break;\n } // console.log('video_id', video_id);\n\n\n this.content.lightbox_items.push({\n src: videolink,\n title: \"\",\n description: \"\",\n thumb: video_thumb\n }); // this.content.videos.push({\n // provider: match.groups.provider,\n // id: video_id,\n // href: videolink\n // });\n } // parse all relationships\n\n\n var _loop = function _loop(_key) {\n // skip loop if the property is from prototype\n if (!relations.hasOwnProperty(_key)) return \"continue\";\n var relation_obj = relations[_key];\n console.log(\"relation\", _key, relation_obj); // console.log('typeof relation_obj.data', typeof relation_obj.data);\n\n if (!relation_obj.data) return \"continue\"; // showroom is unique field so no array in data\n // we parse it here\n\n switch (_key) {\n case 'field_showroom':\n var included = inc.find(function (i) {\n return i.id == relation_obj.data.id;\n }); // console.log('included',included);\n\n _this4.content[_key] = included.attributes;\n break;\n } // skip relation_obj if data is not array\n\n\n if (!Array.isArray(relation_obj.data)) return \"continue\"; // create empty field array\n\n _this4.content[_key] = []; // parse relationship values using included\n\n var field = {}; // loop through all relation items\n\n relation_obj.data.forEach(function (e) {\n // get the included values for each item using id\n var included = inc.find(function (i) {\n return i.id == e.id;\n }); // if we not found an included item skip the item\n\n if (typeof included != 'undefined') {\n // fill the item values\n switch (_key) {\n case 'field_visuel':\n // build the field object (not used for now)\n field = e.meta;\n field.id = e.id;\n field.src = included.attributes.uri.url;\n field.thumb = included.links.article_card_medium.href;\n break;\n\n case 'field_linked_materials':\n field = included.attributes;\n field.id = included.id; // get the linked material included images\n\n field.images = [];\n included.relationships.images.data.forEach(function (img) {\n // console.log('href', img.meta.imageDerivatives.links.card_medium.href);\n if (img.meta.imageDerivatives) {\n field.images.push({\n title: img.meta.title,\n url: img.meta.imageDerivatives.links.card_medium.href\n });\n }\n });\n break;\n\n case 'field_thesaurus':\n case 'field_tags':\n field = included.attributes;\n field.id = included.id;\n break;\n\n default:\n }\n\n _this4.content[_key].push(field);\n }\n });\n };\n\n for (var _key in relations) {\n var _ret = _loop(_key);\n\n if (_ret === \"continue\") continue;\n } // extract first visuel as accroche\n\n\n this.content.image_accroche = this.content.field_visuel.shift(); // fill the lightbox\n\n var _iterator = _createForOfIteratorHelper(this.content.field_visuel),\n _step;\n\n try {\n for (_iterator.s(); !(_step = _iterator.n()).done;) {\n var visuel = _step.value;\n this.content.lightbox_items.push(visuel);\n }\n } catch (err) {\n _iterator.e(err);\n } finally {\n _iterator.f();\n }\n\n console.log('this.content.lightbox_items', this.content.lightbox_items); // update main page title\n\n this.$store.commit('Common/setPagetitle', this.content.title);\n this.loading = false;\n console.log('article.content', this.content);\n },\n onNext: function onNext() {\n // console.log('clicked on next', this.prevnext.next);\n var alias = this.prevnext.next.view_node.replace(/^.?\\/blabla\\//g, '');\n this.$router.push({\n name: \"article\",\n params: {\n alias: alias\n },\n query: {\n uuid: this.prevnext.next.uuid\n }\n });\n },\n onPrev: function onPrev() {\n // console.log('clicked on prev', this.prevnext.next);\n var alias = this.prevnext.prev.view_node.replace(/^.?\\/blabla\\//g, '');\n this.$router.push({\n name: \"article\",\n params: {\n alias: alias\n },\n query: {\n uuid: this.prevnext.prev.uuid\n }\n });\n },\n setLightboxIndex: function setLightboxIndex(index) {\n this.lightbox_index = index;\n }\n }),\n components: {\n Card: _Card.default\n },\n watch: {\n '$route': function $route(to, from) {\n console.log('route change');\n this.getArticle();\n }\n }\n};\nexports.default = _default;\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/Pages/Article.vue?./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js??vue-loader-options"); +eval("\n\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n}));\nexports.default = void 0;\n\nvar _route = _interopRequireDefault(__webpack_require__(/*! vuejs/route */ \"./web/themes/custom/materiotheme/vuejs/route/index.js\"));\n\nvar _store = _interopRequireDefault(__webpack_require__(/*! vuejs/store */ \"./web/themes/custom/materiotheme/vuejs/store/index.js\"));\n\nvar _jsonAxios = __webpack_require__(/*! vuejs/api/json-axios */ \"./web/themes/custom/materiotheme/vuejs/api/json-axios.js\");\n\nvar _querystringEs = _interopRequireDefault(__webpack_require__(/*! querystring-es3 */ \"./node_modules/querystring-es3/index.js\"));\n\nvar _Card = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Content/Card */ \"./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue\"));\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.common.js\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _createForOfIteratorHelper(o, allowArrayLike) { var it; if (typeof Symbol === \"undefined\" || o[Symbol.iterator] == null) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === \"number\") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError(\"Invalid attempt to iterate non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = o[Symbol.iterator](); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }\n\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\n\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n\nfunction _wrapRegExp(re, groups) { _wrapRegExp = function _wrapRegExp(re, groups) { return new BabelRegExp(re, undefined, groups); }; var _RegExp = _wrapNativeSuper(RegExp); var _super = RegExp.prototype; var _groups = new WeakMap(); function BabelRegExp(re, flags, groups) { var _this = _RegExp.call(this, re, flags); _groups.set(_this, groups || _groups.get(re)); return _this; } _inherits(BabelRegExp, _RegExp); BabelRegExp.prototype.exec = function (str) { var result = _super.exec.call(this, str); if (result) result.groups = buildGroups(result, this); return result; }; BabelRegExp.prototype[Symbol.replace] = function (str, substitution) { if (typeof substitution === \"string\") { var groups = _groups.get(this); return _super[Symbol.replace].call(this, str, substitution.replace(/\\$<([^>]+)>/g, function (_, name) { return \"$\" + groups[name]; })); } else if (typeof substitution === \"function\") { var _this = this; return _super[Symbol.replace].call(this, str, function () { var args = []; args.push.apply(args, arguments); if (_typeof(args[args.length - 1]) !== \"object\") { args.push(buildGroups(args, _this)); } return substitution.apply(this, args); }); } else { return _super[Symbol.replace].call(this, str, substitution); } }; function buildGroups(result, re) { var g = _groups.get(re); return Object.keys(g).reduce(function (groups, name) { groups[name] = result[g[name]]; return groups; }, Object.create(null)); } return _wrapRegExp.apply(this, arguments); }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }\n\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } return _assertThisInitialized(self); }\n\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\n\nfunction _wrapNativeSuper(Class) { var _cache = typeof Map === \"function\" ? new Map() : undefined; _wrapNativeSuper = function _wrapNativeSuper(Class) { if (Class === null || !_isNativeFunction(Class)) return Class; if (typeof Class !== \"function\") { throw new TypeError(\"Super expression must either be null or a function\"); } if (typeof _cache !== \"undefined\") { if (_cache.has(Class)) return _cache.get(Class); _cache.set(Class, Wrapper); } function Wrapper() { return _construct(Class, arguments, _getPrototypeOf(this).constructor); } Wrapper.prototype = Object.create(Class.prototype, { constructor: { value: Wrapper, enumerable: false, writable: true, configurable: true } }); return _setPrototypeOf(Wrapper, Class); }; return _wrapNativeSuper(Class); }\n\nfunction _construct(Parent, args, Class) { if (_isNativeReflectConstruct()) { _construct = Reflect.construct; } else { _construct = function _construct(Parent, args, Class) { var a = [null]; a.push.apply(a, args); var Constructor = Function.bind.apply(Parent, a); var instance = new Constructor(); if (Class) _setPrototypeOf(instance, Class.prototype); return instance; }; } return _construct.apply(null, arguments); }\n\nfunction _isNativeReflectConstruct() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }\n\nfunction _isNativeFunction(fn) { return Function.toString.call(fn).indexOf(\"[native code]\") !== -1; }\n\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar _default = {\n name: \"Article\",\n router: _route.default,\n store: _store.default,\n props: ['item'],\n data: function data() {\n return {\n index: -1,\n prevnext: {},\n uuid: null,\n content: null,\n loading: true,\n lightbox_index: null\n };\n },\n computed: _objectSpread({}, (0, _vuex.mapState)({\n items: function items(state) {\n return state.Blabla.items;\n }\n })),\n created: function created() {\n this.getArticle();\n },\n methods: _objectSpread(_objectSpread({}, (0, _vuex.mapActions)({\n getItems: 'Blabla/getItems',\n getItemIndex: 'Blabla/getItemIndex',\n getPrevNextItems: 'Blabla/getPrevNextItems'\n })), {}, {\n getArticle: function getArticle() {\n var _this = this;\n\n console.log(this.$route); // get the article uuid\n\n if (this.$route.query.uuid) {\n // we come from internal link with vuejs\n // directly record uuid\n this.uuid = this.$route.query.uuid;\n } else if (drupalDecoupled.entity_type == 'node' && drupalDecoupled.entity_bundle == 'article') {\n // we landed in an internal page\n // get the uuid from drupalDeclouped, provided by materio_decoupled.module\n this.uuid = drupalDecoupled.entity_uuid;\n }\n\n if (this.uuid) {\n this.loadArticle(); // get the prev next items\n\n if (!this.items.length) {\n // if items list not yet loaded preload them\n this.getItems().then(function () {\n // then get the index\n _this.getIndex();\n });\n } else {\n // or directly get the index\n this.getIndex();\n }\n } else {\n // if for any reason we dont have the uuid\n // redirect to home\n this.$route.replace('home');\n }\n },\n getIndex: function getIndex() {\n var _this2 = this;\n\n console.log(\"Article getIndex\");\n this.getItemIndex(this.uuid).then(function (index) {\n _this2.index = index; // console.log('article index', index, this);\n\n _this2.getPrevNextItems(index).then(function (pn) {\n _this2.prevnext = pn;\n });\n });\n },\n loadArticle: function loadArticle() {\n var _this3 = this;\n\n console.log('loadArticle', this.uuid);\n this.loading = true;\n var params = {\n include: 'field_linked_materials.images,field_showroom,field_tags,field_thesaurus,field_visuel,uid'\n };\n\n var q = _querystringEs.default.stringify(params);\n\n _jsonAxios.JSONAPI.get(\"node/article/\".concat(this.uuid, \"?\").concat(q)).then(function (_ref) {\n var data = _ref.data;\n console.log('loadArticle data', data);\n\n _this3.parseData(data);\n }).catch(function (error) {\n console.warn('Issue with loadArticle', error);\n Promise.reject(error);\n });\n },\n parseData: function parseData(data) {\n var _this4 = this;\n\n var attrs = data.data.attributes;\n var relations = data.data.relationships;\n console.log('relations', relations);\n var inc = data.included;\n console.log('included', inc);\n this.content = {\n title: attrs.title,\n body: attrs.body.value\n }; // build lightbox array\n // will be filled by videos and field_visuel\n\n this.content.lightbox_items = []; // parse embeded videos pushing it in lightbox\n\n for (var key in attrs.field_video) {\n var videolink = attrs.field_video[key]; // console.log('videolink', videolink);\n\n var provider_regex = /*#__PURE__*/_wrapRegExp(/https:\\/\\/(www\\.)?(youtube|vimeo)\\.com\\/.+/, {\n provider: 2\n });\n\n var match = provider_regex.exec(videolink); // console.log('provider', match.groups.provider);\n\n var video_id = null;\n var video_thumb = null;\n\n switch (match.groups.provider) {\n case 'vimeo':\n var vimeo_regex = /*#__PURE__*/_wrapRegExp(/https:\\/\\/vimeo\\.com\\/([0-9]+)/, {\n id: 1\n });\n\n video_id = vimeo_regex.exec(videolink).groups.id || null; // TODO: get the vimeo thumb https://coderwall.com/p/fdrdmg/get-a-thumbnail-from-a-vimeo-video\n\n video_thumb = \"http://blogpeda.ac-poitiers.fr/ent-lyc/files/2015/06/Vimeo_icon_block.png\";\n break;\n\n case 'youtube':\n var youtube_regex = /*#__PURE__*/_wrapRegExp(/https:\\/\\/(www\\.)?youtube\\.com\\/watch\\?v=(.+)/, {\n id: 2\n });\n\n video_id = youtube_regex.exec(videolink).groups.id || null;\n video_thumb = \"http://img.youtube.com/vi/\" + video_id + \"/0.jpg\";\n break;\n } // console.log('video_id', video_id);\n\n\n this.content.lightbox_items.push({\n src: videolink,\n title: \"\",\n description: \"\",\n thumb: video_thumb\n }); // this.content.videos.push({\n // provider: match.groups.provider,\n // id: video_id,\n // href: videolink\n // });\n } // parse all relationships\n\n\n var _loop = function _loop(_key) {\n // skip loop if the property is from prototype\n if (!relations.hasOwnProperty(_key)) return \"continue\";\n var relation_obj = relations[_key];\n console.log(\"relation\", _key, relation_obj); // console.log('typeof relation_obj.data', typeof relation_obj.data);\n\n if (!relation_obj.data) return \"continue\"; // showroom is unique field so no array in data\n // we parse it here\n\n switch (_key) {\n case 'field_showroom':\n var included = inc.find(function (i) {\n return i.id == relation_obj.data.id;\n }); // console.log('included',included);\n\n _this4.content[_key] = included.attributes;\n break;\n } // skip relation_obj if data is not array\n\n\n if (!Array.isArray(relation_obj.data)) return \"continue\"; // create empty field array\n\n _this4.content[_key] = []; // parse relationship values using included\n\n var field = {}; // loop through all relation items\n\n relation_obj.data.forEach(function (e) {\n // get the included values for each item using id\n var included = inc.find(function (i) {\n return i.id == e.id;\n }); // if we not found an included item skip the item\n\n if (typeof included != 'undefined') {\n // fill the item values\n switch (_key) {\n case 'field_visuel':\n // build the field object (not used for now)\n field = e.meta;\n field.id = e.id;\n field.src = included.attributes.uri.url;\n field.thumb = included.links.article_card_medium.href;\n break;\n\n case 'field_linked_materials':\n field = included.attributes;\n field.id = field.uuid = included.id; // get the linked material included images\n\n field.images = [];\n included.relationships.images.data.forEach(function (img) {\n // console.log('href', img.meta.imageDerivatives.links.card_medium.href);\n if (img.meta.imageDerivatives) {\n field.images.push({\n title: img.meta.title,\n url: img.meta.imageDerivatives.links.card_medium.href\n });\n }\n });\n break;\n\n case 'field_thesaurus':\n case 'field_tags':\n field = included.attributes;\n field.id = included.id;\n break;\n\n default:\n }\n\n _this4.content[_key].push(field);\n }\n });\n };\n\n for (var _key in relations) {\n var _ret = _loop(_key);\n\n if (_ret === \"continue\") continue;\n } // extract first visuel as accroche\n\n\n this.content.image_accroche = this.content.field_visuel.shift(); // fill the lightbox\n\n var _iterator = _createForOfIteratorHelper(this.content.field_visuel),\n _step;\n\n try {\n for (_iterator.s(); !(_step = _iterator.n()).done;) {\n var visuel = _step.value;\n this.content.lightbox_items.push(visuel);\n }\n } catch (err) {\n _iterator.e(err);\n } finally {\n _iterator.f();\n }\n\n console.log('this.content.lightbox_items', this.content.lightbox_items); // update main page title\n\n this.$store.commit('Common/setPagetitle', this.content.title);\n this.loading = false;\n console.log('article.content', this.content);\n },\n onNext: function onNext() {\n // console.log('clicked on next', this.prevnext.next);\n var alias = this.prevnext.next.view_node.replace(/^.?\\/blabla\\//g, '');\n this.$router.push({\n name: \"article\",\n params: {\n alias: alias\n },\n query: {\n uuid: this.prevnext.next.uuid\n }\n });\n },\n onPrev: function onPrev() {\n // console.log('clicked on prev', this.prevnext.next);\n var alias = this.prevnext.prev.view_node.replace(/^.?\\/blabla\\//g, '');\n this.$router.push({\n name: \"article\",\n params: {\n alias: alias\n },\n query: {\n uuid: this.prevnext.prev.uuid\n }\n });\n },\n setLightboxIndex: function setLightboxIndex(index) {\n this.lightbox_index = index;\n }\n }),\n components: {\n Card: _Card.default\n },\n watch: {\n '$route': function $route(to, from) {\n console.log('route change');\n this.getArticle();\n }\n }\n};\nexports.default = _default;\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/Pages/Article.vue?./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js??vue-loader-options"); /***/ }), @@ -1100,6 +1100,20 @@ eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extr /***/ }), +/***/ "./node_modules/vue-cool-lightbox/dist/vue-cool-lightbox.min.css": +/*!***********************************************************************!*\ + !*** ./node_modules/vue-cool-lightbox/dist/vue-cool-lightbox.min.css ***! + \***********************************************************************/ +/*! namespace exports */ +/*! exports [not provided] [no usage info] */ +/*! runtime requirements: __webpack_require__.r, __webpack_exports__, __webpack_require__.* */ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extract-plugin\n\n\n//# sourceURL=webpack://materio.com/./node_modules/vue-cool-lightbox/dist/vue-cool-lightbox.min.css?"); + +/***/ }), + /***/ "./node_modules/mini-css-extract-plugin/dist/loader.js!./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js!./node_modules/vue-loader/lib/index.js??vue-loader-options!./web/themes/custom/materiotheme/vuejs/components/Block/LoginBlock.vue?vue&type=style&index=0&id=08f975e8&lang=scss&scoped=true&": /*!***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** ./node_modules/mini-css-extract-plugin/dist/loader.js!./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js!./node_modules/vue-loader/lib/index.js??vue-loader-options!./web/themes/custom/materiotheme/vuejs/components/Block/LoginBlock.vue?vue&type=style&index=0&id=08f975e8&lang=scss&scoped=true& ***! @@ -2733,7 +2747,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac \***************************************************************/ /*! unknown exports (runtime-defined) */ /*! runtime requirements: __webpack_require__ */ -eval("\n\nvar _vue = _interopRequireDefault(__webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.js\"));\n\nvar _vueInfiniteLoading = _interopRequireDefault(__webpack_require__(/*! vue-infinite-loading */ \"./node_modules/vue-infinite-loading/dist/vue-infinite-loading.js\"));\n\nvar _vueCoolLightbox = _interopRequireDefault(__webpack_require__(/*! vue-cool-lightbox */ \"./node_modules/vue-cool-lightbox/dist/vue-cool-lightbox.esm.js\"));\n\nvar _store = _interopRequireDefault(__webpack_require__(/*! vuejs/store */ \"./web/themes/custom/materiotheme/vuejs/store/index.js\"));\n\nvar _route = _interopRequireDefault(__webpack_require__(/*! vuejs/route */ \"./web/themes/custom/materiotheme/vuejs/route/index.js\"));\n\nvar _UserBlock = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Block/UserBlock */ \"./web/themes/custom/materiotheme/vuejs/components/Block/UserBlock.vue\"));\n\nvar _MainContent = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Content/MainContent */ \"./web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue\"));\n\nvar _SearchBlock = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Block/SearchBlock */ \"./web/themes/custom/materiotheme/vuejs/components/Block/SearchBlock.vue\"));\n\nvar _LeftContent = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Content/LeftContent */ \"./web/themes/custom/materiotheme/vuejs/components/Content/LeftContent.vue\"));\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.common.js\");\n\n__webpack_require__(/*! theme/assets/styles/main.scss */ \"./web/themes/custom/materiotheme/assets/styles/main.scss\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\n_vue.default.use(_vueInfiniteLoading.default, {\n props: {\n spinner: 'spiral' // slots.noMore: ''\n\n } // system: {\n // throttleLimit: 50,\n // /* other settings need to configure */\n // }\n\n}); // import vueVimeoPlayer from 'vue-vimeo-player'\n// Vue.use(vueVimeoPlayer)\n// import VueYouTubeEmbed from 'vue-youtube-embed'\n// Vue.use(VueYouTubeEmbed)\n\n\n_vue.default.use(_vueCoolLightbox.default);\n\n(function (Drupal, drupalSettings, drupalDecoupled) {\n var MaterioTheme = function MaterioTheme() {\n var _v_sitebranding_block, _v_user_block, _v_header_menu, _v_pagetitle_block, _v_search_block, _v_main_content, _v_left_content;\n\n var _is_front = drupalSettings.path.isFront;\n console.log('drupalSettings', drupalSettings); // ___ _ _\n // |_ _|_ _ (_) |_\n // | || ' \\| | _|\n // |___|_||_|_|\\__|\n\n function init() {\n console.log('MaterioTheme init()');\n initVues();\n }\n\n function checkNoVuePages() {\n // return drupalDecoupled.sys_path != '/cart'\n // && drupalDecoupled.sys_path.indexOf('checkout') != 1;\n if (drupalDecoupled.route_name.indexOf('commerce') == -1 && drupalDecoupled.route_name.indexOf('flagging_collection') == -1 && drupalDecoupled.route_name.indexOf('user') == -1) {\n return false;\n } else {\n return true;\n }\n }\n\n function initVues() {\n // only launch views if we are not in commerce pages\n if (!checkNoVuePages()) {\n initVRouter();\n initVSiteBrandingBlock();\n initVPagetitleBlock();\n initVHeaderMenu();\n initVMainContent();\n initVSearchBlock();\n initVLeftContent();\n }\n\n initVUserBlock();\n }\n\n function initVRouter() {\n // we need this to update the title and body classes while using history nav\n _route.default.beforeEach(function (to, from, next) {\n var _document$querySelect, _document$querySelect2;\n\n // console.log('router beforeEach to ', to);\n // commit new title to store\n var title = null;\n\n switch (to.name) {\n case 'home':\n title = null;\n break;\n\n case 'article':\n title = false;\n break;\n\n default:\n title = to.name;\n }\n\n if (title !== false) {\n _store.default.commit('Common/setPagetitle', title);\n } // remove all path related body classes\n\n\n var body_classes = document.querySelector('body').classList;\n var classes_to_rm = [];\n\n for (var i = 0; i < body_classes.length; i++) {\n if (body_classes[i].startsWith('path-')) {\n classes_to_rm.push(body_classes[i]);\n }\n }\n\n (_document$querySelect = document.querySelector('body').classList).remove.apply(_document$querySelect, classes_to_rm); // add new path classes to body\n\n\n var classes = [];\n\n if (to.path == '/') {\n classes.push('path-home');\n } else {\n var path_parts = to.path.replace(/^\\//, '').split('/'); // TODO: remove language relative prefix from path classes (fr, en, etc)\n\n for (var i = 0; i < path_parts.length; i++) {\n if (i == 0) {\n var c = 'path-' + path_parts[i];\n } else if (path_parts[i] !== '') {\n var c = classes[i - 1] + '-' + path_parts[i];\n }\n\n classes.push(c);\n }\n }\n\n (_document$querySelect2 = document.querySelector('body').classList).add.apply(_document$querySelect2, classes); // trigger router\n\n\n next();\n });\n }\n\n function initVSiteBrandingBlock() {\n _v_sitebranding_block = new _vue.default({\n store: _store.default,\n router: _route.default,\n el: '#block-sitebranding',\n methods: {\n onclick: function onclick(event) {\n // console.log(\"Clicked on logo event\", event);\n var href = event.target.getAttribute('href'); // console.log(\"Clicked on logo href\", href);\n\n this.$router.push(href); // replaced by router.beforeEach\n // this.$store.commit('Common/setPagetitle', null)\n }\n }\n });\n }\n\n function initVPagetitleBlock() {\n var $blk = document.querySelector('#block-pagetitle');\n var $h2 = $blk.querySelector('h2'); // get the loaded pagetitle\n\n var title = $h2.innerText; // if not front recorde the loaded pagetitle in store\n\n if (!_is_front) {\n _store.default.commit('Common/setPagetitle', title);\n } // replace in template the pagetitle by vue binding\n\n\n $h2.innerText = '{{ pagetitle }}'; // create the vue\n\n _v_pagetitle_block = new _vue.default({\n store: _store.default,\n router: _route.default,\n el: $blk,\n computed: _objectSpread({}, (0, _vuex.mapState)({\n pagetitle: function pagetitle(state) {\n return state.Common.pagetitle;\n }\n }))\n });\n }\n\n function initVUserBlock() {\n var mount_point = drupalSettings.user.uid !== 0 ? 'block-userblock' : 'block-userlogin';\n var props = {\n title: '',\n loginblock: ''\n };\n var $block;\n\n switch (mount_point) {\n case 'block-userlogin':\n $block = document.getElementById(mount_point);\n console.log('initVUserBlock login form html', $block);\n props.loginblock = $block.outerHTML.trim();\n break;\n\n case 'block-userblock':\n default:\n break;\n }\n\n _v_user_block = new _vue.default({\n store: _store.default,\n // computed: {\n // ...mapState({\n // isloggedin: state => state.User.isloggedin\n // })\n // },\n created: function created() {\n // if already loggedin, call store.user to get the user infos\n if (drupalSettings.user.uid !== 0) {\n this.$store.commit('User/setUid', drupalSettings.user.uid);\n this.$store.dispatch('User/getUser');\n }\n },\n render: function render(h) {\n return h(_UserBlock.default, {\n props: props\n });\n }\n }).$mount('#' + mount_point); // console.log('initVUserBlock', _v_user_block);\n }\n\n function initVHeaderMenu() {\n // console.log('initVHeaderMenu');\n // adding vuejs attributes has it wont work on twig template (see menu--header.html.twig)\n // not working : String contains an invalid character\n // document.querySelectorAll(`#block-header a`).forEach(link => {\n // console.log(link);\n // link.setAttribute('@click.prevent', 'onclick')\n // });\n _v_header_menu = new _vue.default({\n store: _store.default,\n router: _route.default,\n el: '#block-header',\n methods: {\n onclick: function onclick(event) {\n // console.log(\"Clicked on header menu link\", event);\n var href = event.target.getAttribute('href'); // let title = event.target.innerText;\n // console.log(\"Clicked on header menu link : href\", href);\n\n this.$router.push(href); // replaced by router.beforeEach\n // this.$store.commit('Common/setPagetitle', title)\n }\n }\n });\n }\n\n function initVMainContent() {\n var id = 'main-content';\n var $main_content = document.querySelector('#' + id); // console.log('main-content', $main_content);\n\n var main_html = $main_content.innerHTML;\n _v_main_content = new _vue.default({\n store: _store.default,\n render: function render(h) {\n return h(_MainContent.default, {\n props: {\n id: id,\n html: main_html,\n isfront: drupalSettings.path.isFront\n }\n });\n }\n }).$mount('#' + id);\n }\n\n function initVSearchBlock() {\n // console.log('initVSearchBlock');\n var id = 'block-materiosapisearchblock';\n var $search_block = document.getElementById(id);\n var formhtml = null;\n\n if ($search_block) {\n // get the search form html to pass it as template to the vue\n // we gain display speed vs async downloaded data\n formhtml = $search_block.innerHTML;\n } else {\n // else create the empty block to fill it later with async data\n $search_block = document.createElement('div');\n $search_block.setAttribute('id', id); // TODO: get region by REST\n\n var $region = document.getElementById('header-bottom');\n $region.appendChild($search_block);\n } // in any case create the vue\n\n\n _v_search_block = new _vue.default({\n store: _store.default,\n render: function render(h) {\n return h(_SearchBlock.default, {\n props: {\n blockid: id,\n formhtml: formhtml\n }\n });\n }\n }).$mount('#' + id);\n }\n\n function initVLeftContent() {\n var id = 'content-left';\n var $leftContent = document.getElementById(id); // in any case create the vue\n\n _v_left_content = new _vue.default({\n store: _store.default,\n render: function render(h) {\n return h(_LeftContent.default, {\n props: {\n id: id\n }\n });\n }\n }).$mount('#' + id);\n }\n\n init();\n }; // end MaterioTheme()\n\n\n var materiotheme = new MaterioTheme();\n})(Drupal, drupalSettings, drupalDecoupled);\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/assets/scripts/main.js?"); +eval("\n\nvar _vue = _interopRequireDefault(__webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.js\"));\n\nvar _vueInfiniteLoading = _interopRequireDefault(__webpack_require__(/*! vue-infinite-loading */ \"./node_modules/vue-infinite-loading/dist/vue-infinite-loading.js\"));\n\nvar _vueCoolLightbox = _interopRequireDefault(__webpack_require__(/*! vue-cool-lightbox */ \"./node_modules/vue-cool-lightbox/dist/vue-cool-lightbox.esm.js\"));\n\nvar _store = _interopRequireDefault(__webpack_require__(/*! vuejs/store */ \"./web/themes/custom/materiotheme/vuejs/store/index.js\"));\n\nvar _route = _interopRequireDefault(__webpack_require__(/*! vuejs/route */ \"./web/themes/custom/materiotheme/vuejs/route/index.js\"));\n\nvar _UserBlock = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Block/UserBlock */ \"./web/themes/custom/materiotheme/vuejs/components/Block/UserBlock.vue\"));\n\nvar _MainContent = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Content/MainContent */ \"./web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue\"));\n\nvar _SearchBlock = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Block/SearchBlock */ \"./web/themes/custom/materiotheme/vuejs/components/Block/SearchBlock.vue\"));\n\nvar _LeftContent = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Content/LeftContent */ \"./web/themes/custom/materiotheme/vuejs/components/Content/LeftContent.vue\"));\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.common.js\");\n\n__webpack_require__(/*! vue-cool-lightbox/dist/vue-cool-lightbox.min.css */ \"./node_modules/vue-cool-lightbox/dist/vue-cool-lightbox.min.css\");\n\n__webpack_require__(/*! theme/assets/styles/main.scss */ \"./web/themes/custom/materiotheme/assets/styles/main.scss\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\n_vue.default.use(_vueInfiniteLoading.default, {\n props: {\n spinner: 'spiral' // slots.noMore: ''\n\n } // system: {\n // throttleLimit: 50,\n // /* other settings need to configure */\n // }\n\n}); // import vueVimeoPlayer from 'vue-vimeo-player'\n// Vue.use(vueVimeoPlayer)\n// import VueYouTubeEmbed from 'vue-youtube-embed'\n// Vue.use(VueYouTubeEmbed)\n\n\n_vue.default.use(_vueCoolLightbox.default);\n\n(function (Drupal, drupalSettings, drupalDecoupled) {\n var MaterioTheme = function MaterioTheme() {\n var _v_sitebranding_block, _v_user_block, _v_header_menu, _v_pagetitle_block, _v_search_block, _v_main_content, _v_left_content;\n\n var _is_front = drupalSettings.path.isFront;\n console.log('drupalSettings', drupalSettings); // ___ _ _\n // |_ _|_ _ (_) |_\n // | || ' \\| | _|\n // |___|_||_|_|\\__|\n\n function init() {\n console.log('MaterioTheme init()');\n initVues();\n }\n\n function checkNoVuePages() {\n // return drupalDecoupled.sys_path != '/cart'\n // && drupalDecoupled.sys_path.indexOf('checkout') != 1;\n if (drupalDecoupled.route_name.indexOf('commerce') == -1 && drupalDecoupled.route_name.indexOf('flagging_collection') == -1 && drupalDecoupled.route_name.indexOf('user') == -1) {\n return false;\n } else {\n return true;\n }\n }\n\n function initVues() {\n // only launch views if we are not in commerce pages\n if (!checkNoVuePages()) {\n initVRouter();\n initVSiteBrandingBlock();\n initVPagetitleBlock();\n initVHeaderMenu();\n initVMainContent();\n initVSearchBlock();\n initVLeftContent();\n }\n\n initVUserBlock();\n }\n\n function initVRouter() {\n // we need this to update the title and body classes while using history nav\n _route.default.beforeEach(function (to, from, next) {\n var _document$querySelect, _document$querySelect2;\n\n // console.log('router beforeEach to ', to);\n // commit new title to store\n var title = null;\n\n switch (to.name) {\n case 'home':\n title = null;\n break;\n\n case 'article':\n title = false;\n break;\n\n default:\n title = to.name;\n }\n\n if (title !== false) {\n _store.default.commit('Common/setPagetitle', title);\n } // remove all path related body classes\n\n\n var body_classes = document.querySelector('body').classList;\n var classes_to_rm = [];\n\n for (var i = 0; i < body_classes.length; i++) {\n if (body_classes[i].startsWith('path-')) {\n classes_to_rm.push(body_classes[i]);\n }\n }\n\n (_document$querySelect = document.querySelector('body').classList).remove.apply(_document$querySelect, classes_to_rm); // add new path classes to body\n\n\n var classes = [];\n\n if (to.path == '/') {\n classes.push('path-home');\n } else {\n var path_parts = to.path.replace(/^\\//, '').split('/'); // TODO: remove language relative prefix from path classes (fr, en, etc)\n\n for (var i = 0; i < path_parts.length; i++) {\n if (i == 0) {\n var c = 'path-' + path_parts[i];\n } else if (path_parts[i] !== '') {\n var c = classes[i - 1] + '-' + path_parts[i];\n }\n\n classes.push(c);\n }\n }\n\n (_document$querySelect2 = document.querySelector('body').classList).add.apply(_document$querySelect2, classes); // trigger router\n\n\n next();\n });\n }\n\n function initVSiteBrandingBlock() {\n _v_sitebranding_block = new _vue.default({\n store: _store.default,\n router: _route.default,\n el: '#block-sitebranding',\n methods: {\n onclick: function onclick(event) {\n // console.log(\"Clicked on logo event\", event);\n var href = event.target.getAttribute('href'); // console.log(\"Clicked on logo href\", href);\n\n this.$router.push(href); // replaced by router.beforeEach\n // this.$store.commit('Common/setPagetitle', null)\n }\n }\n });\n }\n\n function initVPagetitleBlock() {\n var $blk = document.querySelector('#block-pagetitle');\n var $h2 = $blk.querySelector('h2'); // get the loaded pagetitle\n\n var title = $h2.innerText; // if not front recorde the loaded pagetitle in store\n\n if (!_is_front) {\n _store.default.commit('Common/setPagetitle', title);\n } // replace in template the pagetitle by vue binding\n\n\n $h2.innerText = '{{ pagetitle }}'; // create the vue\n\n _v_pagetitle_block = new _vue.default({\n store: _store.default,\n router: _route.default,\n el: $blk,\n computed: _objectSpread({}, (0, _vuex.mapState)({\n pagetitle: function pagetitle(state) {\n return state.Common.pagetitle;\n }\n }))\n });\n }\n\n function initVUserBlock() {\n var mount_point = drupalSettings.user.uid !== 0 ? 'block-userblock' : 'block-userlogin';\n var props = {\n title: '',\n loginblock: ''\n };\n var $block;\n\n switch (mount_point) {\n case 'block-userlogin':\n $block = document.getElementById(mount_point);\n console.log('initVUserBlock login form html', $block);\n props.loginblock = $block.outerHTML.trim();\n break;\n\n case 'block-userblock':\n default:\n break;\n }\n\n _v_user_block = new _vue.default({\n store: _store.default,\n // computed: {\n // ...mapState({\n // isloggedin: state => state.User.isloggedin\n // })\n // },\n created: function created() {\n // if already loggedin, call store.user to get the user infos\n if (drupalSettings.user.uid !== 0) {\n this.$store.commit('User/setUid', drupalSettings.user.uid);\n this.$store.dispatch('User/getUser');\n }\n },\n render: function render(h) {\n return h(_UserBlock.default, {\n props: props\n });\n }\n }).$mount('#' + mount_point); // console.log('initVUserBlock', _v_user_block);\n }\n\n function initVHeaderMenu() {\n // console.log('initVHeaderMenu');\n // adding vuejs attributes has it wont work on twig template (see menu--header.html.twig)\n // not working : String contains an invalid character\n // document.querySelectorAll(`#block-header a`).forEach(link => {\n // console.log(link);\n // link.setAttribute('@click.prevent', 'onclick')\n // });\n _v_header_menu = new _vue.default({\n store: _store.default,\n router: _route.default,\n el: '#block-header',\n methods: {\n onclick: function onclick(event) {\n // console.log(\"Clicked on header menu link\", event);\n var href = event.target.getAttribute('href'); // let title = event.target.innerText;\n // console.log(\"Clicked on header menu link : href\", href);\n\n this.$router.push(href); // replaced by router.beforeEach\n // this.$store.commit('Common/setPagetitle', title)\n }\n }\n });\n }\n\n function initVMainContent() {\n var id = 'main-content';\n var $main_content = document.querySelector('#' + id); // console.log('main-content', $main_content);\n\n var main_html = $main_content.innerHTML;\n _v_main_content = new _vue.default({\n store: _store.default,\n render: function render(h) {\n return h(_MainContent.default, {\n props: {\n id: id,\n html: main_html,\n isfront: drupalSettings.path.isFront\n }\n });\n }\n }).$mount('#' + id);\n }\n\n function initVSearchBlock() {\n // console.log('initVSearchBlock');\n var id = 'block-materiosapisearchblock';\n var $search_block = document.getElementById(id);\n var formhtml = null;\n\n if ($search_block) {\n // get the search form html to pass it as template to the vue\n // we gain display speed vs async downloaded data\n formhtml = $search_block.innerHTML;\n } else {\n // else create the empty block to fill it later with async data\n $search_block = document.createElement('div');\n $search_block.setAttribute('id', id); // TODO: get region by REST\n\n var $region = document.getElementById('header-bottom');\n $region.appendChild($search_block);\n } // in any case create the vue\n\n\n _v_search_block = new _vue.default({\n store: _store.default,\n render: function render(h) {\n return h(_SearchBlock.default, {\n props: {\n blockid: id,\n formhtml: formhtml\n }\n });\n }\n }).$mount('#' + id);\n }\n\n function initVLeftContent() {\n var id = 'content-left';\n var $leftContent = document.getElementById(id); // in any case create the vue\n\n _v_left_content = new _vue.default({\n store: _store.default,\n render: function render(h) {\n return h(_LeftContent.default, {\n props: {\n id: id\n }\n });\n }\n }).$mount('#' + id);\n }\n\n init();\n }; // end MaterioTheme()\n\n\n var materiotheme = new MaterioTheme();\n})(Drupal, drupalSettings, drupalDecoupled);\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/assets/scripts/main.js?"); })(); /******/ })() diff --git a/web/themes/custom/materiotheme/assets/scripts/main.js b/web/themes/custom/materiotheme/assets/scripts/main.js index f4a074d0..0f7447a5 100644 --- a/web/themes/custom/materiotheme/assets/scripts/main.js +++ b/web/themes/custom/materiotheme/assets/scripts/main.js @@ -31,6 +31,7 @@ import VLeftContent from 'vuejs/components/Content/LeftContent' import { mapState } from 'vuex' // require('theme/assets/styles/main.scss'); +import 'vue-cool-lightbox/dist/vue-cool-lightbox.min.css' import 'theme/assets/styles/main.scss' (function (Drupal, drupalSettings, drupalDecoupled) { diff --git a/web/themes/custom/materiotheme/vuejs/components/Pages/Article.vue b/web/themes/custom/materiotheme/vuejs/components/Pages/Article.vue index 3bec0617..213af4b5 100644 --- a/web/themes/custom/materiotheme/vuejs/components/Pages/Article.vue +++ b/web/themes/custom/materiotheme/vuejs/components/Pages/Article.vue @@ -304,7 +304,7 @@ export default { break; case 'field_linked_materials': field = included.attributes - field.id = included.id + field.id = field.uuid = included.id // get the linked material included images field.images = []; included.relationships.images.data.forEach((img) => {