Updated preferences handling

frontend/delta/css/clipperz.css

@@ -2328,7 +2328,7 @@ span.count {
     border: 0px;
     color: white;
     background-color: black;
-    border-bottom: 1px solid white; }
+    border-bottom: 1px solid #333; }
   #extraFeaturesPanel .extraFeatureContent .preferences select {
     font-size: 12pt; }
   #extraFeaturesPanel .extraFeatureContent .preferences .row {
@@ -2370,8 +2370,7 @@ span.count {
       color: gray; }
       #extraFeaturesPanel .extraFeatureContent .preferences .row.lockTimeout .disabled input {
         color: gray;
-        pointer-events: none;
+        pointer-events: none; }
-        border-bottom: 1px solid gray; }
     #extraFeaturesPanel .extraFeatureContent .preferences .row.lockTimeout .timeUnit {
       padding-left: 8px; }
       #extraFeaturesPanel .extraFeatureContent .preferences .row.lockTimeout .timeUnit:after {

frontend/delta/js/Clipperz/PM/DataModel/User.Header.Preferences.js

@@ -87,6 +87,7 @@ Clipperz.PM.DataModel.User.Header.Preferences.defaultPreferences = {
 			'space': false,
 			'!#?':   true,
 		},
+//		'charset': '',
 	},
 
 	//	legacy preferences

frontend/delta/js/Clipperz/PM/UI/Components/Cards/Detail.js

@@ -39,6 +39,7 @@ Clipperz.PM.UI.Components.Cards.DetailClass = React.createClass({
 			result['ask'] = (this.props['style'] == 'narrow') ? this.props['ask'] : null;
 			result['showGlobalMask'] = this.props['showGlobalMask'];
 			result['allTags'] = this.props['allTags'];
+			result['preferences'] = this.props['preferences'];
 		}
 		
 		return result;

frontend/delta/js/Clipperz/PM/UI/Components/Cards/Edit.js

@@ -533,7 +533,7 @@ console.log("DROP");	//, anEvent);
 					React.DOM.input({'_className_':'_fieldLabel_', 'onChange':this.handleChange(field, 'setLabel'), 'defaultValue':aField['label'], 'placeholder': "label"}),
 				]),
 				React.DOM.div({'className':'fieldValue'}, [
-					(ref == this.state['passwordGeneratorFieldReference']) ? Clipperz.PM.UI.Components.Cards.PasswordGenerator({'field':aField, 'setValueCallback':this.setValueFromPasswordGenerator(field, fieldValueRef), 'closeClallback':this.closePasswordGenerator}) : null,
+					(ref == this.state['passwordGeneratorFieldReference']) ? Clipperz.PM.UI.Components.Cards.PasswordGenerator({'field':aField, 'setValueCallback':this.setValueFromPasswordGenerator(field, fieldValueRef), 'closeClallback':this.closePasswordGenerator, 'preferences':this.props['preferences']}) : null,
 					Clipperz.PM.UI.Components.Cards.TextArea({'className':Clipperz.PM.UI.Components.classNames(cardFieldValueClasses), 'onChange':this.handleChange(field, 'setValue'), 'onKeyDown':this.handleKeyDown(field), 'defaultValue':aField['value'], 'placeholder':(aField['actionType'].toLowerCase() == 'password')?'':"value", 'ref':fieldValueRef}),
 				])
 			]),
@@ -608,7 +608,6 @@ console.log("DROP");	//, anEvent);
 			'edit':	true
 		}
 
