Added "Custom Theme Configuration" (background)

dev/App/User.js

@@ -99,6 +99,14 @@
 
 		}, {}, 60 * 60 * 1000);
 
+		if (Settings.settingsGet('UserBackgroundHash'))
+		{
+			_.delay(function () {
+				$('#rl-bg').backstretch(Links.publicLink(Settings.settingsGet('UserBackgroundHash')), {
+					'fade': Globals.bAnimationSupported ? 1000 : 0
+				});
+			}, 3000);
+		}
 
 		this.socialUsers = _.bind(this.socialUsers, this);
 	}

dev/Common/Base64.js

@@ -1,3 +1,4 @@
+
 // Base64 encode / decode
 // http://www.webtoolkit.info/
 

dev/Common/Enums.js

@@ -15,6 +15,15 @@
 		'Unload': 'unload'
 	};
 
+	/**
+	 * @enum {number}
+	 */
+	Enums.SpoolerType = {
+		'Delay': 0,
+		'MessageList': 1,
+		'Move': 2
+	};
+
 	/**
 	 * @enum {number}
 	 */

dev/Common/Links.js

@@ -152,6 +152,15 @@
 		return this.sServer + '/Raw/0/Avatar/' + Utils.encodeURIComponent(sEmail) + '/';
 	};
 
+	/**
+	 * @param {string} sHash
+	 * @return {string}
+	 */
+	Links.prototype.publicLink = function (sHash)
+	{
+		return this.sServer + '/Raw/0/Public/' + sHash + '/';
+	};
+
 	/**
 	 * @param {string} sInboxFolderName = 'INBOX'
 	 * @return {string}

dev/Common/Utils.js

@@ -1031,6 +1031,8 @@
 
 		oData.theme = ko.observable('');
 		oData.themes = ko.observableArray([]);
+		oData.themeBackgroundName = ko.observable('');
+		oData.themeBackgroundHash = ko.observable('');
 
 		oData.mainTheme = ko.computed({
 			'read': oData.theme,
@@ -2074,7 +2076,7 @@
 	Utils.__themeTimer = 0;
 	Utils.__themeAjax = null;
 
-	Utils.changeTheme = function (sValue, themeTrigger)
+	Utils.changeTheme = function (sValue, sHash, themeTrigger, Links)
 	{
 		var
 			oThemeLink = $('#rlThemeLink'),
@@ -2091,6 +2093,7 @@
 		{
 			sUrl = sUrl.toString().replace(/\/-\/[^\/]+\/\-\//, '/-/' + sValue + '/-/');
 			sUrl = sUrl.toString().replace(/\/Css\/[^\/]+\/User\//, '/Css/0/User/');
+			sUrl = sUrl.toString().replace(/\/Hash\/[^\/]+\//, '/Hash/-/');
 
 			if ('Json/' !== sUrl.substring(sUrl.length - 5, sUrl.length))
 			{
@@ -2122,7 +2125,7 @@
 					if (oThemeStyle && oThemeStyle[0])
 					{
 						oThemeStyle.attr('data-href', sUrl).attr('data-theme', aData[0]);
-						if (oThemeStyle && oThemeStyle[0] && oThemeStyle[0].styleSheet && !Utils.isUnd(oThemeStyle[0].styleSheet.cssText))
+						if (oThemeStyle[0].styleSheet && !Utils.isUnd(oThemeStyle[0].styleSheet.cssText))
 						{
 							oThemeStyle[0].styleSheet.cssText = aData[1];
 						}
@@ -2132,6 +2135,26 @@
 						}
 					}
 
+					if (Links)
+					{
+						var $oBg = $('#rl-bg');
+						if (!sHash)
+						{
+							if ($oBg.data('backstretch'))
+							{
+								$oBg.backstretch('destroy').attr('style', '');
+							}
+						}
+						else
+						{
+							$oBg.backstretch(Links.publicLink(sHash), {
+								'fade': Globals.bAnimationSupported ? 1000 : 0,
+								'centeredX': true,
+								'centeredY': true
+							});
+						}
+					}
+
 					themeTrigger(Enums.SaveSettingsStep.TrueResult);
 				}
 

dev/Settings/Admin/General.js

@@ -89,7 +89,7 @@
 
 			self.theme.subscribe(function (sValue) {
 
-				Utils.changeTheme(sValue, self.themeTrigger);
+				Utils.changeTheme(sValue, '', self.themeTrigger);
 
 				Remote.saveAdminConfig(f3, {
 					'Theme': Utils.trim(sValue)

dev/Settings/User/Themes.js

@@ -7,6 +7,8 @@
 		_ = require('_'),
 		ko = require('ko'),
 
+		Jua = require('Jua'),
+
 		Enums = require('Common/Enums'),
 		Utils = require('Common/Utils'),
 		Links = require('Common/Links'),
@@ -20,11 +22,18 @@
 	 */
 	function ThemesUserSettings()
 	{
-		var self = this;
-
 		this.mainTheme = Data.mainTheme;
 		this.themesObjects = ko.observableArray([]);
 
+		this.background = {};
+		this.background.name = Data.themeBackgroundName;
+		this.background.hash = Data.themeBackgroundHash;
+		this.background.uploaderButton = ko.observable(null);
+		this.background.loading = ko.observable(false);
+		this.background.error = ko.observable('');
+
+		this.capaUserBackground = Data.capaUserBackground;
+
 		this.themeTrigger = ko.observable(Enums.SaveSettingsStep.Idle).extend({'throttle': 100});
 
 		this.iTimer = 0;
@@ -36,13 +45,17 @@
 				oTheme.selected(sValue === oTheme.name);
 			});
 
