First version of the newly restructured repository

7 files changed, 2114 insertions, 0 deletions

diff --git a/frontend/beta/js/Clipperz/YUI/Collapser.js b/frontend/beta/js/Clipperz/YUI/Collapser.js
new file mode 100644
index 0000000..5c0ac0f
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/YUI/Collapser.js
@@ -0,0 +1,73 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library 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.
+
+* Javascript Crypto Library 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 Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.YUI) == 'undefined') { Clipperz.YUI = {}; }
+
+//	found on YUI-EXT forum (http://www.yui-ext.com/forum/viewtopic.php?t=683&highlight=accordion)
+Clipperz.YUI.Collapser = function(clickEl, collapseEl, initiallyCollapsed) { 
+	this.clickEl = getEl(clickEl); 
+	this.collapseEl = getEl(collapseEl); 
+	this.clickEl.addClass('collapser-expanded'); 
+	if (initiallyCollapsed == true) {
+		this.afterCollapse();
+	}
+	this.clickEl.mon('click', function(){ 
+		this.collapsed === true ? this.expand() : this.collapse(); 
+	}, this, true); 
+}; 
+
+Clipperz.YUI.Collapser.prototype = { 
+	'collapse': function(){ 
+		this.collapseEl.clip(); 
+		this.collapseEl.setHeight(1, true, .35, this.afterCollapse.createDelegate(this), YAHOO.util.Easing.easeOut); 
+		this.clickEl.replaceClass('collapser-expanded','collapser-collapsed'); 
+	}, 
+
+	'afterCollapse': function(){ 
+		this.collapsed = true; 
+		this.collapseEl.setDisplayed(false); 
+		this.clickEl.replaceClass('collapser-expanded','collapser-collapsed'); 
+	}, 
+
+	'expand': function(){ 
+		this.collapseEl.setDisplayed(true); 
+		this.collapseEl.autoHeight(true, .35, this.afterExpand.createDelegate(this), YAHOO.util.Easing.easeOut); 
+		this.clickEl.replaceClass('collapser-collapsed','collapser-expanded'); 
+	}, 
+
+	'afterExpand': function(){ 
+		this.collapsed = false; 
+		this.collapseEl.unclip(); 
+		this.collapseEl.setStyle('height', '');    
+		this.clickEl.replaceClass('collapser-collapsed','collapser-expanded'); 
+	},
+
+	//-----------------------------------------------------
+	__syntaxFix__: '__syntaxFix__'
+};
diff --git a/frontend/beta/js/Clipperz/YUI/DomHelper.js b/frontend/beta/js/Clipperz/YUI/DomHelper.js
new file mode 100644
index 0000000..4f8acde
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/YUI/DomHelper.js
@@ -0,0 +1,465 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library 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.
+
+* Javascript Crypto Library 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 Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }

+if (typeof(Clipperz.ext) == 'undefined') { Clipperz.ext = {}; }

+

+/**

+ * @class Clipperz.YUI.DomHelper

+ * Utility class for working with DOM and/or Templates. It transparently supports using HTML fragments or DOM. 

+ * For more information see <a href="http://www.jackslocum.com/yui/2006/10/06/domhelper-create-elements-using-dom-html-fragments-or-templates/">this blog post with examples</a>.

+ * @singleton

+ */

+Clipperz.YUI.DomHelper = new function(){

+    /**@private*/

+    var d = document;

+    var tempTableEl = null;

+    /** True to force the use of DOM instead of html fragments @type Boolean */

+    this.useDom = false;

+    var emptyTags = /^(?:base|basefont|br|frame|hr|img|input|isindex|link|meta|nextid|range|spacer|wbr|audioscope|area|param|keygen|col|limittext|spot|tab|over|right|left|choose|atop|of)$/i;

+    /**

+     * Applies a style specification to an element

+     * @param {String/HTMLElement} el The element to apply styles to

+     * @param {String/Object/Function} styles A style specification string eg "width:100px", or object in the form {width:"100px"}, or

+     * a function which returns such a specification.

+     */

+    this.applyStyles = function(el, styles){

+        if(styles){

+           var D = YAHOO.util.Dom;

+           if (typeof styles == "string"){

+               var re = /\s?([a-z\-]*)\:([^;]*);?/gi;

+               var matches;

+               while ((matches = re.exec(styles)) != null){

+                   D.setStyle(el, matches[1], matches[2]);

+               }

+           }else if (typeof styles == "object"){

+               for (var style in styles){

+                  D.setStyle(el, style, styles[style]);

+               }

+           }else if (typeof styles == "function"){

+                Clipperz.YUI.DomHelper.applyStyles(el, styles.call());

+           }

+        }

+    }; 

+    

+    // build as innerHTML where available

+    /** @ignore */

+    var createHtml = function(o){

+        var b = '';

+

+		if(typeof(o['html']) != 'undefined') {

+			o['html'] = Clipperz.Base.sanitizeString(o['html']);

+		} else if (typeof(o['htmlString']) != 'undefined') {

+			o['html'] = o['htmlString'];

+			delete o.htmlString;

+		}

+		

+        b += '<' + o.tag;

+        for(var attr in o){

+            if(attr == 'tag' || attr == 'children' || attr == 'html' || typeof o[attr] == 'function') continue;

+            if(attr == 'style'){

+                var s = o['style'];

+                if(typeof s == 'function'){

+                    s = s.call();

+                }

+                if(typeof s == 'string'){

+                    b += ' style="' + s + '"';

+                }else if(typeof s == 'object'){

+                    b += ' style="';

+                    for(var key in s){

+                        if(typeof s[key] != 'function'){

+                            b += key + ':' + s[key] + ';';

+                        }

+                    }

+                    b += '"';

+                }

+            }else{

+                if(attr == 'cls'){

+                    b += ' class="' + o['cls'] + '"';

+                }else if(attr == 'htmlFor'){

+                    b += ' for="' + o['htmlFor'] + '"';

+                }else{

+                    b += ' ' + attr + '="' + o[attr] + '"';

+                }

+            }

+        }

+        if(emptyTags.test(o.tag)){

+            b += ' />';

+        }else{

+            b += '>';

+            if(o.children){

+                for(var i = 0, len = o.children.length; i < len; i++) {

+                    b += createHtml(o.children[i], b);

+                }

+            }

+            if(o.html){

+                b += o.html;

+            }

+            b += '</' + o.tag + '>';

+        }

+        return b;

+    }

+    

+    // build as dom

+    /** @ignore */

+    var createDom = function(o, parentNode){

+        var el = d.createElement(o.tag);

+        var useSet = el.setAttribute ? true : false; // In IE some elements don't have setAttribute

+        for(var attr in o){

+            if(attr == 'tag' || attr == 'children' || attr == 'html' || attr == 'style' || typeof o[attr] == 'function') continue;

+            if(attr=='cls'){

+                el.className = o['cls'];

+            }else{

+                if(useSet) el.setAttribute(attr, o[attr]);

+                else el[attr] = o[attr];

+            }

+        }

+        Clipperz.YUI.DomHelper.applyStyles(el, o.style);

+        if(o.children){

+            for(var i = 0, len = o.children.length; i < len; i++) {

+             	createDom(o.children[i], el);

+            }

+        }

+        if(o.html){

+            el.innerHTML = o.html;

+        }

+        if(parentNode){

+           parentNode.appendChild(el);

+        }

+        return el;

+    };

+    

+    /**

+     * @ignore

+     * Nasty code for IE's broken table implementation 

+     */

+    var insertIntoTable = function(tag, where, el, html){

+        if(!tempTableEl){

+            tempTableEl = document.createElement('div');

+        }

+        var node;

+        if(tag == 'table' || tag == 'tbody'){

+           tempTableEl.innerHTML = '<table><tbody>'+html+'</tbody></table>';

+           node = tempTableEl.firstChild.firstChild.firstChild;

+        }else{

+           tempTableEl.innerHTML = '<table><tbody><tr>'+html+'</tr></tbody></table>';

+           node = tempTableEl.firstChild.firstChild.firstChild.firstChild;

+        }

+        if(where == 'beforebegin'){

+            el.parentNode.insertBefore(node, el);

+            return node;

+        }else if(where == 'afterbegin'){

+            el.insertBefore(node, el.firstChild);

+            return node;

+        }else if(where == 'beforeend'){

+            el.appendChild(node);

+            return node;

+        }else if(where == 'afterend'){

+            el.parentNode.insertBefore(node, el.nextSibling);

+            return node;

+        }

+    } 

+    

+    /**

+     * Inserts an HTML fragment into the Dom

+     * @param {String} where Where to insert the html in relation to el - beforeBegin, afterBegin, beforeEnd, afterEnd.

+     * @param {HTMLElement} el The context element

+     * @param {String} html The HTML fragmenet

+     * @return {HTMLElement} The new node

+     */

+    this.insertHtml = function(where, el, html){

+        where = where.toLowerCase();

+        if(el.insertAdjacentHTML){

+            var tag = el.tagName.toLowerCase();

+            if(tag == 'table' || tag == 'tbody' || tag == 'tr'){

+               return insertIntoTable(tag, where, el, html);

+            }

+            switch(where){

+                case 'beforebegin':

+                    el.insertAdjacentHTML(where, html);

+                    return el.previousSibling;

+                case 'afterbegin':

+                    el.insertAdjacentHTML(where, html);

+                    return el.firstChild;

+                case 'beforeend':

+                    el.insertAdjacentHTML(where, html);

+                    return el.lastChild;

+                case 'afterend':

+                    el.insertAdjacentHTML(where, html);

+                    return el.nextSibling;

+            }

+            throw 'Illegal insertion point -> "' + where + '"';

+        }

+        var range = el.ownerDocument.createRange();

+        var frag;

+        switch(where){

+             case 'beforebegin':

+                range.setStartBefore(el);

+                frag = range.createContextualFragment(html);

+                el.parentNode.insertBefore(frag, el);

+                return el.previousSibling;

+             case 'afterbegin':

+                if(el.firstChild){ // faster

+                    range.setStartBefore(el.firstChild);

+                }else{

+                    range.selectNodeContents(el);

+                    range.collapse(true);

+                }

+                frag = range.createContextualFragment(html);

+                el.insertBefore(frag, el.firstChild);

+                return el.firstChild;

+            case 'beforeend':

+                if(el.lastChild){

+                    range.setStartAfter(el.lastChild); // faster

+                }else{

+                    range.selectNodeContents(el);

+                    range.collapse(false);

+                }

+                frag = range.createContextualFragment(html);

+                el.appendChild(frag);

+                return el.lastChild;

+            case 'afterend':

+                range.setStartAfter(el);

+                frag = range.createContextualFragment(html);

+                el.parentNode.insertBefore(frag, el.nextSibling);

+                return el.nextSibling;

+            }

+            throw 'Illegal insertion point -> "' + where + '"';

+    };

+    

+    /**

+     * Creates new Dom element(s) and inserts them before el

+     * @param {String/HTMLElement/Element} el The context element

+     * @param {Object} o The Dom object spec (and children)

+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element

+     * @return {HTMLElement} The new node

+     */

+    this.insertBefore = function(el, o, returnElement){

+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);

+        var newNode;

+        if(this.useDom){

+            newNode = createDom(o, null);

+            el.parentNode.insertBefore(newNode, el);

+        }else{

+            var html = createHtml(o);

+            newNode = this.insertHtml('beforeBegin', el, html);

+        }

+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;

+    };

