@versatiles/svelte 1.1.2 → 2.0.1
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/components/BasicMap/BasicMap.svelte +4 -4
- package/dist/components/BasicMap/BasicMap.svelte.d.ts +2 -2
- package/dist/components/MapEditor/MapEditor.svelte +16 -3
- package/dist/components/MapEditor/components/Editor.svelte +56 -40
- package/dist/components/MapEditor/components/Editor.svelte.d.ts +1 -1
- package/dist/components/MapEditor/components/EditorFill.svelte +42 -12
- package/dist/components/MapEditor/components/EditorStroke.svelte +43 -13
- package/dist/components/MapEditor/components/EditorSymbol.svelte +105 -34
- package/dist/components/MapEditor/components/InputRow.svelte +34 -0
- package/dist/components/MapEditor/components/InputRow.svelte.d.ts +9 -0
- package/dist/components/MapEditor/components/Sidebar.svelte +119 -109
- package/dist/components/MapEditor/components/SidebarPanel.svelte +101 -0
- package/dist/components/MapEditor/components/SidebarPanel.svelte.d.ts +10 -0
- package/dist/components/MapEditor/components/SymbolSelector.svelte +7 -15
- package/dist/components/MapEditor/lib/element/abstract.d.ts +4 -4
- package/dist/components/MapEditor/lib/element/abstract.js +2 -2
- package/dist/components/MapEditor/lib/element/line.d.ts +3 -4
- package/dist/components/MapEditor/lib/element/line.js +0 -1
- package/dist/components/MapEditor/lib/element/marker.d.ts +4 -4
- package/dist/components/MapEditor/lib/element/polygon.d.ts +3 -3
- package/dist/components/MapEditor/lib/geometry_manager.d.ts +20 -10
- package/dist/components/MapEditor/lib/geometry_manager.js +42 -52
- package/dist/components/MapEditor/lib/map_layer/abstract.d.ts +2 -2
- package/dist/components/MapEditor/lib/map_layer/fill.d.ts +4 -3
- package/dist/components/MapEditor/lib/map_layer/fill.js +9 -17
- package/dist/components/MapEditor/lib/map_layer/line.d.ts +4 -3
- package/dist/components/MapEditor/lib/map_layer/line.js +15 -26
- package/dist/components/MapEditor/lib/map_layer/symbol.d.ts +5 -4
- package/dist/components/MapEditor/lib/map_layer/symbol.js +28 -46
- package/dist/components/MapEditor/lib/state/constants.d.ts +4 -0
- package/dist/components/MapEditor/lib/state/constants.js +22 -0
- package/dist/components/MapEditor/lib/state/manager.d.ts +17 -0
- package/dist/components/MapEditor/lib/state/manager.js +87 -0
- package/dist/components/MapEditor/lib/state/reader.d.ts +21 -14
- package/dist/components/MapEditor/lib/state/reader.js +259 -142
- package/dist/components/MapEditor/lib/state/types.d.ts +27 -12
- package/dist/components/MapEditor/lib/state/writer.d.ts +18 -14
- package/dist/components/MapEditor/lib/state/writer.js +182 -169
- package/dist/components/MapEditor/lib/utils.d.ts +2 -5
- package/dist/components/MapEditor/lib/utils.js +0 -19
- package/package.json +19 -19
@@ -1,17 +1,24 @@
|
|
1
|
-
import type {
|
1
|
+
import type { StateElementLine, StateElementMarker, StateElementPolygon, StateRoot, StateStyle } from './types.js';
|
2
2
|
export declare class StateReader {
|
3
|
-
|
4
|
-
|
5
|
-
constructor(
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
3
|
+
bits: boolean[];
|
4
|
+
offset: number;
|
5
|
+
constructor(bits: boolean[]);
|
6
|
+
static fromBase64(text: string): StateReader;
|
7
|
+
static fromBitString(text: string): StateReader;
|
8
|
+
ended(): boolean;
|
9
|
+
readBit(): boolean;
|
10
|
+
readInteger(bits: number, signed?: true): number;
|
11
|
+
read6pack(): number;
|
12
|
+
readVarint(signed?: true): number;
|
13
|
+
readArray<T>(cb: () => T): T[];
|
14
|
+
readPoint(level?: number): [number, number];
|
15
|
+
readPoints(level?: number): [number, number][];
|
16
|
+
readRoot(): StateRoot;
|
17
|
+
readMap(): NonNullable<StateRoot['map']>;
|
18
|
+
readElementMarker(): StateElementMarker;
|
19
|
+
readElementLine(): StateElementLine;
|
20
|
+
readElementPolygon(): StateElementPolygon;
|
21
|
+
readStyle(): StateStyle;
|
15
22
|
readColor(): string;
|
16
|
-
|
23
|
+
readString(): string;
|
17
24
|
}
|
@@ -1,164 +1,281 @@
|
|
1
1
|
import { Color } from '@versatiles/style';
|
2
|
-
import {
|
2
|
+
import { BASE64_CODE2BITS, CHAR_VALUE2CODE } from './constants.js';
|
3
3
|
export class StateReader {
|
4
|
-
|
4
|
+
bits;
|
5
5
|
offset = 0;
|
6
|
-
constructor(
|
7
|
-
|
8
|
-
|
6
|
+
constructor(bits) {
|
7
|
+
this.bits = bits;
|
8
|
+
}
|
9
|
+
static fromBase64(text) {
|
10
|
+
const bits = [];
|
11
|
+
for (let i = 0; i < text.length; i++) {
|
12
|
+
const charCode = text.charCodeAt(i);
|
13
|
+
const charBits = BASE64_CODE2BITS[charCode];
|
14
|
+
if (!charBits) {
|
15
|
+
throw new Error(`Invalid character in base64 string: ${text[i]}`);
|
16
|
+
}
|
17
|
+
bits.push(...charBits);
|
9
18
|
}
|
10
|
-
|
11
|
-
|
19
|
+
return new StateReader(bits);
|
20
|
+
}
|
21
|
+
static fromBitString(text) {
|
22
|
+
return new StateReader(text.split('').map((c) => c === '1'));
|
23
|
+
}
|
24
|
+
ended() {
|
25
|
+
return this.offset >= this.bits.length;
|
26
|
+
}
|
27
|
+
readBit() {
|
28
|
+
if (this.ended())
|
29
|
+
throw new Error('End of bits');
|
30
|
+
return this.bits[this.offset++];
|
31
|
+
}
|
32
|
+
readInteger(bits, signed) {
|
33
|
+
try {
|
34
|
+
let value = 0;
|
35
|
+
for (let i = 0; i < bits; i++) {
|
36
|
+
value <<= 1;
|
37
|
+
if (this.readBit())
|
38
|
+
value += 1;
|
39
|
+
}
|
40
|
+
if (signed && value >= 1 << (bits - 1)) {
|
41
|
+
value -= 1 << bits;
|
42
|
+
}
|
43
|
+
return value;
|
12
44
|
}
|
13
|
-
|
14
|
-
throw new
|
45
|
+
catch (cause) {
|
46
|
+
throw new Error(`Error reading integer`, { cause });
|
15
47
|
}
|
16
48
|
}
|
17
|
-
|
18
|
-
|
19
|
-
|
49
|
+
read6pack() {
|
50
|
+
let value = 0;
|
51
|
+
for (let i = 0; i < 6; i++) {
|
52
|
+
value <<= 1;
|
53
|
+
if (this.bits[this.offset++])
|
54
|
+
value += 1;
|
20
55
|
}
|
21
|
-
return
|
56
|
+
return value;
|
22
57
|
}
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
58
|
+
readVarint(signed) {
|
59
|
+
try {
|
60
|
+
let value = 0;
|
61
|
+
let offset = 0;
|
62
|
+
do {
|
63
|
+
value += this.readInteger(5) << offset;
|
64
|
+
offset += 5;
|
65
|
+
} while (this.readBit());
|
66
|
+
if (!signed)
|
67
|
+
return value;
|
68
|
+
return value & 1 ? -((value >> 1) + 1) : value >> 1;
|
69
|
+
}
|
70
|
+
catch (cause) {
|
71
|
+
throw new Error(`Error reading readVarint`, { cause });
|
72
|
+
}
|
34
73
|
}
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
74
|
+
readArray(cb) {
|
75
|
+
try {
|
76
|
+
const length = this.readVarint();
|
77
|
+
const array = [];
|
78
|
+
for (let i = 0; i < length; i++)
|
79
|
+
array.push(cb());
|
80
|
+
return array;
|
39
81
|
}
|
40
|
-
|
41
|
-
|
82
|
+
catch (cause) {
|
83
|
+
throw new Error(`Error reading array`, { cause });
|
42
84
|
}
|
43
85
|
}
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
switch (key) {
|
68
|
-
case 10:
|
69
|
-
state.map = this.readObject();
|
70
|
-
break;
|
71
|
-
case 11:
|
72
|
-
state.style = this.readObject();
|
73
|
-
break;
|
74
|
-
case 12:
|
75
|
-
state.strokeStyle = this.readObject();
|
76
|
-
break;
|
77
|
-
case 20:
|
78
|
-
{
|
79
|
-
const length = this.readUnsignedInteger();
|
80
|
-
state.elements = Array.from({ length }, () => this.readObject());
|
81
|
-
}
|
82
|
-
break;
|
83
|
-
case 30:
|
84
|
-
state.point = [this.readSignedInteger() / 1e5, this.readSignedInteger() / 1e5];
|
85
|
-
break;
|
86
|
-
case 31:
|
87
|
-
{
|
88
|
-
const count = this.readUnsignedInteger();
|
89
|
-
const x = this.readDifferential(count);
|
90
|
-
const y = this.readDifferential(count);
|
91
|
-
state.points = Array.from({ length: count }, (_, i) => [x[i] / 1e5, y[i] / 1e5]);
|
92
|
-
}
|
93
|
-
break;
|
94
|
-
case 40:
|
95
|
-
state.color = this.readColor();
|
96
|
-
break;
|
97
|
-
case 50:
|
98
|
-
state.type = this.readType();
|
99
|
-
break;
|
100
|
-
case 60:
|
101
|
-
state.label = this.readString();
|
102
|
-
break;
|
103
|
-
case 70:
|
104
|
-
state.halo = this.readUnsignedInteger() / 10;
|
105
|
-
break;
|
106
|
-
case 71:
|
107
|
-
state.opacity = this.readUnsignedInteger() / 100;
|
108
|
-
break;
|
109
|
-
case 72:
|
110
|
-
state.pattern = this.readUnsignedInteger();
|
111
|
-
break;
|
112
|
-
case 73:
|
113
|
-
state.rotate = this.readSignedInteger();
|
114
|
-
break;
|
115
|
-
case 74:
|
116
|
-
state.size = this.readUnsignedInteger() / 10;
|
117
|
-
break;
|
118
|
-
case 75:
|
119
|
-
state.width = this.readUnsignedInteger() / 10;
|
120
|
-
break;
|
121
|
-
case 76:
|
122
|
-
state.zoom = this.readUnsignedInteger() / 20;
|
123
|
-
break;
|
124
|
-
case 77:
|
125
|
-
state.align = this.readUnsignedInteger();
|
126
|
-
break;
|
127
|
-
case 90:
|
128
|
-
state.visible = this.readBoolean();
|
129
|
-
break;
|
130
|
-
default:
|
131
|
-
throw new Error(`Invalid state key: ${key}`);
|
86
|
+
readPoint(level = 14) {
|
87
|
+
try {
|
88
|
+
const scale = Math.pow(2, level + 2);
|
89
|
+
return [
|
90
|
+
this.readInteger(level + 11, true) / scale,
|
91
|
+
this.readInteger(level + 10, true) / scale
|
92
|
+
];
|
93
|
+
}
|
94
|
+
catch (cause) {
|
95
|
+
throw new Error(`Error reading point`, { cause });
|
96
|
+
}
|
97
|
+
}
|
98
|
+
readPoints(level = 14) {
|
99
|
+
try {
|
100
|
+
const length = this.readVarint();
|
101
|
+
const scale = Math.pow(2, -level - 2);
|
102
|
+
let x = 0;
|
103
|
+
let y = 0;
|
104
|
+
const points = [];
|
105
|
+
for (let i = 0; i < length; i++) {
|
106
|
+
x += this.readVarint(true);
|
107
|
+
y += this.readVarint(true);
|
108
|
+
points[i] = [x * scale, y * scale];
|
132
109
|
}
|
110
|
+
return points;
|
111
|
+
}
|
112
|
+
catch (cause) {
|
113
|
+
throw new Error(`Error reading points`, { cause });
|
133
114
|
}
|
134
|
-
return state;
|
135
115
|
}
|
136
|
-
|
137
|
-
|
138
|
-
|
139
|
-
|
140
|
-
|
141
|
-
|
142
|
-
|
143
|
-
|
144
|
-
|
116
|
+
readRoot() {
|
117
|
+
try {
|
118
|
+
const root = { elements: [] };
|
119
|
+
const version = this.readInteger(3);
|
120
|
+
if (version != 0) {
|
121
|
+
throw new Error(`Unsupported version: ${version}`);
|
122
|
+
}
|
123
|
+
// Read the map element
|
124
|
+
if (this.readBit()) {
|
125
|
+
root.map = this.readMap();
|
126
|
+
}
|
127
|
+
// Read the metadata
|
128
|
+
if (this.readBit()) {
|
129
|
+
throw new Error(`Metadata not supported yet`);
|
130
|
+
}
|
131
|
+
// Read the elements
|
132
|
+
while (true) {
|
133
|
+
let key;
|
134
|
+
try {
|
135
|
+
key = this.readInteger(3);
|
136
|
+
}
|
137
|
+
catch (_) {
|
138
|
+
key = 0;
|
139
|
+
}
|
140
|
+
switch (key) {
|
141
|
+
case 0:
|
142
|
+
return root;
|
143
|
+
case 1:
|
144
|
+
root.elements.push(this.readElementMarker());
|
145
|
+
break;
|
146
|
+
case 2:
|
147
|
+
root.elements.push(this.readElementLine());
|
148
|
+
break;
|
149
|
+
case 3:
|
150
|
+
root.elements.push(this.readElementPolygon());
|
151
|
+
break;
|
152
|
+
default:
|
153
|
+
console.warn(`Unknown state key: ${key}`);
|
154
|
+
}
|
155
|
+
}
|
156
|
+
}
|
157
|
+
catch (cause) {
|
158
|
+
throw new Error(`Error reading root`, { cause });
|
159
|
+
}
|
160
|
+
}
|
161
|
+
readMap() {
|
162
|
+
try {
|
163
|
+
const zoom = this.readInteger(10) / 32;
|
164
|
+
const center = this.readPoint(Math.ceil(zoom));
|
165
|
+
return { zoom, center };
|
166
|
+
}
|
167
|
+
catch (cause) {
|
168
|
+
throw new Error(`Error reading map`, { cause });
|
169
|
+
}
|
170
|
+
}
|
171
|
+
readElementMarker() {
|
172
|
+
try {
|
173
|
+
const element = { type: 'marker', point: this.readPoint() };
|
174
|
+
if (this.readBit())
|
175
|
+
element.style = this.readStyle();
|
176
|
+
return element;
|
177
|
+
}
|
178
|
+
catch (cause) {
|
179
|
+
throw new Error(`Error reading marker element`, { cause });
|
180
|
+
}
|
181
|
+
}
|
182
|
+
readElementLine() {
|
183
|
+
try {
|
184
|
+
const element = { type: 'line', points: this.readPoints() };
|
185
|
+
if (this.readBit())
|
186
|
+
element.style = this.readStyle();
|
187
|
+
return element;
|
188
|
+
}
|
189
|
+
catch (cause) {
|
190
|
+
throw new Error(`Error reading line element`, { cause });
|
191
|
+
}
|
192
|
+
}
|
193
|
+
readElementPolygon() {
|
194
|
+
try {
|
195
|
+
const element = { type: 'polygon', points: this.readPoints() };
|
196
|
+
if (this.readBit())
|
197
|
+
element.style = this.readStyle();
|
198
|
+
if (this.readBit())
|
199
|
+
element.strokeStyle = this.readStyle();
|
200
|
+
return element;
|
201
|
+
}
|
202
|
+
catch (cause) {
|
203
|
+
throw new Error(`Error reading polygon element`, { cause });
|
204
|
+
}
|
205
|
+
}
|
206
|
+
readStyle() {
|
207
|
+
try {
|
208
|
+
const style = {};
|
209
|
+
while (true) {
|
210
|
+
const key = this.readInteger(4);
|
211
|
+
switch (key) {
|
212
|
+
case 0:
|
213
|
+
return style;
|
214
|
+
case 1:
|
215
|
+
style.halo = this.readVarint() / 10;
|
216
|
+
break;
|
217
|
+
case 2:
|
218
|
+
style.opacity = this.readVarint() / 100;
|
219
|
+
break;
|
220
|
+
case 3:
|
221
|
+
style.pattern = this.readVarint();
|
222
|
+
break;
|
223
|
+
case 4:
|
224
|
+
style.rotate = this.readVarint(true);
|
225
|
+
break;
|
226
|
+
case 5:
|
227
|
+
style.size = this.readVarint() / 10;
|
228
|
+
break;
|
229
|
+
case 6:
|
230
|
+
style.width = this.readVarint() / 10;
|
231
|
+
break;
|
232
|
+
case 7:
|
233
|
+
style.align = this.readVarint();
|
234
|
+
break;
|
235
|
+
case 8:
|
236
|
+
style.color = this.readColor();
|
237
|
+
break;
|
238
|
+
case 9:
|
239
|
+
style.label = this.readString();
|
240
|
+
break;
|
241
|
+
case 10:
|
242
|
+
style.visible = false;
|
243
|
+
break;
|
244
|
+
default:
|
245
|
+
throw new Error(`Invalid state key: ${key}`);
|
246
|
+
}
|
247
|
+
}
|
248
|
+
}
|
249
|
+
catch (cause) {
|
250
|
+
throw new Error(`Error reading style`, { cause });
|
145
251
|
}
|
146
|
-
return values;
|
147
252
|
}
|
148
253
|
readColor() {
|
149
|
-
|
150
|
-
|
151
|
-
|
152
|
-
|
153
|
-
|
154
|
-
|
155
|
-
|
156
|
-
|
157
|
-
|
158
|
-
|
159
|
-
|
160
|
-
|
161
|
-
|
254
|
+
try {
|
255
|
+
const r = this.readInteger(8);
|
256
|
+
const g = this.readInteger(8);
|
257
|
+
const b = this.readInteger(8);
|
258
|
+
let a = 1;
|
259
|
+
if (this.readBit())
|
260
|
+
a = this.readInteger(8) / 255;
|
261
|
+
return new Color.RGB(r, g, b, a).asHex();
|
262
|
+
}
|
263
|
+
catch (cause) {
|
264
|
+
throw new Error(`Error reading color`, { cause });
|
265
|
+
}
|
266
|
+
}
|
267
|
+
readString() {
|
268
|
+
try {
|
269
|
+
const length = this.readVarint();
|
270
|
+
const charCodes = [];
|
271
|
+
for (let i = 0; i < length; i++) {
|
272
|
+
const value = this.readVarint();
|
273
|
+
charCodes.push(value < 128 ? CHAR_VALUE2CODE[value] : value);
|
274
|
+
}
|
275
|
+
return String.fromCharCode(...charCodes);
|
276
|
+
}
|
277
|
+
catch (cause) {
|
278
|
+
throw new Error(`Error reading string`, { cause });
|
162
279
|
}
|
163
280
|
}
|
164
281
|
}
|
@@ -1,21 +1,36 @@
|
|
1
|
-
export interface
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
elements
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
type
|
11
|
-
|
1
|
+
export interface StateRoot {
|
2
|
+
map?: {
|
3
|
+
center: [number, number];
|
4
|
+
zoom: number;
|
5
|
+
};
|
6
|
+
elements: StateElement[];
|
7
|
+
}
|
8
|
+
export type StateElement = StateElementMarker | StateElementLine | StateElementPolygon;
|
9
|
+
export interface StateElementMarker {
|
10
|
+
type: 'marker';
|
11
|
+
point: [number, number];
|
12
|
+
style?: StateStyle;
|
13
|
+
}
|
14
|
+
export interface StateElementLine {
|
15
|
+
type: 'line';
|
16
|
+
points: [number, number][];
|
17
|
+
style?: StateStyle;
|
18
|
+
}
|
19
|
+
export interface StateElementPolygon {
|
20
|
+
type: 'polygon';
|
21
|
+
points: [number, number][];
|
22
|
+
style?: StateStyle;
|
23
|
+
strokeStyle?: StateStyle;
|
24
|
+
}
|
25
|
+
export interface StateStyle {
|
12
26
|
halo?: number;
|
13
27
|
opacity?: number;
|
14
28
|
pattern?: number;
|
15
29
|
rotate?: number;
|
16
30
|
size?: number;
|
17
31
|
width?: number;
|
18
|
-
zoom?: number;
|
19
32
|
align?: number;
|
33
|
+
color?: string;
|
34
|
+
label?: string;
|
20
35
|
visible?: boolean;
|
21
36
|
}
|
@@ -1,17 +1,21 @@
|
|
1
|
-
import type {
|
1
|
+
import type { StateElementLine, StateElementMarker, StateElementPolygon, StateRoot, StateStyle } from './types.js';
|
2
2
|
export declare class StateWriter {
|
3
|
-
|
4
|
-
offset: number;
|
3
|
+
bits: boolean[];
|
5
4
|
constructor();
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
5
|
+
asBase64(): string;
|
6
|
+
asBitString(): string;
|
7
|
+
writeBit(value: boolean): void;
|
8
|
+
writeInteger(value: number, bits: number): number;
|
9
|
+
writeVarint(value: number, signed?: true): void;
|
10
|
+
writeArray<T>(array: T[], cb: (v: T) => void): void;
|
11
|
+
writePoint(point: [number, number], level?: number): void;
|
12
|
+
writePoints(points: [number, number][], level?: number): void;
|
13
|
+
writeRoot(root: StateRoot): void;
|
14
|
+
writeMap(map: NonNullable<StateRoot['map']>): void;
|
15
|
+
writeElementMarker(element: StateElementMarker): StateElementMarker;
|
16
|
+
writeElementLine(element: StateElementLine): StateElementLine;
|
17
|
+
writeElementPolygon(element: StateElementPolygon): void;
|
18
|
+
writeStyle(style: StateStyle): void;
|
19
|
+
writeColor(color: string): void;
|
20
|
+
writeString(value: string): string;
|
17
21
|
}
|