From: Ian Jackson <ijackson@chiark.greenend.org.uk>
Date: Thu, 26 Nov 2020 00:57:00 +0000 (+0000)
Subject: sort out log in landscape
X-Git-Tag: otter-0.2.0~355
X-Git-Url: https://www.chiark.greenend.org.uk/ucgi/~ianmdlvl/git?a=commitdiff_plain;h=615271fcc3b1b31d6240ad88f588f7cc44003219;p=otter.git

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 4953d1c7..157e8def 100644
--- 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 04e96116..ebfefcb4 100644
--- 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 c42d6c0f..32d67b48 100644
--- 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>