@yz-social/civildefense.io 4.5.9 → 4.5.21

package/public/javascripts/protocol.js

@@ -0,0 +1,168 @@
+// If ?dht=0, use a websocket to the server instead of Axona.
+const { TextEncoder, TextDecoder, BigInt, URL, WebSocket, Buffer } = globalThis;
+
+let connect, createAuthorIdentity, geoCellId, geoCellCenter, WIRE_VERSION, KERNEL_VERSION, stringToBytes, bytesToString, publishChunkedBytes, receiveChunkedBytes;
+
+// dht 1  -> Axona (default)
+// dht 0  -> server
+// dht -1 -> in-memory on client only
+const dht = parseInt(globalThis.process ? globalThis.process.env.DHT : new URL(globalThis.location).searchParams.get('dht'));
+
+if (dht < 1) {
+
+  const { v4:uuidv4 } = await import('uuid');
+  const { getContainingCells, getPointInCell } = await import('./s2.js');
+  const { cellHex } = await import('./versions.js');
+  const operator = await import('./pubsub.js');
+
+  WIRE_VERSION = 'SERVER';
+  KERNEL_VERSION = `${WIRE_VERSION}.1.0`;
+  createAuthorIdentity = ({
+    persistAs, store = {
+      get: (key) => globalThis.localStorage.getItem(key),
+      set: (key, value) => globalThis.localStorage.setItem(key, value)
+    }}) => {
+      let tag;
+      if (persistAs) {
+	tag = store.get(persistAs);
+	if (!tag) {
+	  tag = uuidv4();
+	  store.set(persistAs, tag);
+	} else if (tag.includes('pubkey')) {
+	  tag = JSON.parse(tag).pubkey; // if it is a real dump, as for alert-bot.
+	}
+      }
+      return {authorId: tag};
+    };
+  geoCellId = (lat, lng) => {
+    const cells = getContainingCells(lat, lng);
+    const hex = cellHex(cells[0]);
+    const sliced = hex.slice(0, 2);
+    return parseInt(sliced, 16); // The worst way to do this.
+  };
+  geoCellCenter = regionCode => { // Not right. See getPointInCell comments.
+    const expanded = regionCode.toString(16).padStart(2, '0').padEnd(16, '0');
+    const cellid = BigInt('0x' + expanded);
+    const [lat, lng] = getPointInCell(cellid);
+    return {lat, lng};
+  };
+
+  bytesToString = u8 => {
+    return new TextDecoder().decode(u8);
+  };
+  stringToBytes = (str) => {
+    return new TextEncoder().encode(str);
+  };
+  const hasBuffer = typeof Buffer !== 'undefined';
+  function bytesToB64(u8) {
+    if (hasBuffer) return Buffer.from(u8).toString('base64');
+    let s = ''; const CH = 0x8000;
+    for (let i = 0; i < u8.length; i += CH) s += String.fromCharCode.apply(null, u8.subarray(i, i + CH));
+    return btoa(s);
+  }
+  function b64ToBytes(b64) {
+    if (hasBuffer) return new Uint8Array(Buffer.from(b64, 'base64'));
+    const s = atob(b64); const u8 = new Uint8Array(s.length);
+    for (let i = 0; i < s.length; i++) u8[i] = s.charCodeAt(i);
+    return u8;
+  }
+  publishChunkedBytes = (peer, u8, {name, mime}) => {
+    const str = bytesToB64(u8);
+    return {topic: {name, mime, str}};
+  };
+  receiveChunkedBytes = (peer, {name, mime, str}, options) => {
+    const u8 = b64ToBytes(str);
+    return {bytes: u8, name, mime, msgIds: []};
+  };
+
+  connect = async ({bridge, location, onDisconnect}) => {
+    // We always call location as {lat, lng}
+    // We always call it with author:false
+    const {lat, lng} = location;
+    const region = geoCellId(lat, lng);
+    const nodeTag = region.toString(16).padStart(2, '0') + uuidv4();
+    const nodeIdentity = {id: nodeTag};
+    const handlers = {}; // guid => handler tag
+    const inFlight = {};
+    let disconnect, transport; // But do not call P2PWebNetwork.ice!!!
+    const send = await new Promise(resolve => {
+      if (dht === 0) {
+	const url = `${bridge}/${nodeTag}`;
+	const socket = transport = new WebSocket(url);
+	socket.onmessage = event => {
+	  const [tag, ...rest] = JSON.parse(event.data);
+	  const subHandler = handlers[tag];
+	  const inFlightResolver = inFlight[tag];
+	  if ((!subHandler && !inFlightResolver) ||
+	      ((typeof(subHandler) !== 'function') && (typeof(inFlightResolver) !== 'function')))
+	    console.log({tag, rest, subHandler, inFlightResolver, handlers, inFlight});
+	  if (subHandler) return subHandler(...rest);
+	  delete inFlight[tag];
+	  return inFlightResolver?.(...rest);
+	};
+	socket.onopen = () => {
+	  if (socket.readyState !== WebSocket.OPEN) return; // You would think that can't happen, but...
+	  resolve((...rest) => { // send()
+	    const tag = uuidv4();
+	    const {promise, resolve} = Promise.withResolvers();
+	    inFlight[tag] = resolve;
+	    socket.send(JSON.stringify([tag, ...rest]));
+	    return promise;
+	  });
+	};
+	// onerror is of no help, as the event is generic.
+	socket.onclose = event => {
+	  console.warn('websocket close', event.code, event.wasClean, event.reason);
+	  onDisconnect();
+	};
+	disconnect = () => socket.close();
+      } else {
+	disconnect = () => null;
+	operator.setReceiver((nodeTag, id, ...rest) => handlers[id](...rest));
+	resolve((methodName, ...rest) => operator[methodName](...rest)); // send()
+      }
+    });
+
+    const peer = {
+      onError() {},
+      onLog() {},
+      health() {
+	return {peers: [], axonRoles: []};
+      },
+      async leave() {
+	await send('deleteSubscriber', nodeTag);
+	disconnect();
+      },
+      async sub(topic, handler, options) {
+	const result = await send('subscribe', topic, nodeTag, options);
+	handlers[result.id] = handler;
+	return result;
+      },
+      async unsub(topic, options) {
+	const result = await send('unsubscribe', topic, nodeTag, options);
+	delete handlers[result.id];
+	return result;
+      },
+      async pub(topic, message, options) {
+	return send('publish', topic, message, options);
+      },
+      kill(topic, msgId, options) {
+	return send('unpublish', topic, msgId, options);
+      },
+      host() {},
+      unhost() {}
+    };
+    const status = {peers: 0, ms: 0}; // fixme ms
+    return { peer, nodeIdentity, transport, status, disconnect };
+  };
+
+} else {
+  const protocol = await import('@axona/protocol');
+  const std = await import('@axona/protocol/std');
+  ({ connect, createAuthorIdentity, geoCellId, geoCellCenter, WIRE_VERSION, KERNEL_VERSION }  = protocol);
+  ({ stringToBytes, bytesToString, publishChunkedBytes, receiveChunkedBytes } = std);
+}
+
+export { connect, createAuthorIdentity, geoCellId, geoCellCenter, WIRE_VERSION, KERNEL_VERSION };
+export { stringToBytes, bytesToString, publishChunkedBytes, receiveChunkedBytes }
+

