phoenix-ui-components 2.13.0 → 2.14.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/README.md +2 -9
- package/dist/README.md +2 -9
- package/dist/components/phoenix-menu/config/config-slider/config-slider.component.d.ts +5 -0
- package/dist/components/phoenix-ui.module.d.ts +3 -4
- package/dist/components/ui-menu/overlay/overlay.component.d.ts +5 -1
- package/dist/esm2020/components/embed-menu/experiment-link/experiment-link.component.mjs +5 -2
- package/dist/esm2020/components/phoenix-menu/config/config-slider/config-slider.component.mjs +25 -1
- package/dist/esm2020/components/phoenix-menu/phoenix-menu-item/phoenix-menu-item.component.mjs +69 -66
- package/dist/esm2020/components/phoenix-ui.module.mjs +1 -5
- package/dist/esm2020/components/ui-menu/animate-camera/animate-camera.component.mjs +25 -8
- package/dist/esm2020/components/ui-menu/experiment-info/experiment-info.component.mjs +2 -2
- package/dist/esm2020/components/ui-menu/overlay/overlay.component.mjs +14 -3
- package/dist/esm2020/components/ui-menu/overlay-view/overlay-view-window/overlay-view-window.component.mjs +4 -4
- package/dist/fesm2015/phoenix-ui-components.mjs +137 -83
- package/dist/fesm2015/phoenix-ui-components.mjs.map +1 -1
- package/dist/fesm2020/phoenix-ui-components.mjs +137 -83
- package/dist/fesm2020/phoenix-ui-components.mjs.map +1 -1
- package/package.json +11 -12
|
@@ -14,8 +14,6 @@ import * as i4 from '@angular/material/slide-toggle';
|
|
|
14
14
|
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
|
|
15
15
|
import * as i4$1 from '@angular/material/checkbox';
|
|
16
16
|
import { MatCheckboxModule } from '@angular/material/checkbox';
|
|
17
|
-
import * as i6 from '@rp3e11/ngx-slider';
|
|
18
|
-
import { NgxSliderModule } from '@rp3e11/ngx-slider';
|
|
19
17
|
import { EventDisplay, SceneManager, PrettySymbols, Edm4hepJsonLoader, JiveXMLLoader, CMSLoader, readZipFile, VRManager, XRSessionType, ARManager, phoenixURLOptions, ActiveVariable } from 'phoenix-event-display';
|
|
20
18
|
import * as i3$1 from '@angular/material/menu';
|
|
21
19
|
import { MatMenuModule } from '@angular/material/menu';
|
|
@@ -70,7 +68,9 @@ class ConfigSliderComponent {
|
|
|
70
68
|
constructor() {
|
|
71
69
|
this.value = 0;
|
|
72
70
|
this.min = 0;
|
|
71
|
+
this.oldMin = 0;
|
|
73
72
|
this.max = 100;
|
|
73
|
+
this.oldMax = 0;
|
|
74
74
|
this.step = 1;
|
|
75
75
|
this.allowCustomValue = false;
|
|
76
76
|
this.onChange = new EventEmitter();
|
|
@@ -78,6 +78,28 @@ class ConfigSliderComponent {
|
|
|
78
78
|
onValueChange(value) {
|
|
79
79
|
value && this.onChange.emit(value);
|
|
80
80
|
}
|
|
81
|
+
toggleMinCut(change) {
|
|
82
|
+
const value = change.checked;
|
|
83
|
+
if (value) {
|
|
84
|
+
this.min = this.oldMin;
|
|
85
|
+
}
|
|
86
|
+
else {
|
|
87
|
+
this.oldMin = this.min;
|
|
88
|
+
this.min = Number.MIN_SAFE_INTEGER;
|
|
89
|
+
}
|
|
90
|
+
// We should probably disable the min input too, and change text to be infinity symbol or something?
|
|
91
|
+
}
|
|
92
|
+
toggleMaxCut(change) {
|
|
93
|
+
const value = change.checked;
|
|
94
|
+
if (value) {
|
|
95
|
+
this.max = this.oldMax;
|
|
96
|
+
}
|
|
97
|
+
else {
|
|
98
|
+
this.oldMax = this.max;
|
|
99
|
+
this.max = Number.MAX_SAFE_INTEGER;
|
|
100
|
+
}
|
|
101
|
+
// We should probably disable the min input too, and change text to be infinity symbol or something?
|
|
102
|
+
}
|
|
81
103
|
}
|
|
82
104
|
ConfigSliderComponent.ɵfac = function ConfigSliderComponent_Factory(t) { return new (t || ConfigSliderComponent)(); };
|
|
83
105
|
ConfigSliderComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ConfigSliderComponent, selectors: [["app-config-slider"]], inputs: { value: "value", min: "min", max: "max", step: "step", allowCustomValue: "allowCustomValue" }, outputs: { onChange: "onChange" }, decls: 4, vars: 5, consts: [[1, "d-flex", "flex-row", "align-items-center"], ["thumbLabel", "", 1, "mx-2", 3, "min", "max", "step"], ["matSliderThumb", "", 3, "value", "valueChange"], ["class", "config-slider-input", "type", "number", 3, "value", "input", 4, "ngIf"], ["type", "number", 1, "config-slider-input", 3, "value", "input"]], template: function ConfigSliderComponent_Template(rf, ctx) { if (rf & 1) {
|
|
@@ -166,8 +188,8 @@ function PhoenixMenuItemComponent_div_7_div_4_Template(rf, ctx) { if (rf & 1) {
|
|
|
166
188
|
i0.ɵɵelementEnd();
|
|
167
189
|
} }
|
|
168
190
|
const _c1$4 = function (a0) { return { "font-weight-bold w-100": a0 }; };
|
|
169
|
-
function
|
|
170
|
-
i0.ɵɵelementStart(0, "
|
|
191
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_label_1_Template(rf, ctx) { if (rf & 1) {
|
|
192
|
+
i0.ɵɵelementStart(0, "label", 26);
|
|
171
193
|
i0.ɵɵtext(1);
|
|
172
194
|
i0.ɵɵelementEnd();
|
|
173
195
|
} if (rf & 2) {
|
|
@@ -176,28 +198,28 @@ function PhoenixMenuItemComponent_div_7_ng_container_6_label_1_span_1_Template(r
|
|
|
176
198
|
i0.ɵɵadvance(1);
|
|
177
199
|
i0.ɵɵtextInterpolate1(" ", config_r15.label, " ");
|
|
178
200
|
} }
|
|
179
|
-
function
|
|
201
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_mat_checkbox_1_Template(rf, ctx) { if (rf & 1) {
|
|
180
202
|
const _r28 = i0.ɵɵgetCurrentView();
|
|
181
203
|
i0.ɵɵelementStart(0, "mat-checkbox", 9);
|
|
182
|
-
i0.ɵɵlistener("change", function
|
|
204
|
+
i0.ɵɵlistener("change", function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_mat_checkbox_1_Template_mat_checkbox_change_0_listener($event) { i0.ɵɵrestoreView(_r28); const config_r15 = i0.ɵɵnextContext(3).$implicit; config_r15.onChange($event.checked); return i0.ɵɵresetView(config_r15.isChecked = $event.checked); });
|
|
183
205
|
i0.ɵɵelementEnd();
|
|
184
206
|
} if (rf & 2) {
|
|
185
207
|
const config_r15 = i0.ɵɵnextContext(3).$implicit;
|
|
186
208
|
i0.ɵɵproperty("checked", config_r15.isChecked);
|
|
187
209
|
} }
|
|
188
|
-
function
|
|
210
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_app_config_slider_2_Template(rf, ctx) { if (rf & 1) {
|
|
189
211
|
const _r32 = i0.ɵɵgetCurrentView();
|
|
190
212
|
i0.ɵɵelementStart(0, "app-config-slider", 34);
|
|
191
|
-
i0.ɵɵlistener("onChange", function
|
|
213
|
+
i0.ɵɵlistener("onChange", function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_app_config_slider_2_Template_app_config_slider_onChange_0_listener($event) { i0.ɵɵrestoreView(_r32); const config_r15 = i0.ɵɵnextContext(3).$implicit; config_r15.onChange($event); return i0.ɵɵresetView(config_r15.value = $event); });
|
|
192
214
|
i0.ɵɵelementEnd();
|
|
193
215
|
} if (rf & 2) {
|
|
194
216
|
const config_r15 = i0.ɵɵnextContext(3).$implicit;
|
|
195
217
|
i0.ɵɵproperty("value", config_r15.value)("min", config_r15.min)("max", config_r15.max)("step", config_r15.step)("allowCustomValue", config_r15.allowCustomValue);
|
|
196
218
|
} }
|
|
197
|
-
function
|
|
219
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_button_3_Template(rf, ctx) { if (rf & 1) {
|
|
198
220
|
const _r36 = i0.ɵɵgetCurrentView();
|
|
199
221
|
i0.ɵɵelementStart(0, "button", 35);
|
|
200
|
-
i0.ɵɵlistener("click", function
|
|
222
|
+
i0.ɵɵlistener("click", function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_button_3_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r36); const config_r15 = i0.ɵɵnextContext(3).$implicit; return i0.ɵɵresetView(config_r15.onClick()); });
|
|
201
223
|
i0.ɵɵtext(1);
|
|
202
224
|
i0.ɵɵelementEnd();
|
|
203
225
|
} if (rf & 2) {
|
|
@@ -205,70 +227,74 @@ function PhoenixMenuItemComponent_div_7_ng_container_6_label_1_div_2_button_3_Te
|
|
|
205
227
|
i0.ɵɵadvance(1);
|
|
206
228
|
i0.ɵɵtextInterpolate1(" ", config_r15.label, " ");
|
|
207
229
|
} }
|
|
208
|
-
function
|
|
230
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_input_4_Template(rf, ctx) { if (rf & 1) {
|
|
209
231
|
const _r40 = i0.ɵɵgetCurrentView();
|
|
210
232
|
i0.ɵɵelementStart(0, "input", 36);
|
|
211
|
-
i0.ɵɵlistener("input", function
|
|
233
|
+
i0.ɵɵlistener("input", function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_input_4_Template_input_input_0_listener($event) { i0.ɵɵrestoreView(_r40); const config_r15 = i0.ɵɵnextContext(3).$implicit; config_r15.onChange($event.target.value); return i0.ɵɵresetView(config_r15.color = $event.target.value); });
|
|
212
234
|
i0.ɵɵelementEnd();
|
|
213
235
|
} if (rf & 2) {
|
|
214
236
|
const config_r15 = i0.ɵɵnextContext(3).$implicit;
|
|
215
237
|
i0.ɵɵproperty("value", config_r15.color);
|
|
216
238
|
} }
|
|
217
|
-
|
|
218
|
-
function PhoenixMenuItemComponent_div_7_ng_container_6_label_1_div_2_div_5_Template(rf, ctx) { if (rf & 1) {
|
|
239
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_div_5_Template(rf, ctx) { if (rf & 1) {
|
|
219
240
|
const _r44 = i0.ɵɵgetCurrentView();
|
|
220
|
-
i0.ɵɵelementStart(0, "div", 37)(1, "div", 38)(2, "
|
|
221
|
-
i0.ɵɵlistener("
|
|
241
|
+
i0.ɵɵelementStart(0, "div", 37)(1, "div", 38)(2, "mat-checkbox", 9);
|
|
242
|
+
i0.ɵɵlistener("change", function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_div_5_Template_mat_checkbox_change_2_listener($event) { i0.ɵɵrestoreView(_r44); const config_r15 = i0.ɵɵnextContext(3).$implicit; return i0.ɵɵresetView(config_r15.setEnableMin($event.checked)); });
|
|
222
243
|
i0.ɵɵelementEnd();
|
|
223
|
-
i0.ɵɵelementStart(3, "
|
|
224
|
-
i0.ɵɵlistener("
|
|
225
|
-
i0.ɵɵelementEnd()();
|
|
226
|
-
i0.ɵɵelementStart(4, "ngx-slider", 41);
|
|
227
|
-
i0.ɵɵlistener("valueChange", function PhoenixMenuItemComponent_div_7_ng_container_6_label_1_div_2_div_5_Template_ngx_slider_valueChange_4_listener($event) { i0.ɵɵrestoreView(_r44); const config_r15 = i0.ɵɵnextContext(3).$implicit; return i0.ɵɵresetView(config_r15.value = $event); })("highValueChange", function PhoenixMenuItemComponent_div_7_ng_container_6_label_1_div_2_div_5_Template_ngx_slider_highValueChange_4_listener($event) { i0.ɵɵrestoreView(_r44); const config_r15 = i0.ɵɵnextContext(3).$implicit; return i0.ɵɵresetView(config_r15.highValue = $event); })("userChange", function PhoenixMenuItemComponent_div_7_ng_container_6_label_1_div_2_div_5_Template_ngx_slider_userChange_4_listener($event) { i0.ɵɵrestoreView(_r44); const config_r15 = i0.ɵɵnextContext(3).$implicit; return i0.ɵɵresetView(config_r15.onChange($event)); });
|
|
244
|
+
i0.ɵɵelementStart(3, "mat-checkbox", 9);
|
|
245
|
+
i0.ɵɵlistener("change", function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_div_5_Template_mat_checkbox_change_3_listener($event) { i0.ɵɵrestoreView(_r44); const config_r15 = i0.ɵɵnextContext(3).$implicit; return i0.ɵɵresetView(config_r15.setEnableMax($event.checked)); });
|
|
228
246
|
i0.ɵɵelementEnd()();
|
|
247
|
+
i0.ɵɵelementStart(4, "div", 38)(5, "input", 39);
|
|
248
|
+
i0.ɵɵlistener("input", function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_div_5_Template_input_input_5_listener($event) { i0.ɵɵrestoreView(_r44); const config_r15 = i0.ɵɵnextContext(3).$implicit; config_r15.value = $event.target.value; return i0.ɵɵresetView(config_r15.onChange(config_r15)); });
|
|
249
|
+
i0.ɵɵelementEnd();
|
|
250
|
+
i0.ɵɵelementStart(6, "input", 40);
|
|
251
|
+
i0.ɵɵlistener("input", function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_div_5_Template_input_input_6_listener($event) { i0.ɵɵrestoreView(_r44); const config_r15 = i0.ɵɵnextContext(3).$implicit; config_r15.highValue = $event.target.value; return i0.ɵɵresetView(config_r15.onChange(config_r15)); });
|
|
252
|
+
i0.ɵɵelementEnd()()();
|
|
229
253
|
} if (rf & 2) {
|
|
230
254
|
const config_r15 = i0.ɵɵnextContext(3).$implicit;
|
|
231
255
|
i0.ɵɵadvance(2);
|
|
256
|
+
i0.ɵɵproperty("checked", config_r15.enableMin);
|
|
257
|
+
i0.ɵɵadvance(1);
|
|
258
|
+
i0.ɵɵproperty("checked", config_r15.enableMax);
|
|
259
|
+
i0.ɵɵadvance(2);
|
|
232
260
|
i0.ɵɵproperty("value", config_r15.value);
|
|
233
261
|
i0.ɵɵadvance(1);
|
|
234
262
|
i0.ɵɵproperty("value", config_r15.highValue);
|
|
235
|
-
i0.ɵɵadvance(1);
|
|
236
|
-
i0.ɵɵproperty("value", config_r15.value)("highValue", config_r15.highValue)("options", i0.ɵɵpureFunction3(5, _c2$1, config_r15.min, config_r15.max, config_r15.step));
|
|
237
263
|
} }
|
|
238
|
-
function
|
|
239
|
-
i0.ɵɵelementStart(0, "option",
|
|
264
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_select_6_option_1_Template(rf, ctx) { if (rf & 1) {
|
|
265
|
+
i0.ɵɵelementStart(0, "option", 43);
|
|
240
266
|
i0.ɵɵtext(1);
|
|
241
267
|
i0.ɵɵelementEnd();
|
|
242
268
|
} if (rf & 2) {
|
|
243
|
-
const
|
|
244
|
-
i0.ɵɵproperty("value",
|
|
269
|
+
const singleOption_r53 = ctx.$implicit;
|
|
270
|
+
i0.ɵɵproperty("value", singleOption_r53);
|
|
245
271
|
i0.ɵɵadvance(1);
|
|
246
|
-
i0.ɵɵtextInterpolate1(" ",
|
|
272
|
+
i0.ɵɵtextInterpolate1(" ", singleOption_r53, " ");
|
|
247
273
|
} }
|
|
248
|
-
function
|
|
249
|
-
const
|
|
250
|
-
i0.ɵɵelementStart(0, "select",
|
|
251
|
-
i0.ɵɵlistener("change", function
|
|
252
|
-
i0.ɵɵtemplate(1,
|
|
274
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_select_6_Template(rf, ctx) { if (rf & 1) {
|
|
275
|
+
const _r56 = i0.ɵɵgetCurrentView();
|
|
276
|
+
i0.ɵɵelementStart(0, "select", 41);
|
|
277
|
+
i0.ɵɵlistener("change", function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_select_6_Template_select_change_0_listener($event) { i0.ɵɵrestoreView(_r56); const config_r15 = i0.ɵɵnextContext(3).$implicit; return i0.ɵɵresetView(config_r15.onChange($event.target.value)); });
|
|
278
|
+
i0.ɵɵtemplate(1, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_select_6_option_1_Template, 2, 2, "option", 42);
|
|
253
279
|
i0.ɵɵelementEnd();
|
|
254
280
|
} if (rf & 2) {
|
|
255
281
|
const config_r15 = i0.ɵɵnextContext(3).$implicit;
|
|
256
282
|
i0.ɵɵadvance(1);
|
|
257
283
|
i0.ɵɵproperty("ngForOf", config_r15.options);
|
|
258
284
|
} }
|
|
259
|
-
const
|
|
260
|
-
function
|
|
285
|
+
const _c2$1 = function (a0) { return { "p-0": a0 }; };
|
|
286
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_Template(rf, ctx) { if (rf & 1) {
|
|
261
287
|
i0.ɵɵelementStart(0, "div", 27);
|
|
262
|
-
i0.ɵɵtemplate(1,
|
|
263
|
-
i0.ɵɵtemplate(2,
|
|
264
|
-
i0.ɵɵtemplate(3,
|
|
265
|
-
i0.ɵɵtemplate(4,
|
|
266
|
-
i0.ɵɵtemplate(5,
|
|
267
|
-
i0.ɵɵtemplate(6,
|
|
288
|
+
i0.ɵɵtemplate(1, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_mat_checkbox_1_Template, 1, 1, "mat-checkbox", 28);
|
|
289
|
+
i0.ɵɵtemplate(2, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_app_config_slider_2_Template, 1, 5, "app-config-slider", 29);
|
|
290
|
+
i0.ɵɵtemplate(3, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_button_3_Template, 2, 1, "button", 30);
|
|
291
|
+
i0.ɵɵtemplate(4, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_input_4_Template, 1, 1, "input", 31);
|
|
292
|
+
i0.ɵɵtemplate(5, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_div_5_Template, 7, 4, "div", 32);
|
|
293
|
+
i0.ɵɵtemplate(6, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_select_6_Template, 2, 1, "select", 33);
|
|
268
294
|
i0.ɵɵelementEnd();
|
|
269
295
|
} if (rf & 2) {
|
|
270
296
|
const config_r15 = i0.ɵɵnextContext(2).$implicit;
|
|
271
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(7,
|
|
297
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(7, _c2$1, config_r15.type === "button"));
|
|
272
298
|
i0.ɵɵadvance(1);
|
|
273
299
|
i0.ɵɵproperty("ngSwitchCase", "checkbox");
|
|
274
300
|
i0.ɵɵadvance(1);
|
|
@@ -282,10 +308,10 @@ function PhoenixMenuItemComponent_div_7_ng_container_6_label_1_div_2_Template(rf
|
|
|
282
308
|
i0.ɵɵadvance(1);
|
|
283
309
|
i0.ɵɵproperty("ngSwitchCase", "select");
|
|
284
310
|
} }
|
|
285
|
-
function
|
|
286
|
-
i0.ɵɵelementStart(0, "
|
|
287
|
-
i0.ɵɵtemplate(1,
|
|
288
|
-
i0.ɵɵtemplate(2,
|
|
311
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_Template(rf, ctx) { if (rf & 1) {
|
|
312
|
+
i0.ɵɵelementStart(0, "div", 23);
|
|
313
|
+
i0.ɵɵtemplate(1, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_label_1_Template, 2, 4, "label", 24);
|
|
314
|
+
i0.ɵɵtemplate(2, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_Template, 7, 9, "div", 25);
|
|
289
315
|
i0.ɵɵelementEnd();
|
|
290
316
|
} if (rf & 2) {
|
|
291
317
|
const config_r15 = i0.ɵɵnextContext().$implicit;
|
|
@@ -296,7 +322,7 @@ function PhoenixMenuItemComponent_div_7_ng_container_6_label_1_Template(rf, ctx)
|
|
|
296
322
|
} }
|
|
297
323
|
function PhoenixMenuItemComponent_div_7_ng_container_6_Template(rf, ctx) { if (rf & 1) {
|
|
298
324
|
i0.ɵɵelementContainerStart(0, 21);
|
|
299
|
-
i0.ɵɵtemplate(1,
|
|
325
|
+
i0.ɵɵtemplate(1, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_Template, 3, 2, "div", 22);
|
|
300
326
|
i0.ɵɵelementContainerEnd();
|
|
301
327
|
} if (rf & 2) {
|
|
302
328
|
const config_r15 = ctx.$implicit;
|
|
@@ -304,11 +330,11 @@ function PhoenixMenuItemComponent_div_7_ng_container_6_Template(rf, ctx) { if (r
|
|
|
304
330
|
i0.ɵɵadvance(1);
|
|
305
331
|
i0.ɵɵproperty("ngIf", !config_r15.hidden);
|
|
306
332
|
} }
|
|
307
|
-
const
|
|
333
|
+
const _c3$1 = function (a0) { return { "top.px": a0 }; };
|
|
308
334
|
function PhoenixMenuItemComponent_div_7_Template(rf, ctx) { if (rf & 1) {
|
|
309
|
-
const
|
|
335
|
+
const _r61 = i0.ɵɵgetCurrentView();
|
|
310
336
|
i0.ɵɵelementStart(0, "div")(1, "button", 15);
|
|
311
|
-
i0.ɵɵlistener("click", function PhoenixMenuItemComponent_div_7_Template_button_click_1_listener() { i0.ɵɵrestoreView(
|
|
337
|
+
i0.ɵɵlistener("click", function PhoenixMenuItemComponent_div_7_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r61); const ctx_r60 = i0.ɵɵnextContext(); ctx_r60.calculateConfigTop(); return i0.ɵɵresetView(ctx_r60.currentNode.configActive = !ctx_r60.currentNode.configActive); });
|
|
312
338
|
i0.ɵɵnamespaceSVG();
|
|
313
339
|
i0.ɵɵelementStart(2, "svg");
|
|
314
340
|
i0.ɵɵelement(3, "use", 16);
|
|
@@ -323,32 +349,32 @@ function PhoenixMenuItemComponent_div_7_Template(rf, ctx) { if (rf & 1) {
|
|
|
323
349
|
i0.ɵɵadvance(4);
|
|
324
350
|
i0.ɵɵproperty("ngIf", ctx_r4.currentNode.configActive);
|
|
325
351
|
i0.ɵɵadvance(1);
|
|
326
|
-
i0.ɵɵproperty("hidden", !ctx_r4.currentNode.configActive)("ngStyle", i0.ɵɵpureFunction1(4,
|
|
352
|
+
i0.ɵɵproperty("hidden", !ctx_r4.currentNode.configActive)("ngStyle", i0.ɵɵpureFunction1(4, _c3$1, ctx_r4.configTop));
|
|
327
353
|
i0.ɵɵadvance(1);
|
|
328
354
|
i0.ɵɵproperty("ngForOf", ctx_r4.castConfigsToAny(ctx_r4.currentNode.configs));
|
|
329
355
|
} }
|
|
330
|
-
const
|
|
356
|
+
const _c4$1 = function (a0) { return { expanded: a0 }; };
|
|
331
357
|
function PhoenixMenuItemComponent_button_8_Template(rf, ctx) { if (rf & 1) {
|
|
332
|
-
const
|
|
333
|
-
i0.ɵɵelementStart(0, "button",
|
|
334
|
-
i0.ɵɵlistener("click", function PhoenixMenuItemComponent_button_8_Template_button_click_0_listener() { i0.ɵɵrestoreView(
|
|
358
|
+
const _r63 = i0.ɵɵgetCurrentView();
|
|
359
|
+
i0.ɵɵelementStart(0, "button", 44);
|
|
360
|
+
i0.ɵɵlistener("click", function PhoenixMenuItemComponent_button_8_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r63); const ctx_r62 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r62.currentNode.childrenActive = !ctx_r62.currentNode.childrenActive); });
|
|
335
361
|
i0.ɵɵnamespaceSVG();
|
|
336
362
|
i0.ɵɵelementStart(1, "svg");
|
|
337
|
-
i0.ɵɵelement(2, "use",
|
|
363
|
+
i0.ɵɵelement(2, "use", 45);
|
|
338
364
|
i0.ɵɵelementEnd()();
|
|
339
365
|
} if (rf & 2) {
|
|
340
366
|
const ctx_r5 = i0.ɵɵnextContext();
|
|
341
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(1,
|
|
367
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(1, _c4$1, ctx_r5.currentNode.childrenActive));
|
|
342
368
|
} }
|
|
343
369
|
function PhoenixMenuItemComponent_div_9_app_phoenix_menu_item_1_Template(rf, ctx) { if (rf & 1) {
|
|
344
|
-
i0.ɵɵelement(0, "app-phoenix-menu-item",
|
|
370
|
+
i0.ɵɵelement(0, "app-phoenix-menu-item", 48);
|
|
345
371
|
} if (rf & 2) {
|
|
346
|
-
const
|
|
347
|
-
i0.ɵɵproperty("currentNode",
|
|
372
|
+
const childNode_r65 = ctx.$implicit;
|
|
373
|
+
i0.ɵɵproperty("currentNode", childNode_r65);
|
|
348
374
|
} }
|
|
349
375
|
function PhoenixMenuItemComponent_div_9_Template(rf, ctx) { if (rf & 1) {
|
|
350
|
-
i0.ɵɵelementStart(0, "div",
|
|
351
|
-
i0.ɵɵtemplate(1, PhoenixMenuItemComponent_div_9_app_phoenix_menu_item_1_Template, 1, 1, "app-phoenix-menu-item",
|
|
376
|
+
i0.ɵɵelementStart(0, "div", 46);
|
|
377
|
+
i0.ɵɵtemplate(1, PhoenixMenuItemComponent_div_9_app_phoenix_menu_item_1_Template, 1, 1, "app-phoenix-menu-item", 47);
|
|
352
378
|
i0.ɵɵelementEnd();
|
|
353
379
|
} if (rf & 2) {
|
|
354
380
|
const ctx_r6 = i0.ɵɵnextContext();
|
|
@@ -377,7 +403,7 @@ PhoenixMenuItemComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Ph
|
|
|
377
403
|
} if (rf & 2) {
|
|
378
404
|
let _t;
|
|
379
405
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.phoenixMenuItem = _t.first);
|
|
380
|
-
} }, inputs: { currentNode: "currentNode" }, decls: 10, vars: 5, consts: [[1, "phoenix-menu-item"], ["phoenixMenuItem", ""], [1, "phoenix-menu-item-left", "align-items-center"], [4, "ngIf", "ngIfElse"], ["nodeName", ""], [1, "phoenix-menu-item-right"], [4, "ngIf"], ["class", "icon-wrapper icon-button btn-blank item-expand", "data-testid", "dropdown", 3, "ngClass", "click", 4, "ngIf"], ["class", "phoenix-menu-children", 4, "ngIf"], [3, "checked", "change"], [4, "ngTemplateOutlet"], [1, "d-flex", "w-100", "align-items-center"], ["class", "icon-wrapper item-icon", 4, "ngIf"], [1, "item-name", 3, "title"], [1, "icon-wrapper", "item-icon"], [1, "icon-wrapper", "icon-button", "btn-blank", "item-settings", 3, "click"], ["href", "assets/icons/gear.svg#gear"], ["class", "item-config-backdrop", 3, "click", 4, "ngIf"], [1, "item-config", 3, "hidden", "ngStyle"], [3, "ngSwitch", 4, "ngFor", "ngForOf"], [1, "item-config-backdrop", 3, "click"], [3, "ngSwitch"], ["class", "item-config-single", 4, "ngIf"], [1, "item-config-single"], ["class", "item-config-label", 3, "ngClass", 4, "ngIf"], ["class", "item-config-data", 3, "ngClass", 4, "ngIf"], [1, "item-config-label", 3, "ngClass"], [1, "item-config-data", 3, "ngClass"], [3, "checked", "change", 4, "ngSwitchCase"], [3, "value", "min", "max", "step", "allowCustomValue", "onChange", 4, "ngSwitchCase"], ["class", "w-100", "mat-button", "", "mat-stroked-button", "", 3, "click", 4, "ngSwitchCase"], ["type", "color", 3, "value", "input", 4, "ngSwitchCase"], ["class", "range-slider", 4, "ngSwitchCase"], ["class", "w-100", 3, "change", 4, "ngSwitchCase"], [3, "value", "min", "max", "step", "allowCustomValue", "onChange"], ["mat-button", "", "mat-stroked-button", "", 1, "w-100", 3, "click"], ["type", "color", 3, "value", "input"], [1, "range-slider"], [1, "range-slider-inputs", "d-flex", "justify-content-between"], ["type", "number", "placeholder", "Min", 1, "form-control", "form-control-sm", 3, "value", "input"], ["type", "number", "placeholder", "Max", 1, "form-control", "form-control-sm", 3, "value", "input"], [
|
|
406
|
+
} }, inputs: { currentNode: "currentNode" }, decls: 10, vars: 5, consts: [[1, "phoenix-menu-item"], ["phoenixMenuItem", ""], [1, "phoenix-menu-item-left", "align-items-center"], [4, "ngIf", "ngIfElse"], ["nodeName", ""], [1, "phoenix-menu-item-right"], [4, "ngIf"], ["class", "icon-wrapper icon-button btn-blank item-expand", "data-testid", "dropdown", 3, "ngClass", "click", 4, "ngIf"], ["class", "phoenix-menu-children", 4, "ngIf"], [3, "checked", "change"], [4, "ngTemplateOutlet"], [1, "d-flex", "w-100", "align-items-center"], ["class", "icon-wrapper item-icon", 4, "ngIf"], [1, "item-name", 3, "title"], [1, "icon-wrapper", "item-icon"], [1, "icon-wrapper", "icon-button", "btn-blank", "item-settings", 3, "click"], ["href", "assets/icons/gear.svg#gear"], ["class", "item-config-backdrop", 3, "click", 4, "ngIf"], [1, "item-config", 3, "hidden", "ngStyle"], [3, "ngSwitch", 4, "ngFor", "ngForOf"], [1, "item-config-backdrop", 3, "click"], [3, "ngSwitch"], ["class", "item-config-single", 4, "ngIf"], [1, "item-config-single"], ["class", "item-config-label", "for", "item-config-field", 3, "ngClass", 4, "ngIf"], ["class", "item-config-data", 3, "ngClass", 4, "ngIf"], ["for", "item-config-field", 1, "item-config-label", 3, "ngClass"], [1, "item-config-data", 3, "ngClass"], [3, "checked", "change", 4, "ngSwitchCase"], [3, "value", "min", "max", "step", "allowCustomValue", "onChange", 4, "ngSwitchCase"], ["class", "w-100", "mat-button", "", "mat-stroked-button", "", 3, "click", 4, "ngSwitchCase"], ["id", "item-config-field", "type", "color", 3, "value", "input", 4, "ngSwitchCase"], ["class", "range-slider", 4, "ngSwitchCase"], ["id", "item-config-field", "class", "w-100", 3, "change", 4, "ngSwitchCase"], [3, "value", "min", "max", "step", "allowCustomValue", "onChange"], ["mat-button", "", "mat-stroked-button", "", 1, "w-100", 3, "click"], ["id", "item-config-field", "type", "color", 3, "value", "input"], [1, "range-slider"], [1, "range-slider-inputs", "d-flex", "justify-content-between"], ["type", "number", "placeholder", "Min", "step", "config.step", 1, "form-control", "form-control-sm", 3, "value", "input"], ["type", "number", "placeholder", "Max", "step", "config.step", 1, "form-control", "form-control-sm", 3, "value", "input"], ["id", "item-config-field", 1, "w-100", 3, "change"], [3, "value", 4, "ngFor", "ngForOf"], [3, "value"], ["data-testid", "dropdown", 1, "icon-wrapper", "icon-button", "btn-blank", "item-expand", 3, "ngClass", "click"], ["href", "assets/icons/expand.svg#expand"], [1, "phoenix-menu-children"], [3, "currentNode", 4, "ngFor", "ngForOf"], [3, "currentNode"]], template: function PhoenixMenuItemComponent_Template(rf, ctx) { if (rf & 1) {
|
|
381
407
|
i0.ɵɵelementStart(0, "div", 0, 1)(2, "div", 2);
|
|
382
408
|
i0.ɵɵtemplate(3, PhoenixMenuItemComponent_ng_container_3_Template, 3, 2, "ng-container", 3);
|
|
383
409
|
i0.ɵɵtemplate(4, PhoenixMenuItemComponent_ng_template_4_Template, 4, 3, "ng-template", null, 4, i0.ɵɵtemplateRefExtractor);
|
|
@@ -397,10 +423,10 @@ PhoenixMenuItemComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Ph
|
|
|
397
423
|
i0.ɵɵproperty("ngIf", ctx.currentNode.children.length > 0);
|
|
398
424
|
i0.ɵɵadvance(1);
|
|
399
425
|
i0.ɵɵproperty("ngIf", ctx.currentNode.childrenActive);
|
|
400
|
-
} }, dependencies: [i2.NgClass, i2.NgForOf, i2.NgIf, i2.NgTemplateOutlet, i2.NgStyle, i2.NgSwitch, i2.NgSwitchCase, i2$2.MatButton, i3.NgSelectOption, i3.ɵNgSelectMultipleOption, i4.MatSlideToggle, i4$1.MatCheckbox,
|
|
426
|
+
} }, dependencies: [i2.NgClass, i2.NgForOf, i2.NgIf, i2.NgTemplateOutlet, i2.NgStyle, i2.NgSwitch, i2.NgSwitchCase, i2$2.MatButton, i3.NgSelectOption, i3.ɵNgSelectMultipleOption, i4.MatSlideToggle, i4$1.MatCheckbox, PhoenixMenuItemComponent, ConfigSliderComponent], styles: [".phoenix-menu-item{width:100%;padding:.6rem;background:var(--phoenix-background-color-secondary);color:var(--phoenix-text-color);font-size:.8rem;transition:all .5s;display:flex;justify-content:space-between;align-items:center}.phoenix-menu-item-left{display:flex;justify-content:flex-start;min-width:0;padding-right:.5rem;overflow:hidden}.phoenix-menu-item-left .item-name{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.phoenix-menu-item-left .item-icon{margin-right:.2rem}.phoenix-menu-item-right{display:flex;justify-content:flex-end}.phoenix-menu-item-right .item-expand.expanded{transform:scaleY(-1)}.phoenix-menu-item-right .item-settings{margin-right:.2rem}.phoenix-menu-item-right .item-config-backdrop{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:110}.phoenix-menu-item-right .item-config{position:absolute;margin-top:-5rem;right:100%;width:14rem;padding:.5rem;background:var(--phoenix-background-color-secondary);color:var(--phoenix-text-color-secondary);box-shadow:var(--phoenix-box-shadow);display:flex;flex-direction:column;z-index:120}.phoenix-menu-item-right .item-config>*{margin-bottom:.4rem}.phoenix-menu-item-right .item-config>*:last-child{margin-bottom:0}.phoenix-menu-item-right .item-config .item-config-single{display:flex;flex-direction:row}.phoenix-menu-item-right .item-config .item-config-single .item-config-label{width:30%}.phoenix-menu-item-right .item-config .item-config-single .item-config-data{flex-grow:1;padding-left:.5rem}.phoenix-menu-item .icon-wrapper{display:inline-block;width:1.3rem;height:1.3rem;padding:.23rem;transition:all .4s}.phoenix-menu-item .icon-wrapper.icon-button:hover{background:var(--phoenix-options-icon-bg);border-radius:40%;cursor:pointer}.phoenix-menu-item .icon-wrapper svg{width:100%;height:100%;vertical-align:top}.phoenix-menu-item .mat-slide-toggle-bar{width:30px!important}.phoenix-menu-item .mat-slide-toggle-thumb{width:15px!important;height:15px!important;position:absolute;top:2px}.phoenix-menu-item .mat-slider-horizontal{min-width:0;width:100%;height:20px}.phoenix-menu-item .mat-slider-horizontal .mat-slider-wrapper{top:10px}.phoenix-menu-item label.mat-checkbox-layout{margin:0}@media screen and (max-width: 768px){.phoenix-menu-item{font-size:.75rem;padding:.5rem}.phoenix-menu-item .icon-wrapper{width:1rem;height:1rem;padding:.15rem}}.phoenix-menu-children{margin-left:.5rem;border-left:1px solid var(--phoenix-accent)}.range-slider .range-slider-inputs{gap:20%}\n"], encapsulation: 2 });
|
|
401
427
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PhoenixMenuItemComponent, [{
|
|
402
428
|
type: Component,
|
|
403
|
-
args: [{ selector: 'app-phoenix-menu-item', encapsulation: ViewEncapsulation.None, template: "<div class=\"phoenix-menu-item\" #phoenixMenuItem>\n <div class=\"phoenix-menu-item-left align-items-center\">\n <!-- If the item has some toggle function -->\n <ng-container *ngIf=\"currentNode.onToggle; else nodeName\">\n <mat-slide-toggle\n [checked]=\"currentNode.toggleState\"\n (change)=\"currentNode.toggleSelfAndDescendants($event.checked)\"\n >\n <ng-container *ngTemplateOutlet=\"nodeName\"></ng-container>\n </mat-slide-toggle>\n </ng-container>\n <!-- If the item has no toggle function -->\n <ng-template #nodeName>\n <span class=\"d-flex w-100 align-items-center\">\n <span *ngIf=\"currentNode.icon\" class=\"icon-wrapper item-icon\">\n <svg>\n <use\n attr.href=\"assets/icons/{{ currentNode.icon }}.svg#{{\n currentNode.icon\n }}\"\n ></use>\n </svg>\n </span>\n <span class=\"item-name\" [title]=\"currentNode.name\">{{\n currentNode.name\n }}</span>\n </span>\n </ng-template>\n </div>\n <div class=\"phoenix-menu-item-right\">\n <div *ngIf=\"currentNode.configs.length > 0\">\n <button\n class=\"icon-wrapper icon-button btn-blank item-settings\"\n (click)=\"\n calculateConfigTop();\n currentNode.configActive = !currentNode.configActive\n \"\n >\n <svg>\n <use href=\"assets/icons/gear.svg#gear\"></use>\n </svg>\n </button>\n <div\n class=\"item-config-backdrop\"\n *ngIf=\"currentNode.configActive\"\n (click)=\"currentNode.configActive = false\"\n ></div>\n <div\n class=\"item-config\"\n [hidden]=\"!currentNode.configActive\"\n [ngStyle]=\"{ 'top.px': configTop }\"\n >\n <ng-container\n *ngFor=\"let config of castConfigsToAny(currentNode.configs)\"\n [ngSwitch]=\"config.type\"\n >\n <!-- Config types -->\n <
|
|
429
|
+
args: [{ selector: 'app-phoenix-menu-item', encapsulation: ViewEncapsulation.None, template: "<div class=\"phoenix-menu-item\" #phoenixMenuItem>\n <div class=\"phoenix-menu-item-left align-items-center\">\n <!-- If the item has some toggle function -->\n <ng-container *ngIf=\"currentNode.onToggle; else nodeName\">\n <mat-slide-toggle\n [checked]=\"currentNode.toggleState\"\n (change)=\"currentNode.toggleSelfAndDescendants($event.checked)\"\n >\n <ng-container *ngTemplateOutlet=\"nodeName\"></ng-container>\n </mat-slide-toggle>\n </ng-container>\n <!-- If the item has no toggle function -->\n <ng-template #nodeName>\n <span class=\"d-flex w-100 align-items-center\">\n <span *ngIf=\"currentNode.icon\" class=\"icon-wrapper item-icon\">\n <svg>\n <use\n attr.href=\"assets/icons/{{ currentNode.icon }}.svg#{{\n currentNode.icon\n }}\"\n ></use>\n </svg>\n </span>\n <span class=\"item-name\" [title]=\"currentNode.name\">{{\n currentNode.name\n }}</span>\n </span>\n </ng-template>\n </div>\n <div class=\"phoenix-menu-item-right\">\n <div *ngIf=\"currentNode.configs.length > 0\">\n <button\n class=\"icon-wrapper icon-button btn-blank item-settings\"\n (click)=\"\n calculateConfigTop();\n currentNode.configActive = !currentNode.configActive\n \"\n >\n <svg>\n <use href=\"assets/icons/gear.svg#gear\"></use>\n </svg>\n </button>\n <div\n class=\"item-config-backdrop\"\n *ngIf=\"currentNode.configActive\"\n (click)=\"currentNode.configActive = false\"\n ></div>\n <div\n class=\"item-config\"\n [hidden]=\"!currentNode.configActive\"\n [ngStyle]=\"{ 'top.px': configTop }\"\n >\n <ng-container\n *ngFor=\"let config of castConfigsToAny(currentNode.configs)\"\n [ngSwitch]=\"config.type\"\n >\n <!-- Config types -->\n <div class=\"item-config-single\" *ngIf=\"!config.hidden\">\n <label\n class=\"item-config-label\"\n for=\"item-config-field\"\n *ngIf=\"config.type !== 'button'\"\n [ngClass]=\"{ 'font-weight-bold w-100': config.type === 'label' }\"\n >\n {{ config.label }}\n </label>\n <div\n class=\"item-config-data\"\n [ngClass]=\"{ 'p-0': config.type === 'button' }\"\n *ngIf=\"config.type !== 'label'\"\n >\n <mat-checkbox\n *ngSwitchCase=\"'checkbox'\"\n [checked]=\"config.isChecked\"\n (change)=\"\n config.onChange($event.checked);\n config.isChecked = $event.checked\n \"\n ></mat-checkbox>\n\n <app-config-slider\n *ngSwitchCase=\"'slider'\"\n [value]=\"config.value\"\n (onChange)=\"config.onChange($event); config.value = $event\"\n [min]=\"config.min\"\n [max]=\"config.max\"\n [step]=\"config.step\"\n [allowCustomValue]=\"config.allowCustomValue\"\n >\n </app-config-slider>\n\n <button\n *ngSwitchCase=\"'button'\"\n class=\"w-100\"\n (click)=\"config.onClick()\"\n mat-button\n mat-stroked-button\n >\n {{ config.label }}\n </button>\n\n <input\n *ngSwitchCase=\"'color'\"\n id=\"item-config-field\"\n type=\"color\"\n [value]=\"config.color\"\n (input)=\"\n config.onChange($event.target.value);\n config.color = $event.target.value\n \"\n />\n\n <div *ngSwitchCase=\"'rangeSlider'\" class=\"range-slider\">\n <div class=\"range-slider-inputs d-flex justify-content-between\">\n <mat-checkbox\n [checked]=\"config.enableMin\"\n (change)=\"config.setEnableMin($event.checked)\"\n ></mat-checkbox>\n <mat-checkbox\n [checked]=\"config.enableMax\"\n (change)=\"config.setEnableMax($event.checked)\"\n ></mat-checkbox>\n </div>\n <div class=\"range-slider-inputs d-flex justify-content-between\">\n <input\n type=\"number\"\n placeholder=\"Min\"\n class=\"form-control form-control-sm\"\n [value]=\"config.value\"\n (input)=\"\n config.value = $event.target.value;\n config.onChange(config)\n \"\n step=\"config.step\"\n />\n <input\n type=\"number\"\n placeholder=\"Max\"\n class=\"form-control form-control-sm\"\n [value]=\"config.highValue\"\n (input)=\"\n config.highValue = $event.target.value;\n config.onChange(config)\n \"\n step=\"config.step\"\n />\n </div>\n </div>\n\n <select\n *ngSwitchCase=\"'select'\"\n id=\"item-config-field\"\n class=\"w-100\"\n (change)=\"config.onChange($event.target.value)\"\n >\n <option\n *ngFor=\"let singleOption of config.options\"\n [value]=\"singleOption\"\n >\n {{ singleOption }}\n </option>\n </select>\n </div>\n </div>\n <!-- Config types END -->\n </ng-container>\n </div>\n </div>\n <button\n class=\"icon-wrapper icon-button btn-blank item-expand\"\n *ngIf=\"currentNode.children.length > 0\"\n (click)=\"currentNode.childrenActive = !currentNode.childrenActive\"\n [ngClass]=\"{ expanded: currentNode.childrenActive }\"\n data-testid=\"dropdown\"\n >\n <svg>\n <use href=\"assets/icons/expand.svg#expand\"></use>\n </svg>\n </button>\n </div>\n</div>\n<div class=\"phoenix-menu-children\" *ngIf=\"currentNode.childrenActive\">\n <app-phoenix-menu-item\n *ngFor=\"let childNode of currentNode.children\"\n [currentNode]=\"childNode\"\n >\n </app-phoenix-menu-item>\n</div>\n", styles: [".phoenix-menu-item{width:100%;padding:.6rem;background:var(--phoenix-background-color-secondary);color:var(--phoenix-text-color);font-size:.8rem;transition:all .5s;display:flex;justify-content:space-between;align-items:center}.phoenix-menu-item-left{display:flex;justify-content:flex-start;min-width:0;padding-right:.5rem;overflow:hidden}.phoenix-menu-item-left .item-name{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.phoenix-menu-item-left .item-icon{margin-right:.2rem}.phoenix-menu-item-right{display:flex;justify-content:flex-end}.phoenix-menu-item-right .item-expand.expanded{transform:scaleY(-1)}.phoenix-menu-item-right .item-settings{margin-right:.2rem}.phoenix-menu-item-right .item-config-backdrop{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:110}.phoenix-menu-item-right .item-config{position:absolute;margin-top:-5rem;right:100%;width:14rem;padding:.5rem;background:var(--phoenix-background-color-secondary);color:var(--phoenix-text-color-secondary);box-shadow:var(--phoenix-box-shadow);display:flex;flex-direction:column;z-index:120}.phoenix-menu-item-right .item-config>*{margin-bottom:.4rem}.phoenix-menu-item-right .item-config>*:last-child{margin-bottom:0}.phoenix-menu-item-right .item-config .item-config-single{display:flex;flex-direction:row}.phoenix-menu-item-right .item-config .item-config-single .item-config-label{width:30%}.phoenix-menu-item-right .item-config .item-config-single .item-config-data{flex-grow:1;padding-left:.5rem}.phoenix-menu-item .icon-wrapper{display:inline-block;width:1.3rem;height:1.3rem;padding:.23rem;transition:all .4s}.phoenix-menu-item .icon-wrapper.icon-button:hover{background:var(--phoenix-options-icon-bg);border-radius:40%;cursor:pointer}.phoenix-menu-item .icon-wrapper svg{width:100%;height:100%;vertical-align:top}.phoenix-menu-item .mat-slide-toggle-bar{width:30px!important}.phoenix-menu-item .mat-slide-toggle-thumb{width:15px!important;height:15px!important;position:absolute;top:2px}.phoenix-menu-item .mat-slider-horizontal{min-width:0;width:100%;height:20px}.phoenix-menu-item .mat-slider-horizontal .mat-slider-wrapper{top:10px}.phoenix-menu-item label.mat-checkbox-layout{margin:0}@media screen and (max-width: 768px){.phoenix-menu-item{font-size:.75rem;padding:.5rem}.phoenix-menu-item .icon-wrapper{width:1rem;height:1rem;padding:.15rem}}.phoenix-menu-children{margin-left:.5rem;border-left:1px solid var(--phoenix-accent)}.range-slider .range-slider-inputs{gap:20%}\n"] }]
|
|
404
430
|
}], function () { return [{ type: i0.ChangeDetectorRef }]; }, { currentNode: [{
|
|
405
431
|
type: Input
|
|
406
432
|
}], phoenixMenuItem: [{
|
|
@@ -492,30 +518,43 @@ function AnimateCameraComponent_button_2_Template(rf, ctx) { if (rf & 1) {
|
|
|
492
518
|
i0.ɵɵtextInterpolate1(" ", preset_r2, " ");
|
|
493
519
|
} }
|
|
494
520
|
const defaultAnimationPresets = {
|
|
495
|
-
'
|
|
521
|
+
'Cavern to ID': {
|
|
522
|
+
name: 'Cavern to ID',
|
|
496
523
|
positions: [
|
|
497
524
|
{
|
|
498
|
-
position: [
|
|
525
|
+
position: [66388.95051168812, 5264.228603228927, -46910.7848593543],
|
|
499
526
|
duration: 1000,
|
|
500
527
|
},
|
|
501
528
|
{
|
|
502
|
-
position: [
|
|
529
|
+
position: [12834.18729094943, 677.7571205763458, 135.68755273443463],
|
|
503
530
|
duration: 2000,
|
|
504
531
|
},
|
|
505
532
|
{
|
|
506
|
-
position: [
|
|
533
|
+
position: [312.02688693297375, 25.884223757326, 270.10019006776236],
|
|
507
534
|
duration: 3500,
|
|
508
535
|
},
|
|
509
536
|
{
|
|
510
|
-
position: [
|
|
537
|
+
position: [263.3640855132258, 19.874838262525053, -318.16541790248885],
|
|
511
538
|
duration: 3000,
|
|
512
539
|
},
|
|
513
540
|
{
|
|
514
|
-
position: [
|
|
541
|
+
position: [5534.140362338047, 234.03507981484574, -2933.619479808285],
|
|
515
542
|
duration: 2000,
|
|
516
543
|
},
|
|
517
544
|
{
|
|
518
|
-
position: [
|
|
545
|
+
position: [2681.277288705242, 646.5795158318147, 5628.5248735111745],
|
|
546
|
+
duration: 1000,
|
|
547
|
+
},
|
|
548
|
+
{
|
|
549
|
+
position: [-6062.586283740076, 790.5876682946184, 1381.1675900848818],
|
|
550
|
+
duration: 1000,
|
|
551
|
+
},
|
|
552
|
+
{
|
|
553
|
+
position: [-1766.7693725879053, 1007.1048030984678, -5928.901341784575],
|
|
554
|
+
duration: 1000,
|
|
555
|
+
},
|
|
556
|
+
{
|
|
557
|
+
position: [12814.982506255355, 2516.987185037266, -22891.902734328327],
|
|
519
558
|
duration: 1000,
|
|
520
559
|
},
|
|
521
560
|
],
|
|
@@ -529,6 +568,10 @@ class AnimateCameraComponent {
|
|
|
529
568
|
this.animationPresets = defaultAnimationPresets;
|
|
530
569
|
this.animationPresetsKeys = Object.keys(this.animationPresets);
|
|
531
570
|
this.isAnimating = false;
|
|
571
|
+
// this.animationPresets = this.eventDisplay
|
|
572
|
+
// .getUIManager()
|
|
573
|
+
// .getPresetAnimations();
|
|
574
|
+
// This is too late to fill the UI! FIXME. EJWM
|
|
532
575
|
}
|
|
533
576
|
animatePreset(preset) {
|
|
534
577
|
this.setDetectorOpacity(0.2);
|
|
@@ -691,8 +734,12 @@ class OverlayComponent {
|
|
|
691
734
|
this.resizable = false;
|
|
692
735
|
/** If the overlay body is transparent or not. */
|
|
693
736
|
this.transparentBody = false;
|
|
737
|
+
/** If the aspect ratio is kept fixed or not. */
|
|
738
|
+
this.keepAspectRatioFixed = false;
|
|
694
739
|
/** If the overlay body is visible or not. */
|
|
695
740
|
this.showBody = true;
|
|
741
|
+
/** Aspect ratio of the overlay view. */
|
|
742
|
+
this.aspectRatio = window.innerWidth / window.innerHeight;
|
|
696
743
|
/** Minimum resizable width. */
|
|
697
744
|
this.MIN_RES_WIDTH = 300;
|
|
698
745
|
/** Minimum resizable height */
|
|
@@ -727,7 +774,12 @@ class OverlayComponent {
|
|
|
727
774
|
this.setHandleTransform(overlayRect, dragRect);
|
|
728
775
|
if (width > this.MIN_RES_WIDTH && height > this.MIN_RES_HEIGHT) {
|
|
729
776
|
overlayCardElement.style.width = width + 'px';
|
|
730
|
-
|
|
777
|
+
if (this.keepAspectRatioFixed) {
|
|
778
|
+
overlayCardElement.style.height = width / this.aspectRatio + 30 + 'px';
|
|
779
|
+
}
|
|
780
|
+
else {
|
|
781
|
+
overlayCardElement.style.height = height + 'px';
|
|
782
|
+
}
|
|
731
783
|
}
|
|
732
784
|
}
|
|
733
785
|
/**
|
|
@@ -758,7 +810,7 @@ OverlayComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: OverlayCom
|
|
|
758
810
|
let _t;
|
|
759
811
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.overlayCard = _t.first);
|
|
760
812
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.resizeHandleCorner = _t.first);
|
|
761
|
-
} }, inputs: { overlayTitle: "overlayTitle", active: "active", icon: "icon", resizable: "resizable", transparentBody: "transparentBody" }, ngContentSelectors: _c5, decls: 5, vars: 4, consts: [["cdkDrag", "", "cdkDragBoundary", "body", 1, "overlay-card", "card", 3, "hidden"], ["overlayCard", ""], ["class", "card-header d-flex justify-content-between", "cdkDragHandle", "", 3, "ngClass", 4, "ngIf"], ["class", "overlay-card-content", 3, "ngClass", 4, "ngIf"], ["class", "resize-handle corner", "cdkDrag", "", 3, "hidden", "cdkDragMoved", 4, "ngIf"], ["cdkDragHandle", "", 1, "card-header", "d-flex", "justify-content-between", 3, "ngClass"], ["class", "align-self-center card-icon", 4, "ngIf"], [1, "align-self-center", "m-0", "px-2"], ["matTooltip", "Expand / Collapse", "matTooltipPosition", "right", 1, "align-self-center", "card-icon", "btn-blank", "expandCollapse", 3, "ngClass", "click"], ["href", "assets/icons/expand.svg#expand"], [1, "align-self-center", "card-icon"], [1, "overlay-card-content", 3, "ngClass"], ["cdkDrag", "", 1, "resize-handle", "corner", 3, "hidden", "cdkDragMoved"], ["resizeHandleCorner", ""]], template: function OverlayComponent_Template(rf, ctx) { if (rf & 1) {
|
|
813
|
+
} }, inputs: { overlayTitle: "overlayTitle", active: "active", icon: "icon", resizable: "resizable", transparentBody: "transparentBody", keepAspectRatioFixed: "keepAspectRatioFixed" }, ngContentSelectors: _c5, decls: 5, vars: 4, consts: [["cdkDrag", "", "cdkDragBoundary", "body", 1, "overlay-card", "card", 3, "hidden"], ["overlayCard", ""], ["class", "card-header d-flex justify-content-between", "cdkDragHandle", "", 3, "ngClass", 4, "ngIf"], ["class", "overlay-card-content", 3, "ngClass", 4, "ngIf"], ["class", "resize-handle corner", "cdkDrag", "", 3, "hidden", "cdkDragMoved", 4, "ngIf"], ["cdkDragHandle", "", 1, "card-header", "d-flex", "justify-content-between", 3, "ngClass"], ["class", "align-self-center card-icon", 4, "ngIf"], [1, "align-self-center", "m-0", "px-2"], ["matTooltip", "Expand / Collapse", "matTooltipPosition", "right", 1, "align-self-center", "card-icon", "btn-blank", "expandCollapse", 3, "ngClass", "click"], ["href", "assets/icons/expand.svg#expand"], [1, "align-self-center", "card-icon"], [1, "overlay-card-content", 3, "ngClass"], ["cdkDrag", "", 1, "resize-handle", "corner", 3, "hidden", "cdkDragMoved"], ["resizeHandleCorner", ""]], template: function OverlayComponent_Template(rf, ctx) { if (rf & 1) {
|
|
762
814
|
i0.ɵɵprojectionDef();
|
|
763
815
|
i0.ɵɵelementStart(0, "div", 0, 1);
|
|
764
816
|
i0.ɵɵtemplate(2, OverlayComponent_div_2_Template, 7, 8, "div", 2);
|
|
@@ -787,6 +839,8 @@ OverlayComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: OverlayCom
|
|
|
787
839
|
type: Input
|
|
788
840
|
}], transparentBody: [{
|
|
789
841
|
type: Input
|
|
842
|
+
}], keepAspectRatioFixed: [{
|
|
843
|
+
type: Input
|
|
790
844
|
}], overlayCard: [{
|
|
791
845
|
type: ViewChild,
|
|
792
846
|
args: ['overlayCard']
|
|
@@ -1228,10 +1282,10 @@ ExperimentInfoComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Exp
|
|
|
1228
1282
|
i0.ɵɵproperty("ngIf", ctx.tagline);
|
|
1229
1283
|
i0.ɵɵadvance(1);
|
|
1230
1284
|
i0.ɵɵproperty("ngForOf", ctx.experimentInfo);
|
|
1231
|
-
} }, dependencies: [i2.NgForOf, i2.NgIf, i2$4.CdkDrag], styles: [".experimentInfo[_ngcontent-%COMP%]{position:absolute;top:5rem;left:1rem;display:flex;flex-direction:row;justify-items:flex-end;justify-content:flex-end;align-items:center;align-content:center;cursor:move}.experimentLogoWrapper[_ngcontent-%COMP%]{width:6rem}.experimentLogoWrapper[_ngcontent-%COMP%] .experimentLogo[_ngcontent-%COMP%]{width:100%;height:100%}.textInfo[_ngcontent-%COMP%]{margin-left:1rem}.textInfo[_ngcontent-%COMP%] p[_ngcontent-%COMP%]{color:var(--phoenix-text-color-secondary);font-size:.8rem;margin-bottom:.5rem;-webkit-user-select:none;user-select:none}@media screen and (max-width: 768px){.experimentInfo[_ngcontent-%COMP%]{top:4rem;max-width:40%}.experimentLogoWrapper[_ngcontent-%COMP%]{height:4rem}.textInfo[_ngcontent-%COMP%]{display:none}}"] });
|
|
1285
|
+
} }, dependencies: [i2.NgForOf, i2.NgIf, i2$4.CdkDrag], styles: [".experimentInfo[_ngcontent-%COMP%]{position:absolute;top:5rem;left:1rem;display:flex;flex-direction:row;justify-items:flex-end;justify-content:flex-end;align-items:center;align-content:center;font-family:Courier New,Lucida Console,monospace;cursor:move}.experimentLogoWrapper[_ngcontent-%COMP%]{width:6rem}.experimentLogoWrapper[_ngcontent-%COMP%] .experimentLogo[_ngcontent-%COMP%]{width:100%;height:100%}.textInfo[_ngcontent-%COMP%]{margin-left:1rem}.textInfo[_ngcontent-%COMP%] p[_ngcontent-%COMP%]{color:var(--phoenix-text-color-secondary);font-size:.8rem;margin-bottom:.5rem;-webkit-user-select:none;user-select:none}@media screen and (max-width: 768px){.experimentInfo[_ngcontent-%COMP%]{top:4rem;max-width:40%}.experimentLogoWrapper[_ngcontent-%COMP%]{height:4rem}.textInfo[_ngcontent-%COMP%]{display:none}}"] });
|
|
1232
1286
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ExperimentInfoComponent, [{
|
|
1233
1287
|
type: Component,
|
|
1234
|
-
args: [{ selector: 'app-experiment-info', template: "<div id=\"experimentInfo\" class=\"experimentInfo\" cdkDrag cdkDragBoundary=\"body\">\n <a\n class=\"experimentLogoWrapper\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n *ngIf=\"url\"\n [href]=\"url\"\n >\n <img class=\"experimentLogo\" [src]=\"logo\" alt=\"\" />\n </a>\n <div class=\"textInfo\">\n <p *ngIf=\"tagline\">\n <b>{{ tagline }}</b>\n </p>\n <p *ngFor=\"let infoField of experimentInfo\">\n <ng-container *ngIf=\"infoField.label\">\n <b>{{ infoField.label }}: </b>{{ infoField.value }}\n </ng-container>\n <ng-container *ngIf=\"!infoField.label\">\n {{ infoField }}\n </ng-container>\n </p>\n </div>\n</div>\n", styles: [".experimentInfo{position:absolute;top:5rem;left:1rem;display:flex;flex-direction:row;justify-items:flex-end;justify-content:flex-end;align-items:center;align-content:center;cursor:move}.experimentLogoWrapper{width:6rem}.experimentLogoWrapper .experimentLogo{width:100%;height:100%}.textInfo{margin-left:1rem}.textInfo p{color:var(--phoenix-text-color-secondary);font-size:.8rem;margin-bottom:.5rem;-webkit-user-select:none;user-select:none}@media screen and (max-width: 768px){.experimentInfo{top:4rem;max-width:40%}.experimentLogoWrapper{height:4rem}.textInfo{display:none}}\n"] }]
|
|
1288
|
+
args: [{ selector: 'app-experiment-info', template: "<div id=\"experimentInfo\" class=\"experimentInfo\" cdkDrag cdkDragBoundary=\"body\">\n <a\n class=\"experimentLogoWrapper\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n *ngIf=\"url\"\n [href]=\"url\"\n >\n <img class=\"experimentLogo\" [src]=\"logo\" alt=\"\" />\n </a>\n <div class=\"textInfo\">\n <p *ngIf=\"tagline\">\n <b>{{ tagline }}</b>\n </p>\n <p *ngFor=\"let infoField of experimentInfo\">\n <ng-container *ngIf=\"infoField.label\">\n <b>{{ infoField.label }}: </b>{{ infoField.value }}\n </ng-container>\n <ng-container *ngIf=\"!infoField.label\">\n {{ infoField }}\n </ng-container>\n </p>\n </div>\n</div>\n", styles: [".experimentInfo{position:absolute;top:5rem;left:1rem;display:flex;flex-direction:row;justify-items:flex-end;justify-content:flex-end;align-items:center;align-content:center;font-family:Courier New,Lucida Console,monospace;cursor:move}.experimentLogoWrapper{width:6rem}.experimentLogoWrapper .experimentLogo{width:100%;height:100%}.textInfo{margin-left:1rem}.textInfo p{color:var(--phoenix-text-color-secondary);font-size:.8rem;margin-bottom:.5rem;-webkit-user-select:none;user-select:none}@media screen and (max-width: 768px){.experimentInfo{top:4rem;max-width:40%}.experimentLogoWrapper{height:4rem}.textInfo{display:none}}\n"] }]
|
|
1235
1289
|
}], function () { return [{ type: EventDisplayService }]; }, { url: [{
|
|
1236
1290
|
type: Input
|
|
1237
1291
|
}], logo: [{
|
|
@@ -1918,7 +1972,7 @@ OverlayViewWindowComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
|
|
|
1918
1972
|
} if (rf & 2) {
|
|
1919
1973
|
let _t;
|
|
1920
1974
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.overlayWindow = _t.first);
|
|
1921
|
-
} }, inputs: { showOverlay: "showOverlay" }, decls: 8, vars:
|
|
1975
|
+
} }, inputs: { showOverlay: "showOverlay" }, decls: 8, vars: 9, consts: [["overlayTitle", "Overlay View", "icon", "overlay", 3, "resizable", "transparentBody", "active", "keepAspectRatioFixed"], [1, "overlay-view-wrapper"], ["id", "overlay-canvas", 3, "hidden"], ["overlayWindow", ""], [1, "overlay-view-controls", "position-absolute", "d-flex", "flex-row"], ["icon", "transparent", "matTooltip", "Toggle background transparency", 1, "overlay-view-control", 3, "click"], ["icon", "move-lock", 1, "overlay-view-control", 3, "matTooltip", "active", "click"], [1, "overlay-view-control", 3, "icon", "matTooltip", "click"]], template: function OverlayViewWindowComponent_Template(rf, ctx) { if (rf & 1) {
|
|
1922
1976
|
i0.ɵɵelementStart(0, "app-overlay", 0)(1, "div", 1);
|
|
1923
1977
|
i0.ɵɵelement(2, "canvas", 2, 3);
|
|
1924
1978
|
i0.ɵɵelementStart(4, "div", 4)(5, "app-menu-toggle", 5);
|
|
@@ -1931,7 +1985,7 @@ OverlayViewWindowComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
|
|
|
1931
1985
|
i0.ɵɵlistener("click", function OverlayViewWindowComponent_Template_app_menu_toggle_click_7_listener() { return ctx.switchOverlayView(); });
|
|
1932
1986
|
i0.ɵɵelementEnd()()()();
|
|
1933
1987
|
} if (rf & 2) {
|
|
1934
|
-
i0.ɵɵproperty("resizable", true)("transparentBody", ctx.transparentBody)("active", ctx.showOverlay);
|
|
1988
|
+
i0.ɵɵproperty("resizable", true)("transparentBody", ctx.transparentBody)("active", ctx.showOverlay)("keepAspectRatioFixed", true);
|
|
1935
1989
|
i0.ɵɵadvance(2);
|
|
1936
1990
|
i0.ɵɵproperty("hidden", !ctx.showOverlay);
|
|
1937
1991
|
i0.ɵɵadvance(4);
|
|
@@ -1941,7 +1995,7 @@ OverlayViewWindowComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
|
|
|
1941
1995
|
} }, dependencies: [i2$3.MatTooltip, MenuToggleComponent, OverlayComponent], styles: ["#overlay-canvas[_ngcontent-%COMP%]{background-color:#0000001a;width:100%}.overlay-view-controls[_ngcontent-%COMP%]{bottom:1em;right:1em;opacity:0;transition:opacity .2s}.overlay-view-controls[_ngcontent-%COMP%] .overlay-view-control[_ngcontent-%COMP%]{background:var(--phoenix-background-color-secondary);box-shadow:var(--phoenix-box-shadow);overflow:hidden;width:2.5rem;height:2.5rem;border-radius:50%;display:flex;justify-content:center;align-items:center}.overlay-view-wrapper[_ngcontent-%COMP%]:hover .overlay-view-controls[_ngcontent-%COMP%]{opacity:1;transition:opacity .2s}"] });
|
|
1942
1996
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(OverlayViewWindowComponent, [{
|
|
1943
1997
|
type: Component,
|
|
1944
|
-
args: [{ selector: 'app-overlay-view-window', template: "<app-overlay\n overlayTitle=\"Overlay View\"\n icon=\"overlay\"\n [resizable]=\"true\"\n [transparentBody]=\"transparentBody\"\n [active]=\"showOverlay\"\n>\n <div class=\"overlay-view-wrapper\">\n <canvas #overlayWindow id=\"overlay-canvas\" [hidden]=\"!showOverlay\">\n </canvas>\n <div class=\"overlay-view-controls position-absolute d-flex flex-row\">\n <app-menu-toggle\n class=\"overlay-view-control\"\n icon=\"transparent\"\n matTooltip=\"Toggle background transparency\"\n (click)=\"toggleBgTransparency()\"\n >\n </app-menu-toggle>\n <app-menu-toggle\n class=\"overlay-view-control\"\n icon=\"move-lock\"\n [matTooltip]=\"(overlayViewFixed ? 'Restore' : 'Fix') + ' overlay view'\"\n [active]=\"overlayViewFixed\"\n (click)=\"fixOverlayView()\"\n >\n </app-menu-toggle>\n <app-menu-toggle\n class=\"overlay-view-control\"\n [icon]=\"orthographicView ? 'orthographic' : 'perspective'\"\n [matTooltip]=\"\n 'Switch to ' +\n (orthographicView ? 'orthographic' : 'perspective') +\n ' view'\n \"\n (click)=\"switchOverlayView()\"\n >\n </app-menu-toggle>\n </div>\n </div>\n</app-overlay>\n", styles: ["#overlay-canvas{background-color:#0000001a;width:100%}.overlay-view-controls{bottom:1em;right:1em;opacity:0;transition:opacity .2s}.overlay-view-controls .overlay-view-control{background:var(--phoenix-background-color-secondary);box-shadow:var(--phoenix-box-shadow);overflow:hidden;width:2.5rem;height:2.5rem;border-radius:50%;display:flex;justify-content:center;align-items:center}.overlay-view-wrapper:hover .overlay-view-controls{opacity:1;transition:opacity .2s}\n"] }]
|
|
1998
|
+
args: [{ selector: 'app-overlay-view-window', template: "<app-overlay\n overlayTitle=\"Overlay View\"\n icon=\"overlay\"\n [resizable]=\"true\"\n [transparentBody]=\"transparentBody\"\n [active]=\"showOverlay\"\n [keepAspectRatioFixed]=\"true\"\n>\n <div class=\"overlay-view-wrapper\">\n <canvas #overlayWindow id=\"overlay-canvas\" [hidden]=\"!showOverlay\">\n </canvas>\n <div class=\"overlay-view-controls position-absolute d-flex flex-row\">\n <app-menu-toggle\n class=\"overlay-view-control\"\n icon=\"transparent\"\n matTooltip=\"Toggle background transparency\"\n (click)=\"toggleBgTransparency()\"\n >\n </app-menu-toggle>\n <app-menu-toggle\n class=\"overlay-view-control\"\n icon=\"move-lock\"\n [matTooltip]=\"(overlayViewFixed ? 'Restore' : 'Fix') + ' overlay view'\"\n [active]=\"overlayViewFixed\"\n (click)=\"fixOverlayView()\"\n >\n </app-menu-toggle>\n <app-menu-toggle\n class=\"overlay-view-control\"\n [icon]=\"orthographicView ? 'orthographic' : 'perspective'\"\n [matTooltip]=\"\n 'Switch to ' +\n (orthographicView ? 'orthographic' : 'perspective') +\n ' view'\n \"\n (click)=\"switchOverlayView()\"\n >\n </app-menu-toggle>\n </div>\n </div>\n</app-overlay>\n", styles: ["#overlay-canvas{background-color:#0000001a;width:100%}.overlay-view-controls{bottom:1em;right:1em;opacity:0;transition:opacity .2s}.overlay-view-controls .overlay-view-control{background:var(--phoenix-background-color-secondary);box-shadow:var(--phoenix-box-shadow);overflow:hidden;width:2.5rem;height:2.5rem;border-radius:50%;display:flex;justify-content:center;align-items:center}.overlay-view-wrapper:hover .overlay-view-controls{opacity:1;transition:opacity .2s}\n"] }]
|
|
1945
1999
|
}], function () { return [{ type: EventDisplayService }]; }, { showOverlay: [{
|
|
1946
2000
|
type: Input
|
|
1947
2001
|
}], overlayWindow: [{
|
|
@@ -3233,7 +3287,10 @@ GlobalErrorHandler.ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: Globa
|
|
|
3233
3287
|
|
|
3234
3288
|
class ExperimentLinkComponent {
|
|
3235
3289
|
ngOnInit() {
|
|
3236
|
-
|
|
3290
|
+
// we just want to remove the "&embed=true" instruction here.
|
|
3291
|
+
const url = new URL(window.location.href);
|
|
3292
|
+
url.searchParams.delete('embed');
|
|
3293
|
+
this.experimentLink = url.toString();
|
|
3237
3294
|
}
|
|
3238
3295
|
goToExperiment() {
|
|
3239
3296
|
window.open(this.experimentLink, '_blank');
|
|
@@ -3336,7 +3393,6 @@ PhoenixUIModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ providers: [
|
|
|
3336
3393
|
MatSlideToggleModule,
|
|
3337
3394
|
MatCheckboxModule,
|
|
3338
3395
|
MatIconModule,
|
|
3339
|
-
NgxSliderModule,
|
|
3340
3396
|
CdkTreeModule,
|
|
3341
3397
|
MatTabsModule] });
|
|
3342
3398
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PhoenixUIModule, [{
|
|
@@ -3358,7 +3414,6 @@ PhoenixUIModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ providers: [
|
|
|
3358
3414
|
MatSlideToggleModule,
|
|
3359
3415
|
MatCheckboxModule,
|
|
3360
3416
|
MatIconModule,
|
|
3361
|
-
NgxSliderModule,
|
|
3362
3417
|
CdkTreeModule,
|
|
3363
3418
|
MatTabsModule,
|
|
3364
3419
|
],
|
|
@@ -3441,7 +3496,6 @@ PhoenixUIModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ providers: [
|
|
|
3441
3496
|
MatSlideToggleModule,
|
|
3442
3497
|
MatCheckboxModule,
|
|
3443
3498
|
MatIconModule,
|
|
3444
|
-
NgxSliderModule,
|
|
3445
3499
|
CdkTreeModule,
|
|
3446
3500
|
MatTabsModule], exports: [NavComponent,
|
|
3447
3501
|
UiMenuWrapperComponent,
|