changeset 2575:9d147f7d809c

Rename util.js to worldmap.js to better reflect its functionality.
author Matti Hamalainen <ccr@tnsp.org>
date Mon, 29 Jan 2024 00:25:14 +0200
parents 5e6efb5a6b84
children 72a56465ebd7
files Makefile.common Makefile.maps src/util.js src/worldmap.js world/Makefile
diffstat 5 files changed, 315 insertions(+), 315 deletions(-) [+]
line wrap: on
line diff
--- a/Makefile.common	Sun Jan 28 02:32:53 2024 +0200
+++ b/Makefile.common	Mon Jan 29 00:25:14 2024 +0200
@@ -79,7 +79,7 @@
 ###
 ### Special targets
 ###
-upload: src/tooltip.js src/citymap.js src/util.js $(MISC_MAPS_PATH)misc.css \
+upload: src/tooltip.js src/citymap.js src/worldmap.js $(MISC_MAPS_PATH)misc.css \
 	$(addprefix $(MISC_MAPS_PATH),$(addsuffix .html,$(MISC_MAPS))) \
 	$(addprefix $(MISC_MAPS_PATH),$(addsuffix .map,$(MISC_MAPS))) \
 	$(addprefix $(MISC_MAPS_PATH),$(addsuffix .loc,$(MISC_MAPS)))
--- a/Makefile.maps	Sun Jan 28 02:32:53 2024 +0200
+++ b/Makefile.maps	Mon Jan 29 00:25:14 2024 +0200
@@ -27,7 +27,7 @@
 
 %.html: %.tmp2 %.desc %.tmp3 $(COLORMAP_BIN)
 	@echo "COLORMAP $@"
-	@$(COLORMAP_BIN) $(COLORMAP_OPTS) -J util.js $(COLORMAP_HTML) -P $(COLORMAP_EXTRA) -t "`cat $(patsubst %.tmp2,%.desc,$<)`" $< | \
+	@$(COLORMAP_BIN) $(COLORMAP_OPTS) -J worldmap.js $(COLORMAP_HTML) -P $(COLORMAP_EXTRA) -t "`cat $(patsubst %.tmp2,%.desc,$<)`" $< | \
 	sed -e "/@LOCATIONS@/r $(patsubst %.tmp2,%.tmp3,$<)" -e "s/@LOCATIONS@//g" > $@
 
 
