Make background toggle button optional

Fixes #226

4 files changed, 109 insertions, 60 deletions

diff --git a/js/app.js b/js/app.js
index b6f90612..cdf93b6d 100644
--- a/js/app.js
+++ b/js/app.js
@@ -27,7 +27,12 @@ $(document).ready(function () {
 				var currentLocation = window.location.href.split('#')[1] || '';
 				Gallery.getFiles(currentLocation).then(function () {
 					Gallery.activeSlideShow = new SlideShow();
-					$.when(Gallery.activeSlideShow.init(false, null))
+					$.when(
+							Gallery.activeSlideShow.init(
+								false,
+								null,
+								Gallery.config.galleryFeatures
+							))
 						.then(function () {
 							window.onhashchange();
 						});
diff --git a/js/galleryfileaction.js b/js/galleryfileaction.js
index 8b140961..b08b9b62 100644
--- a/js/galleryfileaction.js
+++ b/js/galleryfileaction.js
@@ -2,7 +2,7 @@
 (function ($, OC, OCA, oc_requesttoken) {
 	"use strict";
 	var galleryFileAction = {
-		config: null,
+		features: [],
 		mediaTypes: {},
 		scrollContainer: null,
 		slideShow: null,
@@ -52,6 +52,25 @@
 		},
 
 		/**
+		 * Prepares the features array
+		 *
+		 * @param configFeatures
+		 * @returns {Array}
+		 */
+		buildFeaturesList: function (configFeatures) {
+			var features = [];
+			var feature = null;
+			if (!$.isEmptyObject(configFeatures)) {
+				for (var i = 0, keys = Object.keys(configFeatures); i < keys.length; i++) {
+					feature = keys[i];
+					features.push(feature);
+				}
+			}
+
+			window.galleryFileAction.features = features;
+		},
+
+		/**
 		 * Builds an array containing all the images we can show in the slideshow
 		 *
 		 * @param {string} filename
@@ -114,10 +133,13 @@
 
 			if ($.isEmptyObject(galleryFileAction.slideShow)) {
 				galleryFileAction.slideShow = new SlideShow();
-				$.when(galleryFileAction.slideShow.init(false, null))
-					.then(function () {
-						galleryFileAction._startSlideshow(images, start);
-					});
+				$.when(galleryFileAction.slideShow.init(
+					false,
+					null,
+					window.galleryFileAction.features
+				)).then(function () {
+					galleryFileAction._startSlideshow(images, start);
+				});
 			} else {
 				galleryFileAction._startSlideshow(images, start);
 			}
@@ -177,9 +199,7 @@ $(document).ready(function () {
 	// The list of media files is retrieved when the user clicks on a row
 	var url = window.galleryFileAction.buildGalleryUrl('config', '', {extramediatypes: 1});
 	$.getJSON(url).then(function (config) {
-		if (!$.isEmptyObject(config.features)) {
-			window.galleryFileAction.config = config.features;
-		}
+		window.galleryFileAction.buildFeaturesList(config.features);
 		window.galleryFileAction.register(config.mediatypes);
 	});
 });
diff --git a/js/slideshow.js b/js/slideshow.js
index 0266ad9e..7e7dc99f 100644
--- a/js/slideshow.js
+++ b/js/slideshow.js
@@ -25,8 +25,9 @@
 		 *
 		 * @param {bool} autoPlay
 		 * @param {number} interval
+		 * @param {Array} features
 		 */
-		init: function (autoPlay, interval) {
+		init: function (autoPlay, interval, features) {
 			// FIXME: This should come from the configuration
 			/**@param {int} maxScale*/
 			this.maxScale = 1;
@@ -38,7 +39,12 @@
 				this.zoomablePreviewContainer = this.container.find('.bigshotContainer');
 				this.zoomablePreview = new SlideShow.ZoomablePreview(this.container);
 				this.controls =
-					new SlideShow.Controls(this, this.container, this.zoomablePreview, interval);
+					new SlideShow.Controls(
+						this,
+						this.container,
+						this.zoomablePreview,
+						interval,
+						features);
 				this.controls.init();
 
 				this._initControlsAutoFader();
@@ -97,7 +103,7 @@
 			var currentImageId = index;
 			return this.loadImage(this.images[index]).then(function (img) {
 				this.container.css('background-position', '-10000px 0');
-				this.container.find('.changeBackground').show();
+				this.controls.showBackgroundToggle();
 
 				// check if we moved along while we were loading
 				if (currentImageId === index) {
@@ -338,52 +344,52 @@
 				var self = this;
 				var url = OC.generateUrl('apps/gallery/slideshow', null);
 				$.get(url, function (tmpl) {
-					var template = $(tmpl);
-					var tmplButton;
-					var buttonsArray = [
-						{
-							el: '.next',
-							trans: t('gallery', 'Next')
-						},
-						{
-							el: '.play',
-							trans: t('gallery', 'Play')
-						},
-						{
-							el: '.pause',
-							trans: t('gallery', 'Pause')
-						},
-						{
-							el: '.previous',
-							trans: t('gallery', 'Previous')
-						},
-						{
-							el: '.exit',
-							trans: t('gallery', 'Close')
-						},
-						{
-							el: '.downloadImage',
-							trans: t('gallery', 'Download'),
-							toolTip: true
-						},
-						{
-							el: '.changeBackground',
-							trans: t('gallery', 'Toggle background'),
-							toolTip: true
-						}
-					];
-					for (var i = 0; i < buttonsArray.length; i++) {
-						var button = buttonsArray[i];
+						var template = $(tmpl);
+						var tmplButton;
+						var buttonsArray = [
+							{
+								el: '.next',
+								trans: t('gallery', 'Next')
+							},
+							{
+								el: '.play',
+								trans: t('gallery', 'Play')
+							},
+							{
+								el: '.pause',
+								trans: t('gallery', 'Pause')
+							},
+							{
+								el: '.previous',
+								trans: t('gallery', 'Previous')
+							},
+							{
+								el: '.exit',
+								trans: t('gallery', 'Close')
+							},
+							{
+								el: '.downloadImage',
+								trans: t('gallery', 'Download'),
+								toolTip: true
+							},
+							{
+								el: '.changeBackground',
+								trans: t('gallery', 'Toggle background'),
+								toolTip: true
+							}
+						];
+						for (var i = 0; i < buttonsArray.length; i++) {
+							var button = buttonsArray[i];
 
-						tmplButton = template.find(button.el);
-						tmplButton.val(button.trans);
-						if (button.toolTip) {
-							tmplButton.attr("title", button.trans);
+							tmplButton = template.find(button.el);
+							tmplButton.val(button.trans);
+							if (button.toolTip) {
+								tmplButton.attr("title", button.trans);
+							}
 						}
-					}
-					self.$slideshowTemplate = template;
-					defer.resolve(self.$slideshowTemplate);
-				})
+						self.$slideshowTemplate = template;
+						defer.resolve(self.$slideshowTemplate);
+					})
 					.fail(function () {
 						defer.reject();
 					});
diff --git a/js/slideshowcontrols.js b/js/slideshowcontrols.js
index 4b232977..82482b4b 100644
--- a/js/slideshowcontrols.js
+++ b/js/slideshowcontrols.js
@@ -8,15 +8,18 @@
 	 * @param {*} container
 	 * @param {Object} zoomablePreview
 	 * @param {number} interval
+	 * @param {Array} features
 	 * @constructor
 	 */
-	var Controls = function (slideshow, container, zoomablePreview, interval) {
+	var Controls = function (slideshow, container, zoomablePreview, interval, features) {
 		this.slideshow = slideshow;
 		this.container = container;
 		this.zoomablePreview = zoomablePreview;
 		this.progressBar = container.find('.progress');
 		this.interval = interval || 5000;
-
+		if (features.indexOf('background_colour_toggle') > -1) {
+			this.backgroundToggle = true;
+		}
 	};
 
 	Controls.prototype = {
@@ -25,6 +28,7 @@
 		playTimeout: 0,
 		playing: false,
 		active: false,
+		backgroundToggle: false,
 
 		/**
 		 * Initialises the controls
@@ -105,6 +109,15 @@
 		},
 
 		/**
+		 * Shows the background colour switcher, if activated in the configuration
+		 */
+		showBackgroundToggle: function () {
+			if (this.backgroundToggle) {
+				this.container.children('.changeBackground').show();
+			}
+		},
+
+		/**
 		 * Sets up the button based navigation
 		 *
 		 * @param {Function} makeCallBack
@@ -126,7 +139,12 @@
 		 */
 		_specialButtonSetup: function (makeCallBack) {
 			this.container.children('.downloadImage').click(makeCallBack(this._getImageDownload));
-			this.container.children('.changeBackground').click(makeCallBack(this._toggleBackground));
+			if (this.backgroundToggle) {
+				this.container.children('.changeBackground').click(
+					makeCallBack(this._toggleBackground));
+			} else {
+				this.container.children('.changeBackground').hide();
+			}
 		},
 
 		/**
@@ -294,7 +312,7 @@
 			if (history && history.replaceState) {
 				// We simulate a click on the back button in order to be consistent
 				window.history.back();
-			} else{
+			} else {
 				// For ancient browsers supported in core
 				this.stop();
 			}