Updated version of /gamma

Tons of changes, included a new draft of the mobile version (still VERY rough)

4 files changed, 37 insertions, 20 deletions

diff --git a/frontend/gamma/js/Clipperz/PM/UI/Web/Components/AccountPanel.js b/frontend/gamma/js/Clipperz/PM/UI/Web/Components/AccountPanel.js
index ee6d7a3..d6b0574 100644
--- a/frontend/gamma/js/Clipperz/PM/UI/Web/Components/AccountPanel.js
+++ b/frontend/gamma/js/Clipperz/PM/UI/Web/Components/AccountPanel.js
@@ -1,145 +1,150 @@
 /*
 
 Copyright 2008-2011 Clipperz Srl
 
 This file is part of Clipperz Community Edition.
 Clipperz Community Edition is an online password manager.
 For further information about its features and functionalities please
 refer to http://www.clipperz.com.
 
 * Clipperz Community Edition is free software: you can redistribute
   it and/or modify it under the terms of the GNU Affero General Public
   License as published by the Free Software Foundation, either version
   3 of the License, or (at your option) any later version.
 
 * Clipperz Community Edition is distributed in the hope that it will
   be useful, but WITHOUT ANY WARRANTY; without even the implied
   warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
   See the GNU Affero General Public License for more details.
 
 * You should have received a copy of the GNU Affero General Public
   License along with Clipperz Community Edition.  If not, see
   <http://www.gnu.org/licenses/>.
 
 */
 
 Clipperz.Base.module('Clipperz.PM.UI.Web.Components');
 
 Clipperz.PM.UI.Web.Components.AccountPanel = function(args) {
         args = args || {};
 
         Clipperz.PM.UI.Web.Components.AccountPanel.superclass.constructor.apply(this, arguments);
 
         //this._initiallySelectedTab = args.selected || 'ACCOUNT';
         this._initiallySelectedTab = args.selected || 'PASSPHRASE';
         this._tabPanelControllerConfiguration = {
         //      'ACCOUNT': {
         //                      tab:'accountTab',
         //                      panel:'accountPanel'
         //      },
                 'PASSPHRASE': {
                                 tab:'passphraseTab',
                                 panel:'passphrasePanel'
                 },
+                'OTP': {
+                                tab:'OTPTab',
+                                panel:'OTPPanel'
+                },
                 'PREFERENCES': {
                                 tab:'preferencesTab',
                                 panel:'preferencesPanel'
                 },
                 'LOGIN_HISTORY': {
                                 tab:'loginHistoryTab',
                                 panel:'loginHistoryPanel'
                 }
         };
 
         return this;
 }
 
 //=============================================================================
 
 Clipperz.Base.extend(Clipperz.PM.UI.Web.Components.AccountPanel, Clipperz.PM.UI.Common.Components.TabPanelComponent, {
 
         //-------------------------------------------------------------------------
 
         'toString': function () {
                 return "Clipperz.PM.UI.Web.Components.AccountPanel component";
         },
 
         //-------------------------------------------------------------------------
 
         'renderSelf': function(/*aContainer, aPosition*/) {
 //Clipperz.log("AccountPanel.renderSelf element", this.element());
                 this.append(this.element(), [
                         {tag:'div', cls:'header', children:[
                                 {tag:'div', cls:'subPanelTabs', children:[
                                         {tag:'ul', children:[
         //                                              {tag:'li', id:this.getId('accountTab'),                 children:[{tag:'a', href:'#', html:'Account'}], cls:'first'},
                                                         {tag:'li', id:this.getId('passphraseTab'),      children:[{tag:'a', href:'#', html:'Passphrase'}], cls:'first'},
+                                                        {tag:'li', id:this.getId('OTPTab'),                     children:[{tag:'a', href:'#', html:'One Time Passwords'}]},
                                                         {tag:'li', id:this.getId('preferencesTab'),     children:[{tag:'a', href:'#', html:'Preferences'}]},
                                                         {tag:'li', id:this.getId('loginHistoryTab'),children:[{tag:'a', href:'#', html:'Login history'}]}
                                         ]}
                                 ]}
                         ]},
                         {tag:'div', cls:'body', children:[
                                 {tag:'div', cls:'accountPanel', children:[
                                         {tag:'div', cls:'subPanelContent', children:[
                                                 {tag:'ul', children:[
         //                                                      {tag:'li', id:this.getId('accountPanel'),children:[
         //                                                      {tag:'h3', html:"-- Account --"}
         //                                              ]},
                                                                 {tag:'li', id:this.getId('passphrasePanel'),children:[
                                                                 {tag:'h3', cls:'changePassphrase', html:"Change passphrase"},
                                                                 {tag:'form', id:this.getId('changePassphrase'), cls:'changePassphrase', children:[
                                                                         {tag:'div', cls:'currentCredentials', children:[
                                                                                 {tag:'div', cls:'field username', children:[
                                                                                         {tag:'label', html:"username", 'for':this.getId('currentUsername')},
                                                                                         {tag:'input', id:this.getId('currentUsername')}
                                                                                 ]},
                                                                                 {tag:'div', cls:'field passphrase', children:[
                                                                                         {tag:'label', html:"passphrase", 'for':this.getId('currentPassphrase')},
                                                                                         {tag:'input', id:this.getId('currentPassphrase')}
                                                                                 ]}
                                                                         ]},
                                                                         {tag:'div', cls:'newPassphrase', children:[
                                                                                 {tag:'div', cls:'field', children:[
                                                                                         {tag:'label', html:"new passphrase", 'for':this.getId('newPassphrase')},
                                                                                         {tag:'input', id:this.getId('newPassphrase')}
                                                                                 ]},
                                                                                 {tag:'div', cls:'field', children:[
                                                                                         {tag:'label', html:"re-new passphrase", 'for':this.getId('reNewPassphrase')},
                                                                                         {tag:'input', id:this.getId('reNewPassphrase')}
                                                                                 ]}
                                                                         ]},
                                                                         {tag:'div', cls:'confirm', children:[
                                                                                 {tag:'input', type:'checkbox', id:this.getId('confirm')},
                                                                                 {tag:'label', html:"I understand that Clipperz will not be able to recover a lost passphrase", 'for':this.getId('confirm')}
                                                                         ]}
                                                                 ]},
                                                                 {tag:'div', cls:'clear'},
                                                                 {tag:'div', cls:'confirmButton', id:this.getId('confirmationButton'), children:[
                                                                         {tag:'span', html:"change passphrase"}
-                                                                ]},
-
-                                                                {tag:'h3', cls:'manageOTP', html:"Manage One-Time Passphrases"},
-                                                                {}
+                                                                ]}
+                                                        ]},
+                                                                {tag:'li', id:this.getId('OTPPanel'),   children:[
+        //                                                      {tag:'h3', html:"Manage One-Time Passphrases"}
                                                         ]},
                                                                 {tag:'li', id:this.getId('preferencesPanel'),   children:[
-                                                                {tag:'h3', html:"-- Preferences --"}
+        //                                                      {tag:'h3', html:"-- Preferences --"}
                                                         ]},
                                                                 {tag:'li', id:this.getId('loginHistoryPanel'),  children:[
-                                                                {tag:'h3', html:"-- Login History --"}
+        //                                                      {tag:'h3', html:"-- Login History --"}
                                                         ]}
                                                 ]}
                                         ]}
                                 ]}
                         ]},
                         {tag:'div', cls:'footer'}
                 ]);
                 
                 this.tabPanelController().setup({selected:this.initiallySelectedTab()});
         },
         
         //-------------------------------------------------------------------------
 
 
         __syntaxFix__: "syntax fix"
 });
