geomui 0.5.4

package/dist/ZoomControl.svelte

@@ -0,0 +1,106 @@
+<script>import { createEventDispatcher } from "svelte";
+const dispatch = createEventDispatcher();
+function theClick(actionName) {
+  dispatch("myevent", {
+    action: actionName
+  });
+}
+</script>
+
+<nav>
+	<button on:click={() => theClick('zoomInit')}><div class="zero" /></button>
+	<button on:click={() => theClick('zoomIn')}><div class="zoomin" /></button>
+	<button on:click={() => theClick('zoomOut')}><div class="zoomout" /></button>
+	<button on:click={() => theClick('moveLeft')}><div class="arrowleft" /></button>
+	<button on:click={() => theClick('moveRight')}><div class="arrowright" /></button>
+	<button on:click={() => theClick('moveUp')}><div class="arrowup" /></button>
+	<button on:click={() => theClick('moveDown')}><div class="arrowdown" /></button>
+</nav>
+
+<style>/*
+$canvas-point: grey;
+
+// export to js
+:export {
+	colorCanvasPoint: $canvas-point;
+}
+*/
+nav > button {
+  height: 2rem;
+  width: 2rem;
+  border-style: solid;
+  border-width: 0.1rem;
+  border-radius: 0.2rem;
+  border-color: darkGreen;
+  margin: 0.1rem;
+  background-color: lightGreen;
+}
+
+nav > button > div.zero {
+  height: 0.8rem;
+  width: 0.8rem;
+  border-style: solid;
+  border-width: 0.3rem;
+  border-radius: 1rem;
+  border-color: darkGreen;
+  margin: auto;
+  background-color: transparent;
+}
+
+nav > button > div.zoomin {
+  height: 0.8rem;
+  width: 0.8rem;
+  border-style: solid;
+  border-width: 0.3rem;
+  border-radius: 0;
+  border-color: grey;
+  margin: auto;
+  background-color: darkGreen;
+}
+
+nav > button > div.zoomout {
+  height: 0.8rem;
+  width: 0.8rem;
+  border-style: solid;
+  border-width: 0.3rem;
+  border-radius: 0;
+  border-color: darkGreen;
+  margin: auto;
+  background-color: grey;
+}
+
+nav > button > div.arrowleft {
+  width: 0;
+  height: 0;
+  border-top: 0.7rem solid transparent;
+  border-bottom: 0.7rem solid transparent;
+  border-right: 1.26rem solid darkGreen;
+  margin: auto;
+}
+
+nav > button > div.arrowright {
+  width: 0;
+  height: 0;
+  border-top: 0.7rem solid transparent;
+  border-bottom: 0.7rem solid transparent;
+  border-left: 1.26rem solid darkGreen;
+  margin: auto;
+}
+
+nav > button > div.arrowup {
+  width: 0;
+  height: 0;
+  border-left: 0.7rem solid transparent;
+  border-right: 0.7rem solid transparent;
+  border-bottom: 1.26rem solid darkGreen;
+  margin: auto;
+}
+
+nav > button > div.arrowdown {
+  width: 0;
+  height: 0;
+  border-left: 0.7rem solid transparent;
+  border-right: 0.7rem solid transparent;
+  border-top: 1.26rem solid darkGreen;
+  margin: auto;
+}</style>

package/dist/ZoomControl.svelte.d.ts

