replay ui: improvements to framed replay messages.

'is_live' added to live rewrite to allow for different message for live replay
vs archived replay to be used.
When using framed replay, default initial message to 'Loading...'
default index.html: list non-replay access points in default home page

pywb/static/wb.js

@@ -19,6 +19,12 @@ This file is part of pywb.
 
 _wb_js = (function() {
 
+
+var labels = {LOADING_MSG: "Loading...",
+              REPLAY_MSG: "This is an <b>archived</b> page from ",
+              LIVE_MSG: "This is a <b>live</b> page just fetched on "};
+
+
 function init_banner() {
     var PLAIN_BANNER_ID = "_wb_plain_banner";
     var FRAME_BANNER_ID = "_wb_frame_top_banner";
@@ -40,19 +46,33 @@ function init_banner() {
 
     var banner = document.getElementById(bid);
     
-    if (!banner) {
+    if (banner) {
-        banner = document.createElement("wb_div");
+        return;
-        banner.setAttribute("id", bid);
-        banner.setAttribute("lang", "en");
-
-        text = "This is an archived page ";
-        if (wbinfo && wbinfo.capture_str) {
-            text += " from <b id='_wb_capture_info'>" + wbinfo.capture_str + "</b>";
-        }
-        banner.innerHTML = text;
-
-        document.body.insertBefore(banner, document.body.firstChild);
     }
+        
+    banner = document.createElement("wb_div");
+    banner.setAttribute("id", bid);
+    banner.setAttribute("lang", "en");
+
+    var text;
+
+    if (wbinfo.is_frame) {
+        text = labels.LOADING_MSG;
+    } else if (wbinfo.is_live) {
+        text = labels.LIVE_MSG;
+    } else {
+        text = labels.REPLAY_MSG;
+    }
+    
+    text = "<span id='_wb_label'>" + text + "</span>";
+
+    var capture_str = (wbinfo ? wbinfo.capture_str : "");
+
+    text += "<b id='_wb_capture_info'>" + capture_str + "</b>";
+    
+    banner.innerHTML = text;
+
+    document.body.insertBefore(banner, document.body.firstChild);
 }
 
 function add_event(name, func, object) {
@@ -105,7 +125,10 @@ function notify_top(event) {
     }
 
     if (window.top.update_wb_url) {
-        window.top.update_wb_url(window.WB_wombat_location.href, wbinfo.timestamp, wbinfo.capture_str);
+        window.top.update_wb_url(window.WB_wombat_location.href,
+                                 wbinfo.timestamp,
+                                 wbinfo.capture_str,
+                                 wbinfo.is_live);
     }
 }
 
@@ -126,4 +149,6 @@ if (wbinfo.is_frame_mp && wbinfo.canon_url &&
     window.location.replace(wbinfo.canon_url);
 }
 
+return {'labels': labels};
+
 })();

pywb/ui/frame_insert.html

@@ -3,7 +3,6 @@
 <!-- Start WB Insert -->
 <script>
   wbinfo = {}
-//  wbinfo.capture_str = "{{ timestamp | format_ts }}";
   wbinfo.capture_str = " ";
   wbinfo.is_embed = false;
   wbinfo.prefix = "{{ wbrequest.wb_prefix }}";
@@ -33,7 +32,7 @@ function make_inner_url(url, ts)
     }
 }
 
-function push_state(url, timestamp, capture_str) {
+function push_state(url, timestamp, capture_str, is_live) {
     var curr_href = null;
     
     if (window.frames[0].WB_wombat_location) {
@@ -41,7 +40,7 @@ function push_state(url, timestamp, capture_str) {
     }
         
     if (url != curr_href) {
-        update_status(capture_str);
+        update_status(capture_str, is_live);
         return;
     }
     
@@ -55,14 +54,15 @@ function push_state(url, timestamp, capture_str) {
     state.inner_url = make_inner_url(url, state.timestamp);
     state.url = url;
     state.capture_str = capture_str;
+    state.is_live = is_live;
     
     window.history.replaceState(state, "", state.outer_url);
 
-    update_status(state.capture_str);
+    update_status(state.capture_str, is_live);
 }
 
 function pop_state(state) {
-    update_status(state.capture_str);
+    update_status(state.capture_str, state.is_live);
     
     window.frames[0].src = state.outer_url;
 }
@@ -81,10 +81,19 @@ function extract_ts(url)
     return url.substring(inx + 1);
 }
 
-function update_status(str) {
+function update_status(str, is_live) {
-    var elem = document.getElementById("_wb_capture_info");
+    var capture_info = document.getElementById("_wb_capture_info");
-    if (elem) {
+    if (capture_info) {
-        elem.innerHTML = str;
+        capture_info.innerHTML = str;
+    }
+
+    var label = document.getElementById("_wb_label");
+    if (label) {
+        if (is_live) {
+            label.innerHTML = _wb_js.labels.LIVE_MSG;
+        } else {
+            label.innerHTML = _wb_js.labels.REPLAY_MSG;
+        }
     }
 }
 

pywb/ui/head_insert.html

@@ -18,6 +18,7 @@
   wbinfo.is_embed = {{"true" if wbrequest.wb_url.is_embed else "false"}};
   wbinfo.is_frame_mp = {{"true" if wbrequest.wb_url.mod == 'mp_' else "false"}}
   wbinfo.canon_url = "{{ canon_url }}";
+  wbinfo.is_live = {{ "true" if cdx.is_live else "false" }};
 </script>
 <script src='{{ wbrequest.host_prefix }}/{{ static_path }}/wb.js'> </script>
 <link rel='stylesheet' href='{{ wbrequest.host_prefix }}/{{ static_path }}/wb.css'/>

pywb/ui/index.html

@@ -9,3 +9,14 @@ The following archive collections are available:
   {% endif %} 
 {% endfor %}
 </ul>
+
+Other endpoints in this deployment:
+
+<ul>
+{% for route in routes %}
+  {% if not route | is_wb_handler %}
+  <li><b>{{ '/' + route.path }}</b> - {{ route | string }}</li>
+  {% endif %} 
+{% endfor %}
+</ul>
+