diff --git a/frontend/gamma/js/Clipperz/PM/UI/Web/Components/DataPanel.js b/frontend/gamma/js/Clipperz/PM/UI/Web/Components/DataPanel.js
index d2f1045..462d864 100644
--- a/frontend/gamma/js/Clipperz/PM/UI/Web/Components/DataPanel.js
+++ b/frontend/gamma/js/Clipperz/PM/UI/Web/Components/DataPanel.js
@@ -37,72 +37,80 @@ Clipperz.PM.UI.Web.Components.DataPanel = function(args) {
                                 panel:'offlineCopyPanel'
                 },
                 'SHARING': {
                                 tab:'sharingTab',
                                 panel:'sharingPanel'
                 },
                 'IMPORT': {
                                 tab:'importTab',
                                 panel:'importPanel'
                 },
                 'EXPORT': {
                                 tab:'exportTab',
                                 panel:'exportPanel'
                 }
         };
         
         return this;
 }
 
 //=============================================================================
 
 Clipperz.Base.extend(Clipperz.PM.UI.Web.Components.DataPanel, Clipperz.PM.UI.Common.Components.TabPanelComponent, {
 
         //-------------------------------------------------------------------------
 
         'toString': function () {
                 return "Clipperz.PM.UI.Web.Components.DataPanel component";
         },
 
         //-------------------------------------------------------------------------
 
         'renderSelf': function(/*aContainer, aPosition*/) {
                 this.append(this.element(), [
                         {tag:'div', cls:'header', children:[
                                 {tag:'div', cls:'subPanelTabs', children:[
                                         {tag:'ul', children:[
                                                         {tag:'li', id:this.getId('offlineCopyTab'),children:[{tag:'a', href:'#', html:'Offline copy'}], cls:'first'},
                                                         {tag:'li', id:this.getId('sharingTab'),         children:[{tag:'a', href:'#', html:'Sharing'}]},
                                                         {tag:'li', id:this.getId('importTab'),  children:[{tag:'a', href:'#', html:'Import'}]},
                                                         {tag:'li', id:this.getId('exportTab'),  children:[{tag:'a', href:'#', html:'Export'}]}
                                         ]}
                                 ]}
                         ]},
                         {tag:'div', cls:'body', children:[
                                 {tag:'div', cls:'accountPanel', children:[
                                         {tag:'div', cls:'subPanelContent', children:[
                                                 {tag:'ul', children:[
                                                                 {tag:'li', id:this.getId('offlineCopyPanel'),children:[
-                                                                {tag:'h3', html:"Offline copy"}
+        //                                                      {tag:'h3', html:"Offline copy"},
+                                                                {tag:'p', html:"With just one click you can dump all your encrypted data from Clipperz servers to your hard disk and create a read-only offline version of Clipperz to be used when you are not connected to the Internet."},
+                                                                {tag:'a', id:this.getId('offlineCopyDownloadLink'), href:'#', html:"Download", cls:'downloadOfflineCopy'}
                                                         ]},
                                                                 {tag:'li', id:this.getId('sharingPanel'),children:[
-                                                                {tag:'h3', html:"Sharing"}
+        //                                                      {tag:'h3', html:"Sharing"}
                                                         ]},
                                                                 {tag:'li', id:this.getId('importPanel'),        children:[
-                                                                {tag:'h3', html:"Import"}
+        //                                                      {tag:'h3', html:"Import"}
                                                         ]},
                                                                 {tag:'li', id:this.getId('exportPanel'),        children:[
-                                                                {tag:'h3', html:"Export"}
+        //                                                      {tag:'h3', html:"Export"}
                                                         ]}
                                                 ]}
                                         ]}
                                 ]}
                         ]},
                         {tag:'div', cls:'footer'}
                 ]);
 
                 this.tabPanelController().setup({selected:this.initiallySelectedTab()});
+                MochiKit.Signal.connect(this.getId('offlineCopyDownloadLink'), 'onclick', this, 'downloadOfflineCopy');
         },
-        
+
+        'downloadOfflineCopy': function (anEvent) {
+                anEvent.preventDefault();
+                MochiKit.Signal.signal(Clipperz.Signal.NotificationCenter, 'downloadOfflineCopy', anEvent.src());
+        },
+
         //-------------------------------------------------------------------------
         __syntaxFix__: "syntax fix"
 });