--- a/src/util.js	Sun Jan 28 02:32:53 2024 +0200
+++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
@@ -1,312 +0,0 @@
-//
-// Positioning utility functions in JavaScript for BatMUD maps
-// Programmed by Matti 'ccr' Hamalainen <ccr@tnsp.org>
-// (C) Copyright 2007-2024 Tecnic Software productions (TNSP)
-//
-var mapElem = null;
-var mapDragEnable = false, mapDragGoing = false;
-var mapDragPos = { x: 0, y: 0, mx: 0, my: 0 };
-var mapCurrPos = null;
-var mapCurrLoc = null;
-var mapScrollTimerID = -1;
-var mapScrollPosStart, mapScrollPosEnd;
-var mapScrollIndex = 0.0, mapScrollSteps = 50;
-
-
-function mapAddEventListener(obname, evtype, evcallback)
-{
-  document.getElementById(obname).addEventListener(evtype, evcallback, false);
-}
-
-
-function mapFindElemCoords(elem)
-{
-  var xc = yc = 0;
-  if (elem.offsetParent)
-  {
-    xc = elem.offsetLeft;
-    yc = elem.offsetTop;
-    while (elem = elem.offsetParent)
-    {
-      xc += elem.offsetLeft;
-      yc += elem.offsetTop;
-    }
-  }
-
-  return { x: xc, y: yc, mx: 0, my: 0 };
-}
-
-
-function mapGetWindowSize()
-{
-  var winW = 0, winH = 0;
-  if (typeof(window.innerWidth) == 'number')
-  {
-    // Non-MSIE
-    winW = window.innerWidth;
-    winH = window.innerHeight;
-  }
-  else
-  if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight))
-  {
-    // MSIE 6+ in 'standards compliant mode'
-    winW = document.documentElement.clientWidth;
-    winH = document.documentElement.clientHeight;
-  }
-  else
-  if (document.body && (document.body.clientWidth || document.body.clientHeight))
-  {
-    // MSIE 4 compatible
-    winW = document.body.clientWidth;
-    winH = document.body.clientHeight;
-  }
-
-  return { w: winW, h: winH };
-}
-
-
-function mapSetWindowPos(px, py)
-{
-  const dim = mapGetWindowSize();
-  mapDragPos.x = px - (dim.w / 2);
-  mapDragPos.y = py - (dim.h / 2);
-
-  mapElem.scrollLeft = mapDragPos.x;
-  mapElem.scrollTop = mapDragPos.y;
-}
-
-
-function mapClamp10(a)
-{
-  return (a < 0.0 ? 0.0 : (a > 1.0 ? 1.0 : a));
-}
-
-
-function mapSCurve(t)
-{
-  return (t * t * (3.0 - 2.0 * t));
-}
-
-
-function mapLerp(t, a, b)
-{
-  return (a + t * (b - a));
-}
-
-
-function mapScrollToPos()
-{
-  if (mapScrollIndex <= 1.0)
-  {
-    const n = mapSCurve(mapClamp10(mapScrollIndex));
-    const px = mapLerp(n, mapScrollPosStart.x, mapScrollPosEnd.x);
-    const py = mapLerp(n, mapScrollPosStart.y, mapScrollPosEnd.y);
-
-    mapSetWindowPos(px, py);
-    mapScrollIndex += 1.0 / mapScrollSteps;
-  }
-  else
-  {
-    clearInterval(mapScrollTimerID);
-  }
-}
-
-
-function mapSetActiveLocation(newLoc)
-{
-  // Change CSS class state for prev/curr/new selected element
-  if (mapCurrLoc != null)
-  {
-    var celem = document.getElementById(mapCurrLoc);
-    var mcelem = document.getElementById("m"+ mapCurrLoc);
-    if (celem && mcelem)
-    {
-      celem.classList.remove("nactive");
-      mcelem.classList.remove("nactive");
-    }
-  }
-
-  if (newLoc != null)
-  {
-    var celem = document.getElementById(newLoc);
-    var mcelem = document.getElementById("m"+ newLoc);
-    if (celem && mcelem)
-    {
-      celem.classList.add("nactive");
-      mcelem.classList.add("nactive");
-
-      mapCurrLoc = newLoc;
-      mapCurrPos = mapFindElemCoords(celem);
-    }
-  }
-
-
-  // Set the active item in the location dropdown
-  var ssel = document.getElementById("slocation");
-  if (ssel)
-  {
-    var found = false;
-    for (var opt, i = 0; opt = ssel.options[i]; i++)
-    {
-      if (opt.value == newLoc)
-      {
-        ssel.selectedIndex = i;
-        found = true;
-        break;
-      }
-    }
-
-    if (!found)
-      ssel.selectedIndex = 0;
-  }
-}
-
-
-function mapSetPosToElem(nelem)
-{
-  const pos = mapFindElemCoords(nelem);
-  mapSetWindowPos(pos.x, pos.y);
-}
-
-
-function mapGotoLocation()
-{
-  var newLoc = document.getElementById("slocation").value;
-  if (newLoc == "")
-  {
-    mapCurrLoc = null;
-  }
-  else
-  if (mapCurrLoc != newLoc || mapCurrPos != mapDragPos)
-  {
-    var nelem = document.getElementById(newLoc);
-    if (nelem)
-    {
-      //const spanning = document.getElementById("spanning").checked;
-      var celem = mapCurrLoc != null ? document.getElementById(mapCurrLoc) : null;
-      //if (spanning && celem)
-      if (celem)
-      {
-        if (mapScrollTimerID != -1)
-          clearInterval(mapScrollTimerID);
-
-        if (mapCurrPos != null)
-          mapScrollPosStart = mapCurrPos;
-        else
-          mapScrollPosStart = mapFindElemCoords(celem);
-
-        mapScrollPosEnd = mapFindElemCoords(nelem);
-        mapScrollIndex = 0.0;
-        mapScrollTimerID = setInterval(mapScrollToPos, 10);
-      }
-      else
-      {
-        mapSetPosToElem(nelem);
-      }
-    }
-  }
-
-  mapSetActiveLocation(newLoc);
-
-  // Set href
-  var slink = window.location.href;
-  var spos;
-  if ((spos = slink.indexOf("#")) >= 0)
-    slink = slink.substr(0, spos);
-  slink += newLoc != null ? "#" + newLoc : "";
-
-  window.location.href = slink;
-}
-
-
-function mapUpdateLabelVisibility()
-{
-  var vcl = document.all ? document.styleSheets[0].rules[0] : document.styleSheets[0].cssRules[0];
-  vcl.style.visibility = document.getElementById("slabels").checked ? "visible" : "hidden";
-}
-
-
-function mapDragUpHandler(ev)
-{
-  if (mapDragGoing)
-  {
-    mapDragGoing = false;
-    mapElem.style.cursor = "grab";
-    mapElem.style.removeProperty("user-select");
-  }
-}
-
-
-function mapDragMoveHandler(ev)
-{
-  if (mapDragGoing)
-  {
-    const dx = ev.clientX - mapDragPos.mx;
-    const dy = ev.clientY - mapDragPos.my;
-
-    mapElem.scrollLeft = mapDragPos.x - dx;
-    mapElem.scrollTop = mapDragPos.y - dy;
-  }
-}
-
-
-function mapDragStartPan(ev)
-{
-  if (mapDragEnable)
-  {
-    mapElem.style.cursor = "grabbing";
-    mapElem.style.userSelect = "none";
-
-    if (mapScrollTimerID != -1)
-      clearInterval(mapScrollTimerID);
-
-    mapDragPos = {
-      x: mapElem.scrollLeft,
-      y: mapElem.scrollTop,
-      mx: ev.clientX,
-      my: ev.clientY,
-    };
-
-    mapDragGoing = true;
-  }
-}
-
-
-function mapUpdateDragPan()
-{
-  mapDragEnable = document.getElementById("spanning").checked;
-  mapElem.style.cursor = mapDragEnable ? "grab" : "default";
-}
-
-
-function mapOnLoad()
-{
-  mapElem = document.getElementById("smap");
-
-  var slink = window.location.href;
-  var spos;
-  if ((spos = slink.indexOf("#")) >= 0)
-  {
-    var eid = unescape(slink.substr(spos + 1).toLowerCase()).trim();
-    var nelem = document.getElementById(eid);
-    if (nelem)
-    {
-      setTimeout(function()
-      {
-        mapSetPosToElem(nelem);
-        mapSetActiveLocation(eid);
-      },
-      50);
-    }
-  }
-
-  mapAddEventListener("slabels", "change", mapUpdateLabelVisibility);
-  mapAddEventListener("slocation", "change", mapGotoLocation);
-  mapAddEventListener("spanning", "change", mapUpdateDragPan);
-  mapAddEventListener("smap", "mousedown", mapDragStartPan);
-  document.addEventListener("mousemove", mapDragMoveHandler);
-  document.addEventListener("mouseup", mapDragUpHandler);
-
-  mapUpdateLabelVisibility();
-  mapUpdateDragPan();
-}
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/worldmap.js	Mon Jan 29 00:25:14 2024 +0200
@@ -0,0 +1,312 @@
+//
+// Worldmap utility functions in JavaScript for BatMUD maps
+// Programmed by Matti 'ccr' Hamalainen <ccr@tnsp.org>
+// (C) Copyright 2007-2024 Tecnic Software productions (TNSP)
+//
+var mapElem = null;
+var mapDragEnable = false, mapDragGoing = false;
+var mapDragPos = { x: 0, y: 0, mx: 0, my: 0 };
+var mapCurrPos = null;
+var mapCurrLoc = null;
+var mapScrollTimerID = -1;
+var mapScrollPosStart, mapScrollPosEnd;
+var mapScrollIndex = 0.0, mapScrollSteps = 50;
+
+
+function mapAddEventListener(obname, evtype, evcallback)
+{
+  document.getElementById(obname).addEventListener(evtype, evcallback, false);
+}
+
+
+function mapFindElemCoords(elem)
+{
+  var xc = yc = 0;
+  if (elem.offsetParent)
+  {
+    xc = elem.offsetLeft;
+    yc = elem.offsetTop;
+    while (elem = elem.offsetParent)
+    {
+      xc += elem.offsetLeft;
+      yc += elem.offsetTop;
+    }
+  }
+
+  return { x: xc, y: yc, mx: 0, my: 0 };
+}
+
+
+function mapGetWindowSize()
+{
+  var winW = 0, winH = 0;
+  if (typeof(window.innerWidth) == 'number')
+  {
+    // Non-MSIE
+    winW = window.innerWidth;
+    winH = window.innerHeight;
+  }
+  else
+  if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight))
+  {
+    // MSIE 6+ in 'standards compliant mode'
+    winW = document.documentElement.clientWidth;
+    winH = document.documentElement.clientHeight;
+  }
+  else
+  if (document.body && (document.body.clientWidth || document.body.clientHeight))
+  {
+    // MSIE 4 compatible
+    winW = document.body.clientWidth;
+    winH = document.body.clientHeight;
+  }
+
+  return { w: winW, h: winH };
+}
+
+
+function mapSetWindowPos(px, py)
+{
+  const dim = mapGetWindowSize();
+  mapDragPos.x = px - (dim.w / 2);
+  mapDragPos.y = py - (dim.h / 2);
+
+  mapElem.scrollLeft = mapDragPos.x;
+  mapElem.scrollTop = mapDragPos.y;
+}
+
+
+function mapClamp10(a)
+{
+  return (a < 0.0 ? 0.0 : (a > 1.0 ? 1.0 : a));
+}
+
+
+function mapSCurve(t)
+{
+  return (t * t * (3.0 - 2.0 * t));
+}
+
+
+function mapLerp(t, a, b)
+{
+  return (a + t * (b - a));
+}
+
+
+function mapScrollToPos()
+{
+  if (mapScrollIndex <= 1.0)
+  {
+    const n = mapSCurve(mapClamp10(mapScrollIndex));
+    const px = mapLerp(n, mapScrollPosStart.x, mapScrollPosEnd.x);
+    const py = mapLerp(n, mapScrollPosStart.y, mapScrollPosEnd.y);
+
+    mapSetWindowPos(px, py);
+    mapScrollIndex += 1.0 / mapScrollSteps;
+  }
+  else
+  {
+    clearInterval(mapScrollTimerID);
+  }
+}
+
+
+function mapSetActiveLocation(newLoc)
+{
+  // Change CSS class state for prev/curr/new selected element
+  if (mapCurrLoc != null)
+  {
+    var celem = document.getElementById(mapCurrLoc);
+    var mcelem = document.getElementById("m"+ mapCurrLoc);
+    if (celem && mcelem)
+    {
+      celem.classList.remove("nactive");
+      mcelem.classList.remove("nactive");
+    }
+  }
+
+  if (newLoc != null)
+  {
+    var celem = document.getElementById(newLoc);
+    var mcelem = document.getElementById("m"+ newLoc);
+    if (celem && mcelem)
+    {
+      celem.classList.add("nactive");
+      mcelem.classList.add("nactive");
+
+      mapCurrLoc = newLoc;
+      mapCurrPos = mapFindElemCoords(celem);
+    }
+  }
+
+
+  // Set the active item in the location dropdown
+  var ssel = document.getElementById("slocation");
+  if (ssel)
+  {
+    var found = false;
+    for (var opt, i = 0; opt = ssel.options[i]; i++)
+    {
+      if (opt.value == newLoc)
+      {
+        ssel.selectedIndex = i;
+        found = true;
+        break;
+      }
+    }
+
+    if (!found)
+      ssel.selectedIndex = 0;
+  }
+}
+
+
+function mapSetPosToElem(nelem)
+{
+  const pos = mapFindElemCoords(nelem);
+  mapSetWindowPos(pos.x, pos.y);
+}
+
+
+function mapGotoLocation()
+{
+  var newLoc = document.getElementById("slocation").value;
+  if (newLoc == "")
+  {
+    mapCurrLoc = null;
+  }
+  else
+  if (mapCurrLoc != newLoc || mapCurrPos != mapDragPos)
+  {
+    var nelem = document.getElementById(newLoc);
+    if (nelem)
+    {
+      //const spanning = document.getElementById("spanning").checked;
+      var celem = mapCurrLoc != null ? document.getElementById(mapCurrLoc) : null;
+      //if (spanning && celem)
+      if (celem)
+      {
+        if (mapScrollTimerID != -1)
+          clearInterval(mapScrollTimerID);
+
+        if (mapCurrPos != null)
+          mapScrollPosStart = mapCurrPos;
+        else
+          mapScrollPosStart = mapFindElemCoords(celem);
+
+        mapScrollPosEnd = mapFindElemCoords(nelem);
+        mapScrollIndex = 0.0;
+        mapScrollTimerID = setInterval(mapScrollToPos, 10);
+      }
+      else
+      {
+        mapSetPosToElem(nelem);
+      }
+    }
+  }
+
+  mapSetActiveLocation(newLoc);
+
+  // Set href
+  var slink = window.location.href;
+  var spos;
+  if ((spos = slink.indexOf("#")) >= 0)
+    slink = slink.substr(0, spos);
+  slink += newLoc != null ? "#" + newLoc : "";
+
+  window.location.href = slink;
+}
+
+
+function mapUpdateLabelVisibility()
+{
+  var vcl = document.all ? document.styleSheets[0].rules[0] : document.styleSheets[0].cssRules[0];
+  vcl.style.visibility = document.getElementById("slabels").checked ? "visible" : "hidden";
+}
+
+
+function mapDragUpHandler(ev)
+{
+  if (mapDragGoing)
+  {
+    mapDragGoing = false;
+    mapElem.style.cursor = "grab";
+    mapElem.style.removeProperty("user-select");
+  }
+}
+
+
+function mapDragMoveHandler(ev)
+{
+  if (mapDragGoing)
+  {
+    const dx = ev.clientX - mapDragPos.mx;
+    const dy = ev.clientY - mapDragPos.my;
+
+    mapElem.scrollLeft = mapDragPos.x - dx;
+    mapElem.scrollTop = mapDragPos.y - dy;
+  }
+}
+
+
+function mapDragStartPan(ev)
+{
+  if (mapDragEnable)
+  {
+    mapElem.style.cursor = "grabbing";
+    mapElem.style.userSelect = "none";
+
+    if (mapScrollTimerID != -1)
+      clearInterval(mapScrollTimerID);
+
+    mapDragPos = {
+      x: mapElem.scrollLeft,
+      y: mapElem.scrollTop,
+      mx: ev.clientX,
+      my: ev.clientY,
+    };
+
+    mapDragGoing = true;
+  }
+}
+
+
+function mapUpdateDragPan()
+{
+  mapDragEnable = document.getElementById("spanning").checked;
+  mapElem.style.cursor = mapDragEnable ? "grab" : "default";
+}
+
+
+function mapOnLoad()
+{
+  mapElem = document.getElementById("smap");
+
+  var slink = window.location.href;
+  var spos;
+  if ((spos = slink.indexOf("#")) >= 0)
+  {
+    var eid = unescape(slink.substr(spos + 1).toLowerCase()).trim();
+    var nelem = document.getElementById(eid);
+    if (nelem)
+    {
+      setTimeout(function()
+      {
+        mapSetPosToElem(nelem);
+        mapSetActiveLocation(eid);
+      },
+      50);
+    }
+  }
+
+  mapAddEventListener("slabels", "change", mapUpdateLabelVisibility);
+  mapAddEventListener("slocation", "change", mapGotoLocation);
+  mapAddEventListener("spanning", "change", mapUpdateDragPan);
+  mapAddEventListener("smap", "mousedown", mapDragStartPan);
+  document.addEventListener("mousemove", mapDragMoveHandler);
+  document.addEventListener("mouseup", mapDragUpHandler);
+
+  mapUpdateLabelVisibility();
+  mapUpdateDragPan();
+}
--- a/world/Makefile	Sun Jan 28 02:32:53 2024 +0200
+++ b/world/Makefile	Mon Jan 29 00:25:14 2024 +0200
@@ -30,7 +30,7 @@
 	$(addsuffix .ansi,$(WORLD_MAPS)) \
 	$(addsuffix .png,$(WORLD_MAPS)) \
 	$(addsuffix .htm,$(WORLD_MAPS) $(EXTRA_WORLD_MAPS)) \
-	util.js changelog.txt
+	worldmap.js changelog.txt
 
 LOCFILES = $(addsuffix .loc,$(WORLD_MAPS) $(EXTRA_WORLD_MAPS)) special.loc limbo.loc
 EXTRA_MAP_UPLOAD += $(addsuffix .map,$(WORLD_MAPS) $(EXTRA_WORLD_MAPS))