@@ -0,0 +1,16 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: Record<string, never>;
+    events: {
+        myevent: CustomEvent<any>;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type ZoomControlProps = typeof __propDef.props;
+export type ZoomControlEvents = typeof __propDef.events;
+export type ZoomControlSlots = typeof __propDef.slots;
+export default class ZoomControl extends SvelteComponent<ZoomControlProps, ZoomControlEvents, ZoomControlSlots> {
+}
+export {};

package/dist/downloadParams.d.ts

@@ -0,0 +1,4 @@
+import type { tParamVal } from 'geometrix';
+declare function downloadParams(iPartName: string, idparams: tParamVal, iComment: string): void;
+declare function generateUrl(ihref: string, idparams: tParamVal, iLenghtLimit: boolean): string;
+export { downloadParams, generateUrl };

package/dist/downloadParams.js

@@ -0,0 +1,42 @@
+// downloadParams.ts
+import { createParamFile } from 'geometrix';
+function download_file(file_name, file_content) {
+    //create temporary an invisible element
+    const elem_a_download = document.createElement('a');
+    elem_a_download.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(file_content));
+    elem_a_download.setAttribute('download', file_name);
+    //document.body.appendChild(elem_a_download); // it does not seem required to append the element to the DOM to use it
+    elem_a_download.click();
+    //document.body.removeChild(elem_a_download);
+    elem_a_download.remove(); // Is this really required?
+}
+function downloadParams(iPartName, idparams, iComment) {
+    const re1 = /[-:]/g;
+    const re2 = /\..*$/;
+    const datestr = new Date().toISOString().replace(re1, '').replace(re2, '').replace('T', '_');
+    const file_name = `px_${iPartName}_${datestr}.json`;
+    const file_content = createParamFile(datestr, idparams, iComment);
+    download_file(file_name, file_content);
+    //console.log(`dbg343: ${file_name}`);
+}
+function generateUrl(ihref, idparams, iLenghtLimit) {
+    const url1 = new URL(ihref);
+    const strLengthLimit = 2000;
+    let strLength = url1.toString().length;
+    for (const ky of Object.keys(idparams)) {
+        //const val = ffix(idparams[ky]);
+        const val = idparams[ky].toString();
+        const nLen = 2 + ky.length + val.length;
+        if (!iLenghtLimit || strLength + nLen < strLengthLimit) {
+            url1.searchParams.append(encodeURIComponent(ky), encodeURIComponent(val));
+        }
+        strLength += nLen;
+        //strLength = url1.toString().length;
+        //console.log(`dbg546: strLength ${strLength} and strLengthLimit ${strLengthLimit}`);
+    }
+    if (strLength >= strLengthLimit) {
+        console.log(`warn547: generateUrl: strLength ${strLength} larger than strLengthLimit ${strLengthLimit}`);
+    }
+    return url1.toString();
+}
+export { downloadParams, generateUrl };

package/dist/drawingLayers.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="svelte" />
+declare const dLayers: import("svelte/store").Writable<import("geometrix").tLayers>;
+export { dLayers };

package/dist/drawingLayers.js

@@ -0,0 +1,6 @@
+// drawingLayers.ts
+//import type { tLayers } from 'geometrix';
+import { initLayers } from 'geometrix';
+import { writable } from 'svelte/store';
+const dLayers = writable(initLayers());
+export { dLayers };

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+import OneDesign from './OneDesign.svelte';
+export { OneDesign };

package/dist/index.js

@@ -0,0 +1,5 @@
+// Reexport your entry components here
+import OneDesign from './OneDesign.svelte';
+//import { initStore } from './initStore';
+//export { OneDesign, initStore };
+export { OneDesign };

package/dist/initStore.d.ts

@@ -0,0 +1,5 @@
+import type { tParamVal, tPageDef, tAllPageDef } from 'geometrix';
+declare function initStore(designDefs: tAllPageDef): void;
+declare function updateStore(iPartName: string, dParams: tParamVal, overwrite: boolean): void;
+declare function incrStore(oneDesignDef: tPageDef): void;
+export { initStore, incrStore, updateStore };

package/dist/initStore.js

@@ -0,0 +1,46 @@
+// initStore
+import { storePV } from './storePVal';
+import { get } from 'svelte/store';
+function initStore(designDefs) {
+    const iniPV = {};
+    for (const design of Object.keys(designDefs)) {
+        const designParam = {};
+        for (const param of designDefs[design].pDef.params) {
+            designParam[param.name] = param.init;
+        }
+        iniPV[design] = designParam;
+    }
+    storePV.set(iniPV);
+}
+function updateStore(iPartName, dParams, overwrite) {
+    const iniPV = get(storePV);
+    const designNames = Object.keys(iniPV);
+    if (designNames.includes(iPartName)) {
+        const inidParams = iniPV[iPartName];
+        const inidParamNames = Object.keys(inidParams);
+        for (const pa of Object.keys(dParams)) {
+            if (!inidParamNames.includes(pa)) {
+                inidParams[pa] = dParams[pa];
+            }
+            else if (overwrite) {
+                inidParams[pa] = dParams[pa];
+            }
+        }
+        iniPV[iPartName] = inidParams;
+        //console.log(`dbg781: updateStore of ${iPartName}`);
+    }
+    else {
+        iniPV[iPartName] = dParams;
+        //console.log(`dbg782: updateStore of new ${iPartName}`);
+    }
+    storePV.set(iniPV);
+}
+function incrStore(oneDesignDef) {
+    const dName = oneDesignDef.pDef.partName;
+    const dParams = {};
+    for (const param of oneDesignDef.pDef.params) {
+        dParams[param.name] = param.init;
+    }
+    updateStore(dName, dParams, false);
+}
+export { initStore, incrStore, updateStore };

package/dist/storePVal.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="svelte" />
+import type { tParamVal } from 'geometrix';
+type tStorePVal = Record<string, tParamVal>;
+declare const storePV: import("svelte/store").Writable<tStorePVal>;
+export type { tStorePVal };
+export { storePV };

package/dist/storePVal.js

@@ -0,0 +1,4 @@
+// storePVal.ts
+import { writable } from 'svelte/store';
+const storePV = writable({});
+export { storePV };

