From 564a1638fc1b96db022c12ae9649308a21b9f11f Mon Sep 17 00:00:00 2001 From: Bachir Soussi Chiadmi Date: Tue, 1 Dec 2020 20:40:37 +0100 Subject: [PATCH] folders beta 1 --- ...iews_block__my_flag_list_items_block_1.yml | 35 ++++++++ config/sync/image.style.card_medium_half.yml | 4 +- .../custom/materiotheme/assets/dist/main.css | 54 ++++++++--- .../custom/materiotheme/assets/dist/main.js | 18 ++-- .../assets/styles/base/_layout.scss | 4 +- .../assets/styles/base/_variables.scss | 3 + .../materiotheme/assets/styles/main.scss | 51 +++++++++-- .../vuejs/components/Content/Card.vue | 24 ++--- .../vuejs/components/Content/MiniCard.vue | 73 +++++++-------- .../vuejs/components/User/FlagCollection.vue | 10 ++- .../vuejs/components/User/UserFlags.vue | 8 +- .../materiotheme/vuejs/store/modules/user.js | 89 ++++++++++--------- 12 files changed, 234 insertions(+), 139 deletions(-) create mode 100644 config/sync/block.block.views_block__my_flag_list_items_block_1.yml diff --git a/config/sync/block.block.views_block__my_flag_list_items_block_1.yml b/config/sync/block.block.views_block__my_flag_list_items_block_1.yml new file mode 100644 index 0000000..95fd2ca --- /dev/null +++ b/config/sync/block.block.views_block__my_flag_list_items_block_1.yml @@ -0,0 +1,35 @@ +uuid: b3a7a1d3-79a0-4874-abdd-4a49c48d0f5d +langcode: en +status: false +dependencies: + config: + - views.view.my_flag_list_items + module: + - context + - views + theme: + - materiotheme +id: views_block__my_flag_list_items_block_1 +theme: materiotheme +region: content_left +weight: 0 +provider: null +plugin: 'views_block:my_flag_list_items-block_1' +settings: + id: 'views_block:my_flag_list_items-block_1' + label: '' + provider: views + label_display: visible + views_label: '' + items_per_page: none +visibility: + view_inclusion: + id: view_inclusion + negate: null + view_inclusion: { } + context_mapping: { } + request_path_exclusion: + id: request_path_exclusion + pages: '' + negate: null + context_mapping: { } diff --git a/config/sync/image.style.card_medium_half.yml b/config/sync/image.style.card_medium_half.yml index 1ed2e42..fb553e2 100644 --- a/config/sync/image.style.card_medium_half.yml +++ b/config/sync/image.style.card_medium_half.yml @@ -3,13 +3,13 @@ langcode: en status: true dependencies: { } name: card_medium_half -label: 'card-medium-half (205x100)' +label: 'minicard (170x100)' effects: 34e936a0-1fee-4327-9553-b4f48bde14e6: uuid: 34e936a0-1fee-4327-9553-b4f48bde14e6 id: image_scale_and_crop weight: 1 data: - width: 205 + width: 170 height: 100 anchor: center-center diff --git a/web/themes/custom/materiotheme/assets/dist/main.css b/web/themes/custom/materiotheme/assets/dist/main.css index 318dc99..4e73540 100644 --- a/web/themes/custom/materiotheme/assets/dist/main.css +++ b/web/themes/custom/materiotheme/assets/dist/main.css @@ -1182,10 +1182,12 @@ main[role="main"] { display: flex; flex-direction: row-reverse; } main[role="main"] > .scroller > .wrapper #content-left { - flex-basis: 218px; + flex-basis: 205px; flex-shrink: 0; } main[role="main"] > .scroller > .wrapper #content-left > * { - width: 100%; } + width: 100%; + box-sizing: border-box; + padding: 0.5em 13px; } main[role="main"] > .scroller > .wrapper #content-center { flex-basis: 110%; } @@ -1303,10 +1305,11 @@ header[role="banner"] { position: absolute; right: 0; top: 1.7em; - box-sizing: content-box; } + box-sizing: content-box; + z-index: 30; } header[role="banner"] #user-flags:hover ul { transition-delay: 0s; - max-height: 12em; + max-height: 50em; padding: 1em 1em; box-shadow: 0 0 10px #ccc; } header[role="banner"] #user-flags li { @@ -1460,7 +1463,8 @@ aside.messages { #content-left .flag-collection > header { display: flex; flex-direction: row; - justify-content: space-between; } + justify-content: space-between; + padding-bottom: 13px; } #content-left .flag-collection > header .mdi-close { cursor: pointer; align-self: flex-end; } @@ -1468,13 +1472,20 @@ aside.messages { margin: 0 0 13px 0; padding: 0; } #content-left .flag-collection > ul > li article.card.minicard { - width: 100%; } + width: 170px; + height: 100px; + margin: auto; } #content-left .flag-collection > ul > li article.card.minicard > header { padding: 0.3em 0.3em 0.1em; } #content-left .flag-collection > ul > li article.card.minicard > header h1 { margin: 0; } #content-left .flag-collection > ul > li article.card.minicard > nav.tools { - padding: 0 0.2em; } + top: auto; + bottom: 0; + padding: 0 0.2em; + background: transparent; } + #content-left .flag-collection > ul > li article.card.minicard > nav.tools .mdi.unflag { + cursor: pointer; } article.node--type-frontpage .node__content > section.home-intro > div:nth-child(1) .field__label, article.node--type-frontpage .node__content > section.home-pricing > div:nth-child(1) .field__label, article.node--type-frontpage .node__content > section.home-database > div:nth-child(1) .field__label, article.node--type-frontpage .node__content > section.home-showrooms > div:nth-child(1) .field__label, article.node--type-frontpage .node__content > section.home-blabla > div:nth-child(1) .field__label { font-size: 3.5em; @@ -1681,10 +1692,12 @@ article.card { top: 0; right: 0; z-index: 21; - width: 1em; + width: 15px; background-color: #fff; box-sizing: content-box; - padding: 0.3em 0.1em; } + padding: 0.3em 0.1em; + opacity: 0; + transition: opacity 0.2s ease-in-out; } article.card nav.tools > * { overflow: visible; position: relative; } @@ -1695,11 +1708,26 @@ article.card { position: absolute; top: 0px; right: 100%; - width: 5em; - box-sizing: content-box; + width: 180px; + box-sizing: border-box; padding: 0.3em; background-color: #fff; - box-shadow: -2px 3px 4px rgba(0, 0, 0, 0.2); } + box-shadow: -2px 3px 4px rgba(0, 0, 0, 0.2); + opacity: 0; + max-height: 0; + max-width: 0; + overflow: hidden; + transition: all 0.2s ease-in-out; } + article.card nav.tools > *:hover .tool-content { + transition: all 0.3s ease-in-out; + opacity: 1; + max-height: 195px; + max-width: 200px; } + article.card nav.tools .tool.flags .tool-content ul { + display: flex; + flex-flow: row wrap; } + article.card nav.tools .tool.flags .tool-content ul li { + padding: 0 0.5em 0 0; } article.card nav.tools .tool.flags span.flag { cursor: pointer; font-size: 0.756em; @@ -1707,6 +1735,8 @@ article.card { transition: color 0.3s ease-in-out; } article.card nav.tools .tool.flags span.flag:hover, article.card nav.tools .tool.flags span.flag.isActive { color: #1a1a1a; } + article.card:hover nav.tools { + opacity: 1; } article.card section.images { position: relative; } article.card section.images, article.card section.images * { diff --git a/web/themes/custom/materiotheme/assets/dist/main.js b/web/themes/custom/materiotheme/assets/dist/main.js index 0958e5d..c9fac94 100644 --- a/web/themes/custom/materiotheme/assets/dist/main.js +++ b/web/themes/custom/materiotheme/assets/dist/main.js @@ -513,7 +513,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n})); /***/ ((__unused_webpack_module, exports, __webpack_require__) => { "use strict"; -eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n}));\nexports.default = void 0;\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.common.js\");\n\nvar _cardMixins = _interopRequireDefault(__webpack_require__(/*! vuejs/components/cardMixins */ \"./web/themes/custom/materiotheme/vuejs/components/cardMixins.js\"));\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\nvar _default = {\n name: \"Card\",\n props: ['item'],\n mixins: [_cardMixins.default],\n data: function data() {\n return {\n blanksrc: \"\".concat(drupalSettings.path.themePath, \"/assets/img/blank.gif\"),\n loadingFlag: false\n };\n },\n computed: _objectSpread({}, (0, _vuex.mapState)({\n flagcolls: function flagcolls(state) {\n return state.User.flagcolls;\n }\n })),\n methods: _objectSpread(_objectSpread({}, (0, _vuex.mapActions)({\n flag: 'User/flag',\n unFlag: 'User/unFlag'\n })), {}, {\n flagIsActive: function flagIsActive(collid) {\n // console.log(this.item.uuid);\n // console.log(this.flagcolls[collid].items_uuids);\n return this.flagcolls[collid].items_uuids.indexOf(this.item.uuid) !== -1;\n },\n flagIsLoading: function flagIsLoading(collid) {\n // console.log(this.item.uuid);\n // console.log(this.flagcolls[collid].items_uuids);\n return collid === this.loadingFlag;\n },\n onFlagActionCard: function onFlagActionCard(e) {\n var _this = this;\n\n console.log(\"Card onFlagActionCard\", e);\n\n if (!this.loadingFlag) {\n var collid = e.target.getAttribute('collid');\n var isActive = this.flagIsActive(collid); // console.log('collid', collid);\n // console.log(\"this.item\", this.item);\n\n this.loadingFlag = collid;\n\n if (isActive) {\n this.unFlag({\n uuid: this.item.uuid,\n collid: collid\n }).then(function (data) {\n console.log(\"onFlagActionCard then\", data);\n _this.loadingFlag = false;\n });\n } else {\n this.flag({\n uuid: this.item.uuid,\n collid: collid\n }).then(function (data) {\n console.log(\"onFlagActionCard then\", data);\n _this.loadingFlag = false;\n });\n }\n }\n }\n })\n};\nexports.default = _default;\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js??vue-loader-options"); +eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n}));\nexports.default = void 0;\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.common.js\");\n\nvar _cardMixins = _interopRequireDefault(__webpack_require__(/*! vuejs/components/cardMixins */ \"./web/themes/custom/materiotheme/vuejs/components/cardMixins.js\"));\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\nvar _default = {\n name: \"Card\",\n props: ['item'],\n mixins: [_cardMixins.default],\n data: function data() {\n return {\n blanksrc: \"\".concat(drupalSettings.path.themePath, \"/assets/img/blank.gif\"),\n loadingFlag: false\n };\n },\n computed: _objectSpread({}, (0, _vuex.mapState)({\n flagcolls: function flagcolls(state) {\n return state.User.flagcolls;\n }\n })),\n methods: _objectSpread(_objectSpread({}, (0, _vuex.mapActions)({\n flagUnflag: 'User/flagUnflag'\n })), {}, {\n flagIsActive: function flagIsActive(collid) {\n // console.log(this.item.uuid);\n // console.log(this.flagcolls[collid].items_uuids);\n return this.flagcolls[collid].items_uuids.indexOf(this.item.uuid) !== -1;\n },\n flagIsLoading: function flagIsLoading(collid) {\n // console.log(this.item.uuid);\n // console.log(this.flagcolls[collid].items_uuids);\n return collid === this.loadingFlag;\n },\n onFlagActionCard: function onFlagActionCard(e) {\n var _this = this;\n\n console.log(\"Card onFlagActionCard\", e);\n\n if (!this.loadingFlag) {\n var collid = e.target.getAttribute('collid');\n var isActive = this.flagIsActive(collid);\n var action = isActive ? 'unflag' : 'flag'; // console.log('collid', collid);\n // console.log(\"this.item\", this.item);\n\n this.loadingFlag = collid;\n this.flagUnflag({\n action: action,\n uuid: this.item.uuid,\n collid: collid\n }).then(function (data) {\n console.log(\"onFlagActionCard then\", data);\n _this.loadingFlag = false;\n });\n }\n }\n })\n};\nexports.default = _default;\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js??vue-loader-options"); /***/ }), @@ -561,7 +561,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n})); /***/ ((__unused_webpack_module, exports, __webpack_require__) => { "use strict"; -eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n}));\nexports.default = void 0;\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.common.js\");\n\nvar _cardMixins = _interopRequireDefault(__webpack_require__(/*! vuejs/components/cardMixins */ \"./web/themes/custom/materiotheme/vuejs/components/cardMixins.js\"));\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\nvar _default = {\n name: \"MiniCard\",\n props: ['item'],\n mixins: [_cardMixins.default],\n data: function data() {\n return {\n blanksrc: \"\".concat(drupalSettings.path.themePath, \"/assets/img/blank.gif\") // loadingFlag: false\n\n };\n },\n computed: {// ...mapState({\n // flagcolls: state => state.User.flagcolls\n // })\n },\n methods: {// ...mapActions({\n // flag: 'User/flag',\n // unFlag: 'User/unFlag'\n // }),\n // flagIsActive(collid) {\n // // console.log(this.item.uuid);\n // // console.log(this.flagcolls[collid].items_uuids);\n // return this.flagcolls[collid].items_uuids.indexOf(this.item.uuid) !== -1;\n // },\n // flagIsLoading(collid) {\n // // console.log(this.item.uuid);\n // // console.log(this.flagcolls[collid].items_uuids);\n // return collid === this.loadingFlag;\n // },\n // onFlagActionCard (e) {\n // console.log(\"Card onFlagActionCard\", e);\n // if (!this.loadingFlag) {\n // let collid = e.target.getAttribute('collid');\n // let isActive = this.flagIsActive(collid);\n // // console.log('collid', collid);\n // // console.log(\"this.item\", this.item);\n // this.loadingFlag = collid;\n // if (isActive) {\n // this.unFlag({uuid: this.item.uuid, collid: collid})\n // .then(data => {\n // console.log(\"onFlagActionCard then\", data);\n // this.loadingFlag = false;\n // })\n // }else{\n // this.flag({uuid: this.item.uuid, collid: collid})\n // .then(data => {\n // console.log(\"onFlagActionCard then\", data);\n // this.loadingFlag = false;\n // })\n // }\n // }\n // }\n }\n};\nexports.default = _default;\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/Content/MiniCard.vue?./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js??vue-loader-options"); +eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n}));\nexports.default = void 0;\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.common.js\");\n\nvar _cardMixins = _interopRequireDefault(__webpack_require__(/*! vuejs/components/cardMixins */ \"./web/themes/custom/materiotheme/vuejs/components/cardMixins.js\"));\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\nvar _default = {\n name: \"MiniCard\",\n props: ['item', 'collid'],\n mixins: [_cardMixins.default],\n data: function data() {\n return {\n blanksrc: \"\".concat(drupalSettings.path.themePath, \"/assets/img/blank.gif\"),\n loadingItem: false\n };\n },\n computed: {},\n methods: _objectSpread(_objectSpread({}, (0, _vuex.mapActions)({\n flagUnflag: 'User/flagUnflag'\n })), {}, {\n itemIsLoading: function itemIsLoading(id) {\n return this.loadingItem;\n },\n onUnFlagCard: function onUnFlagCard(e) {\n var _this = this;\n\n console.log(\"Card onFlagActionCard\", e);\n\n if (!this.loadingItem) {\n this.loadingItem = true;\n this.flagUnflag({\n action: 'unflag',\n uuid: this.item.uuid,\n collid: this.collid\n }).then(function (data) {\n console.log(\"onUnFlagCard then\", data);\n _this.loadingItem = false;\n });\n }\n }\n })\n};\nexports.default = _default;\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/Content/MiniCard.vue?./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js??vue-loader-options"); /***/ }), @@ -785,7 +785,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n})); /***/ ((__unused_webpack_module, exports, __webpack_require__) => { "use strict"; -eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n}));\nexports.default = void 0;\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.common.js\");\n\nvar _MiniCard = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Content/MiniCard */ \"./web/themes/custom/materiotheme/vuejs/components/Content/MiniCard.vue\"));\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\nvar _default = {\n name: \"FlagCollection\",\n props: ['collection'],\n data: function data() {\n return {\n loadedItems: false\n };\n },\n computed: _objectSpread({}, (0, _vuex.mapState)({\n flagcolls: function flagcolls(state) {\n return state.User.flagcolls;\n },\n openedCollid: function openedCollid(state) {\n return state.User.openedCollid;\n }\n })),\n // watch: {\n // flagcolls (newv, oldv) {\n // console.log('watching flagcolls');\n // if( typeof this.flagcolls[this.collection.id].loadedItems !== 'undefined' ) {\n // this.loadedItems = this.flagcolls[this.collection.id].loadedItems\n // }\n // }\n // },\n created: function created() {\n var _this = this;\n\n if (typeof this.collection.loadedItems !== 'undefined') {\n // if loadedItems are alredy loaded,\n // the mutation occurs before this subscription\n // so we first check if they are already available\n this.loadedItems = this.collection.loadedItems;\n }\n\n this.unsubscribe = this.$store.subscribe(function (mutation, state) {\n if (mutation.type === 'User/setLoadedCollItems') {\n console.log(\"mutation setLoadedCollItems collid\", _this.openedCollid); // mutation is triggered before the component update\n // so this.collection.id is not good\n\n _this.loadedItems = state.User.flagcolls[_this.openedCollid].loadedItems;\n }\n });\n },\n beforeDestroy: function beforeDestroy() {\n this.unsubscribe();\n },\n // beforeMount () {\n // if (typeof this.flagcolls[collection.id].loadedItems === 'undefined') {\n // this.\n // }\n // },\n methods: _objectSpread(_objectSpread({}, (0, _vuex.mapActions)({\n closeFlagColl: 'User/closeFlagColl'\n })), {}, {\n onCloseFlagColl: function onCloseFlagColl(e) {\n this.closeFlagColl();\n }\n }),\n components: {\n MiniCard: _MiniCard.default\n }\n};\nexports.default = _default;\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/User/FlagCollection.vue?./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js??vue-loader-options"); +eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n}));\nexports.default = void 0;\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.common.js\");\n\nvar _MiniCard = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Content/MiniCard */ \"./web/themes/custom/materiotheme/vuejs/components/Content/MiniCard.vue\"));\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\nvar _default = {\n name: \"FlagCollection\",\n props: ['collection'],\n data: function data() {\n return {\n loadedItems: false\n };\n },\n computed: _objectSpread({}, (0, _vuex.mapState)({\n flagcolls: function flagcolls(state) {\n return state.User.flagcolls;\n },\n flagcollsLoadedItems: function flagcollsLoadedItems(state) {\n return state.User.flagcollsLoadedItems;\n },\n openedCollid: function openedCollid(state) {\n return state.User.openedCollid;\n }\n })),\n // watch: {\n // flagcolls (newv, oldv) {\n // console.log('watching flagcolls');\n // if( typeof this.flagcolls[this.collection.id].loadedItems !== 'undefined' ) {\n // this.loadedItems = this.flagcolls[this.collection.id].loadedItems\n // }\n // }\n // },\n created: function created() {\n var _this = this;\n\n if (typeof this.flagcollsLoadedItems[this.openedCollid] !== 'undefined') {\n // if loadedItems are alredy loaded,\n // the mutation occurs before this subscription\n // so we first check if they are already available\n this.loadedItems = this.flagcollsLoadedItems[this.openedCollid];\n }\n\n this.unsubscribe = this.$store.subscribe(function (mutation, state) {\n if (mutation.type === 'User/setLoadedCollItems') {\n console.log(\"mutation setLoadedCollItems collid\", _this.openedCollid); // mutation is triggered before the component update\n // so this.collection.id is not good\n\n _this.loadedItems = state.User.flagcollsLoadedItems[_this.openedCollid];\n }\n });\n },\n beforeDestroy: function beforeDestroy() {\n this.unsubscribe();\n },\n // beforeMount () {\n // if (typeof this.flagcolls[collection.id].loadedItems === 'undefined') {\n // this.\n // }\n // },\n methods: _objectSpread(_objectSpread({}, (0, _vuex.mapActions)({\n closeFlagColl: 'User/closeFlagColl'\n })), {}, {\n onCloseFlagColl: function onCloseFlagColl(e) {\n this.closeFlagColl();\n }\n }),\n components: {\n MiniCard: _MiniCard.default\n }\n};\nexports.default = _default;\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/User/FlagCollection.vue?./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js??vue-loader-options"); /***/ }), @@ -801,7 +801,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n})); /***/ ((__unused_webpack_module, exports, __webpack_require__) => { "use strict"; -eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n}));\nexports.default = void 0;\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.common.js\");\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: \"userFlags\",\n data: function data() {\n return {\n new_folder_name: \"\",\n is_creating_folder: false,\n is_deleting_folder: false\n };\n },\n computed: _objectSpread(_objectSpread({}, (0, _vuex.mapState)({\n flagcolls: function flagcolls(state) {\n return state.User.flagcolls;\n }\n })), {}, {\n addFlagBtnClassObj: function addFlagBtnClassObj() {\n return {\n 'mdi-plus-circle-outline': !this.is_creating_folder,\n 'mdi-loading': this.is_creating_folder,\n active: this.new_folder_name.length > 4 && !this.is_creating_folder,\n loading: this.is_creating_folder\n };\n },\n flagDeletingClassObj: function flagDeletingClassObj() {\n return {\n 'mdi-trash-can-outline': !this.is_deleting_folder,\n 'mdi-loading': this.is_deleting_folder,\n 'loading': this.is_deleting_folder\n };\n }\n }),\n methods: _objectSpread(_objectSpread({}, (0, _vuex.mapActions)({\n createFlagColl: 'User/createFlagColl',\n deleteFlagColl: 'User/deleteFlagColl',\n openFlagColl: 'User/openFlagColl'\n })), {}, {\n onCreateFlagColl: function onCreateFlagColl() {\n var _this = this;\n\n console.log(\"UserFlags onCreateFlagColl\", this.new_folder_name);\n this.is_creating_folder = true;\n this.createFlagColl(this.new_folder_name).then(function (data) {\n console.log(\"onCreateFlagColl then\", data);\n _this.new_folder_name = \"\";\n _this.is_creating_folder = false;\n });\n },\n onDeleteFlagColl: function onDeleteFlagColl(e) {\n var _this2 = this;\n\n var flagcollid = e.target.getAttribute('flagcollid');\n console.log(\"UserFlags onDeleteFlagColl\", flagcollid);\n this.is_deleting_folder = flagcollid;\n this.deleteFlagColl(flagcollid).then(function () {\n // console.log(\"onDeleteFlagColl then\", data);\n _this2.is_deleting_folder = false;\n });\n },\n onOpenFlagColl: function onOpenFlagColl(e) {\n var flagcollid = e.target.getAttribute('flagcollid');\n console.log(\"UserFlags onOpenFlagColl\", flagcollid);\n this.openFlagColl(flagcollid).then(function () {// console.log(\"onDeleteFlagColl then\", data);\n });\n }\n })\n};\nexports.default = _default;\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/User/UserFlags.vue?./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js??vue-loader-options"); +eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n}));\nexports.default = void 0;\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.common.js\");\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: \"userFlags\",\n data: function data() {\n return {\n new_folder_name: \"\",\n is_creating_folder: false,\n is_deleting_folder: false\n };\n },\n computed: _objectSpread(_objectSpread({}, (0, _vuex.mapState)({\n flagcolls: function flagcolls(state) {\n return state.User.flagcolls;\n }\n })), {}, {\n collsLength: function collsLength() {\n return Object.keys(this.flagcolls).length;\n },\n addFlagBtnClassObj: function addFlagBtnClassObj() {\n return {\n 'mdi-plus-circle-outline': !this.is_creating_folder,\n 'mdi-loading': this.is_creating_folder,\n active: this.new_folder_name.length > 4 && !this.is_creating_folder,\n loading: this.is_creating_folder\n };\n },\n flagDeletingClassObj: function flagDeletingClassObj() {\n return {\n 'mdi-trash-can-outline': !this.is_deleting_folder,\n 'mdi-loading': this.is_deleting_folder,\n 'loading': this.is_deleting_folder\n };\n }\n }),\n methods: _objectSpread(_objectSpread({}, (0, _vuex.mapActions)({\n createFlagColl: 'User/createFlagColl',\n deleteFlagColl: 'User/deleteFlagColl',\n openFlagColl: 'User/openFlagColl'\n })), {}, {\n onCreateFlagColl: function onCreateFlagColl() {\n var _this = this;\n\n console.log(\"UserFlags onCreateFlagColl\", this.new_folder_name);\n this.is_creating_folder = true;\n this.createFlagColl(this.new_folder_name).then(function (data) {\n console.log(\"onCreateFlagColl then\", data);\n _this.new_folder_name = \"\";\n _this.is_creating_folder = false;\n });\n },\n onDeleteFlagColl: function onDeleteFlagColl(e) {\n var _this2 = this;\n\n var flagcollid = e.target.getAttribute('flagcollid');\n console.log(\"UserFlags onDeleteFlagColl\", flagcollid);\n this.is_deleting_folder = flagcollid;\n this.deleteFlagColl(flagcollid).then(function () {\n // console.log(\"onDeleteFlagColl then\", data);\n _this2.is_deleting_folder = false;\n });\n },\n onOpenFlagColl: function onOpenFlagColl(e) {\n var flagcollid = e.target.getAttribute('flagcollid');\n console.log(\"UserFlags onOpenFlagColl\", flagcollid);\n this.openFlagColl(flagcollid).then(function () {// console.log(\"onDeleteFlagColl then\", data);\n });\n }\n })\n};\nexports.default = _default;\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/User/UserFlags.vue?./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js??vue-loader-options"); /***/ }), @@ -1082,7 +1082,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n})); /***/ ((__unused_webpack_module, exports, __webpack_require__) => { "use strict"; -eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n}));\nexports.default = void 0;\n\nvar _restAxios = __webpack_require__(/*! vuejs/api/rest-axios */ \"./web/themes/custom/materiotheme/vuejs/api/rest-axios.js\");\n\nvar _maAxios = __webpack_require__(/*! vuejs/api/ma-axios */ \"./web/themes/custom/materiotheme/vuejs/api/ma-axios.js\");\n\nvar _querystringEs = _interopRequireDefault(__webpack_require__(/*! querystring-es3 */ \"./node_modules/querystring-es3/index.js\"));\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\n// import { JSONAPI } from 'vuejs/api/json-axios'\nvar _default = {\n namespaced: true,\n // initial state\n state: {\n uid: null,\n // username: '',\n mail: '',\n csrf_token: null,\n logout_token: null,\n isloggedin: false,\n isAdmin: false,\n isAdherent: false,\n canSearch: false,\n roles: [],\n flagcolls: false,\n openedCollid: null\n },\n // getters\n getters: {},\n // mutations\n mutations: {\n SetCsrftoken: function SetCsrftoken(state, token) {\n console.log('SetCsrftoken', token);\n state.csrf_token = token;\n },\n setToken: function setToken(state, data) {\n state.uid = data.current_user.uid; // state.username = data.username;\n\n state.mail = data.current_user.mail;\n state.csrf_token = data.csrf_token;\n state.isloggedin = true;\n state.logout_token = data.logout_token;\n },\n setUid: function setUid(state, uid) {\n state.uid = uid;\n state.isloggedin = true;\n },\n setUser: function setUser(state, data) {\n state.mail = data.mail[0].value;\n state.uuid = data.uuid[0].value;\n },\n setRoles: function setRoles(state, roles) {\n console.log('User setRoles', roles);\n state.roles = [];\n\n for (var i = 0; i < roles.length; i++) {\n state.roles.push(roles[i].target_id);\n } // check if admin\n\n\n if (state.roles.indexOf('admin') !== -1 || state.roles.indexOf('root') !== -1) {\n // console.log('is admin');\n state.isAdmin = true;\n } // check if has access to search\n\n\n if (state.roles.indexOf('adherent') !== -1) {\n // console.log('is admin');\n state.canSearch = true;\n state.isAdherent = true;\n }\n },\n setLoggedOut: function setLoggedOut(state) {\n console.log('setLoggedOut state', state);\n state.uid = null;\n state.mail = '';\n state.csrf_token = null;\n state.isloggedin = false;\n state.logout_token = null;\n\n if (state.isAdmin) {\n // TODO: what if on a page where login is needed (as commerce checkout and cart)\n window.location.reload(true);\n }\n\n state.asAdmin = false;\n state.canSearch = false;\n },\n setFlagColls: function setFlagColls(state, flagcolls) {\n console.log('User setFlagColls', flagcolls);\n state.flagcolls = flagcolls;\n },\n openFlagColl: function openFlagColl(state, collid) {\n state.openedCollid = collid;\n },\n closeFlagColl: function closeFlagColl(state) {\n state.openedCollid = null;\n },\n setLoadedCollItems: function setLoadedCollItems(state, data) {\n console.log('setLoadedCollItems', data); // if no data, we are just calling the mutation to trigger the component update\n\n if (data) {\n state.flagcolls[data.collid].loadedItems = data.items;\n }\n }\n },\n // actions\n actions: {\n userRegister: function userRegister(_ref, credentials) {\n var dispatch = _ref.dispatch,\n commit = _ref.commit,\n state = _ref.state;\n return new Promise(function (resolve) {\n _restAxios.REST.get('/session/token').then(function (_ref2) {\n var token = _ref2.token;\n commit('SetCsrftoken', token);\n\n _restAxios.REST.post('/user/register?_format=json', credentials, {\n 'X-CSRF-Token': state.csrftoken\n }).then(function (_ref3) {\n var data = _ref3.data;\n console.log('user REST registered', data);\n dispatch('userLogin', credentials).then(function () {\n resolve();\n });\n }).catch(function (error) {\n console.warn('Issue with register', error);\n Promise.reject(error);\n });\n });\n });\n },\n userLogin: function userLogin(_ref4, credentials) {\n var dispatch = _ref4.dispatch,\n state = _ref4.state;\n return new Promise(function (resolve, reject) {\n dispatch('getToken', credentials).then(function () {\n dispatch('getUser').then(function (userdata) {\n console.log('User Loggedin');\n\n if (state.isAdmin) {\n window.location.reload(true);\n }\n\n resolve();\n });\n });\n });\n },\n getToken: function getToken(_ref5, credentials) {\n var dispatch = _ref5.dispatch,\n commit = _ref5.commit,\n state = _ref5.state;\n return _restAxios.REST.post('/user/login?_format=json', credentials).then(function (_ref6) {\n var data = _ref6.data;\n console.log('user REST getToken data', data);\n commit('setToken', data);\n }).catch(function (error) {\n console.warn('Issue with getToken', error);\n Promise.reject(error);\n });\n },\n getUser: function getUser(_ref7) {\n var dispatch = _ref7.dispatch,\n commit = _ref7.commit,\n state = _ref7.state;\n return new Promise(function (resolve, reject) {\n _restAxios.REST.get('/session/token').then(function (_ref8) {\n var data = _ref8.data;\n console.log('csrftoken', data);\n commit('SetCsrftoken', data);\n console.log('state.csrf_token', state.csrf_token);\n var params = {\n token: state.csrf_token\n };\n\n _restAxios.REST.get(\"/user/\".concat(state.uid, \"?_format=json\"), params).then(function (_ref9) {\n var data = _ref9.data;\n console.log('user REST getUser data', data);\n console.log('roles', data.roles);\n commit('setUser', data);\n\n if (data.roles) {\n commit('setRoles', data.roles);\n }\n\n dispatch('getUserFlagColls');\n resolve();\n }).catch(function (error) {\n console.warn('Issue with getUser', error);\n Promise.reject(error);\n });\n });\n });\n },\n getUserFlagColls: function getUserFlagColls(_ref10) {\n var dispatch = _ref10.dispatch,\n commit = _ref10.commit,\n state = _ref10.state;\n // flags\n // REST.get('/flagging_collection/1?_format=json')\n // .then(( data ) => {\n // console.log('TEST FLAG REST data', data)\n // })\n // .catch(error => {\n // console.warn('Issue USER TEST FLAG REST', error)\n // Promise.reject(error)\n // })\n return _maAxios.MA.get('materio_flag/user_flagging_collections').then(function (_ref11) {\n var data = _ref11.data;\n console.log('user MA getFlags data', data);\n commit('setFlagColls', data);\n }).catch(function (error) {\n console.warn('Issue USER MA getFlags', error);\n Promise.reject(error);\n });\n },\n // https://drupal.stackexchange.com/questions/248539/cant-get-flagging-api-to-accept-post-request\n createFlagColl: function createFlagColl(_ref12, new_collection_name) {\n var dispatch = _ref12.dispatch,\n commit = _ref12.commit,\n state = _ref12.state;\n console.log('user createFlagColl', new_collection_name);\n return new Promise(function (resolve, reject) {\n var params = {\n name: new_collection_name\n };\n\n _maAxios.MA.post('materio_flag/create_user_flagging_collection', params).then(function (_ref13) {\n var data = _ref13.data;\n console.log('user MA createFlagColl data', data);\n\n if (data.status) {\n dispatch('getUserFlagColls').then(function () {\n resolve();\n });\n }\n }).catch(function (error) {\n console.warn('Issue USER MA createFlag', error);\n reject(error);\n });\n });\n },\n deleteFlagColl: function deleteFlagColl(_ref14, flagcollid) {\n var dispatch = _ref14.dispatch,\n commit = _ref14.commit,\n state = _ref14.state;\n console.log('user deleteFlagColl', flagcollid);\n return new Promise(function (resolve, reject) {\n var params = {\n flagcollid: flagcollid\n };\n\n _maAxios.MA.post('materio_flag/delete_user_flagging_collection', params).then(function (_ref15) {\n var data = _ref15.data;\n console.log('user MA deleteFlagColl data', data);\n dispatch('getUserFlagColls').then(function () {\n resolve();\n });\n }).catch(function (error) {\n console.warn('Issue USER MA createFlag', error);\n reject(error);\n });\n });\n },\n flag: function flag(_ref16, args) {\n var dispatch = _ref16.dispatch,\n commit = _ref16.commit,\n state = _ref16.state;\n console.log('user flag', args.uuid, args.collid);\n return new Promise(function (resolve, reject) {\n var params = {\n flagid: state.flagcolls[args.collid].flag_id,\n uuid: args.uuid,\n flagcollid: args.collid\n };\n return _maAxios.MA.post('materio_flag/flag', params).then(function (_ref17) {\n var data = _ref17.data;\n console.log('user MA flag', data);\n dispatch('getUserFlagColls').then(function () {\n resolve();\n });\n }).catch(function (error) {\n console.warn('Issue USER MA flag', error);\n });\n });\n },\n unFlag: function unFlag(_ref18, args) {\n var dispatch = _ref18.dispatch,\n commit = _ref18.commit,\n state = _ref18.state;\n console.log('user unFlag', args.uuid, args.collid);\n return new Promise(function (resolve, reject) {\n var params = {\n flagid: state.flagcolls[args.collid].flag_id,\n uuid: args.uuid,\n flagcollid: args.collid\n };\n return _maAxios.MA.post('materio_flag/unflag', params).then(function (_ref19) {\n var data = _ref19.data;\n console.log('user MA unFlag', data);\n dispatch('getUserFlagColls').then(function () {\n resolve();\n });\n }).catch(function (error) {\n console.warn('Issue USER MA unFlag', error);\n });\n });\n },\n openFlagColl: function openFlagColl(_ref20, collid) {\n var commit = _ref20.commit,\n dispatch = _ref20.dispatch,\n state = _ref20.state;\n console.log('user openFlagColl', collid);\n commit('openFlagColl', collid);\n\n if (typeof state.flagcolls[collid].loadedItems === 'undefined') {\n // if no loadedItems, load them\n // loadMaterials is on mixins\n // https://github.com/huybuidac/vuex-extensions\n dispatch('loadMaterials', {\n uuids: state.flagcolls[collid].items_uuids,\n imgStyle: 'card_medium_half',\n callBack: 'loadMaterialsCallBack',\n callBackArgs: {\n collid: collid\n }\n });\n } else {\n // call the mutation without data to only trigger the FlagCollection component update\n commit('setLoadedCollItems');\n }\n },\n loadMaterialsCallBack: function loadMaterialsCallBack(_ref21, _ref22) {\n var commit = _ref21.commit;\n var items = _ref22.items,\n callBackArgs = _ref22.callBackArgs;\n console.log('user loadMaterialsCallBack', items);\n commit('setLoadedCollItems', {\n collid: callBackArgs.collid,\n items: items\n });\n },\n closeFlagColl: function closeFlagColl(_ref23) {\n var commit = _ref23.commit,\n dispatch = _ref23.dispatch;\n console.log('user closeFlagColl');\n commit('closeFlagColl');\n },\n userLogout: function userLogout(_ref24) {\n var commit = _ref24.commit,\n state = _ref24.state;\n\n var credentials = _querystringEs.default.stringify({\n token: state.csrf_token\n });\n\n _restAxios.REST.post('/user/logout', credentials).then(function (resp) {\n console.log('userLogout resp', resp);\n commit('setLoggedOut');\n }).catch(function (error) {\n console.warn('Issue with logout', error);\n Promise.reject(error);\n });\n }\n }\n};\nexports.default = _default;\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/store/modules/user.js?"); +eval("\n\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n}));\nexports.default = void 0;\n\nvar _restAxios = __webpack_require__(/*! vuejs/api/rest-axios */ \"./web/themes/custom/materiotheme/vuejs/api/rest-axios.js\");\n\nvar _maAxios = __webpack_require__(/*! vuejs/api/ma-axios */ \"./web/themes/custom/materiotheme/vuejs/api/ma-axios.js\");\n\nvar _querystringEs = _interopRequireDefault(__webpack_require__(/*! querystring-es3 */ \"./node_modules/querystring-es3/index.js\"));\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\n// import { JSONAPI } from 'vuejs/api/json-axios'\nvar _default = {\n namespaced: true,\n // initial state\n state: {\n uid: null,\n // username: '',\n mail: '',\n csrf_token: null,\n logout_token: null,\n isloggedin: false,\n isAdmin: false,\n isAdherent: false,\n canSearch: false,\n roles: [],\n flagcolls: false,\n flagcollsLoadedItems: {},\n openedCollid: null\n },\n // getters\n getters: {},\n // mutations\n mutations: {\n SetCsrftoken: function SetCsrftoken(state, token) {\n console.log('SetCsrftoken', token);\n state.csrf_token = token;\n },\n setToken: function setToken(state, data) {\n state.uid = data.current_user.uid; // state.username = data.username;\n\n state.mail = data.current_user.mail;\n state.csrf_token = data.csrf_token;\n state.isloggedin = true;\n state.logout_token = data.logout_token;\n },\n setUid: function setUid(state, uid) {\n state.uid = uid;\n state.isloggedin = true;\n },\n setUser: function setUser(state, data) {\n state.mail = data.mail[0].value;\n state.uuid = data.uuid[0].value;\n },\n setRoles: function setRoles(state, roles) {\n console.log('User setRoles', roles);\n state.roles = [];\n\n for (var i = 0; i < roles.length; i++) {\n state.roles.push(roles[i].target_id);\n } // check if admin\n\n\n if (state.roles.indexOf('admin') !== -1 || state.roles.indexOf('root') !== -1) {\n // console.log('is admin');\n state.isAdmin = true;\n } // check if has access to search\n\n\n if (state.roles.indexOf('adherent') !== -1) {\n // console.log('is admin');\n state.canSearch = true;\n state.isAdherent = true;\n }\n },\n setLoggedOut: function setLoggedOut(state) {\n console.log('setLoggedOut state', state);\n state.uid = null;\n state.mail = '';\n state.csrf_token = null;\n state.isloggedin = false;\n state.logout_token = null;\n\n if (state.isAdmin) {\n // TODO: what if on a page where login is needed (as commerce checkout and cart)\n window.location.reload(true);\n }\n\n state.asAdmin = false;\n state.canSearch = false;\n },\n setFlagColls: function setFlagColls(state, flagcolls) {\n console.log('User pre setFlagColls', state.flagcolls);\n state.flagcolls = flagcolls; // console.log('User post setFlagColls', state.flagcolls)\n },\n openFlagColl: function openFlagColl(state, collid) {\n state.openedCollid = collid;\n },\n closeFlagColl: function closeFlagColl(state) {\n state.openedCollid = null;\n },\n setLoadedCollItems: function setLoadedCollItems(state, data) {\n console.log('setLoadedCollItems', data); // if no data, we are just calling the mutation to trigger the component update\n\n if (data) {\n state.flagcollsLoadedItems[data.collid] = data.items;\n }\n }\n },\n // actions\n actions: {\n userRegister: function userRegister(_ref, credentials) {\n var dispatch = _ref.dispatch,\n commit = _ref.commit,\n state = _ref.state;\n return new Promise(function (resolve) {\n _restAxios.REST.get('/session/token').then(function (_ref2) {\n var token = _ref2.token;\n commit('SetCsrftoken', token);\n\n _restAxios.REST.post('/user/register?_format=json', credentials, {\n 'X-CSRF-Token': state.csrftoken\n }).then(function (_ref3) {\n var data = _ref3.data;\n console.log('user REST registered', data);\n dispatch('userLogin', credentials).then(function () {\n resolve();\n });\n }).catch(function (error) {\n console.warn('Issue with register', error);\n Promise.reject(error);\n });\n });\n });\n },\n userLogin: function userLogin(_ref4, credentials) {\n var dispatch = _ref4.dispatch,\n state = _ref4.state;\n return new Promise(function (resolve, reject) {\n dispatch('getToken', credentials).then(function () {\n dispatch('getUser').then(function (userdata) {\n console.log('User Loggedin');\n\n if (state.isAdmin) {\n window.location.reload(true);\n }\n\n resolve();\n });\n });\n });\n },\n getToken: function getToken(_ref5, credentials) {\n var dispatch = _ref5.dispatch,\n commit = _ref5.commit,\n state = _ref5.state;\n return _restAxios.REST.post('/user/login?_format=json', credentials).then(function (_ref6) {\n var data = _ref6.data;\n console.log('user REST getToken data', data);\n commit('setToken', data);\n }).catch(function (error) {\n console.warn('Issue with getToken', error);\n Promise.reject(error);\n });\n },\n getUser: function getUser(_ref7) {\n var dispatch = _ref7.dispatch,\n commit = _ref7.commit,\n state = _ref7.state;\n return new Promise(function (resolve, reject) {\n _restAxios.REST.get('/session/token').then(function (_ref8) {\n var data = _ref8.data;\n console.log('csrftoken', data);\n commit('SetCsrftoken', data);\n console.log('state.csrf_token', state.csrf_token);\n var params = {\n token: state.csrf_token\n };\n\n _restAxios.REST.get(\"/user/\".concat(state.uid, \"?_format=json\"), params).then(function (_ref9) {\n var data = _ref9.data;\n console.log('user REST getUser data', data);\n console.log('roles', data.roles);\n commit('setUser', data);\n\n if (data.roles) {\n commit('setRoles', data.roles);\n }\n\n dispatch('getUserFlagColls');\n resolve();\n }).catch(function (error) {\n console.warn('Issue with getUser', error);\n Promise.reject(error);\n });\n });\n });\n },\n getUserFlagColls: function getUserFlagColls(_ref10) {\n var dispatch = _ref10.dispatch,\n commit = _ref10.commit,\n state = _ref10.state;\n // flags\n // REST.get('/flagging_collection/1?_format=json')\n // .then(( data ) => {\n // console.log('TEST FLAG REST data', data)\n // })\n // .catch(error => {\n // console.warn('Issue USER TEST FLAG REST', error)\n // Promise.reject(error)\n // })\n return _maAxios.MA.get('materio_flag/user_flagging_collections').then(function (_ref11) {\n var data = _ref11.data;\n console.log('user MA getFlags data', data);\n commit('setFlagColls', data);\n }).catch(function (error) {\n console.warn('Issue USER MA getFlags', error);\n Promise.reject(error);\n });\n },\n // https://drupal.stackexchange.com/questions/248539/cant-get-flagging-api-to-accept-post-request\n createFlagColl: function createFlagColl(_ref12, new_collection_name) {\n var dispatch = _ref12.dispatch,\n commit = _ref12.commit,\n state = _ref12.state;\n console.log('user createFlagColl', new_collection_name);\n return new Promise(function (resolve, reject) {\n var params = {\n name: new_collection_name\n };\n\n _maAxios.MA.post('materio_flag/create_user_flagging_collection', params).then(function (_ref13) {\n var data = _ref13.data;\n console.log('user MA createFlagColl data', data);\n\n if (data.status) {\n dispatch('getUserFlagColls').then(function () {\n resolve();\n });\n }\n }).catch(function (error) {\n console.warn('Issue USER MA createFlag', error);\n reject(error);\n });\n });\n },\n deleteFlagColl: function deleteFlagColl(_ref14, flagcollid) {\n var dispatch = _ref14.dispatch,\n commit = _ref14.commit,\n state = _ref14.state;\n console.log('user deleteFlagColl', flagcollid);\n return new Promise(function (resolve, reject) {\n var params = {\n flagcollid: flagcollid\n };\n\n _maAxios.MA.post('materio_flag/delete_user_flagging_collection', params).then(function (_ref15) {\n var data = _ref15.data;\n console.log('user MA deleteFlagColl data', data);\n dispatch('getUserFlagColls').then(function () {\n resolve();\n });\n }).catch(function (error) {\n console.warn('Issue USER MA createFlag', error);\n reject(error);\n });\n });\n },\n flagUnflag: function flagUnflag(_ref16, _ref17) {\n var dispatch = _ref16.dispatch,\n commit = _ref16.commit,\n state = _ref16.state;\n var action = _ref17.action,\n uuid = _ref17.uuid,\n collid = _ref17.collid;\n console.log('user flagUnflag', action, uuid, collid);\n return new Promise(function (resolve, reject) {\n var params = {\n flagid: state.flagcolls[collid].flag_id,\n uuid: uuid,\n flagcollid: collid\n };\n return _maAxios.MA.post(\"materio_flag/\".concat(action), params).then(function (_ref18) {\n var data = _ref18.data;\n console.log('user MA flag', data); // reload the fulllist of flagcolleciton\n\n dispatch('getUserFlagColls').then(function () {\n if (state.flagcolls[collid].items_uuids.length) {\n dispatch('loadMaterials', {\n uuids: state.flagcolls[collid].items_uuids,\n imgStyle: 'card_medium_half',\n callBack: 'loadMaterialsCallBack',\n callBackArgs: {\n collid: collid\n }\n }).then(function () {\n resolve();\n });\n } else {\n commit('setLoadedCollItems', {\n collid: collid,\n items: []\n });\n resolve();\n }\n });\n }).catch(function (error) {\n console.warn('Issue USER MA flagUnflag', error);\n });\n });\n },\n openFlagColl: function openFlagColl(_ref19, collid) {\n var commit = _ref19.commit,\n dispatch = _ref19.dispatch,\n state = _ref19.state;\n console.log('user openFlagColl', collid);\n commit('openFlagColl', collid);\n\n if (state.flagcolls[collid].items_uuids.length) {\n if (typeof state.flagcollsLoadedItems[collid] === 'undefined') {\n console.log('loading flagcoll items'); // if no loadedItems, load them\n // loadMaterials is on mixins\n // https://github.com/huybuidac/vuex-extensions\n\n dispatch('loadMaterials', {\n uuids: state.flagcolls[collid].items_uuids,\n imgStyle: 'card_medium_half',\n callBack: 'loadMaterialsCallBack',\n callBackArgs: {\n collid: collid\n }\n });\n } else {\n // call the mutation without data to only trigger the FlagCollection component update\n console.log('committing setLoadedCollItems without args');\n commit('setLoadedCollItems');\n }\n } else {\n commit('setLoadedCollItems', {\n collid: collid,\n items: []\n });\n }\n },\n loadMaterialsCallBack: function loadMaterialsCallBack(_ref20, _ref21) {\n var commit = _ref20.commit;\n var items = _ref21.items,\n callBackArgs = _ref21.callBackArgs;\n console.log('user loadMaterialsCallBack', items, callBackArgs);\n commit('setLoadedCollItems', {\n collid: callBackArgs.collid,\n items: items\n });\n },\n closeFlagColl: function closeFlagColl(_ref22) {\n var commit = _ref22.commit,\n dispatch = _ref22.dispatch;\n console.log('user closeFlagColl');\n commit('closeFlagColl');\n },\n userLogout: function userLogout(_ref23) {\n var commit = _ref23.commit,\n state = _ref23.state;\n\n var credentials = _querystringEs.default.stringify({\n token: state.csrf_token\n });\n\n _restAxios.REST.post('/user/logout', credentials).then(function (resp) {\n console.log('userLogout resp', resp);\n commit('setLoggedOut');\n }).catch(function (error) {\n console.warn('Issue with logout', error);\n Promise.reject(error);\n });\n }\n }\n};\nexports.default = _default;\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/store/modules/user.js?"); /***/ }), @@ -2400,7 +2400,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"render\": () => /* binding */ render,\n/* harmony export */ \"staticRenderFns\": () => /* binding */ staticRenderFns\n/* harmony export */ });\nvar render = function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n return _c(\"article\", { staticClass: \"card search-card\" }, [\n _c(\"header\", [\n _c(\"h1\", [_vm._v(_vm._s(_vm.item.title))]),\n _vm._v(\" \"),\n _c(\"h4\", [_vm._v(_vm._s(_vm.item.field_short_description))]),\n _vm._v(\" \"),\n _c(\"span\", { staticClass: \"ref\" }, [\n _vm._v(_vm._s(_vm.item.field_reference))\n ])\n ]),\n _vm._v(\" \"),\n _c(\"nav\", { staticClass: \"tools\" }, [\n _c(\"section\", { staticClass: \"tool flags\" }, [\n _c(\"span\", { staticClass: \"btn mdi mdi-folder-outline\" }),\n _vm._v(\" \"),\n _c(\"div\", { staticClass: \"tool-content\" }, [\n _c(\n \"ul\",\n _vm._l(_vm.flagcolls, function(coll) {\n return _vm.flagcolls\n ? _c(\"li\", { key: coll.id }, [\n _c(\n \"span\",\n {\n staticClass: \"flag mdi\",\n class: [\n _vm.flagIsLoading(coll.id)\n ? \"mdi-loading mdi-spin\"\n : _vm.flagIsActive(coll.id)\n ? \"mdi-close isActive\"\n : \"mdi-plus\"\n ],\n attrs: { collid: coll.id },\n on: {\n click: function($event) {\n $event.preventDefault()\n return _vm.onFlagActionCard($event)\n }\n }\n },\n [\n _vm._v(\n \"\\n \" +\n _vm._s(coll.name) +\n \"\\n \"\n )\n ]\n )\n ])\n : _vm._e()\n }),\n 0\n )\n ])\n ])\n ]),\n _vm._v(\" \"),\n _c(\n \"section\",\n {\n directives: [{ name: \"switcher\", rawName: \"v-switcher\" }],\n staticClass: \"images\"\n },\n _vm._l(_vm.item.images, function(img, index) {\n return _c(\"figure\", { key: img.url }, [\n _c(\"img\", {\n directives: [\n {\n name: \"lazy\",\n rawName: \"v-lazy\",\n value: index,\n expression: \"index\"\n }\n ],\n staticClass: \"lazy\",\n attrs: { \"data-src\": img.url, title: img.title }\n }),\n _vm._v(\" \"),\n _c(\"img\", { staticClass: \"blank\", attrs: { src: _vm.blanksrc } })\n ])\n }),\n 0\n )\n ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib/index.js??vue-loader-options"); +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"render\": () => /* binding */ render,\n/* harmony export */ \"staticRenderFns\": () => /* binding */ staticRenderFns\n/* harmony export */ });\nvar render = function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n return _c(\"article\", { staticClass: \"card search-card\" }, [\n _c(\"header\", [\n _c(\"h1\", [_vm._v(_vm._s(_vm.item.title))]),\n _vm._v(\" \"),\n _c(\"h4\", [_vm._v(_vm._s(_vm.item.field_short_description))]),\n _vm._v(\" \"),\n _c(\"span\", { staticClass: \"ref\" }, [\n _vm._v(_vm._s(_vm.item.field_reference))\n ])\n ]),\n _vm._v(\" \"),\n _c(\"nav\", { staticClass: \"tools\" }, [\n _c(\"section\", { staticClass: \"tool flags\" }, [\n _c(\"span\", { staticClass: \"btn mdi mdi-folder-outline\" }),\n _vm._v(\" \"),\n _c(\"div\", { staticClass: \"tool-content\" }, [\n _c(\n \"ul\",\n _vm._l(_vm.flagcolls, function(coll) {\n return _vm.flagcolls\n ? _c(\"li\", { key: coll.id }, [\n _c(\n \"span\",\n {\n staticClass: \"flag mdi\",\n class: [\n _vm.flagIsLoading(coll.id)\n ? \"mdi-loading mdi-spin\"\n : _vm.flagIsActive(coll.id)\n ? \"mdi-close-circle isActive\"\n : \"mdi-plus\"\n ],\n attrs: { collid: coll.id },\n on: {\n click: function($event) {\n $event.preventDefault()\n return _vm.onFlagActionCard($event)\n }\n }\n },\n [\n _vm._v(\n \"\\n \" +\n _vm._s(coll.name) +\n \"\\n \"\n )\n ]\n )\n ])\n : _vm._e()\n }),\n 0\n )\n ])\n ])\n ]),\n _vm._v(\" \"),\n _c(\n \"section\",\n {\n directives: [{ name: \"switcher\", rawName: \"v-switcher\" }],\n staticClass: \"images\"\n },\n _vm._l(_vm.item.images, function(img, index) {\n return _c(\"figure\", { key: img.url }, [\n _c(\"img\", {\n directives: [\n {\n name: \"lazy\",\n rawName: \"v-lazy\",\n value: index,\n expression: \"index\"\n }\n ],\n staticClass: \"lazy\",\n attrs: { \"data-src\": img.url, title: img.title }\n }),\n _vm._v(\" \"),\n _c(\"img\", { staticClass: \"blank\", attrs: { src: _vm.blanksrc } })\n ])\n }),\n 0\n )\n ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib/index.js??vue-loader-options"); /***/ }), @@ -2448,7 +2448,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"render\": () => /* binding */ render,\n/* harmony export */ \"staticRenderFns\": () => /* binding */ staticRenderFns\n/* harmony export */ });\nvar render = function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n return _c(\"article\", { staticClass: \"card minicard\" }, [\n _c(\"header\", [\n _c(\"h1\", [_vm._v(_vm._s(_vm.item.title))]),\n _vm._v(\" \"),\n _c(\"span\", { staticClass: \"ref\" }, [\n _vm._v(_vm._s(_vm.item.field_reference))\n ])\n ]),\n _vm._v(\" \"),\n _vm._m(0),\n _vm._v(\" \"),\n _c(\n \"section\",\n {\n directives: [{ name: \"switcher\", rawName: \"v-switcher\" }],\n staticClass: \"images\"\n },\n _vm._l(_vm.item.images, function(img, index) {\n return _c(\"figure\", { key: img.url }, [\n _c(\"img\", {\n directives: [\n {\n name: \"lazy\",\n rawName: \"v-lazy\",\n value: index,\n expression: \"index\"\n }\n ],\n staticClass: \"lazy\",\n attrs: { \"data-src\": img.url, title: img.title }\n }),\n _vm._v(\" \"),\n _c(\"img\", { staticClass: \"blank\", attrs: { src: _vm.blanksrc } })\n ])\n }),\n 0\n )\n ])\n}\nvar staticRenderFns = [\n function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n return _c(\"nav\", { staticClass: \"tools\" }, [\n _c(\"section\", { staticClass: \"tool flags\" }, [\n _c(\"span\", { staticClass: \"mdi mdi-folder-remove-outline\" })\n ])\n ])\n }\n]\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/Content/MiniCard.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib/index.js??vue-loader-options"); +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"render\": () => /* binding */ render,\n/* harmony export */ \"staticRenderFns\": () => /* binding */ staticRenderFns\n/* harmony export */ });\nvar render = function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n return _c(\"article\", { staticClass: \"card minicard\" }, [\n _c(\"header\", [\n _c(\"h1\", [_vm._v(_vm._s(_vm.item.title))]),\n _vm._v(\" \"),\n _c(\"span\", { staticClass: \"ref\" }, [\n _vm._v(_vm._s(_vm.item.field_reference))\n ])\n ]),\n _vm._v(\" \"),\n _c(\"nav\", { staticClass: \"tools\" }, [\n _c(\"section\", { staticClass: \"tool flags\" }, [\n _c(\"span\", {\n staticClass: \"mdi unflag\",\n class: [\n _vm.itemIsLoading() ? \"mdi-loading mdi-spin\" : \"mdi-folder-remove\"\n ],\n on: {\n click: function($event) {\n $event.preventDefault()\n return _vm.onUnFlagCard($event)\n }\n }\n })\n ])\n ]),\n _vm._v(\" \"),\n _c(\n \"section\",\n {\n directives: [{ name: \"switcher\", rawName: \"v-switcher\" }],\n staticClass: \"images\"\n },\n _vm._l(_vm.item.images, function(img, index) {\n return _c(\"figure\", { key: img.url }, [\n _c(\"img\", {\n directives: [\n {\n name: \"lazy\",\n rawName: \"v-lazy\",\n value: index,\n expression: \"index\"\n }\n ],\n staticClass: \"lazy\",\n attrs: { \"data-src\": img.url, title: img.title }\n }),\n _vm._v(\" \"),\n _c(\"img\", { staticClass: \"blank\", attrs: { src: _vm.blanksrc } })\n ])\n }),\n 0\n )\n ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/Content/MiniCard.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib/index.js??vue-loader-options"); /***/ }), @@ -2608,7 +2608,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"render\": () => /* binding */ render,\n/* harmony export */ \"staticRenderFns\": () => /* binding */ staticRenderFns\n/* harmony export */ });\nvar render = function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n return _c(\"section\", { staticClass: \"flag-collection\" }, [\n _c(\"header\", [\n _c(\"h3\", { staticClass: \"mdi mdi-folder-outline\" }, [\n _vm._v(_vm._s(_vm.collection.name))\n ]),\n _vm._v(\" \"),\n _c(\"span\", {\n staticClass: \"mdi mdi-close\",\n attrs: { title: \"close\" },\n on: {\n click: function($event) {\n $event.preventDefault()\n return _vm.onCloseFlagColl($event)\n }\n }\n })\n ]),\n _vm._v(\" \"),\n _vm.loadedItems\n ? _c(\n \"ul\",\n _vm._l(_vm.loadedItems, function(item) {\n return _c(\n \"li\",\n { key: item.id },\n [_c(\"MiniCard\", { attrs: { item: item } })],\n 1\n )\n }),\n 0\n )\n : _c(\"span\", { staticClass: \"loading\" }, [_vm._v(\"Loading\")])\n ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/User/FlagCollection.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib/index.js??vue-loader-options"); +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"render\": () => /* binding */ render,\n/* harmony export */ \"staticRenderFns\": () => /* binding */ staticRenderFns\n/* harmony export */ });\nvar render = function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n return _c(\"section\", { staticClass: \"flag-collection\" }, [\n _c(\"header\", [\n _c(\"h3\", { staticClass: \"mdi mdi-folder-outline\" }, [\n _vm._v(_vm._s(_vm.collection.name))\n ]),\n _vm._v(\" \"),\n _c(\"span\", {\n staticClass: \"mdi mdi-close\",\n attrs: { title: \"close\" },\n on: {\n click: function($event) {\n $event.preventDefault()\n return _vm.onCloseFlagColl($event)\n }\n }\n })\n ]),\n _vm._v(\" \"),\n _vm.loadedItems\n ? _c(\n \"ul\",\n [\n _vm._l(_vm.loadedItems, function(item) {\n return _c(\n \"li\",\n { key: item.id },\n [\n _c(\"MiniCard\", {\n attrs: { item: item, collid: _vm.collection.id }\n })\n ],\n 1\n )\n }),\n _vm._v(\" \"),\n _vm.loadedItems.length === 0\n ? _c(\"span\", [_vm._v(\"No items in your folder\")])\n : _vm._e()\n ],\n 2\n )\n : _c(\"span\", { staticClass: \"loading\" }, [_vm._v(\"Loading\")])\n ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/User/FlagCollection.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib/index.js??vue-loader-options"); /***/ }), @@ -2624,7 +2624,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"render\": () => /* binding */ render,\n/* harmony export */ \"staticRenderFns\": () => /* binding */ staticRenderFns\n/* harmony export */ });\nvar render = function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n return _c(\"div\", { attrs: { id: \"user-flags\" } }, [\n _c(\"h2\", { staticClass: \"mdi mdi-folder-outline\" }, [_vm._v(\"My folders\")]),\n _vm._v(\" \"),\n _c(\n \"ul\",\n [\n _vm._l(_vm.flagcolls, function(coll) {\n return _vm.flagcolls\n ? _c(\"li\", { key: coll.id }, [\n _c(\n \"h5\",\n {\n attrs: { flagcollid: coll.id },\n on: {\n click: function($event) {\n $event.preventDefault()\n return _vm.onOpenFlagColl($event)\n }\n }\n },\n [\n _vm._v(\n _vm._s(coll.name) + \" (\" + _vm._s(coll.items.length) + \")\"\n )\n ]\n ),\n _vm._v(\" \"),\n _c(\"div\", { staticClass: \"actions\" }, [\n _c(\"span\", {\n staticClass: \"delete-btn mdi\",\n class: _vm.flagDeletingClassObj,\n attrs: { flagcollid: coll.id },\n on: {\n click: function($event) {\n $event.preventDefault()\n return _vm.onDeleteFlagColl($event)\n }\n }\n })\n ])\n ])\n : _vm._e()\n }),\n _vm._v(\" \"),\n _c(\"li\", { staticClass: \"create-flag\" }, [\n _c(\"input\", {\n directives: [\n {\n name: \"model\",\n rawName: \"v-model\",\n value: _vm.new_folder_name,\n expression: \"new_folder_name\"\n }\n ],\n attrs: { placeholder: \"new folder\" },\n domProps: { value: _vm.new_folder_name },\n on: {\n input: function($event) {\n if ($event.target.composing) {\n return\n }\n _vm.new_folder_name = $event.target.value\n }\n }\n }),\n _vm._v(\" \"),\n _c(\"span\", {\n staticClass: \"add-btn mdi\",\n class: _vm.addFlagBtnClassObj,\n on: {\n click: function($event) {\n $event.preventDefault()\n $event.stopPropagation()\n return _vm.onCreateFlagColl($event)\n }\n }\n })\n ])\n ],\n 2\n )\n ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/User/UserFlags.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib/index.js??vue-loader-options"); +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"render\": () => /* binding */ render,\n/* harmony export */ \"staticRenderFns\": () => /* binding */ staticRenderFns\n/* harmony export */ });\nvar render = function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n return _c(\"div\", { attrs: { id: \"user-flags\" } }, [\n _c(\"h2\", { staticClass: \"mdi mdi-folder-outline\" }, [\n _vm._v(\"My folders (\" + _vm._s(_vm.collsLength) + \")\")\n ]),\n _vm._v(\" \"),\n _c(\n \"ul\",\n [\n _vm._l(_vm.flagcolls, function(coll) {\n return _vm.flagcolls\n ? _c(\"li\", { key: coll.id }, [\n _c(\n \"h5\",\n {\n attrs: { flagcollid: coll.id },\n on: {\n click: function($event) {\n $event.preventDefault()\n return _vm.onOpenFlagColl($event)\n }\n }\n },\n [\n _vm._v(\n _vm._s(coll.name) + \" (\" + _vm._s(coll.items.length) + \")\"\n )\n ]\n ),\n _vm._v(\" \"),\n _c(\"div\", { staticClass: \"actions\" }, [\n _c(\"span\", {\n staticClass: \"delete-btn mdi\",\n class: _vm.flagDeletingClassObj,\n attrs: { flagcollid: coll.id },\n on: {\n click: function($event) {\n $event.preventDefault()\n return _vm.onDeleteFlagColl($event)\n }\n }\n })\n ])\n ])\n : _vm._e()\n }),\n _vm._v(\" \"),\n _vm.collsLength < 15\n ? _c(\"li\", { staticClass: \"create-flag\" }, [\n _c(\"input\", {\n directives: [\n {\n name: \"model\",\n rawName: \"v-model\",\n value: _vm.new_folder_name,\n expression: \"new_folder_name\"\n }\n ],\n attrs: { placeholder: \"new folder\" },\n domProps: { value: _vm.new_folder_name },\n on: {\n keyup: function($event) {\n if (\n !$event.type.indexOf(\"key\") &&\n _vm._k($event.keyCode, \"enter\", 13, $event.key, \"Enter\")\n ) {\n return null\n }\n $event.preventDefault()\n $event.stopPropagation()\n return _vm.onCreateFlagColl($event)\n },\n input: function($event) {\n if ($event.target.composing) {\n return\n }\n _vm.new_folder_name = $event.target.value\n }\n }\n }),\n _vm._v(\" \"),\n _c(\"span\", {\n staticClass: \"add-btn mdi\",\n class: _vm.addFlagBtnClassObj,\n on: {\n click: function($event) {\n $event.preventDefault()\n $event.stopPropagation()\n return _vm.onCreateFlagColl($event)\n }\n }\n })\n ])\n : _vm._e()\n ],\n 2\n )\n ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack://materio.com/./web/themes/custom/materiotheme/vuejs/components/User/UserFlags.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib/index.js??vue-loader-options"); /***/ }), diff --git a/web/themes/custom/materiotheme/assets/styles/base/_layout.scss b/web/themes/custom/materiotheme/assets/styles/base/_layout.scss index 9d0578e..876d1d3 100644 --- a/web/themes/custom/materiotheme/assets/styles/base/_layout.scss +++ b/web/themes/custom/materiotheme/assets/styles/base/_layout.scss @@ -102,11 +102,13 @@ main[role="main"]{ display: flex; flex-direction: row-reverse; #content-left{ - flex-basis: $column_width+$column_goutiere; + flex-basis: $column_width; flex-shrink: 0; // width:$column_width*2+$column_goutiere; >*{ width:100%; + box-sizing: border-box; + padding:0.5em $column_goutiere; } } #content-center{ diff --git a/web/themes/custom/materiotheme/assets/styles/base/_variables.scss b/web/themes/custom/materiotheme/assets/styles/base/_variables.scss index 0f14d8b..809d7ab 100644 --- a/web/themes/custom/materiotheme/assets/styles/base/_variables.scss +++ b/web/themes/custom/materiotheme/assets/styles/base/_variables.scss @@ -9,3 +9,6 @@ $column_width: 205px; $column_goutiere: 13px; $card_height: 295px; + +$minicard_width: 170px; +$minicard_height: 100px; diff --git a/web/themes/custom/materiotheme/assets/styles/main.scss b/web/themes/custom/materiotheme/assets/styles/main.scss index 2ee8424..e3c9a1e 100644 --- a/web/themes/custom/materiotheme/assets/styles/main.scss +++ b/web/themes/custom/materiotheme/assets/styles/main.scss @@ -164,11 +164,12 @@ header[role="banner"]{ right:0; top:1.7em; box-sizing: content-box; + z-index: 30; } &:hover{ ul{ transition-delay: 0s; - max-height:12em; + max-height:50em; padding:1em 1em; box-shadow: 0 0 10px #ccc; } @@ -415,6 +416,7 @@ aside.messages{ display: flex; flex-direction: row; justify-content: space-between; + padding-bottom: $column_goutiere; h3{ // flex-basis: calc(100% - 1em); } @@ -430,8 +432,9 @@ aside.messages{ margin:0 0 $column_goutiere 0; padding:0; article.card.minicard{ - width:100%; - + width:$minicard_width; + height:$minicard_height; + margin:auto; >header{ padding: 0.3em 0.3em 0.1em; h1{ @@ -439,7 +442,13 @@ aside.messages{ } } >nav.tools{ + top: auto; + bottom: 0; padding:0 0.2em; + background:transparent; + .mdi.unflag{ + cursor: pointer; + } } } } @@ -752,7 +761,8 @@ article.card{ top: 0; right: 0; z-index: 21; - width: 1em; + $toolbar_width: 15px; + width: $toolbar_width; background-color: #fff; box-sizing: content-box; padding: 0.3em 0.1em; @@ -767,14 +777,36 @@ article.card{ position: absolute; top: 0px; right: 100%; - width: 5em; - box-sizing: content-box; + // width: 5em; + width: $column_width - $toolbar_width - 10px; + box-sizing: border-box; padding: 0.3em; background-color: #fff; box-shadow: -2px 3px 4px rgba(0, 0, 0, 0.2); + opacity: 0; + max-height: 0; max-width:0; + overflow: hidden; + transition: all 0.2s ease-in-out; + } + &:hover{ + .tool-content{ + transition: all 0.3s ease-in-out; + opacity: 1; + max-height: 195px; + max-width:200px; + } } } .tool.flags{ + .tool-content{ + ul{ + display: flex; + flex-flow: row wrap; + li{ + padding:0 0.5em 0 0; + } + } + } span.flag{ cursor: pointer; font-size: 0.756em; @@ -785,6 +817,13 @@ article.card{ } } } + opacity: 0; + transition: opacity 0.2s ease-in-out; + } + &:hover{ + nav.tools{ + opacity:1; + } } section.images{ position: relative; diff --git a/web/themes/custom/materiotheme/vuejs/components/Content/Card.vue b/web/themes/custom/materiotheme/vuejs/components/Content/Card.vue index 86ba3e7..83c3de0 100644 --- a/web/themes/custom/materiotheme/vuejs/components/Content/Card.vue +++ b/web/themes/custom/materiotheme/vuejs/components/Content/Card.vue @@ -14,7 +14,7 @@ { - console.log("onFlagActionCard then", data); - this.loadingFlag = false; - }) - }else{ - this.flag({uuid: this.item.uuid, collid: collid}) - .then(data => { - console.log("onFlagActionCard then", data); - this.loadingFlag = false; - }) - } + this.flagUnflag({ action: action, uuid: this.item.uuid, collid: collid}) + .then(data => { + console.log("onFlagActionCard then", data); + this.loadingFlag = false; + }) } } } diff --git a/web/themes/custom/materiotheme/vuejs/components/Content/MiniCard.vue b/web/themes/custom/materiotheme/vuejs/components/Content/MiniCard.vue index 6200d2a..5f10fd5 100644 --- a/web/themes/custom/materiotheme/vuejs/components/Content/MiniCard.vue +++ b/web/themes/custom/materiotheme/vuejs/components/Content/MiniCard.vue @@ -6,7 +6,13 @@
@@ -32,57 +38,38 @@ import cardMixins from 'vuejs/components/cardMixins' export default { name: "MiniCard", - props: ['item'], + props: ['item', 'collid'], mixins: [cardMixins], data() { return { blanksrc:`${drupalSettings.path.themePath}/assets/img/blank.gif`, - // loadingFlag: false + loadingItem: false } }, computed: { - // ...mapState({ - // flagcolls: state => state.User.flagcolls - // }) }, methods: { - // ...mapActions({ - // flag: 'User/flag', - // unFlag: 'User/unFlag' - // }), - // flagIsActive(collid) { - // // console.log(this.item.uuid); - // // console.log(this.flagcolls[collid].items_uuids); - // return this.flagcolls[collid].items_uuids.indexOf(this.item.uuid) !== -1; - // }, - // flagIsLoading(collid) { - // // console.log(this.item.uuid); - // // console.log(this.flagcolls[collid].items_uuids); - // return collid === this.loadingFlag; - // }, - // onFlagActionCard (e) { - // console.log("Card onFlagActionCard", e); - // if (!this.loadingFlag) { - // let collid = e.target.getAttribute('collid'); - // let isActive = this.flagIsActive(collid); - // // console.log('collid', collid); - // // console.log("this.item", this.item); - // this.loadingFlag = collid; - // if (isActive) { - // this.unFlag({uuid: this.item.uuid, collid: collid}) - // .then(data => { - // console.log("onFlagActionCard then", data); - // this.loadingFlag = false; - // }) - // }else{ - // this.flag({uuid: this.item.uuid, collid: collid}) - // .then(data => { - // console.log("onFlagActionCard then", data); - // this.loadingFlag = false; - // }) - // } - // } - // } + ...mapActions({ + flagUnflag: 'User/flagUnflag' + }), + itemIsLoading(id) { + return this.loadingItem + }, + onUnFlagCard (e) { + console.log("Card onFlagActionCard", e); + if (!this.loadingItem) { + this.loadingItem = true; + this.flagUnflag({ + action: 'unflag', + uuid: this.item.uuid, + collid: this.collid + }) + .then(data => { + console.log("onUnFlagCard then", data); + this.loadingItem = false; + }) + } + } } } diff --git a/web/themes/custom/materiotheme/vuejs/components/User/FlagCollection.vue b/web/themes/custom/materiotheme/vuejs/components/User/FlagCollection.vue index 3d6c589..65760fe 100644 --- a/web/themes/custom/materiotheme/vuejs/components/User/FlagCollection.vue +++ b/web/themes/custom/materiotheme/vuejs/components/User/FlagCollection.vue @@ -13,8 +13,9 @@ v-for="item in loadedItems" :key="item.id" > - + + No items in your folder Loading
@@ -33,6 +34,7 @@ export default { computed: { ...mapState({ flagcolls: state => state.User.flagcolls, + flagcollsLoadedItems: state => state.User.flagcollsLoadedItems, openedCollid: state => state.User.openedCollid }) }, @@ -45,11 +47,11 @@ export default { // } // }, created() { - if (typeof this.collection.loadedItems !== 'undefined') { + if (typeof this.flagcollsLoadedItems[this.openedCollid] !== 'undefined') { // if loadedItems are alredy loaded, // the mutation occurs before this subscription // so we first check if they are already available - this.loadedItems = this.collection.loadedItems + this.loadedItems = this.flagcollsLoadedItems[this.openedCollid] } this.unsubscribe = this.$store.subscribe((mutation, state) => { @@ -57,7 +59,7 @@ export default { console.log("mutation setLoadedCollItems collid", this.openedCollid) // mutation is triggered before the component update // so this.collection.id is not good - this.loadedItems = state.User.flagcolls[this.openedCollid].loadedItems + this.loadedItems = state.User.flagcollsLoadedItems[this.openedCollid] } }) diff --git a/web/themes/custom/materiotheme/vuejs/components/User/UserFlags.vue b/web/themes/custom/materiotheme/vuejs/components/User/UserFlags.vue index cac0d27..a83768a 100644 --- a/web/themes/custom/materiotheme/vuejs/components/User/UserFlags.vue +++ b/web/themes/custom/materiotheme/vuejs/components/User/UserFlags.vue @@ -2,7 +2,7 @@

My folders

+ >My folders ({{collsLength}})
-
  • +
  • state.User.flagcolls }), + collsLength() { + return Object.keys(this.flagcolls).length + }, addFlagBtnClassObj() { return { 'mdi-plus-circle-outline': !this.is_creating_folder, diff --git a/web/themes/custom/materiotheme/vuejs/store/modules/user.js b/web/themes/custom/materiotheme/vuejs/store/modules/user.js index dade3e8..4bb008a 100644 --- a/web/themes/custom/materiotheme/vuejs/store/modules/user.js +++ b/web/themes/custom/materiotheme/vuejs/store/modules/user.js @@ -19,6 +19,7 @@ export default { canSearch: false, roles: [], flagcolls: false, + flagcollsLoadedItems: {}, openedCollid: null }, @@ -83,8 +84,9 @@ export default { state.canSearch = false }, setFlagColls (state, flagcolls) { - console.log('User setFlagColls', flagcolls) + console.log('User pre setFlagColls', state.flagcolls) state.flagcolls = flagcolls + // console.log('User post setFlagColls', state.flagcolls) }, openFlagColl (state, collid) { state.openedCollid = collid @@ -96,7 +98,7 @@ export default { console.log('setLoadedCollItems', data) // if no data, we are just calling the mutation to trigger the component update if (data) { - state.flagcolls[data.collid].loadedItems = data.items + state.flagcollsLoadedItems[data.collid] = data.items } } }, @@ -236,66 +238,65 @@ export default { }) }) }, - flag ({ dispatch, commit, state }, args) { - console.log('user flag', args.uuid, args.collid) + flagUnflag ({ dispatch, commit, state }, { action, uuid, collid }) { + console.log('user flagUnflag', action, uuid, collid) return new Promise((resolve, reject) => { const params = { - flagid: state.flagcolls[args.collid].flag_id, - uuid: args.uuid, - flagcollid: args.collid + flagid: state.flagcolls[collid].flag_id, + uuid: uuid, + flagcollid: collid } - return MA.post('materio_flag/flag', params) + return MA.post(`materio_flag/${action}`, params) .then(({ data }) => { console.log('user MA flag', data) + // reload the fulllist of flagcolleciton dispatch('getUserFlagColls').then(() => { - resolve() + if (state.flagcolls[collid].items_uuids.length) { + dispatch('loadMaterials', { + uuids: state.flagcolls[collid].items_uuids, + imgStyle: 'card_medium_half', + callBack: 'loadMaterialsCallBack', + callBackArgs: { collid: collid } + }).then( () => { + resolve() + }) + }else{ + commit('setLoadedCollItems', { collid: collid, items: [] }) + resolve() + } }) }) .catch(error => { - console.warn('Issue USER MA flag', error) - }) - }) - }, - unFlag ({ dispatch, commit, state }, args) { - console.log('user unFlag', args.uuid, args.collid) - return new Promise((resolve, reject) => { - const params = { - flagid: state.flagcolls[args.collid].flag_id, - uuid: args.uuid, - flagcollid: args.collid - } - return MA.post('materio_flag/unflag', params) - .then(({ data }) => { - console.log('user MA unFlag', data) - dispatch('getUserFlagColls').then(() => { - resolve() - }) - }) - .catch(error => { - console.warn('Issue USER MA unFlag', error) + console.warn('Issue USER MA flagUnflag', error) }) }) }, openFlagColl ({ commit, dispatch, state }, collid) { console.log('user openFlagColl', collid) commit('openFlagColl', collid) - if (typeof state.flagcolls[collid].loadedItems === 'undefined') { - // if no loadedItems, load them - // loadMaterials is on mixins - // https://github.com/huybuidac/vuex-extensions - dispatch('loadMaterials', { - uuids: state.flagcolls[collid].items_uuids, - imgStyle: 'card_medium_half', - callBack: 'loadMaterialsCallBack', - callBackArgs: { collid: collid } - }) - } else { - // call the mutation without data to only trigger the FlagCollection component update - commit('setLoadedCollItems') + if (state.flagcolls[collid].items_uuids.length) { + if (typeof state.flagcollsLoadedItems[collid] === 'undefined') { + console.log('loading flagcoll items') + // if no loadedItems, load them + // loadMaterials is on mixins + // https://github.com/huybuidac/vuex-extensions + dispatch('loadMaterials', { + uuids: state.flagcolls[collid].items_uuids, + imgStyle: 'card_medium_half', + callBack: 'loadMaterialsCallBack', + callBackArgs: { collid: collid } + }) + } else { + // call the mutation without data to only trigger the FlagCollection component update + console.log('committing setLoadedCollItems without args') + commit('setLoadedCollItems') + } + }else{ + commit('setLoadedCollItems', { collid: collid, items: [] }) } }, loadMaterialsCallBack ({ commit }, { items, callBackArgs }) { - console.log('user loadMaterialsCallBack', items) + console.log('user loadMaterialsCallBack', items, callBackArgs) commit('setLoadedCollItems', { collid: callBackArgs.collid, items: items }) }, closeFlagColl ({ commit, dispatch }) {