diff --git a/src/main/webapp/assets/html/swagger-ui.html b/src/main/webapp/assets/html/swagger-ui.html
index e3f307f0e..79bd0737e 100644
--- a/src/main/webapp/assets/html/swagger-ui.html
+++ b/src/main/webapp/assets/html/swagger-ui.html
@@ -40,6 +40,8 @@
     <script src='../swagger-ui/lib/backbone-min.js' type='text/javascript'></script>
     <script src='../swagger-ui/lib/swagger-ui.min.js' type='text/javascript'></script>
     <script src='../swagger-ui/lib/marked.js' type='text/javascript'></script>
+    <script src='../js/libs/require.js' type='text/javascript'></script>
+    <script src='../js/libs/bootstrap.js' type='text/javascript'></script>
 
     <script type="text/javascript">
         $(function () {
@@ -86,20 +88,20 @@
 <body>
 <div class="navbar navbar-fixed-top">
     <div class="navbar-inner">
-        <div class="userName-top"><span id="user"></span> | <a href="/logout" id="logout-link">Log out</a></div>
+        <div class="userName-top"><span id="user"></span> | <a href="../../logout.html" id="logout-link">Log out</a></div>
         <div class="container">
             <a class="logo" href="#" title="Brooklyn, Version 0.11.0-SNAPSHOT"><!-- Logo added via CSS --></a> <!-- BROOKLYN_VERSION -->
             <div class="menubar-top">
                 <ul class="nav">
-                    <li><a href="/#v1/home" class="nav1 nav1_home">Home</a></li>
-                    <li><a href="/#v1/editor/" class="nav1 nav1_editor">Composer</a></li>
-                    <li><a href="/#v1/applications" class="nav1 nav1_apps">Applications</a></li>
-                    <li><a href="/#v1/catalog" class="nav1 nav1_catalog">Catalog</a></li>
+                    <li><a href="../../#v1/home" class="nav1 nav1_home">Home</a></li>
+                    <li><a href="../../#v1/editor/" class="nav1 nav1_editor">Composer</a></li>
+                    <li><a href="../../#v1/applications" class="nav1 nav1_apps">Applications</a></li>
+                    <li><a href="../../#v1/catalog" class="nav1 nav1_catalog">Catalog</a></li>
                     <li class="dropdown">
-                        <a href="#" class="nav1 nav1_script dropdown-toggle" data-toggle="dropdown">Script</a>
+                        <a href="#" class="nav1 nav1_script dropdown-toggle active" data-toggle="dropdown">Script</a>
                         <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
-                            <li><a href="./assets/html/swagger-ui.html" target="_blank" class="nav1 nav1_apidoc">REST API</a></li>
-                            <li><a href="/#v1/script/groovy" class="nav1 nav1_groovy">Groovy</a></li>
+                            <li><a href="swagger-ui.html" class="nav1 nav1_apidoc">REST API</a></li>
+                            <li><a href="../../#v1/script/groovy" class="nav1 nav1_groovy">Groovy</a></li>
                         </ul>
                     </li>
                     <li><a href="/#v1/help" class="nav1 nav1_help"><b>?</b></a></li>
diff --git a/src/main/webapp/assets/js/logout.js b/src/main/webapp/assets/js/logout.js
new file mode 100644
index 000000000..e30cfca45
--- /dev/null
+++ b/src/main/webapp/assets/js/logout.js
@@ -0,0 +1,79 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+(function(window, document) {
+    window.addEventListener('load', initiateLogout, false)
+
+    /**
+     * Fetch current user
+     */
+    function initiateLogout() {
+        var userRequest = new XMLHttpRequest();
+        userRequest.onreadystatechange = function () {
+            if (this.readyState === 4 && this.status === 200) {
+                logout(this.responseText)
+            }
+        };
+        userRequest.open('GET', '/v1/server/user', true);
+        userRequest.send('');
+    }
+
+    function currentCsrfHeader() {
+        var ca = document.cookie.split(';');
+        var extraFields = [];
+        for (var i = 0; i < ca.length; i++) {
+            var c = ca[i];
+            while (c.charAt(0) == ' ') c = c.substring(1);
+            if (c.toLowerCase().indexOf('csrf-token') != -1) {
+                var parts = c.split('=');
+                extraFields.push('X-'+parts[0])
+                extraFields.push(parts[1]);
+            }
+        }
+        return extraFields;
+    }
+
+    /**
+     * Logout the supplied user
+     * @param user
+     */
+    function logout(user) {
+        var ua = window.navigator.userAgent;
+        var logoutRequest = new XMLHttpRequest();
+        var extraFields = currentCsrfHeader();
+        if (ua.indexOf('MSIE ') >= 0 || ua.indexOf(' Edge/') >= 0 || ua.indexOf(' Trident/') >= 0) {
+            document.execCommand('ClearAuthenticationCache', 'false');
+        }
+        logoutRequest.onreadystatechange = function () {
+            if (this.readyState === 4) {
+                if (this.status === 401) {
+                    console.info('User ' + user + ' logged out')
+                } else {
+                    setTimeout(function () {
+                        logout(user);
+                    }, 1000);
+                }
+            }
+        };
+        logoutRequest.open('POST', '/v1/logout/unauthorize', true, user, Math.random().toString(36).slice(2));
+        if (extraFields.length == 2) {
+            logoutRequest.setRequestHeader(extraFields[0], extraFields[1])
+        }
+        logoutRequest.send('');
+    }
+})(window, document);
\ No newline at end of file
diff --git a/src/main/webapp/assets/js/util/brooklyn-utils.js b/src/main/webapp/assets/js/util/brooklyn-utils.js
index 92ec2d24d..62dec34a3 100644
--- a/src/main/webapp/assets/js/util/brooklyn-utils.js
+++ b/src/main/webapp/assets/js/util/brooklyn-utils.js
@@ -175,17 +175,8 @@ define([
     };
 
     Util.logout = function logout() {
-        var ua = window.navigator.userAgent;
-        if (ua.indexOf("MSIE ") >= 0 || ua.indexOf(" Edge/") >= 0 || ua.indexOf(" Trident/") >= 0) {
-            document.execCommand('ClearAuthenticationCache', 'false');
-            window.location.replace('/');
-        } else {
-            $('<form action="' + '/logout_redirect.html' + '" method="POST" id="redirectForm">' +
-                '<input type="hidden" name="acme" value="acme"/>' +
-                '</form>').appendTo($(document.body))
-                .submit();
-        }
-    }
+        window.location.href = 'logout.html';
+    };
 
     Util.setSelectionRange = function (input, selectionStart, selectionEnd) {
       if (input.setSelectionRange) {
diff --git a/src/main/webapp/logout_redirect.html b/src/main/webapp/logout.html
similarity index 54%
rename from src/main/webapp/logout_redirect.html
rename to src/main/webapp/logout.html
index ce21a3051..1f88e3328 100644
--- a/src/main/webapp/logout_redirect.html
+++ b/src/main/webapp/logout.html
@@ -17,17 +17,39 @@
   specific language governing permissions and limitations
   under the License.
   -->
-<!-- Brooklyn SHA-1: GIT_SHA_1 -->
 <html lang="en">
 <head>
     <meta charset="UTF-8">
-    <title>Title</title>
+    <title>Apache Brooklyn</title>
+    <script type="application/javascript" src="assets/js/logout.js"></script>
+    <style type="text/css">
+        body {
+            background-color: #f5f6fa;
+        }
+
+        .login-container {
+            font-family: sans-serif;
+            font-size: 10vw;
+            width: 10vw;
+            height: 10vh;
+            position: absolute;
+            left: 40vw;
+            top: 40vh;
+        }
+
+        a {
+            color: black;
+            text-decoration: none;
+        }
+    </style>
 </head>
 <body>
-<script>
-    var a=new window.XMLHttpRequest;
-    a.open('POST','/logout',0,'user','wrong'+(new Date).getTime().toString());a.send('');
-    window.location.href='/';
-</script>
+<nav class="navbar-placeholder"></nav>
+<main class="page-main-area-placeholder">
+    <div class="login-container">
+        <a href="/">Login</a>
+    </div>
+</main>
+<footer class="footer-placeholder"></footer>
 </body>
 </html>
\ No newline at end of file