+    

+    /**

+     * Creates new Dom element(s) and inserts them after el

+     * @param {String/HTMLElement/Element} el The context element

+     * @param {Object} o The Dom object spec (and children)

+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element

+     * @return {HTMLElement} The new node

+     */

+    this.insertAfter = function(el, o, returnElement){

+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);

+        var newNode;

+        if(this.useDom){

+            newNode = createDom(o, null);

+            el.parentNode.insertBefore(newNode, el.nextSibling);

+        }else{

+            var html = createHtml(o);

+            newNode = this.insertHtml('afterEnd', el, html);

+        }

+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;

+    };

+    

+    /**

+     * Creates new Dom element(s) and appends them to el

+     * @param {String/HTMLElement/Element} el The context element

+     * @param {Object} o The Dom object spec (and children)

+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element

+     * @return {HTMLElement} The new node

+     */

+    this.append = function(el, o, returnElement){

+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);

+        var newNode;

+        if(this.useDom){

+            newNode = createDom(o, null);

+            el.appendChild(newNode);

+        }else{

+            var html = createHtml(o);

+            newNode = this.insertHtml('beforeEnd', el, html);

+        }

+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;

+    };

+    

+    /**

+     * Creates new Dom element(s) and overwrites the contents of el with them

+     * @param {String/HTMLElement/Element} el The context element

+     * @param {Object} o The Dom object spec (and children)

+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element

+     * @return {HTMLElement} The new node

+     */

+    this.overwrite = function(el, o, returnElement){

+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);

+        el.innerHTML = createHtml(o);

+        return returnElement ? YAHOO.ext.Element.get(el.firstChild, true) : el.firstChild;

+    };

+    

+    /**

+     * Creates a new Clipperz.YUI.DomHelper.Template from the Dom object spec 

+     * @param {Object} o The Dom object spec (and children)

+     * @return {Clipperz.YUI.DomHelper.Template} The new template

+     */

+    this.createTemplate = function(o){

+        var html = createHtml(o);

+        return new Clipperz.YUI.DomHelper.Template(html);

+    };

+}();

+

+/**

+* @class Clipperz.YUI.DomHelper.Template

+* Represents an HTML fragment template.

+* For more information see <a href="http://www.jackslocum.com/yui/2006/10/06/domhelper-create-elements-using-dom-html-fragments-or-templates/">this blog post with examples</a>. 

+* <br>

+* <b>This class is also available as YAHOO.ext.Template</b>.

+* @constructor

+* @param {String/Array} html The HTML fragment or an array of fragments to join('') or multiple arguments to join('')

+*/

+Clipperz.YUI.DomHelper.Template = function(html){

+    if(html instanceof Array){

+        html = html.join(''); 

+    }else if(arguments.length > 1){

+        html = Array.prototype.join.call(arguments, '');

+    }

+    /**@private*/

+    this.html = html;

+};

+Clipperz.YUI.DomHelper.Template.prototype = {

+    /**

+     * Returns an HTML fragment of this template with the specified values applied

+     * @param {Object} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})

+     * @return {String}

+     */

+    applyTemplate : function(values){

+        if(this.compiled){

+            return this.compiled(values);

+        }

+        var empty = '';

+        var fn = function(match, index){

+            if(typeof values[index] != 'undefined'){

+                return values[index];

+            }else{

+                return empty;

+            }

+        }

+        return this.html.replace(this.re, fn);

+    },

+    

+    /**

+    * The regular expression used to match template variables 

+    * @type RegExp

+    * @property 

+    */

+    re : /\{([\w|-]+)\}/g,

+    

+    /**

+     * Compiles the template into an internal function, eliminating the RegEx overhead

+     */

+    compile : function(){

+        var body = ["this.compiled = function(values){ return ['"];

+        body.push(this.html.replace(this.re, "', values['$1'], '"));

+        body.push("'].join('');};");

+        eval(body.join(''));

+        return this;

+    },

+   

+    /**

+     * Applies the supplied values to the template and inserts the new node(s) before el

+     * @param {String/HTMLElement/Element} el The context element

+     * @param {Object} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})

+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element

+     * @return {HTMLElement} The new node

+     */

+    insertBefore: function(el, values, returnElement){

+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);

+        var newNode = Clipperz.YUI.DomHelper.insertHtml('beforeBegin', el, this.applyTemplate(values));

+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;

+    },

+    

+    /**

+     * Applies the supplied values to the template and inserts the new node(s) after el

+     * @param {String/HTMLElement/Element} el The context element

+     * @param {Object} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})

+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element

+     * @return {HTMLElement} The new node

+     */

