kitchen-simulator 5.0.0-test.26 → 5.0.0-test.28

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/src/renderer.jsx DELETED
@@ -1,466 +0,0 @@
1
- import React from 'react';
2
- import ReactDOM from 'react-dom';
3
- import ContainerDimensions from 'react-container-dimensions';
4
- import Immutable, { Map } from 'immutable';
5
- import immutableDevtools from 'immutable-devtools';
6
- import { createStore } from 'redux';
7
- import { Provider } from 'react-redux';
8
- import ReactGA from 'react-ga4';
9
- import { hotjar } from 'react-hotjar';
10
- import * as Sentry from '@sentry/react';
11
- import browserHistory from './@history.js';
12
- import * as history from 'history';
13
- import AppContext from './AppContext.js';
14
- import { HashRouter, Route, Router, Switch } from 'react-router-dom';
15
- import exporter from './catalog/utils/exporter';
16
- import axios from 'axios';
17
- import MyCatalog from './catalog/mycatalog';
18
- import Login from './components/login/Login.js';
19
- import Register from './components/login/Register.js';
20
- import {
21
- API_SERVER_URL,
22
- ERROR_DATABASE,
23
- MODE,
24
- NO_DATA_DATABASE,
25
- TOE_KICK_MOLDING
26
- } from './constants.js'; // import { Progress } from 'antd';
27
- import ToolbarScreenshotButton from '../src/ui/toolbar-screenshot-button.jsx';
28
- import MobileDetect from 'mobile-detect';
29
- import * as zlib from 'browserify-zlib';
30
- import Buffer from 'buffer';
31
- import { getPathInfo, isEmpty } from './utils/helper.js';
32
-
33
- import {
34
- KitchenConfigurator,
35
- Models as PlannerModels,
36
- Plugins as PlannerPlugins,
37
- reducer as PlannerReducer
38
- } from './index'; //KitchenConfigurator
39
- import { newProject } from './actions/project-actions.js';
40
- import { SVGLoader } from 'three/examples/jsm/loaders/SVGLoader';
41
- import CrossSignOn from './CrossSignOn.jsx';
42
- import { QueryClient, QueryClientProvider } from 'react-query';
43
- import { ReactQueryDevtools } from 'react-query/devtools';
44
- import {
45
- render2DItem,
46
- render3DApplianceItem,
47
- render3DItem,
48
- render3DLightingItem
49
- } from './catalog/utils/item-loader'; // Axios config
50
-
51
- // Axios config
52
- axios.defaults.baseURL = API_SERVER_URL;
53
-
54
- const md = new MobileDetect(window.navigator.userAgent);
55
- const isMobile = md.mobile();
56
- if (isMobile === null) {
57
- document.getElementById('app').style.display = 'block';
58
- } else alert('The Kitchen Design software is only available from Desktop use');
59
- //define state
60
- let AppState = Map({
61
- KitchenConfigurator: new PlannerModels.State()
62
- });
63
-
64
- console.log('Version: 378.45-202509_DIY-364-mbox-crash');
65
- ReactGA.initialize([
66
- {
67
- trackingId: 'G-YK2JCC9F9G' // https://dev.addovisuals.com
68
- },
69
- {
70
- trackingId: 'G-3Y44W0RY2E' // https://demo.kc.addovisuals.com/
71
- },
72
- {
73
- trackingId: 'G-M2VD74KP44' // https://rtastore.diydesignspace.com/
74
- }
75
- ]);
76
-
77
- hotjar.initialize('3010506', '6');
78
-
79
- isProduction &&
80
- Sentry.init({
81
- dsn: process.env.SENTRY_DSN,
82
- environment: process.env.SENTRY_ENVIRONMENT
83
- });
84
-
85
- //define reducer
86
- let reducer = (state, action) => {
87
- state = state || AppState;
88
- state = state.update('KitchenConfigurator', plannerState =>
89
- PlannerReducer(plannerState, action)
90
- );
91
- return state;
92
- };
93
-
94
- let blackList =
95
- isProduction === true
96
- ? []
97
- : ['UPDATE_MOUSE_COORDS', 'UPDATE_ZOOM_SCALE', 'UPDATE_2D_CAMERA'];
98
-
99
- if (!isProduction) {
100
- console.info(
101
- 'Environment is in development and these actions will be blacklisted',
102
- blackList
103
- );
104
- console.info('Enable Chrome custom formatter for Immutable pretty print');
105
- immutableDevtools(Immutable);
106
- }
107
-
108
- //init store
109
- let store = createStore(
110
- reducer,
111
- null,
112
- !isProduction && window.devToolsExtension
113
- ? window.devToolsExtension({
114
- features: {
115
- pause: true, // start/pause recording of dispatched actions
116
- lock: true, // lock/unlock dispatching actions and side effects
117
- persist: true, // persist states on page reloading
118
- export: true, // export history of actions in a file
119
- import: 'custom', // import history of actions from a file
120
- jump: true, // jump back and forth (time travelling)
121
- skip: true, // skip (cancel) actions
122
- reorder: true, // drag and drop actions in the history list
123
- dispatch: true, // dispatch custom actions or action creators
124
- test: true // generate tests for the selected actions
125
- },
126
- actionsBlacklist: blackList,
127
- maxAge: 999999
128
- })
129
- : f => f
130
- );
131
-
132
- let plugins = [PlannerPlugins.Keyboard(), PlannerPlugins.ConsoleDebugger()];
133
-
134
- let toolbarButtons = [ToolbarScreenshotButton];
135
-
136
- let categoryData;
137
- if (isMobile === null) {
138
- sessionStorage.setItem('visualizerName', getPathInfo(1));
139
- axios
140
- .get(`${API_SERVER_URL}/api/dealer/${getPathInfo(1)}/config`)
141
- .then(async res => {
142
- const { success, id, logoImg, companyUrl, config } = res.data;
143
- let configdata = JSON.parse(config);
144
-
145
- if (
146
- success === false ||
147
- (id === 0 && logoImg === '' && companyUrl === '')
148
- ) {
149
- alert('No Catalog');
150
- return;
151
- }
152
- await axios
153
- .post(
154
- `${API_SERVER_URL}/api/planner/read/planner`,
155
- {
156
- type: MODE === 'staging' ? 2 : 1
157
- },
158
- {
159
- responseType: 'arraybuffer'
160
- }
161
- )
162
- .then(async response => {
163
- const unzip_data = JSON.parse(
164
- zlib.unzipSync(new Buffer.Buffer.from(response.data)).toString()
165
- );
166
- const { data, appliances, lighting, furnishing, success } =
167
- unzip_data;
168
- if (success === false) {
169
- console.log(NO_DATA_DATABASE);
170
- }
171
- if (success === 'error') {
172
- alert(ERROR_DATABASE);
173
- }
174
- await axios
175
- .post(
176
- `${API_SERVER_URL}/api/toolbar/getCategoryData`,
177
- {
178
- type: MODE === 'staging' ? 2 : 1
179
- },
180
- {
181
- responseType: 'arraybuffer'
182
- }
183
- )
184
- .then(response => {
185
- categoryData = JSON.parse(
186
- zlib.unzipSync(new Buffer.Buffer.from(response.data)).toString()
187
- );
188
- const { catalogs, colorAlias, subgroups } = categoryData.data;
189
- let door_color_alias = [];
190
- let subgroup_ids = catalogs
191
- .filter(item => item.id == id)[0]
192
- .manufacturer_subgroup_ids.split(',');
193
- let door_color_alias_ids = [];
194
- subgroups.forEach(subgroup => {
195
- if (subgroup_ids.some(id => id == subgroup.id.toString())) {
196
- subgroup.door_color_alias_ids.split(',').forEach(item => {
197
- item != '' && door_color_alias_ids.push(item);
198
- });
199
- }
200
- });
201
- colorAlias.forEach(
202
- color =>
203
- door_color_alias_ids.some(id => id == color.id.toString()) &&
204
- door_color_alias.push(color)
205
- );
206
- const doorStyleData = categoryData.data.doorStyles.items;
207
- categoryData.data.doorStyles.items = doorStyleData.treeStruct;
208
- // construct a doorStyle variable
209
- door_color_alias.forEach(dca => {
210
- doorStyleData.doorColorData.forEach(dc => {
211
- // convert string into integer.
212
- dc.door_style_id = parseInt(dc.door_style_id);
213
-
214
- // find the original for the alias.
215
- if (dc.id !== dca.door_color_id) return;
216
- dc.name = dca.alias_name;
217
- dc.color_sku_alias = dca.sku_alias_name;
218
-
219
- // judge the door style of the current door color
220
- doorStyleData.treeStruct.forEach(el => {
221
- el.items.forEach(
222
- elem =>
223
- dc.door_style_id === elem.id &&
224
- (dc.door_style_name = elem.name)
225
- );
226
- });
227
-
228
- // convert string into array
229
- dca.alias_installation_type = isEmpty(
230
- dca.alias_installation_type
231
- )
232
- ? []
233
- : dca.alias_installation_type
234
- .split(',')
235
- .map(item => parseInt(item));
236
-
237
- // add door color to doorStyle variable according to 'alias_installation_type' of its alias
238
- categoryData.data.doorStyles.items.forEach(item => {
239
- if (
240
- dca.alias_installation_type.some(ait => ait === item.id)
241
- )
242
- item.items.forEach(ds => {
243
- if (ds.name === dc.door_style_name) ds.items.push(dc);
244
- });
245
- });
246
- });
247
- });
248
-
249
- let molding = [];
250
- let toeMoldingData = [];
251
- let cabinets = categoryData.data.cabinets;
252
- cabinets[cabinets.length - 1].items.forEach(index => {
253
- if (index.name.toLowerCase().includes('molding')) {
254
- index.items.forEach(item => {
255
- molding.push(item);
256
- });
257
- }
258
- // store all toe kick molding templates
259
- if (index.name.includes(TOE_KICK_MOLDING)) {
260
- index.items.forEach(item => {
261
- toeMoldingData.push(item);
262
- });
263
- }
264
- });
265
- categoryData.data.toeMoldingData = toeMoldingData;
266
- const promises = molding.map(child => {
267
- return new Promise((resolve, reject) => {
268
- const url = child?.shape_svg;
269
- if (!url) {
270
- // Skip if no SVG URL available
271
- return resolve();
272
- }
273
-
274
- const loader = new SVGLoader();
275
- loader.load(
276
- url,
277
- data => {
278
- child.data = {
279
- paths: data.paths,
280
- svg_width: data.xml?.viewBox?.animVal?.width ?? 0,
281
- svg_height: data.xml?.viewBox?.animVal?.height ?? 0
282
- };
283
- resolve();
284
- },
285
- null,
286
- error => {
287
- console.error(error);
288
- reject(error);
289
- }
290
- );
291
- });
292
- });
293
- return Promise.all(promises);
294
- });
295
-
296
- // Load Outline SVG Data
297
- let svgLoadPromises = data.map(async item => {
298
- if (item.outline) {
299
- try {
300
- const response = await fetch(item.outline, {
301
- cache: 'no-store'
302
- });
303
- const svgText = await response.text();
304
-
305
- const loader = new SVGLoader();
306
- const parsed = loader.parse(svgText);
307
-
308
- if (isEmpty(parsed.paths)) return null;
309
-
310
- return {
311
- paths: parsed.paths,
312
- svgWidth:
313
- parseFloat(parsed.xml.getAttribute('width')) ||
314
- parsed.xml.viewBox?.animVal?.width ||
315
- 0,
316
- svgHeight:
317
- parseFloat(parsed.xml.getAttribute('height')) ||
318
- parsed.xml.viewBox?.animVal?.height ||
319
- 0,
320
- reverse: !!parseFloat(parsed.xml.getAttribute('height'))
321
- ? false
322
- : true
323
- };
324
- } catch (err) {
325
- console.error('Failed to load SVG:', item.outline, err);
326
- return null;
327
- }
328
- } else {
329
- return null;
330
- }
331
- });
332
-
333
- let outlineSVGData = await Promise.all(svgLoadPromises);
334
- // End: Load Outline SVG Data
335
-
336
- const Item = [];
337
-
338
- data.forEach((obj, index) => {
339
- Item.push(
340
- exporter({
341
- ...obj,
342
- type: 'cabinet',
343
- outlineSVGData: outlineSVGData[index],
344
- render2DItem,
345
- render3DItem
346
- })
347
- );
348
- });
349
- appliances.forEach(obj => {
350
- Item.push(
351
- exporter({
352
- ...obj,
353
- render2DItem,
354
- render3DItem: render3DApplianceItem,
355
- type: 'appliance'
356
- })
357
- );
358
- });
359
- lighting.forEach(obj => {
360
- Item.push(
361
- exporter({
362
- ...obj,
363
- type: 'lighting',
364
- render2DItem,
365
- render3DItem: render3DLightingItem
366
- })
367
- );
368
- });
369
- furnishing.forEach(obj => {
370
- Item.push(
371
- exporter({
372
- ...obj,
373
- type: 'furnishing',
374
- render2DItem,
375
- render3DItem: render3DApplianceItem
376
- })
377
- );
378
- });
379
-
380
- for (let x in Item) MyCatalog.registerElement(Item[x]);
381
-
382
- let MainComponent = (props, width, height) => (
383
- <KitchenConfigurator
384
- catalog={MyCatalog}
385
- width={width}
386
- height={height}
387
- {...props}
388
- logoImage={logoImg}
389
- companyURL={companyUrl}
390
- plugins={plugins}
391
- toolbarButtons={toolbarButtons}
392
- stateExtractor={state => state.get('KitchenConfigurator')}
393
- categoryData={categoryData}
394
- data={data}
395
- configData={configdata}
396
- />
397
- );
398
-
399
- const queryClient = new QueryClient();
400
-
401
- const MainApp = props => (
402
- <QueryClientProvider client={queryClient}>
403
- <ReactQueryDevtools initialIsOpen={false} />
404
- <AppContext.Provider>
405
- <Provider store={store}>
406
- <ContainerDimensions>
407
- {({ width, height }) => (
408
- <HashRouter history={history.createHashHistory()}>
409
- <Router history={browserHistory}>
410
- <Switch>
411
- <Route
412
- exact
413
- path="/:visualizerName/"
414
- name="kc"
415
- render={routeProps => (
416
- <MainComponent
417
- {...routeProps}
418
- {...props}
419
- width={width}
420
- height={height}
421
- />
422
- )}
423
- />
424
- <Route path="/login" render={() => <Login />} />
425
- <Route
426
- path="/register"
427
- render={() => <Register />}
428
- />
429
- <Route
430
- path="/:visualizerName/project/:role/:token/:pid"
431
- render={routeProps => (
432
- <MainComponent
433
- {...routeProps}
434
- {...props}
435
- width={width}
436
- height={height}
437
- />
438
- )}
439
- />
440
- </Switch>
441
- </Router>
442
- </HashRouter>
443
- )}
444
- </ContainerDimensions>
445
- </Provider>
446
- </AppContext.Provider>
447
- </QueryClientProvider>
448
- );
449
-
450
- setTimeout(() => {
451
- ReactDOM.render(
452
- <CrossSignOn App={MainApp} />,
453
- document.getElementById('app')
454
- );
455
- }, 100);
456
- })
457
- .catch(err => {
458
- alert(
459
- 'Something wrong happened. Do you want to clear the cache and restart the app?'
460
- );
461
- console.log('Failed to load Category Data in src/renderer.jsx', err);
462
- sessionStorage.clear();
463
- store.dispatch(newProject());
464
- });
465
- });
466
- }