sort out log in landscape

Signed-off-by: Ian Jackson <ijackson@chiark.greenend.org.uk>

diff --git a/templates/landscape.tera b/templates/landscape.tera
index 4953d1c779bde33613f171092e1a7acfdf29d3a3..157e8defc1b513b90ee7237fb4e6eb5a346e8151 100644 (file)
--- a/templates/landscape.tera
+++ b/templates/landscape.tera
@@ -46,9 +46,11 @@
        {{ m::uos() }}
 
   <div id="log" style="overflow-y: scroll; height: 600px;">
-{% for ent in log %}
+  {% for ent in log %}
+    <div>
     <span class="logts">{{ent.when}}</span><br/>
-    {{ ent.logent.logent.html | safe }}<br/>
+    <span class="logmsg">{{ ent.logent.logent.html | safe }}<span><br/>
+    </div>
 {%- endfor %}
   </div>
 </div>

diff --git a/templates/script.ts b/templates/script.ts
index 04e96116c93af53064ab248f5a06463e05f8d9e6..ebfefcb42ca0d7238ccfe52d68e993de0ab52770 100644 (file)
--- a/templates/script.ts
+++ b/templates/script.ts
@@ -47,6 +47,7 @@ type Generation = number;
 type UoKind = 'Client' | "Global"| "Piece" | "ClientExtra" | "GlobalExtra";
 type WhatResponseToClientOp = "Predictable" | "Unpredictable" | "UpdateSvg";
 type Timestamp = number; // unix time_t, will break in 285My
+type Layout = 'Portrait' | 'Landscape';
 
 type UoDescription = {
   kind: UoKind;
@@ -88,6 +89,7 @@ type PieceErrorHandler = (piece: PieceId, p: PieceInfo, m: PieceOpError)
 interface DispatchTable<H> { [key: string]: H };
 
 var globalinfo_elem : HTMLElement;
+var layout: Layout;
 var general_timeout : number = 10000;
 var messages : DispatchTable<MessageHandler> = Object();
 var pieceops : DispatchTable<PieceHandler> = Object();
@@ -835,19 +837,31 @@ function add_timestamped_log_message(ts_html: string, msg_html: string) {
        return 0.5 * (le_bot + le_top) > ld_bot;
       })();
 
-  console.log('ADD LOG MESSAGE ',in_scrollback, msg_html);
-  var tr = document.createElement('tr');
+  console.log('ADD LOG MESSAGE ',in_scrollback, layout, msg_html);
 
-  function add_td(html: string) {
-    var td = document.createElement('td');
-    td.innerHTML = html;
-    tr.appendChild(td);
-    return td;
+  var ne : HTMLElement;
+
+  function add_thing(elemname: string, cl: string, html: string) {
+    var ie = document.createElement(elemname);
+    ie.innerHTML = html;
+    ie.setAttribute("class", cl);
+    ne.appendChild(ie);
   }
 
-  add_td(msg_html);
-  add_td(ts_html).setAttribute("class", 'logts')
-  log_elem.appendChild(tr);
+  if (layout == 'Portrait') {
+    ne = document.createElement('tr');
+    add_thing('td', 'logmsg', msg_html);
+    add_thing('td', 'logts',  ts_html);
+  } else if (layout == 'Landscape') {
+    ne = document.createElement('div');
+    add_thing('span', 'logts',  ts_html);
+    ne.appendChild(document.createElement('br'));
+    add_thing('span', 'logmsg', msg_html);
+    ne.appendChild(document.createElement('br'));
+  } else {
+    throw 'bad layout ' + layout;
+  }
+  log_elem.appendChild(ne);
 
   if (!in_scrollback) {
     lastent = log_elem.lastElementChild!;
@@ -1150,7 +1164,7 @@ var wasm_promise : Promise<any>;;
 function doload(){
   console.log('DOLOAD');
   globalinfo_elem = document.getElementById('global-info')!;
-  let layout = globalinfo_elem!.dataset!.layout!;
+  layout = globalinfo_elem!.dataset!.layout! as any;
   var elem = document.getElementById('loading_token')!;
   var ptoken = elem.dataset.ptoken;
   xhr_post_then('/_/session/' + layout, 

diff --git a/templates/session.tera b/templates/session.tera
index c42d6c0f20e24b08c7cda63db28f21a726f0c708..32d67b4893d09b6ac16cb68cdfe57247f0e2266f 100644 (file)
--- a/templates/session.tera
+++ b/templates/session.tera
@@ -42,7 +42,7 @@
   <div style="overflow-y: scroll; height: 200px;">
     <table id="log">
       {% for ent in log %}
-      <tr><td>{{ ent.logent.logent.html | safe }}</td><td class="logts">{{ent.when}}</td></tr>
+      <tr><td class="logmsg">{{ ent.logent.logent.html | safe }}</td><td class="logts">{{ent.when}}</td></tr>
       {%- endfor %}
     </table>
   </div>