diff --git a/UI/Templates/UIxPageFrame.wox b/UI/Templates/UIxPageFrame.wox
index 06cfa1f1a..cc32cde09 100644
--- a/UI/Templates/UIxPageFrame.wox
+++ b/UI/Templates/UIxPageFrame.wox
@@ -62,12 +62,15 @@
                 <section class="top-bar-section">
               <var:if condition="canLogoff">
                 <ul class="right">
-                  <li class="name">
-                    <a href="#"><var:if condition="userHasVacationEnabled">
+                  <li class="name has-dropdown">
+                    <a href="#" class="" data-dropdown-toggle="#userOptions"><var:if condition="userHasVacationEnabled">
                       <img rsrc:src="status.vacation-msg.png" label:title="Vacation message is enabled" />
-                    </var:if>
-                    <var:string var:value="userIdentification"/></a>
+                    </var:if><var:string var:value="userIdentification"/></a>
+                    <ul id="userOptions" class="f-dropdown">
+                      <li><a href="#"><!-- preferences / mobile version / etc --></a></li>
+                    </ul>
                   </li>
+                  <li class="divider hide-for-small"><!-- divider --></li>
                   <li>
                     <a id="logoff" var:href="logoffPath"><var:string label:value="Disconnect"/></a>
                   </li>
@@ -143,12 +146,11 @@
 	  </script>
 	  <script type="text/javascript" rsrc:src="js/vendor/underscore-min.js"><!-- space --></script>
 	  <script type="text/javascript" rsrc:src="js/vendor/angular.js"><!-- space --></script>
-	  <script type="text/javascript" rsrc:src="js/vendor/angular-route.js"><!-- space --></script>
 	  <script type="text/javascript" rsrc:src="js/vendor/angular-sanitize.js"><!-- space --></script>
-	  <script type="text/javascript" rsrc:src="js/vendor/mm-foundation.js"><!-- space --></script>
-          <script type="text/javascript" rsrc:src="js/app.js"><!-- space --></script>
-          <script type="text/javascript" rsrc:src="js/SOGo.js"><!-- space --></script>
-	  <var:if condition="hasProductSpecificJavaScript"><script type="text/javascript"
+	  <script type="text/javascript" rsrc:src="js/vendor/angular-ui-router.js"><!-- space --></script>
+	  <script type="text/javascript" rsrc:src="js/vendor/mm-foundation-tpls.js"><!-- space --></script>
+          <script type="text/javascript" rsrc:src="js/Common/utils.js"><!-- space --></script>
+          <var:if condition="hasProductSpecificJavaScript"><script type="text/javascript"
 	      var:src="productJavaScriptURL"><!-- space --></script></var:if>
 	  <var:if condition="hasPageSpecificJavaScript"><script type="text/javascript"
 	      var:src="pageJavaScriptURL"><!-- space --></script></var:if>
@@ -159,7 +161,7 @@
 	    ><script type="text/javascript" var:src="item"><!-- space --></script>
 	  </var:foreach>
         </var:if>
-        <var:if condition="isCompatibleBrowser" const:negate="YES"
+       <var:if condition="isCompatibleBrowser" const:negate="YES"
 	  ><var:component className="SOGoBrowsersPanel"
 	    /></var:if>
 	<noscript>