package/public/javascripts/pubsub.js

@@ -0,0 +1,124 @@
+// In memory pubsub, for either client-only testing, or server-websocket testing
+const { v4:uuidv4 } = await import('uuid');
+const { TextEncoder, crypto, Buffer } = globalThis;
+
+function setBucket(collection, type, topicId, subject, value) { // Set value in the collection.
+  const bucket = collection[type][topicId] ||= {};
+  bucket[subject] = value;
+}
+function removeBucket(collection, type, topicId, subject) { // Return the value and stop storing it.
+  const bucket = collection[type][topicId];
+  if (!bucket) return null;
+  const value = bucket[subject];
+  delete bucket[subject];
+  if (!Object.keys(bucket).length) delete collection[type][topicId];
+  return value;
+}
+
+const SUBSCRIPTION_TIMEOUT = 0; // No need, because we run deleteSubscriber on disconnect.
+const PUBLISH_TIMEOUT = 24 * 60 * 60e3;      // Delete after 24 hours.
+const timeouts = {pub: {}, sub: {}};
+function expire(type, topicId, subject, remover, timeout) { // Cancellably schedule remover() to fire at timeout.
+  if (!timeout) return;
+  setBucket(timeouts, type, topicId, subject, setTimeout(remover, timeout));
+}
+function cancel(type, topicId, subject) { // Cancel a sheduled expiration.
+  clearTimeout(removeBucket(timeouts, type, topicId, subject));
+}
+
+// pub maps eventName => {[subject]: storageItem, ...}, where subject is the message id. Entries purged after PUBLISH_TIMEOUT.
+// sub maps  eventName => {[subject]: ws, ...}, where subject is the subscriber id. Entries purged after SUBSCRIPTION_TIMEOUT.
+const data = {pub: {}, sub: {}};
+function getDataValues(type, topicId) { // For all subjects
+  return Object.values(data[type][topicId] || {});
+}
+function getDataEntries(type, topicId) {
+  return Object.entries(data[type][topicId] || {});
+}
+
+function deleteSub(topicId, subject) {
+  return removeBucket(data, 'sub', topicId, subject);
+}
+function normalizeTopic({name, region, owner, write = 'open'} = {}) {
+  if (typeof(region) === 'string') region = parseInt(region);;
+  return {name, region, owner, write};
+}
+function deriveTopicId(topic) {
+  return JSON.stringify(normalizeTopic(topic)); // No need to hash in this implementation.
+}
+
+let invoke;
+export function setReceiver(receiver) {
+  invoke = receiver;
+}
+
+export function subscribe(topicName, nodeTag, {since = 'all'}) {
+  // Axona allows multiple handlers on the same topic, but we don't use that in civildefense, and do not implement it here.
+  const topicId = deriveTopicId(topicName);
+  const id = uuidv4();
+  cancel('sub', topicId, id);
+  expire('sub', topicId, id, () => deleteSub(topicId, id), SUBSCRIPTION_TIMEOUT);
+  setBucket(data, 'sub', topicId, nodeTag, id);
+  if (since) setTimeout(() => { // invoke handler on any sticky data, but only after we have told client the subscription id.
+    let lastEnvelope = null, lastTime = 0;
+    for (const envelope of getDataValues('pub', topicId)) {
+      switch (since) {
+      case 'all':
+	invoke(nodeTag, id, envelope);
+	break;
+      case 'latest':
+	if (envelope.ts > lastTime) {
+	  lastTime = envelope.ts;
+	  lastEnvelope = envelope;
+	}
+	break;
+      default: // Must be a timestamp
+	if (envelope.ts === since) invoke(nodeTag, id, envelope);
+      }
+    }
+    if (lastEnvelope) invoke(nodeTag, id, lastEnvelope);
+  }, 100);
+  return {topicName, topicId, id};
+}
+
+export function unsubscribe(topic, nodeTag, options) {
+  const topicId = deriveTopicId(topic);
+  cancel('sub', topicId, nodeTag);
+  const id = deleteSub(topicId, nodeTag);
+  return {ok: true, id}; // Axona doesn't return the id(s) of the subscription(s), but it is convenient for us to do so.
+}
+
+export function deleteSubscriber(nodeTag) {
+  for (const topicId in data.sub)  {
+    const keySubs = data.sub[topicId];
+    for (const [subject, value] of Object.entries(keySubs)) {
+      if (nodeTag === subject) deleteSub(topicId, subject, keySubs);
+    }
+  }
+}
+
+const hasBuffer = typeof Buffer !== 'undefined';
+let toHex = hasBuffer ? u8 => Buffer.from(u8).toString('hex') : u8 => u8.toHex();
+export async function publish(topic, message, {signWith}) {
+  const topicId = deriveTopicId(topic);
+  const signerPubkey = signWith?.authorId || undefined;
+  const payload = JSON.stringify({message, publisher: signerPubkey});
+  const hash = await crypto.subtle.digest("SHA-256", new TextEncoder().encode(payload));
+  const msgId = toHex(new Uint8Array(hash));
+  const envelope = {msgId, topic, ts: Date.now(), message, signerPubkey};
+  for (const [nodeTag, id] of getDataEntries('sub', topicId)) invoke(nodeTag, id, envelope);
+  setBucket(data, 'pub', topicId, msgId, envelope);
+  expire('pub', topicId, msgId, () => removeBucket(data, 'pub', topicId, msgId), PUBLISH_TIMEOUT);
+  return msgId;
+}
+
+export function unpublish(topic, msgId, {signWith}) {
+  const topicId = deriveTopicId(topic);  
+  cancel('pub', topicId, msgId);
+  const envelope = removeBucket(data, 'pub', topicId, msgId);
+  if (!envelope) return {ok: false}; // we didn't have it.
+  envelope.deleted = true;
+  envelope.message = null;
+  for (const [nodeTag, id] of getDataEntries('sub', topicId)) invoke(nodeTag, id, envelope);
+  return {ok: true};
+}

