Dashboard: display package data sizes in oplog entry and tree views. (#232)

* Wrong divisor for friendly giga-values

* We want Explorer style for kilo/kibi units; round up

* var -> const - zero idea if this matters

* Include sum of an entry's package data sizes in index

* Method to enurate all properties of a loaded oplog index

* Include bulkdata size in an oplog index

* Found a space that was missing

* Show package data sizes when viewing an oplog entry

* Navigating a component tree would error out at the end of the chain

* Parameterise friendly rounding

* Added size and rawsize columns to oplog tree view

* Sort of parameterised indexer's worker count and page size

* Right-align size columns on entry view page

* Updated frontend .zip archive

* A changelog update

1 files changed, 15 insertions, 6 deletions

diff --git a/src/zenserver/frontend/html/pages/entry.js b/src/zenserver/frontend/html/pages/entry.js
index b166d0a6f..a0e3ee915 100644
--- a/src/zenserver/frontend/html/pages/entry.js
+++ b/src/zenserver/frontend/html/pages/entry.js
@@ -4,6 +4,7 @@
 
 import { ZenPage } from "./page.js"
 import { Fetcher } from "../util/fetcher.js"
+import { Friendly } from "../util/friendly.js"
 import { Table, PropTable, Toolbar, ProgressBar } from "../util/widgets.js"
 import { create_indexer } from "../indexer/indexer.js"
 
@@ -84,7 +85,11 @@ export class Page extends ZenPage
 		// data
 		{
 			const sub_section = section.add_section("data");
-			const table = sub_section.add_widget(Table, ["name", "actions"], Table.Flag_PackRight);
+			const table = sub_section.add_widget(
+				Table,
+				["name", "size", "rawsize", "actions"], Table.Flag_PackRight
+			);
+			table.id("datatable");
 			for (const field_name of ["packagedata", "bulkdata"])
 			{
 				var pkg_data = entry.find(field_name);
@@ -93,12 +98,13 @@ export class Page extends ZenPage
 
 				for (const item of pkg_data.as_array())
 				{
-					var io_hash;
-					var file_name;
+					var io_hash, size, raw_size, file_name;
 					for (const field of item.as_object())
 					{
-						if (field.is_named("data")) io_hash = field.as_value();
-						else if (field.is_named("filename")) file_name = field.as_value();
+						if (field.is_named("data"))				io_hash = field.as_value();
+						else if (field.is_named("filename"))	file_name = field.as_value();
+						else if (field.is_named("size"))		size = field.as_value();
+						else if (field.is_named("rawsize"))		raw_size = field.as_value();
 					}
 
 					if (io_hash instanceof Uint8Array)
@@ -109,7 +115,10 @@ export class Page extends ZenPage
 						io_hash = ret;
 					}
 
-					const row = table.add_row(file_name);
+					size = (size !== undefined) ? Friendly.kib(size) : "";
+					raw_size = (raw_size !== undefined) ? Friendly.kib(raw_size) : "";
+
+					const row = table.add_row(file_name, size, raw_size);
 
 					const project = this.get_param("project");
 					const oplog = this.get_param("oplog");