geomui 0.5.55 → 0.5.56
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.
- package/dist/Drawing.svelte +131 -180
- package/dist/Drawing.svelte.d.ts +6 -24
- package/dist/DrawingList.svelte +20 -28
- package/dist/DrawingList.svelte.d.ts +3 -18
- package/dist/InputParams.svelte +107 -115
- package/dist/InputParams.svelte.d.ts +5 -25
- package/dist/LabelCheckbox.svelte +11 -11
- package/dist/LocStorRead.svelte +13 -7
- package/dist/LocStorRead.svelte.d.ts +3 -18
- package/dist/LocStorTable.svelte +20 -14
- package/dist/LocStorTable.svelte.d.ts +3 -18
- package/dist/LocStorWrite.svelte +10 -19
- package/dist/LocStorWrite.svelte.d.ts +3 -18
- package/dist/ModalDiag.svelte +21 -8
- package/dist/ModalDiag.svelte.d.ts +5 -27
- package/dist/ModalImg.svelte +6 -3
- package/dist/ModalImg.svelte.d.ts +3 -18
- package/dist/OneDesign.svelte +8 -4
- package/dist/OneDesign.svelte.d.ts +3 -18
- package/dist/ParamDrawExport.svelte +103 -37
- package/dist/ParamDrawExport.svelte.d.ts +3 -18
- package/dist/SimpleDrawing.svelte +67 -50
- package/dist/SimpleDrawing.svelte.d.ts +6 -24
- package/dist/SubDesign.svelte +15 -12
- package/dist/SubDesign.svelte.d.ts +6 -21
- package/dist/TimeControl.svelte +17 -10
- package/dist/TimeControl.svelte.d.ts +3 -18
- package/dist/ZoomControl.svelte +11 -21
- package/dist/ZoomControl.svelte.d.ts +4 -19
- package/dist/initStore.js +12 -11
- package/dist/stateDrawing.svelte.d.ts +8 -0
- package/dist/stateDrawing.svelte.js +8 -0
- package/dist/stateParams.svelte.d.ts +5 -0
- package/dist/stateParams.svelte.js +3 -0
- package/package.json +19 -19
- package/dist/drawingLayers.d.ts +0 -2
- package/dist/drawingLayers.js +0 -6
- package/dist/storePVal.d.ts +0 -5
- package/dist/storePVal.js +0 -4
package/dist/LocStorWrite.svelte
CHANGED
|
@@ -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
|
-
|
|
6
|
-
|
|
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 =
|
|
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
|
-
|
|
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
|
-
|
|
19
|
-
}, {}, {}, string>;
|
|
20
|
-
type LocStorWrite = InstanceType<typeof LocStorWrite>;
|
|
4
|
+
}, {}, "storeName">;
|
|
5
|
+
type LocStorWrite = ReturnType<typeof LocStorWrite>;
|
|
21
6
|
export default LocStorWrite;
|
package/dist/ModalDiag.svelte
CHANGED
|
@@ -1,14 +1,27 @@
|
|
|
1
|
-
<script lang="ts"
|
|
1
|
+
<script lang="ts" module>
|
|
2
|
+
import type { Snippet } from 'svelte';
|
|
2
3
|
type tOkFunc = () => void;
|
|
3
4
|
export type { tOkFunc };
|
|
4
5
|
</script>
|
|
5
6
|
|
|
6
7
|
<script lang="ts">
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
8
|
+
// props
|
|
9
|
+
interface Props {
|
|
10
|
+
okName?: string;
|
|
11
|
+
okFunc: tOkFunc;
|
|
12
|
+
modalOpen: boolean;
|
|
13
|
+
sizeLarge?: boolean;
|
|
14
|
+
children: Snippet;
|
|
15
|
+
}
|
|
16
|
+
let {
|
|
17
|
+
okName = 'Ok',
|
|
18
|
+
okFunc,
|
|
19
|
+
modalOpen = $bindable(),
|
|
20
|
+
sizeLarge = false,
|
|
21
|
+
children
|
|
22
|
+
}: Props = $props();
|
|
11
23
|
|
|
24
|
+
// actions
|
|
12
25
|
function mCancel() {
|
|
13
26
|
modalOpen = false;
|
|
14
27
|
}
|
|
@@ -22,11 +35,11 @@
|
|
|
22
35
|
<aside class="backdrop">
|
|
23
36
|
<div class="dialog" class:sizeLarge>
|
|
24
37
|
<article class="question">
|
|
25
|
-
|
|
38
|
+
{@render children()}
|
|
26
39
|
</article>
|
|
27
40
|
<footer>
|
|
28
|
-
<button class="cancel"
|
|
29
|
-
<button class="ok"
|
|
41
|
+
<button class="cancel" onclick={mCancel}>Cancel</button>
|
|
42
|
+
<button class="ok" onclick={mOk}>{okName}</button>
|
|
30
43
|
</footer>
|
|
31
44
|
</div>
|
|
32
45
|
</aside>
|
|
@@ -1,34 +1,12 @@
|
|
|
1
|
+
import type { Snippet } from 'svelte';
|
|
1
2
|
type tOkFunc = () => void;
|
|
2
3
|
export type { tOkFunc };
|
|
3
|
-
|
|
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<{
|
|
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
|
-
|
|
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;
|
package/dist/ModalImg.svelte
CHANGED
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
<script lang="ts">
|
|
2
|
-
|
|
3
|
-
|
|
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
|
|
16
|
+
<button onclick={mCancel}>
|
|
14
17
|
<img src={svgPath} alt={svgPath} />
|
|
15
18
|
</button>
|
|
16
19
|
</div>
|
|
@@ -1,21 +1,6 @@
|
|
|
1
|
-
|
|
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
|
-
|
|
19
|
-
}, {}, {}, string>;
|
|
20
|
-
type ModalImg = InstanceType<typeof ModalImg>;
|
|
4
|
+
}, {}, "modalOpen">;
|
|
5
|
+
type ModalImg = ReturnType<typeof ModalImg>;
|
|
21
6
|
export default ModalImg;
|
package/dist/OneDesign.svelte
CHANGED
|
@@ -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
|
-
|
|
9
|
-
|
|
7
|
+
// props
|
|
8
|
+
interface Props {
|
|
9
|
+
pageDef: tPageDef;
|
|
10
|
+
pLink: tAllLink;
|
|
11
|
+
}
|
|
12
|
+
let { pageDef, pLink }: Props = $props();
|
|
10
13
|
|
|
11
|
-
|
|
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
|
-
|
|
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
|
-
|
|
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
|
-
|
|
3
|
-
|
|
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
|
-
|
|
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 {
|
|
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
|
-
|
|
19
|
-
|
|
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
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
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
|
|
53
|
-
|
|
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
|
-
|
|
56
|
-
//
|
|
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
|
-
|
|
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
|
-
|
|
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}
|
|
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
|
-
<
|
|
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
|
|
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
|
-
|
|
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
|
-
|
|
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
|
-
|
|
3
|
-
import
|
|
4
|
-
import {
|
|
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
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
6
|
+
// props
|
|
7
|
+
interface Props {
|
|
8
|
+
pFig: Figure;
|
|
9
|
+
full: boolean;
|
|
10
|
+
}
|
|
11
|
+
let { pFig, full }: Props = $props();
|
|
14
12
|
|
|
15
|
-
|
|
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
|
-
|
|
20
|
-
|
|
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
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
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
|
-
|
|
33
|
-
|
|
34
|
-
//
|
|
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
|
-
|
|
42
|
-
|
|
43
|
-
|
|
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
|
-
//
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
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
|
|
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 {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
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;
|