package/dist/style/colors.scss

@@ -0,0 +1,51 @@
+// colors.scss
+
+//$main: #ccccee;
+//$main: #f0f0ff;
+//$main-bg: #ffffff;
+//$main-bg: ghostwhite;
+//$main-bg: whitesmoke;
+$subdesign-bg: LightGrey;
+
+$arrow: DarkOrange;
+//$link: ForestGreen;
+
+//$indexBg: Lavender;
+//$indexSepara: DarkBlue;
+//$indexSeparaStop: LightBlue;
+
+$pde-title: grey;
+$pde-params: darkBlue;
+$pde-canvas: pink;
+$subd-title-complement: white;
+$subd-title: black;
+$subd-h4: DarkGrey;
+
+$timectrl-bg: lightBlue;
+$timectrl-sign: darkBlue;
+
+$zoom-bg: lightGreen;
+$zoom-sign: darkGreen;
+$zoom-other: grey;
+
+$modal: lightCyan;
+//$table-head: aquamarine;
+$table-head: #ddd;
+//$table-body: lightSkyBlue;
+$table-body: #eee;
+$table-line-changed: #ded;
+
+$warning-message: orange;
+$warn-calc-warning: orange;
+$warn-calc-error: violet;
+
+$mini-picture: white;
+
+/*
+$canvas-point: grey;
+
+// export to js
+:export {
+	colorCanvasPoint: $canvas-point;
+}
+*/

package/dist/style/styling.scss

@@ -0,0 +1,23 @@
+// styling.scss
+@use './colors.scss';
+
+@mixin mix-h2 {
+	color: colors.$pde-title;
+	margin: 1rem 0.5rem 0;
+}
+
+@mixin mix-button {
+	/*display: inline-block;*/
+	height: 1.6rem;
+	/*width: 1.6rem;*/
+	color: colors.$timectrl-sign;
+	font-size: 0.8rem;
+	font-weight: 400;
+	padding: 0.2rem 0.4rem 0.2rem;
+	border-style: solid;
+	border-width: 0.1rem;
+	border-radius: 0.2rem;
+	border-color: colors.$timectrl-sign;
+	margin: 0.5rem;
+	background-color: colors.$timectrl-bg;
+}

package/package.json

@@ -0,0 +1,66 @@
+{
+	"name": "geomui",
+	"version": "0.5.4",
+	"description": "The svelte-library of the webapp-UI of Parametrix",
+	"scripts": {
+		"dev": "vite dev",
+		"build": "vite build && npm run package",
+		"preview": "vite preview",
+		"package": "svelte-kit sync && svelte-package && publint",
+		"prepublishOnly": "npm run package",
+		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
+		"test:unit": "vitest",
+		"test:unit:once": "vitest --run",
+		"lint": "prettier --check . && eslint .",
+		"ci": "run-s build lint check test:unit:once",
+		"format": "prettier --write .",
+		"clean": "shx rm -fr .svelte-kit build node_modules dist"
+	},
+	"exports": {
+		".": {
+			"types": "./dist/index.d.ts",
+			"svelte": "./dist/index.js"
+		}
+	},
+	"files": [
+		"dist",
+		"!dist/**/*.test.*",
+		"!dist/**/*.spec.*"
+	],
+	"peerDependencies": {
+		"@sveltejs/kit": "^2.0.3",
+		"svelte": "^4.0.0"
+	},
+	"dependencies": {
+		"designix": "^0.5.2",
+		"geometrix": "^0.5.1"
+	},
+	"devDependencies": {
+		"@sveltejs/adapter-auto": "^3.0.1",
+		"@sveltejs/adapter-static": "^3.0.1",
+		"@sveltejs/kit": "^2.0.6",
+		"@sveltejs/package": "^2.2.5",
+		"@sveltejs/vite-plugin-svelte": "^3.0.1",
+		"@typescript-eslint/eslint-plugin": "^6.16.0",
+		"@typescript-eslint/parser": "^6.16.0",
+		"eslint": "^8.56.0",
+		"eslint-config-prettier": "^9.1.0",
+		"eslint-plugin-svelte": "^2.35.1",
+		"npm-run-all": "^4.1.5",
+		"prettier": "^3.1.1",
+		"prettier-plugin-svelte": "^3.1.2",
+		"publint": "^0.2.7",
+		"sass": "^1.69.6",
+		"shx": "^0.3.4",
+		"svelte": "^4.2.8",
+		"svelte-check": "^3.6.2",
+		"tslib": "^2.6.2",
+		"typescript": "^5.3.3",
+		"vite": "^5.0.10",
+		"vitest": "^1.1.0"
+	},
+	"svelte": "./dist/index.js",
+	"types": "./dist/index.d.ts",
+	"type": "module"
+}