diff --git a/UI/WebServerResources/js/Common/resource.js b/UI/WebServerResources/js/Common/resource.js
new file mode 100644
index 000000000..8f6964497
--- /dev/null
+++ b/UI/WebServerResources/js/Common/resource.js
@@ -0,0 +1,65 @@
+(function() {
+    'use strict';
+
+    /* Constructor  */
+    function Resource($http, $q, path) {
+        angular.extend(this, {
+            _http: $http,
+            _q: $q,
+            _path: path
+        });
+    }
+
+    /* The factory we'll use to register with Angular */
+    Resource.$factory =  ['$http', '$q', function($http, $q) {
+        return function(path) {
+            return new Resource($http, $q, path);
+        };
+    }];
+
+    /* Factory registration in Angular module */
+    angular.module('SOGo.Common').factory('sgResource', Resource.$factory);
+
+    /* Instance methods */
+
+    Resource.prototype.path = function(uid) {
+        return (uid ? this._path + '/' + uid : this._path) + '/view';
+    };
+
+    Resource.prototype.find = function(uid) {
+        var deferred = this._q.defer();
+
+        this._http.get(this.path(uid))
+            .success(deferred.resolve)
+            .error(deferred.reject);
+
+        return deferred.promise;
+    };
+
+    Resource.prototype.filter = function(uid, params) {
+        var deferred = this._q.defer();
+
+        this._http({
+            method: 'GET',
+            url: this.path(uid),
+            params: params
+        })
+            .success(deferred.resolve)
+            .error(deferred.reject);
+
+        return deferred.promise;
+    };
+
+    Resource.prototype.set = function(uid, newValue) {
+        var deferred = this._q.defer();
+        var path = this._path + '/' + uid + '/save';
+
+        this._http
+            .post(path, newValue)
+            .success(deferred.resolve)
+            .error(deferred.reject);
+
+        return deferred.promise;
+    };
+
+})();
diff --git a/UI/WebServerResources/js/Common/utils.js b/UI/WebServerResources/js/Common/utils.js
new file mode 100644
index 000000000..98ed014c7
--- /dev/null
+++ b/UI/WebServerResources/js/Common/utils.js
@@ -0,0 +1,84 @@
+//$(document).foundation();
+
+String.prototype.endsWith = function(suffix) {
+    return this.indexOf(suffix, this.length - suffix.length) !== -1;
+};
+
+String.prototype.startsWith = function(pattern, position) {
+    position = angular.isNumber(position) ? position : 0;
+    return this.lastIndexOf(pattern, position) === position;
+};
+
+String.prototype._base64_keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
+String.prototype.base64encode = function () {
+    var output = "";
+    var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
+    var i = 0;
+ 
+    var input = this.utf8encode();
+
+    while (i < input.length) {
+        chr1 = input.charCodeAt(i++);
+        chr2 = input.charCodeAt(i++);
+        chr3 = input.charCodeAt(i++);
+ 
+        enc1 = chr1 >> 2;
+        enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
+        enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
+        enc4 = chr3 & 63;
+ 
+        if (isNaN(chr2)) {
+            enc3 = enc4 = 64;
+        } else if (isNaN(chr3)) {
+            enc4 = 64;
+        }
+ 
+        output = output +
+            this._base64_keyStr.charAt(enc1) + this._base64_keyStr.charAt(enc2) +
+            this._base64_keyStr.charAt(enc3) + this._base64_keyStr.charAt(enc4);
+    }
+ 
+    return output;
+};
+
+String.prototype.base64decode = function() { 
+    var output = "";
+    var chr1, chr2, chr3;
+    var enc1, enc2, enc3, enc4;
+    var i = 0;
+ 
+    var input = "" + this; // .replace(/[^A-Za-z0-9\+\/\=]/g, "")
+    while (i < input.length) {
+        enc1 = this._base64_keyStr.indexOf(input.charAt(i++));
+        enc2 = this._base64_keyStr.indexOf(input.charAt(i++));
+        enc3 = this._base64_keyStr.indexOf(input.charAt(i++));
+        enc4 = this._base64_keyStr.indexOf(input.charAt(i++));
+
+        chr1 = (enc1 << 2) | (enc2 >> 4);
+        chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
+        chr3 = ((enc3 & 3) << 6) | enc4;
+ 
+        output = output + String.fromCharCode(chr1);
+ 
+        if (enc3 != 64) {
+            output = output + String.fromCharCode(chr2);
+        }
+        if (enc4 != 64) {
+            output = output + String.fromCharCode(chr3);
+        }
+    }
+
+    return output;
+};
+
+function l(key) {
+    var value = key;
+    if (labels[key]) {
+        value = labels[key];
+    }
+    else if (clabels[key]) {
+        value = clabels[key];
+    }
+
+    return value;
+}