+    insertAfter : function(el, values, returnElement){

+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);

+        var newNode = Clipperz.YUI.DomHelper.insertHtml('afterEnd', el, this.applyTemplate(values));

+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;

+    },

+    

+    /**

+     * Applies the supplied values to the template and append the new node(s) to el

+     * @param {String/HTMLElement/Element} el The context element

+     * @param {Object} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})

+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element

+     * @return {HTMLElement} The new node

+     */

+    append : function(el, values, returnElement){

+		var sanitizedValues;

+		var key;

+		

+//		sanitizedValues = MochiKit.Base.map(sanitizedValues)

+//console.log("values", values);

+		sanitizedValues = {};

+		for (key in values) {

+			sanitizedValues[key] = Clipperz.Base.sanitizeString(values[key]);

+		}

+//console.log("sanitizedValues", sanitizedValues);

+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);

+        var newNode = Clipperz.YUI.DomHelper.insertHtml('beforeEnd', el, this.applyTemplate(sanitizedValues));

+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;

+    },

+    

+    /**

+     * Applies the supplied values to the template and overwrites the content of el with the new node(s)

+     * @param {String/HTMLElement/Element} el The context element

+     * @param {Object} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})

+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element

+     * @return {HTMLElement} The new node

+     */

+    overwrite : function(el, values, returnElement){

+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);

+        el.innerHTML = '';

+        var newNode = Clipperz.YUI.DomHelper.insertHtml('beforeEnd', el, this.applyTemplate(values));

+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;

+    }

+};

+/**

+ * Alias for applyTemplate

+ * @method

+ */

+Clipperz.YUI.DomHelper.Template.prototype.apply = Clipperz.YUI.DomHelper.Template.prototype.applyTemplate;

+

+YAHOO.ext.Template = Clipperz.YUI.DomHelper.Template;

