From 13562a7c7ee6116715f763026674a2f07aaf34f5 Mon Sep 17 00:00:00 2001
From: wkwk <12408-wkwk@users.norepy.gitgud.io>
Date: Tue, 25 Jul 2023 03:00:26 -0600
Subject: [PATCH] Improve rules assistant summary
---
css/rulesAssistant/raSummary.css | 57 ++++++++++++++++++--------------
src/js/rulesAssistantSummary.js | 30 +++++++++--------
2 files changed, 50 insertions(+), 37 deletions(-)
diff --git a/css/rulesAssistant/raSummary.css b/css/rulesAssistant/raSummary.css
index 2111d702d71..1e3335da8d5 100644
--- a/css/rulesAssistant/raSummary.css
+++ b/css/rulesAssistant/raSummary.css
@@ -1,37 +1,46 @@
-table.ra-sum {
- text-align: left;
- empty-cells: hide;
+.ra-sum {
+ margin-top: 1.5em;
+ max-height: 90vh;
+ overflow: auto;
+ width: 100%;
}
-th.ra-sum, td.ra-sum {
- border: 1px solid grey;
+.ra-sum table {
+ border-collapse: separate;
+ border-spacing: 0;
+ border: 1px solid grey;
+ empty-cells: hide;
+ margin: 0;
+ table-layout: fixed;
+ text-align: left;
+ white-space: nowrap;
}
-td.ra-sum {
- white-space: nowrap;
- overflow: hidden;
+.ra-sum th,
+.ra-sum td {
+ border: 1px solid grey;
}
-tr.ra-sum:nth-child(even) {
- background-color: #444444;
+.ra-sum tr:nth-child(even) {
+ background-color: #444444;
}
-tr.ra-sum.header {
- position:sticky;
- top:0px;
- z-index:2;
- background:#111;
+.ra-sum thead th {
+ position: sticky;
+ top: 0px;
+ z-index: 1;
+ background: #111;
}
-th.ra-sum.first-header-cell {
- empty-cells: show;
- border-style: hidden
+.ra-sum thead th:first-child {
+ position: sticky;
+ left: 0px;
+ z-index: 2;
}
-td.ra-sum.row-title {
- position:sticky;
- left: 0px;
- z-index:1;
- background:#111;
- opacity: 0.8;
+.ra-sum tbody th {
+ position: sticky;
+ left: 0px;
+ z-index: 1;
+ background: #111;
}
diff --git a/src/js/rulesAssistantSummary.js b/src/js/rulesAssistantSummary.js
index bf16c4c2b28..62abbbdc46c 100644
--- a/src/js/rulesAssistantSummary.js
+++ b/src/js/rulesAssistantSummary.js
@@ -3,38 +3,42 @@ App.RA.summary = function() {
// App.UI.DOM.appendNewElement("h1", frag, `Rules Assistant Summary`);
App.UI.DOM.appendNewElement("div", frag, `Here you can see an overview of all of your rules at the same time.`, "scene-intro");
App.UI.DOM.appendNewElement("div", frag, `Rules further to the right will always take priority, but some rules may not apply to all slaves.`, "scene-intro");
- setTimeout(() => $("#passage-rules-assistant-summary").css("overflow", "auto"), Engine.minDomActionDelay);
frag.append(makeTable());
return frag;
+
/**
* Creates a table to summarize RA
* @returns {HTMLTableElement}
*/
function makeTable() {
- const table = App.UI.DOM.makeElement("table", null, "ra-sum");
+ const container = App.UI.DOM.makeElement("div", null, "ra-sum");
+ const table = App.UI.DOM.appendNewElement("table", container, null, "");
/** @type {FC.RA.Rule[]} */
const rules = V.defaultRules;
if (rules.length === 0) {
- return table;
+ return container;
}
/* start row title */
- const header = App.UI.DOM.appendNewElement("tr", table, null, ["ra-sum", "header"]);
- App.UI.DOM.appendNewElement("th", header, null, ["ra-sum", "first-header-cell"]);
+ const thead = App.UI.DOM.appendNewElement("thead", table, null, '');
+ const theadTr = App.UI.DOM.appendNewElement("tr", thead, null, '');
+ App.UI.DOM.appendNewElement("th", theadTr, "Rules", '');
/* make rest of row title */
for (const rule of rules) {
- App.UI.DOM.appendNewElement("th", header, App.UI.DOM.link(
+ App.UI.DOM.appendNewElement("th", theadTr, App.UI.DOM.link(
rule.name,
() => {
V.currentRule = rule.ID;
},
[],
"Rules Assistant"
- ), "ra-sum");
+ ), "");
}
+ const tbody = App.UI.DOM.appendNewElement("tbody", table, null, '');
+
const setters = rules.map(r => r.set);
/* A row for every condition the RA can set. */
/* start loop for row*/
@@ -43,7 +47,8 @@ App.RA.summary = function() {
addRow(path, collectMemberFromObjects(setters, path));
}, []);
- return table;
+ return container;
+
/**
* @param {object[]} objects
* @param {string[]} member
@@ -65,7 +70,6 @@ App.RA.summary = function() {
* @param {object} obj
* @param {string[]} memberPath
*/
-
/**
* @param {object} obj
* @param {objectWalker} walker
@@ -91,7 +95,7 @@ App.RA.summary = function() {
if (!cells.some(v => v !== null)) { // skip empty rows
return;
}
- const row = App.UI.DOM.makeElement("tr", null, "ra-sum");
+ const row = App.UI.DOM.makeElement("tr", null, "");
function ruleSetValueToString(v) {
if (typeof v === 'object') {
@@ -106,12 +110,12 @@ App.RA.summary = function() {
return `${v}`;
}
- App.UI.DOM.appendNewElement("td", row, path.join('.'), ["ra-sum", "row-title"]);
+ App.UI.DOM.appendNewElement("th", row, path.join('.'), '');
for (const cell of cells) {
const content = cell !== null ? ruleSetValueToString(cell) : null;
- App.UI.DOM.appendNewElement("td", row, content, "ra-sum");
+ App.UI.DOM.appendNewElement("td", row, content, "");
}
- table.append(row);
+ tbody.append(row);
}
}
};
--
GitLab