-//console.log("RENDER CARD EDIT", this.props['showGlobalMask']);
 		return	React.DOM.div({'className':'editWrapper'}, [
 			this.props['showGlobalMask'] ? null : React.DOM.div({'className':'mask'}),
 			React.DOM.div({'className':Clipperz.PM.UI.Components.classNames(classes)},[

frontend/delta/js/Clipperz/PM/UI/Components/Cards/PasswordGenerator.js

@@ -38,14 +38,15 @@ Clipperz.PM.UI.Components.Cards.PasswordGeneratorClass = React.createClass({
 
 	getInitialState: function () {
 		return {
-			'length':		24,
+			'length':		this.props['preferences'].getValue('passwordGenerator.length'),
 			'options':		'closed',
-			'chars_AZ':		true,
+			'chars_AZ':		this.props['preferences'].getValue('passwordGenerator.characters.A-Z'),
-			'chars_az':		true,
+			'chars_az':		this.props['preferences'].getValue('passwordGenerator.characters.a-z'),
-			'chars_09':		true,
+			'chars_09':		this.props['preferences'].getValue('passwordGenerator.characters.0-9'),
-			'chars_space':	false,
+			'chars_space':	this.props['preferences'].getValue('passwordGenerator.characters.space'),
-			'chars_other':	true,
+			'chars_other':	this.props['preferences'].getValue('passwordGenerator.characters.!#?'),
 
+//			'charset':		this.props['preferences'].getValue('passwordGenerator.charset'),
 			'charset':	'',
 			'password':	'',
 			'entropy':	0,
@@ -154,10 +155,6 @@ Clipperz.PM.UI.Components.Cards.PasswordGeneratorClass = React.createClass({
 		}
 	},
 
-//	isPasswordField: function () {
-//		return this.props['field']['actionType'] == 'PASSWORD';
-//	},
-
 	componentDidMount: function () {
 		this.updateCharset();
 		this.refreshPasswordValue();
@@ -208,7 +205,6 @@ Clipperz.PM.UI.Components.Cards.PasswordGeneratorClass = React.createClass({
 						React.DOM.div({'className':'button setPasswordValue', 'onClick':this.setPasswordValue},     "set password"),
 						React.DOM.div({'className':'button generatePassword', 'onClick':this.refreshPasswordValue}, "generate password"),
 					]),
-//					React.DOM.div({'className':'button setValue', 'onClick':this.setPasswordValue})
 				])
 			])
 		]);

frontend/delta/js/Clipperz/PM/UI/Components/ExtraFeatures/Preferences.js

@@ -32,7 +32,7 @@ Clipperz.PM.UI.Components.ExtraFeatures.PreferencesClass = React.createClass({
 	//============================================================================
 
 	preference: function (aKeyPath) {
-		return this.props['userInfo']['preferences'].getValue(aKeyPath);
+		return this.props['preferences'].getValue(aKeyPath);
 	},
 
 	setPreference: function (aKeyPath) {
@@ -92,10 +92,8 @@ console.log("ESCAPE");
 
 	render: function () {
 		var result;
-//console.log("PREFERENCES", this.props['userInfo']['preferences']);
+		if (! this.props['preferences']) {
-
+			result = React.DOM.p({}, "spinner...");	//	TODO: replace with actual spinner (if actually needed)
-		if (! this.props['userInfo']['preferences']) {
-			result = React.DOM.p({}, "spinner...");
 		} else {
 			result = React.DOM.div({'className':'extraFeature preferences'}, [
 				React.DOM.div({'className':'header'}, [
@@ -142,7 +140,11 @@ console.log("ESCAPE");
 									React.DOM.li({'key':'0-9'},   [ React.DOM.span({'className':'clickable', 'onClick':this.checkboxClick('0-9')},   "0-9"),   React.DOM.input({'type':'checkbox', 'defaultChecked':this.preference('passwordGenerator.characters.0-9'),   'onChange':this.setPreference('passwordGenerator.characters.0-9'),   'ref':'0-9'}) ]),
 									React.DOM.li({'key':'space'}, [ React.DOM.span({'className':'clickable', 'onClick':this.checkboxClick('space')}, "space"), React.DOM.input({'type':'checkbox', 'defaultChecked':this.preference('passwordGenerator.characters.space'), 'onChange':this.setPreference('passwordGenerator.characters.space'), 'ref':'space'}) ]),
 									React.DOM.li({'key':'!#?'},   [ React.DOM.span({'className':'clickable', 'onClick':this.checkboxClick('!#?')},   "!#?"),   React.DOM.input({'type':'checkbox', 'defaultChecked':this.preference('passwordGenerator.characters.!#?'),   'onChange':this.setPreference('passwordGenerator.characters.!#?'),   'ref':'!#?'}) ]),
-								])
+								]),
+//								React.DOM.p({}, [
+//									React.DOM.span({}, "Charset"),
+//									React.DOM.input({'type':'text', 'defaultValue':this.preference('passwordGenerator.charset'), 'onKeyDown':this.handleKeyDown('passwordGenerator.charset')}),
+//								]),
 							]),
 						]),
 

frontend/delta/js/Clipperz/PM/UI/Components/Panels/ExtraFeaturesPanel.js

@@ -101,7 +101,6 @@ Clipperz.PM.UI.Components.Panels.ExtraFeaturesPanelClass = React.createClass({
 	},
 
 	extraFeaturesProps: function () {
-// console.log("ExtraFeaturesPanel, extraFeaturesProps:",this.props);
 		return this.props;
 	},
 
@@ -117,18 +116,13 @@ Clipperz.PM.UI.Components.Panels.ExtraFeaturesPanelClass = React.createClass({
 	},
 
 	showExtraFeatureContent: function (aComponent, aComponentName) {
-// console.log("ExtraFeaturesPanel, showExtraFeatureContent")
 		if (aComponentName == 'OTP') {
 			MochiKit.Signal.signal(Clipperz.Signal.NotificationCenter, 'updateOTPListAndDetails');
 		}
-		if (aComponentName == 'Preferences') {
-			MochiKit.Signal.signal(Clipperz.Signal.NotificationCenter, 'updatePreferences');
-		}
 		
 		this.setState({
 			'isFullyOpen':true,
 			'extraFeatureComponentName': aComponentName,
-			// 'extraFeatureContent': aComponent(this.extraFeaturesProps()),
 			'extraFeatureContentComponent': aComponent // Trying to instantiate the component at every render
 		});
 	},

frontend/delta/js/Clipperz/PM/UI/MainController.js

@@ -25,7 +25,6 @@ refer to http://www.clipperz.com.
 Clipperz.Base.module('Clipperz.PM.UI');
 
 Clipperz.PM.UI.MainController = function() {
-	var	genericPageProperties;
 
 //	this._proxy		= null;
 	this._mediaQueryStyle = "narrow";
@@ -44,6 +43,7 @@ Clipperz.PM.UI.MainController = function() {
 	this._isDesktop = window.screenX != 0 && !this._isTouchDevice;
 	this._hasKeyboard = this._isDesktop;
 
+	this._userPreferences = null;
 	this._recordsInfo = null;
 	this._selectedCards = null;
 
@@ -66,11 +66,10 @@ Clipperz.PM.UI.MainController = function() {
 
 	this.registerForNotificationCenterEvents([
 		'doLogin', 'registerNewUser', 'showRegistrationForm', 'goBack',
-		'logout', 'unlock',
+		'logout',
-		'enableLock', 'disableLock',
+		'enableLock', 'disableLock', 'unlock',
-//		'lock',
 		'changePassphrase', 'deleteAccount',
-		'updatePreferences', 'setPreference',
+		/*'updateUserPreferences',*/ 'setPreference',
 		'updateOTPListAndDetails', 'createNewOTP', 'deleteOTPs', 'changeOTPLabel',
 		'importCards',
 		'downloadExport',
@@ -362,6 +361,7 @@ Clipperz.log("THE BROWSER IS OFFLINE");
 			deferredResult.addMethod(Clipperz.PM.PIN, 'resetFailedAttemptCount');
 		}
 		deferredResult.addMethod(this, 'setUser', user);
+		deferredResult.addMethod(this, 'updateUserPreferences');
 		deferredResult.addMethod(this, 'runApplication');
 		deferredResult.addMethod(this.overlay(), 'done', "", 1);
 		deferredResult.addErrback(MochiKit.Base.method(this, 'genericErrorHandler', someCredentials, "login failed"));
@@ -436,6 +436,7 @@ Clipperz.log("THE BROWSER IS OFFLINE");
 			return aValue;
 		});
 
+		deferredResult.addMethod(this, 'updateUserPreferences');
 		deferredResult.addMethod(this, 'moveInPage', this.currentPage(), 'mainPage');
 		deferredResult.addMethod(this, 'refreshUI');
 		deferredResult.addMethod(unlockPage, 'setProps', {'disabled': false});
@@ -458,6 +459,7 @@ Clipperz.log("THE BROWSER IS OFFLINE");
 		this._recordsInfo = null;
 		this._selectedCards = null;
 		this._selectedCardInfo = null;
+		this._userPreferences = null;
 	},
 
 	//-------------------------------------------------------------------------
@@ -1164,7 +1166,7 @@ Clipperz.log("THE BROWSER IS OFFLINE");
 		};
 	},
 
-	genericPageProperties: function () {
+	deviceProperties: function () {
 		return {
 			'style':			this.mediaQueryStyle(),
 			'isTouchDevice':	this.isTouchDevice(),
@@ -1177,7 +1179,11 @@ Clipperz.log("THE BROWSER IS OFFLINE");
 		var	result;
 		var	extraProperties = null;
 		
-		result = this.genericPageProperties();
+		result = this.deviceProperties();
+
+		if (this.user() != null) {
+			result = MochiKit.Base.update(result, {'preferences': this.userPreferences()});
+		}
 
 		if (aPageName == 'loginPage') {
 			extraProperties = {
@@ -1191,7 +1197,6 @@ Clipperz.log("THE BROWSER IS OFFLINE");
 			extraProperties = {
 				'messageBox':					this.messageBoxContent(),
 				'userInfo':						this.userInfo(),
-//				'preferences':					...
 				'accountInfo':					this.userAccountInfo(),
 				'selectionPanelStatus':			this.isSelectionPanelOpen()	? 'OPEN' : 'CLOSED',
 				'settingsPanelStatus':			this.isSettingsPanelOpen()	? 'OPEN' : 'CLOSED',
@@ -1204,6 +1209,9 @@ Clipperz.log("THE BROWSER IS OFFLINE");
 //				'tags':					…,
 //				'selectedCard':			…,
 			};
+		} else if (aPageName == 'cardDetailPage') {
+			extraProperties = {
+			};
 		} else if (aPageName == 'errorPage') {
 			extraProperties = {
 				'message': ''
@@ -1415,7 +1423,6 @@ Clipperz.log("THE BROWSER IS OFFLINE");
 	},
 
 	refreshCardEditDetail_handler: function (aRecordReference) {
-//console.log("refreshCardEditDetail_handler");
 		this.updateSelectedCard({'reference':aRecordReference}, false, true);
 	},
 
@@ -1450,14 +1457,11 @@ Clipperz.log("THE BROWSER IS OFFLINE");
 		user = new Clipperz.PM.DataModel.User({'username':this.user().username(), 'getPassphraseFunction':getPassphraseDelegate});
 		
 		deferredResult = new Clipperz.Async.Deferred("MainController.changePassphrase_handler", {trace: false});
-//		deferredResult.addMethod(currentPage, 'setProps', {'showGlobalMask':true});
 		deferredResult.addMethod(this.overlay(), 'show', "changing …", true);
 		deferredResult.addMethod(this.user(), 'changePassphrase', getPassphraseDelegate);
 		deferredResult.addMethod(user, 'login');
 		deferredResult.addMethod(this, 'setUser', user);
-//		deferredResult.addMethod(currentPage, 'setProps', {'mode':'view', 'showGlobalMask':false});
 		deferredResult.addMethod(this.overlay(), 'done', "saved", 1);
-		
 		deferredResult.callback();
 		
 		return deferredResult;
@@ -1485,39 +1489,47 @@ Clipperz.log("THE BROWSER IS OFFLINE");
 		return deferredResult;
 	},
 
-	updatePreferences: function() {
+	//----------------------------------------------------------------------------
-		return Clipperz.Async.callbacks("MainController.updatePreferences_handler", [
+	
+	userPreferences: function () {
+		return this._userPreferences;
+	},
+
+	setUserPreferences: function (someValues) {
+		this._userPreferences = someValues;
+		return someValues;
+	},
+
+	updateUserPreferences: function() {
+		return Clipperz.Async.callbacks("MainController.updateUserPreferences", [
 			MochiKit.Base.method(this.user(), 'getPreferences'),
-			MochiKit.Base.bind(function(somePreferences) {
+			MochiKit.Base.method(this, 'setUserPreferences'),
-				return MochiKit.Base.update(this.userInfo(), {'preferences': somePreferences})
-			}, this),
-			MochiKit.Base.bind(function (someUserInfo) {
-				this.pages()['mainPage'].setProps({
-					'userInfo': someUserInfo
-				})
-			}, this),
 		], {trace:false});
 	},
 
-	updatePreferences_handler: function() {
+//	updateUserPreferences_handler: function() {
-		this.updatePreferences();
+//		return Clipperz.Async.callbacks("MainController.updateUserPreferences_handler", [
-	},
+//			MochiKit.Base.method(this, 'updateUserPreferences'),
+//			MochiKit.Base.method(this, 'refreshCurrentPage'),
+//		], {trace:false});
+//	},
 
 	setPreference_handler: function(aKeyPath, aValue) {
 		return Clipperz.Async.callbacks("MainController.setPreference_handler", [
 			MochiKit.Base.method(this.overlay(), 'show', "", true),
 			MochiKit.Base.method(this.user(), 'setPreference', aKeyPath, aValue),
-//			MochiKit.Base.method(this, 'refreshCurrentPage'),
+			MochiKit.Base.method(this, 'updateUserPreferences'),
-			MochiKit.Base.method(this, 'updatePreferences'),
+			MochiKit.Base.method(this, 'refreshCurrentPage'),
 			MochiKit.Base.method(this.overlay(), 'done', "", 0.5),
 		], {trace:false});
 	},
 
+	//----------------------------------------------------------------------------
+
 	importCards_handler: function(data) {
 		return Clipperz.Async.callbacks("MainController.importCards_handler", [
 			MochiKit.Base.method(this.overlay(), 'show', "importing …", true),
 			MochiKit.Base.partial(MochiKit.Signal.signal, Clipperz.Signal.NotificationCenter, 'toggleSettingsPanel'),
-//			MochiKit.Base.method(this.pages()[this.currentPage()], 'setProps', {'mode':'view', 'showGlobalMask':false}),
 			function () { return data; },
 			MochiKit.Base.method(this,'importCards'),
 			MochiKit.Base.method(this.overlay(), 'done', "finished", 1),
@@ -1529,14 +1541,6 @@ Clipperz.log("THE BROWSER IS OFFLINE");
 		return Clipperz.Async.callbacks("MainController.importCards", [
 			function () { return data; },
 			MochiKit.Base.partial(MochiKit.Base.map, MochiKit.Base.method(this.user(), 'createNewRecordFromJSON')),
-
-			// MochiKit.Base.partial(MochiKit.Base.map, MochiKit.Base.bind(function (recordData) {
-			// 	return Clipperz.Async.callbacks("MainController.importCards_handler-newRecord", [
-			// 		MochiKit.Base.method(this.user(), 'createNewRecord'),
-			// 		MochiKit.Base.methodcaller('setUpWithJSON', recordData),
-			// 	], {trace:false})
-			// }, this)),
-			
 			Clipperz.Async.collectAll,
 			MochiKit.Base.method(this.user(), 'saveChanges'),
 			MochiKit.Base.partial(MochiKit.Base.method(this, 'resetRecordsInfo')),
@@ -1671,17 +1675,6 @@ Clipperz.log("THE BROWSER IS OFFLINE");
 	},
 
 	//----------------------------------------------------------------------------
-/*
-	askConfirmation: function (aMessage) {
-		var	deferredResult;
-		
-		deferredResult = new Clipperz.Async.Deferred('MainController.askConfirmation', {trace:false});
-		deferredResult.callback();
-//		deferredResult.cancel();
-		
-		return deferredResult;
-	},
-*/
 	
 	ask: function (someInfo) {
 		var	deferredResult;
@@ -1706,8 +1699,6 @@ Clipperz.log("THE BROWSER IS OFFLINE");
 				newRecord = aValue;
 				return newRecord;
 			},
-//			MochiKit.Base.methodcaller('addField', {'label':"", 'value':"", 'isHidden':false}),
-//			function () { return newRecord; },
 			MochiKit.Base.methodcaller('addField', {'label':"username", 'value':"", 'hidden':false}),
 			function () { return newRecord; },
 			MochiKit.Base.methodcaller('addField', {'label':"password", 'value':"", 'hidden':true}),

frontend/delta/scss/style/settingsPanel.scss

@@ -406,7 +406,7 @@ refer to http://www.clipperz.com.
 				
 				color: white;
 				background-color: black;
-				border-bottom: 1px solid white;
+				border-bottom: 1px solid #333;
 //				border: 0px solid white;
 			}
 			
@@ -450,7 +450,7 @@ refer to http://www.clipperz.com.
 						input {
 							color: $disabledTextColor;
 							pointer-events:none;
-							border-bottom: 1px solid $disabledTextColor;
+//							border-bottom: 1px solid $disabledTextColor;
 						}
 					}