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';
|
|
@@ -78,7 +76,9 @@ class ConfigSliderComponent {
|
|
|
78
76
|
constructor() {
|
|
79
77
|
this.value = 0;
|
|
80
78
|
this.min = 0;
|
|
79
|
+
this.oldMin = 0;
|
|
81
80
|
this.max = 100;
|
|
81
|
+
this.oldMax = 0;
|
|
82
82
|
this.step = 1;
|
|
83
83
|
this.allowCustomValue = false;
|
|
84
84
|
this.onChange = new EventEmitter();
|
|
@@ -86,6 +86,28 @@ class ConfigSliderComponent {
|
|
|
86
86
|
onValueChange(value) {
|
|
87
87
|
value && this.onChange.emit(value);
|
|
88
88
|
}
|
|
89
|
+
toggleMinCut(change) {
|
|
90
|
+
const value = change.checked;
|
|
91
|
+
if (value) {
|
|
92
|
+
this.min = this.oldMin;
|
|
93
|
+
}
|
|
94
|
+
else {
|
|
95
|
+
this.oldMin = this.min;
|
|
96
|
+
this.min = Number.MIN_SAFE_INTEGER;
|
|
97
|
+
}
|
|
98
|
+
// We should probably disable the min input too, and change text to be infinity symbol or something?
|
|
99
|
+
}
|
|
100
|
+
toggleMaxCut(change) {
|
|
101
|
+
const value = change.checked;
|
|
102
|
+
if (value) {
|
|
103
|
+
this.max = this.oldMax;
|
|
104
|
+
}
|
|
105
|
+
else {
|
|
106
|
+
this.oldMax = this.max;
|
|
107
|
+
this.max = Number.MAX_SAFE_INTEGER;
|
|
108
|
+
}
|
|
109
|
+
// We should probably disable the min input too, and change text to be infinity symbol or something?
|
|
110
|
+
}
|
|
89
111
|
}
|
|
90
112
|
ConfigSliderComponent.ɵfac = function ConfigSliderComponent_Factory(t) { return new (t || ConfigSliderComponent)(); };
|
|
91
113
|
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) {
|
|
@@ -192,9 +214,9 @@ function PhoenixMenuItemComponent_div_7_div_4_Template(rf, ctx) {
|
|
|
192
214
|
}
|
|
193
215
|
}
|
|
194
216
|
const _c1$4 = function (a0) { return { "font-weight-bold w-100": a0 }; };
|
|
195
|
-
function
|
|
217
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_label_1_Template(rf, ctx) {
|
|
196
218
|
if (rf & 1) {
|
|
197
|
-
i0.ɵɵelementStart(0, "
|
|
219
|
+
i0.ɵɵelementStart(0, "label", 26);
|
|
198
220
|
i0.ɵɵtext(1);
|
|
199
221
|
i0.ɵɵelementEnd();
|
|
200
222
|
}
|
|
@@ -205,11 +227,11 @@ function PhoenixMenuItemComponent_div_7_ng_container_6_label_1_span_1_Template(r
|
|
|
205
227
|
i0.ɵɵtextInterpolate1(" ", config_r15.label, " ");
|
|
206
228
|
}
|
|
207
229
|
}
|
|
208
|
-
function
|
|
230
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_mat_checkbox_1_Template(rf, ctx) {
|
|
209
231
|
if (rf & 1) {
|
|
210
232
|
const _r28 = i0.ɵɵgetCurrentView();
|
|
211
233
|
i0.ɵɵelementStart(0, "mat-checkbox", 9);
|
|
212
|
-
i0.ɵɵlistener("change", function
|
|
234
|
+
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); });
|
|
213
235
|
i0.ɵɵelementEnd();
|
|
214
236
|
}
|
|
215
237
|
if (rf & 2) {
|
|
@@ -217,11 +239,11 @@ function PhoenixMenuItemComponent_div_7_ng_container_6_label_1_div_2_mat_checkbo
|
|
|
217
239
|
i0.ɵɵproperty("checked", config_r15.isChecked);
|
|
218
240
|
}
|
|
219
241
|
}
|
|
220
|
-
function
|
|
242
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_app_config_slider_2_Template(rf, ctx) {
|
|
221
243
|
if (rf & 1) {
|
|
222
244
|
const _r32 = i0.ɵɵgetCurrentView();
|
|
223
245
|
i0.ɵɵelementStart(0, "app-config-slider", 34);
|
|
224
|
-
i0.ɵɵlistener("onChange", function
|
|
246
|
+
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); });
|
|
225
247
|
i0.ɵɵelementEnd();
|
|
226
248
|
}
|
|
227
249
|
if (rf & 2) {
|
|
@@ -229,11 +251,11 @@ function PhoenixMenuItemComponent_div_7_ng_container_6_label_1_div_2_app_config_
|
|
|
229
251
|
i0.ɵɵproperty("value", config_r15.value)("min", config_r15.min)("max", config_r15.max)("step", config_r15.step)("allowCustomValue", config_r15.allowCustomValue);
|
|
230
252
|
}
|
|
231
253
|
}
|
|
232
|
-
function
|
|
254
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_button_3_Template(rf, ctx) {
|
|
233
255
|
if (rf & 1) {
|
|
234
256
|
const _r36 = i0.ɵɵgetCurrentView();
|
|
235
257
|
i0.ɵɵelementStart(0, "button", 35);
|
|
236
|
-
i0.ɵɵlistener("click", function
|
|
258
|
+
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()); });
|
|
237
259
|
i0.ɵɵtext(1);
|
|
238
260
|
i0.ɵɵelementEnd();
|
|
239
261
|
}
|
|
@@ -243,11 +265,11 @@ function PhoenixMenuItemComponent_div_7_ng_container_6_label_1_div_2_button_3_Te
|
|
|
243
265
|
i0.ɵɵtextInterpolate1(" ", config_r15.label, " ");
|
|
244
266
|
}
|
|
245
267
|
}
|
|
246
|
-
function
|
|
268
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_input_4_Template(rf, ctx) {
|
|
247
269
|
if (rf & 1) {
|
|
248
270
|
const _r40 = i0.ɵɵgetCurrentView();
|
|
249
271
|
i0.ɵɵelementStart(0, "input", 36);
|
|
250
|
-
i0.ɵɵlistener("input", function
|
|
272
|
+
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); });
|
|
251
273
|
i0.ɵɵelementEnd();
|
|
252
274
|
}
|
|
253
275
|
if (rf & 2) {
|
|
@@ -255,49 +277,53 @@ function PhoenixMenuItemComponent_div_7_ng_container_6_label_1_div_2_input_4_Tem
|
|
|
255
277
|
i0.ɵɵproperty("value", config_r15.color);
|
|
256
278
|
}
|
|
257
279
|
}
|
|
258
|
-
|
|
259
|
-
function PhoenixMenuItemComponent_div_7_ng_container_6_label_1_div_2_div_5_Template(rf, ctx) {
|
|
280
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_div_5_Template(rf, ctx) {
|
|
260
281
|
if (rf & 1) {
|
|
261
282
|
const _r44 = i0.ɵɵgetCurrentView();
|
|
262
|
-
i0.ɵɵelementStart(0, "div", 37)(1, "div", 38)(2, "
|
|
263
|
-
i0.ɵɵlistener("
|
|
283
|
+
i0.ɵɵelementStart(0, "div", 37)(1, "div", 38)(2, "mat-checkbox", 9);
|
|
284
|
+
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)); });
|
|
264
285
|
i0.ɵɵelementEnd();
|
|
265
|
-
i0.ɵɵelementStart(3, "
|
|
266
|
-
i0.ɵɵlistener("
|
|
267
|
-
i0.ɵɵelementEnd()();
|
|
268
|
-
i0.ɵɵelementStart(4, "ngx-slider", 41);
|
|
269
|
-
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)); });
|
|
286
|
+
i0.ɵɵelementStart(3, "mat-checkbox", 9);
|
|
287
|
+
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)); });
|
|
270
288
|
i0.ɵɵelementEnd()();
|
|
289
|
+
i0.ɵɵelementStart(4, "div", 38)(5, "input", 39);
|
|
290
|
+
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)); });
|
|
291
|
+
i0.ɵɵelementEnd();
|
|
292
|
+
i0.ɵɵelementStart(6, "input", 40);
|
|
293
|
+
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)); });
|
|
294
|
+
i0.ɵɵelementEnd()()();
|
|
271
295
|
}
|
|
272
296
|
if (rf & 2) {
|
|
273
297
|
const config_r15 = i0.ɵɵnextContext(3).$implicit;
|
|
274
298
|
i0.ɵɵadvance(2);
|
|
299
|
+
i0.ɵɵproperty("checked", config_r15.enableMin);
|
|
300
|
+
i0.ɵɵadvance(1);
|
|
301
|
+
i0.ɵɵproperty("checked", config_r15.enableMax);
|
|
302
|
+
i0.ɵɵadvance(2);
|
|
275
303
|
i0.ɵɵproperty("value", config_r15.value);
|
|
276
304
|
i0.ɵɵadvance(1);
|
|
277
305
|
i0.ɵɵproperty("value", config_r15.highValue);
|
|
278
|
-
i0.ɵɵadvance(1);
|
|
279
|
-
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));
|
|
280
306
|
}
|
|
281
307
|
}
|
|
282
|
-
function
|
|
308
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_select_6_option_1_Template(rf, ctx) {
|
|
283
309
|
if (rf & 1) {
|
|
284
|
-
i0.ɵɵelementStart(0, "option",
|
|
310
|
+
i0.ɵɵelementStart(0, "option", 43);
|
|
285
311
|
i0.ɵɵtext(1);
|
|
286
312
|
i0.ɵɵelementEnd();
|
|
287
313
|
}
|
|
288
314
|
if (rf & 2) {
|
|
289
|
-
const
|
|
290
|
-
i0.ɵɵproperty("value",
|
|
315
|
+
const singleOption_r53 = ctx.$implicit;
|
|
316
|
+
i0.ɵɵproperty("value", singleOption_r53);
|
|
291
317
|
i0.ɵɵadvance(1);
|
|
292
|
-
i0.ɵɵtextInterpolate1(" ",
|
|
318
|
+
i0.ɵɵtextInterpolate1(" ", singleOption_r53, " ");
|
|
293
319
|
}
|
|
294
320
|
}
|
|
295
|
-
function
|
|
321
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_select_6_Template(rf, ctx) {
|
|
296
322
|
if (rf & 1) {
|
|
297
|
-
const
|
|
298
|
-
i0.ɵɵelementStart(0, "select",
|
|
299
|
-
i0.ɵɵlistener("change", function
|
|
300
|
-
i0.ɵɵtemplate(1,
|
|
323
|
+
const _r56 = i0.ɵɵgetCurrentView();
|
|
324
|
+
i0.ɵɵelementStart(0, "select", 41);
|
|
325
|
+
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)); });
|
|
326
|
+
i0.ɵɵtemplate(1, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_select_6_option_1_Template, 2, 2, "option", 42);
|
|
301
327
|
i0.ɵɵelementEnd();
|
|
302
328
|
}
|
|
303
329
|
if (rf & 2) {
|
|
@@ -306,21 +332,21 @@ function PhoenixMenuItemComponent_div_7_ng_container_6_label_1_div_2_select_6_Te
|
|
|
306
332
|
i0.ɵɵproperty("ngForOf", config_r15.options);
|
|
307
333
|
}
|
|
308
334
|
}
|
|
309
|
-
const
|
|
310
|
-
function
|
|
335
|
+
const _c2$1 = function (a0) { return { "p-0": a0 }; };
|
|
336
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_Template(rf, ctx) {
|
|
311
337
|
if (rf & 1) {
|
|
312
338
|
i0.ɵɵelementStart(0, "div", 27);
|
|
313
|
-
i0.ɵɵtemplate(1,
|
|
314
|
-
i0.ɵɵtemplate(2,
|
|
315
|
-
i0.ɵɵtemplate(3,
|
|
316
|
-
i0.ɵɵtemplate(4,
|
|
317
|
-
i0.ɵɵtemplate(5,
|
|
318
|
-
i0.ɵɵtemplate(6,
|
|
339
|
+
i0.ɵɵtemplate(1, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_mat_checkbox_1_Template, 1, 1, "mat-checkbox", 28);
|
|
340
|
+
i0.ɵɵtemplate(2, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_app_config_slider_2_Template, 1, 5, "app-config-slider", 29);
|
|
341
|
+
i0.ɵɵtemplate(3, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_button_3_Template, 2, 1, "button", 30);
|
|
342
|
+
i0.ɵɵtemplate(4, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_input_4_Template, 1, 1, "input", 31);
|
|
343
|
+
i0.ɵɵtemplate(5, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_div_5_Template, 7, 4, "div", 32);
|
|
344
|
+
i0.ɵɵtemplate(6, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_select_6_Template, 2, 1, "select", 33);
|
|
319
345
|
i0.ɵɵelementEnd();
|
|
320
346
|
}
|
|
321
347
|
if (rf & 2) {
|
|
322
348
|
const config_r15 = i0.ɵɵnextContext(2).$implicit;
|
|
323
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(7,
|
|
349
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(7, _c2$1, config_r15.type === "button"));
|
|
324
350
|
i0.ɵɵadvance(1);
|
|
325
351
|
i0.ɵɵproperty("ngSwitchCase", "checkbox");
|
|
326
352
|
i0.ɵɵadvance(1);
|
|
@@ -335,11 +361,11 @@ function PhoenixMenuItemComponent_div_7_ng_container_6_label_1_div_2_Template(rf
|
|
|
335
361
|
i0.ɵɵproperty("ngSwitchCase", "select");
|
|
336
362
|
}
|
|
337
363
|
}
|
|
338
|
-
function
|
|
364
|
+
function PhoenixMenuItemComponent_div_7_ng_container_6_div_1_Template(rf, ctx) {
|
|
339
365
|
if (rf & 1) {
|
|
340
|
-
i0.ɵɵelementStart(0, "
|
|
341
|
-
i0.ɵɵtemplate(1,
|
|
342
|
-
i0.ɵɵtemplate(2,
|
|
366
|
+
i0.ɵɵelementStart(0, "div", 23);
|
|
367
|
+
i0.ɵɵtemplate(1, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_label_1_Template, 2, 4, "label", 24);
|
|
368
|
+
i0.ɵɵtemplate(2, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_div_2_Template, 7, 9, "div", 25);
|
|
343
369
|
i0.ɵɵelementEnd();
|
|
344
370
|
}
|
|
345
371
|
if (rf & 2) {
|
|
@@ -353,7 +379,7 @@ function PhoenixMenuItemComponent_div_7_ng_container_6_label_1_Template(rf, ctx)
|
|
|
353
379
|
function PhoenixMenuItemComponent_div_7_ng_container_6_Template(rf, ctx) {
|
|
354
380
|
if (rf & 1) {
|
|
355
381
|
i0.ɵɵelementContainerStart(0, 21);
|
|
356
|
-
i0.ɵɵtemplate(1,
|
|
382
|
+
i0.ɵɵtemplate(1, PhoenixMenuItemComponent_div_7_ng_container_6_div_1_Template, 3, 2, "div", 22);
|
|
357
383
|
i0.ɵɵelementContainerEnd();
|
|
358
384
|
}
|
|
359
385
|
if (rf & 2) {
|
|
@@ -363,12 +389,12 @@ function PhoenixMenuItemComponent_div_7_ng_container_6_Template(rf, ctx) {
|
|
|
363
389
|
i0.ɵɵproperty("ngIf", !config_r15.hidden);
|
|
364
390
|
}
|
|
365
391
|
}
|
|
366
|
-
const
|
|
392
|
+
const _c3$1 = function (a0) { return { "top.px": a0 }; };
|
|
367
393
|
function PhoenixMenuItemComponent_div_7_Template(rf, ctx) {
|
|
368
394
|
if (rf & 1) {
|
|
369
|
-
const
|
|
395
|
+
const _r61 = i0.ɵɵgetCurrentView();
|
|
370
396
|
i0.ɵɵelementStart(0, "div")(1, "button", 15);
|
|
371
|
-
i0.ɵɵlistener("click", function PhoenixMenuItemComponent_div_7_Template_button_click_1_listener() { i0.ɵɵrestoreView(
|
|
397
|
+
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); });
|
|
372
398
|
i0.ɵɵnamespaceSVG();
|
|
373
399
|
i0.ɵɵelementStart(2, "svg");
|
|
374
400
|
i0.ɵɵelement(3, "use", 16);
|
|
@@ -384,40 +410,40 @@ function PhoenixMenuItemComponent_div_7_Template(rf, ctx) {
|
|
|
384
410
|
i0.ɵɵadvance(4);
|
|
385
411
|
i0.ɵɵproperty("ngIf", ctx_r4.currentNode.configActive);
|
|
386
412
|
i0.ɵɵadvance(1);
|
|
387
|
-
i0.ɵɵproperty("hidden", !ctx_r4.currentNode.configActive)("ngStyle", i0.ɵɵpureFunction1(4,
|
|
413
|
+
i0.ɵɵproperty("hidden", !ctx_r4.currentNode.configActive)("ngStyle", i0.ɵɵpureFunction1(4, _c3$1, ctx_r4.configTop));
|
|
388
414
|
i0.ɵɵadvance(1);
|
|
389
415
|
i0.ɵɵproperty("ngForOf", ctx_r4.castConfigsToAny(ctx_r4.currentNode.configs));
|
|
390
416
|
}
|
|
391
417
|
}
|
|
392
|
-
const
|
|
418
|
+
const _c4$1 = function (a0) { return { expanded: a0 }; };
|
|
393
419
|
function PhoenixMenuItemComponent_button_8_Template(rf, ctx) {
|
|
394
420
|
if (rf & 1) {
|
|
395
|
-
const
|
|
396
|
-
i0.ɵɵelementStart(0, "button",
|
|
397
|
-
i0.ɵɵlistener("click", function PhoenixMenuItemComponent_button_8_Template_button_click_0_listener() { i0.ɵɵrestoreView(
|
|
421
|
+
const _r63 = i0.ɵɵgetCurrentView();
|
|
422
|
+
i0.ɵɵelementStart(0, "button", 44);
|
|
423
|
+
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); });
|
|
398
424
|
i0.ɵɵnamespaceSVG();
|
|
399
425
|
i0.ɵɵelementStart(1, "svg");
|
|
400
|
-
i0.ɵɵelement(2, "use",
|
|
426
|
+
i0.ɵɵelement(2, "use", 45);
|
|
401
427
|
i0.ɵɵelementEnd()();
|
|
402
428
|
}
|
|
403
429
|
if (rf & 2) {
|
|
404
430
|
const ctx_r5 = i0.ɵɵnextContext();
|
|
405
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(1,
|
|
431
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(1, _c4$1, ctx_r5.currentNode.childrenActive));
|
|
406
432
|
}
|
|
407
433
|
}
|
|
408
434
|
function PhoenixMenuItemComponent_div_9_app_phoenix_menu_item_1_Template(rf, ctx) {
|
|
409
435
|
if (rf & 1) {
|
|
410
|
-
i0.ɵɵelement(0, "app-phoenix-menu-item",
|
|
436
|
+
i0.ɵɵelement(0, "app-phoenix-menu-item", 48);
|
|
411
437
|
}
|
|
412
438
|
if (rf & 2) {
|
|
413
|
-
const
|
|
414
|
-
i0.ɵɵproperty("currentNode",
|
|
439
|
+
const childNode_r65 = ctx.$implicit;
|
|
440
|
+
i0.ɵɵproperty("currentNode", childNode_r65);
|
|
415
441
|
}
|
|
416
442
|
}
|
|
417
443
|
function PhoenixMenuItemComponent_div_9_Template(rf, ctx) {
|
|
418
444
|
if (rf & 1) {
|
|
419
|
-
i0.ɵɵelementStart(0, "div",
|
|
420
|
-
i0.ɵɵtemplate(1, PhoenixMenuItemComponent_div_9_app_phoenix_menu_item_1_Template, 1, 1, "app-phoenix-menu-item",
|
|
445
|
+
i0.ɵɵelementStart(0, "div", 46);
|
|
446
|
+
i0.ɵɵtemplate(1, PhoenixMenuItemComponent_div_9_app_phoenix_menu_item_1_Template, 1, 1, "app-phoenix-menu-item", 47);
|
|
421
447
|
i0.ɵɵelementEnd();
|
|
422
448
|
}
|
|
423
449
|
if (rf & 2) {
|
|
@@ -451,7 +477,7 @@ PhoenixMenuItemComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Ph
|
|
|
451
477
|
let _t;
|
|
452
478
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.phoenixMenuItem = _t.first);
|
|
453
479
|
}
|
|
454
|
-
}, 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"], [
|
|
480
|
+
}, 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) {
|
|
455
481
|
if (rf & 1) {
|
|
456
482
|
i0.ɵɵelementStart(0, "div", 0, 1)(2, "div", 2);
|
|
457
483
|
i0.ɵɵtemplate(3, PhoenixMenuItemComponent_ng_container_3_Template, 3, 2, "ng-container", 3);
|
|
@@ -474,11 +500,11 @@ PhoenixMenuItemComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Ph
|
|
|
474
500
|
i0.ɵɵadvance(1);
|
|
475
501
|
i0.ɵɵproperty("ngIf", ctx.currentNode.childrenActive);
|
|
476
502
|
}
|
|
477
|
-
}, 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,
|
|
503
|
+
}, 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 });
|
|
478
504
|
(function () {
|
|
479
505
|
(typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PhoenixMenuItemComponent, [{
|
|
480
506
|
type: Component,
|
|
481
|
-
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 <
|
|
507
|
+
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"] }]
|
|
482
508
|
}], function () { return [{ type: i0.ChangeDetectorRef }]; }, { currentNode: [{
|
|
483
509
|
type: Input
|
|
484
510
|
}], phoenixMenuItem: [{
|
|
@@ -586,30 +612,43 @@ function AnimateCameraComponent_button_2_Template(rf, ctx) {
|
|
|
586
612
|
}
|
|
587
613
|
}
|
|
588
614
|
const defaultAnimationPresets = {
|
|
589
|
-
'
|
|
615
|
+
'Cavern to ID': {
|
|
616
|
+
name: 'Cavern to ID',
|
|
590
617
|
positions: [
|
|
591
618
|
{
|
|
592
|
-
position: [
|
|
619
|
+
position: [66388.95051168812, 5264.228603228927, -46910.7848593543],
|
|
593
620
|
duration: 1000,
|
|
594
621
|
},
|
|
595
622
|
{
|
|
596
|
-
position: [
|
|
623
|
+
position: [12834.18729094943, 677.7571205763458, 135.68755273443463],
|
|
597
624
|
duration: 2000,
|
|
598
625
|
},
|
|
599
626
|
{
|
|
600
|
-
position: [
|
|
627
|
+
position: [312.02688693297375, 25.884223757326, 270.10019006776236],
|
|
601
628
|
duration: 3500,
|
|
602
629
|
},
|
|
603
630
|
{
|
|
604
|
-
position: [
|
|
631
|
+
position: [263.3640855132258, 19.874838262525053, -318.16541790248885],
|
|
605
632
|
duration: 3000,
|
|
606
633
|
},
|
|
607
634
|
{
|
|
608
|
-
position: [
|
|
635
|
+
position: [5534.140362338047, 234.03507981484574, -2933.619479808285],
|
|
609
636
|
duration: 2000,
|
|
610
637
|
},
|
|
611
638
|
{
|
|
612
|
-
position: [
|
|
639
|
+
position: [2681.277288705242, 646.5795158318147, 5628.5248735111745],
|
|
640
|
+
duration: 1000,
|
|
641
|
+
},
|
|
642
|
+
{
|
|
643
|
+
position: [-6062.586283740076, 790.5876682946184, 1381.1675900848818],
|
|
644
|
+
duration: 1000,
|
|
645
|
+
},
|
|
646
|
+
{
|
|
647
|
+
position: [-1766.7693725879053, 1007.1048030984678, -5928.901341784575],
|
|
648
|
+
duration: 1000,
|
|
649
|
+
},
|
|
650
|
+
{
|
|
651
|
+
position: [12814.982506255355, 2516.987185037266, -22891.902734328327],
|
|
613
652
|
duration: 1000,
|
|
614
653
|
},
|
|
615
654
|
],
|
|
@@ -623,6 +662,10 @@ class AnimateCameraComponent {
|
|
|
623
662
|
this.animationPresets = defaultAnimationPresets;
|
|
624
663
|
this.animationPresetsKeys = Object.keys(this.animationPresets);
|
|
625
664
|
this.isAnimating = false;
|
|
665
|
+
// this.animationPresets = this.eventDisplay
|
|
666
|
+
// .getUIManager()
|
|
667
|
+
// .getPresetAnimations();
|
|
668
|
+
// This is too late to fill the UI! FIXME. EJWM
|
|
626
669
|
}
|
|
627
670
|
animatePreset(preset) {
|
|
628
671
|
this.setDetectorOpacity(0.2);
|
|
@@ -812,8 +855,12 @@ class OverlayComponent {
|
|
|
812
855
|
this.resizable = false;
|
|
813
856
|
/** If the overlay body is transparent or not. */
|
|
814
857
|
this.transparentBody = false;
|
|
858
|
+
/** If the aspect ratio is kept fixed or not. */
|
|
859
|
+
this.keepAspectRatioFixed = false;
|
|
815
860
|
/** If the overlay body is visible or not. */
|
|
816
861
|
this.showBody = true;
|
|
862
|
+
/** Aspect ratio of the overlay view. */
|
|
863
|
+
this.aspectRatio = window.innerWidth / window.innerHeight;
|
|
817
864
|
/** Minimum resizable width. */
|
|
818
865
|
this.MIN_RES_WIDTH = 300;
|
|
819
866
|
/** Minimum resizable height */
|
|
@@ -848,7 +895,12 @@ class OverlayComponent {
|
|
|
848
895
|
this.setHandleTransform(overlayRect, dragRect);
|
|
849
896
|
if (width > this.MIN_RES_WIDTH && height > this.MIN_RES_HEIGHT) {
|
|
850
897
|
overlayCardElement.style.width = width + 'px';
|
|
851
|
-
|
|
898
|
+
if (this.keepAspectRatioFixed) {
|
|
899
|
+
overlayCardElement.style.height = width / this.aspectRatio + 30 + 'px';
|
|
900
|
+
}
|
|
901
|
+
else {
|
|
902
|
+
overlayCardElement.style.height = height + 'px';
|
|
903
|
+
}
|
|
852
904
|
}
|
|
853
905
|
}
|
|
854
906
|
/**
|
|
@@ -882,7 +934,7 @@ OverlayComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: OverlayCom
|
|
|
882
934
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.overlayCard = _t.first);
|
|
883
935
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.resizeHandleCorner = _t.first);
|
|
884
936
|
}
|
|
885
|
-
}, 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) {
|
|
937
|
+
}, 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) {
|
|
886
938
|
if (rf & 1) {
|
|
887
939
|
i0.ɵɵprojectionDef();
|
|
888
940
|
i0.ɵɵelementStart(0, "div", 0, 1);
|
|
@@ -915,6 +967,8 @@ OverlayComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: OverlayCom
|
|
|
915
967
|
type: Input
|
|
916
968
|
}], transparentBody: [{
|
|
917
969
|
type: Input
|
|
970
|
+
}], keepAspectRatioFixed: [{
|
|
971
|
+
type: Input
|
|
918
972
|
}], overlayCard: [{
|
|
919
973
|
type: ViewChild,
|
|
920
974
|
args: ['overlayCard']
|
|
@@ -1427,11 +1481,11 @@ ExperimentInfoComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Exp
|
|
|
1427
1481
|
i0.ɵɵadvance(1);
|
|
1428
1482
|
i0.ɵɵproperty("ngForOf", ctx.experimentInfo);
|
|
1429
1483
|
}
|
|
1430
|
-
}, 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}}"] });
|
|
1484
|
+
}, 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}}"] });
|
|
1431
1485
|
(function () {
|
|
1432
1486
|
(typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ExperimentInfoComponent, [{
|
|
1433
1487
|
type: Component,
|
|
1434
|
-
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"] }]
|
|
1488
|
+
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"] }]
|
|
1435
1489
|
}], function () { return [{ type: EventDisplayService }]; }, { url: [{
|
|
1436
1490
|
type: Input
|
|
1437
1491
|
}], logo: [{
|
|
@@ -2187,7 +2241,7 @@ OverlayViewWindowComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
|
|
|
2187
2241
|
let _t;
|
|
2188
2242
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.overlayWindow = _t.first);
|
|
2189
2243
|
}
|
|
2190
|
-
}, inputs: { showOverlay: "showOverlay" }, decls: 8, vars:
|
|
2244
|
+
}, 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) {
|
|
2191
2245
|
if (rf & 1) {
|
|
2192
2246
|
i0.ɵɵelementStart(0, "app-overlay", 0)(1, "div", 1);
|
|
2193
2247
|
i0.ɵɵelement(2, "canvas", 2, 3);
|
|
@@ -2202,7 +2256,7 @@ OverlayViewWindowComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
|
|
|
2202
2256
|
i0.ɵɵelementEnd()()()();
|
|
2203
2257
|
}
|
|
2204
2258
|
if (rf & 2) {
|
|
2205
|
-
i0.ɵɵproperty("resizable", true)("transparentBody", ctx.transparentBody)("active", ctx.showOverlay);
|
|
2259
|
+
i0.ɵɵproperty("resizable", true)("transparentBody", ctx.transparentBody)("active", ctx.showOverlay)("keepAspectRatioFixed", true);
|
|
2206
2260
|
i0.ɵɵadvance(2);
|
|
2207
2261
|
i0.ɵɵproperty("hidden", !ctx.showOverlay);
|
|
2208
2262
|
i0.ɵɵadvance(4);
|
|
@@ -2214,7 +2268,7 @@ OverlayViewWindowComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
|
|
|
2214
2268
|
(function () {
|
|
2215
2269
|
(typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(OverlayViewWindowComponent, [{
|
|
2216
2270
|
type: Component,
|
|
2217
|
-
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"] }]
|
|
2271
|
+
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"] }]
|
|
2218
2272
|
}], function () { return [{ type: EventDisplayService }]; }, { showOverlay: [{
|
|
2219
2273
|
type: Input
|
|
2220
2274
|
}], overlayWindow: [{
|
|
@@ -3663,7 +3717,10 @@ GlobalErrorHandler.ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: Globa
|
|
|
3663
3717
|
|
|
3664
3718
|
class ExperimentLinkComponent {
|
|
3665
3719
|
ngOnInit() {
|
|
3666
|
-
|
|
3720
|
+
// we just want to remove the "&embed=true" instruction here.
|
|
3721
|
+
const url = new URL(window.location.href);
|
|
3722
|
+
url.searchParams.delete('embed');
|
|
3723
|
+
this.experimentLink = url.toString();
|
|
3667
3724
|
}
|
|
3668
3725
|
goToExperiment() {
|
|
3669
3726
|
window.open(this.experimentLink, '_blank');
|
|
@@ -3774,7 +3831,6 @@ PhoenixUIModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ providers: [
|
|
|
3774
3831
|
MatSlideToggleModule,
|
|
3775
3832
|
MatCheckboxModule,
|
|
3776
3833
|
MatIconModule,
|
|
3777
|
-
NgxSliderModule,
|
|
3778
3834
|
CdkTreeModule,
|
|
3779
3835
|
MatTabsModule] });
|
|
3780
3836
|
(function () {
|
|
@@ -3797,7 +3853,6 @@ PhoenixUIModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ providers: [
|
|
|
3797
3853
|
MatSlideToggleModule,
|
|
3798
3854
|
MatCheckboxModule,
|
|
3799
3855
|
MatIconModule,
|
|
3800
|
-
NgxSliderModule,
|
|
3801
3856
|
CdkTreeModule,
|
|
3802
3857
|
MatTabsModule,
|
|
3803
3858
|
],
|
|
@@ -3882,7 +3937,6 @@ PhoenixUIModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ providers: [
|
|
|
3882
3937
|
MatSlideToggleModule,
|
|
3883
3938
|
MatCheckboxModule,
|
|
3884
3939
|
MatIconModule,
|
|
3885
|
-
NgxSliderModule,
|
|
3886
3940
|
CdkTreeModule,
|
|
3887
3941
|
MatTabsModule], exports: [NavComponent,
|
|
3888
3942
|
UiMenuWrapperComponent,
|