door_models 2.0.1 → 2.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. package/dist/index.cjs.js +5 -1294
  2. package/dist/index.cjs.js.map +1 -1
  3. package/dist/index.esm.js +6 -1295
  4. package/dist/index.esm.js.map +1 -1
  5. package/package.json +1 -1
  6. package/dist/components/DoorModels.d.ts +0 -20
  7. package/dist/components/DoorModels.js +0 -924
  8. package/dist/components/Interface.d.ts +0 -1
  9. package/dist/components/Interface.js +0 -1307
  10. package/dist/context/DoorContext.d.ts +0 -130
  11. package/dist/context/DoorContext.js +0 -631
  12. package/dist/index.js +0 -33
package/dist/components/Interface.js DELETED
@@ -1,1307 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.Interface = void 0;
7
- var _react = _interopRequireWildcard(require("react"));
8
- var _material = require("@mui/material");
9
- var _DoorContext = require("../context/DoorContext");
10
- var _DoorModels = require("../components/DoorModels");
11
- var _iconsMaterial = require("@mui/icons-material");
12
- var _jsxRuntime = require("react/jsx-runtime");
13
- const _excluded = ["frameType"];
14
- function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
15
- function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
16
- function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
17
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
18
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
19
- function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
20
- function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
21
- function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
22
- const cpidOptions = ["P_SD_FH_AF20_40", "P_SD_FH_AF20_40OCC", "P_SD_FH_AF40_40", "P_SD_FH_AF40_40OCC", "P_SD_FH_WF_40", "P_SD_FH_WF_40OCC", "P_SD_FH_MXF_40", "P_SD_FH_MXF_40OCC", "P_SD_FH_MXCAF_40", "P_SD_FH_MXCAF_40OCC", "P_SD_FH_AF20_50", "P_SD_FH_AF20_50OCC", "P_SD_FH_AF40_50", "P_SD_FH_AF40_50OCC", "P_SD_FH_WF_50", "P_SD_FH_WF_50OCC", "P_SD_FH_WF_FLI", "P_SD_FH_AF20_SG8", "P_SD_FH_AF20_SG10", "P_SD_FH_AF20_SG12", "P_SD_FH_AF40_SG8", "P_SD_FH_AF40_SG10", "P_SD_FH_AF40_SG12", "P_SD_FH_NOF_SG8", "P_SD_FH_NOF_SG10", "P_SD_FH_NOF_SG12", "P_SD_FH_WF_100", "P_SD_FH_WDGF_WDG100", "P_SD_FH_AF20_40_IFL", "P_SD_FH_AF20_40OCC_IFL", "P_SD_FH_AF40_40_IFL", "P_SD_FH_AF40_40OCC_IFL", "P_SD_FH_WF_40_IFL", "P_SD_FH_WF_40OCC_IFL", "P_SD_FH_AF20_50_IFL", "P_SD_FH_AF20_50OCC_IFL", "P_SD_FH_AF40_50_IFL", "P_SD_FH_AF40_50OCC_IFL", "P_SD_FH_WF_50_IFL", "P_SD_FH_WF_50OCC_IFL", "P_SD_WPFL_AF20_40", "P_SD_WPFL_AF20_40OCC", "P_SD_WPFL_AF40_40", "P_SD_WPFL_AF40_40OCC", "P_SD_WPFL_WF_40", "P_SD_WPFL_WF_40OCC", "P_SD_WPFL_AF20_50", "P_SD_WPFL_AF20_50OCC", "P_SD_WPFL_AF40_50", "P_SD_WPFL_AF40_50OCC", "P_SD_WPFL_WF_50", "P_SD_WPFL_WF_50OCC", "P_SD_WPFL_AF20_SG8", "P_SD_WPFL_AF20_SG10", "P_SD_WPFL_AF20_SG12", "P_SD_WPFL_AF40_SG8", "P_SD_WPFL_AF40_SG10", "P_SD_WPFL_AF40_SG12", "P_SD_ALSGFL_AF20_40", "P_SD_ALSGFL_AF20_40OCC", "P_SD_ALSGFL_AF40_40", "P_SD_ALSGFL_AF40_40OCC", "P_SD_ALSGFL_WF_40", "P_SD_ALSGFL_WF_40OCC", "P_SD_ALSGFL_AF20_SG8", "P_SD_ALSGFL_AF20_SG10", "P_SD_ALSGFL_AF20_SG12", "P_SD_ALSGFL_AF40_SG8", "P_SD_ALSGFL_AF40_SG10", "P_SD_ALSGFL_AF40_SG12", "P_SD_ALDGFL_AF20_40", "P_SD_ALDGFL_AF20_40OCC", "P_SD_ALDGFL_AF40_40", "P_SD_ALDGFL_AF40_40OCC", "P_SD_ALDGFL_WF_40", "P_SD_ALDGFL_WF_40OCC", "P_SD_ALDGFL_AF20_50", "P_SD_ALDGFL_AF20_50OCC", "P_SD_ALDGFL_AF40_50", "P_SD_ALDGFL_AF40_50OCC", "P_SD_ALDGFL_WF_50", "P_SD_ALDGFL_WF_50OCC", "P_SD_ALDGFL_AF20_SG8", "P_SD_ALDGFL_AF20_SG10", "P_SD_ALDGFL_AF20_SG12", "P_SD_ALDGFL_AF40_SG8", "P_SD_ALDGFL_AF40_SG10", "P_SD_ALDGFL_AF40_SG12"];
23
- const EditableSlider = _ref => {
24
- let {
25
- label,
26
- value,
27
- min,
28
- max,
29
- step = 1,
30
- onChange
31
- } = _ref;
32
- const [inputValue, setInputValue] = (0, _react.useState)(value);
33
- _react.default.useEffect(() => {
34
- setInputValue(value);
35
- }, [value]);
36
- const handleSliderChange = (_, newValue) => {
37
- onChange(newValue);
38
- };
39
- const handleInputChange = event => {
40
- setInputValue(event.target.value);
41
- };
42
- const handleInputBlur = () => {
43
- let numericValue = inputValue === "" || isNaN(Number(inputValue)) ? min : Number(inputValue);
44
- if (numericValue < min) numericValue = min;
45
- if (numericValue > max) numericValue = max;
46
- onChange(numericValue);
47
- };
48
- const handleInputKeyDown = event => {
49
- if (event.key === "Enter") {
50
- handleInputBlur();
51
- event.target.blur();
52
- }
53
- };
54
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.FormControl, {
55
- fullWidth: true,
56
- children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.FormLabel, {
57
- sx: {
58
- mb: 1,
59
- display: "flex",
60
- justifyContent: "space-between",
61
- alignItems: "center"
62
- },
63
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
64
- children: label
65
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, {
66
- value: inputValue,
67
- size: "small",
68
- onChange: handleInputChange,
69
- onBlur: handleInputBlur,
70
- onKeyDown: handleInputKeyDown,
71
- type: "number",
72
- variant: "outlined",
73
- inputProps: {
74
- step: step,
75
- min: min,
76
- max: max,
77
- "aria-labelledby": "input-slider"
78
- },
79
- InputProps: {
80
- endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.InputAdornment, {
81
- position: "end",
82
- children: "mm"
83
- })
84
- },
85
- sx: {
86
- width: "140px"
87
- }
88
- })]
89
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Slider, {
90
- value: typeof value === "number" ? value : min,
91
- min: min,
92
- max: max,
93
- step: step,
94
- onChange: handleSliderChange,
95
- "aria-labelledby": "input-slider"
96
- })]
97
- });
98
- };
99
- const MaterialInput = _ref2 => {
100
- let {
101
- label,
102
- value,
103
- onChange,
104
- onApply
105
- } = _ref2;
106
- const [inputValue, setInputValue] = (0, _react.useState)(value);
107
- _react.default.useEffect(() => {
108
- setInputValue(value);
109
- }, [value]);
110
- const handleApply = () => {
111
- if (onApply) {
112
- onApply(inputValue);
113
- }
114
- onChange(inputValue);
115
- };
116
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.FormControl, {
117
- fullWidth: true,
118
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormLabel, {
119
- children: label
120
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
121
- direction: "row",
122
- spacing: 1,
123
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, {
124
- size: "small",
125
- value: inputValue,
126
- onChange: e => setInputValue(e.target.value)
127
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Button, {
128
- variant: "contained",
129
- onClick: handleApply,
130
- children: "Apply"
131
- })]
132
- })]
133
- });
134
- };
135
- const MaterialSelector = _ref3 => {
136
- let {
137
- label,
138
- value,
139
- onChange
140
- } = _ref3;
141
- const materialOptions = Object.keys(_DoorModels.availableMaterials);
142
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.FormControl, {
143
- fullWidth: true,
144
- size: "small",
145
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormLabel, {
146
- children: label
147
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Select, {
148
- value: value,
149
- onChange: e => onChange(e.target.value),
150
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.MenuItem, {
151
- value: "none",
152
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)("em", {
153
- children: "None"
154
- })
155
- }), materialOptions.map(name => /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.MenuItem, {
156
- value: name,
157
- children: name
158
- }, name))]
159
- })]
160
- });
161
- };
162
- const Interface = () => {
163
- const {
164
- isPlaneVisible,
165
- setIsPlaneVisible,
166
- cpid,
167
- setCpid,
168
- door,
169
- setDoor,
170
- doorFrame,
171
- setDoorFrame,
172
- interiorFanlight,
173
- setInteriorFanlight,
174
- exteriorFanlight,
175
- setExteriorFanlight,
176
- occulus,
177
- setOcculus,
178
- frontCoverPanel,
179
- setFrontCoverPanel,
180
- backCoverPanel,
181
- setBackCoverPanel,
182
- frameType,
183
- setFrameType,
184
- bodyType,
185
- setBodyType,
186
- totalHeight,
187
- setTotalHeight,
188
- totalWidth,
189
- setTotalWidth,
190
- exteriorFanlightType,
191
- setExteriorFanlightType,
192
- testDoorMaterial,
193
- setTestDoorMaterial,
194
- testFrameMaterial,
195
- setTestFrameMaterial,
196
- testInteriorFanlightMaterial,
197
- setTestInteriorFanlightMaterial,
198
- testExteriorFanlightMaterial,
199
- setTestExteriorFanlightMaterial,
200
- testOcculusInfillMaterial,
201
- setTestOcculusInfillMaterial,
202
- testGlassInfillMaterial,
203
- setTestGlassInfillMaterial,
204
- testGasketMaterial,
205
- setTestGasketMaterial,
206
- testDoorStopMaterial,
207
- setTestDoorStopMaterial,
208
- testHingeMaterial,
209
- setTestHingeMaterial,
210
- glassVisible,
211
- setGlassVisible,
212
- glassDepth,
213
- setGlassDepth,
214
- testFrontCoverPanelMaterial,
215
- setTestFrontCoverPanelMaterial,
216
- setTestBackCoverPanelMaterial
217
- } = (0, _DoorContext.useConfigurator)();
218
- const [parseMessage, setParseMessage] = (0, _react.useState)({
219
- type: "",
220
- text: ""
221
- });
222
- const handleMaterialApply = materialName => {
223
- console.log("[DATABASE SIMULATION] Started fetching data for material: \"".concat(materialName, "\""));
224
- };
225
- const fileInputRef = (0, _react.useRef)(null);
226
- const handleExport = () => {
227
- if (!cpid || cpid.trim() === "") {
228
- alert("Please enter a Door Title (CPID) before exporting.");
229
- return;
230
- }
231
- const doorFrameWithFrameType = _objectSpread(_objectSpread({}, doorFrame), {}, {
232
- frameType: frameType
233
- });
234
- const exportData = {
235
- cpid,
236
- door,
237
- doorFrame: doorFrameWithFrameType,
238
- interiorFanlight,
239
- exteriorFanlight,
240
- occulus,
241
- frontCoverPanel,
242
- backCoverPanel
243
- };
244
- const jsonString = "data:text/json;charset=utf-8,".concat(encodeURIComponent(JSON.stringify(exportData, null, 2)));
245
- const link = document.createElement("a");
246
- link.href = jsonString;
247
- link.download = "".concat(cpid.trim(), ".json");
248
- link.click();
249
- };
250
- const handleImportClick = () => {
251
- if (fileInputRef.current) {
252
- fileInputRef.current.click();
253
- }
254
- };
255
- const handleFileChange = event => {
256
- var _event$target$files;
257
- const file = (_event$target$files = event.target.files) === null || _event$target$files === void 0 ? void 0 : _event$target$files[0];
258
- if (!file) return;
259
- const reader = new FileReader();
260
- reader.onload = e => {
261
- if (e.target && typeof e.target.result === "string") {
262
- try {
263
- const importedData = JSON.parse(e.target.result);
264
- if (importedData.cpid) setCpid(importedData.cpid);
265
- if (importedData.door) setDoor(importedData.door);
266
- if (importedData.doorFrame) {
267
- const _importedData$doorFra = importedData.doorFrame,
268
- {
269
- frameType: importedFrameType
270
- } = _importedData$doorFra,
271
- doorFrameData = _objectWithoutProperties(_importedData$doorFra, _excluded);
272
- setDoorFrame(doorFrameData);
273
- if (importedFrameType) setFrameType(importedFrameType);
274
- }
275
- if (importedData.interiorFanlight) setInteriorFanlight(importedData.interiorFanlight);
276
- if (importedData.exteriorFanlight) setExteriorFanlight(importedData.exteriorFanlight);
277
- if (importedData.occulus) setOcculus(importedData.occulus);
278
- if (importedData.frontCoverPanel) setFrontCoverPanel(importedData.frontCoverPanel);
279
- if (importedData.backCoverPanel) setBackCoverPanel(importedData.backCoverPanel);
280
- } catch (error) {
281
- console.error("Error parsing JSON file:", error);
282
- alert("Error: Could not parse the JSON file.");
283
- }
284
- } else {
285
- console.error("FileReader error: result is not a string or target is null");
286
- alert("Error: Could not read the file.");
287
- }
288
- };
289
- reader.readAsText(file);
290
- event.target.value = "";
291
- };
292
- const handleParseCpid = (0, _react.useCallback)(cpidToParse => {
293
- const showMessage = function (text) {
294
- let type = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "error";
295
- setParseMessage({
296
- text,
297
- type
298
- });
299
- setTimeout(() => setParseMessage({
300
- text: "",
301
- type: ""
302
- }), 4000);
303
- };
304
- if (!cpidToParse || !cpidToParse.trim().startsWith("P_")) {
305
- showMessage("Invalid format: CPID must start with 'P_'.");
306
- return;
307
- }
308
- const parts = cpidToParse.trim().split("_");
309
- if (parts.length < 4) {
310
- showMessage("Invalid format: Not enough parts in CPID.");
311
- return;
312
- }
313
- const newConfig = {
314
- fanlightVisible: false,
315
- fanlightType: "WPFL",
316
- interiorFanlightVisible: false,
317
- occulusVisible: false,
318
- frameType: "",
319
- bodyType: ""
320
- };
321
- let currentIndex = 1;
322
-
323
- // Door Type
324
- if (parts[currentIndex] === "SD") {
325
- currentIndex++;
326
- } else {
327
- showMessage("Unsupported Door Type: Only 'SD' is supported.");
328
- return;
329
- }
330
-
331
- //Fanlight Type
332
- const fanlightPart = parts[currentIndex];
333
- const validFanlights = ["WPFL", "ALDGFL", "ALSGFL"];
334
- if (fanlightPart === "FH") {
335
- newConfig.fanlightVisible = false;
336
- currentIndex++;
337
- } else if (validFanlights.includes(fanlightPart)) {
338
- newConfig.fanlightVisible = true;
339
- newConfig.fanlightType = fanlightPart;
340
- currentIndex++;
341
- } else {
342
- showMessage("Invalid Fanlight Type: '".concat(fanlightPart, "'."));
343
- return;
344
- }
345
-
346
- // Frame and Body Type
347
- const validSimpleFrameTypes = ["AF20", "AF40", "WF", "MXF", "MXCAF", "NOF"];
348
- const validBodyTypes = ["40", "50", "FLI", "100", "WDG100", "SG8", "SG10", "SG12"];
349
- let framePart = parts[currentIndex];
350
- let bodyPartRaw = parts[currentIndex + 1] || "";
351
- let frameFound = false;
352
- if ("".concat(framePart, "_").concat(bodyPartRaw) === "WDGF_WDG100") {
353
- newConfig.frameType = "WDGF_WDG100";
354
- newConfig.bodyType = "WDG100";
355
- currentIndex += 2;
356
- frameFound = true;
357
- } else if (validSimpleFrameTypes.includes(framePart)) {
358
- let tempBody = bodyPartRaw.replace("OCC", "");
359
- if (validBodyTypes.includes(tempBody)) {
360
- newConfig.frameType = framePart === "NOF" ? "NOF" : "".concat(framePart, "_").concat(tempBody);
361
- newConfig.bodyType = tempBody;
362
- if (bodyPartRaw.endsWith("OCC")) {
363
- newConfig.occulusVisible = true;
364
- }
365
- currentIndex += 2;
366
- frameFound = true;
367
- }
368
- }
369
- if (!frameFound) {
370
- showMessage("Invalid Frame/Body combination starting with '".concat(framePart, "'."));
371
- return;
372
- }
373
- for (let i = currentIndex; i < parts.length; i++) {
374
- if (parts[i] === "IFL") {
375
- newConfig.interiorFanlightVisible = true;
376
- } else if (parts[i] === "OCC") {
377
- newConfig.occulusVisible = true;
378
- }
379
- }
380
-
381
- // Apply final configuration
382
- setFrameType(newConfig.frameType);
383
- setBodyType(newConfig.bodyType);
384
- setExteriorFanlight(prev => _objectSpread(_objectSpread({}, prev), {}, {
385
- visible: newConfig.fanlightVisible
386
- }));
387
- if (newConfig.fanlightVisible) {
388
- setExteriorFanlightType(newConfig.fanlightType);
389
- }
390
- setInteriorFanlight(prev => _objectSpread(_objectSpread({}, prev), {}, {
391
- visible: newConfig.interiorFanlightVisible
392
- }));
393
- setOcculus(prev => _objectSpread(_objectSpread({}, prev), {}, {
394
- visible: newConfig.occulusVisible
395
- }));
396
- showMessage("Configuration Applied!", "success");
397
- }, [setBodyType, setExteriorFanlight, setExteriorFanlightType, setFrameType, setInteriorFanlight, setOcculus]);
398
- const mainDoorHeight = door.doorHeight - (interiorFanlight.visible ? interiorFanlight.height : 0);
399
- const handleExteriorFanlightHeightChange = newHeight => {
400
- const oldHeight = exteriorFanlight.height;
401
- const heightDifference = newHeight - oldHeight;
402
- setExteriorFanlight(_objectSpread(_objectSpread({}, exteriorFanlight), {}, {
403
- height: newHeight
404
- }));
405
- setTotalHeight(totalHeight + heightDifference);
406
- };
407
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
408
- children: [parseMessage.text && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
409
- sx: {
410
- position: "absolute",
411
- top: 20,
412
- left: "50%",
413
- transform: "translateX(-50%)",
414
- padding: "10px 20px",
415
- backgroundColor: parseMessage.type === "error" ? "rgba(211, 47, 47, 0.8)" : "rgba(46, 125, 50, 0.8)",
416
- backdropFilter: "blur(5px)",
417
- borderRadius: "10px",
418
- color: "white",
419
- zIndex: 20,
420
- textAlign: "center"
421
- },
422
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
423
- variant: "body1",
424
- children: parseMessage.text
425
- })
426
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
427
- sx: {
428
- position: "absolute",
429
- top: 20,
430
- left: 20,
431
- padding: "10px 15px",
432
- backgroundColor: "rgba(0, 0, 0, 0.6)",
433
- backdropFilter: "blur(10px)",
434
- borderRadius: "10px",
435
- color: "white",
436
- zIndex: 10
437
- },
438
- children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Typography, {
439
- variant: "body1",
440
- children: ["Total Width: ", Math.round(totalWidth), " mm"]
441
- }), frontCoverPanel.visible && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Typography, {
442
- variant: "body1",
443
- sx: {
444
- color: "#81d4fa"
445
- },
446
- children: ["Total Width with CAS:", " ", Math.round(totalWidth + frontCoverPanel.width * 2), " mm"]
447
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Typography, {
448
- variant: "body1",
449
- children: ["Total Height: ", Math.round(totalHeight), " mm"]
450
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Typography, {
451
- variant: "body1",
452
- children: ["Frame Depth: ", Math.round(doorFrame.frameDepth), " mm"]
453
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Typography, {
454
- variant: "body1",
455
- children: ["Door Depth: ", Math.round(door.theDoorDepth), " mm"]
456
- })]
457
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
458
- sx: {
459
- position: "absolute",
460
- top: 0,
461
- right: 0,
462
- height: "100vh",
463
- width: "25%",
464
- overflowY: "auto",
465
- boxSizing: "border-box",
466
- backgroundColor: "rgba(255, 255, 255, 0.95)",
467
- backdropFilter: "blur(10px)"
468
- },
469
- p: 2,
470
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
471
- spacing: 2,
472
- children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Paper, {
473
- elevation: 3,
474
- sx: {
475
- p: 2
476
- },
477
- children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.FormControl, {
478
- fullWidth: true,
479
- sx: {
480
- mb: 2
481
- },
482
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormLabel, {
483
- children: "Door Title (CPID)"
484
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
485
- direction: "row",
486
- spacing: 1,
487
- alignItems: "center",
488
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, {
489
- value: cpid,
490
- onChange: e => {
491
- setCpid(e.target.value);
492
- },
493
- variant: "outlined",
494
- size: "small",
495
- fullWidth: true,
496
- placeholder: "e.g. P_SD_WPFL_AF20_50_IFL"
497
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Button, {
498
- variant: "contained",
499
- onClick: () => handleParseCpid(cpid),
500
- children: "Apply"
501
- })]
502
- })]
503
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.FormControl, {
504
- fullWidth: true,
505
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormLabel, {
506
- children: "Or Select a Preset (Searchable)"
507
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Autocomplete, {
508
- value: cpid,
509
- onChange: (event, newValue) => {
510
- if (newValue) {
511
- setCpid(newValue);
512
- handleParseCpid(newValue);
513
- }
514
- },
515
- onInputChange: (event, newInputValue) => {
516
- setCpid(newInputValue);
517
- },
518
- options: cpidOptions,
519
- renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, _objectSpread(_objectSpread({}, params), {}, {
520
- size: "small"
521
- })),
522
- ListboxProps: {
523
- style: {
524
- maxHeight: 300
525
- }
526
- },
527
- freeSolo: true,
528
- disableClearable: true
529
- })]
530
- })]
531
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Paper, {
532
- elevation: 3,
533
- sx: {
534
- p: 2
535
- },
536
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
537
- direction: "row",
538
- spacing: 2,
539
- justifyContent: "center",
540
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Button, {
541
- variant: "contained",
542
- color: "primary",
543
- onClick: handleExport,
544
- children: "Export JSON"
545
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Button, {
546
- variant: "contained",
547
- color: "secondary",
548
- onClick: handleImportClick,
549
- children: "Import JSON"
550
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
551
- type: "file",
552
- ref: fileInputRef,
553
- style: {
554
- display: "none"
555
- },
556
- accept: ".json",
557
- onChange: handleFileChange
558
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
559
- title: isPlaneVisible ? "Hide Ground Plane" : "Show Ground Plane",
560
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.IconButton, {
561
- onClick: () => setIsPlaneVisible(!isPlaneVisible),
562
- children: isPlaneVisible ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_iconsMaterial.Visibility, {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_iconsMaterial.VisibilityOff, {})
563
- })
564
- })]
565
- })
566
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Paper, {
567
- elevation: 3,
568
- sx: {
569
- p: 2
570
- },
571
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
572
- spacing: 2,
573
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
574
- variant: "h6",
575
- color: "primary",
576
- children: "Door Properties"
577
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stack, {
578
- direction: "row",
579
- spacing: 2,
580
- alignItems: "flex-end",
581
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialInput, {
582
- label: "Door Material",
583
- value: door.doorMaterial,
584
- onChange: value => setDoor(_objectSpread(_objectSpread({}, door), {}, {
585
- doorMaterial: value
586
- })),
587
- onApply: handleMaterialApply
588
- })
589
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stack, {
590
- direction: "row",
591
- spacing: 2,
592
- alignItems: "flex-end",
593
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialSelector, {
594
- label: "Test Material",
595
- value: testDoorMaterial,
596
- onChange: setTestDoorMaterial
597
- })
598
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Divider, {}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.FormControl, {
599
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormLabel, {
600
- children: "Body Type"
601
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.RadioGroup, {
602
- row: true,
603
- value: bodyType,
604
- onChange: (_, value) => setBodyType(value),
605
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
606
- value: "40",
607
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
608
- size: "small"
609
- }),
610
- label: "40mm"
611
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
612
- value: "50",
613
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
614
- size: "small"
615
- }),
616
- label: "50mm"
617
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
618
- value: "SG8",
619
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
620
- size: "small"
621
- }),
622
- label: "8mm Glass"
623
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
624
- value: "SG10",
625
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
626
- size: "small"
627
- }),
628
- label: "10mm Glass"
629
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
630
- value: "SG12",
631
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
632
- size: "small"
633
- }),
634
- label: "12mm Glass"
635
- })]
636
- })]
637
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Divider, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(EditableSlider, {
638
- label: "Total Width",
639
- value: totalWidth,
640
- min: 600,
641
- max: 2200,
642
- onChange: setTotalWidth
643
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControl, {
644
- fullWidth: true,
645
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.FormLabel, {
646
- sx: {
647
- display: "flex",
648
- justifyContent: "space-between",
649
- alignItems: "center"
650
- },
651
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
652
- children: "Calculated Door Width"
653
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, {
654
- value: Math.round(door.doorWidth),
655
- size: "small",
656
- disabled: true,
657
- variant: "outlined",
658
- InputProps: {
659
- endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.InputAdornment, {
660
- position: "end",
661
- children: "mm"
662
- })
663
- },
664
- sx: {
665
- width: "140px"
666
- }
667
- })]
668
- })
669
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(EditableSlider, {
670
- label: "Total Height",
671
- value: totalHeight,
672
- min: 1500,
673
- max: 4000,
674
- onChange: setTotalHeight
675
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControl, {
676
- fullWidth: true,
677
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.FormLabel, {
678
- sx: {
679
- display: "flex",
680
- justifyContent: "space-between",
681
- alignItems: "center"
682
- },
683
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
684
- children: "Calculated Door Height"
685
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, {
686
- value: Math.round(door.doorHeight),
687
- size: "small",
688
- disabled: true,
689
- variant: "outlined",
690
- InputProps: {
691
- endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.InputAdornment, {
692
- position: "end",
693
- children: "mm"
694
- })
695
- },
696
- sx: {
697
- width: "140px"
698
- }
699
- })]
700
- })
701
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
702
- direction: "row",
703
- justifyContent: "space-around",
704
- children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.FormControl, {
705
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormLabel, {
706
- children: "Pivot"
707
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.RadioGroup, {
708
- row: true,
709
- value: door.doorPivot,
710
- onChange: (_, value) => setDoor(_objectSpread(_objectSpread({}, door), {}, {
711
- doorPivot: value
712
- })),
713
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
714
- value: "left",
715
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
716
- size: "small"
717
- }),
718
- label: "Left"
719
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
720
- value: "right",
721
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
722
- size: "small"
723
- }),
724
- label: "Right"
725
- })]
726
- })]
727
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.FormControl, {
728
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormLabel, {
729
- children: "Opening"
730
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.RadioGroup, {
731
- row: true,
732
- value: door.doorOpening,
733
- onChange: (_, value) => setDoor(_objectSpread(_objectSpread({}, door), {}, {
734
- doorOpening: value
735
- })),
736
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
737
- value: "in",
738
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
739
- size: "small"
740
- }),
741
- label: "In"
742
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
743
- value: "out",
744
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
745
- size: "small"
746
- }),
747
- label: "Out"
748
- })]
749
- })]
750
- })]
751
- })]
752
- })
753
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Paper, {
754
- elevation: 3,
755
- sx: {
756
- p: 2
757
- },
758
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
759
- spacing: 2,
760
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
761
- variant: "h6",
762
- color: "primary",
763
- children: "Frame Properties"
764
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stack, {
765
- direction: "row",
766
- spacing: 2,
767
- alignItems: "flex-end",
768
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialInput, {
769
- label: "Frame Material",
770
- value: doorFrame.frameMaterial,
771
- onChange: value => setDoorFrame(_objectSpread(_objectSpread({}, doorFrame), {}, {
772
- frameMaterial: value
773
- })),
774
- onApply: handleMaterialApply
775
- })
776
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialSelector, {
777
- label: "Test Material",
778
- value: testFrameMaterial,
779
- onChange: setTestFrameMaterial
780
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
781
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Divider, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
782
- variant: "subtitle1",
783
- color: "secondary",
784
- children: "Doorstop Properties"
785
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stack, {
786
- direction: "row",
787
- spacing: 2,
788
- alignItems: "flex-end",
789
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialInput, {
790
- label: "Doorstop Material",
791
- value: doorFrame.doorStopMaterial || "",
792
- onChange: value => setDoorFrame(_objectSpread(_objectSpread({}, doorFrame), {}, {
793
- doorStopMaterial: value
794
- })),
795
- onApply: handleMaterialApply
796
- })
797
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialSelector, {
798
- label: "Test Doorstop Material",
799
- value: testDoorStopMaterial,
800
- onChange: setTestDoorStopMaterial
801
- })]
802
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.FormControl, {
803
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormLabel, {
804
- children: "Frame Type"
805
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.RadioGroup, {
806
- value: frameType,
807
- onChange: (_, value) => setFrameType(value),
808
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
809
- value: "NOF",
810
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
811
- size: "small"
812
- }),
813
- label: "NOF"
814
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
815
- value: "AF20_40",
816
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
817
- size: "small"
818
- }),
819
- label: "AF20_40"
820
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
821
- value: "AF20_50",
822
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
823
- size: "small"
824
- }),
825
- label: "AF20_50"
826
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
827
- value: "AF40_40",
828
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
829
- size: "small"
830
- }),
831
- label: "AF40_40"
832
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
833
- value: "AF40_50",
834
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
835
- size: "small"
836
- }),
837
- label: "AF40_50"
838
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
839
- value: "WF_40",
840
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
841
- size: "small"
842
- }),
843
- label: "WF_40"
844
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
845
- value: "WF_50",
846
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
847
- size: "small"
848
- }),
849
- label: "WF_50"
850
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
851
- value: "WF_100",
852
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
853
- size: "small"
854
- }),
855
- label: "WF_100"
856
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
857
- value: "WF_FLI",
858
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
859
- size: "small"
860
- }),
861
- label: "WF_FLI"
862
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
863
- value: "WDGF_WDG100",
864
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
865
- size: "small"
866
- }),
867
- label: "WDGF_WDG100"
868
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
869
- value: "MXF_40",
870
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
871
- size: "small"
872
- }),
873
- label: "MXF_40"
874
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
875
- value: "MXF_50",
876
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
877
- size: "small"
878
- }),
879
- label: "MXF_50"
880
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
881
- value: "MXCAF_40",
882
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
883
- size: "small"
884
- }),
885
- label: "MXCAF_40"
886
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
887
- value: "MXCAF_50",
888
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
889
- size: "small"
890
- }),
891
- label: "MXCAF_50"
892
- })]
893
- })]
894
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Divider, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
895
- variant: "subtitle1",
896
- color: "secondary",
897
- children: "Gasket Properties"
898
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stack, {
899
- direction: "row",
900
- spacing: 2,
901
- alignItems: "flex-end",
902
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialInput, {
903
- label: "Gasket Material",
904
- value: doorFrame.gasketMaterial,
905
- onChange: value => setDoorFrame(_objectSpread(_objectSpread({}, doorFrame), {}, {
906
- gasketMaterial: value
907
- })),
908
- onApply: handleMaterialApply
909
- })
910
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialSelector, {
911
- label: "Test Gasket Material",
912
- value: testGasketMaterial,
913
- onChange: setTestGasketMaterial
914
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Divider, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
915
- variant: "subtitle1",
916
- color: "secondary",
917
- children: "Hinge Properties"
918
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stack, {
919
- direction: "row",
920
- spacing: 2,
921
- alignItems: "flex-end",
922
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialInput, {
923
- label: "Hinge Material",
924
- value: doorFrame.hingeMaterial,
925
- onChange: value => setDoorFrame(_objectSpread(_objectSpread({}, doorFrame), {}, {
926
- hingeMaterial: value
927
- })),
928
- onApply: handleMaterialApply
929
- })
930
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialSelector, {
931
- label: "Test Hinge Material",
932
- value: testHingeMaterial,
933
- onChange: setTestHingeMaterial
934
- })]
935
- })
936
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Paper, {
937
- elevation: 3,
938
- sx: {
939
- p: 2
940
- },
941
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
942
- spacing: 2,
943
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
944
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Switch, {
945
- checked: frontCoverPanel.visible,
946
- onChange: e => {
947
- const isVisible = e.target.checked;
948
- setFrontCoverPanel(prev => _objectSpread(_objectSpread({}, prev), {}, {
949
- visible: isVisible
950
- }));
951
- setBackCoverPanel(prev => _objectSpread(_objectSpread({}, prev), {}, {
952
- visible: isVisible
953
- }));
954
- }
955
- }),
956
- label: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
957
- variant: "h6",
958
- color: "primary",
959
- children: "CAS Properties"
960
- })
961
- }), frontCoverPanel.visible && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Paper, {
962
- variant: "outlined",
963
- sx: {
964
- p: 2,
965
- mt: 1
966
- },
967
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
968
- spacing: 2,
969
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialInput, {
970
- label: "Material",
971
- value: frontCoverPanel.material,
972
- onChange: value => {
973
- setFrontCoverPanel(prev => _objectSpread(_objectSpread({}, prev), {}, {
974
- material: value
975
- }));
976
- setBackCoverPanel(prev => _objectSpread(_objectSpread({}, prev), {}, {
977
- material: value
978
- }));
979
- },
980
- onApply: handleMaterialApply
981
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialSelector, {
982
- label: "Test Material",
983
- value: testFrontCoverPanelMaterial,
984
- onChange: value => {
985
- setTestFrontCoverPanelMaterial(value);
986
- setTestBackCoverPanelMaterial(value);
987
- }
988
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(EditableSlider, {
989
- label: "Profile Width",
990
- value: frontCoverPanel.width,
991
- min: 20,
992
- max: 500,
993
- onChange: value => {
994
- setFrontCoverPanel(prev => _objectSpread(_objectSpread({}, prev), {}, {
995
- width: value
996
- }));
997
- setBackCoverPanel(prev => _objectSpread(_objectSpread({}, prev), {}, {
998
- width: value
999
- }));
1000
- }
1001
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(EditableSlider, {
1002
- label: "Depth (from frame)",
1003
- value: frontCoverPanel.depth,
1004
- min: 5,
1005
- max: 100,
1006
- onChange: value => {
1007
- setFrontCoverPanel(prev => _objectSpread(_objectSpread({}, prev), {}, {
1008
- depth: value
1009
- }));
1010
- setBackCoverPanel(prev => _objectSpread(_objectSpread({}, prev), {}, {
1011
- depth: value
1012
- }));
1013
- }
1014
- })]
1015
- })
1016
- })]
1017
- })
1018
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Paper, {
1019
- elevation: 3,
1020
- sx: {
1021
- p: 2
1022
- },
1023
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
1024
- spacing: 2,
1025
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
1026
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Switch, {
1027
- checked: interiorFanlight.visible,
1028
- onChange: e => {
1029
- setInteriorFanlight(_objectSpread(_objectSpread({}, interiorFanlight), {}, {
1030
- visible: e.target.checked
1031
- }));
1032
- }
1033
- }),
1034
- label: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
1035
- variant: "h6",
1036
- color: "primary",
1037
- children: "Interior Fanlight"
1038
- })
1039
- }), interiorFanlight.visible && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Paper, {
1040
- variant: "outlined",
1041
- sx: {
1042
- p: 2,
1043
- mt: 1
1044
- },
1045
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
1046
- spacing: 2,
1047
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stack, {
1048
- direction: "row",
1049
- spacing: 2,
1050
- alignItems: "flex-end",
1051
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialInput, {
1052
- label: "Material",
1053
- value: interiorFanlight.material,
1054
- onChange: value => setInteriorFanlight(_objectSpread(_objectSpread({}, interiorFanlight), {}, {
1055
- material: value
1056
- })),
1057
- onApply: handleMaterialApply
1058
- })
1059
- }), " ", /*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialSelector, {
1060
- label: "Test Material",
1061
- value: testInteriorFanlightMaterial,
1062
- onChange: setTestInteriorFanlightMaterial
1063
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(EditableSlider, {
1064
- label: "Height",
1065
- value: interiorFanlight.height,
1066
- min: 100,
1067
- max: door.doorHeight - 1500 > 100 ? door.doorHeight - 1500 : 100,
1068
- onChange: value => setInteriorFanlight(_objectSpread(_objectSpread({}, interiorFanlight), {}, {
1069
- height: value
1070
- }))
1071
- })]
1072
- })
1073
- })]
1074
- })
1075
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Paper, {
1076
- elevation: 3,
1077
- sx: {
1078
- p: 2
1079
- },
1080
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
1081
- spacing: 2,
1082
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
1083
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Switch, {
1084
- checked: exteriorFanlight.visible,
1085
- onChange: e => setExteriorFanlight(_objectSpread(_objectSpread({}, exteriorFanlight), {}, {
1086
- visible: e.target.checked
1087
- }))
1088
- }),
1089
- label: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
1090
- variant: "h6",
1091
- color: "primary",
1092
- children: "Exterior Fanlight"
1093
- })
1094
- }), exteriorFanlight.visible && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Paper, {
1095
- variant: "outlined",
1096
- sx: {
1097
- p: 2,
1098
- mt: 1
1099
- },
1100
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
1101
- spacing: 2,
1102
- children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.FormControl, {
1103
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormLabel, {
1104
- children: "Type"
1105
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.RadioGroup, {
1106
- row: true,
1107
- value: exteriorFanlightType,
1108
- onChange: e => setExteriorFanlightType(e.target.value),
1109
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
1110
- value: "WPFL",
1111
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
1112
- size: "small"
1113
- }),
1114
- label: "WPFL"
1115
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
1116
- value: "ALDGFL",
1117
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
1118
- size: "small"
1119
- }),
1120
- label: "ALDGFL"
1121
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
1122
- value: "ALSGFL",
1123
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Radio, {
1124
- size: "small"
1125
- }),
1126
- label: "ALSGFL"
1127
- })]
1128
- })]
1129
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialInput, {
1130
- label: "Material",
1131
- value: exteriorFanlight.material,
1132
- onChange: value => setExteriorFanlight(_objectSpread(_objectSpread({}, exteriorFanlight), {}, {
1133
- material: value
1134
- })),
1135
- onApply: handleMaterialApply
1136
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialSelector, {
1137
- label: "Test Material",
1138
- value: testExteriorFanlightMaterial,
1139
- onChange: setTestExteriorFanlightMaterial
1140
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(EditableSlider, {
1141
- label: "Height",
1142
- value: exteriorFanlight.height,
1143
- min: 100,
1144
- max: 1000,
1145
- onChange: handleExteriorFanlightHeightChange
1146
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(EditableSlider, {
1147
- label: "Depth",
1148
- value: exteriorFanlight.depth,
1149
- min: 40,
1150
- max: doorFrame.frameDepth,
1151
- onChange: value => setExteriorFanlight(_objectSpread(_objectSpread({}, exteriorFanlight), {}, {
1152
- depth: value
1153
- }))
1154
- })]
1155
- })
1156
- })]
1157
- })
1158
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Paper, {
1159
- elevation: 3,
1160
- sx: {
1161
- p: 2
1162
- },
1163
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
1164
- spacing: 2,
1165
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
1166
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Switch, {
1167
- checked: occulus.visible,
1168
- onChange: e => setOcculus(_objectSpread(_objectSpread({}, occulus), {}, {
1169
- visible: e.target.checked
1170
- }))
1171
- }),
1172
- label: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
1173
- variant: "h6",
1174
- color: "primary",
1175
- children: "Occulus"
1176
- })
1177
- }), occulus.visible && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Paper, {
1178
- variant: "outlined",
1179
- sx: {
1180
- p: 2,
1181
- mt: 1
1182
- },
1183
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
1184
- spacing: 2,
1185
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(EditableSlider, {
1186
- label: "Offset from Left (x1)",
1187
- value: occulus.x1,
1188
- min: 50,
1189
- max: door.doorWidth - occulus.x2 - 50,
1190
- onChange: value => setOcculus(_objectSpread(_objectSpread({}, occulus), {}, {
1191
- x1: value
1192
- }))
1193
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(EditableSlider, {
1194
- label: "Offset from Right (x2)",
1195
- value: occulus.x2,
1196
- min: 50,
1197
- max: door.doorWidth - occulus.x1 - 50,
1198
- onChange: value => setOcculus(_objectSpread(_objectSpread({}, occulus), {}, {
1199
- x2: value
1200
- }))
1201
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(EditableSlider, {
1202
- label: "Offset from Top (y1)",
1203
- value: occulus.y1,
1204
- min: 50,
1205
- max: mainDoorHeight - occulus.y2 - 50,
1206
- onChange: value => setOcculus(_objectSpread(_objectSpread({}, occulus), {}, {
1207
- y1: value
1208
- }))
1209
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(EditableSlider, {
1210
- label: "Offset from Bottom (y2)",
1211
- value: occulus.y2,
1212
- min: 50,
1213
- max: mainDoorHeight - occulus.y1 - 50,
1214
- onChange: value => setOcculus(_objectSpread(_objectSpread({}, occulus), {}, {
1215
- y2: value
1216
- }))
1217
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Divider, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Paper, {
1218
- variant: "outlined",
1219
- sx: {
1220
- p: 2,
1221
- mt: 1
1222
- },
1223
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
1224
- spacing: 2,
1225
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
1226
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Switch, {
1227
- checked: occulus.infillVisible,
1228
- onChange: e => setOcculus(_objectSpread(_objectSpread({}, occulus), {}, {
1229
- infillVisible: e.target.checked
1230
- }))
1231
- }),
1232
- label: "Show Infill"
1233
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stack, {
1234
- direction: "row",
1235
- spacing: 2,
1236
- alignItems: "flex-end",
1237
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialInput, {
1238
- label: "Infill Material",
1239
- value: occulus.material,
1240
- onChange: value => setOcculus(_objectSpread(_objectSpread({}, occulus), {}, {
1241
- material: value
1242
- })),
1243
- onApply: handleMaterialApply
1244
- })
1245
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialSelector, {
1246
- label: "Test Material",
1247
- value: testOcculusInfillMaterial,
1248
- onChange: setTestOcculusInfillMaterial
1249
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(EditableSlider, {
1250
- label: "Infill Depth",
1251
- value: occulus.depth,
1252
- min: 10,
1253
- max: door.theDoorDepth,
1254
- onChange: value => setOcculus(_objectSpread(_objectSpread({}, occulus), {}, {
1255
- depth: value
1256
- }))
1257
- })]
1258
- })
1259
- })]
1260
- })
1261
- })]
1262
- })
1263
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Paper, {
1264
- elevation: 3,
1265
- sx: {
1266
- p: 2
1267
- },
1268
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
1269
- spacing: 2,
1270
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
1271
- control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Switch, {
1272
- checked: glassVisible,
1273
- onChange: e => setGlassVisible(e.target.checked)
1274
- }),
1275
- label: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
1276
- variant: "h6",
1277
- color: "primary",
1278
- children: "Glass"
1279
- })
1280
- }), glassVisible && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
1281
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialInput, {
1282
- label: "Glass Material",
1283
- value: doorFrame.glassMaterial || "",
1284
- onChange: value => setDoorFrame(_objectSpread(_objectSpread({}, doorFrame), {}, {
1285
- glassMaterial: value
1286
- })),
1287
- onApply: handleMaterialApply
1288
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(MaterialSelector, {
1289
- label: "Test Glass Material",
1290
- value: testGlassInfillMaterial,
1291
- onChange: setTestGlassInfillMaterial
1292
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(EditableSlider, {
1293
- label: "Glass Depth",
1294
- value: glassDepth,
1295
- min: 4,
1296
- max: 20,
1297
- step: 0.5,
1298
- onChange: setGlassDepth
1299
- })]
1300
- })]
1301
- })
1302
- })]
1303
- })
1304
- })]
1305
- });
1306
- };
1307
- exports.Interface = Interface;