summaryrefslogtreecommitdiff
path: root/frontend/gamma/js/Clipperz/PM/UI/Web/Components/DirectLoginEditingComponent.js
Unidiff
Diffstat (limited to 'frontend/gamma/js/Clipperz/PM/UI/Web/Components/DirectLoginEditingComponent.js') (more/less context) (ignore whitespace changes)
-rw-r--r--frontend/gamma/js/Clipperz/PM/UI/Web/Components/DirectLoginEditingComponent.js481
1 files changed, 481 insertions, 0 deletions
diff --git a/frontend/gamma/js/Clipperz/PM/UI/Web/Components/DirectLoginEditingComponent.js b/frontend/gamma/js/Clipperz/PM/UI/Web/Components/DirectLoginEditingComponent.js
new file mode 100644
index 0000000..d254c29
--- a/dev/null
+++ b/frontend/gamma/js/Clipperz/PM/UI/Web/Components/DirectLoginEditingComponent.js
@@ -0,0 +1,481 @@
1/*
2
3Copyright 2008-2011 Clipperz Srl
4
5This file is part of Clipperz's Javascript Crypto Library.
6Javascript Crypto Library provides web developers with an extensive
7and efficient set of cryptographic functions. The library aims to
8obtain maximum execution speed while preserving modularity and
9reusability.
10For further information about its features and functionalities please
11refer to http://www.clipperz.com
12
13* Javascript Crypto Library is free software: you can redistribute
14 it and/or modify it under the terms of the GNU Affero General Public
15 License as published by the Free Software Foundation, either version
16 3 of the License, or (at your option) any later version.
17
18* Javascript Crypto Library is distributed in the hope that it will
19 be useful, but WITHOUT ANY WARRANTY; without even the implied
20 warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
21 See the GNU Affero General Public License for more details.
22
23* You should have received a copy of the GNU Affero General Public
24 License along with Javascript Crypto Library. If not, see
25 <http://www.gnu.org/licenses/>.
26
27*/
28
29Clipperz.Base.module('Clipperz.PM.UI.Web.Components');
30
31Clipperz.PM.UI.Web.Components.DirectLoginEditingComponent = function(args) {
32 args = args || {};
33
34 Clipperz.PM.UI.Web.Components.DirectLoginEditingComponent.superclass.constructor.apply(this, arguments);
35
36 this._tabPanelController = null;
37
38 this._initiallySelectedTab = args.selected || 'TYPE';
39 this._tabPanelControllerConfiguration = {
40 'LABEL': {
41 tab:'labelTab',
42 panel:'labelTabpanel'
43 },
44 'TYPE': {
45 tab:'typeTab',
46 panel:'typeTabpanel'
47 },
48 'CONFIGURATION': {
49 tab:'configurationTab',
50 panel:'configurationTabpanel'
51 },
52 'BINDINGS': {
53 tab:'bindingsTab',
54 panel:'bindingsTabpanel'
55 },
56 'FAVICON': {
57 tab:'faviconTab',
58 panel:'faviconTabpanel'
59 },
60 'DONE': {
61 tab:'doneTab',
62 panel:'doneTabpanel'
63 }
64 };
65
66 this._directLoginReference = null;
67
68 this._directLoginFavicon = null;
69
70 this._updateFaviconCounter = 0;
71 this._faviconComponent = null;
72
73 this._bindingComponents= [];
74 this._formValueComponents = [];
75
76 return this;
77}
78
79//=============================================================================
80
81//Clipperz.Base.extend(Clipperz.PM.UI.Web.Components.DirectLoginEditingComponent, Clipperz.PM.UI.Common.Components.BaseComponent, {
82Clipperz.Base.extend(Clipperz.PM.UI.Web.Components.DirectLoginEditingComponent, Clipperz.PM.UI.Common.Components.TabPanelComponent, {
83
84 //-------------------------------------------------------------------------
85
86 'toString': function () {
87 return "Clipperz.PM.UI.Web.Components.DirectLoginEditingComponent component";
88 },
89
90 //=========================================================================
91
92 'directLoginReference': function () {
93 return this._directLoginReference;
94 },
95
96 //-------------------------------------------------------------------------
97
98 'setDirectLoginReference': function (aDirectLoginReference) {
99 this._directLoginReference = aDirectLoginReference;
100
101 return this._directLoginReference;
102 },
103
104 //=========================================================================
105
106 'label': function () {
107 return this.getElement('label').value
108 },
109
110 'setLabel': function (aValue) {
111//console.log("##> LABEL: " + aValue);
112 this.getElement('label').value = (aValue ? aValue : '');
113 },
114
115 //-------------------------------------------------------------------------
116
117 'favicon': function () {
118 return this.getElement('faviconURL').value;
119 },
120
121 'setFavicon': function (aValue) {
122 var regexp;
123 var displayValue;
124
125 regexp = new RegExp('^data\:\/\/.*', 'i');
126 if (regexp.test(aValue)) {
127 displayValue = ''
128 } else {
129 displayValue = (aValue ? aValue : '');
130 }
131
132 this.getElement('faviconURL').value = displayValue;
133 this.faviconComponent().setSrc(aValue);
134 },
135
136 //'setFaviconData': function (aValue) {
137 // this.getElement('faviconIcon').src = aValue;
138 //},
139
140 'directLoginFavicon': function () {
141 return this._directLoginFavicon;
142 },
143
144 'setDirectLoginFavicon': function (aValue) {
145 this._directLoginFavicon = aValue;
146 this.setFavicon(aValue);
147 },
148
149 //-------------------------------------------------------------------------
150
151 'bookmarkletConfiguration': function () {
152 return this.getElement('bookmarkletConfiguration').value
153 },
154
155 'setBookmarkletConfiguration': function (aValue) {
156 this.getElement('bookmarkletConfiguration').value = aValue;
157 },
158
159 'highlightConfigurationSyntaxError': function () {
160 MochiKit.DOM.addElementClass(this.getElement('bookmarkletConfiguration'), 'error');
161 },
162
163 'removeHighlightConfigurationSyntaxError': function () {
164 MochiKit.DOM.removeElementClass(this.getElement('bookmarkletConfiguration'), 'error');
165 },
166
167 //=========================================================================
168
169 'disableAllPanels': function () {
170 this.getElement('label').disabled = true;
171 MochiKit.DOM.addElementClass(this.getElement('label').parentNode, 'disabled');
172
173 this.tabPanelController().selectTab(null);
174 },
175
176 //-------------------------------------------------------------------------
177
178 //'disableLabelField': function () {
179 // this.getElement('label').disabled = true;
180 // MochiKit.DOM.addElementClass(this.getElement('label').parentNode, 'disabled');
181 //},
182
183 'enableLabelField': function () {
184 this.getElement('label').disabled = false;
185 MochiKit.DOM.removeElementClass(this.getElement('label').parentNode, 'disabled');
186 this.tabPanelController().selectTab('LABEL');
187 },
188
189 //-------------------------------------------------------------------------
190
191 //'disableTypeField': function () {
192 // this.tabPanelController().selectTab(null);
193 //},
194
195 'enableTypeField': function () {
196 this.tabPanelController().selectTab('TYPE');
197 },
198
199 //-------------------------------------------------------------------------
200
201 //'disableConfigurationField': function () {
202 // this.tabPanelController().selectTab(null);
203 //},
204
205 'enableConfigurationField': function () {
206 this.tabPanelController().selectTab('CONFIGURATION');
207 },
208
209 //-------------------------------------------------------------------------
210
211 //'disableBindingFields': function () {
212 // this.tabPanelController().selectTab(null);
213 //},
214
215 'enableBindingFields': function () {
216 this.tabPanelController().selectTab('BINDINGS');
217 },
218
219 //-------------------------------------------------------------------------
220
221 //'disableFaviconField': function () {
222 // this.tabPanelController().selectTab(null);
223 //},
224
225 'enableFaviconField': function () {
226 this.tabPanelController().selectTab('FAVICON');
227 },
228
229 //-------------------------------------------------------------------------
230
231 'enableDonePanel': function () {
232 this.tabPanelController().selectTab('DONE');
233 },
234
235 //=========================================================================
236
237 'shouldShowElementWhileRendering': function() {
238 return false;
239 },
240
241 //=========================================================================
242
243 'faviconComponent': function () {
244 if (this._faviconComponent == null) {
245 this._faviconComponent = new Clipperz.PM.UI.Common.Components.FaviconComponent({element:this.getId('favicon')});
246 }
247
248 return this._faviconComponent;
249 },
250
251 //=========================================================================
252
253 'tabPanelController': function () {
254 if (this._tabPanelController == null) {
255 this._tabPanelController = new Clipperz.PM.UI.Common.Controllers.TabPanelController({
256 component:this,
257 configuration:this._tabPanelControllerConfiguration
258 });
259
260 MochiKit.Signal.connect(this._tabPanelController, 'tabSelected', this, 'handleTabSelected')
261 }
262
263 return this._tabPanelController;
264 },
265
266 //-------------------------------------------------------------------------
267
268 'renderSelf': function() {
269 varbookmarkletComponent;
270
271 this.append(this.element(), {tag:'div', cls:'directLoginEditing', id:this.getId('panel'), children: [
272 // {tag:'div', cls:'back', children:[
273 // {tag:'a', href:'#', id:this.getId('back'), html:"&nbsp;"}
274 // ]},
275 {tag:'form', id:this.getId('form'), cls:'directLoginEditingForm', children:[
276 {tag:'div', cls:'title', children:[
277 {tag:'img', id:this.getId('favicon'), cls:'favicon'},
278 {tag:'input', type:'text', id:this.getId('label')}//,
279 // {tag:'div', cls:'wizardStepDescription', children:[{tag:'span', html:Clipperz.PM.Strings.getValue('Wizards.DirectLoginWizard.LABEL.description')}]},
280 ]},
281 {tag:'div', cls:'tabContainer', children:[
282 {tag:'ul', cls:'tabs', children:[
283 {tag:'li', id:this.getId('labelTab'), children:[{tag:'span', html:"label"}]},
284 {tag:'li', id:this.getId('typeTab'), children:[{tag:'span', html:"type"}]},
285 {tag:'li', id:this.getId('configurationTab'),children:[{tag:'span', html:"configuration"}]},
286 {tag:'li', id:this.getId('bindingsTab'), children:[{tag:'span', html:"bindings"}]},
287 {tag:'li', id:this.getId('faviconTab'), children:[{tag:'span', html:"favicon"}]},
288 {tag:'li', id:this.getId('doneTab'), children:[{tag:'span', html:"done"}]}
289 ]},
290 {tag:'ul', cls:'tabPanels', children:[
291 {tag:'li', id:this.getId('labelTabpanel'), cls:'tabPanel label', children:[
292 {tag:'div', cls:'wizardStepDescription', children:[{tag:'span', html:Clipperz.PM.Strings.getValue('Wizards.DirectLoginWizard.LABEL.description')}]}
293 ]},
294 {tag:'li', id:this.getId('typeTabpanel'), cls:'tabPanel type', children:[
295 {tag:'div', cls:'wizardStepDescription', children:[{tag:'span', html:Clipperz.PM.Strings.getValue('Wizards.DirectLoginWizard.TYPE.description')}]},
296 {tag:'h2', html:"type"}
297 ]},
298 {tag:'li', id:this.getId('configurationTabpanel'), cls:'tabPanel configuration', children:[
299 {tag:'div', cls:'wizardStepDescription', children:[{tag:'span', html:Clipperz.PM.Strings.getValue('Wizards.DirectLoginWizard.CONFIGURATION.description')}]},
300 {tag:'div', cls:'bookmarkletConfigurationWrapper', children:[
301 {tag:'textarea', id:this.getId('bookmarkletConfiguration'), value:""},
302 // {tag:'div', cls:'bookmarkletComponentWrapper', children:[{tag:'div', id:this.getId('bookmarkletComponent'), cls:'bookmarkletComponent'}]}
303 {tag:'div', id:this.getId('bookmarkletComponent'), cls:'bookmarkletComponent'}
304 ]}
305 ]},
306 {tag:'li', id:this.getId('bindingsTabpanel'), cls:'tabPanel bindings', children:[
307 {tag:'div', cls:'wizardStepDescription', children:[{tag:'span', html:Clipperz.PM.Strings.getValue('Wizards.DirectLoginWizard.BINDINGS.description')}]},
308 {tag:'div', cls:'bindings', id:this.getId('bindings'), children:[]},
309 {tag:'div', cls:'formValues', id:this.getId('formValues'), children:[]}
310 ]},
311 {tag:'li', id:this.getId('faviconTabpanel'), cls:'tabPanel favicon', children:[
312 {tag:'div', cls:'wizardStepDescription', children:[{tag:'span', html:Clipperz.PM.Strings.getValue('Wizards.DirectLoginWizard.FAVICON.description')}]},
313 {tag:'div', cls:'favicon', children:[
314 {tag:'input', type:'text', id:this.getId('faviconURL')}
315 ]}
316 ]},
317 {tag:'li', id:this.getId('doneTabpanel'), cls:'tabPanel done', children:[
318 {tag:'div', cls:'wizardStepDescription', children:[{tag:'span', id:this.getId('doneDescription')/*, html:Clipperz.PM.Strings.getValue('Wizards.DirectLoginWizard.DONE.description')*/}]}
319 ]}
320 ]}
321 ]}
322 ]},
323 {tag:'div', cls:'clear'}
324 ]});
325
326 bookmarkletComponent = new Clipperz.PM.UI.Web.Components.BookmarkletComponent({element:this.getElement('bookmarkletComponent')});
327 bookmarkletComponent.render();
328
329 this.tabPanelController().setup(/*{selected:this.initiallySelectedTab()}*/);
330
331 MochiKit.Signal.connect(this.getId('label'), 'onchange', this, 'changedValue');
332 MochiKit.Signal.connect(this.getId('label'), 'onkeyup', this, 'changedValue');
333
334 MochiKit.Signal.connect(this.getId('bookmarkletConfiguration'),'onchange', this, 'changedValue');
335 MochiKit.Signal.connect(this.getId('bookmarkletConfiguration'),'onkeyup', this, 'changedValue');
336
337 MochiKit.Signal.connect(this.getId('faviconURL'), 'onchange', this, 'changedValue');
338 MochiKit.Signal.connect(this.getId('faviconURL'), 'onkeyup', this, 'changedValue');
339
340 MochiKit.Signal.connect(this.getId('panel'), 'onkeydown',this, 'handleKeyEvent');
341 },
342
343 //-------------------------------------------------------------------------
344
345 'handleTabSelected': function (aSelectedTab) {
346 switch (aSelectedTab) {
347 case 'DETAILS':
348 break;
349 case 'DIRECT_LOGINS':
350 MochiKit.Style.hideElement(this.getElement('backToDirectLoginList'));
351 break;
352 case 'SHARING':
353 break;
354 }
355 },
356
357 //=========================================================================
358
359 'incrementUpdateFaviconCounter': function () {
360 this._updateFaviconCounter ++;
361 },
362
363 'decrementUpdateFaviconCounter': function () {
364 this._updateFaviconCounter --;
365 },
366
367 'updateFaviconCounter': function () {
368 return this._updateFaviconCounter;
369 },
370
371 //-------------------------------------------------------------------------
372
373 'updateFavicon': function () {
374 this.decrementUpdateFaviconCounter();
375
376 if (this.updateFaviconCounter() == 0) {
377 this.setFavicon(this.favicon());
378 }
379 },
380
381 //=========================================================================
382
383 'bindingComponents': function () {
384 return this._bindingComponents;
385 },
386
387 'clearAllBindingsComponents': function () {
388 MochiKit.Iter.forEach(this.bindingComponents(), MochiKit.Base.methodcaller('remove'));
389 this._bindingComponents = [];
390 this.getElement('bindings').innerHTML = '';
391 },
392
393 'addBindingComponent': function (aBindingComponent) {
394 this.bindingComponents().push(aBindingComponent);
395 aBindingComponent.renderInNode(this.append(this.getElement('bindings'), {tag:'div'}));
396 },
397
398 //=========================================================================
399
400 'formValueComponents': function () {
401 return this._formValueComponents;
402 },
403
404 'clearAllFormValueComponents': function () {
405 MochiKit.Iter.forEach(this.formValueComponents(), MochiKit.Base.methodcaller('remove'));
406 this._formValueComponents = [];
407 this.getElement('formValues').innerHTML = '';
408 },
409
410 'addFormValueComponent': function (aFormValueComponent) {
411 this.formValueComponents().push(aFormValueComponent);
412 aFormValueComponent.renderInNode(this.append(this.getElement('formValues'), {tag:'div'}));
413 },
414
415 //=========================================================================
416
417 'changedValue': function (anEvent) {
418 MochiKit.Signal.signal(this, 'changedValue', anEvent);
419
420 this.incrementUpdateFaviconCounter();
421 MochiKit.Async.callLater(1, MochiKit.Base.method(this, 'updateFavicon'));
422 },
423
424 //-------------------------------------------------------------------------
425
426 'handleBackClick': function (anEvent) {
427 anEvent.preventDefault();
428
429 MochiKit.Signal.signal(this, 'back');
430 },
431
432 //=========================================================================
433
434 'bottomMargin': function () {
435 returnMochiKit.Style.getElementPosition(this.element().parentNode)['y'] +
436 MochiKit.Style.getElementDimensions(this.element())['h'];
437 },
438
439 //=========================================================================
440
441 'focusOnLabelElement': function () {
442 this.getElement('label').focus();
443 },
444
445 'focusOnBookmarkletConfigurationElement': function () {
446 this.getElement('bookmarkletConfiguration').focus();
447 },
448
449 'focusOnFaviconElement': function () {
450 this.getElement('faviconURL').focus();
451 },
452
453 //=========================================================================
454
455 'setDoneDescriptionWithKeys': function (someKeys) {
456 // {tag:'div', cls:'wizardStepDescription', children:[{tag:'span', id:this.getId('doneDescription')/*, html:Clipperz.PM.Strings.getValue('Wizards.DirectLoginWizard.DONE.description')*/}]}
457 this.getElement('doneDescription').innerHTML = Clipperz.PM.Strings.getValue('Wizards.DirectLoginWizard.DONE.description', someKeys);
458 },
459
460 //=========================================================================
461
462 'handleKeyEvent': function (anEvent) {
463 MochiKit.Signal.signal(this, 'keyPressed', anEvent);
464/*
465 if (anEvent.key().string == 'KEY_ENTER') {
466 if (anEvent.target().nodeName != 'TEXTAREA') {
467 MochiKit.Signal.signal(this, 'moveForward');
468 anEvent.preventDefault();
469 }
470 } else if (anEvent.key().string == 'KEY_TAB') {
471 if ((anEvent.target().nodeName == 'INPUT') || (anEvent.target().nodeName == 'TEXTAREA')) {
472 MochiKit.Signal.signal(this, 'moveForward');
473 anEvent.preventDefault();
474 }
475 }
476*/
477 },
478
479 //=========================================================================
480 __syntaxFix__: "syntax fix"
481});