diff --git a/frontend/beta/js/Clipperz/YUI/DomQuery.js b/frontend/beta/js/Clipperz/YUI/DomQuery.js
new file mode 100644
index 0000000..84aac08
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/YUI/DomQuery.js
@@ -0,0 +1,710 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library 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.
+
+* Javascript Crypto Library 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 Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+/*
+ * yui-ext 0.40
+ * Copyright(c) 2006, Jack Slocum.
+ */
+
+/**
+ * @class Ext.DomQuery
+ * Provides high performance selector/xpath processing by compiling queries into reusable functions.
+ * New pseudo classes and matchers can be plugged. It works on HTML and XML documents (if a content node is passed in).
+ * @singleton
+ */
+Ext.DomQuery = function(){
+    var cache = {}, simpleCache = {}, valueCache = {};
+    var nonSpace = /\S/;
+    var trimRe = /^\s*(.*?)\s*$/;
+    var tplRe = /\{(\d+)\}/g;
+    var modeRe = /^(\s?[\/>]\s?|\s|$)/;
+    var clsRes = {};
+    
+    function child(p, index){
+        var i = 0;
+        var n = p.firstChild;
+        while(n){
+            if(n.nodeType == 1){
+               i++;
+               if(i == index){
+                   return n;
+               }
+            }
+            n = n.nextSibling;
+        }
+        return null;
+    };
+    
+    function next(d){
+        var n = d.nextSibling;
+        while(n && n.nodeType != 1){
+            n = n.nextSibling;
+        }
+        return n;
+    };
+    
+    function prev(d){
+        var n = d.previousSibling;
+        while(n && n.nodeType != 1){
+            n = n.previousSibling;
+        }
+        return n;
+    };
+    
+    function clean(d){
+        var n = d.firstChild, ni = -1;
+ 	    while(n){
+ 	        var nx = n.nextSibling;
+ 	        if(n.nodeType == 3 && !nonSpace.test(n.nodeValue)){
+ 	            d.removeChild(n);
+ 	        }else{
+ 	            n.nodeIndex = ++ni;
+ 	        }
+ 	        n = nx;
+ 	    }
+ 	    return this;
+ 	};
+    
+    function byClassName(c, a, v){
+        if(!v){
+            return c;
+        }
+        var re = clsRes[v];
+        if(!re){
+            re = new RegExp('(?:^|\\s)(?:' + v + ')(?:\\s|$)');
+            clsRes[v] = re;
+        }
+        var r = [];
+        for(var i = 0, ci; ci = c[i]; i++){
+            if(re.test(ci.className)){
+                r[r.length] = ci;
+            }
+        }
+        return r;
+    };
+    
+    function convert(c){
+        if(c.slice){
+            return c;
+        }
+        var r = [];
+        for(var i = 0, l = c.length; i < l; i++){
+            r[r.length] = c[i];
+        }
+        return r;
+    };
+    
+    function attrValue(n, attr){
+        if(!n.tagName && typeof n.length != 'undefined'){
+            n = n[0];
+        }
+        if(!n){
+            return null;
+        }
+        if(attr == 'for'){
+            return n.htmlFor;
+        }
+        if(attr == 'class' || attr == 'className'){
+            return n.className;
+        }
+        return n.getAttribute(attr) || n[attr];
+          
+    };
+    
+    function getNodes(ns, mode, tagName){
+        var result = [], cs;
+        if(!ns){
+            return result;
+        }
+        mode = mode ? mode.replace(trimRe, '$1') : '';
+        tagName = tagName || '*';
+        if(ns.tagName || ns == document){
+            ns = [ns];   
+        }
+        if(mode != '/' && mode != '>'){
+            for(var i = 0, ni; ni = ns[i]; i++){
+                cs = ni.getElementsByTagName(tagName);
+                result = concat(result, cs);
+            }
+        }else{
+            for(var i = 0, ni; ni = ns[i]; i++){
+                var cn = ni.getElementsByTagName(tagName);
+                for(var j = 0, cj; cj = cn[j]; j++){
+                    if(cj.parentNode == ni){
+                        result[result.length] = cj;
+                    }
+                }
+            }
+            
+        }
+        return result;
+    };
+    
+    function concat(a, b){
+        if(b.slice){
+            return a.concat(b);
+        }
+        for(var i = 0, l = b.length; i < l; i++){
+            a[a.length] = b[i];
+        }
+        return a;
+    }
+    
+    function byTag(cs, tagName){
+        if(cs.tagName || cs == document){
+            cs = [cs];
+        }
+        if(!tagName){
+            return cs;
+        }
+        var r = []; tagName = tagName.toLowerCase();
+        for(var i = 0, ci; ci = cs[i]; i++){
+            if(ci.nodeType == 1 && ci.tagName.toLowerCase()==tagName){
+                r[r.length] = ci;
+            }
+        }
+        return r; 
+    };
+    
+    function byId(cs, attr, id){
+        if(cs.tagName || cs == document){
+            cs = [cs];
+        }
+        if(!id){
+            return cs;
+        }
+        var r = [];
+        for(var i = 0, l = cs.length; i < l; i++){
+            var ci = cs[i];
+            if(ci && ci.id == id){
+                r[r.length] = ci;
+            }
+        }
+        return r; 
+    };
+    
+    function byAttribute(cs, attr, value, op, custom){
+        var r = [], st = custom=='{';
+        var f = Ext.DomQuery.operators[op];
+        for(var i = 0, l = cs.length; i < l; i++){
+            var a;
+            if(st){
+                a = Ext.DomQuery.getStyle(cs[i], attr);
+            }
+            else if(attr == 'class' || attr == 'className'){
+                a = cs[i].className;
+            }else if(attr == 'for'){
+                a = cs[i].htmlFor;
+            }else{
+                a = cs[i].getAttribute(attr);
+            }
+            if((f && f(a, value)) || (!f && a)){
+                r[r.length] = cs[i];
+            }
+        }
+        return r;
+    };
+    
+    function byPseudo(cs, name, value){
+        return Ext.DomQuery.pseudos[name](cs, value);
+    };
+    
+    // This is for IE MSXML which does not support expandos.
+    // IE runs the same speed using setAttribute, however FF slows way down
+    // and Safari completely fails so they need to continue to use expandos.
+    // Branched at load time for faster execution.
+    var isIE = window.ActiveXObject;
+    var addAttr = isIE ? 
+           function(n, a, v){
+              n.setAttribute(a, v);
+           } : 
+           function(n, a, v){
+              n[a] = v;
+           };
+    var getAttr = isIE ? 
+           function(n, a){
+              return n.getAttribute(a);
+           } : 
+           function(n, a){
+              return n[a];
+           };
+    var clearAttr = isIE ? 
+           function(n, a){
+              n.removeAttribute(a);
+           } : 
+           function(n, a, v){
+              delete n[a];
+           };
+    
+    function nodup(cs){
+        if(!cs.length){
+            return cs;
+        }
+        addAttr(cs[0], '_nodup', true);
+        var r = [cs[0]];
+        for(var i = 1, len = cs.length; i < len; i++){
+            var c = cs[i];
+            if(!getAttr(c, '_nodup')){
+                addAttr(c, '_nodup', true);
+                r[r.length] = c;
+            }
+        }
+        for(var i = 0, len = cs.length; i < len; i++){
+            clearAttr(cs[i], '_nodup');
+        }
+        return r;
+    }
+    
+    function quickDiff(c1, c2){
+        if(!c1.length){
+            return c2;
+        }
+        for(var i = 0, len = c1.length; i < len; i++){
+            addAttr(c1[i], '_qdiff', true);
+        }
+        var r = [];
+        for(var i = 0, len = c2.length; i < len; i++){
+            if(!getAttr(c2[i], '_qdiff')){
+                r[r.length] = c2[i];
+            }
+        }
+        for(var i = 0, len = c1.length; i < len; i++){
+            clearAttr(c1[i], '_qdiff');
+        }
+        return r;
+    }
+    
+    function quickId(ns, mode, root, id){
+        if(ns == root){
+           var d = root.ownerDocument || root;
+           return d.getElementById(id);
+        }
+        ns = getNodes(ns, mode, '*');
+        return byId(ns, null, id);
+    }
+    
+    return {
+        getStyle : function(el, name){
+            return YAHOO.util.Dom.getStyle(el, name);  
+        },
+        /**
+         * Compiles a selector/xpath query into a reusable function. The returned function
+         * takes one parameter "root" (optional), which is the context node from where the query should start. 
+         * @param {String} selector The selector/xpath query
+         * @param {String} type (optional) Either 'select' (the default) or 'simple' for a simple selector match
+         * @return {Function}
+         */
+        compile : function(path, type){
+            // strip leading slashes
+            while(path.substr(0, 1)=='/'){
+                path = path.substr(1);
+            }
+            type = type || 'select';
+            
+            var fn = ['var f = function(root){\n var mode; var n = root || document;\n'];
+            var q = path, mode, lq;
+            var tk = Ext.DomQuery.matchers;
+            var tklen = tk.length;
+            var mm;
+            while(q && lq != q){
+                lq = q;
+                var tm = q.match(/^(#)?([\w-\*]+)/);
+                if(type == 'select'){
+                    if(tm){
+                        if(tm[1] == '#'){
+                            fn[fn.length] = 'n = quickId(n, mode, root, "'+tm[2]+'");';
+                        }else{
+                            fn[fn.length] = 'n = getNodes(n, mode, "'+tm[2]+'");';
+                        }
+                        q = q.replace(tm[0], '');
+                    }else{
+                        fn[fn.length] = 'n = getNodes(n, mode, "*");';
+                    }
+                }else{
+                    if(tm){
+                        if(tm[1] == '#'){
+                            fn[fn.length] = 'n = byId(n, null, "'+tm[2]+'");';
+                        }else{
+                            fn[fn.length] = 'n = byTag(n, "'+tm[2]+'");';
+                        }
+                        q = q.replace(tm[0], '');
+                    }
+                }
+                while(!(mm = q.match(modeRe))){
+                    var matched = false;
+                    for(var j = 0; j < tklen; j++){
+                        var t = tk[j];
+                        var m = q.match(t.re);
+                        if(m){
+                            fn[fn.length] = t.select.replace(tplRe, function(x, i){
+                                                    return m[i];
+                                                });
+                            q = q.replace(m[0], '');
+                            matched = true;
+                            break;
+                        }
+                    }
+                    // prevent infinite loop on bad selector
+                    if(!matched){
+                        throw 'Error parsing selector, parsing failed at "' + q + '"';
+                    }
+                }
+                if(mm[1]){
+                    fn[fn.length] = 'mode="'+mm[1]+'";';
+                    q = q.replace(mm[1], '');
+                }
+            }
+            fn[fn.length] = 'return nodup(n);\n}';
+            eval(fn.join(''));
+            return f;
+        },
+        
+        /**
+         * Selects a group of elements.
+         * @param {String} selector The selector/xpath query
+         * @param {Node} root (optional) The start of the query (defaults to document).
+         * @return {Array}
+         */
+        select : function(path, root, type){
+            if(!root || root == document){
+                root = document;
+            }
+            if(typeof root == 'string'){
+                root = document.getElementById(root);
+            }
+            var paths = path.split(',');
+            var results = [];
+            for(var i = 0, len = paths.length; i < len; i++){
+                var p = paths[i].replace(trimRe, '$1');
+                if(!cache[p]){
+                    cache[p] = Ext.DomQuery.compile(p);
+                    if(!cache[p]){
+                        throw p + ' is not a valid selector';
+                    }
+                }
+                var result = cache[p](root);
+                if(result && result != document){
+                    results = results.concat(result);
+                }
+            }
+            return results;
+        },
+        
+        /**
+         * Selects a single element.
+         * @param {String} selector The selector/xpath query
+         * @param {Node} root (optional) The start of the query (defaults to document).
+         * @return {Element}
+         */
+        selectNode : function(path, root){
+            return Ext.DomQuery.select(path, root)[0];
+        },
+        
+        /**
+         * Selects the value of a node, optionally replacing null with the defaultValue.
+         * @param {String} selector The selector/xpath query
+         * @param {Node} root (optional) The start of the query (defaults to document).
+         * @param {String} defaultValue
+         */
+        selectValue : function(path, root, defaultValue){
+            path = path.replace(trimRe, '$1');
+            if(!valueCache[path]){
+                valueCache[path] = Ext.DomQuery.compile(path, 'simple');
+            }
+            var n = valueCache[path](root);
+            n = n[0] ? n[0] : n;
+            var v = (n && n.firstChild ? n.firstChild.nodeValue : null);
+            return (v === null ? defaultValue : v);
+        },
+        
+        /**
+         * Selects the value of a node, parsing integers and floats.
+         * @param {String} selector The selector/xpath query
+         * @param {Node} root (optional) The start of the query (defaults to document).
+         * @param {Number} defaultValue
+         * @return {Number}
+         */
+        selectNumber : function(path, root, defaultValue){
+            var v = Ext.DomQuery.selectValue(path, root, defaultValue || 0);
+            return parseFloat(v);
+        },
+        
+        /**
+         * Returns true if the passed element(s) match the passed simple selector (e.g. div.some-class or span:first-child)
+         * @param {String/HTMLElement/Array} el An element id, element or array of elements
+         * @param {String} selector The simple selector to test
+         * @return {Boolean}
+         */
+        is : function(el, ss){
+            if(typeof el == 'string'){
+                el = document.getElementById(el);
+            }
+            var isArray = (el instanceof Array);
+            var result = Ext.DomQuery.filter(isArray ? el : [el], ss);
+            return isArray ? (result.length == el.length) : (result.length > 0);
+        },
+        
+        /**
+         * Filters an array of elements to only include matches of a simple selector (e.g. div.some-class or span:first-child)
+         * @param {Array} el An array of elements to filter
+         * @param {String} selector The simple selector to test
+         * @param {Boolean} nonMatches If true, it returns the elements that DON'T match 
+         * the selector instead of the ones that match
+         * @return {Array}
+         */
+        filter : function(els, ss, nonMatches){
+            ss = ss.replace(trimRe, '$1');
+            if(!simpleCache[ss]){
+                simpleCache[ss] = Ext.DomQuery.compile(ss, 'simple');
+            }
+            var result = simpleCache[ss](els);
+            return nonMatches ? quickDiff(result, els) : result;
+        },
+        
+        /**
+         * Collection of matching regular expressions and code snippets. 
+         */
+        matchers : [{
+                re: /^\.([\w-]+)/,
+                select: 'n = byClassName(n, null, "{1}");'
+            }, {
+                re: /^\:([\w-]+)(?:\(((?:[^\s>\/]*|.*?))\))?/,
+                select: 'n = byPseudo(n, "{1}", "{2}");'
+            },{
+                re: /^(?:([\[\{])(?:@)?([\w-]+)\s?(?:(=|.=)\s?['"]?(.*?)["']?)?[\]\}])/,
+                select: 'n = byAttribute(n, "{2}", "{4}", "{3}", "{1}");'
+            }, {
+                re: /^#([\w-]+)/,
+                select: 'n = byId(n, null, "{1}");'
+            },{
+                re: /^@([\w-]+)/,
+                select: 'return {firstChild:{nodeValue:attrValue(n, "{1}")}};'
+            }
+        ],
+        
+        /**
+         * Collection of operator comparison functions. The default operators are =, !=, ^=, $=, *= and %=.
+         * New operators can be added as long as the match the format <i>c</i>= where <i>c<i> is any character other than space, &gt; &lt;.
+         */
+        operators : {
+            '=' : function(a, v){
+                return a == v;
+            },
+            '!=' : function(a, v){
+                return a != v;
+            },
+            '^=' : function(a, v){
+                return a && a.substr(0, v.length) == v;
+            },
+            '$=' : function(a, v){
+                return a && a.substr(a.length-v.length) == v;
+            },
+            '*=' : function(a, v){
+                return a && a.indexOf(v) !== -1;
+            },
+            '%=' : function(a, v){
+                return (a % v) == 0;
+            }
+        },
+        
+        /**
+         * Collection of "pseudo class" processors. Each processor is passed the current nodeset (array)
+         * and the argument (if any) supplied in the selector.
+         */
+        pseudos : {
+            'first-child' : function(c){
+                var r = [];
+                for(var i = 0, l = c.length; i < l; i++){
+                    var ci = c[i];
+                    if(!prev(ci)){
+                        r[r.length] = ci;
+                    }
+                }
+                return r;
+            },
+            
+            'last-child' : function(c){
+                var r = [];
+                for(var i = 0, l = c.length; i < l; i++){
+                    var ci = c[i];
+                    if(!next(ci)){
+                        r[r.length] = ci;
+                    }
+                }
+                return r;
+            },
+            
+            'nth-child' : function(c, a){
+                var r = [];
+                if(a != 'odd' && a != 'even'){
+                    for(var i = 0, ci; ci = c[i]; i++){
+                        var m = child(ci.parentNode, a);
+                        if(m == ci){
+                            r[r.length] = m;
+                        }
+                    }
+                    return r;
+                }
+                var p;
+                // first let's clean up the parent nodes
+                for(var i = 0, l = c.length; i < l; i++){
+                    var cp = c[i].parentNode;
+                    if(cp != p){
+                        clean(cp);
+                        p = cp;
+                    }
+                }
+                // then lets see if we match
+                for(var i = 0, l = c.length; i < l; i++){
+                    var ci = c[i], m = false;
+                    if(a == 'odd'){
+                        m = ((ci.nodeIndex+1) % 2 == 1);
+                    }else if(a == 'even'){
+                        m = ((ci.nodeIndex+1) % 2 == 0);
+                    }
+                    if(m){
+                        r[r.length] = ci;
+                    }
+                }
+                return r;
+            },
+            
+            'only-child' : function(c){
+                var r = [];
+                for(var i = 0, l = c.length; i < l; i++){
+                    var ci = c[i];
+                    if(!prev(ci) && !next(ci)){
+                        r[r.length] = ci;
+                    }
+                }
+                return r;
+            },
+            
+            'empty' : function(c){
+                var r = [];
+                for(var i = 0, l = c.length; i < l; i++){
+                    var ci = c[i];
+                    if(!ci.firstChild){
+                        r[r.length] = ci;
+                    }
+                }
+                return r;
+            },
+            
+            'contains' : function(c, v){
+                var r = [];
+                for(var i = 0, l = c.length; i < l; i++){
+                    var ci = c[i];
+                    if(ci.innerHTML.indexOf(v) !== -1){
+                        r[r.length] = ci;
+                    }
+                }
+                return r;
+            },
+            
+            'checked' : function(c){
+                var r = [];
+                for(var i = 0, l = c.length; i < l; i++){
+                    if(c[i].checked == 'checked'){
+                        r[r.length] = c[i];
+                    }
+                }
+                return r;
+            },
+            
+            'not' : function(c, ss){
+                return Ext.DomQuery.filter(c, ss, true);
+            },
+            
+            'odd' : function(c){
+                return this['nth-child'](c, 'odd');
+            },
+            
+            'even' : function(c){
+                return this['nth-child'](c, 'even');
+            },
+            
+            'nth' : function(c, a){
+                return c[a-1];
+            },
+            
+            'first' : function(c){
+                return c[0];
+            },
+            
+            'last' : function(c){
+                return c[c.length-1];
+            },
+            
+            'has' : function(c, ss){
+                var s = Ext.DomQuery.select;
+                var r = [];
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if(s(ss, ci).length > 0){
+                        r[r.length] = ci;
+                    }
+                }
+                return r;
+            },
+            
+            'next' : function(c, ss){
+                var is = Ext.DomQuery.is;
+                var r = [];
+                for(var i = 0, ci; ci = c[i]; i++){
+                    var n = next(ci);
+                    if(n && is(n, ss)){
+                        r[r.length] = ci;
+                    }
+                }
+                return r;
+            },
+            
+            'prev' : function(c, ss){
+                var is = Ext.DomQuery.is;
+                var r = [];
+                for(var i = 0, ci; ci = c[i]; i++){
+                    var n = prev(ci);
+                    if(n && is(n, ss)){
+                        r[r.length] = ci;
+                    }
+                }
+                return r;
+            }
+        }
+    };
+}();
+
+/**
+ * Selects an array of DOM nodes by CSS/XPath selector. Shorthand of {@link Ext.DomQuery#select}
+ * @param {String} path The selector/xpath query
+ * @param {Node} root (optional) The start of the query (defaults to document).
+ * @return {Array}
+ * @member Ext
+ * @method query
+ */
+Ext.query = Ext.DomQuery.select;
diff --git a/frontend/beta/js/Clipperz/YUI/Drawer.js b/frontend/beta/js/Clipperz/YUI/Drawer.js
new file mode 100644
index 0000000..394912e
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/YUI/Drawer.js
@@ -0,0 +1,238 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library 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.
+
+* Javascript Crypto Library 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 Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.YUI) == 'undefined') { Clipperz.YUI = {}; }
+
+
+Clipperz.YUI.Drawer = function(anElement, aRegion) {
+	this._status = 'slideIn';
+	
+	this._element = YAHOO.ext.Element.get(anElement);
+	this._region = aRegion || null;
+
+	this._collapsedElement = this.element().getChildrenByClassName("drawer-collapsed")[0];
+	this._contentElement = this.element().getChildrenByClassName("drawer-content")[0];
+
+	
+	this._wholeCollapedElement = this.enhanceCollapsedElement();
+	this._wholeCollapedElement.setWidth(this.region().element().getWidth());
+	this._wholeCollapedElement.setHeight(this.region().element().getHeight());
+	
+	this._contentWrapper = this.enhanceContentElement();
+	this._contentElementActor = new YAHOO.ext.Actor(this.contentWrapper().dom);
+	this.contentElementActor().hide();
+	
+	this._contentWidth = 200;
+};
+
+YAHOO.extendX(Clipperz.YUI.Drawer, YAHOO.ext.util.Observable, {
+
+	'element': function() {
+		return this._element;
+	},
+
+	//-----------------------------------------------------
+
+	'status': function() {
+		return this._status;
+	},
+	
+	'setStatus': function(aValue) {
+		this._status = aValue;
+	},
+	
+	//-----------------------------------------------------
+
+	'collapsedElement': function() {
+		return this._collapsedElement;
+	},
+
+	//-----------------------------------------------------
+
+	'contentElement': function() {
+		return this._contentElement;
+	},
+	
+	//-----------------------------------------------------
+
+	'contentElementActor': function() {
+		return this._contentElementActor;
+	},
+	
+	//-----------------------------------------------------
+
+	'contentWrapper': function() {
+		return this._contentWrapper;
+	},
+	
+	//-----------------------------------------------------
+
+	'contentWidth': function() {
+		return this._contentWidth;
+	},
+
+	//-----------------------------------------------------
+
+	'region': function() {
+		return this._region;
+	},
+	
+	//-----------------------------------------------------
+
+	'enhanceCollapsedElement': function() {
+		var	wrapper;
+		var link;
+		
+		wrapper = this.collapsedElement().wrap({tag:'div', cls:'drawer-collapsedElement-wrapper', children:[
+			{tag:'div', cls:'drawer-pin-button', children:[
+				{tag:'a', cls:'drawer-pin-button', href:"#", children:[
+					{tag:'img', src:'./images/directLogins/drawer/mm-expand.gif'}
+				]}
+			]}
+		]});
+		
+		link = wrapper.getChildrenByClassName('drawer-pin-button', 'a')[0];
+		MochiKit.Signal.connect(link.dom, 'onclick', this, 'pinDrawer');
+		
+		this.collapsedElement().setHeight('100%');
+		this.collapsedElement().setStyle('cursor', 'pointer');
+		MochiKit.Signal.connect(this.collapsedElement().dom, 'onclick', this, 'showDrawer');
+		
+		return wrapper;
+	},
+
+	//-----------------------------------------------------
+
+	'enhanceContentElement': function() {
+		var wrapper;
+		
+		wrapper = this.contentElement().wrap({tag:'div', cls:'drawer-content-wrapper', children:[
+			{tag:'div', cls:'drawer-content-header', html:'direct login', style:'width:100%;'}
+		]});
+		
+		MochiKit.Signal.connect(wrapper.dom, 'onclick', this, 'hideDrawer');
+		return wrapper;
+	},
+
+	//-----------------------------------------------------
+
+	'pinDrawer': function() {
+		alert("pin drawer");
+	},
+
+	//-----------------------------------------------------
+
+	'showDrawer': function() {
+		if (this.status() == 'slideIn') {
+			var actor;
+
+			this.setStatus('slidingOut');
+			actor = this.contentElementActor();
+			actor.setHeight(this.region().element().getHeight());
+		
+			actor.startCapture(true);
+			actor.alignTo(this.element(), 'tr');
+			actor.blindShow('left', this.contentWidth(), .35);
+			actor.play(this.onSlideOut.createDelegate(this));
+		}
+	},
+	
+	//-----------------------------------------------------
+
+	'onSlideOut': function() {
+		this.setStatus('slideOut');
+MochiKit.Logging.logDebug(">>> onSlideOut");
+//		alert("done");
+	},
+
+	//-----------------------------------------------------
+/*
+	'showContentElement': function() {
+		var top, left, width, height;
+
+MochiKit.Logging.logDebug(">>> showContentElement");
+
+
+		top = this.element().getTop(true);
+		left = this.element().getRight();
+		width = this.contentWidth();
+		height = this.element().getHeight();
+
+		this.contentWrapper().setStyle('position', 'absolute');
+		this.contentWrapper().setStyle('overflow', 'none');
+		this.contentWrapper().setStyle('visibility', 'visible');
+		this.contentWrapper().setStyle('z-index', '10');
+
+		this.contentWrapper().setLeft(left);
+		this.contentWrapper().setTop(top);
+		this.contentWrapper().setHeight(height);
+		this.contentWrapper().setWidth(width);
+
+		this.contentWrapper().show();
+	},
+*/	
+	//-----------------------------------------------------
+
+	'hideDrawer': function() {
+		if (this.status() == 'slideOut') {
+			var actor;
+
+			this.setStatus('slidingIn');
+
+			actor = this.contentElementActor();
+			actor.setHeight(this.region().element().getHeight());
+		
+			actor.startCapture(true);
+			actor.alignTo(this.element(), 'tr');
+			actor.blindHide('left', .35);
+			actor.setVisible(false);
+			actor.play(this.onSlideIn.createDelegate(this));
+		}
+	},
+	
+	//-----------------------------------------------------
+
+	'onSlideIn': function() {
+		this.setStatus('slideIn');
+MochiKit.Logging.logDebug(">>> onSlideIn");
+//		alert("done");
+	},
+
+	//-----------------------------------------------------
+	
+	'hideContentElement': function() {
+		this.contentWrapper().hide();
+	},
+	
+	//-----------------------------------------------------
+	//-----------------------------------------------------
+
+	//-----------------------------------------------------
+	__syntaxFix__: '__syntaxFix__'
+});
\ No newline at end of file
diff --git a/frontend/beta/js/Clipperz/YUI/IBLayoutManager.js b/frontend/beta/js/Clipperz/YUI/IBLayoutManager.js
new file mode 100644
index 0000000..626b699
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/YUI/IBLayoutManager.js
@@ -0,0 +1,114 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library 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.
+
+* Javascript Crypto Library 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 Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.YUI) == 'undefined') { Clipperz.YUI = {}; }
+
+
+Clipperz.YUI.IBLayoutManager = function(container, config) {
+	var regionName;
+	var	element;
+	
+	config = config || {};
+	
+    Clipperz.YUI.IBLayoutManager.superclass.constructor.call(this, container);
+    this.hideOnLayout = config.hideOnLayout || false;
+
+	element = YAHOO.ext.Element.get(container);
+	element.setStyle('position', 'absolute');
+	element.setStyle('overflow', 'hidden');
+	
+	for (regionName in config.regions) {
+		var newRegion;
+		
+		newRegion = new new Clipperz.YUI.IBLayoutRegion(this, regionName, config.regions[regionName]);
+		this.addRegion(regionName, newRegion);
+	}
+	
+	this.layout();
+};
+
+YAHOO.extendX(Clipperz.YUI.IBLayoutManager, YAHOO.ext.LayoutManager, {
+	
+	'toString': function() {
+		return "IBLayoutManager (" + this.el.id + ")";
+	},
+	
+	//-----------------------------------------------------
+
+	'add': function(aName, aPanel) {
+		var regionName;
+		
+        regionName = aName.toLowerCase();
+        return this.regions[regionName].add(aPanel);
+	},
+
+	//-----------------------------------------------------
+    
+	'addRegion': function(aRegion) {
+		var regionName;
+		
+		regionName = aRegion.name().toLowerCase();
+		if (!this.regions[regionName]) {
+//MochiKit.Logging.logDebug("--- adding region with name: " + aRegion.name());
+			this.regions[regionName] = aRegion;
+		} else {
+			// ????
+		}
+		
+		return aRegion;
+	},
+
+	//-----------------------------------------------------
+
+	'getRegion': function(target){
+		return this.regions[target.toLowerCase()];
+	},
+	
+	//-----------------------------------------------------
+
+	'layout': function(){
+		var	region;
+
+//MochiKit.Logging.logDebug(">>> IBLayoutManager.layout - regions: " + Clipperz.Base.serializeJSON(MochiKit.Base.keys(this.regions)));
+		for (region in this.regions) {
+//MochiKit.Logging.logDebug("--- IBLayoutManager.layout - region: " + region);
+			this.regions[region].layout();
+		}
+//MochiKit.Logging.logDebug("<<< IBLayoutManager.layout");
+	},
+	
+	//-----------------------------------------------------
+
+	'getSize': function() {
+		return this.el.getSize();
+	},
+    
+	//-----------------------------------------------------
+	__syntaxFix__: '__syntaxFix__'
+});
diff --git a/frontend/beta/js/Clipperz/YUI/IBLayoutRegion.js b/frontend/beta/js/Clipperz/YUI/IBLayoutRegion.js
new file mode 100644
index 0000000..2fd4377
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/YUI/IBLayoutRegion.js
@@ -0,0 +1,249 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library 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.
+
+* Javascript Crypto Library 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 Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.YUI) == 'undefined') { Clipperz.YUI = {}; }
+
+
+Clipperz.YUI.IBLayoutRegion = function(aManager, aName, aConfig) {
+	this._configuration = aConfig;
+
+//	Clipperz.YUI.IBLayoutRegion.superclass.constructor.call();
+	Clipperz.YUI.IBLayoutRegion.superclass.constructor.call(this, aManager, aConfig, aName);
+};
+
+YAHOO.extendX(Clipperz.YUI.IBLayoutRegion, YAHOO.ext.LayoutRegion, {
+
+	'toString': function() {
+		return "IBLayoutRegion (" + this.name() + ")";
+	},
+
+	//-----------------------------------------------------
+
+	'name': function() {
+		return this.position;
+	},
+
+	//-----------------------------------------------------
+
+	'manager': function() {
+		return this.mgr;
+	},
+
+	'configuration': function() {
+		return this._configuration;
+	},
+
+	//-----------------------------------------------------
+
+	'getAttributeValue': function(anAttribute) {
+		var result;
+		
+		switch(anAttribute) {
+			case "top":
+				result = this.element().getTop();
+				break;
+			case "left":
+				result = this.element().getLeft();
+				break;
+			case "bottom":
+				result = this.element().getBottom();
+				break;
+			case "right":
+				result = this.element().getRight();
+				break;
+			case "height":
+				result = this.element().getHeight();
+				break;
+			case "width":
+				result = this.element().getWidth();
+				break;
+		}
+//MochiKit.Logging.logDebug("--- " + this.name() + " [" + anAttribute + "] = " + result);
+		
+		return result;
+	},
+	
+	//-----------------------------------------------------
+
+	'normalizeConfigureValue': function(aConfigurationValue) {
+		var result;
+
+//MochiKit.Logging.logDebug("--- normalizeConfigureValue - " + aConfigurationValue);
+		if (typeof(aConfigurationValue) == 'number') {
+			result = aConfigurationValue;
+		} else if (aConfigurationValue == 'auto') {
+			result = aConfigurationValue;
+		} else {
+			var splitValues;
+			var referenceValue;
+			var deltaValue;
+			var targetRegion;
+			var targetAttribute;
+			
+			splitValues = aConfigurationValue.split('+');
+			referenceValue = Clipperz.Base.trim(splitValues[0]);
+			deltaValue = Clipperz.Base.trim(splitValues[1] || "");
+			
+			splitValues = referenceValue.split('.');
+			targetRegion = splitValues[0];
+			targetAttribute = splitValues[1];
+			
+//MochiKit.Logging.logDebug("> " + aConfigurationValue);
+//MochiKit.Logging.logDebug(">> manager: " + this.manager());
+//MochiKit.Logging.logDebug(">> targetRegion: " + targetRegion);
+//MochiKit.Logging.logDebug(">>> " + this.manager().getRegion(targetRegion));
+			targetValue = this.manager().getRegion(targetRegion).getAttributeValue(targetAttribute);
+//MochiKit.Logging.logDebug(">>>> " + targetRegion + "." + targetAttribute + " + " + deltaValue + " = " + targetValue);
+
+			result = targetValue + (deltaValue - 0);
+
+//MochiKit.Logging.logDebug("<<< " + aConfigurationValue + " = " + result);
+		}
+
+		return result;
+	},
+	
+	'normalizedConfiguration': function(aConfiguration) {
+		var	result;
+		var	key;
+		
+		result = {};
+
+//MochiKit.Logging.logDebug("--- normalizedConfiguration - keys: " + Clipperz.Base.serializeJSON(MochiKit.Base.keys(aConfiguration)));
+		for (key in aConfiguration) {
+			if ((key == 'top') || (key == 'bottom') || (key == 'left') || (key == 'rigth') || (key == 'width') || (key == 'height')) {
+				result[key] = this.normalizeConfigureValue(aConfiguration[key]);
+			} else {
+				result[key] = aConfiguration[key];
+			}
+		}
+		
+		return result;
+	},
+	
+	//-----------------------------------------------------
+
+	'element': function() {
+		return this.el;
+	},
+
+	//-----------------------------------------------------
+/*
+	'hide': function() {
+MochiKit.Logging.logDebug(">>> IBLayoutManager.hide()")
+		Clipperz.YUI.IBLayoutRegion.superclass.hide.call(this);
+	},
+*/
+	//-----------------------------------------------------
+/*
+	'add': function(aPanel) {
+		Clipperz.YUI.IBLayoutRegion.superclass.add.call(this, aPanel);
+		aPanel.el.fitToParent(true);
+	},
+*/
+	//-----------------------------------------------------
+
+	'updateBox': function(aBox) {
+//MochiKit.Logging.logDebug(">>> IBLayoutRegion.updateBox - " + aBox);
+		Clipperz.YUI.IBLayoutRegion.superclass.updateBox.call(this, aBox);
+	},
+	
+	//-----------------------------------------------------
+
+	'layout': function() {
+		var	top, left, bottom, right, width, height;
+		var	element;
+		var config;
+		var windowSize;
+		var containerSize;
+
+//MochiKit.Logging.logDebug(">>> IBLayoutRegion.layout - " + this);
+		config = this.normalizedConfiguration(this.configuration());
+		element = this.element();
+//		containerSize = this.manager().getSize(true);
+		containerSize = this.manager().getSize(false);
+		windowSize = {width: YAHOO.util.Dom.getViewportWidth(), height: YAHOO.util.Dom.getViewportHeight()};
+
+//		element.setStyle("position", "absolute");
+//		element.setStyle("overflow", "none");
+
+		if (typeof(config.top) == 'number') {
+			top = config.top;
+			
+			if (typeof(config.bottom) == 'number') { 
+				height =  containerSize.height - top - config.bottom;
+			} else if (typeof(config.height) == 'number') {
+				height = config.height;
+			} else {
+				//	???
+			}
+		} else {
+			if ((typeof(config.bottom) == 'number') && (typeof(config.height) == 'number')) {
+				top = containerSize.height - (config.height + config.bottom);
+				height = config.height;
+			} else if ((config.bottom == 'auto') && (typeof(config.height) == 'number')) {
+				top = ((containerSize.height - config.height) / 2);
+				height = config.height;
+			}
+		}
+
+		if (typeof(config.left) == 'number') {
+			left = config.left;
+			
+			if (typeof(config.right) == 'number') { 
+				width =  (containerSize.width - left - config.right);
+			} else if (typeof(config.width) == 'number') {
+				width = config.width;
+			} else {
+				//	???
+			}
+		} else {
+			if ((typeof(config.right) == 'number') && (typeof(config.width) == 'number')) {
+				left = containerSize.width - (config.width + config.right);
+				width = config.width;
+			} else if ((config.right == 'auto') && (typeof(config.width) == 'number')) {
+				left = ((containerSize.width - config.width) / 2);
+				width = config.width;
+			}
+		}
+//MochiKit.Logging.logDebug("--- setting position (top: " + top + ", left: " + left + ", width: " + width + ", height: " + height + ")");
+		element.setTop(top);
+		element.setLeft(left);
+		element.setWidth(width);
+		element.setHeight(height);
+		
+		if (this.activePanel != null) {
+			this.activePanel.setSize(width, height);
+		}
+//MochiKit.Logging.logDebug("<<< IBLayoutRegion.layout");
+	},
+
+	//-----------------------------------------------------
+	__syntaxFix__: '__syntaxFix__'
+});
diff --git a/frontend/beta/js/Clipperz/YUI/MessageBox.js b/frontend/beta/js/Clipperz/YUI/MessageBox.js
new file mode 100644
index 0000000..ec33d7d
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/YUI/MessageBox.js
@@ -0,0 +1,265 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library 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.
+
+* Javascript Crypto Library 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 Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+Clipperz.YUI.MessageBox = function(){
+    var dlg, opt, mask;
+    var bodyEl, msgEl, textboxEl, textareaEl, progressEl, pp;
+    var buttons, activeTextEl, bwidth;
+    
+    var handleButton = function(button){
+        if(typeof opt.fn == 'function'){
+            if(opt.fn.call(opt.scope||window, button, activeTextEl.dom.value) !== false){
+                dlg.hide();
+            }
+        }else{
+            dlg.hide();
+        }
+    };
+    
+    return {
+	    updateButtons: function(b){
+	        var width = 0;
+	        if(!b){
+	            buttons['ok'].hide();
+	            buttons['cancel'].hide();
+	            buttons['yes'].hide();
+	            buttons['no'].hide();
+	            return width;
+	        }
+	        for(var k in buttons){
+	            if(typeof buttons[k] != 'function'){
+	                if(b[k]){
+	                    buttons[k].show();
+	                    buttons[k].setText(typeof b[k] == 'string' ? b[k] : YAHOO.ext.MessageBox.buttonText[k]);
+	                    width += buttons[k].el.getWidth()+15;
+	                }else{
+	                    buttons[k].hide();
+	                }
+	            }
+	        }
+	        return width;
+	    },
+
+        getDialog : function(){
+           if(!dlg){
+                dlg = new YAHOO.ext.BasicDialog('mb-dlg', {
+                    autoCreate:true,
+                    shadow:true,
+                    draggable:true,
+                    resizable:false,
+                    constraintoviewport:true,
+                    fixedcenter:true,
+                    shim:true,
+                    modal:true,
+                    width:400, height:100,
+                    buttonAlign:'center',
+                    closeClick : function(){
+                        if(opt && opt.buttons && opt.buttons.no && !opt.buttons.cancel){
+                            handleButton('no');
+                        }else{
+                            handleButton('cancel');
+                        }
+                    }
+                });
+                dlg.closeClick = function(){
+                    alert('wtf');
+                };
+                mask = dlg.mask;
+                dlg.addKeyListener(27, dlg.hide, dlg);
+                buttons = {};
+                buttons['ok'] = dlg.addButton(this.buttonText['ok'], handleButton.createCallback('ok'));
+                buttons['yes'] = dlg.addButton(this.buttonText['yes'], handleButton.createCallback('yes'));
+                buttons['no'] = dlg.addButton(this.buttonText['no'], handleButton.createCallback('no'));
+                buttons['cancel'] = dlg.addButton(this.buttonText['cancel'], handleButton.createCallback('cancel'));
+                bodyEl = dlg.body.createChild({
+                    tag:'div', 
+                    html:'<span class="ext-mb-text"></span><br /><input type="text" class="ext-mb-input"><textarea class="ext-mb-textarea"></textarea><div class="ext-mb-progress-wrap"><div class="ext-mb-progress"><div class="ext-mb-progress-bar">&#160;</div></div></div>'
+                });
+                msgEl = bodyEl.dom.firstChild;
+                textboxEl = getEl(bodyEl.dom.childNodes[2]);
+                textboxEl.enableDisplayMode();
+                textboxEl.addKeyListener([10,13], function(){
+                    if(dlg.isVisible() && opt && opt.buttons){
+                        if(opt.buttons.ok){
+                            handleButton('ok');
+                        }else if(opt.buttons.yes){
+                            handleButton('yes');
+                        }
+                    }
+                });
+                textareaEl = getEl(bodyEl.dom.childNodes[3]);
+                textareaEl.enableDisplayMode();
+                progressEl = getEl(bodyEl.dom.childNodes[4]);
+                progressEl.enableDisplayMode();
+                pp = getEl(progressEl.dom.firstChild.firstChild);
+            }
+            return dlg;
+        },
+        
+        updateText : function(text){
+            if(!dlg.isVisible() && !opt.width){
+                dlg.resizeTo(this.maxWidth, 100); // resize first so content is never clipped from previous shows
+            }
+            msgEl.innerHTML = text;
+            var w = Math.max(Math.min(opt.width || msgEl.offsetWidth, this.maxWidth), 
+                        Math.max(opt.minWidth || this.minWidth, bwidth));
+            if(opt.prompt){
+                activeTextEl.setWidth(w);
+            }
+            dlg.setContentSize(w, bodyEl.getHeight());
+        },        
+        
+        updateProgress : function(value, text){
+            if(text){
+                this.updateText(text);
+            }
+            pp.setWidth(value*progressEl.dom.firstChild.offsetWidth);
+        },        
+        
+        isVisible : function(){
+            return dlg && dlg.isVisible();  
+        },
+        
+        hide : function(){
+            if(this.isVisible()){
+                dlg.hide();
+            }  
+        },
+        
+        show : function(options){
+            var d = this.getDialog();
+            opt = options;
+            d.setTitle(opt.title || '&#160;');
+            d.close.setDisplayed(opt.closable !== false);
+            activeTextEl = textboxEl;
+            opt.prompt = opt.prompt || (opt.multiline ? true : false)
+            if(opt.prompt){
+                if(opt.multiline){
+                    textboxEl.hide();
+                    textareaEl.show();
+                    textareaEl.setHeight(typeof opt.multiline == 'number' ? 
+                        opt.multiline : this.defaultTextHeight);
+                    activeTextEl = textareaEl;
+                }else{
+                    textboxEl.show();
+                    textareaEl.hide();
+                }
+            }else{
+                textboxEl.hide();
+                textareaEl.hide();
+            }
+            progressEl.setDisplayed(opt.progress === true);
+            this.updateProgress(0);
+            activeTextEl.dom.value = opt.value || '';
+            if(opt.prompt){
+                dlg.setDefaultButton(activeTextEl);
+            }else{
+                var bs = opt.buttons;
+                var db = null;
+                if(bs && bs.ok){
+                    db = buttons['ok'];
+                }else if(bs && bs.yes){
+                    db = buttons['yes'];
+                }
+                dlg.setDefaultButton(db);
+            }
+            bwidth = this.updateButtons(opt.buttons);
+            this.updateText(opt.msg);
+            d.modal = opt.modal !== false;
+            d.mask = opt.modal !== false ? mask : false;
+            d.animateTarget = null;
+            d.show(options.animEl);
+        },
+        
+        progress : function(title, msg){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: false,
+                progress:true,
+                closable:false
+            });
+        },
+
+		progressElement : function() {
+			return progressEl;
+		},
+        
+		opt: function() {
+			return opt;
+		},
+		
+        alert : function(title, msg, fn, scope){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.OK,
+                fn: fn,
+                scope : scope
+            });
+        },
+        
+        confirm : function(title, msg, fn, scope){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.YESNO,
+                fn: fn,
+                scope : scope
+            });
+        },
+        
+        prompt : function(title, msg, fn, scope, multiline){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.OKCANCEL,
+                fn: fn,
+                minWidth:250,
+                scope : scope,
+                prompt:true,
+                multiline: multiline
+            });
+        },
+        
+        OK : {ok:true},
+        YESNO : {yes:true, no:true},
+        OKCANCEL : {ok:true, cancel:true},
+        YESNOCANCEL : {yes:true, no:true, cancel:true},
+        
+        defaultTextHeight:75,
+        maxWidth : 500,
+        minWidth : 100,
+        buttonText : {
+            ok : 'OK',
+            cancel : 'Cancel',
+            yes : 'Yes',
+            no : 'No'
+        }
+    };
+}();