geomui 0.5.55 → 0.5.57

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (39) hide show
  1. package/dist/Drawing.svelte +131 -180
  2. package/dist/Drawing.svelte.d.ts +6 -24
  3. package/dist/DrawingList.svelte +20 -28
  4. package/dist/DrawingList.svelte.d.ts +3 -18
  5. package/dist/InputParams.svelte +107 -115
  6. package/dist/InputParams.svelte.d.ts +5 -25
  7. package/dist/LabelCheckbox.svelte +11 -11
  8. package/dist/LocStorRead.svelte +13 -7
  9. package/dist/LocStorRead.svelte.d.ts +3 -18
  10. package/dist/LocStorTable.svelte +20 -14
  11. package/dist/LocStorTable.svelte.d.ts +3 -18
  12. package/dist/LocStorWrite.svelte +10 -19
  13. package/dist/LocStorWrite.svelte.d.ts +3 -18
  14. package/dist/ModalDiag.svelte +22 -8
  15. package/dist/ModalDiag.svelte.d.ts +5 -27
  16. package/dist/ModalImg.svelte +6 -3
  17. package/dist/ModalImg.svelte.d.ts +3 -18
  18. package/dist/OneDesign.svelte +8 -4
  19. package/dist/OneDesign.svelte.d.ts +3 -18
  20. package/dist/ParamDrawExport.svelte +103 -37
  21. package/dist/ParamDrawExport.svelte.d.ts +3 -18
  22. package/dist/SimpleDrawing.svelte +67 -50
  23. package/dist/SimpleDrawing.svelte.d.ts +6 -24
  24. package/dist/SubDesign.svelte +15 -12
  25. package/dist/SubDesign.svelte.d.ts +6 -21
  26. package/dist/TimeControl.svelte +17 -10
  27. package/dist/TimeControl.svelte.d.ts +3 -18
  28. package/dist/ZoomControl.svelte +11 -21
  29. package/dist/ZoomControl.svelte.d.ts +4 -19
  30. package/dist/initStore.js +12 -11
  31. package/dist/stateDrawing.svelte.d.ts +8 -0
  32. package/dist/stateDrawing.svelte.js +8 -0
  33. package/dist/stateParams.svelte.d.ts +5 -0
  34. package/dist/stateParams.svelte.js +3 -0
  35. package/package.json +20 -20
  36. package/dist/drawingLayers.d.ts +0 -2
  37. package/dist/drawingLayers.js +0 -6
  38. package/dist/storePVal.d.ts +0 -5
  39. package/dist/storePVal.js +0 -4
@@ -1,11 +1,16 @@
1
1
  <script lang="ts">
2
2
  import LocStorTable from './LocStorTable.svelte';
3
- //import { browser } from '$app/environment';
4
3
 
5
- export let pageName: string;
6
- export let storeName: string;
4
+ // props
5
+ interface Props {
6
+ pageName: string;
7
+ storeName: string;
8
+ }
9
+ let { pageName, storeName = $bindable() }: Props = $props();
10
+
11
+ // state
12
+ let localKeys: string[] = $state([]);
7
13
 
8
- let localKeys: string[] = [];
9
14
  // create a default key name
10
15
  function defaultName(prefix: string) {
11
16
  const re1 = /[-:]/g;
@@ -20,20 +25,7 @@
20
25
  }
21
26
  storeName = defaultName(pageName);
22
27
  // check if the key already exist
23
- let warn = false;
24
- function checkWarning(iname: string) {
25
- warn = localKeys.includes(iname);
26
- //console.log(`dbg040: ${warn}`);
27
- }
28
- function validInput(eve: Event) {
29
- const storeName2 = (eve.target as HTMLInputElement).value;
30
- //const storeName2 = storeName;
31
- //console.log(`dbg162: ${storeName2}`);
32
- //warn = localKeys.includes(storeName2);
33
- checkWarning(storeName2);
34
- }
35
- // modify input
36
- $: checkWarning(storeName);
28
+ let warn: boolean = $derived(localKeys.includes(storeName));
37
29
  </script>
38
30
 
39
31
  <LocStorTable {pageName} bind:storeName bind:localKeys />
@@ -47,7 +39,6 @@
47
39
  minlength="4"
