Introduce tiled layout in the timelinephotos2

Signed-off-by: Louis Chemineau <louis@chmn.me>

1 files changed, 381 insertions, 0 deletions

diff --git a/js/photos-src_mixins_FetchFilesMixin_js-src_mixins_FilesSelectionMixin_js.js b/js/photos-src_mixins_FetchFilesMixin_js-src_mixins_FilesSelectionMixin_js.js
new file mode 100644
index 00000000..d5544a97
--- /dev/null
+++ b/js/photos-src_mixins_FetchFilesMixin_js-src_mixins_FilesSelectionMixin_js.js
@@ -0,0 +1,381 @@
+"use strict";
+(self["webpackChunkphotos"] = self["webpackChunkphotos"] || []).push([["src_mixins_FetchFilesMixin_js-src_mixins_FilesSelectionMixin_js"],{
+
+/***/ "./src/mixins/FetchFilesMixin.js":
+/*!***************************************!*\
+  !*** ./src/mixins/FetchFilesMixin.js ***!
+  \***************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
+/* harmony export */ });
+/* harmony import */ var vuex__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! vuex */ "./node_modules/vuex/dist/vuex.esm.js");
+/* harmony import */ var _services_logger_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../services/logger.js */ "./src/services/logger.js");
+/* harmony import */ var _services_PhotoSearch_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../services/PhotoSearch.js */ "./src/services/PhotoSearch.js");
+/* harmony import */ var _utils_CancelableRequest_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../utils/CancelableRequest.js */ "./src/utils/CancelableRequest.js");
+/* harmony import */ var _utils_semaphoreWithPriority_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../utils/semaphoreWithPriority.js */ "./src/utils/semaphoreWithPriority.js");
+/**
+ * @copyright Copyright (c) 2019 Louis Chemineau <louis@chmn.me>
+ *
+ * @author Louis Chemineau <louis@chmn.me>
+ *
+ * @license AGPL-3.0-or-later
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
+ *
+ */
+
+
+
+
+
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({
+  name: 'FetchFilesMixin',
+
+  data() {
+    return {
+      errorFetchingFiles: null,
+      loadingFiles: false,
+      nbFetchedFiles: 0,
+      doneFetchingFiles: false,
+      cancelFilesRequest: () => {},
+      semaphore: new _utils_semaphoreWithPriority_js__WEBPACK_IMPORTED_MODULE_3__["default"](30),
+      semaphoreSymbol: null
+    };
+  },
+
+  beforeDestroy() {
+    this.cancelFilesRequest('Changed view');
+  },
+
+  computed: { ...(0,vuex__WEBPACK_IMPORTED_MODULE_4__.mapGetters)(['files'])
+  },
+  methods: {
+    /**
+     * @param {string} path
+     * @return {Promise<Array>} - The next batch of data depending on global offset.
+    async fetchFiles(path = '', options = {
+    }) {
+    */
+    async fetchFiles() {
+      let path = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+      let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+
+      if (this.doneFetchingFiles || this.loadingFiles) {
+        return [];
+      }
+
+      try {
+        this.errorFetchingFiles = null;
+        this.loadingFiles = true;
+        this.semaphoreSymbol = await this.semaphore.acquire(() => 0, 'fetchFiles');
+        const {
+          request,
+          cancel
+        } = (0,_utils_CancelableRequest_js__WEBPACK_IMPORTED_MODULE_2__["default"])(_services_PhotoSearch_js__WEBPACK_IMPORTED_MODULE_1__["default"]);
+        this.cancelFilesRequest = cancel;
+        const numberOfImagesPerBatch = 1000; // Load next batch of images
+
+        const files = await request(path, {
+          // We reuse already fetched files in the store when moving from one tab to another, but to make sure that we have all the files, we keep an internal counter (nbFetchedFiles).
+          // Some files will be fetched twice, but we have less loading time when switching between tabs.
+          firstResult: this.nbFetchedFiles,
+          nbResults: numberOfImagesPerBatch,
+          ...options
+        }); // If we get less files than requested that means we got to the end
+
+        if (files.length !== numberOfImagesPerBatch) {
+          this.doneFetchingFiles = true;
+        }
+
+        this.nbFetchedFiles += files.length;
+        this.$store.dispatch('appendFiles', files);
+        return files;
+      } catch (error) {
+        if (error.response && error.response.status) {
+          if (error.response.status === 404) {
+            this.errorFetchingFiles = 404;
+          } else {
+            this.errorFetchingFiles = error;
+          }
+        } // cancelled request, moving on...
+
+
+        _services_logger_js__WEBPACK_IMPORTED_MODULE_0__["default"].error('Error fetching files', error);
+      } finally {
+        this.loadingFiles = false;
+
+        this.cancelFilesRequest = () => {};
+
+        this.semaphore.release(this.semaphoreSymbol);
+        this.semaphoreSymbol = null;
+      }
+
+      return [];
+    },
+
+    resetState() {
+      this.doneFetchingFiles = false;
+      this.errorFetchingFiles = null;
+      this.loadingFiles = false;
+      this.nbFetchedFiles = 0;
+    }
+
+  }
+});
+
+/***/ }),
+
+/***/ "./src/mixins/FilesSelectionMixin.js":
+/*!*******************************************!*\
+  !*** ./src/mixins/FilesSelectionMixin.js ***!
+  \*******************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
+/* harmony export */ });
+/**
+ * @copyright Copyright (c) 2019 Louis Chemineau <louis@chmn.me>
+ *
+ * @author Louis Chemineau <louis@chmn.me>
+ *
+ * @license AGPL-3.0-or-later
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
+ *
+ */
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({
+  name: 'FilesSelectionMixin',
+
+  data() {
+    return {
+      /** @type {Object<string, boolean>} */
+      selection: {},
+
+      /** @type {Object<string, string[]>} */
+      sections: {} // To be override by the component that use the mixin.
+
+    };
+  },
+
+  methods: {
+    onFileSelectToggle(_ref) {
+      let {
+        id,
+        value
+      } = _ref;
+      this.$set(this.selection, id, value);
+    },
+
+    /**
+     * @param {string[]} filesIds - The ids of the files to uncheck.
+     */
+    onUncheckFiles(filesIds) {
+      filesIds.forEach((
+      /** @type {string} */
+      filesId) => this.$set(this.selectedFiles, filesId, false));
+    }
+
+  },
+  computed: {
+    /**
+     * @return {string[]}
+     */
+    selectedFileIds() {
+      return Object.keys(this.selection).filter(fileId => this.selection[fileId]);
+    }
+
+  }
+});
+
+/***/ }),
+
+/***/ "./src/services/PhotoSearch.js":
+/*!*************************************!*\
+  !*** ./src/services/PhotoSearch.js ***!
+  \*************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (/* export default binding */ __WEBPACK_DEFAULT_EXPORT__)
+/* harmony export */ });
+/* harmony import */ var _utils_fileUtils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../utils/fileUtils.js */ "./src/utils/fileUtils.js");
+/* harmony import */ var _nextcloud_auth__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @nextcloud/auth */ "./node_modules/@nextcloud/auth/dist/index.js");
+/* harmony import */ var _AllowedMimes_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./AllowedMimes.js */ "./src/services/AllowedMimes.js");
+/* harmony import */ var _DavClient_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./DavClient.js */ "./src/services/DavClient.js");
+/* harmony import */ var _DavRequest_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./DavRequest.js */ "./src/services/DavRequest.js");
+/* harmony import */ var _nextcloud_moment__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @nextcloud/moment */ "./node_modules/@nextcloud/moment/dist/index.js");
+/* harmony import */ var _nextcloud_moment__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_nextcloud_moment__WEBPACK_IMPORTED_MODULE_5__);
+/**
+ * @copyright Copyright (c) 2019 John Molakvoæ <skjnldsv@protonmail.com>
+ *
+ * @author John Molakvoæ <skjnldsv@protonmail.com>
+ *
+ * @license AGPL-3.0-or-later
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
+ *
+ */
+
+
+
+
+
+
+/**
+ * List files from a folder and filter out unwanted mimes
+ *
+ * @param {object} path the lookup path
+ * @param {object} [options] used for the cancellable requests
+ * @param {number} [options.firstResult=0] Index of the first result that we want (starts at 0)
+ * @param {number} [options.nbResults=200] The number of file to fetch
+ * @param {string[]} [options.mimesType=allMimes] Mime type of the files
+ * @param {boolean} [options.full=false] get full data of the files
+ * @param {boolean} [options.onThisDay=false] get only items from this day of year
+ * @param {boolean} [options.onlyFavorites=false] get only favorie items
+ * @return {Promise<object[]>} the file list
+ */
+
+/* harmony default export */ async function __WEBPACK_DEFAULT_EXPORT__() {
+  let path = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+  let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  // default function options
+  options = {
+    firstResult: 0,
+    nbResults: 200,
+    mimesType: _AllowedMimes_js__WEBPACK_IMPORTED_MODULE_2__.allMimes,
+    onThisDay: false,
+    onlyFavorites: false,
+    ...options
+  };
+  const prefixPath = `/files/${(0,_nextcloud_auth__WEBPACK_IMPORTED_MODULE_1__.getCurrentUser)().uid}`; // generating the search or condition
+  // based on the allowed mimetypes
+
+  const orMime = options.mimesType.reduce((str, mime) => `${str}
+		<d:eq>
+			<d:prop>
+				<d:getcontenttype/>
+			</d:prop>
+			<d:literal>${mime}</d:literal>
+		</d:eq>
+	`, '');
+  const eqFavorites = options.onlyFavorites ? `<d:eq>
+				<d:prop>
+					<oc:favorite/>
+				</d:prop>
+				<d:literal>1</d:literal>
+			</d:eq>` : '';
+  const onThisDay = options.onThisDay ? `<d:or>${Array(20).fill(1).map((_, years) => {
+    const start = _nextcloud_moment__WEBPACK_IMPORTED_MODULE_5___default()(Date.now()).startOf('day').subtract(3, 'd').subtract(years + 1, 'y');
+    const end = _nextcloud_moment__WEBPACK_IMPORTED_MODULE_5___default()(Date.now()).endOf('day').add(3, 'd').subtract(years + 1, 'y');
+    return `<d:and>
+				<d:gt>
+					<d:prop>
+						<d:getlastmodified />
+					</d:prop>
+					<d:literal>${start.format((_nextcloud_moment__WEBPACK_IMPORTED_MODULE_5___default().defaultFormatUtc))}</d:literal>
+				</d:gt>
+				<d:lt>
+					<d:prop>
+						<d:getlastmodified />
+					</d:prop>
+					<d:literal>${end.format((_nextcloud_moment__WEBPACK_IMPORTED_MODULE_5___default().defaultFormatUtc))}</d:literal>
+				</d:lt>
+			</d:and>`;
+  }).join('\n')}</d:or>` : '';
+  options = Object.assign({
+    method: 'SEARCH',
+    headers: {
+      'content-Type': 'text/xml'
+    },
+    data: `<?xml version="1.0" encoding="UTF-8"?>
+			<d:searchrequest xmlns:d="DAV:"
+				xmlns:oc="http://owncloud.org/ns"
+				xmlns:nc="http://nextcloud.org/ns"
+				xmlns:ns="https://github.com/icewind1991/SearchDAV/ns"
+				xmlns:ocs="http://open-collaboration-services.org/ns">
+				<d:basicsearch>
+					<d:select>
+						<d:prop>
+							${_DavRequest_js__WEBPACK_IMPORTED_MODULE_4__.props}
+						</d:prop>
+					</d:select>
+					<d:from>
+						<d:scope>
+							<d:href>${prefixPath}/${path}</d:href>
+							<d:depth>infinity</d:depth>
+						</d:scope>
+					</d:from>
+					<d:where>
+						<d:and>
+							<d:or>
+								${orMime}
+							</d:or>
+							${eqFavorites}
+							${onThisDay}
+						</d:and>
+					</d:where>
+					<d:orderby>
+						<d:order>
+							<d:prop><d:getlastmodified/></d:prop>
+							<d:descending/>
+						</d:order>
+					</d:orderby>
+					<d:limit>
+						<d:nresults>${options.nbResults}</d:nresults>
+						<ns:firstresult>${options.firstResult}</ns:firstresult>
+					</d:limit>
+				</d:basicsearch>
+			</d:searchrequest>`,
+    deep: true,
+    details: true
+  }, options);
+  const response = await _DavClient_js__WEBPACK_IMPORTED_MODULE_3__["default"].getDirectoryContents('', options);
+  return response.data.map(data => (0,_utils_fileUtils_js__WEBPACK_IMPORTED_MODULE_0__.genFileInfo)(data)) // remove prefix path from full file path
+  .map(data => ({ ...data,
+    filename: data.filename.replace(prefixPath, '')
+  }));
+}
+
+/***/ })
+
+}]);
+//# sourceMappingURL=photos-src_mixins_FetchFilesMixin_js-src_mixins_FilesSelectionMixin_js.js.map?v=f8b0ec433ba3144eb8ff
\ No newline at end of file