package/public/javascripts/s2.js

@@ -1,5 +1,7 @@
-import { s2 } from 's2js';
+import { s2, s1, r1 } from 's2js';
 const { cellid, LatLng, Point, Cell, Cap, RegionCoverer } = s2;
+import { cellHex } from './versions.js';
+const { BigInt } = globalThis;
 
 // s2 defines non-overlapping cells that completely cover the globe, at several different levels of cell-size.
 // Each cell, at each level, has its own unique id, which we use a pub/sub key.
@@ -10,18 +12,30 @@ const { cellid, LatLng, Point, Cell, Cap, RegionCoverer } = s2;
 // Meanwhile as the user changes the area being shown, we subscribe to whatever cells we need in order to cover the display
 // area without overlapping cells.
 
-export const MIN_LEVEL = 2; // Corresponds to the top level Axona regions.
+export const MIN_LEVEL = 3; // Corresponds to the top level Axona regions.
 const MAX_S2_LEVEL = 30; // The leaf level that Cell.fromPoint operates at.
 const MAX_MAP_LEVEL = 17; // The max level that findCoverCellsByCenterAndRadius will use on our maps.
 
 const EARTH_RADIUS_METERS = 6371e3;
 
-export function getPointInCell(cellId) { // answer [lat, lng] in degrees.
-  let {lat, lng} = s2.cellid.latLng(cellId);
-  const degrees = 180 / Math.PI;
-  lat *= degrees;
-  lng *= degrees;
-  return [lat, lng];
+export function getPointInCell(cellId) { // answer [lat, lng] in degrees from a BigInt
+  // CAUTION: This is intended for s2 level 3 or finer, and won't always work symmetrically for our top-level regions.
+  // e.g. getContainingCells(...getPointInCell( cell for 0x47 )][0] is 0x46!
+  let center = s2.cellid.latLng(cellId);
+  return [s1.angle.degrees(center.lat), s1.angle.degrees(center.lng)];
+}
+
+function getCellSubdivision(cell) {
+  return cellid.children(cell);
+}
+function getCellLevel(cell) {
+  return cellid.level(cell);
+}
+function getFace(cell) {
+  return cellid.face(cell);
+}
+export function getSubdivision(hexString) {
+  return getCellSubdivision(BigInt('0x' + hexString)).map(childCell => cellHex(childCell));
 }
 
 // Return a list of the cell ids that contain the point.
@@ -37,41 +51,22 @@ export function getContainingCells(lat, lng) {
   return cells.slice(MIN_LEVEL, MAX_MAP_LEVEL + 1); // We can only make use between Axona region size and the smallest region our maps subscribe to.
 }
 
-// Return a list of cell ids that covers a circle specified by a center and a point on that circle, without overlapped cells.
-export function findCoverCellsByCenterAndPoint(centerLat, centerLng, pointLat, pointLng) {
-  // TODO: Does it make sense to do this by the actual borders shown, rather than by the length of the half-diagonal?
-  const center = Point.fromLatLng(LatLng.fromDegrees(centerLat, centerLng));
-  const point = Point.fromLatLng(LatLng.fromDegrees(pointLat, pointLng));
-  const distanceAngle = center.distance(point);
-  const interestRadiusMeters = distanceAngle * EARTH_RADIUS_METERS;
-  return findCoverCellsByCenterAndRadius(centerLat, centerLng, interestRadiusMeters);
-}
+export function findCoverCellsByMinMaxLatLng({minLat, maxLat, minLng, maxLng, full = false,
+					      options:{minLevel = MIN_LEVEL, maxLevel = MAX_MAP_LEVEL, maxCells = 12} = {}}) {
+  // Return a list-like object of cell ids that cover the specified range.
+  // The lat/lng won't work well for the full map, so an exact full map can be requested, overriding that lat/lng.
 
-// Return a list of cell ids that covers interestRadiusMeters around latitude/longitude, without overlapped cells.
-export function findCoverCellsByCenterAndRadius(lat, lng, interestRadiusMeters) {
-  const point = Point.fromLatLng(LatLng.fromDegrees(lat, lng));
+  // There are a lot of ways that seem like they do this, but it is very easy to find something that works for a few cases,
+  // but misses cells in some circumstances, so be wary about rewriting this.
+  const lo = s2.LatLng.fromDegrees(minLat, Math.max(minLng, -180));
+  const hi = s2.LatLng.fromDegrees(maxLat, Math.max(maxLng, 190));
 
-  // replicating key parts of Cap.cellUnionBound():
-  // Find the maximum (i.e., finest-grained) level such that the cap contains at
-  // most [ael: at least??] one cell vertex and such that CellID.AppendVertexNeighbors() can be called.
-  const findLevel = radius => {
-    let levelForRadius = MAX_S2_LEVEL;
-    const radiusAngle = radius / EARTH_RADIUS_METERS;
-    if (radiusAngle > 0) {
-      const deriv = 2 * Math.SQRT2 / 3;
-      levelForRadius = Math.floor(Math.log2(deriv / radiusAngle));
-      if (levelForRadius > MAX_S2_LEVEL) levelForRadius = MAX_S2_LEVEL;
-      if (levelForRadius < 0) levelForRadius = 0;
-    }
-    return levelForRadius;
-  };
-  const levelForRadius = findLevel(interestRadiusMeters); // - 1; // as seen in cellUnionBound: go one level bigger
+  const rect = full ? s2.Rect.fullRect() : new s2.Rect(
+    new r1.Interval(lo.lat, hi.lat),
+    new r1.Interval(lo.lng, hi.lng)
+  );
 
-  const minLevel = Math.max(MIN_LEVEL, levelForRadius - 1);
-  const maxLevel = Math.max(MIN_LEVEL, levelForRadius + 2);
-  const rc = new RegionCoverer({ minLevel, maxLevel, maxCells: 9 }); // Will exceed maxCells as needed to obey minLevel.
-  const r = Cap.fromCenterAngle(point, interestRadiusMeters / EARTH_RADIUS_METERS);
-  return rc.covering(r);
+  const coverer = new RegionCoverer({minLevel, maxLevel, maxCells});
+  return coverer.covering(rect); // a CellUnion — array-like of bigint cell IDs, already normalized/minimal
 }
 
-

package/public/javascripts/service-manager.js

@@ -1,8 +1,8 @@
 const { Request, Response, URL, localStorage, BroadcastChannel } = globalThis;
 import { appVersion } from './versions.js';
-import { resetInactivityTimer, clickTip } from './main.js';
+import { resetInactivityTimer, clickTip, closeAbout } from './main.js';
 import { openDisplay } from './display.js';
-import { go } from './alert.js';
+import { go, getShareableURL } from './alert.js';
 import { Int } from './translations.js';
 
 /*
@@ -73,12 +73,13 @@ function newVersionAvailable(newVersion) {
 }
 async function installUpdate(event, newVersion) {
   event.stopPropagation();
-  event.target.textContent = "Installing..."; // In case there is some delay, tell the user what we're trying to do. Will be cleared with reload.
+  event.target.textContent = Int`Installing...`; // In case there is some delay, tell the user what we're trying to do. Will be cleared with reload.
   event.target.disabled = true;
   await caches.delete(appVersion); // Must be before cacheSource, or we'll just recache the same files!
   await cacheSource(newVersion);
+  closeAbout();
   // Reload, but convince all browsers to re-"fetch" (through the new service worker that is now running).
-  const url = new URL(location.href);
+  const url = getShareableURL(null, []);
   url.searchParams.set('v', newVersion); // Preserving any other searchParams.
   // For any other tabs in THIS browser:
   new BroadcastChannel('site_control').postMessage({method: 'reload', params: url.href});

package/public/javascripts/translations.js

@@ -52,6 +52,7 @@ const translations = {
   ['does not support notifications on WebViews embedded in other programs. Please use CivilDefense.io in native']: {es: "no admite notificaciones en WebViews integrados en otros programas. Por favor, utilice CivilDefense.io en el navegador nativo"},
   ['Apple only supports mobile notifications for web pages that have been']: {es: "Apple solo admite notificaciones móviles para páginas web que hayan sido"},
   ['installed to the home screen']: {es: "instaladoi en la pantalla de inicio"},
+  ['Installing...']: {es: "Instalando..."},
   ['Enable notifications']: {es: "Habilitar notificaciones"},
   ['Allow notifications']: {es: "Permitir notificaciones"},
   ['Permissions can be re-enabled through the']: {es: "Los permisos se pueden volver a habilitar a través de"},

package/public/javascripts/versions.js

@@ -3,10 +3,11 @@ export const appVersion = pkg.version; // Overall semver of app. Used in display
 export const dataVersion = globalThis.process?.env.EVENT_VERSION || appVersion.split('.')[0];  // Compatability differentiator used below.
 
 export function stripLeadingEmoji(string) { // Return string without any leading emoji (which might be of varying
-    // length) followed by an optional emoji break character and any whitespace.
-    // {Extended_Pictographic} is often recommended instead of {Emoji} as the latter includes numbers
-    // and symbols. However, the former misses, e.g., the flag emojis.
-    return string.replace(/^\p{Emoji}*\uFE0F?\s*/u, '') || string;
+  // length) followed by an optional emoji break character and any whitespace.
+  // {Extended_Pictographic} is often recommended instead of {Emoji} as the latter includes numbers
+  // and symbols. However, the former misses, e.g., the flag emojis.
+  return string.replace(/^\p{Emoji}*\uFE0F?\s*/u, '') ||
+    (string.endsWith(' ') ? '' : string); // All emoji counts, but if ending with space, it is the start of an emoji + \s + tag for which just the tag counts.
 };
 export function canonicalTag(tag) { // A string representing tag, without the (leading) emoji if any.
   return stripLeadingEmoji(tag).toLowerCase();
@@ -18,6 +19,16 @@ export function agentPersistKey(metadataType, agentTag) { // A label for looking
 export function agentTopic(metadataType, agentTag) { // Return topic name for public info about agent specified by tag.
   return `public:${dataVersion}:${agentPersistKey(metadataType, agentTag)}`;
 }
+export function cellHex(cellid) { // Convert cellid BigInt to properly padded hex.
+  return cellid.toString(16).padStart(16, '0');
+}
 export function alertTopic(cellid, tag) { // Return topic name for public info about specified tag in cellid.
-  return `civildefense.io:${dataVersion}:${cellid}:${canonicalTag(tag)}`;
+  return `civildefense.io:${dataVersion}:${cellHex(cellid)}:${canonicalTag(tag)}`;
+}
+export function topicCell(topicName) { // Return the cell that is baked in to the topic.
+  // Note that canonicalTag(tag) may contain a colon, but dataVersion must not.
+  return topicName.match(/civildefense.io:[^:]+:([a-z0-9]+):/)[1];
+}
+export function topicRegion(topicName) { // Return the region that is baked in to the topic.
+  return '0x' + topicCell(topicName).slice(0, 2);
 }

package/public/service-worker.js

@@ -1,6 +1,6 @@
 const { Request, Response, URL, clients} = self;
 // Little point in trying to automatically pull this through package.json, as we need a byte change in THIS file to trigger a new worker.
-const serviceVersion = '4.5.9';
+const serviceVersion = '4.5.21';
 
 const cacheList = [ // The files we need.
   "/",
@@ -21,6 +21,8 @@ const cacheList = [ // The files we need.
   "javascripts/translations.js",
   "javascripts/service-manager.js",
   "javascripts/p2pWebNetwork.js",
+  "javascripts/protocol.js",
+  "javascripts/pubsub.js",
 
   "stylesheets/style.css",
 
@@ -34,6 +36,7 @@ const cacheList = [ // The files we need.
 
   "axona-protocol/src/index.js",
   "axona-protocol/src/errors.js",
+  "axona-protocol/src/connect.js",
   "axona-protocol/src/bridgeDirectory.js",
   "axona-protocol/src/contracts/Transport.js",
   "axona-protocol/src/contracts/DHT.js",
@@ -49,6 +52,18 @@ const cacheList = [ // The files we need.
   "axona-protocol/src/dht/Subscription.js",
   "axona-protocol/src/pubsub/AxonaManager.js",
   "axona-protocol/src/pubsub/authorClass.js",
+  "axona-protocol/src/pubsub/ids.js",
+  "axona-protocol/src/pubsub/dispatch.js",
+  "axona-protocol/src/pubsub/durability.js",
+  "axona-protocol/src/pubsub/rootClaim.js",
+  "axona-protocol/src/pubsub/constants.js",
+  "axona-protocol/src/pubsub/topicStore.js",
+  "axona-protocol/src/pubsub/rootElection.js",
+  "axona-protocol/src/pubsub/syncEngine.js",
+  "axona-protocol/src/pubsub/repairPlane.js",
+  "axona-protocol/src/pubsub/wireHandlers.js",
+  "axona-protocol/src/pubsub/writeFlight.js",
+  "axona-protocol/src/pubsub/ackProof.js",
   "axona-protocol/src/pubsub/kill.js",
   "axona-protocol/src/pubsub/touch.js",
   "axona-protocol/src/pubsub/post.js",
@@ -166,20 +181,20 @@ self.addEventListener('fetch', event => {
 async function cacheSource(version, event) { // Cache source in the given version.
   console.log(`service-worker ${serviceVersion} is caching source in cache ${version}.`);
   const cache = await caches.open(version);
-  // for (const file of cacheList) cache.add(new Request(file, {cache: 'no-store'})).catch(error => console.error(file + ' ' + error.message)); // dev testing for changed file tree
-  await cache.addAll(cacheList.map(name => new Request(name, {cache: 'no-store'}))); // Might not be necessary to specify no-store, but if any browsers insist on their own caching...
+  await Promise.all(cacheList.map(file => cache.add(file)
+				  .catch(error => console.error(file + ' ' + error.message))));
 
   await Promise.all([
     // These are referenced within material web, but missing. Turns out we don't need them,
     // but let's cache empty responses to keep the console cleaner.
-    "https://esm.run/npm/lit@3.3.1/+esm",
     "https://esm.run/npm/tslib@2.8.1/+esm",
-    "https://esm.run/npm/lit@3.3.1/static-html.js/+esm",
-    "https://esm.run/npm/lit@3.3.1/decorators.js/+esm",
-    "https://esm.run/npm/lit@3.3.1/directives/style-map.js/+esm",
-    "https://esm.run/npm/lit@3.3.1/directives/class-map.js/+esm",
-    "https://esm.run/npm/lit@3.3.1/directives/when.js/+esm",
-    "https://esm.run/npm/lit@3.3.1/directives/live.js/+esm",
+    "https://esm.run/npm/lit@3.3.3/+esm",
+    "https://esm.run/npm/lit@3.3.3/static-html.js/+esm",
+    "https://esm.run/npm/lit@3.3.3/decorators.js/+esm",
+    "https://esm.run/npm/lit@3.3.3/directives/style-map.js/+esm",
+    "https://esm.run/npm/lit@3.3.3/directives/class-map.js/+esm",
+    "https://esm.run/npm/lit@3.3.3/directives/when.js/+esm",
+    "https://esm.run/npm/lit@3.3.3/directives/live.js/+esm",
   ].map(url => cache.put(new Request(url),
                          new Response("", {headers: { "Content-Type": "text/javascript" }}))));
   return version;

package/public/stylesheets/style.css

@@ -16,6 +16,7 @@
     --md-sys-shape-corner-full: 12px;
 
     --about-image-size: 80px;
+    --combobox-minWidth: 125px;
 
     /* --md-sys-color-tertiary-container: blue; */
     /* --md-sys-color-background: yellow; */
@@ -196,22 +197,26 @@ button, .leaflet-control-zoom > a, .leaflet-popup-close-button, md-outlined-icon
 .combobox {
     position: relative;
     --textFieldHeight: 34px;
-    --minWidth: 125px;
 }
 .combobox-listbox {
     padding: 5px;
     position: absolute;
-    bottom: calc(var(--textFieldHeight) + 2px);
-    left: 0;
-    max-height: 50dvh; /* leaving room for portrait keyboard. landscape keyboard has no room at all */
-    width: fit-content;
-    min-width: var(--minWidth);
+    right: 5px;
+    bottom: 55px;
+    max-height: 45dvh; /* leaving room for portrait keyboard. landscape keyboard has no room at all *\/ */
     overflow-y: auto;
-    z-index: 9999;
+    width: fit-content;
+    min-width: var(--combobox-minWidth);
+    z-index: 1000;
     background: rgba(255, 255, 255, 0.95);
     border-top-left-radius: 12px;
     border-top-right-radius: 12px;
 }
+@media (orientation: landscape) and (pointer: coarse) {
+    .combobox-listbox {
+	display: none !important;
+    }
+}
 .combobox-option {
     font-size: 0.95rem;
     color: var(--md-sys-color-primary);
@@ -238,12 +243,13 @@ button, .leaflet-control-zoom > a, .leaflet-popup-close-button, md-outlined-icon
     background:  #B8C2D7;
 }
 .watching-hashtags md-filled-text-field.newtag {
+    anchor-name: --combobox-newtag;
     --md-filled-field-top-space: 0px;
     --md-filled-field-bottom-space: 0px;
     --md-filled-text-field-leading-space: 8px;
     --md-filled-text-field-trailing-space: 0px;
-    height: var(--textFieldHeight);
-    width: var(--minWidth);
+    height: 34px;
+    width: var(--combobox-minWidth);
 }
 .alert-marker {
     text-shadow: 8px -3px 10px rgb(0 0 0 / 60%);
@@ -323,6 +329,7 @@ md-filter-chip minidenticon-svg {
 md-outlined-icon-button minidenticon-svg, md-outlined-icon-button img {
     height: 40px;
     width: 40px;
+    object-fit: cover;
     border-radius: 12px;
 }
 .alert span minidenticon-svg {
@@ -388,9 +395,9 @@ md-menu {
 md-outlined-button {
     padding: 10px;
 }
-.attribution > div:last-child > span {
-    text-wrap: nowrap;
-}
+/* .attribution > div:last-child > span { */
+/*     text-wrap: nowrap; */
+/* } */
 md-menu-item minidenticon-svg {
     display: inline-block;
     height: 20px;
@@ -424,7 +431,7 @@ md-menu-item minidenticon-svg {
 .attribution-metadata {
     display: flex;
     flex-direction: column;
-    align-items: end;
+    /* align-items: end; */
 }
 .alert {
     font-family: roboto;