48
40
  maxlength="30"
49
41
  size="32"
50
- on:input={validInput}
51
42
  />
52
43
  {#if warn}
53
44
  <p class="warnMsg">Warning: name {storeName} already used</p>
@@ -1,21 +1,6 @@
1
- interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
2
- new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
3
- $$bindings?: Bindings;
4
- } & Exports;
5
- (internal: unknown, props: Props & {
6
- $$events?: Events;
7
- $$slots?: Slots;
8
- }): Exports & {
9
- $set?: any;
10
- $on?: any;
11
- };
12
- z_$$bindings?: Bindings;
13
- }
14
- declare const LocStorWrite: $$__sveltets_2_IsomorphicComponent<{
1
+ declare const LocStorWrite: import("svelte").Component<{
15
2
  pageName: string;
16
3
  storeName: string;
17
- }, {
18
- [evt: string]: CustomEvent<any>;
19
- }, {}, {}, string>;
20
- type LocStorWrite = InstanceType<typeof LocStorWrite>;
4
+ }, {}, "storeName">;
5
+ type LocStorWrite = ReturnType<typeof LocStorWrite>;
21
6
  export default LocStorWrite;
@@ -1,14 +1,28 @@
1
- <script lang="ts" context="module">
1
+ <script lang="ts" module>
2
2
  type tOkFunc = () => void;
3
3
  export type { tOkFunc };
4
4
  </script>
5
5
 
6
6
  <script lang="ts">
7
- export let okName = 'Ok';
8
- export let okFunc: tOkFunc;
9
- export let modalOpen: boolean;
10
- export let sizeLarge = false;
7
+ import type { Snippet } from 'svelte';
11
8
 
9
+ // props
10
+ interface Props {
11
+ okName?: string;
12
+ okFunc: tOkFunc;
13
+ modalOpen: boolean;
14
+ sizeLarge?: boolean;
15
+ children: Snippet;
16
+ }
17
+ let {
18
+ okName = 'Ok',
19
+ okFunc,
20
+ modalOpen = $bindable(),
21
+ sizeLarge = false,
22
+ children
23
+ }: Props = $props();
24
+
25
+ // actions
12
26
  function mCancel() {
13
27
  modalOpen = false;
14
28
  }
@@ -22,11 +36,11 @@
22
36
  <aside class="backdrop">
23
37
  <div class="dialog" class:sizeLarge>
24
38
  <article class="question">
25
- <slot />
39
+ {@render children()}
26
40
  </article>
27
41
  <footer>
28
- <button class="cancel" on:click={mCancel}>Cancel</button>
29
- <button class="ok" on:click={mOk}>{okName}</button>
42
+ <button class="cancel" onclick={mCancel}>Cancel</button>
43
+ <button class="ok" onclick={mOk}>{okName}</button>
30
44
  </footer>
31
45
  </div>
32
46
  </aside>
@@ -1,34 +1,12 @@
1
1
  type tOkFunc = () => void;
2
2
  export type { tOkFunc };
3
- interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
4
- new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
5
- $$bindings?: Bindings;
6
- } & Exports;
7
- (internal: unknown, props: Props & {
8
- $$events?: Events;
9
- $$slots?: Slots;
10
- }): Exports & {
11
- $set?: any;
12
- $on?: any;
13
- };
14
- z_$$bindings?: Bindings;
15
- }
16
- type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
17
- default: any;
18
- } ? Props extends Record<string, never> ? any : {
19
- children?: any;
20
- } : {});
21
- declare const ModalDiag: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
3
+ import type { Snippet } from 'svelte';
4
+ declare const ModalDiag: import("svelte").Component<{
22
5
  okName?: string;
23
6
  okFunc: tOkFunc;
24
7
  modalOpen: boolean;
25
8
  sizeLarge?: boolean;
26
- }, {
27
- default: {};
28
- }>, {
29
- [evt: string]: CustomEvent<any>;
30
- }, {
31
- default: {};
32
- }, {}, string>;
33
- type ModalDiag = InstanceType<typeof ModalDiag>;
9
+ children: Snippet;
10
+ }, {}, "modalOpen">;
11
+ type ModalDiag = ReturnType<typeof ModalDiag>;
34
12
  export default ModalDiag;
