(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[3],{ /***/ "./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js?!./src/components/FolderTagPreview.vue?vue&type=script&lang=js&": /*!********************************************************************************************************************************************************!*\ !*** ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./src/components/FolderTagPreview.vue?vue&type=script&lang=js& ***! \********************************************************************************************************************************************************/ /*! exports provided: default */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony import */ var _nextcloud_router__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @nextcloud/router */ "./node_modules/@nextcloud/router/dist/index.js"); /* harmony import */ var _nextcloud_router__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_nextcloud_router__WEBPACK_IMPORTED_MODULE_0__); // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // /* harmony default export */ __webpack_exports__["default"] = ({ name: 'FolderTagPreview', props: { icon: { type: String, default: 'icon-folder' }, id: { type: Number, required: true }, name: { type: String, required: true }, path: { type: String, required: true }, fileList: { type: Array, default: function _default() { return []; } } }, data: function data() { return { loaded: false, failed: [] }; }, computed: { // folder is empty isEmpty: function isEmpty() { return this.previewList.length === 0; }, ariaUuid: function ariaUuid() { return "folder-".concat(this.id); }, ariaLabel: function ariaLabel() { return t('photos', 'Open the "{name}" sub-directory', { name: this.name }); }, /** * Previews list without the failed ones * @returns {Object[]} the previews fileinfo */ previewList: function previewList() { var _this = this; return this.fileList.filter(function (file) { return _this.failed.indexOf(file.fileid) === -1; }); }, /** * We do not want encoded slashes when browsing by folder * so we generate a new valid route object based on the * current named route, get the final url back, decode it * and use it as a direct string. * Which vue-router does not encode afterwards! * @returns {string} */ to: function to() { // always remove first slash, the router // manage it automatically var regex = /^\/?(.+)/i; var path = regex.exec(this.path)[1]; // apply to current route return Object.assign({}, this.$route, { params: { path: path } }); } }, methods: { generateImgSrc: function generateImgSrc(_ref) { var fileid = _ref.fileid, etag = _ref.etag; // use etag to force cache reload if file changed return Object(_nextcloud_router__WEBPACK_IMPORTED_MODULE_0__["generateUrl"])("/core/preview?fileId=".concat(fileid, "&x=", 256, "&y=", 256, "&a=true&v=").concat(etag)); }, onPreviewFail: function onPreviewFail(_ref2) { var fileid = _ref2.fileid; this.failed.push(fileid); } } }); /***/ }), /***/ "./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/FolderTagPreview.vue?vue&type=style&index=0&id=77915c0c&lang=scss&scoped=true&": /*!***************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** ./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ref--1-3!./node_modules/vue-loader/lib??vue-loader-options!./src/components/FolderTagPreview.vue?vue&type=style&index=0&id=77915c0c&lang=scss&scoped=true& ***! \***************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { // Imports var ___CSS_LOADER_API_IMPORT___ = __webpack_require__(/*! ../../node_modules/css-loader/dist/runtime/api.js */ "./node_modules/css-loader/dist/runtime/api.js"); exports = ___CSS_LOADER_API_IMPORT___(false); // Module exports.push([module.i, "@charset \"UTF-8\";\n/**\n * @copyright Copyright (c) 2019 John Molakvoæ \n *\n * @author John Molakvoæ \n *\n * @license GNU AGPL version 3 or any later version\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU Affero General Public License as\n * published by the Free Software Foundation, either version 3 of the\n * License, or (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU Affero General Public License for more details.\n *\n * You should have received a copy of the GNU Affero General Public License\n * along with this program. If not, see .\n *\n */\n.file[data-v-77915c0c],\n.folder[data-v-77915c0c] {\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n border-radius: var(--border-radius);\n overflow: hidden;\n}\n.file .cover[data-v-77915c0c],\n .folder .cover[data-v-77915c0c] {\n z-index: 2;\n width: 100%;\n padding-bottom: 100%;\n transition: opacity var(--animation-quick) ease-in-out;\n opacity: 0;\n background-color: var(--color-main-text);\n}\n.file.active .cover[data-v-77915c0c], .file:active .cover[data-v-77915c0c], .file:hover .cover[data-v-77915c0c], .file:focus .cover[data-v-77915c0c],\n .folder.active .cover[data-v-77915c0c],\n .folder:active .cover[data-v-77915c0c],\n .folder:hover .cover[data-v-77915c0c],\n .folder:focus .cover[data-v-77915c0c] {\n opacity: .3;\n}\n.file--clear.active .cover[data-v-77915c0c], .file--clear:active .cover[data-v-77915c0c], .file--clear:hover .cover[data-v-77915c0c], .file--clear:focus .cover[data-v-77915c0c],\n .folder--clear.active .cover[data-v-77915c0c],\n .folder--clear:active .cover[data-v-77915c0c],\n .folder--clear:hover .cover[data-v-77915c0c],\n .folder--clear:focus .cover[data-v-77915c0c] {\n opacity: .1;\n}\n.fade-enter-active[data-v-77915c0c], .fade-leave-active[data-v-77915c0c] {\n transition: opacity var(--animation-quick) ease-in-out;\n}\n.fade-enter[data-v-77915c0c], .fade-leave-to[data-v-77915c0c] {\n opacity: 0;\n}\n.folder-content[data-v-77915c0c] {\n position: absolute;\n display: grid;\n width: 100%;\n height: 100%;\n}\n.folder-content--grid-1[data-v-77915c0c] {\n grid-template-columns: 1fr;\n grid-template-rows: 1fr;\n}\n.folder-content--grid-2[data-v-77915c0c] {\n grid-template-columns: 1fr;\n grid-template-rows: 1fr 1fr;\n}\n.folder-content--grid-3[data-v-77915c0c] {\n grid-template-columns: 1fr 1fr;\n grid-template-rows: 1fr 1fr;\n}\n.folder-content--grid-3 img[data-v-77915c0c]:first-child {\n grid-column: span 2;\n}\n.folder-content--grid-4[data-v-77915c0c] {\n grid-template-columns: 1fr 1fr;\n grid-template-rows: 1fr 1fr;\n}\n.folder-content img[data-v-77915c0c] {\n width: 100%;\n height: 100%;\n -o-object-fit: cover;\n object-fit: cover;\n}\n.folder-name[data-v-77915c0c] {\n position: absolute;\n z-index: 3;\n display: flex;\n overflow: hidden;\n flex-direction: column;\n width: 100%;\n height: 100%;\n transition: opacity var(--animation-quick) ease-in-out;\n opacity: 1;\n}\n.folder-name__icon[data-v-77915c0c] {\n height: 40%;\n margin-top: calc(30% - 1rem / 2);\n background-size: 40%;\n}\n.folder-name__name[data-v-77915c0c] {\n overflow: hidden;\n height: 1rem;\n padding: 0 10px;\n text-align: center;\n white-space: nowrap;\n text-overflow: ellipsis;\n color: var(--color-main-background);\n text-shadow: 0 0 8px var(--color-main-text);\n font-size: 1rem;\n line-height: 1rem;\n}\n.folder--clear .folder-name__icon[data-v-77915c0c] {\n opacity: .3;\n}\n.folder--clear .folder-name__name[data-v-77915c0c] {\n color: var(--color-main-text);\n text-shadow: 0 0 8px var(--color-main-background);\n}\n.folder:not(.folder--clear) .cover[data-v-77915c0c] {\n opacity: .3;\n}\n.folder:not(.folder--clear):active .folder-name[data-v-77915c0c],\n.folder:not(.folder--clear):active .cover[data-v-77915c0c], .folder:not(.folder--clear):hover .folder-name[data-v-77915c0c],\n.folder:not(.folder--clear):hover .cover[data-v-77915c0c], .folder:not(.folder--clear):focus .folder-name[data-v-77915c0c],\n.folder:not(.folder--clear):focus .cover[data-v-77915c0c] {\n opacity: 0;\n}\n", ""]); // Exports module.exports = exports; /***/ }), /***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./src/components/FolderTagPreview.vue?vue&type=template&id=77915c0c&scoped=true&": /*!**********************************************************************************************************************************************************************************************************************!*\ !*** ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./src/components/FolderTagPreview.vue?vue&type=template&id=77915c0c&scoped=true& ***! \**********************************************************************************************************************************************************************************************************************/ /*! exports provided: render, staticRenderFns */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "render", function() { return render; }); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "staticRenderFns", function() { return staticRenderFns; }); var render = function() { var _vm = this var _h = _vm.$createElement var _c = _vm._self._c || _h return _c( "router-link", { staticClass: "folder", class: { "folder--clear": _vm.isEmpty }, attrs: { to: _vm.to, "aria-label": _vm.ariaLabel } }, [ _c("transition", { attrs: { name: "fade" } }, [ _c( "div", { directives: [ { name: "show", rawName: "v-show", value: _vm.loaded, expression: "loaded" } ], staticClass: "folder-content", class: "folder-content--grid-" + _vm.previewList.length, attrs: { role: "none" } }, _vm._l(_vm.previewList, function(file) { return _c("img", { key: file.fileid, attrs: { src: _vm.generateImgSrc(file), alt: "" }, on: { load: function($event) { _vm.loaded = true }, error: function($event) { return _vm.onPreviewFail(file) } } }) }), 0 ) ]), _vm._v(" "), _c("div", { staticClass: "folder-name" }, [ _c("span", { staticClass: "folder-name__icon", class: [!_vm.isEmpty ? "icon-white" : "icon-dark", _vm.icon], attrs: { role: "img" } }), _vm._v(" "), _c( "p", { staticClass: "folder-name__name", attrs: { id: _vm.ariaUuid } }, [_vm._v("\n\t\t\t" + _vm._s(_vm.name) + "\n\t\t")] ) ]), _vm._v(" "), _c("div", { staticClass: "cover", attrs: { role: "none" } }) ], 1 ) } var staticRenderFns = [] render._withStripped = true /***/ }), /***/ "./node_modules/vue-style-loader/index.js!./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/FolderTagPreview.vue?vue&type=style&index=0&id=77915c0c&lang=scss&scoped=true&": /*!***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** ./node_modules/vue-style-loader!./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ref--1-3!./node_modules/vue-loader/lib??vue-loader-options!./src/components/FolderTagPreview.vue?vue&type=style&index=0&id=77915c0c&lang=scss&scoped=true& ***! \***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { // style-loader: Adds some css to the DOM by adding a