@johnmorrisdotca/uchusen-rockets 0.3.0 → 0.4.0
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/CHANGELOG.md +16 -5
- package/README.md +241 -4
- package/dist/attrs.d.ts +70 -4
- package/dist/attrs.js +59 -4
- package/dist/build/glb.d.ts +25 -0
- package/dist/build/glb.js +14 -0
- package/dist/build/index.d.ts +89 -4
- package/dist/build/index.js +55 -4
- package/dist/build/lineup.d.ts +56 -2
- package/dist/build/lineup.js +23 -2
- package/dist/builder.d.ts +47 -1
- package/dist/builder.js +14 -1
- package/dist/crossfade.d.ts +44 -2
- package/dist/crossfade.js +44 -2
- package/dist/data/credits.d.ts +44 -1
- package/dist/data/credits.js +22 -1
- package/dist/data/flight-log.d.ts +33 -1
- package/dist/data/flight-log.js +22 -1
- package/dist/data/flights.d.ts +54 -2
- package/dist/data/flights.js +10 -0
- package/dist/data/makers.d.ts +21 -0
- package/dist/data/makers.js +10 -0
- package/dist/data/sources.d.ts +32 -0
- package/dist/data/sources.js +10 -0
- package/dist/data/types.d.ts +81 -1
- package/dist/data/types.js +26 -1
- package/dist/element.d.ts +61 -3
- package/dist/element.js +50 -3
- package/dist/embed.d.ts +110 -5
- package/dist/embed.js +88 -5
- package/dist/engines.d.ts +86 -4
- package/dist/engines.js +75 -4
- package/dist/fit.d.ts +68 -0
- package/dist/fit.js +13 -0
- package/dist/flight.d.ts +134 -9
- package/dist/flight.js +122 -9
- package/dist/flightbar.d.ts +12 -0
- package/dist/flightbar.js +12 -0
- package/dist/framing.d.ts +182 -8
- package/dist/framing.js +127 -6
- package/dist/layout.d.ts +65 -1
- package/dist/layout.js +43 -1
- package/dist/looks.d.ts +64 -1
- package/dist/looks.js +42 -1
- package/dist/model/materials.d.ts +32 -0
- package/dist/model/materials.js +10 -0
- package/dist/model/registry.d.ts +22 -0
- package/dist/model/registry.js +22 -0
- package/dist/parts.d.ts +33 -1
- package/dist/pixels.d.ts +44 -4
- package/dist/pixels.js +44 -4
- package/dist/react.d.ts +24 -0
- package/dist/react.js +13 -0
- package/dist/rockets.d.ts +91 -3
- package/dist/rockets.js +58 -2
- package/dist/spin.d.ts +57 -2
- package/dist/spin.js +35 -2
- package/dist/tilt.d.ts +48 -4
- package/dist/tilt.js +26 -4
- package/package.json +10 -5
package/dist/flight.d.ts
CHANGED
|
@@ -1,21 +1,92 @@
|
|
|
1
1
|
import { type Flight, type FlightPhase } from "./data/flights.ts";
|
|
2
2
|
import type { Figure } from "./data/types.ts";
|
|
3
3
|
export type { Flight, FlightBurn, FlightPhase, PartPose } from "./data/flights.ts";
|
|
4
|
-
/**
|
|
4
|
+
/**
|
|
5
|
+
* Seconds a phase takes on the screen when the timeline plays: one flight in under a minute, whatever its real length.
|
|
6
|
+
*
|
|
7
|
+
* @example
|
|
8
|
+
* ```ts
|
|
9
|
+
* import { SECONDS_PER_PHASE } from "@johnmorrisdotca/uchusen-rockets";
|
|
10
|
+
*
|
|
11
|
+
* console.log(SECONDS_PER_PHASE);
|
|
12
|
+
* ```
|
|
13
|
+
*/
|
|
5
14
|
export declare const SECONDS_PER_PHASE = 2.4;
|
|
6
|
-
/**
|
|
15
|
+
/**
|
|
16
|
+
* The flight for a rocket's variant, when a page gives one.
|
|
17
|
+
*
|
|
18
|
+
* @param rocket A rocket's id.
|
|
19
|
+
* @param variant A variant's id, or undefined.
|
|
20
|
+
* @returns The flight for that variant, or null when it has none.
|
|
21
|
+
* @example
|
|
22
|
+
* ```ts
|
|
23
|
+
* import { flightOf } from "@johnmorrisdotca/uchusen-rockets";
|
|
24
|
+
*
|
|
25
|
+
* console.log(flightOf("starship", "v3")?.name, flightOf("starship", "v4"));
|
|
26
|
+
* ```
|
|
27
|
+
*/
|
|
7
28
|
export declare const flightOf: (rocket: string, variant: string | undefined) => Flight | null;
|
|
8
|
-
/**
|
|
29
|
+
/**
|
|
30
|
+
* The last place on the timeline: the last phase.
|
|
31
|
+
*
|
|
32
|
+
* @param flight A flight.
|
|
33
|
+
* @returns The index of its last phase.
|
|
34
|
+
* @example
|
|
35
|
+
* ```ts
|
|
36
|
+
* import { flightOf, lastPosition } from "@johnmorrisdotca/uchusen-rockets";
|
|
37
|
+
*
|
|
38
|
+
* const flight = flightOf("falcon-9", "block-5");
|
|
39
|
+
* console.log(flight ? lastPosition(flight) : null);
|
|
40
|
+
* ```
|
|
41
|
+
*/
|
|
9
42
|
export declare const lastPosition: (flight: Flight) => number;
|
|
10
|
-
/**
|
|
43
|
+
/**
|
|
44
|
+
* Which phase a place on the timeline is in, and how far along to the next. A value that is not a number is the start.
|
|
45
|
+
*
|
|
46
|
+
* @param flight A flight.
|
|
47
|
+
* @param position A place on the timeline: 0 is the first phase, 1 the second, 1.5 halfway to the third.
|
|
48
|
+
* @returns The phase index, how far along to the next (0 to 1) and the phase.
|
|
49
|
+
* @example
|
|
50
|
+
* ```ts
|
|
51
|
+
* import { flightOf, phaseAt } from "@johnmorrisdotca/uchusen-rockets";
|
|
52
|
+
*
|
|
53
|
+
* const flight = flightOf("falcon-9", "block-5");
|
|
54
|
+
* if (flight) console.log(phaseAt(flight, 1.5).phase.name);
|
|
55
|
+
* ```
|
|
56
|
+
*/
|
|
11
57
|
export declare function phaseAt(flight: Flight, position: number): {
|
|
12
58
|
index: number;
|
|
13
59
|
along: number;
|
|
14
60
|
phase: FlightPhase;
|
|
15
61
|
};
|
|
16
|
-
/**
|
|
62
|
+
/**
|
|
63
|
+
* The place on the timeline of a phase by its id, or null for one the flight does not have.
|
|
64
|
+
*
|
|
65
|
+
* @param flight A flight.
|
|
66
|
+
* @param id A phase's id, or null or undefined.
|
|
67
|
+
* @returns The place of that phase on the timeline, or null for an id the flight does not have.
|
|
68
|
+
* @example
|
|
69
|
+
* ```ts
|
|
70
|
+
* import { flightOf, phasePosition } from "@johnmorrisdotca/uchusen-rockets";
|
|
71
|
+
*
|
|
72
|
+
* const flight = flightOf("falcon-9", "block-5");
|
|
73
|
+
* if (flight) console.log(phasePosition(flight, "nonsense"));
|
|
74
|
+
* ```
|
|
75
|
+
*/
|
|
17
76
|
export declare function phasePosition(flight: Flight, id: string | null | undefined): number | null;
|
|
18
|
-
/**
|
|
77
|
+
/**
|
|
78
|
+
* How many engines of each part burn in a phase, as drawn: a blank figure draws its `drawn`.
|
|
79
|
+
*
|
|
80
|
+
* @param phase A phase of a flight.
|
|
81
|
+
* @returns The number of engines burning for each part, by slot.
|
|
82
|
+
* @example
|
|
83
|
+
* ```ts
|
|
84
|
+
* import { burnsOf, flightOf } from "@johnmorrisdotca/uchusen-rockets";
|
|
85
|
+
*
|
|
86
|
+
* const phase = flightOf("falcon-9", "block-5")?.phases[0];
|
|
87
|
+
* console.log(phase ? burnsOf(phase) : {});
|
|
88
|
+
* ```
|
|
89
|
+
*/
|
|
19
90
|
export declare function burnsOf(phase: FlightPhase): Record<string, number>;
|
|
20
91
|
export interface PoseNow {
|
|
21
92
|
dx: number;
|
|
@@ -23,6 +94,18 @@ export interface PoseNow {
|
|
|
23
94
|
pitch: number;
|
|
24
95
|
gone: boolean;
|
|
25
96
|
}
|
|
97
|
+
/**
|
|
98
|
+
* Everything the picture needs at one place on the timeline: the phase, how each part stands, which engines burn, how far the ground has fallen, and how much smoke stands on the pad.
|
|
99
|
+
*
|
|
100
|
+
* @example
|
|
101
|
+
* ```ts
|
|
102
|
+
* import { flightOf, frameAt, type FlightFrame } from "@johnmorrisdotca/uchusen-rockets";
|
|
103
|
+
*
|
|
104
|
+
* const flight = flightOf("falcon-9", "block-5");
|
|
105
|
+
* const frame: FlightFrame | undefined = flight ? frameAt(flight, 0, [{ slot: "first-stage", baseY: 0 }], 70) : undefined;
|
|
106
|
+
* console.log(frame?.phase.name, frame?.separated);
|
|
107
|
+
* ```
|
|
108
|
+
*/
|
|
26
109
|
export interface FlightFrame {
|
|
27
110
|
index: number;
|
|
28
111
|
phase: FlightPhase;
|
|
@@ -40,7 +123,22 @@ export interface FlightPart {
|
|
|
40
123
|
/** Where it stands in the stack: the base's height, metres. */
|
|
41
124
|
baseY: number;
|
|
42
125
|
}
|
|
43
|
-
/**
|
|
126
|
+
/**
|
|
127
|
+
* Everything the picture needs at a place on the timeline, for a vehicle `height` metres tall.
|
|
128
|
+
*
|
|
129
|
+
* @param flight A flight.
|
|
130
|
+
* @param position A place on the timeline.
|
|
131
|
+
* @param parts Each part's slot and the height of its base in the stack, in metres.
|
|
132
|
+
* @param height The vehicle's height in metres.
|
|
133
|
+
* @returns The frame to draw.
|
|
134
|
+
* @example
|
|
135
|
+
* ```ts
|
|
136
|
+
* import { flightOf, frameAt } from "@johnmorrisdotca/uchusen-rockets";
|
|
137
|
+
*
|
|
138
|
+
* const flight = flightOf("falcon-9", "block-5");
|
|
139
|
+
* if (flight) console.log(frameAt(flight, 1, [{ slot: "first-stage", baseY: 0 }, { slot: "second-stage", baseY: 41 }], 70).burns);
|
|
140
|
+
* ```
|
|
141
|
+
*/
|
|
44
142
|
export declare function frameAt(flight: Flight, position: number, parts: readonly FlightPart[], height: number): FlightFrame;
|
|
45
143
|
/** How far a flight's picture reaches, so the camera can hold all of it: the widest and highest every part stands, from the stack's own bounds. */
|
|
46
144
|
export declare function flightBounds(flight: Flight, parts: readonly (FlightPart & {
|
|
@@ -50,7 +148,23 @@ export declare function flightBounds(flight: Flight, parts: readonly (FlightPart
|
|
|
50
148
|
min: [number, number, number];
|
|
51
149
|
max: [number, number, number];
|
|
52
150
|
};
|
|
53
|
-
/**
|
|
151
|
+
/**
|
|
152
|
+
* The clock of one timeline: where it is and whether it runs. It only moves when told to, once a frame by whoever draws, so a timeline out of sight stands still.
|
|
153
|
+
*
|
|
154
|
+
* @param flight The flight whose clock this is.
|
|
155
|
+
* @example
|
|
156
|
+
* ```ts
|
|
157
|
+
* import { FlightClock, flightOf } from "@johnmorrisdotca/uchusen-rockets";
|
|
158
|
+
*
|
|
159
|
+
* const flight = flightOf("falcon-9", "block-5");
|
|
160
|
+
* if (flight) {
|
|
161
|
+
* const clock = new FlightClock(flight);
|
|
162
|
+
* clock.play();
|
|
163
|
+
* clock.advance(2.4);
|
|
164
|
+
* console.log(clock.position, clock.ended);
|
|
165
|
+
* }
|
|
166
|
+
* ```
|
|
167
|
+
*/
|
|
54
168
|
export declare class FlightClock {
|
|
55
169
|
readonly flight: Flight;
|
|
56
170
|
position: number;
|
|
@@ -63,5 +177,16 @@ export declare class FlightClock {
|
|
|
63
177
|
/** Moves on by `seconds` of the screen's time, and stops at the end. */
|
|
64
178
|
advance(seconds: number): void;
|
|
65
179
|
}
|
|
66
|
-
/**
|
|
180
|
+
/**
|
|
181
|
+
* A time as words: `T+2:35`, `T-0:03`, `T+1:05:20`. A blank says so.
|
|
182
|
+
*
|
|
183
|
+
* @param at A figure holding seconds from the flight's zero.
|
|
184
|
+
* @returns The time as text, such as `T+2:35`. A blank figure gives "Time: no source".
|
|
185
|
+
* @example
|
|
186
|
+
* ```ts
|
|
187
|
+
* import { clockWords } from "@johnmorrisdotca/uchusen-rockets";
|
|
188
|
+
*
|
|
189
|
+
* console.log(clockWords({ value: 155, source: "wikipedia-starship" }), clockWords({ value: -3, source: null }));
|
|
190
|
+
* ```
|
|
191
|
+
*/
|
|
67
192
|
export declare function clockWords(at: Figure): string;
|
package/dist/flight.js
CHANGED
|
@@ -1,24 +1,95 @@
|
|
|
1
1
|
// A flight as a timeline: where the reader is along it, which engines burn there and how each part stands. The times and the counts are `src/data/flights.ts`, each with its page. Moving between the phases is a picture. Pure: no three.js and no DOM.
|
|
2
2
|
import { FLIGHTS } from "./data/flights.js";
|
|
3
|
-
/**
|
|
3
|
+
/**
|
|
4
|
+
* Seconds a phase takes on the screen when the timeline plays: one flight in under a minute, whatever its real length.
|
|
5
|
+
*
|
|
6
|
+
* @example
|
|
7
|
+
* ```ts
|
|
8
|
+
* import { SECONDS_PER_PHASE } from "@johnmorrisdotca/uchusen-rockets";
|
|
9
|
+
*
|
|
10
|
+
* console.log(SECONDS_PER_PHASE);
|
|
11
|
+
* ```
|
|
12
|
+
*/
|
|
4
13
|
export const SECONDS_PER_PHASE = 2.4;
|
|
5
|
-
/**
|
|
14
|
+
/**
|
|
15
|
+
* The flight for a rocket's variant, when a page gives one.
|
|
16
|
+
*
|
|
17
|
+
* @param rocket A rocket's id.
|
|
18
|
+
* @param variant A variant's id, or undefined.
|
|
19
|
+
* @returns The flight for that variant, or null when it has none.
|
|
20
|
+
* @example
|
|
21
|
+
* ```ts
|
|
22
|
+
* import { flightOf } from "@johnmorrisdotca/uchusen-rockets";
|
|
23
|
+
*
|
|
24
|
+
* console.log(flightOf("starship", "v3")?.name, flightOf("starship", "v4"));
|
|
25
|
+
* ```
|
|
26
|
+
*/
|
|
6
27
|
export const flightOf = (rocket, variant) => FLIGHTS.find((flight) => flight.rocket === rocket && flight.variant === variant) ?? null;
|
|
7
|
-
/**
|
|
28
|
+
/**
|
|
29
|
+
* The last place on the timeline: the last phase.
|
|
30
|
+
*
|
|
31
|
+
* @param flight A flight.
|
|
32
|
+
* @returns The index of its last phase.
|
|
33
|
+
* @example
|
|
34
|
+
* ```ts
|
|
35
|
+
* import { flightOf, lastPosition } from "@johnmorrisdotca/uchusen-rockets";
|
|
36
|
+
*
|
|
37
|
+
* const flight = flightOf("falcon-9", "block-5");
|
|
38
|
+
* console.log(flight ? lastPosition(flight) : null);
|
|
39
|
+
* ```
|
|
40
|
+
*/
|
|
8
41
|
export const lastPosition = (flight) => flight.phases.length - 1;
|
|
9
|
-
/**
|
|
42
|
+
/**
|
|
43
|
+
* Which phase a place on the timeline is in, and how far along to the next. A value that is not a number is the start.
|
|
44
|
+
*
|
|
45
|
+
* @param flight A flight.
|
|
46
|
+
* @param position A place on the timeline: 0 is the first phase, 1 the second, 1.5 halfway to the third.
|
|
47
|
+
* @returns The phase index, how far along to the next (0 to 1) and the phase.
|
|
48
|
+
* @example
|
|
49
|
+
* ```ts
|
|
50
|
+
* import { flightOf, phaseAt } from "@johnmorrisdotca/uchusen-rockets";
|
|
51
|
+
*
|
|
52
|
+
* const flight = flightOf("falcon-9", "block-5");
|
|
53
|
+
* if (flight) console.log(phaseAt(flight, 1.5).phase.name);
|
|
54
|
+
* ```
|
|
55
|
+
*/
|
|
10
56
|
export function phaseAt(flight, position) {
|
|
11
57
|
const last = lastPosition(flight);
|
|
12
58
|
const place = Number.isFinite(position) ? Math.min(last, Math.max(0, position)) : 0;
|
|
13
59
|
const index = Math.floor(place);
|
|
14
60
|
return { index, along: place - index, phase: flight.phases[index] };
|
|
15
61
|
}
|
|
16
|
-
/**
|
|
62
|
+
/**
|
|
63
|
+
* The place on the timeline of a phase by its id, or null for one the flight does not have.
|
|
64
|
+
*
|
|
65
|
+
* @param flight A flight.
|
|
66
|
+
* @param id A phase's id, or null or undefined.
|
|
67
|
+
* @returns The place of that phase on the timeline, or null for an id the flight does not have.
|
|
68
|
+
* @example
|
|
69
|
+
* ```ts
|
|
70
|
+
* import { flightOf, phasePosition } from "@johnmorrisdotca/uchusen-rockets";
|
|
71
|
+
*
|
|
72
|
+
* const flight = flightOf("falcon-9", "block-5");
|
|
73
|
+
* if (flight) console.log(phasePosition(flight, "nonsense"));
|
|
74
|
+
* ```
|
|
75
|
+
*/
|
|
17
76
|
export function phasePosition(flight, id) {
|
|
18
77
|
const index = flight.phases.findIndex((phase) => phase.id === id);
|
|
19
78
|
return index < 0 ? null : index;
|
|
20
79
|
}
|
|
21
|
-
/**
|
|
80
|
+
/**
|
|
81
|
+
* How many engines of each part burn in a phase, as drawn: a blank figure draws its `drawn`.
|
|
82
|
+
*
|
|
83
|
+
* @param phase A phase of a flight.
|
|
84
|
+
* @returns The number of engines burning for each part, by slot.
|
|
85
|
+
* @example
|
|
86
|
+
* ```ts
|
|
87
|
+
* import { burnsOf, flightOf } from "@johnmorrisdotca/uchusen-rockets";
|
|
88
|
+
*
|
|
89
|
+
* const phase = flightOf("falcon-9", "block-5")?.phases[0];
|
|
90
|
+
* console.log(phase ? burnsOf(phase) : {});
|
|
91
|
+
* ```
|
|
92
|
+
*/
|
|
22
93
|
export function burnsOf(phase) {
|
|
23
94
|
const out = {};
|
|
24
95
|
for (const [slot, burn] of Object.entries(phase.burns))
|
|
@@ -33,7 +104,22 @@ const poseIn = (pose, part, height) => ({
|
|
|
33
104
|
pitch: pose?.pitch ?? 0,
|
|
34
105
|
gone: pose?.gone ?? false,
|
|
35
106
|
});
|
|
36
|
-
/**
|
|
107
|
+
/**
|
|
108
|
+
* Everything the picture needs at a place on the timeline, for a vehicle `height` metres tall.
|
|
109
|
+
*
|
|
110
|
+
* @param flight A flight.
|
|
111
|
+
* @param position A place on the timeline.
|
|
112
|
+
* @param parts Each part's slot and the height of its base in the stack, in metres.
|
|
113
|
+
* @param height The vehicle's height in metres.
|
|
114
|
+
* @returns The frame to draw.
|
|
115
|
+
* @example
|
|
116
|
+
* ```ts
|
|
117
|
+
* import { flightOf, frameAt } from "@johnmorrisdotca/uchusen-rockets";
|
|
118
|
+
*
|
|
119
|
+
* const flight = flightOf("falcon-9", "block-5");
|
|
120
|
+
* if (flight) console.log(frameAt(flight, 1, [{ slot: "first-stage", baseY: 0 }, { slot: "second-stage", baseY: 41 }], 70).burns);
|
|
121
|
+
* ```
|
|
122
|
+
*/
|
|
37
123
|
export function frameAt(flight, position, parts, height) {
|
|
38
124
|
const { index, along, phase } = phaseAt(flight, position);
|
|
39
125
|
const next = flight.phases[Math.min(index + 1, lastPosition(flight))];
|
|
@@ -78,7 +164,23 @@ export function flightBounds(flight, parts, height) {
|
|
|
78
164
|
}
|
|
79
165
|
return { min, max };
|
|
80
166
|
}
|
|
81
|
-
/**
|
|
167
|
+
/**
|
|
168
|
+
* The clock of one timeline: where it is and whether it runs. It only moves when told to, once a frame by whoever draws, so a timeline out of sight stands still.
|
|
169
|
+
*
|
|
170
|
+
* @param flight The flight whose clock this is.
|
|
171
|
+
* @example
|
|
172
|
+
* ```ts
|
|
173
|
+
* import { FlightClock, flightOf } from "@johnmorrisdotca/uchusen-rockets";
|
|
174
|
+
*
|
|
175
|
+
* const flight = flightOf("falcon-9", "block-5");
|
|
176
|
+
* if (flight) {
|
|
177
|
+
* const clock = new FlightClock(flight);
|
|
178
|
+
* clock.play();
|
|
179
|
+
* clock.advance(2.4);
|
|
180
|
+
* console.log(clock.position, clock.ended);
|
|
181
|
+
* }
|
|
182
|
+
* ```
|
|
183
|
+
*/
|
|
82
184
|
export class FlightClock {
|
|
83
185
|
flight;
|
|
84
186
|
position = 0;
|
|
@@ -111,7 +213,18 @@ export class FlightClock {
|
|
|
111
213
|
this.playing = false;
|
|
112
214
|
}
|
|
113
215
|
}
|
|
114
|
-
/**
|
|
216
|
+
/**
|
|
217
|
+
* A time as words: `T+2:35`, `T-0:03`, `T+1:05:20`. A blank says so.
|
|
218
|
+
*
|
|
219
|
+
* @param at A figure holding seconds from the flight's zero.
|
|
220
|
+
* @returns The time as text, such as `T+2:35`. A blank figure gives "Time: no source".
|
|
221
|
+
* @example
|
|
222
|
+
* ```ts
|
|
223
|
+
* import { clockWords } from "@johnmorrisdotca/uchusen-rockets";
|
|
224
|
+
*
|
|
225
|
+
* console.log(clockWords({ value: 155, source: "wikipedia-starship" }), clockWords({ value: -3, source: null }));
|
|
226
|
+
* ```
|
|
227
|
+
*/
|
|
115
228
|
export function clockWords(at) {
|
|
116
229
|
if (at.value === null)
|
|
117
230
|
return "Time: no source";
|
package/dist/flightbar.d.ts
CHANGED
|
@@ -1,4 +1,16 @@
|
|
|
1
1
|
declare const HTMLBase: typeof HTMLElement;
|
|
2
|
+
/**
|
|
3
|
+
* The `<uchusen-flight>` element: a play button, a slider and the phase's name for a rocket's flight. Its `for` attribute is the id of the `<uchusen-rocket>` it drives. A variant with no flight says so.
|
|
4
|
+
*
|
|
5
|
+
* @example
|
|
6
|
+
* ```ts no-run
|
|
7
|
+
* import { UchusenFlight } from "@johnmorrisdotca/uchusen-rockets/element";
|
|
8
|
+
*
|
|
9
|
+
* const flight: UchusenFlight = document.createElement("uchusen-flight") as UchusenFlight;
|
|
10
|
+
* flight.setAttribute("for", "rocket");
|
|
11
|
+
* document.body.append(flight);
|
|
12
|
+
* ```
|
|
13
|
+
*/
|
|
2
14
|
export declare class UchusenFlight extends HTMLBase {
|
|
3
15
|
static readonly observedAttributes: string[];
|
|
4
16
|
private rocket;
|
package/dist/flightbar.js
CHANGED
|
@@ -22,6 +22,18 @@ figcaption { font-size: 0.74rem; line-height: 1.25; margin-top: 0.2rem; }
|
|
|
22
22
|
a { color: inherit; }
|
|
23
23
|
`;
|
|
24
24
|
const sheet = { made: null };
|
|
25
|
+
/**
|
|
26
|
+
* The `<uchusen-flight>` element: a play button, a slider and the phase's name for a rocket's flight. Its `for` attribute is the id of the `<uchusen-rocket>` it drives. A variant with no flight says so.
|
|
27
|
+
*
|
|
28
|
+
* @example
|
|
29
|
+
* ```ts no-run
|
|
30
|
+
* import { UchusenFlight } from "@johnmorrisdotca/uchusen-rockets/element";
|
|
31
|
+
*
|
|
32
|
+
* const flight: UchusenFlight = document.createElement("uchusen-flight") as UchusenFlight;
|
|
33
|
+
* flight.setAttribute("for", "rocket");
|
|
34
|
+
* document.body.append(flight);
|
|
35
|
+
* ```
|
|
36
|
+
*/
|
|
25
37
|
export class UchusenFlight extends HTMLBase {
|
|
26
38
|
static observedAttributes = ["for"];
|
|
27
39
|
rocket = null;
|
package/dist/framing.d.ts
CHANGED
|
@@ -1,21 +1,133 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Three numbers: x, y and z. Y is up and the windward side faces +Z, in metres.
|
|
3
|
+
*
|
|
4
|
+
* @example
|
|
5
|
+
* ```ts
|
|
6
|
+
* import type { Vec3 } from "@johnmorrisdotca/uchusen-rockets";
|
|
7
|
+
*
|
|
8
|
+
* const origin: Vec3 = [0, 0, 0];
|
|
9
|
+
* console.log(origin);
|
|
10
|
+
* ```
|
|
11
|
+
*/
|
|
1
12
|
export type Vec3 = [number, number, number];
|
|
2
|
-
/**
|
|
13
|
+
/**
|
|
14
|
+
* The camera's field of view, in degrees, top to bottom. Narrow, because a rocket is long.
|
|
15
|
+
*
|
|
16
|
+
* @example
|
|
17
|
+
* ```ts
|
|
18
|
+
* import { FOV_DEG } from "@johnmorrisdotca/uchusen-rockets";
|
|
19
|
+
*
|
|
20
|
+
* console.log(FOV_DEG);
|
|
21
|
+
* ```
|
|
22
|
+
*/
|
|
3
23
|
export declare const FOV_DEG = 24;
|
|
4
|
-
/**
|
|
24
|
+
/**
|
|
25
|
+
* The width of the picture a drawing is made in, in drawing units.
|
|
26
|
+
*
|
|
27
|
+
* @example
|
|
28
|
+
* ```ts
|
|
29
|
+
* import { PICTURE_W, PICTURE_H } from "@johnmorrisdotca/uchusen-rockets";
|
|
30
|
+
*
|
|
31
|
+
* console.log(PICTURE_W, PICTURE_H);
|
|
32
|
+
* ```
|
|
33
|
+
*/
|
|
5
34
|
export declare const PICTURE_W = 480;
|
|
35
|
+
/**
|
|
36
|
+
* The height of the picture a drawing is made in, in drawing units.
|
|
37
|
+
*
|
|
38
|
+
* @example
|
|
39
|
+
* ```ts
|
|
40
|
+
* import { PICTURE_H } from "@johnmorrisdotca/uchusen-rockets";
|
|
41
|
+
*
|
|
42
|
+
* console.log(PICTURE_H);
|
|
43
|
+
* ```
|
|
44
|
+
*/
|
|
6
45
|
export declare const PICTURE_H = 640;
|
|
46
|
+
/**
|
|
47
|
+
* The names of the views, in the order the demo lists them: `three-quarter`, `front`, `back`, `side` and `below`.
|
|
48
|
+
*
|
|
49
|
+
* @example
|
|
50
|
+
* ```ts
|
|
51
|
+
* import { VIEW_NAMES } from "@johnmorrisdotca/uchusen-rockets";
|
|
52
|
+
*
|
|
53
|
+
* console.log(VIEW_NAMES.join(", "));
|
|
54
|
+
* ```
|
|
55
|
+
*/
|
|
7
56
|
export declare const VIEW_NAMES: readonly ["three-quarter", "front", "back", "side", "below"];
|
|
57
|
+
/**
|
|
58
|
+
* The name of one view in `VIEW_NAMES`.
|
|
59
|
+
*
|
|
60
|
+
* @example
|
|
61
|
+
* ```ts
|
|
62
|
+
* import type { ViewName } from "@johnmorrisdotca/uchusen-rockets";
|
|
63
|
+
*
|
|
64
|
+
* const view: ViewName = "below";
|
|
65
|
+
* console.log(view);
|
|
66
|
+
* ```
|
|
67
|
+
*/
|
|
8
68
|
export type ViewName = (typeof VIEW_NAMES)[number];
|
|
69
|
+
/**
|
|
70
|
+
* The view used when none is named or the name is not a view: `three-quarter`.
|
|
71
|
+
*
|
|
72
|
+
* @example
|
|
73
|
+
* ```ts
|
|
74
|
+
* import { DEFAULT_VIEW } from "@johnmorrisdotca/uchusen-rockets";
|
|
75
|
+
*
|
|
76
|
+
* console.log(DEFAULT_VIEW);
|
|
77
|
+
* ```
|
|
78
|
+
*/
|
|
9
79
|
export declare const DEFAULT_VIEW: ViewName;
|
|
10
|
-
/**
|
|
80
|
+
/**
|
|
81
|
+
* An angle to look from: `az` degrees round from the windward side towards +X, `el` degrees above the horizon. Front is the windward, tiled side; back is the steel side.
|
|
82
|
+
*
|
|
83
|
+
* @example
|
|
84
|
+
* ```ts
|
|
85
|
+
* import { VIEWS, type Angle } from "@johnmorrisdotca/uchusen-rockets";
|
|
86
|
+
*
|
|
87
|
+
* const angle: Angle = VIEWS.back;
|
|
88
|
+
* console.log(angle);
|
|
89
|
+
* ```
|
|
90
|
+
*/
|
|
11
91
|
export interface Angle {
|
|
12
92
|
az: number;
|
|
13
93
|
el: number;
|
|
14
94
|
}
|
|
95
|
+
/**
|
|
96
|
+
* The angle of each named view.
|
|
97
|
+
*
|
|
98
|
+
* @example
|
|
99
|
+
* ```ts
|
|
100
|
+
* import { VIEWS } from "@johnmorrisdotca/uchusen-rockets";
|
|
101
|
+
*
|
|
102
|
+
* console.log(VIEWS.front, VIEWS.below);
|
|
103
|
+
* ```
|
|
104
|
+
*/
|
|
15
105
|
export declare const VIEWS: Readonly<Record<ViewName, Angle>>;
|
|
106
|
+
/**
|
|
107
|
+
* A value from outside as a view's name.
|
|
108
|
+
*
|
|
109
|
+
* @param value Anything.
|
|
110
|
+
* @returns The name if it is one of the views, and `three-quarter` for anything else.
|
|
111
|
+
* @example
|
|
112
|
+
* ```ts
|
|
113
|
+
* import { cleanView } from "@johnmorrisdotca/uchusen-rockets";
|
|
114
|
+
*
|
|
115
|
+
* console.log(cleanView("side"), cleanView("sideways"), cleanView(42));
|
|
116
|
+
* ```
|
|
117
|
+
*/
|
|
16
118
|
export declare const cleanView: (value: unknown) => ViewName;
|
|
17
119
|
export declare const deg: (d: number) => number;
|
|
18
|
-
/**
|
|
120
|
+
/**
|
|
121
|
+
* What the family's view controls report: the turn and tip in degrees, the zoom (1 is the whole rocket in the picture) and the pan in pixels.
|
|
122
|
+
*
|
|
123
|
+
* @example
|
|
124
|
+
* ```ts
|
|
125
|
+
* import type { ViewChoice } from "@johnmorrisdotca/uchusen-rockets";
|
|
126
|
+
*
|
|
127
|
+
* const choice: ViewChoice = { yaw: 20, tilt: -5, zoom: 1, panX: 0, panY: 0 };
|
|
128
|
+
* console.log(choice);
|
|
129
|
+
* ```
|
|
130
|
+
*/
|
|
19
131
|
export interface ViewChoice {
|
|
20
132
|
yaw: number;
|
|
21
133
|
tilt: number;
|
|
@@ -23,20 +135,82 @@ export interface ViewChoice {
|
|
|
23
135
|
panX: number;
|
|
24
136
|
panY: number;
|
|
25
137
|
}
|
|
26
|
-
/**
|
|
138
|
+
/**
|
|
139
|
+
* What the family's view controls choose: the turn and tip, in degrees, from a base angle. Dragging right makes `yaw` larger, which carries the camera the other way round; `tilt` larger tips the top away, which lowers the camera.
|
|
140
|
+
*
|
|
141
|
+
* @param base The angle to turn from.
|
|
142
|
+
* @param yaw Degrees turned round.
|
|
143
|
+
* @param tilt Degrees tipped up or down.
|
|
144
|
+
* @returns The new angle.
|
|
145
|
+
* @example
|
|
146
|
+
* ```ts
|
|
147
|
+
* import { turnedBy, VIEWS } from "@johnmorrisdotca/uchusen-rockets";
|
|
148
|
+
*
|
|
149
|
+
* console.log(turnedBy(VIEWS.front, 30, 10));
|
|
150
|
+
* ```
|
|
151
|
+
*/
|
|
27
152
|
export declare function turnedBy(base: Angle, yaw: number, tilt: number): Angle;
|
|
28
|
-
/**
|
|
153
|
+
/**
|
|
154
|
+
* The unit vector from what is looked at towards the camera.
|
|
155
|
+
*
|
|
156
|
+
* @param angle The angle to look from.
|
|
157
|
+
* @returns A unit vector.
|
|
158
|
+
* @example
|
|
159
|
+
* ```ts
|
|
160
|
+
* import { directionOf } from "@johnmorrisdotca/uchusen-rockets";
|
|
161
|
+
*
|
|
162
|
+
* console.log(directionOf({ az: 0, el: 0 }));
|
|
163
|
+
* ```
|
|
164
|
+
*/
|
|
29
165
|
export declare function directionOf({ az, el }: Angle): Vec3;
|
|
166
|
+
/**
|
|
167
|
+
* Where the camera stands: the point it looks at, its position and its distance from that point, in metres.
|
|
168
|
+
*
|
|
169
|
+
* @example
|
|
170
|
+
* ```ts
|
|
171
|
+
* import { frameFor, type Framing } from "@johnmorrisdotca/uchusen-rockets";
|
|
172
|
+
*
|
|
173
|
+
* const framing: Framing = frameFor([-5, 0, -5], [5, 100, 5], { az: 30, el: 15 }, 480 / 640);
|
|
174
|
+
* console.log(framing.distance > 0);
|
|
175
|
+
* ```
|
|
176
|
+
*/
|
|
30
177
|
export interface Framing {
|
|
31
178
|
target: Vec3;
|
|
32
179
|
position: Vec3;
|
|
33
180
|
distance: number;
|
|
34
181
|
}
|
|
35
|
-
/**
|
|
182
|
+
/**
|
|
183
|
+
* The camera's own axes for looking along `direction`, with up as near to +Y as it can be.
|
|
184
|
+
*
|
|
185
|
+
* @param direction The direction from the target to the camera.
|
|
186
|
+
* @returns The camera's right, up and forward axes.
|
|
187
|
+
* @example
|
|
188
|
+
* ```ts
|
|
189
|
+
* import { axesOf } from "@johnmorrisdotca/uchusen-rockets";
|
|
190
|
+
*
|
|
191
|
+
* console.log(axesOf([0, 0, 1]));
|
|
192
|
+
* ```
|
|
193
|
+
*/
|
|
36
194
|
export declare function axesOf(direction: Vec3): {
|
|
37
195
|
right: Vec3;
|
|
38
196
|
up: Vec3;
|
|
39
197
|
forward: Vec3;
|
|
40
198
|
};
|
|
41
|
-
/**
|
|
199
|
+
/**
|
|
200
|
+
* The nearest camera that holds the whole of `min` to `max` in a picture `aspect` wide for 1 tall, from `angle`.
|
|
201
|
+
*
|
|
202
|
+
* @param min The lowest corner of the box to hold.
|
|
203
|
+
* @param max The highest corner.
|
|
204
|
+
* @param angle The angle to look from.
|
|
205
|
+
* @param aspect The picture's width over its height.
|
|
206
|
+
* @param margin Room left round the box, as a multiple. Defaults to 1.08.
|
|
207
|
+
* @returns The camera that holds the whole box.
|
|
208
|
+
* @example
|
|
209
|
+
* ```ts
|
|
210
|
+
* import { frameFor, VIEWS } from "@johnmorrisdotca/uchusen-rockets";
|
|
211
|
+
*
|
|
212
|
+
* const framing = frameFor([-4.5, 0, -4.5], [4.5, 124, 4.5], VIEWS.front, 480 / 640);
|
|
213
|
+
* console.log(framing.target, framing.distance.toFixed(0));
|
|
214
|
+
* ```
|
|
215
|
+
*/
|
|
42
216
|
export declare function frameFor(min: Vec3, max: Vec3, angle: Angle, aspect: number, margin?: number): Framing;
|