@@ -1,6 +1,9 @@
1
1
  <script lang="ts">
2
- export let svgPath: string;
3
- export let modalOpen: boolean;
2
+ interface Props {
3
+ svgPath: string;
4
+ modalOpen: boolean;
5
+ }
6
+ let { svgPath, modalOpen = $bindable() }: Props = $props();
4
7
 
5
8
  function mCancel() {
6
9
  modalOpen = false;
@@ -10,7 +13,7 @@
10
13
  {#if modalOpen}
11
14
  <aside class="backdrop">
12
15
  <div class="dialog">
13
- <button on:click={mCancel}>
16
+ <button onclick={mCancel}>
14
17
  <img src={svgPath} alt={svgPath} />
15
18
  </button>
16
19
  </div>
@@ -1,21 +1,6 @@
1
- interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
2
- new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
3
- $$bindings?: Bindings;
4
- } & Exports;
5
- (internal: unknown, props: Props & {
6
- $$events?: Events;
7
- $$slots?: Slots;
8
- }): Exports & {
9
- $set?: any;
10
- $on?: any;
11
- };
12
- z_$$bindings?: Bindings;
13
- }
14
- declare const ModalImg: $$__sveltets_2_IsomorphicComponent<{
1
+ declare const ModalImg: import("svelte").Component<{
15
2
  svgPath: string;
16
3
  modalOpen: boolean;
17
- }, {
18
- [evt: string]: CustomEvent<any>;
19
- }, {}, {}, string>;
20
- type ModalImg = InstanceType<typeof ModalImg>;
4
+ }, {}, "modalOpen">;
5
+ type ModalImg = ReturnType<typeof ModalImg>;
21
6
  export default ModalImg;
@@ -1,14 +1,18 @@
1
1
  <script lang="ts">
2
2
  import type { tPageDef, tAllLink } from 'geometrix';
3
-
4
3
  import { incrStore } from './initStore';
5
4
  import DrawingList from './DrawingList.svelte';
6
5
  import ParamDrawExport from './ParamDrawExport.svelte';
7
6
 
8
- export let pageDef: tPageDef;
9
- export let pLink: tAllLink;
7
+ // props
8
+ interface Props {
9
+ pageDef: tPageDef;
10
+ pLink: tAllLink;
11
+ }
12
+ let { pageDef, pLink }: Props = $props();
10
13
 
11
- $: incrStore(pageDef);
14
+ // initialization
15
+ incrStore(pageDef);
12
16
  </script>
13
17
 
14
18
  <h1>{pageDef.pTitle}</h1>
@@ -1,22 +1,7 @@
1
1
  import type { tPageDef, tAllLink } from 'geometrix';
2
- interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
3
- new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
4
- $$bindings?: Bindings;
5
- } & Exports;
6
- (internal: unknown, props: Props & {
7
- $$events?: Events;
8
- $$slots?: Slots;
9
- }): Exports & {
10
- $set?: any;
11
- $on?: any;
12
- };
13
- z_$$bindings?: Bindings;
14
- }
15
- declare const OneDesign: $$__sveltets_2_IsomorphicComponent<{
2
+ declare const OneDesign: import("svelte").Component<{
16
3
  pageDef: tPageDef;
17
4
  pLink: tAllLink;
18
- }, {
19
- [evt: string]: CustomEvent<any>;
20
- }, {}, {}, string>;
21
- type OneDesign = InstanceType<typeof OneDesign>;
5
+ }, {}, "">;
6
+ type OneDesign = ReturnType<typeof OneDesign>;
22
7
  export default OneDesign;
@@ -1,6 +1,13 @@
1
1
  <script lang="ts">
2
- //import type { tParamDef, tGeomFunc, tSubDesign, tAllLink, tCanvasAdjust } from 'geometrix';
3
- import type { tParamDef, tGeomFunc, tSubDesign, tAllLink } from 'geometrix';
2
+ import type {
3
+ tParamDef,
4
+ tGeomFunc,
5
+ tSubDesign,
6
+ tAllLink,
7
+ tFigures,
8
+ Figure,
9
+ tGeom
10
+ } from 'geometrix';
4
11
  import {
5
12
  EFormat,
6
13
  fileBinContent,
@@ -8,17 +15,25 @@
8
15
  fileSuffix,
9
16
  fileMime,
10
17
  fileBin,
11
- adjustZero
18
+ mergeFaces
12
19
  } from 'geometrix';