-			Utils.changeTheme(sValue, self.themeTrigger);
+			Utils.changeTheme(sValue, this.background.hash(), this.themeTrigger, Links);
 
 			Remote.saveSettings(null, {
 				'Theme': sValue
 			});
 
 		}, this);
+
+		this.background.hash.subscribe(function (sValue) {
+			Utils.changeTheme(Data.theme(), sValue, this.themeTrigger, Links);
+		}, this);
 	}
 
 	ThemesUserSettings.prototype.onBuild = function ()
@@ -56,6 +69,93 @@
 				'themePreviewSrc': Links.themePreviewLink(sTheme)
 			};
 		}));
+
+		this.initUploader();
+	};
+
+	ThemesUserSettings.prototype.onShow = function ()
+	{
+		this.background.error('');
+	};
+
+	ThemesUserSettings.prototype.clearBackground = function ()
+	{
+		if (this.capaUserBackground())
+		{
+			var self = this;
+			Remote.clearUserBackground(function () {
+				self.background.name('');
+				self.background.hash('');
+			});
+		}
+	};
+
+	ThemesUserSettings.prototype.initUploader = function ()
+	{
+		if (this.background.uploaderButton() && this.capaUserBackground())
+		{
+			var
+				oJua = new Jua({
+					'action': Links.uploadBackground(),
+					'name': 'uploader',
+					'queueSize': 1,
+					'multipleSizeLimit': 1,
+					'disableDragAndDrop': true,
+					'disableMultiple': true,
+					'clickElement': this.background.uploaderButton()
+				})
+			;
+
+			oJua
+				.on('onStart', _.bind(function () {
+
+					this.background.loading(true);
+					this.background.error('');
+
+					return true;
+
+				}, this))
+				.on('onComplete', _.bind(function (sId, bResult, oData) {
+
+					this.background.loading(false);
+
+					if (bResult && sId && oData && oData.Result && oData.Result.Name && oData.Result.Hash)
+					{
+						this.background.name(oData.Result.Name);
+						this.background.hash(oData.Result.Hash);
+					}
+					else
+					{
+						this.background.name('');
+						this.background.hash('');
+
+						var sError = '';
+						if (oData.ErrorCode)
+						{
+							switch (oData.ErrorCode)
+							{
+								case Enums.UploadErrorCode.FileIsTooBig:
+									sError = Utils.i18n('SETTINGS_THEMES/ERROR_FILE_IS_TOO_BIG');
+									break;
+								case Enums.UploadErrorCode.FileType:
+									sError = Utils.i18n('SETTINGS_THEMES/ERROR_FILE_TYPE_ERROR');
+									break;
+							}
+						}
+
+						if (!sError && oData.ErrorMessage)
+						{
+							sError = oData.ErrorMessage;
+						}
+
+						this.background.error(sError || Utils.i18n('SETTINGS_THEMES/ERROR_UNKNOWN'));
+					}
+
+					return true;
+
+				}, this))
+			;
+		}
 	};
 
 	module.exports = ThemesUserSettings;

