@vived/app 4.34.1 → 4.34.2
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/lib/Components/FramedScreen/Factories/index.d.ts +1 -1
- package/lib/Components/FramedScreen/Factories/index.js +1 -1
- package/lib/Components/FramedScreen/Factories/setupStandardFramedScreen.d.ts +10 -0
- package/lib/Components/FramedScreen/Factories/setupStandardFramedScreen.js +41 -0
- package/lib/Components/FramedScreen/UCs/StandardLayoutUC.d.ts +33 -0
- package/lib/Components/FramedScreen/UCs/StandardLayoutUC.js +310 -0
- package/lib/Components/FramedScreen/UCs/index.d.ts +1 -0
- package/lib/Components/FramedScreen/UCs/index.js +13 -0
- package/lib/Components/FramedScreen/index.d.ts +1 -0
- package/lib/Components/FramedScreen/index.js +1 -0
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
export * from "./
|
|
1
|
+
export * from "./setupStandardFramedScreen";
|
|
@@ -10,4 +10,4 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
|
10
10
|
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
11
11
|
};
|
|
12
12
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
13
|
-
__exportStar(require("./
|
|
13
|
+
__exportStar(require("./setupStandardFramedScreen"), exports);
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { AppObject, AppObjectRepo } from "../../../AppObject";
|
|
2
|
+
export declare const SLIDE_INFO_FRAMED_CONTAINER_ID = "slideInfo";
|
|
3
|
+
export declare const RENDER_CANVAS_FRAMED_CONTAINER_ID = "renderCanvas";
|
|
4
|
+
export declare const INSPECTOR_FRAMED_CONTAINER_ID = "inspector";
|
|
5
|
+
export declare const TOOLBAR_FRAMED_CONTAINER_ID = "toolbar";
|
|
6
|
+
export declare const LOWER_LETTERBOX_FRAMED_CONTAINER_ID = "lowerLetterBox";
|
|
7
|
+
export declare const UPPER_LETTERBOX_FRAMED_CONTAINER_ID = "upperLetterBox";
|
|
8
|
+
export declare const LEFT_LETTERBOX_FRAMED_CONTAINER_ID = "leftLetterBox";
|
|
9
|
+
export declare const RIGHT_LETTERBOX_FRAMED_CONTAINER_ID = "rightLetterBox";
|
|
10
|
+
export declare function setupStandardFramedScreen(appObjects: AppObjectRepo): AppObject;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.setupStandardFramedScreen = exports.RIGHT_LETTERBOX_FRAMED_CONTAINER_ID = exports.LEFT_LETTERBOX_FRAMED_CONTAINER_ID = exports.UPPER_LETTERBOX_FRAMED_CONTAINER_ID = exports.LOWER_LETTERBOX_FRAMED_CONTAINER_ID = exports.TOOLBAR_FRAMED_CONTAINER_ID = exports.INSPECTOR_FRAMED_CONTAINER_ID = exports.RENDER_CANVAS_FRAMED_CONTAINER_ID = exports.SLIDE_INFO_FRAMED_CONTAINER_ID = void 0;
|
|
4
|
+
const UpdateTouchInputBound_1 = require("../../TouchController/UC/UpdateTouchInputBound");
|
|
5
|
+
const EmulateDisplaySizeHook_1 = require("../../zSpace/UC/EmulateDisplaySizeHook");
|
|
6
|
+
const Entities_1 = require("../Entities");
|
|
7
|
+
const PM_1 = require("../PM");
|
|
8
|
+
const UCs_1 = require("../UCs");
|
|
9
|
+
exports.SLIDE_INFO_FRAMED_CONTAINER_ID = "slideInfo";
|
|
10
|
+
exports.RENDER_CANVAS_FRAMED_CONTAINER_ID = "renderCanvas";
|
|
11
|
+
exports.INSPECTOR_FRAMED_CONTAINER_ID = "inspector";
|
|
12
|
+
exports.TOOLBAR_FRAMED_CONTAINER_ID = "toolbar";
|
|
13
|
+
exports.LOWER_LETTERBOX_FRAMED_CONTAINER_ID = "lowerLetterBox";
|
|
14
|
+
exports.UPPER_LETTERBOX_FRAMED_CONTAINER_ID = "upperLetterBox";
|
|
15
|
+
exports.LEFT_LETTERBOX_FRAMED_CONTAINER_ID = "leftLetterBox";
|
|
16
|
+
exports.RIGHT_LETTERBOX_FRAMED_CONTAINER_ID = "rightLetterBox";
|
|
17
|
+
function setupStandardFramedScreen(appObjects) {
|
|
18
|
+
const frameScreenAO = appObjects.getOrCreate("FramedScreen");
|
|
19
|
+
const framedScreen = Entities_1.makeFramedScreen(frameScreenAO);
|
|
20
|
+
PM_1.makeFramedScreenSizePM(frameScreenAO);
|
|
21
|
+
makeContainer(exports.SLIDE_INFO_FRAMED_CONTAINER_ID, framedScreen, appObjects);
|
|
22
|
+
const canvas = makeContainer(exports.RENDER_CANVAS_FRAMED_CONTAINER_ID, framedScreen, appObjects);
|
|
23
|
+
makeContainer(exports.INSPECTOR_FRAMED_CONTAINER_ID, framedScreen, appObjects);
|
|
24
|
+
makeContainer(exports.TOOLBAR_FRAMED_CONTAINER_ID, framedScreen, appObjects);
|
|
25
|
+
makeContainer(exports.LOWER_LETTERBOX_FRAMED_CONTAINER_ID, framedScreen, appObjects);
|
|
26
|
+
makeContainer(exports.UPPER_LETTERBOX_FRAMED_CONTAINER_ID, framedScreen, appObjects);
|
|
27
|
+
makeContainer(exports.LEFT_LETTERBOX_FRAMED_CONTAINER_ID, framedScreen, appObjects);
|
|
28
|
+
makeContainer(exports.RIGHT_LETTERBOX_FRAMED_CONTAINER_ID, framedScreen, appObjects);
|
|
29
|
+
new UpdateTouchInputBound_1.UpdateTouchInputBoundUC(canvas.appObject);
|
|
30
|
+
EmulateDisplaySizeHook_1.makeEmulateDisplaySizeHook(canvas.appObject);
|
|
31
|
+
new UCs_1.StandardLayoutUC(frameScreenAO);
|
|
32
|
+
return frameScreenAO;
|
|
33
|
+
}
|
|
34
|
+
exports.setupStandardFramedScreen = setupStandardFramedScreen;
|
|
35
|
+
function makeContainer(id, screen, appObjects) {
|
|
36
|
+
const ao = appObjects.getOrCreate(id);
|
|
37
|
+
const entity = Entities_1.makeFramedScreenContainer(ao);
|
|
38
|
+
PM_1.makeFramedContainerPM(ao);
|
|
39
|
+
screen.addContainer(entity);
|
|
40
|
+
return entity;
|
|
41
|
+
}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { AppObject, AppObjectUC } from "../../../AppObject";
|
|
2
|
+
export declare class StandardLayoutUC extends AppObjectUC {
|
|
3
|
+
static type: string;
|
|
4
|
+
private framedScreen?;
|
|
5
|
+
private baseApp?;
|
|
6
|
+
private zSpaceEntity?;
|
|
7
|
+
private get challenge();
|
|
8
|
+
private slideInfo?;
|
|
9
|
+
private renderCanvas?;
|
|
10
|
+
private inspector?;
|
|
11
|
+
private toolbar?;
|
|
12
|
+
private lowerLetterBox?;
|
|
13
|
+
private upperLetterBox?;
|
|
14
|
+
private leftLetterBox?;
|
|
15
|
+
private rightLetterBox?;
|
|
16
|
+
readonly padding_x = 0;
|
|
17
|
+
readonly toolbarWidth = 64;
|
|
18
|
+
readonly infoColumnWidth = 264;
|
|
19
|
+
readonly infoOverlayMargin = 24;
|
|
20
|
+
readonly inspectorColumnWidth_Min = 264;
|
|
21
|
+
readonly inspectorColumnWidth_Max = 528;
|
|
22
|
+
get consumptionSideBySideBreakWidth(): number;
|
|
23
|
+
get infoContentLengthOverlayBreak(): number;
|
|
24
|
+
updateLayout: () => void;
|
|
25
|
+
updatePositionForPadding(): void;
|
|
26
|
+
layoutConsumptionOverlay(height: number, width: number): void;
|
|
27
|
+
layoutConsumptionSideBySide(height: number, width: number): void;
|
|
28
|
+
private disableContainer;
|
|
29
|
+
layoutForAuthoring(height: number, width: number): void;
|
|
30
|
+
layoutForZSpaceEmulation(height: number, width: number): void;
|
|
31
|
+
private getContainerByID;
|
|
32
|
+
constructor(appObject: AppObject);
|
|
33
|
+
}
|
|
@@ -0,0 +1,310 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.StandardLayoutUC = void 0;
|
|
4
|
+
const AppObject_1 = require("../../../AppObject");
|
|
5
|
+
const ValueObjects_1 = require("../../../ValueObjects");
|
|
6
|
+
const BaseAppState_1 = require("../../BaseApp/Entity/BaseAppState");
|
|
7
|
+
const ChallengeEntity_1 = require("../../Challenge/Entities/ChallengeEntity");
|
|
8
|
+
const ZSpaceEntity_1 = require("../../zSpace/Entities/ZSpaceEntity");
|
|
9
|
+
const Entities_1 = require("../Entities");
|
|
10
|
+
const setupStandardFramedScreen_1 = require("../Factories/setupStandardFramedScreen");
|
|
11
|
+
class StandardLayoutUC extends AppObject_1.AppObjectUC {
|
|
12
|
+
constructor(appObject) {
|
|
13
|
+
super(appObject, StandardLayoutUC.type);
|
|
14
|
+
this.padding_x = 0;
|
|
15
|
+
this.toolbarWidth = 64;
|
|
16
|
+
this.infoColumnWidth = 264;
|
|
17
|
+
this.infoOverlayMargin = 24;
|
|
18
|
+
this.inspectorColumnWidth_Min = 264;
|
|
19
|
+
this.inspectorColumnWidth_Max = 528;
|
|
20
|
+
this.updateLayout = () => {
|
|
21
|
+
var _a;
|
|
22
|
+
if (!this.framedScreen || !this.baseApp)
|
|
23
|
+
return;
|
|
24
|
+
const height = this.framedScreen.screenHeight;
|
|
25
|
+
const width = this.framedScreen.screenWidth - 2 * this.padding_x;
|
|
26
|
+
if (this.zSpaceEntity && this.zSpaceEntity.emulate) {
|
|
27
|
+
this.layoutForZSpaceEmulation(this.framedScreen.screenHeight, this.framedScreen.screenWidth);
|
|
28
|
+
return;
|
|
29
|
+
}
|
|
30
|
+
if (((_a = this.baseApp) === null || _a === void 0 ? void 0 : _a.isAuthoring) === true) {
|
|
31
|
+
this.layoutForAuthoring(height, width);
|
|
32
|
+
return;
|
|
33
|
+
}
|
|
34
|
+
if (this.framedScreen.screenWidth < this.consumptionSideBySideBreakWidth) {
|
|
35
|
+
this.layoutConsumptionSideBySide(height, width);
|
|
36
|
+
return;
|
|
37
|
+
}
|
|
38
|
+
if (this.baseApp.slideInfoContentHeight >
|
|
39
|
+
this.infoContentLengthOverlayBreak ||
|
|
40
|
+
this.baseApp.slideInfoContentHeight === 0) {
|
|
41
|
+
this.layoutConsumptionSideBySide(height, width);
|
|
42
|
+
return;
|
|
43
|
+
}
|
|
44
|
+
this.layoutConsumptionOverlay(height, width);
|
|
45
|
+
};
|
|
46
|
+
this.disableContainer = (container) => {
|
|
47
|
+
container.show = false;
|
|
48
|
+
container.position = ValueObjects_1.Vector2.Zero();
|
|
49
|
+
container.size = ValueObjects_1.Vector2.Zero();
|
|
50
|
+
};
|
|
51
|
+
this.framedScreen = appObject.getComponent(Entities_1.FramedScreenEntity.type);
|
|
52
|
+
if (!this.framedScreen) {
|
|
53
|
+
this.appObjects.submitFatal("FramedScreenSizePM", "FramedScreenSizePM has been added to an App Object that does not have a FramedScreenEntity");
|
|
54
|
+
throw new Error("No FramedScreenEntity");
|
|
55
|
+
}
|
|
56
|
+
this.slideInfo = this.getContainerByID(setupStandardFramedScreen_1.SLIDE_INFO_FRAMED_CONTAINER_ID);
|
|
57
|
+
this.renderCanvas = this.getContainerByID(setupStandardFramedScreen_1.RENDER_CANVAS_FRAMED_CONTAINER_ID);
|
|
58
|
+
this.inspector = this.getContainerByID(setupStandardFramedScreen_1.INSPECTOR_FRAMED_CONTAINER_ID);
|
|
59
|
+
this.toolbar = this.getContainerByID(setupStandardFramedScreen_1.TOOLBAR_FRAMED_CONTAINER_ID);
|
|
60
|
+
this.lowerLetterBox = this.getContainerByID(setupStandardFramedScreen_1.LOWER_LETTERBOX_FRAMED_CONTAINER_ID);
|
|
61
|
+
this.upperLetterBox = this.getContainerByID(setupStandardFramedScreen_1.UPPER_LETTERBOX_FRAMED_CONTAINER_ID);
|
|
62
|
+
this.leftLetterBox = this.getContainerByID(setupStandardFramedScreen_1.LEFT_LETTERBOX_FRAMED_CONTAINER_ID);
|
|
63
|
+
this.rightLetterBox = this.getContainerByID(setupStandardFramedScreen_1.RIGHT_LETTERBOX_FRAMED_CONTAINER_ID);
|
|
64
|
+
this.zSpaceEntity = ZSpaceEntity_1.ZSpaceEntity.get(this.appObjects);
|
|
65
|
+
if (this.zSpaceEntity) {
|
|
66
|
+
this.zSpaceEntity.addChangeObserver(this.updateLayout);
|
|
67
|
+
}
|
|
68
|
+
else {
|
|
69
|
+
console.warn("Unable to find the zSpaceEntity");
|
|
70
|
+
return;
|
|
71
|
+
}
|
|
72
|
+
this.baseApp = BaseAppState_1.BaseAppState.get(this.appObjects);
|
|
73
|
+
if (this.baseApp) {
|
|
74
|
+
this.baseApp.addChangeObserver(this.updateLayout);
|
|
75
|
+
}
|
|
76
|
+
else {
|
|
77
|
+
this.error("Unable to find base app");
|
|
78
|
+
return;
|
|
79
|
+
}
|
|
80
|
+
this.framedScreen.addChangeObserver(this.updateLayout);
|
|
81
|
+
}
|
|
82
|
+
get challenge() {
|
|
83
|
+
return this.getCachedSingleton(ChallengeEntity_1.ChallengeEntity.type);
|
|
84
|
+
}
|
|
85
|
+
get consumptionSideBySideBreakWidth() {
|
|
86
|
+
return (this.infoColumnWidth * 4 +
|
|
87
|
+
this.toolbarWidth +
|
|
88
|
+
this.infoOverlayMargin +
|
|
89
|
+
2 * this.padding_x);
|
|
90
|
+
}
|
|
91
|
+
get infoContentLengthOverlayBreak() {
|
|
92
|
+
if (!this.framedScreen) {
|
|
93
|
+
return 0;
|
|
94
|
+
}
|
|
95
|
+
return 0.5 * this.framedScreen.screenHeight;
|
|
96
|
+
}
|
|
97
|
+
updatePositionForPadding() {
|
|
98
|
+
if (!this.slideInfo ||
|
|
99
|
+
!this.renderCanvas ||
|
|
100
|
+
!this.inspector ||
|
|
101
|
+
!this.toolbar ||
|
|
102
|
+
!this.lowerLetterBox ||
|
|
103
|
+
!this.upperLetterBox ||
|
|
104
|
+
!this.leftLetterBox ||
|
|
105
|
+
!this.rightLetterBox)
|
|
106
|
+
return;
|
|
107
|
+
if (this.slideInfo.show) {
|
|
108
|
+
this.slideInfo.position = ValueObjects_1.Vector2.Add(this.slideInfo.position, new ValueObjects_1.Vector2(this.padding_x, 0));
|
|
109
|
+
}
|
|
110
|
+
if (this.renderCanvas.show) {
|
|
111
|
+
this.renderCanvas.position = ValueObjects_1.Vector2.Add(this.renderCanvas.position, new ValueObjects_1.Vector2(this.padding_x, 0));
|
|
112
|
+
}
|
|
113
|
+
if (this.inspector.show) {
|
|
114
|
+
this.inspector.position = ValueObjects_1.Vector2.Add(this.inspector.position, new ValueObjects_1.Vector2(this.padding_x, 0));
|
|
115
|
+
}
|
|
116
|
+
if (this.toolbar.show) {
|
|
117
|
+
this.toolbar.position = ValueObjects_1.Vector2.Add(this.toolbar.position, new ValueObjects_1.Vector2(this.padding_x, 0));
|
|
118
|
+
}
|
|
119
|
+
if (this.lowerLetterBox.show) {
|
|
120
|
+
this.lowerLetterBox.position = ValueObjects_1.Vector2.Add(this.lowerLetterBox.position, new ValueObjects_1.Vector2(this.padding_x, 0));
|
|
121
|
+
}
|
|
122
|
+
if (this.upperLetterBox.show) {
|
|
123
|
+
this.upperLetterBox.position = ValueObjects_1.Vector2.Add(this.upperLetterBox.position, new ValueObjects_1.Vector2(this.padding_x, 0));
|
|
124
|
+
}
|
|
125
|
+
if (this.leftLetterBox.show) {
|
|
126
|
+
this.leftLetterBox.position = ValueObjects_1.Vector2.Add(this.leftLetterBox.position, new ValueObjects_1.Vector2(this.padding_x, 0));
|
|
127
|
+
}
|
|
128
|
+
if (this.rightLetterBox.show) {
|
|
129
|
+
this.rightLetterBox.position = ValueObjects_1.Vector2.Add(this.rightLetterBox.position, new ValueObjects_1.Vector2(this.padding_x, 0));
|
|
130
|
+
}
|
|
131
|
+
}
|
|
132
|
+
layoutConsumptionOverlay(height, width) {
|
|
133
|
+
var _a;
|
|
134
|
+
if (!this.baseApp ||
|
|
135
|
+
!this.slideInfo ||
|
|
136
|
+
!this.renderCanvas ||
|
|
137
|
+
!this.inspector ||
|
|
138
|
+
!this.toolbar ||
|
|
139
|
+
!this.lowerLetterBox ||
|
|
140
|
+
!this.upperLetterBox ||
|
|
141
|
+
!this.leftLetterBox ||
|
|
142
|
+
!this.rightLetterBox)
|
|
143
|
+
return;
|
|
144
|
+
if (((_a = this.challenge) === null || _a === void 0 ? void 0 : _a.selectedChallenge) === "NONE" &&
|
|
145
|
+
!this.baseApp.slideText) {
|
|
146
|
+
this.disableContainer(this.slideInfo);
|
|
147
|
+
}
|
|
148
|
+
else {
|
|
149
|
+
this.slideInfo.position = new ValueObjects_1.Vector2(this.toolbarWidth + this.infoOverlayMargin, this.infoOverlayMargin);
|
|
150
|
+
this.slideInfo.size = new ValueObjects_1.Vector2(this.infoColumnWidth, -1);
|
|
151
|
+
this.slideInfo.show = true;
|
|
152
|
+
}
|
|
153
|
+
this.toolbar.position = new ValueObjects_1.Vector2(0, 0);
|
|
154
|
+
this.toolbar.size = new ValueObjects_1.Vector2(this.toolbarWidth, height);
|
|
155
|
+
this.toolbar.show = true;
|
|
156
|
+
const renderCanvasX = this.toolbarWidth;
|
|
157
|
+
this.renderCanvas.position = new ValueObjects_1.Vector2(renderCanvasX, 0);
|
|
158
|
+
const canvasSize = width - this.toolbarWidth;
|
|
159
|
+
this.renderCanvas.size = new ValueObjects_1.Vector2(canvasSize, height);
|
|
160
|
+
this.renderCanvas.show = true;
|
|
161
|
+
this.disableContainer(this.inspector);
|
|
162
|
+
this.disableContainer(this.lowerLetterBox);
|
|
163
|
+
this.disableContainer(this.upperLetterBox);
|
|
164
|
+
this.disableContainer(this.leftLetterBox);
|
|
165
|
+
this.disableContainer(this.rightLetterBox);
|
|
166
|
+
this.updatePositionForPadding();
|
|
167
|
+
}
|
|
168
|
+
layoutConsumptionSideBySide(height, width) {
|
|
169
|
+
var _a;
|
|
170
|
+
if (!this.baseApp ||
|
|
171
|
+
!this.slideInfo ||
|
|
172
|
+
!this.renderCanvas ||
|
|
173
|
+
!this.inspector ||
|
|
174
|
+
!this.toolbar ||
|
|
175
|
+
!this.lowerLetterBox ||
|
|
176
|
+
!this.upperLetterBox ||
|
|
177
|
+
!this.leftLetterBox ||
|
|
178
|
+
!this.rightLetterBox)
|
|
179
|
+
return;
|
|
180
|
+
if (((_a = this.challenge) === null || _a === void 0 ? void 0 : _a.selectedChallenge) === "NONE" &&
|
|
181
|
+
!this.baseApp.slideText) {
|
|
182
|
+
this.disableContainer(this.slideInfo);
|
|
183
|
+
this.toolbar.position = new ValueObjects_1.Vector2(0, 0);
|
|
184
|
+
this.toolbar.size = new ValueObjects_1.Vector2(this.toolbarWidth, height);
|
|
185
|
+
this.toolbar.show = true;
|
|
186
|
+
const renderCanvasX = this.toolbarWidth;
|
|
187
|
+
this.renderCanvas.position = new ValueObjects_1.Vector2(renderCanvasX, 0);
|
|
188
|
+
const canvasSize = width - renderCanvasX;
|
|
189
|
+
this.renderCanvas.size = new ValueObjects_1.Vector2(canvasSize, height);
|
|
190
|
+
this.renderCanvas.show = true;
|
|
191
|
+
}
|
|
192
|
+
else {
|
|
193
|
+
this.slideInfo.position = ValueObjects_1.Vector2.Zero();
|
|
194
|
+
this.slideInfo.size = new ValueObjects_1.Vector2(this.infoColumnWidth, height);
|
|
195
|
+
this.slideInfo.show = true;
|
|
196
|
+
this.toolbar.position = new ValueObjects_1.Vector2(this.infoColumnWidth, 0);
|
|
197
|
+
this.toolbar.size = new ValueObjects_1.Vector2(this.toolbarWidth, height);
|
|
198
|
+
this.toolbar.show = true;
|
|
199
|
+
const renderCanvasX = this.infoColumnWidth + this.toolbarWidth;
|
|
200
|
+
this.renderCanvas.position = new ValueObjects_1.Vector2(renderCanvasX, 0);
|
|
201
|
+
const canvasSize = width - renderCanvasX;
|
|
202
|
+
this.renderCanvas.size = new ValueObjects_1.Vector2(canvasSize, height);
|
|
203
|
+
this.renderCanvas.show = true;
|
|
204
|
+
}
|
|
205
|
+
this.disableContainer(this.inspector);
|
|
206
|
+
this.disableContainer(this.lowerLetterBox);
|
|
207
|
+
this.disableContainer(this.upperLetterBox);
|
|
208
|
+
this.disableContainer(this.leftLetterBox);
|
|
209
|
+
this.disableContainer(this.rightLetterBox);
|
|
210
|
+
this.updatePositionForPadding();
|
|
211
|
+
}
|
|
212
|
+
layoutForAuthoring(height, width) {
|
|
213
|
+
if (!this.baseApp ||
|
|
214
|
+
!this.slideInfo ||
|
|
215
|
+
!this.renderCanvas ||
|
|
216
|
+
!this.inspector ||
|
|
217
|
+
!this.toolbar ||
|
|
218
|
+
!this.lowerLetterBox ||
|
|
219
|
+
!this.upperLetterBox ||
|
|
220
|
+
!this.leftLetterBox ||
|
|
221
|
+
!this.rightLetterBox)
|
|
222
|
+
return;
|
|
223
|
+
this.slideInfo.position = ValueObjects_1.Vector2.Zero();
|
|
224
|
+
this.slideInfo.size = new ValueObjects_1.Vector2(this.infoColumnWidth, height);
|
|
225
|
+
this.slideInfo.show = true;
|
|
226
|
+
this.toolbar.position = new ValueObjects_1.Vector2(this.infoColumnWidth, 0);
|
|
227
|
+
this.toolbar.size = new ValueObjects_1.Vector2(this.toolbarWidth, height);
|
|
228
|
+
this.toolbar.show = true;
|
|
229
|
+
let inspectorWidth = width - height - this.infoColumnWidth - this.toolbarWidth;
|
|
230
|
+
if (inspectorWidth < this.inspectorColumnWidth_Min) {
|
|
231
|
+
inspectorWidth = this.inspectorColumnWidth_Min;
|
|
232
|
+
}
|
|
233
|
+
else if (inspectorWidth > this.inspectorColumnWidth_Max) {
|
|
234
|
+
inspectorWidth = this.inspectorColumnWidth_Max;
|
|
235
|
+
}
|
|
236
|
+
this.inspector.size = new ValueObjects_1.Vector2(inspectorWidth, height);
|
|
237
|
+
this.inspector.show = true;
|
|
238
|
+
const renderCanvasX = this.infoColumnWidth + this.toolbarWidth;
|
|
239
|
+
this.renderCanvas.position = new ValueObjects_1.Vector2(renderCanvasX, 0);
|
|
240
|
+
const canvasWidth = width - inspectorWidth - this.toolbarWidth - this.infoColumnWidth;
|
|
241
|
+
this.renderCanvas.size = new ValueObjects_1.Vector2(canvasWidth, height);
|
|
242
|
+
this.renderCanvas.show = true;
|
|
243
|
+
const inspectorX = this.infoColumnWidth + this.toolbarWidth + canvasWidth;
|
|
244
|
+
this.inspector.position = new ValueObjects_1.Vector2(inspectorX, 0);
|
|
245
|
+
if (canvasWidth === height) {
|
|
246
|
+
this.disableContainer(this.lowerLetterBox);
|
|
247
|
+
this.disableContainer(this.upperLetterBox);
|
|
248
|
+
this.disableContainer(this.leftLetterBox);
|
|
249
|
+
this.disableContainer(this.rightLetterBox);
|
|
250
|
+
}
|
|
251
|
+
else if (canvasWidth < height) {
|
|
252
|
+
const halfGap = Math.floor(0.5 * (height - canvasWidth));
|
|
253
|
+
this.upperLetterBox.position = new ValueObjects_1.Vector2(renderCanvasX, 0);
|
|
254
|
+
this.upperLetterBox.size = new ValueObjects_1.Vector2(canvasWidth, halfGap);
|
|
255
|
+
this.upperLetterBox.show = true;
|
|
256
|
+
this.lowerLetterBox.position = new ValueObjects_1.Vector2(renderCanvasX, height - halfGap);
|
|
257
|
+
this.lowerLetterBox.size = new ValueObjects_1.Vector2(canvasWidth, halfGap);
|
|
258
|
+
this.lowerLetterBox.show = true;
|
|
259
|
+
this.disableContainer(this.leftLetterBox);
|
|
260
|
+
this.disableContainer(this.rightLetterBox);
|
|
261
|
+
}
|
|
262
|
+
else if (canvasWidth > height) {
|
|
263
|
+
const halfGap = Math.floor(0.5 * (canvasWidth - height));
|
|
264
|
+
this.leftLetterBox.position = new ValueObjects_1.Vector2(renderCanvasX, 0);
|
|
265
|
+
this.leftLetterBox.size = new ValueObjects_1.Vector2(halfGap, height);
|
|
266
|
+
this.leftLetterBox.show = true;
|
|
267
|
+
this.rightLetterBox.position = new ValueObjects_1.Vector2(renderCanvasX + canvasWidth - halfGap, 0);
|
|
268
|
+
this.rightLetterBox.size = new ValueObjects_1.Vector2(halfGap, height);
|
|
269
|
+
this.rightLetterBox.show = true;
|
|
270
|
+
this.disableContainer(this.lowerLetterBox);
|
|
271
|
+
this.disableContainer(this.upperLetterBox);
|
|
272
|
+
}
|
|
273
|
+
this.updatePositionForPadding();
|
|
274
|
+
}
|
|
275
|
+
layoutForZSpaceEmulation(height, width) {
|
|
276
|
+
if (!this.baseApp ||
|
|
277
|
+
!this.slideInfo ||
|
|
278
|
+
!this.renderCanvas ||
|
|
279
|
+
!this.inspector ||
|
|
280
|
+
!this.toolbar ||
|
|
281
|
+
!this.lowerLetterBox ||
|
|
282
|
+
!this.upperLetterBox ||
|
|
283
|
+
!this.leftLetterBox ||
|
|
284
|
+
!this.rightLetterBox)
|
|
285
|
+
return;
|
|
286
|
+
this.renderCanvas.position = new ValueObjects_1.Vector2(0, 0);
|
|
287
|
+
this.renderCanvas.size = new ValueObjects_1.Vector2(width, height);
|
|
288
|
+
this.renderCanvas.show = true;
|
|
289
|
+
this.disableContainer(this.slideInfo);
|
|
290
|
+
this.disableContainer(this.toolbar);
|
|
291
|
+
this.disableContainer(this.inspector);
|
|
292
|
+
this.disableContainer(this.lowerLetterBox);
|
|
293
|
+
this.disableContainer(this.upperLetterBox);
|
|
294
|
+
this.disableContainer(this.leftLetterBox);
|
|
295
|
+
this.disableContainer(this.rightLetterBox);
|
|
296
|
+
}
|
|
297
|
+
getContainerByID(id) {
|
|
298
|
+
if (!this.framedScreen) {
|
|
299
|
+
console.warn("No framed screen");
|
|
300
|
+
return;
|
|
301
|
+
}
|
|
302
|
+
const container = this.framedScreen.getContainerByID(id);
|
|
303
|
+
if (!container) {
|
|
304
|
+
console.warn("Unable to find container by ID: " + container);
|
|
305
|
+
}
|
|
306
|
+
return container;
|
|
307
|
+
}
|
|
308
|
+
}
|
|
309
|
+
exports.StandardLayoutUC = StandardLayoutUC;
|
|
310
|
+
StandardLayoutUC.type = "StandardLayoutUC";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./StandardLayoutUC";
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
|
5
|
+
}) : (function(o, m, k, k2) {
|
|
6
|
+
if (k2 === undefined) k2 = k;
|
|
7
|
+
o[k2] = m[k];
|
|
8
|
+
}));
|
|
9
|
+
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
10
|
+
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
11
|
+
};
|
|
12
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
13
|
+
__exportStar(require("./StandardLayoutUC"), exports);
|