Port settings to Modal

Signed-off-by: John Molakvoæ <skjnldsv@protonmail.com>

3 files changed, 48 insertions, 98 deletions

diff --git a/apps/files/js/app.js b/apps/files/js/app.js
index c88ea42a487..a2f8fa58d30 100644
--- a/apps/files/js/app.js
+++ b/apps/files/js/app.js
@@ -56,11 +56,6 @@
 			var showHidden = $('#showHiddenFiles').val() === "1";
 			this.$showHiddenFiles.prop('checked', showHidden);
 
-			// crop image previews
-			this.$cropImagePreviews = $('input#cropimagepreviewsToggle');
-			var cropImagePreviews = $('#cropImagePreviews').val() === "1";
-			this.$cropImagePreviews.prop('checked', cropImagePreviews);
-
 			// Toggle for grid view
 			this.$showGridView = $('input#showgridview');
 			this.$showGridView.on('change', _.bind(this._onGridviewChange, this));
@@ -69,10 +64,7 @@
 				OC.Notification.show(t('files', 'File could not be found'), {type: 'error'});
 			}
 
-			this._filesConfig = new OC.Backbone.Model({
-				showhidden: showHidden,
-				cropimagepreviews: cropImagePreviews,
-			});
+			this._filesConfig = OCP.InitialState.loadState('files', 'config', {})
 
 			var urlParams = OC.Util.History.parseUrlQuery();
 			var fileActions = new OCA.Files.FileActions();
@@ -223,8 +215,8 @@
 		 * Sets the currently active view
 		 * @param viewId view id
 		 */
