Wiki: Show warning if attempt to save the page fails.

Change-Id: I3fbacfca1c5d5f5834797ef029d79228cdb4dde2

1 files changed, 29 insertions, 6 deletions

diff --git a/src/main/resources/templates/benki/wiki/wikiPage.html b/src/main/resources/templates/benki/wiki/wikiPage.html
index 9f3c741..3cd522c 100644
--- a/src/main/resources/templates/benki/wiki/wikiPage.html
+++ b/src/main/resources/templates/benki/wiki/wikiPage.html
@@ -6,6 +6,15 @@
 
 {#head}
 <link rel="stylesheet" type="text/css" href="/web_modules/ContentTools/build/content-tools.min.css" />
+<script type="module" src="/web_modules/elix/define/ExpandablePanel.js"></script>
+
+<style type="text/css">
+  #warning-panel {
+    background-color: lightcoral;
+    font-style: italic;
+  }
+</style>
+
 <script type="module">
   import ContentTools from "/web_modules/ContentTools.js";
 
@@ -14,6 +23,8 @@
     editor.init('*[data-editable]', 'data-name');
 
     editor.addEventListener('saved', async function (ev) {
+      document.getElementById("warning-panel").close();
+
       let regions = ev.detail().regions;
       if (Object.getOwnPropertyNames(regions).length === 0) {
         // Nothing changed.
@@ -32,13 +43,23 @@
         body: requestParams
       });
 
+      if (!response.ok) {
+        document.getElementById("warning-panel").open();
+        document.getElementById("warning-text").innerText = "Failed to save page: " + response.statusText;
+        this.busy(false);
+        return;
+      }
+
       let status = await response.json();
-      if (status.status === "ok") {
-        if (status.hasOwnProperty("content")) {
-          document.getElementById("wiki-content").innerHTML = status.content;
-        }
-      } else {
-        alert("Failed to save page: " + JSON.stringify(status));
+      if (status.status !== "ok") {
+        document.getElementById("warning-panel").open();
+        document.getElementById("warning-text").innerText = "Failed to save page: " + JSON.stringify(status);
+        this.busy(false);
+        return;
+      }
+
+      if (status.hasOwnProperty("content")) {
+        document.getElementById("wiki-content").innerHTML = status.content;
       }
 
       this.busy(false);
@@ -53,6 +74,8 @@
     <div data-editable data-name="wiki-title">
       <h1>{page.title}</h1>
     </div>
+
+    <elix-expandable-panel id="warning-panel"><div id="warning-text"></div></elix-expandable-panel>
   </header>
 
   <main>