Client-side user registration.

Send a registration request on connect:
* if the user is already registered, set the
rsa key from the information sent by the server component.
* if not, display the registration form. The forms contains
a  link to generate a new rsa public/private key (and encrypt
the private with the user's password).

2 files changed, 105 insertions, 61 deletions

diff --git a/webclient/lib/alias.js b/webclient/lib/alias.js
index 4adac04..c19d025 100644
--- a/webclient/lib/alias.js
+++ b/webclient/lib/alias.js
@@ -17,55 +17,6 @@ var Alias = {
      */
     connection: null,
 
-    form: {
-        render: function(form){
-            var result = $('<form></form>');
-            
-            if ( form.find('title').length !== 0 ){
-                result.append('<p class="title">' + form.find('title') + '</p>');
-            }
-            
-            if ( form.find('instructions').length !== 0 ){
-                result.append('<p class="instructions">' 
-                              + form.find('instructions') + '</p>');
-            }
-            
-            form.find('field').each(function(index){
-                var type = $(this).attr("type");
-                var name = $(this).attr("var");
-                var required = $(this).find('required').length !== 0;
-                
-                if ( $(this).find('desc').length !== 0 ){
-                    result.append('<p class="description">'
-                                  + $(this).find('desc').text()
-                                  + '</p>');
-                }
-                
-                if ( $(this).attr('label') !== undefined ){
-                    result.append('<label for="form-' + name + '">'
-                                  + $(this).attr('label')
-                                  + (required ? ' (*): ' : ': ')
-                                  + '</label>');
-                }
-                
-                switch(type){
-                    case("text-single"):
-                        var input = $('<input/>');
-                        input.attr('type', 'text');
-                        input.attr('name', name);
-                        input.attr('id', 'form-' + name);
-                        
-                        if ( $(this).find('value').length !== 0 ){
-                            input.attr('value', $(this).find('value').text());
-                        }
-                        result.append(input);
-                        result.append('<br/>');                        
-                }
-            });
-            return result;
-        }
-    },
-    
     /**
      * Send registration request to the component
      */
@@ -80,22 +31,48 @@ var Alias = {
      */
     onRegister: function(iq) {
         var form = $(iq).find('query x');
-        if ($(iq).find('query > registered').length !== 0){
+        if ($(iq).find('registered').length !== 0){
             // user is registered, get the info from the form
-            this.pubkey = form.find('field[var="pubkey"] > value');
-            this.salt = form.find('field[var="pubkey"] > value');
-            var privkey = form.find('field[var="pubkey"] > value');
-            var salt = form.find('field[var="salt"] > value');
-            this.privkey = sjcl.decrypt(Alias.connection.pass, privkey, {salt: salt});
+            var pubkey = form.find('field[var="pubkey"] > value').text();
+            var privkey = form.find('field[var="privkey"] > value').text();
+            privkey = sjcl.decrypt(Alias.connection.pass, privkey);
+            pubkey = JSON.parse(pubkey);
+            privkey = JSON.parse(privkey);
+            var rsa = new RSAKey();
+            rsa.setPublic(pubkey.n, pubkey.e);
+            rsa.setPrivate(pubkey.n, pubkey.e, privkey.d);
+            this.rsa = rsa;
       }
         else{
             $('#register').empty();
-            var instructions = $(iq).find('query > instructions');
+            var instructions = $(iq).find('instructions');
             if ( instructions.length !== 0 ){
                 $('#register').append('<p>' + instructions.text() + '</p>');
             }
-            var result = Alias.form.render(form);
+            var result = form.xmppForm('render');
+            $('#register').append('<p><a href="#" id="generate">Generate</a></p>');
+            $('#generate').click(function(){
+                var rsa = new RSAKey();
+                rsa.generate(1024, "10001");
+                var pubkey = {n: rsa.n.toString(16), e: rsa.e.toString(16)};
+                var privkey = {d: rsa.d.toString(16)};
+                privkey = sjcl.encrypt(Alias.connection.pass, JSON.stringify(privkey));
+                $("#form-pubkey").val(JSON.stringify(pubkey));
+                $("#form-privkey").val(privkey);
+            });
             $('#register').append(result);
+            $('#register').append('<input type="button" value="register" id="register-button"/>');
+            $('#register-button').click(function(){
+                var pubkey = $('<value></value').text($("#form-pubkey").val());
+                var privkey = $('<value></value').text($("#form-privkey").val());
+                form.find('field[var="privkey"]').append(privkey);
+                form.find('field[var="pubkey"]').append(pubkey);
+                form.attr('type', 'submit');
+                var reg = $iq({to: server_component, type:'set'});
+                reg.c('query',{xmlns:'jabber:iq:register'});
+                reg.cnode(form.get(0));
+                Alias.connection.sendIQ(reg);
+            });
             $('#dialogs').dialog('show', 'register');
         }
     },
@@ -474,10 +451,6 @@ $(document).ready(function(){
    });
    
    $('#dialogs').dialog();
-   
-   $('#register-link').click(function(){
-       $('#dialogs').dialog('show', 'register');
-   });
 });
 
 
diff --git a/webclient/lib/jquery.forms.js b/webclient/lib/jquery.forms.js
new file mode 100644
index 0000000..e9a5258
--- /dev/null
+++ b/webclient/lib/jquery.forms.js
@@ -0,0 +1,71 @@
+/**
+ * Form manipulation with jQuery
+ */
+(function( $ ){
+
+    var methods = {
+            
+        render: function(){
+            var result = $('<form></form>');
+            if ( this.find('title').length !== 0 ){
+                result.append('<p class="title">' + this.find('title') + '</p>');
+            }
+            
+            if ( this.find('instructions').length !== 0 ){
+                result.append('<p class="instructions">' 
+                              + this.find('instructions') + '</p>');
+            }
+            
+            this.find('field').each(function(index){
+                var type = $(this).attr("type");
+                var name = $(this).attr("var");
+                var required = $(this).find('required').length !== 0;
+                
+                if ( $(this).find('desc').length !== 0 ){
+                    result.append('<p class="description">'
+                                  + $(this).find('desc').text()
+                                  + '</p>');
+                }
+                
+                if ( $(this).attr('label') !== undefined ){
+                    result.append('<label for="form-' + name + '">'
+                                  + $(this).attr('label')
+                                  + (required ? ' (*): ' : ': ')
+                                  + '</label>');
+                }
+                
+                switch(type){
+                    case("text-single"):
+                        var input = $('<input/>');
+                        input.attr('type', 'text');
+                        input.attr('name', name);
+                        input.attr('id', 'form-' + name);
+                        
+                        if ( $(this).find('value').length !== 0 ){
+                            input.attr('value', $(this).find('value').text());
+                        }
+                        result.append(input);
+                        result.append('<br/>');                        
+                }
+            });
+            return result;
+        }
+    };
+
+    /*
+     * Register the 'xmppForm' method to the jQuery objects
+     * the first argument of this method is the submethod
+     * you want to call
+     */
+    $.fn.xmppForm = function(method) {
+        if ( methods[method] ) {
+            return methods[method].apply(this, Array.prototype.slice
+                                         .call(arguments, 1));
+        } else if ( typeof method === 'object' || !method ) {
+            return methods.init.apply(this, arguments);
+        } else {
+            $.error('Method ' + method + ' does not exist on jQuery.xmppForm');
+        }
+    };
+
+})(jQuery);
\ No newline at end of file