migrating all util files from js to ts

src/utils/commonUtils.ts

@@ -0,0 +1,320 @@
+import { distanceSquared } from "./functionUtils";
+import { rand } from "./probabilityUtils";
+import { rn } from "./numberUtils";
+import { last } from "./arrayUtils";
+
+/**
+ * Clip polygon points to graph boundaries
+ * @param points - Array of points [[x1, y1], [x2, y2], ...]
+ * @param graphWidth - Width of the graph
+ * @param graphHeight - Height of the graph
+ * @param secure - Secure clipping to avoid edge artifacts
+ * @returns Clipped polygon points
+ */
+export const clipPoly = (points: [number, number][], graphWidth: number, graphHeight: number, secure: number = 0) => {
+  if (points.length < 2) return points;
+  if (points.some(point => point === undefined)) {
+    window.ERROR && console.error("Undefined point in clipPoly", points);
+    return points;
+  }
+
+  return window.polygonclip(points, [0, 0, graphWidth, graphHeight], secure);
+}
+
+/**
+ * Get segment of any point on polyline
+ * @param points - Array of points defining the polyline
+ * @param point - The point to find the segment for
+ * @param step - Step size for segment search (default is 10)
+ * @returns The segment ID (1-indexed)
+ */
+export const getSegmentId = (points: [number, number][], point: [number, number], step: number = 10): number => {
+  if (points.length === 2) return 1;
+
+  let minSegment = 1;
+  let minDist = Infinity;
+
+  for (let i = 0; i < points.length - 1; i++) {
+    const p1 = points[i];
+    const p2 = points[i + 1];
+
+    const length = Math.sqrt(distanceSquared(p1, p2));
+    const segments = Math.ceil(length / step);
+    const dx = (p2[0] - p1[0]) / segments;
+    const dy = (p2[1] - p1[1]) / segments;
+
+    for (let s = 0; s < segments; s++) {
+      const x = p1[0] + s * dx;
+      const y = p1[1] + s * dy;
+      const dist = distanceSquared(point, [x, y]);
+
+      if (dist >= minDist) continue;
+      minDist = dist;
+      minSegment = i + 1;
+    }
+  }
+
+  return minSegment;
+}
+
+/**
+ * Creates a debounced function that delays invoking func until after ms milliseconds have elapsed
+ * @param func - The function to debounce
+ * @param ms - The number of milliseconds to delay
+ * @returns The debounced function
+ */
+export const debounce = <T extends (...args: any[]) => any>(func: T, ms: number) => {
+  let isCooldown = false;
+
+  return function (this: any, ...args: Parameters<T>) {
+    if (isCooldown) return;
+    func.apply(this, args);
+    isCooldown = true;
+    setTimeout(() => (isCooldown = false), ms);
+  };
+}
+
+/**
+ * Creates a throttled function that only invokes func at most once every ms milliseconds
+ * @param func - The function to throttle
+ * @param ms - The number of milliseconds to throttle invocations to
+ * @returns The throttled function
+ */
+export const throttle = <T extends (...args: any[]) => any>(func: T, ms: number) => {
+  let isThrottled = false;
+  let savedArgs: any[] | null = null;
+  let savedThis: any = null;
+
+  function wrapper(this: any, ...args: Parameters<T>) {
+    if (isThrottled) {
+      savedArgs = args;
+      savedThis = this;
+      return;
+    }
+
+    func.apply(this, args);
+    isThrottled = true;
+
+    setTimeout(function () {
+      isThrottled = false;
+      if (savedArgs) {
+        wrapper.apply(savedThis, savedArgs as Parameters<T>);
+        savedArgs = savedThis = null;
+      }
+    }, ms);
+  }
+
+  return wrapper;
+}
+
+/**
+ * Parse error to get the readable string in Chrome and Firefox
+ * @param error - The error object to parse
+ * @returns Formatted error string with HTML formatting
+ */
+export const parseError = (error: Error): string => {
+  const isFirefox = navigator.userAgent.toLowerCase().indexOf("firefox") > -1;
+  const errorString = isFirefox ? error.toString() + " " + error.stack : error.stack || "";
+  const regex = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/gi;
+  const errorNoURL = errorString.replace(regex, url => "<i>" + last(url.split("/")) + "</i>");
+  const errorParsed = errorNoURL.replace(/at /gi, "<br>&nbsp;&nbsp;at ");
+  return errorParsed;
+}
+
+/**
+ * Convert a URL to base64 encoded data
+ * @param url - The URL to convert
+ * @param callback - Callback function that receives the base64 data
+ */
+export const getBase64 = (url: string, callback: (result: string | ArrayBuffer | null) => void): void => {
+  const xhr = new XMLHttpRequest();
+  xhr.onload = function () {
+    const reader = new FileReader();
+    reader.onloadend = function () {
+      callback(reader.result);
+    };
+    reader.readAsDataURL(xhr.response);
+  };
+  xhr.open("GET", url);
+  xhr.responseType = "blob";
+  xhr.send();
+}
+
+/**
+ * Open URL in a new tab or window
+ * @param url - The URL to open
+ */
+export const openURL = (url: string): void => {
+  window.open(url, "_blank");
+}
+
+/**
+ * Open project wiki-page
+ * @param page - The wiki page name/path to open
+ */
+export const wiki = (page: string): void => {
+  window.open("https://github.com/Azgaar/Fantasy-Map-Generator/wiki/" + page, "_blank");
+}
+
+/**
+ * Wrap URL into html a element
+ * @param URL - The URL for the link
+ * @param description - The link text/description
+ * @returns HTML anchor element as a string
+ */
+export const link = (URL: string, description: string): string => {
+  return `<a href="${URL}" rel="noopener" target="_blank">${description}</a>`;
+}
+
+/**
+ * Check if Ctrl key (or Cmd on Mac) was pressed during an event
+ * @param event - The keyboard or mouse event
+ * @returns True if Ctrl/Cmd was pressed
+ */
+export const isCtrlClick = (event: MouseEvent | KeyboardEvent): boolean => {
+  // meta key is cmd key on MacOs
+  return event.ctrlKey || event.metaKey;
+}
+
+/**
+ * Generate a random date within a specified range
+ * @param from - Start year (default is 100)
+ * @param to - End year (default is 1000)
+ * @returns Formatted date string
+ */
+export const generateDate = (from: number = 100, to: number = 1000): string => {
+  return new Date(rand(from, to), rand(12), rand(31)).toLocaleDateString("en", {
+    year: "numeric",
+    month: "long",
+    day: "numeric"
+  });
+}
+
+/**
+ * Convert x coordinate to longitude
+ * @param x - The x coordinate
+ * @param mapCoordinates - Map coordinates object with lonW and lonT properties
+ * @param graphWidth - Width of the graph
+ * @param decimals - Number of decimal places (default is 2)
+ * @returns Longitude value
+ */
+export const getLongitude = (x: number, mapCoordinates: any, graphWidth: number, decimals: number = 2): number => {
+  return rn(mapCoordinates.lonW + (x / graphWidth) * mapCoordinates.lonT, decimals);
+}
+
+/**
+ * Convert y coordinate to latitude
+ * @param y - The y coordinate
+ * @param mapCoordinates - Map coordinates object with latN and latT properties
+ * @param graphHeight - Height of the graph
+ * @param decimals - Number of decimal places (default is 2)
+ * @returns Latitude value
+ */
+export const getLatitude = (y: number, mapCoordinates: any, graphHeight: number, decimals: number = 2): number => {
+  return rn(mapCoordinates.latN - (y / graphHeight) * mapCoordinates.latT, decimals);
+}
+
+/**
+ * Convert x,y coordinates to longitude,latitude
+ * @param x - The x coordinate
+ * @param y - The y coordinate
+ * @param mapCoordinates - Map coordinates object
+ * @param graphWidth - Width of the graph
+ * @param graphHeight - Height of the graph
+ * @param decimals - Number of decimal places (default is 2)
+ * @returns Array with [longitude, latitude]
+ */
+export const getCoordinates = (x: number, y: number, mapCoordinates: any, graphWidth: number, graphHeight: number, decimals: number = 2): [number, number] => {
+  return [getLongitude(x, mapCoordinates, graphWidth, decimals), getLatitude(y, mapCoordinates, graphHeight, decimals)];
+}
+
+/**
+ * Prompt options interface
+ */
+export interface PromptOptions {
+  default: number | string;
+  step?: number;
+  min?: number;
+  max?: number;
+  required?: boolean;
+}
+
+/**
+ * Initialize custom prompt function (prompt does not work in Electron)
+ * This should be called once when the DOM is ready
+ */
+export const initializePrompt = (): void => {
+  const prompt = document.getElementById("prompt");
+  if (!prompt) return;
+  
+  const form = prompt.querySelector("#promptForm");
+  if (!form) return;
+
+  const defaultText = "Please provide an input";
+  const defaultOptions: PromptOptions = {default: 1, step: 0.01, min: 0, max: 100, required: true};
+
+  (window as any).prompt = function (promptText: string = defaultText, options: PromptOptions = defaultOptions, callback?: (value: number | string) => void) {
+    if (options.default === undefined)
+      return window.ERROR && console.error("Prompt: options object does not have default value defined");
+
+    const input = prompt.querySelector("#promptInput") as HTMLInputElement;
+    const promptTextElement = prompt.querySelector("#promptText") as HTMLElement;
+    
+    if (!input || !promptTextElement) return;
+    
+    promptTextElement.innerHTML = promptText;
+
+    const type = typeof options.default === "number" ? "number" : "text";
+    input.type = type;
+
+    if (options.step !== undefined) input.step = options.step.toString();
+    if (options.min !== undefined) input.min = options.min.toString();
+    if (options.max !== undefined) input.max = options.max.toString();
+
+    input.required = options.required === false ? false : true;
+    input.placeholder = "type a " + type;
+    input.value = options.default.toString();
+    input.style.width = promptText.length > 10 ? "100%" : "auto";
+    prompt.style.display = "block";
+
+    form.addEventListener(
+      "submit",
+      (event: Event) => {
+        event.preventDefault();
+        prompt.style.display = "none";
+        const v = type === "number" ? +input.value : input.value;
+        if (callback) callback(v);
+      },
+      {once: true}
+    );
+  };
+
+  const cancel = prompt.querySelector("#promptCancel");
+  if (cancel) {
+    cancel.addEventListener("click", () => {
+      prompt.style.display = "none";
+    });
+  }
+}
+
+declare global {
+  interface Window {
+    ERROR: boolean;
+    polygonclip: any;
+    
+    clipPoly: typeof clipPoly;
+    getSegmentId: typeof getSegmentId;
+    debounce: typeof debounce;
+    throttle: typeof throttle;
+    parseError: typeof parseError;
+    getBase64: typeof getBase64;
+    openURL: typeof openURL;
+    wiki: typeof wiki;
+    link: typeof link;
+    isCtrlClick: typeof isCtrlClick;
+    generateDate: typeof generateDate;
+    getLongitude: typeof getLongitude;
+    getLatitude: typeof getLatitude;
+    getCoordinates: typeof getCoordinates;
+  }
+}