Merge pull request #623 from Unrud/improveweb

Improvements for the web interface

radicale/web/fn.js

@@ -32,10 +32,11 @@ var SERVER = (location.protocol + '//' + location.hostname +
 var ROOT_PATH = location.pathname.replace(new RegExp("/+[^/]+/*(/index\.html?)?$"), "") + '/';
 
 /**
- * time between updates of collections.
+ * time between updates of collections (milliseconds)
  * @const
+  * @type {?int}
  */
-var UPDATE_INTERVAL = 10000;
+var UPDATE_INTERVAL = null;
 
 /**
  * Regex to match and normalize color
@@ -448,6 +449,7 @@ function LoginScene() {
     var logout_view = document.getElementById("logoutview");
     var logout_user_form = logout_view.querySelector("[name=user]");
     var logout_btn = logout_view.querySelector("[name=link]");
+    var first_show = true;
 
     /** @type {?number} */ var scene_index = null;
     var user = "";
@@ -489,6 +491,10 @@ function LoginScene() {
                         // show collections
                         var saved_user = user;
                         user = "";
+                        if (typeof(sessionStorage) !== "undefined") {
+                            sessionStorage.setItem("radicale_user", saved_user);
+                            sessionStorage.setItem("radicale_password", password);
+                        }
                         var collections_scene = new CollectionsScene(
                             saved_user, password, collection, function(error1) {
                                 error = error1;
@@ -521,12 +527,24 @@ function LoginScene() {
     }
 
     this.show = function() {
+        var saved_first_show = first_show;
+        first_show = false;
         this.release();
         fill_form();
         form.onsubmit = onlogin;
         html_scene.style.display = "block";
         user_form.focus();
         scene_index = scene_stack.length - 1;
+        if (typeof(sessionStorage) !== "undefined") {
+            if (saved_first_show && sessionStorage.getItem("radicale_user")) {
+                user_form.value = sessionStorage.getItem("radicale_user");
+                password_form.value = sessionStorage.getItem("radicale_password");
+                onlogin();
+            } else {
+                sessionStorage.setItem("radicale_user", "");
+                sessionStorage.setItem("radicale_password", "");
+            }
+        }
     };
     this.hide = function() {
         read_form();
@@ -580,6 +598,7 @@ function CollectionsScene(user, password, collection, onerror) {
     var saved_template_display = null;
     /** @type {?XMLHttpRequest} */ var collections_req = null;
     var timer = null;
+    var from_update = false;
     /** @type {?Array<Collection>} */ var collections = null;
     /** @type {Array<Node>} */ var nodes = [];
 
@@ -648,7 +667,7 @@ function CollectionsScene(user, password, collection, onerror) {
             });
             title_form.textContent = collection.displayname || collection.href;
             description_form.textContent = collection.description;
-            var href = SERVER.replace("//", "//" + encodeURIComponent(user) + "@") + collection.href;
+            var href = SERVER + collection.href;
             url_form.href = href;
             url_form.textContent = href;
             delete_btn.onclick = function(ev) {return ondelete(collection);};
@@ -675,7 +694,10 @@ function CollectionsScene(user, password, collection, onerror) {
             } else {
                 var old_collections = collections;
                 collections = collections1;
+                if (UPDATE_INTERVAL !== null) {
                     timer = window.setTimeout(update, UPDATE_INTERVAL);
+                }
+                from_update = true;
                 if (old_collections === null) {
                     pop_scene(scene_index);
                 } else {
@@ -700,7 +722,7 @@ function CollectionsScene(user, password, collection, onerror) {
         } else if (collections === null) {
             pop_scene(scene_index - 1);
         } else {
-            if (timer !== null) {
+            if (from_update) {
                 show_collections(collections);
             } else {
                 collections = null;
@@ -716,6 +738,7 @@ function CollectionsScene(user, password, collection, onerror) {
             window.clearTimeout(timer);
             timer = null;
         }
+        from_update = false;
         if (collections !== null && collections_req !== null) {
             collections_req.abort();
             collections_req = null;

radicale/web/index.html

@@ -12,7 +12,7 @@
     <body>
         <nav>
             <ul>
-                <li id="logoutview" style="display: none;"><a href="" name="link">Logout [<span name="user"></span>]</a></li>
+                <li id="logoutview" style="display: none;"><a href="" name="link">Logout [<span name="user" style="word-wrap:break-word;"></span>]</a></li>
             </ul>
         </nav>
         <section id="loginscene" style="display: none;">
@@ -32,10 +32,10 @@
             <h1>Collections</h1>
             <a href="" name="new">Create new addressbook or calendar</a>
             <article name="collectiontemplate">
-                <h2><span name="color">█ </span><span name="title">Title</span> <small>[<span name="ADDRESSBOOK">addressbook</span><span name="CALENDAR_JOURNAL_TASKS">calendar, journal and tasks</span><span name="CALENDAR_JOURNAL">calendar and journal</span><span name="CALENDAR_TASKS">calendar and tasks</span><span name="JOURNAL_TASKS">journal and tasks</span><span name="CALENDAR">calendar</span><span name="JOURNAL">journal</span><span name="TASKS">tasks</span>]</small></h2>
+                <h2><span name="color">█ </span><span name="title" style="word-wrap:break-word;">Title</span> <small>[<span name="ADDRESSBOOK">addressbook</span><span name="CALENDAR_JOURNAL_TASKS">calendar, journal and tasks</span><span name="CALENDAR_JOURNAL">calendar and journal</span><span name="CALENDAR_TASKS">calendar and tasks</span><span name="JOURNAL_TASKS">journal and tasks</span><span name="CALENDAR">calendar</span><span name="JOURNAL">journal</span><span name="TASKS">tasks</span>]</small></h2>
-                <span name="description">Description</span>
+                <span name="description" style="word-wrap:break-word;">Description</span>
                 <ul>
-                    <li>URL: <a name="url">url</a></li>
+                    <li>URL: <a name="url" style="word-wrap:break-word;">url</a></li>
                     <li><a href="" name="edit">Edit</a></li>
                     <li><a href="" name="delete">Delete</a></li>
                 </ul>
@@ -43,7 +43,7 @@
         </section>
         <section id="editcollectionscene" style="display: none;">
             <h1>Edit collection</h1>
-            <h2>Edit <span name="title">title</span>:</h2>
+            <h2>Edit <span name="title" style="word-wrap:break-word;">title</span>:</h2>
             <form>
                 Title:<br>
                 <input name="displayname" type="text"><br>
@@ -94,7 +94,7 @@
         </section>
         <section id="deletecollectionscene" style="display: none;">
             <h1>Delete collection</h1>
-            <h2>Delete <span name="title">title</span>?</h2>
+            <h2>Delete <span name="title" style="word-wrap:break-word;">title</span>?</h2>
             <span style="color: #A40000;" name="error"></span><br>
             <form>
                 <button type="button" name="delete">Yes</button>