dev/Storage/AbstractData.js

@@ -39,6 +39,8 @@
 
 		this.mainLanguage(Settings.settingsGet('Language'));
 		this.mainTheme(Settings.settingsGet('Theme'));
+		this.themeBackgroundName(Settings.settingsGet('UserBackgroundName'));
+		this.themeBackgroundHash(Settings.settingsGet('UserBackgroundHash'));
 
 		this.capaAdditionalAccounts(Settings.capa(Enums.Capa.AdditionalAccounts));
 		this.capaAdditionalIdentities(Settings.capa(Enums.Capa.AdditionalIdentities));

dev/Storage/AbstractRemote.js

@@ -240,7 +240,7 @@
 
 		Plugins.runHook('ajax-default-request', [sAction, oParameters, sGetAdd]);
 
-		this.ajaxRequest(fCallback, oParameters,
+		return this.ajaxRequest(fCallback, oParameters,
 			Utils.isUnd(iTimeout) ? Consts.Defaults.DefaultAjaxTimeout : Utils.pInt(iTimeout), sGetAdd, aAbortActions);
 	};
 

dev/Storage/User/Remote.js

@@ -244,7 +244,7 @@
 
 		if ('' !== sFolderHash && ('' === sSearch || -1 === sSearch.indexOf('is:')))
 		{
-			this.defaultRequest(fCallback, 'MessageList', {},
+			return this.defaultRequest(fCallback, 'MessageList', {},
 				'' === sSearch ? Consts.Defaults.DefaultAjaxTimeout : Consts.Defaults.SearchAjaxTimeout,
 				'MessageList/' + Base64.urlsafe_encode([
 					sFolderFullNameRaw,
@@ -260,7 +260,7 @@
 		}
 		else
 		{
-			this.defaultRequest(fCallback, 'MessageList', {
+			return this.defaultRequest(fCallback, 'MessageList', {
 				'Folder': sFolderFullNameRaw,
 				'Offset': iOffset,
 				'Limit': iLimit,
@@ -716,6 +716,9 @@
 
 	/**
 	 * @param {?Function} fCallback
+	 * @param {string} sRequestUid
+	 * @param {string} sUid
+	 * @param {Array} aProperties
 	 */
 	RemoteUserStorage.prototype.contactSave = function (fCallback, sRequestUid, sUid, aProperties)
 	{
@@ -750,6 +753,14 @@
 		}, null, '', ['Suggestions']);
 	};
 
+	/**
+	 * @param {?Function} fCallback
+	 */
+	RemoteUserStorage.prototype.clearUserBackground = function (fCallback)
+	{
+		this.defaultRequest(fCallback, 'ClearUserBackground');
+	};
+
 	/**
 	 * @param {?Function} fCallback
 	 */

dev/Storage/User/Spooler.js

@@ -0,0 +1,20 @@
+
+(function () {
+
+	'use strict';
+
+	var
+		queue = require('queue')
+	;
+
+	/**
+	 * @constructor
+	 */
+	function Spooler()
+	{
+		this.queue = queue(1);
+	}
+
+	module.exports = new Spooler();
+
+}());