s4
changeset 894:1dc4007d7c20
Shrink columns
author | HIROSE Yuuji <yuuji@gentei.org> |
---|---|
date | Sat, 26 Dec 2020 16:57:20 +0900 |
parents | c1a5d137740d |
children | c01b13db3bd3 |
files | s4-main.js |
diffstat | 1 files changed, 35 insertions(+), 2 deletions(-) [+] |
line diff
1.1 --- a/s4-main.js Sat Dec 26 15:17:56 2020 +0900 1.2 +++ b/s4-main.js Sat Dec 26 16:57:20 2020 +0900 1.3 @@ -322,8 +322,7 @@ 1.4 } 1.5 function initGrphome() { 1.6 console.log("initGrphome"); 1.7 - let btn = document.querySelectorAll("button.toggle-frozen"); 1.8 - if (!btn) return; 1.9 + // (1)Setup Frozen State Changing Button 1.10 let url = document.URL, 1.11 mypath = url.substring(url.lastIndexOf("/")); 1.12 if (mypath.match(/(.*)\/(.*)/)) { 1.13 @@ -363,6 +362,7 @@ 1.14 dispInfoMomentary(info, td); 1.15 }); 1.16 } 1.17 + let btn = document.querySelectorAll("button.toggle-frozen"); 1.18 for (let b of btn) { 1.19 let rowid = null; 1.20 let td=b.parentNode, tr = td.parentNode, fr, ru; 1.21 @@ -385,6 +385,39 @@ 1.22 Toggle Running/Frozen ("+rowid+")"); 1.23 } 1.24 } 1.25 + // (2)Setup Column Collapse Button 1.26 + // INCOMPLETE: Cannot restore original state, but it's enough... 1.27 + function toggleColmnWidth(th) { 1.28 + let tbl = document.querySelector("table.dumpblogs"); 1.29 + let colname = th.textContent, newwidth; 1.30 + if (th.style.width) { 1.31 + newwidth = null 1.32 + // https://developer.mozilla.org/ja/docs/Web/CSS/table-layout 1.33 + tbl.style.tableLayout = 'auto'; 1.34 + tbl.style.width = null; 1.35 + } else { 1.36 + newwidth = "2em"; 1.37 + tbl.style.tableLayout = 'fixed'; 1.38 + tbl.style.width = '100%'; 1.39 + } 1.40 + th.style.width = newwidth; 1.41 + th.style.overflow = "hidden"; 1.42 + for (let td of document.querySelectorAll("td."+colname)) { 1.43 + console.log(td.tagName); 1.44 + td.style.width = newwidth; 1.45 + console.log(td.style.width); 1.46 + } 1.47 + } 1.48 + let row1 = document.querySelector("table.dumpblogs tr:first-child"); 1.49 + if (row1) { 1.50 + let heads = row1.querySelectorAll("th"); 1.51 + for (let h of heads) { 1.52 + h.addEventListener("click", function(e) { 1.53 + toggleColmnWidth(h); 1.54 + }, false); 1.55 + h.setAttribute("title", "Click to shrink these columns"); 1.56 + } 1.57 + } 1.58 } 1.59 function init() { 1.60 initGrpAction();