-		setActiveView: function(viewId, options) {
-			window._nc_event_bus.emit('files:view:changed', { id: viewId })
+		setActiveView: function(viewId) {
+			window._nc_event_bus.emit('files:navigation:changed', { id: viewId })
 		},
 
 		/**
@@ -254,57 +246,6 @@
 			$('#app-content').delegate('>div', 'changeDirectory', _.bind(this._onDirectoryChanged, this));
 			$('#app-content').delegate('>div', 'afterChangeDirectory', _.bind(this._onAfterDirectoryChanged, this));
 			$('#app-content').delegate('>div', 'changeViewerMode', _.bind(this._onChangeViewerMode, this));
-
-			window._nc_event_bus.subscribe('files:view:changed', _.bind(this._onNavigationChanged, this))
-			$('#app-navigation').on('itemChanged', _.bind(this._onNavigationChanged, this));
-			this.$showHiddenFiles.on('change', _.bind(this._onShowHiddenFilesChange, this));
-			this.$cropImagePreviews.on('change', _.bind(this._onCropImagePreviewsChange, this));
-		},
-
-		/**
-		 * Toggle showing hidden files according to the settings checkbox
-		 *
-		 * @returns {undefined}
-		 */
-		_onShowHiddenFilesChange: function() {
-			var show = this.$showHiddenFiles.is(':checked');
-			this._filesConfig.set('showhidden', show);
-			this._debouncedPersistShowHiddenFilesState();
-		},
-
-		/**
-		 * Persist show hidden preference on the server
-		 *
-		 * @returns {undefined}
-		 */
-		_persistShowHiddenFilesState: function() {
-			var show = this._filesConfig.get('showhidden');
-			$.post(OC.generateUrl('/apps/files/api/v1/showhidden'), {
-				show: show
-			});
-		},
-
-		/**
-		 * Toggle cropping image previews according to the settings checkbox
-		 *
-		 * @returns void
-		 */
-		_onCropImagePreviewsChange: function() {
-			var crop = this.$cropImagePreviews.is(':checked');
-			this._filesConfig.set('cropimagepreviews', crop);
-			this._debouncedPersistCropImagePreviewsState();
-		},
-
-		/**
-		 * Persist crop image previews preference on the server
-		 *
-		 * @returns void
-		 */
-		_persistCropImagePreviewsState: function() {
-			var crop = this._filesConfig.get('cropimagepreviews');
-			$.post(OC.generateUrl('/apps/files/api/v1/cropimagepreviews'), {
-				crop: crop
-			});
 		},
 
 		/**
@@ -379,7 +320,7 @@
 			if (lastId !== this.getActiveView()) {
 				this.getCurrentAppContainer().trigger(new $.Event('show'));
 			}
-			this.getCurrentAppContainer().trigger(new $.Event('urlChanged', params));
+			// this.getCurrentAppContainer().trigger(new $.Event('urlChanged', params));
 			window._nc_event_bus.emit('files:navigation:changed')
 		},
 
@@ -408,13 +349,18 @@
 			}
 			var currentParams = OC.Util.History.parseUrlQuery();
 			if (currentParams.dir === params.dir && currentParams.view === params.view) {
-				if (currentParams.fileid !== params.fileid) {
+				if (parseInt(currentParams.fileid) !== parseInt(params.fileid)) {
 					// if only fileid changed or was added, replace instead of push
+					console.debug('F2V 1', currentParams.fileid, params.fileid, params);
 					OC.Util.History.replaceState(this._makeUrlParams(params));
+					return
 				}
 			} else {
+				console.debug('F2V 2', params);
 				OC.Util.History.pushState(this._makeUrlParams(params));
+				return
 			}
+			console.debug('F2V 3', params, currentParams);
 		},
 
 		/**
diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js
index 89fc3f7e9c5..37aa9139850 100644
--- a/apps/files/js/filelist.js
+++ b/apps/files/js/filelist.js
@@ -173,7 +173,8 @@
 		_filter: '',
 
 		/**
-		 * @type Backbone.Model
+		 * @type UserConfig
+		 * @see /apps/files/lib/Service/UserConfig.php
 		 */
 		_filesConfig: undefined,
 
@@ -252,10 +253,7 @@
 			} else if (!_.isUndefined(OCA.Files) && !_.isUndefined(OCA.Files.App)) {
 				this._filesConfig = OCA.Files.App.getFilesConfig();
 			} else {
-				this._filesConfig = new OC.Backbone.Model({
-					'showhidden': false,
-					'cropimagepreviews': true
-				});
+				this._filesConfig = OCP.InitialState.loadState('files', 'config', {})
 			}
 
 			if (options.dragOptions) {
@@ -281,26 +279,30 @@
 			this.$header = $el.find('.filelist-header');
 			this.$footer = $el.find('.filelist-footer');
 
-			if (!_.isUndefined(this._filesConfig)) {
-				this._filesConfig.on('change:showhidden', function() {
-					var showHidden = this.get('showhidden');
-					self.$el.toggleClass('hide-hidden-files', !showHidden);
+			// Legacy mapper for new vue components
+			window._nc_event_bus.subscribe('files:config:updated', ({ key, value }) => {
+				// Replace existing config with new one
+				Object.assign(this._filesConfig, { [key]: value })
+
+				if (key === 'show_hidden') {
+					self.$el.toggleClass('hide-hidden-files', !value);
 					self.updateSelectionSummary();
 
-					if (!showHidden) {
-						// hiding files could make the page too small, need to try rendering next page
+					// hiding files could make the page too small, need to try rendering next page
+					if (!value) {
 						self._onScroll();
 					}
-				});
-
-				this._filesConfig.on('change:cropimagepreviews', function() {
+				}
+				if (key === 'crop_image_previews') {
 					self.reload();
-				});
+				}
+			})
 
-				this.$el.toggleClass('hide-hidden-files', !this._filesConfig.get('showhidden'));
+			var config = OCP.InitialState.loadState('files', 'config', {})
+			if (config.show_hidden === false) {
+				this.$el.addClass('hide-hidden-files');
 			}
 
-
 			if (_.isUndefined(options.detailsViewEnabled) || options.detailsViewEnabled) {
 				this._detailsView = new OCA.Files.DetailsView();
 				this._detailsView.$el.addClass('disappear');
@@ -393,6 +395,7 @@
 
 			this.$fileList.on('change', 'td.selection>.selectCheckBox', _.bind(this._onClickFileCheckbox, this));
 			this.$fileList.on('mouseover', 'td.selection', _.bind(this._onMouseOverCheckbox, this));
+			console.debug('F2V', this.$el);
 			this.$el.on('show', _.bind(this._onShow, this));
 			this.$el.on('urlChanged', _.bind(this._onUrlChanged, this));
 			this.$el.find('.select-all').click(_.bind(this._onClickSelectAll, this));
@@ -754,23 +757,22 @@
 		 * Event handler when leaving previously hidden state
 		 */
 		_onShow: function(e) {
+			console.debug('F2V', 'onShow', e);
 			OCA.Files.App && OCA.Files.App.updateCurrentFileList(this);
-			if (this.shown) {
-				if (e.itemId === this.id) {
-					this._setCurrentDir('/', false);
-				}
-				// Only reload if we don't navigate to a different directory
-				if (typeof e.dir === 'undefined' || e.dir === this.getCurrentDirectory()) {
-					this.reload();
-				}
+			if (e.itemId === this.id) {
+				this._setCurrentDir('/', false);
+			}
+			// Only reload if we don't navigate to a different directory
+			if (typeof e.dir === 'undefined' || e.dir === this.getCurrentDirectory()) {
+				this.reload();
 			}
-			this.shown = true;
 		},
 
 		/**
 		 * Event handler for when the URL changed
 		 */
 		_onUrlChanged: function(e) {
+			console.debug('F2V', 'onUrlChanged', e);
 			if (e && _.isString(e.dir)) {
 				var currentDir = this.getCurrentDirectory();
 				// this._currentDirectory is NULL when fileList is first initialised
@@ -1407,7 +1409,7 @@
 				fileData,
 				newTrs = [],
 				isAllSelected = this.isAllSelected(),
-				showHidden = this._filesConfig.get('showhidden');
+				showHidden = this._filesConfig.show_hidden;
 
 			if (index >= this.files.length) {
 				return false;
@@ -2371,7 +2373,7 @@
 			 * Images are cropped to a square by default. Append a=1 to the URL
 			 *  if the user wants to see images with original aspect ratio.
 			 */
-			urlSpec.a = this._filesConfig.get('cropimagepreviews') ? 0 : 1;
+			urlSpec.a = this._filesConfig.crop_image_previews ? 0 : 1;
 
 			if (typeof urlSpec.fileId !== 'undefined') {
 				delete urlSpec.file;
@@ -3295,7 +3297,7 @@
 
 			this.$el.find('tfoot').append($tr);
 
-			return new OCA.Files.FileSummary($tr, {config: this._filesConfig});
+			return new OCA.Files.FileSummary($tr, { config: this._filesConfig });
 		},
 		updateEmptyContent: function() {
 			var permissions = this.getDirectoryPermissions();
@@ -3443,7 +3445,7 @@
 			var summary = this._selectionSummary.summary;
 			var selection;
 
-			var showHidden = !!this._filesConfig.get('showhidden');
+			var showHidden = !!this._filesConfig.show_hidden;
 			if (summary.totalFiles === 0 && summary.totalDirs === 0) {
 				this.$el.find('.column-name a.name>span:first').text(t('files','Name'));
 				this.$el.find('.column-size a>span:first').text(t('files','Size'));
diff --git a/apps/files/js/filesummary.js b/apps/files/js/filesummary.js
index 54d038d86c6..00f13249ff3 100644
--- a/apps/files/js/filesummary.js
+++ b/apps/files/js/filesummary.js
@@ -36,10 +36,12 @@
 		this.$el = $tr;
 		var filesConfig = options.config;
 		if (filesConfig) {
-			this._showHidden = !!filesConfig.get('showhidden');
-			filesConfig.on('change:showhidden', function() {
-				self._showHidden = !!this.get('showhidden');
-				self.update();
+			this._showHidden = !!filesConfig.show_hidden;
+			window._nc_event_bus.subscribe('files:config:updated', ({ key, value }) => {
+				if (key === 'show_hidden') {
+					self._showHidden = !!value;
+					self.update();
+				}
 			});
 		}
 		this.clear();