diff --git a/frontend/gamma/js/Clipperz/PM/UI/Web/Components/LoginProgress.js b/frontend/gamma/js/Clipperz/PM/UI/Web/Components/LoginProgress.js
index 5d082b5..26506e7 100644
--- a/frontend/gamma/js/Clipperz/PM/UI/Web/Components/LoginProgress.js
+++ b/frontend/gamma/js/Clipperz/PM/UI/Web/Components/LoginProgress.js
@@ -37,116 +37,120 @@ Clipperz.PM.UI.Web.Components.LoginProgress = function(args) {
 
 //=============================================================================
 
 Clipperz.Base.extend(Clipperz.PM.UI.Web.Components.LoginProgress, Clipperz.PM.UI.Common.Components.BaseComponent, {
 
         //-------------------------------------------------------------------------
 
         'toString': function () {
                 return "Clipperz.PM.UI.Web.Components.LoginProgress component";
         },
 
         //-------------------------------------------------------------------------
 
         'deferred': function() {
                 return this._deferred;
         },
 
         'setDeferred': function(aValue) {
                 this._deferred = aValue;
         },
 
         //-------------------------------------------------------------------------
 
         'renderSelf': function() {
         //      var loginProgressElement;
         //      
         //      loginProgressElement = MochiKit.DOM.getElement('loginProgress');
         //      
         //      if (loginProgressElement == null) {
         //              loginProgressElement = this.append(this.element(), {tag:'div', id:'loginProgress', cls:'LoginProgress'}, true);
         //      }
 
 //console.log(">> LoginProgress.renderSelf", this.element());
                 this.append(this.element(), {tag:'div', id:'loginProgress', cls:'LoginProgress', children: [
         //      this.append(loginProgressElement, [
                         {tag:'div', cls:'header', children:[
                                 {tag:'h3', id:this.getId('title'), html:"login progress"}
                         ]},
                         {tag:'div', cls:'body', children:[
                                 {tag:'div', id:this.getId('progressBar')},
                                 {tag:'div', id:this.getId('errorBox'), cls:'errorBox', children:[
         //                                      {tag:'div',cls:'img ALERT', children:[{tag:'div'}]},
                                                 {tag:'div',cls:'img ALERT', children:[{tag:'canvas', id:this.getId('canvas')}]},
                                         {tag:'p', html:"Login failed"}
                                 ]}
                         ]},
                         {tag:'div', cls:'footer', children:[
                                 {tag:'div', cls:'buttonArea', id:this.getId('buttonArea'), children:[
-                                        {tag:'div', cls:'button', id:this.getId('button'), children:[
-                                                {tag:'a', href:'#', id:this.getId('buttonLink'), html:"cancel"}
-                                        ]}
+        //                              {tag:'div', cls:'button', id:this.getId('button'), children:[
+        //                                      {tag:'a', href:'#', id:this.getId('buttonLink'), html:"cancel"}
+        //                              ]}
+                                        {tag:'a', cls:'button', id:this.getId('button'), html:"cancel"}
                                 ]}
                         ]}
                 ]});
         //      ]);
 
                 Clipperz.PM.UI.Canvas.marks['!'](this.getElement('canvas'), "#ffffff");
 
                 this.addComponent(new Clipperz.PM.UI.Common.Components.ProgressBar({'element':this.getElement('progressBar')}));
                 MochiKit.Style.hideElement(this.getElement('errorBox'));
                 
-                MochiKit.Signal.connect(this.getId('buttonLink'), 'onclick', this, 'cancelEventHandler');
+        //      MochiKit.Signal.connect(this.getId('buttonLink'), 'onclick', this, 'cancelEventHandler');
+                MochiKit.Signal.connect(this.getId('button'), 'onclick', this, 'cancelEventHandler');
         },
 
         //-------------------------------------------------------------------------
 
         'displayElement': function() {
                 return MochiKit.DOM.getElement('loginProgress');
         },
 
         //-------------------------------------------------------------------------
 
         'cancelEventHandler': function(anEvent) {
                 anEvent.preventDefault();
                 
                 MochiKit.Signal.signal(this, 'cancelEvent');
         },
 
         //-------------------------------------------------------------------------
 
         'disableCancel': function() {
                 MochiKit.Style.hideElement(this.getElement('buttonArea'));
         },
 
         //-------------------------------------------------------------------------
 
         'showErrorMessage': function() {
-                this.getElement('buttonLink').innerHTML = "close";
+        //      this.getElement('buttonLink').innerHTML = "close";
+                this.getElement('button').innerHTML = "close";
+                MochiKit.DOM.addElementClass(this.getElement('button'), 'default');
 
                 MochiKit.Style.hideElement(this.getElement('progressBar'));
 
                 this.getElement('title').innerHTML = "Error";
                 MochiKit.Style.showElement(this.getElement('errorBox'));
                 MochiKit.Style.showElement(this.getElement('buttonArea'));
         },
 
         //-------------------------------------------------------------------------
 
         'deferredHideModalAndRemove': function(someParameters, aResult) {
                         vardeferredResult;
 
                 deferredResult = new Clipperz.Async.Deferred("LoginProgress.deferredHideModalAndRemove", {trace:false});
                 deferredResult.addMethod(this, 'deferredHideModal');
                 deferredResult.addMethod(this, 'remove');
                 deferredResult.addCallback(function () {
                         return aResult;
                 });
                 deferredResult.callback(someParameters);
 
                 return deferredResult;
         },
 
         //-------------------------------------------------------------------------
 
         __syntaxFix__: "syntax fix"
 });
diff --git a/frontend/gamma/js/Clipperz/PM/UI/Web/Components/ToolsPanel.js b/frontend/gamma/js/Clipperz/PM/UI/Web/Components/ToolsPanel.js
index 3ee6189..0fa369f 100644
--- a/frontend/gamma/js/Clipperz/PM/UI/Web/Components/ToolsPanel.js
+++ b/frontend/gamma/js/Clipperz/PM/UI/Web/Components/ToolsPanel.js
@@ -37,74 +37,74 @@ Clipperz.PM.UI.Web.Components.ToolsPanel = function(args) {
                                 panel:'passwordGeneratorPanel'
                 },
                 'BOOKMARKLET': {
                                 tab:'bookmarkletTab',
                                 panel:'bookmarkletPanel'
                 },
                 'COMPACT_EDITION': {
                                 tab:'compactEditionTab',
                                 panel:'compactEditionPanel'
                 },
                 'HTTP_AUTH': {
                                 tab:'httpAuthTab',
                                 panel:'httpAuthPanel'
                 }
         };
 
         return this;
 }
 
 //=============================================================================
 
 Clipperz.Base.extend(Clipperz.PM.UI.Web.Components.ToolsPanel, Clipperz.PM.UI.Common.Components.TabPanelComponent, {
 
         //-------------------------------------------------------------------------
 
         'toString': function () {
                 return "Clipperz.PM.UI.Web.Components.ToolsPanel component";
         },
 
         //-------------------------------------------------------------------------
 
         'renderSelf': function(/*aContainer, aPosition*/) {
                 this.append(this.element(), [
                         {tag:'div', cls:'header', children:[
                                 {tag:'div', cls:'subPanelTabs', children:[
                                         {tag:'ul', children:[
                                                         {tag:'li', id:this.getId('passwordGeneratorTab'),children:[{tag:'a', href:'#', html:'Password generator'}], cls:'first'},
                                                         {tag:'li', id:this.getId('bookmarkletTab'),             children:[{tag:'a', href:'#', html:'Bookmarklet'}]},
                                                         {tag:'li', id:this.getId('compactEditionTab'),  children:[{tag:'a', href:'#', html:'Compact edition'}]},
                                                         {tag:'li', id:this.getId('httpAuthTab'),                children:[{tag:'a', href:'#', html:'HTTP Auth'}]}
                                         ]}
                                 ]}
                         ]},
                         {tag:'div', cls:'body', children:[
                                 {tag:'div', cls:'accountPanel', children:[
                                         {tag:'div', cls:'subPanelContent', children:[
                                                 {tag:'ul', children:[
                                                                 {tag:'li', id:this.getId('passwordGeneratorPanel'),children:[
-                                                                {tag:'h3', html:"Password generator"}
+        //                                                      {tag:'h3', html:"Password generator"}
                                                         ]},
                                                                 {tag:'li', id:this.getId('bookmarkletPanel'),children:[
-                                                                {tag:'h3', html:"Bookmarklet"}
+        //                                                      {tag:'h3', html:"Bookmarklet"}
                                                         ]},
                                                                 {tag:'li', id:this.getId('compactEditionPanel'),        children:[
-                                                                {tag:'h3', html:"Compact edition"}
+        //                                                      {tag:'h3', html:"Compact edition"}
                                                         ]},
                                                                 {tag:'li', id:this.getId('httpAuthPanel'),      children:[
-                                                                {tag:'h3', html:"HTTP Auth"}
+        //                                                      {tag:'h3', html:"HTTP Auth"}
                                                         ]}
                                                 ]}
                                         ]}
                                 ]}
                         ]},
                         {tag:'div', cls:'footer'}
                 ]);
 
                 this.tabPanelController().setup({selected:this.initiallySelectedTab()});
         },
         
         //-------------------------------------------------------------------------
 
 
         __syntaxFix__: "syntax fix"
 });