13
20
  import InputParams from './InputParams.svelte';
14
21
  import Drawing from './Drawing.svelte';
15
22
  import SubDesign from './SubDesign.svelte';
16
- import { storePV } from './storePVal';
23
+ import { sParams } from './stateParams.svelte';
24
+
25
+ // properties
26
+ interface Props {
27
+ pDef: tParamDef;
28
+ fgeom: tGeomFunc;
29
+ pLink: tAllLink;
30
+ }
31
+ let { pDef, fgeom, pLink }: Props = $props();
17
32
 
18
- export let pDef: tParamDef;
19
- export let fgeom: tGeomFunc;
20
- export let pLink: tAllLink;
33
+ // const
34
+ const c_ParametrixAll = 'ParametrixAll';
21
35
 
36
+ // helper function
22
37
  function checkWarn(txt: string) {
23
38
  let rWarn = true;
24
39
  const re = /warn/i;
@@ -27,33 +42,57 @@
27
42
  }
28
43
  return rWarn;
29
44
  }
30
- let optFaces: string[] = [];
31
- let exportFace: string;
32
- let selFace: string;
33
- let simTime = 0;
34
- let zAdjust = adjustZero();
35
- // log and paramChange
36
- let logValue = 'Dummy initial\nWill be replaced during onMount\n';
37
- let calcErr = false;
38
- let calcWarn = false;
39
- let subD: tSubDesign = {};
40
- function paramChange2(iPageName: string, iSimTime: number) {
41
- const mydate = new Date().toLocaleTimeString();
42
- logValue = `Geometry ${iPageName} computed at ${mydate}\n`;
43
- const geome = fgeom(iSimTime, $storePV[pDef.partName]);
44
- logValue += geome.logstr;
45
- calcErr = geome.calcErr;
46
- calcWarn = checkWarn(geome.logstr);
47
- optFaces = Object.keys(geome.fig);
48
- exportFace = 'zip';
49
- //geomRedraw(iSimTime);
50
- subD = geome.sub;
45
+ // create pFig
46
+ function checkFace(iFaces: string[], iFace: string): string {
47
+ let rFace = iFace;
48
+ if (iFaces.length === 0) {
49
+ console.log(`warn404: Drawing has an empty face list`);
50
+ } else {
51
+ //rFace = iFaces[0];
52
+ const FaceList2 = iFaces.slice();
53
+ FaceList2.push(c_ParametrixAll);
54
+ if (!FaceList2.includes(rFace)) {
55
+ //console.log(`warn403: Drawing has an invalid face ${rFace}`);
56
+ rFace = iFaces[0];
57
+ }
58
+ }
59
+ //console.log(iFaces);
60
+ //console.log(`dbg097: rFace ${rFace}`);
61
+ return rFace;
51
62
  }
52
- function paramChange() {
53
- paramChange2(pDef.partName, simTime);
63
+ function selectFig(iFigures: tFigures, iFace: string) {
64
+ let rFig: Figure;
65
+ const FigListKeys = Object.keys(iFigures);
66
+ const sFace = checkFace(FigListKeys, iFace);
67
+ if (FigListKeys.includes(sFace)) {
68
+ rFig = iFigures[sFace];
69
+ } else {
70
+ rFig = mergeFaces(iFigures);
71
+ }
72
+ return rFig;
54
73
  }
55
- $: paramChange2(pDef.partName, simTime); // for reactivity on page change and simTime
56
- // export drawings
74
+
75
+ // state
76
+ let simTime: number = $state(0);
77
+ let selFace: string = $state(checkFace(Object.keys(fgeom(0, sParams[pDef.partName]).fig), ''));
78
+ // internal state that should not need state
79
+ let exportFace: string = $state('zip'); // TODO5 keep state otherwise svelte complains
80
+
81
+ // derived
82
+ let geome: tGeom = $derived(fgeom(simTime, sParams[pDef.partName]));
83
+ let logValue: string = $derived.by(() => {
84
+ const mydate = new Date().toLocaleTimeString();
85
+ let rLogValue = `Geometry ${pDef.partName} computed at ${mydate}\n`;
86
+ rLogValue += geome.logstr;
87
+ return rLogValue;
88
+ });
89
+ let optFaces: string[] = $derived(Object.keys(geome.fig));
90
+ let calcErr: boolean = $derived(geome.calcErr);
91
+ let calcWarn: boolean = $derived(checkWarn(geome.logstr));
92
+ let pFig: Figure = $derived(selectFig(geome.fig, selFace));
93
+ let subD: tSubDesign = $derived(geome.sub);
94
+
95
+ // actions: export drawings
57
96
  function download_binFile(fName: string, fContent: Blob) {
58
97
  //create temporary an invisible element
59
98
  const elem_a_download = document.createElement('a');
@@ -128,7 +167,7 @@
128
167
  const fContent = await fileBinContent(
129
168
  fgeom,
130
169
  simTime,
131
- $storePV[pDef.partName],
170
+ sParams[pDef.partName],
132
171
  pDef,
133
172
  exportFormat
134
173
  );
@@ -136,7 +175,7 @@
136
175
  } else {
137
176
  const fContent = fileTextContent(
138
177
  fgeom,
139
- $storePV[pDef.partName],
178
+ sParams[pDef.partName],
140
179
  pDef,
141
180
  nFace,
142
181
  exportFormat
@@ -149,7 +188,7 @@
149
188
  }
150
189
  </script>
151
190
 
152
- <InputParams {pDef} on:paramChg={paramChange} {fgeom} {selFace} {zAdjust} {simTime} />
191
+ <InputParams {pDef} {pFig} />
153
192
  <section>
154
193
  <h2>Log</h2>
155
194
  <textarea
@@ -162,7 +201,18 @@
162
201
  class:colorWarn={calcWarn}
163
202
  ></textarea>
164
203
  </section>
165
- <Drawing {pDef} {fgeom} {optFaces} bind:selFace bind:zAdjust bind:simTime />
204
+ <section>
205
+ <h2>
206
+ Drawing
207
+ <select bind:value={selFace}>
208
+ {#each optFaces as optFace}
209
+ <option value={optFace}>{optFace}</option>
210
+ {/each}
211
+ <option value={c_ParametrixAll}>All faces merged</option>
212
+ </select>
213
+ </h2>
214
+ </section>
215
+ <Drawing pDefSim={pDef.sim} {pFig} bind:simTime />
166
216
  <section>
167
217
  <h2>Export</h2>
168
218
  <select bind:value={exportFace}>
@@ -181,7 +231,7 @@
181
231
  <option value="freecad">all faces as Freecad.py</option>
182
232
  <option value="zip">all faces and more as zip</option>
183
233
  </select>
184
- <button on:click={downloadExport2}>Save to File</button>
234
+ <button onclick={downloadExport2}>Save to File</button>
185
235
  <SubDesign {subD} origPartName={pDef.partName} {pLink} />
186
236
  </section>
187
237
 
@@ -198,6 +248,22 @@ section > h2 {
198
248
  margin: 1rem 0.5rem 0;
199
249
  }
200
250
 
251
+ section > h2 > select {
252
+ /*display: inline-block;*/
253
+ height: 1.6rem;
254
+ /*width: 1.6rem;*/
255
+ color: darkBlue;
256
+ font-size: 0.8rem;
257
+ font-weight: 400;
258
+ padding: 0.2rem 0.4rem 0.2rem;
259
+ border-style: solid;
260
+ border-width: 0.1rem;
261
+ border-radius: 0.2rem;
262
+ border-color: darkBlue;
263
+ margin: 0.5rem;
264
+ background-color: lightBlue;
265
+ }
266
+
201
267
  section > textarea {
202
268
  /*resize: horizontal;*/
203
269
  margin-left: 0.5rem;
@@ -1,23 +1,8 @@
1
1
  import type { tParamDef, tGeomFunc, tAllLink } from 'geometrix';
2
- interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
3
- new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
4
- $$bindings?: Bindings;
5
- } & Exports;
6
- (internal: unknown, props: Props & {
7
- $$events?: Events;
8
- $$slots?: Slots;
9
- }): Exports & {
10
- $set?: any;
11
- $on?: any;
12
- };
13
- z_$$bindings?: Bindings;
14
- }
15
- declare const ParamDrawExport: $$__sveltets_2_IsomorphicComponent<{
2
+ declare const ParamDrawExport: import("svelte").Component<{
16
3
  pDef: tParamDef;
17
4
  fgeom: tGeomFunc;
18
5
  pLink: tAllLink;
19
- }, {
20
- [evt: string]: CustomEvent<any>;
21
- }, {}, {}, string>;
22
- type ParamDrawExport = InstanceType<typeof ParamDrawExport>;
6
+ }, {}, "">;
7
+ type ParamDrawExport = ReturnType<typeof ParamDrawExport>;
23
8
  export default ParamDrawExport;
@@ -1,69 +1,86 @@
1
1
  <script lang="ts">
2
- //import { colors } from 'geometrix';
3
- import type { tCanvasAdjust, tLayers, Figure, tParamVal, tGeomFunc } from 'geometrix';
4
- import { copyLayers, mergeFaces } from 'geometrix';
5
- import { storePV } from './storePVal';
6
- import { dLayers } from './drawingLayers';
7
- import { onMount } from 'svelte';
2
+ import type { tCanvasAdjust, tLayers, Figure } from 'geometrix';
3
+ import { adjustMini, copyLayers } from 'geometrix';
4
+ import { sDraw } from './stateDrawing.svelte';
8
5
 
9
- export let pageName: string;
10
- export let fgeom: tGeomFunc;
11
- export let selFace: string;
12
- export let zAdjust: tCanvasAdjust;
13
- export let simTime = 0;
6
+ // props
7
+ interface Props {
8
+ pFig: Figure;
9
+ full: boolean;
10
+ }
11
+ let { pFig, full }: Props = $props();
14
12
 
15
- let canvasMini: HTMLCanvasElement;
13
+ // const
16
14
  const canvas_size_mini = 200;
15
+ const scaleFactor = 0.6;
16
+
17
+ // internal state: no need of reactivity with $state()
18
+ let canvasMini: HTMLCanvasElement;
17
19
 
18
20
  // Canavas Figures
19
- let mAdjust: tCanvasAdjust;
20
- function canvasRedrawMini(aFigure: Figure, iLayers: tLayers) {
21
+ function canvasRedrawMini(
22
+ aFigure: Figure,
23
+ iZAdjust: tCanvasAdjust,
24
+ iCZwidth: number,
25
+ iLayers: tLayers
26
+ ) {
21
27
  const sLayers = copyLayers(iLayers);
22
28
  sLayers.ruler = false;
23
- const ctx1 = canvasMini.getContext('2d')!;
24
- ctx1.clearRect(0, 0, ctx1.canvas.width, ctx1.canvas.height);
25
- try {
26
- if (zAdjust.init === 0) {
27
- // mini-full with zAdjust set to adjustZero()
28
- mAdjust = aFigure.getAdjustFull(ctx1.canvas.width, ctx1.canvas.height);
29
- } else {
30
- mAdjust = zAdjust;
29
+ let mAdjust: tCanvasAdjust;
30
+ if (canvasMini) {
31
+ const ctx1 = canvasMini.getContext('2d')!;
32
+ ctx1.clearRect(0, 0, ctx1.canvas.width, ctx1.canvas.height);
33
+ const c1w = ctx1.canvas.width;
34
+ try {
35
+ if (full) {
36
+ // mini-full with zAdjust set to adjustZero()
37
+ mAdjust = aFigure.getAdjustFull(ctx1.canvas.width, ctx1.canvas.height);
38
+ } else {
39
+ mAdjust = adjustMini(iCZwidth, c1w, iZAdjust);
40
+ }
41
+ aFigure.draw(ctx1, mAdjust, sLayers);
42
+ } catch (emsg) {
43
+ //rGeome.logstr += emsg;
44
+ console.log(emsg);
31
45
  }
32
- aFigure.draw(ctx1, mAdjust, sLayers);
33
- } catch (emsg) {
34
- //rGeome.logstr += emsg;
35
- console.log(emsg);
46
+ // extra drawing
47
+ //point(5, 5).draw(ctx1, mAdjust, 'green');
48
+ //point(5, 15).draw(ctx1, mAdjust, 'blue', 'rectangle');
36
49
  }
37
- // extra drawing
38
- //point(5, 5).draw(ctx1, mAdjust, 'green');
39
- //point(5, 15).draw(ctx1, mAdjust, 'blue', 'rectangle');
40
50
  }
41
- let domInit = 0;
42
- function geomRedraw(iSimTime: number, ipVal: tParamVal, iFace: string, iLayers: tLayers) {
43
- const FigList = fgeom(iSimTime, ipVal).fig;
44
- if (Object.keys(FigList).includes(iFace)) {
45
- const aFigure = FigList[iFace];
46
- canvasRedrawMini(aFigure, iLayers);
47
- } else {
48
- const aFigure = mergeFaces(FigList);
49
- canvasRedrawMini(aFigure, iLayers);
50
- }
51
- }
52
- onMount(() => {
53
- // initial drawing
54
- geomRedraw(simTime, $storePV[pageName], selFace, $dLayers);
55
- domInit = 1;
56
- //paramChange();
51
+ // reactivity
52
+ $effect(() => {
53
+ canvasRedrawMini(pFig, sDraw.zAdjust, sDraw.canvasZWidth, sDraw.dLayers);
57
54
  });
58
- // reactivity on simTime and $storePV
59
- $: {
60
- if (domInit === 1) {
61
- geomRedraw(simTime, $storePV[pageName], selFace, $dLayers);
55
+ // actions
56
+ function clickQuater(eve: MouseEvent) {
57
+ const mouseX = eve.offsetX;
58
+ const mouseY = eve.offsetY;
59
+ const ctx1 = canvasMini.getContext('2d')!;
60
+ const quaterX = ctx1.canvas.width / 2;
61
+ const quaterY = ctx1.canvas.height / 2;
62
+ if (eve.button === 0) {
63
+ // pressing the main button
64
+ let quaterID = 1;
65
+ if (mouseX > quaterX) {
66
+ quaterID += 1 * scaleFactor;
67
+ }
68
+ if (mouseY > quaterY) {
69
+ quaterID += 2 * scaleFactor;
70
+ }
71
+ ctx1.canvas.width = quaterID * canvas_size_mini;
72
+ ctx1.canvas.height = quaterID * canvas_size_mini;
73
+ canvasRedrawMini(pFig, sDraw.zAdjust, sDraw.canvasZWidth, sDraw.dLayers);
62
74
  }
63
75
  }
64
76
  </script>
65
77
 
66
- <canvas class="mini" width={canvas_size_mini} height={canvas_size_mini} bind:this={canvasMini}
78
+ <canvas
79
+ class="mini"
80
+ width={canvas_size_mini}
81
+ height={canvas_size_mini}
82
+ bind:this={canvasMini}
83
+ onclick={clickQuater}
67
84
  ></canvas>
68
85
 
69
86
  <style>/*
@@ -1,25 +1,7 @@
1
- import type { tCanvasAdjust, tGeomFunc } from 'geometrix';
2
- interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
3
- new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
4
- $$bindings?: Bindings;
5
- } & Exports;
6
- (internal: unknown, props: Props & {
7
- $$events?: Events;
8
- $$slots?: Slots;
9
- }): Exports & {
10
- $set?: any;
11
- $on?: any;
12
- };
13
- z_$$bindings?: Bindings;
14
- }
15
- declare const SimpleDrawing: $$__sveltets_2_IsomorphicComponent<{
16
- pageName: string;
17
- fgeom: tGeomFunc;
18
- selFace: string;
19
- zAdjust: tCanvasAdjust;
20
- simTime?: number;
21
- }, {
22
- [evt: string]: CustomEvent<any>;
23
- }, {}, {}, string>;
24
- type SimpleDrawing = InstanceType<typeof SimpleDrawing>;
1
+ import type { Figure } from 'geometrix';
2
+ declare const SimpleDrawing: import("svelte").Component<{
3
+ pFig: Figure;
4
+ full: boolean;
5
+ }, {}, "">;
6
+ type SimpleDrawing = ReturnType<typeof SimpleDrawing>;
25
7
  export default SimpleDrawing;