summaryrefslogtreecommitdiff
path: root/frontend/gamma/js/Clipperz/PM/UI/Mobile/Components/LoginForm.js
Unidiff
Diffstat (limited to 'frontend/gamma/js/Clipperz/PM/UI/Mobile/Components/LoginForm.js') (more/less context) (ignore whitespace changes)
-rw-r--r--frontend/gamma/js/Clipperz/PM/UI/Mobile/Components/LoginForm.js142
1 files changed, 84 insertions, 58 deletions
diff --git a/frontend/gamma/js/Clipperz/PM/UI/Mobile/Components/LoginForm.js b/frontend/gamma/js/Clipperz/PM/UI/Mobile/Components/LoginForm.js
index 3aeac0c..da864eb 100644
--- a/frontend/gamma/js/Clipperz/PM/UI/Mobile/Components/LoginForm.js
+++ b/frontend/gamma/js/Clipperz/PM/UI/Mobile/Components/LoginForm.js
@@ -46,3 +46,4 @@ Clipperz.PM.UI.Mobile.Components.LoginForm = function(args) {
46 46
47Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.LoginForm, Clipperz.PM.UI.Common.Components.BaseComponent, { 47//Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.LoginForm, Clipperz.PM.UI.Common.Components.BaseComponent, {
48Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.LoginForm, Clipperz.PM.UI.Mobile.Components.BaseComponent, {
48 49
@@ -113,8 +114,8 @@ Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.LoginForm, Clipperz.PM.UI.
113 114
114 if (aValue == null) { 115 // if (aValue == null) {
115 MochiKit.Style.hideElement(this.getElement('credentialsMessage')); 116 // MochiKit.Style.hideElement(this.getElement('credentialsMessage'));
116 } else { 117 // } else {
117 this.getElement('message').innerHTML = aValue; 118 // this.getElement('message').innerHTML = aValue;
118 MochiKit.Style.showElement(this.getElement('credentialsMessage')); 119 // MochiKit.Style.showElement(this.getElement('credentialsMessage'));
119 } 120 // }
120 }, 121 },
@@ -123,3 +124,3 @@ Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.LoginForm, Clipperz.PM.UI.
123 this._setMessage(aValue); 124 this._setMessage(aValue);
124 MochiKit.DOM.removeElementClass(this.getElement('credentialsMessage'), 'error'); 125 // MochiKit.DOM.removeElementClass(this.getElement('credentialsMessage'), 'error');
125 }, 126 },
@@ -128,3 +129,3 @@ Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.LoginForm, Clipperz.PM.UI.
128 this._setMessage(aValue); 129 this._setMessage(aValue);
129 MochiKit.DOM.addElementClass(this.getElement('credentialsMessage'), 'error'); 130 // MochiKit.DOM.addElementClass(this.getElement('credentialsMessage'), 'error');
130 }, 131 },
@@ -138,4 +139,21 @@ Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.LoginForm, Clipperz.PM.UI.
138 139
140 'show': function (args) {
141 this.updateWithArgs(args);
142
143 if (this.mode() == 'PIN') {
144 this.setPin('');
145 this.getElement('PIN').focus();
146 } else if (this.mode() == 'CREDENTIALS') {
147 if (this.getElement('usernameField').value.length == 0) {
148 this.getElement('usernameField').focus();
149 } else {
150 this.getElement('passphraseField').focus();
151 this.getElement('passphraseField').select();
152 }
153 }
154 },
155
139 'showErrors': function (args) { 156 'showErrors': function (args) {
140 if (args['previousFailedAttempt'] == 'LOGIN') { 157 if (args['previousFailedAttempt'] == 'LOGIN') {
158 $(this.getAnchor('credentialsSubmitButton')).button('enable');
141 this.setErrorMessage("Wrong credentials"); 159 this.setErrorMessage("Wrong credentials");
@@ -153,29 +171,6 @@ Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.LoginForm, Clipperz.PM.UI.
153 'updateWithArgs': function (args) { 171 'updateWithArgs': function (args) {
154 this.renderIfNeeded(); 172 this.renderOnlyOnce();
155 this.setCallbacks(args); 173 this.setCallbacks(args);
156 this.showErrors(args); 174 this.showErrors(args);
157 this.updateRendering(); 175 // this.updateRendering();
158 },
159
160 'showPinLogin': function (args) {
161 this.setPin('');
162 this.setMode('PIN');
163 this.updateWithArgs(args);
164
165 // $(this.getAnchor('PIN')).focus();
166 this.getElement('PIN').focus();
167 },
168
169 'showCredentialsLogin': function (args) {
170 this.setMode('CREDENTIALS');
171 this.updateWithArgs(args);
172
173 if (this.getElement('usernameField').value.length == 0) {
174 // $(this.getAnchor('usernameField')).focus();
175 this.getElement('usernameField').focus();
176 } else {
177 // $(this.getAnchor('passphraseField')).focus();
178 this.getElement('passphraseField').focus();
179 this.getElement('passphraseField').select();
180 }
181 }, 176 },
@@ -184,3 +179,3 @@ Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.LoginForm, Clipperz.PM.UI.
184 179
185 'renderIfNeeded': function () { 180 'renderOnlyOnce': function () {
186 if (this.isFullyRendered() == false) { 181 if (this.isFullyRendered() == false) {
@@ -188,5 +183,5 @@ Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.LoginForm, Clipperz.PM.UI.
188 }; 183 };
189 this.updateRendering(); 184 // this.updateRendering();
190 }, 185 },
191 186/*
192 'updateRendering': function () { 187 'updateRendering': function () {
@@ -198,3 +193,4 @@ Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.LoginForm, Clipperz.PM.UI.
198 if (this.mode() == 'CREDENTIALS') { 193 if (this.mode() == 'CREDENTIALS') {
199 selectedPanel = this.getElement('credentials') 194 selectedPanel = this.getElement('credentials');
195 $(this.getAnchor('credentialsSubmitButton')).button('enable');
200 } else if (this.mode() == 'PIN') { 196 } else if (this.mode() == 'PIN') {
@@ -205,14 +201,15 @@ Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.LoginForm, Clipperz.PM.UI.
205 } 201 }
206 MochiKit.Style.showElement(selectedPanel);
207 202
203 MochiKit.Style.showElement(selectedPanel);
208 MochiKit.Style.hideElement(this.getElement('validating')); 204 MochiKit.Style.hideElement(this.getElement('validating'));
209 }, 205 },
210 206*/
211 'renderSelf': function() { 207/*
208 '_renderSelf': function() {
212 var selectedPanel; 209 var selectedPanel;
213 this.append(this.element(), {tag:'div', id:'login', children:[ 210 this.append(this.element(), {tag:'div', id:'login', children:[
214 {tag:'div', cls:'toolbar', children:[ 211 {tag:'div', cls:'toolbar text-center', children:[
215 {tag:'h1', html:"clipperz"} 212 {tag:'h1', cls:'clipperz', html:"clipperz"}
216 ]}, 213 ]},
217 {tag:'div', cls:'scroll', children:[ 214 {tag:'div', cls:'', children:[
218 //================================================================== 215 //==================================================================
@@ -225,3 +222,3 @@ Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.LoginForm, Clipperz.PM.UI.
225 {tag:'div', cls:'pin', id:this.getId('pin'), children:[ 222 {tag:'div', cls:'pin', id:this.getId('pin'), children:[
226 {tag:'form', cls:'scroll', id:this.getId('pinForm'), children:[ 223 {tag:'form', cls:'', id:this.getId('pinForm'), children:[
227 {tag:'ul', cls:'edit rounded', children:[ 224 {tag:'ul', cls:'edit rounded', children:[
@@ -234,10 +231,11 @@ Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.LoginForm, Clipperz.PM.UI.
234 {tag:'div', cls:'credentials', id:this.getId('credentials'), children:[ 231 {tag:'div', cls:'credentials', id:this.getId('credentials'), children:[
235 {tag:'form', cls:'scroll', id:this.getId('credentialsForm'), children:[ 232 {tag:'form', cls:'text-center', id:this.getId('credentialsForm'), children:[
236 {tag:'ul', cls:'edit rounded', children:[ 233 {tag:'fieldset', children:[
237 {tag:'li', children:[{tag:'input', type:'email', name:'name', /*value:'joe',*/ placeholder:"username", id:this.getId('usernameField') }]}, 234 // {tag:'legend', html:"Legend"},
238 {tag:'li', children:[{tag:'input', type:'password', name:'passphrase', /*value:'clipperz',*/placeholder:"passphrase", id:this.getId('passphraseField') }]} 235 {tag:'input', type:'email', name:'name', /*value:'joe',* / placeholder:"username", id:this.getId('usernameField') },
236 // {tag:'span', cls:'help-block', html:"Example of help text here"},
237 {tag:'input', type:'password', name:'passphrase', /*value:'clipperz',* /placeholder:"passphrase", id:this.getId('passphraseField') },
239 ]}, 238 ]},
240 {tag:'a', href:'#', cls:'greenButton', id:this.getId('credentialsSubmitButton'), html:"Login"}
241 // {tag:'input', type:'submit', cls:'greenButton', id:this.getId('credentialsSubmitButton'), value:"Login"}
242 239
240 {tag:'button', cls:'btn btn-primary btn-large', type:'submit', id:this.getId('credentialsSubmitButton'), html:"Login"}
243 ]} 241 ]}
@@ -282,2 +280,27 @@ Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.LoginForm, Clipperz.PM.UI.
282 }, 280 },
281*/
282 'renderSelf': function() {
283 if (this.isFullyRendered() == false) {
284 this.append(this.element(), //[
285 // {tag:'div', 'data-role':'header', children:[
286 // {tag:'h1', html:'clipperz'}
287 // ]},
288 // {tag:'div', 'data-role':'content', children:[
289 {tag:'form', id:this.getId('credentialsForm'), children:[
290 {tag:'div', 'data-role':'fieldcontain', cls:'ui-hide-label', children:[
291 {tag:'label', 'for':'name', cls:'ui-input-text', html:"username"},
292 {tag:'input', type:'email', name:'name', /*value:'joe',*/ placeholder:"username", id:this.getId('usernameField') },
293 {tag:'label', 'for':'passphrase', cls:'ui-input-text', html:"passphrase"},
294 {tag:'input', type:'password', name:'passphrase', /*value:'clipperz',*/placeholder:"passphrase", id:this.getId('passphraseField') }
295 ]},
296 {tag:'button', type:'submit', id:this.getId('credentialsSubmitButton'), html:"login"}
297 ]}
298 // ]}
299 // ]
300 );
301
302 MochiKit.Signal.connect(this.getElement('credentialsForm'), 'onsubmit', this, 'submitCredentialsHandler');
303 MochiKit.Signal.connect(this.getElement('credentialsSubmitButton'), 'onclick', this, 'submitCredentialsHandler');
304 }
305 },
283 306
@@ -290,4 +313,4 @@ Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.LoginForm, Clipperz.PM.UI.
290 pin = this.getElement('PIN').value; 313 pin = this.getElement('PIN').value;
291 // $(this.getAnchor('PIN')).blur(); 314 $(this.getAnchor('PIN')).blur();
292 this.getElement('PIN').blur(); 315 // this.getElement('PIN').blur();
293 316
@@ -300,3 +323,8 @@ Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.LoginForm, Clipperz.PM.UI.
300 323
301 this.setMessage(null); 324 anEvent.preventDefault();
325
326 // this.setMessage(null);
327 $(this.getAnchor('usernameField')).blur();
328 $(this.getAnchor('passphraseField')).blur();
329 $(this.getAnchor('credentialsSubmitButton')).button('disable');
302 330
@@ -305,4 +333,2 @@ Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.LoginForm, Clipperz.PM.UI.
305 credentials['passphrase'] = this.getElement('passphraseField').value; 333 credentials['passphrase'] = this.getElement('passphraseField').value;
306 // $(this.getAnchor('passphraseField')).blur();
307 this.getElement('passphraseField').blur();
308 334
@@ -320,4 +346,4 @@ Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.LoginForm, Clipperz.PM.UI.
320 346
321 MochiKit.Style.hideElement(this.getElement('credentialsBody')); 347 // MochiKit.Style.hideElement(this.getElement('credentialsBody'));
322 MochiKit.Style.showElement(this.getElement('validating')); 348 // MochiKit.Style.showElement(this.getElement('validating'));
323 349