kitchen-simulator 5.0.0-test.25 → 5.0.0-test.27

package/src/renderer.jsx

@@ -1,466 +0,0 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import ContainerDimensions from 'react-container-dimensions';
-import Immutable, { Map } from 'immutable';
-import immutableDevtools from 'immutable-devtools';
-import { createStore } from 'redux';
-import { Provider } from 'react-redux';
-import ReactGA from 'react-ga4';
-import { hotjar } from 'react-hotjar';
-import * as Sentry from '@sentry/react';
-import browserHistory from './@history.js';
-import * as history from 'history';
-import AppContext from './AppContext.js';
-import { HashRouter, Route, Router, Switch } from 'react-router-dom';
-import exporter from './catalog/utils/exporter';
-import axios from 'axios';
-import MyCatalog from './catalog/mycatalog';
-import Login from './components/login/Login.js';
-import Register from './components/login/Register.js';
-import {
-  API_SERVER_URL,
-  ERROR_DATABASE,
-  MODE,
-  NO_DATA_DATABASE,
-  TOE_KICK_MOLDING
-} from './constants.js'; // import { Progress } from 'antd';
-import ToolbarScreenshotButton from '../src/ui/toolbar-screenshot-button.jsx';
-import MobileDetect from 'mobile-detect';
-import * as zlib from 'browserify-zlib';
-import Buffer from 'buffer';
-import { getPathInfo, isEmpty } from './utils/helper.js';
-
-import {
-  KitchenConfigurator,
-  Models as PlannerModels,
-  Plugins as PlannerPlugins,
-  reducer as PlannerReducer
-} from './index'; //KitchenConfigurator
-import { newProject } from './actions/project-actions.js';
-import { SVGLoader } from 'three/examples/jsm/loaders/SVGLoader';
-import CrossSignOn from './CrossSignOn.jsx';
-import { QueryClient, QueryClientProvider } from 'react-query';
-import { ReactQueryDevtools } from 'react-query/devtools';
-import {
-  render2DItem,
-  render3DApplianceItem,
-  render3DItem,
-  render3DLightingItem
-} from './catalog/utils/item-loader'; // Axios config
-
-// Axios config
-axios.defaults.baseURL = API_SERVER_URL;
-
-const md = new MobileDetect(window.navigator.userAgent);
-const isMobile = md.mobile();
-if (isMobile === null) {
-  document.getElementById('app').style.display = 'block';
-} else alert('The Kitchen Design software is only available from Desktop use');
-//define state
-let AppState = Map({
-  KitchenConfigurator: new PlannerModels.State()
-});
-
-console.log('Version: 378.45-202509_DIY-364-mbox-crash');
-ReactGA.initialize([
-  {
-    trackingId: 'G-YK2JCC9F9G' // https://dev.addovisuals.com
-  },
-  {
-    trackingId: 'G-3Y44W0RY2E' // https://demo.kc.addovisuals.com/
-  },
-  {
-    trackingId: 'G-M2VD74KP44' // https://rtastore.diydesignspace.com/
-  }
-]);
-
-hotjar.initialize('3010506', '6');
-
-isProduction &&
-  Sentry.init({
-    dsn: process.env.SENTRY_DSN,
-    environment: process.env.SENTRY_ENVIRONMENT
-  });
-
-//define reducer
-let reducer = (state, action) => {
-  state = state || AppState;
-  state = state.update('KitchenConfigurator', plannerState =>
-    PlannerReducer(plannerState, action)
-  );
-  return state;
-};
-
-let blackList =
-  isProduction === true
-    ? []
-    : ['UPDATE_MOUSE_COORDS', 'UPDATE_ZOOM_SCALE', 'UPDATE_2D_CAMERA'];
-
-if (!isProduction) {
-  console.info(
-    'Environment is in development and these actions will be blacklisted',
-    blackList
-  );
-  console.info('Enable Chrome custom formatter for Immutable pretty print');
-  immutableDevtools(Immutable);
-}
-
-//init store
-let store = createStore(
-  reducer,
-  null,
-  !isProduction && window.devToolsExtension
-    ? window.devToolsExtension({
-        features: {
-          pause: true, // start/pause recording of dispatched actions
-          lock: true, // lock/unlock dispatching actions and side effects
-          persist: true, // persist states on page reloading
-          export: true, // export history of actions in a file
-          import: 'custom', // import history of actions from a file
-          jump: true, // jump back and forth (time travelling)
-          skip: true, // skip (cancel) actions
-          reorder: true, // drag and drop actions in the history list
-          dispatch: true, // dispatch custom actions or action creators
-          test: true // generate tests for the selected actions
-        },
-        actionsBlacklist: blackList,
-        maxAge: 999999
-      })
-    : f => f
-);
-
-let plugins = [PlannerPlugins.Keyboard(), PlannerPlugins.ConsoleDebugger()];
-
-let toolbarButtons = [ToolbarScreenshotButton];
-
-let categoryData;
-if (isMobile === null) {
-  sessionStorage.setItem('visualizerName', getPathInfo(1));
-  axios
-    .get(`${API_SERVER_URL}/api/dealer/${getPathInfo(1)}/config`)
-    .then(async res => {
-      const { success, id, logoImg, companyUrl, config } = res.data;
-      let configdata = JSON.parse(config);
-
-      if (
-        success === false ||
-        (id === 0 && logoImg === '' && companyUrl === '')
-      ) {
-        alert('No Catalog');
-        return;
-      }
-      await axios
-        .post(
-          `${API_SERVER_URL}/api/planner/read/planner`,
-          {
-            type: MODE === 'staging' ? 2 : 1
-          },
-          {
-            responseType: 'arraybuffer'
-          }
-        )
-        .then(async response => {
-          const unzip_data = JSON.parse(
-            zlib.unzipSync(new Buffer.Buffer.from(response.data)).toString()
-          );
-          const { data, appliances, lighting, furnishing, success } =
-            unzip_data;
-          if (success === false) {
-            console.log(NO_DATA_DATABASE);
-          }
-          if (success === 'error') {
-            alert(ERROR_DATABASE);
-          }
-          await axios
-            .post(
-              `${API_SERVER_URL}/api/toolbar/getCategoryData`,
-              {
-                type: MODE === 'staging' ? 2 : 1
-              },
-              {
-                responseType: 'arraybuffer'
-              }
-            )
-            .then(response => {
-              categoryData = JSON.parse(
-                zlib.unzipSync(new Buffer.Buffer.from(response.data)).toString()
-              );
-              const { catalogs, colorAlias, subgroups } = categoryData.data;
-              let door_color_alias = [];
-              let subgroup_ids = catalogs
-                .filter(item => item.id == id)[0]
-                .manufacturer_subgroup_ids.split(',');
-              let door_color_alias_ids = [];
-              subgroups.forEach(subgroup => {
-                if (subgroup_ids.some(id => id == subgroup.id.toString())) {
-                  subgroup.door_color_alias_ids.split(',').forEach(item => {
-                    item != '' && door_color_alias_ids.push(item);
-                  });
-                }
-              });
-              colorAlias.forEach(
-                color =>
-                  door_color_alias_ids.some(id => id == color.id.toString()) &&
-                  door_color_alias.push(color)
-              );
-              const doorStyleData = categoryData.data.doorStyles.items;
-              categoryData.data.doorStyles.items = doorStyleData.treeStruct;
-              // construct a doorStyle variable
-              door_color_alias.forEach(dca => {
-                doorStyleData.doorColorData.forEach(dc => {
-                  // convert string into integer.
-                  dc.door_style_id = parseInt(dc.door_style_id);
-
-                  // find the original for the alias.
-                  if (dc.id !== dca.door_color_id) return;
-                  dc.name = dca.alias_name;
-                  dc.color_sku_alias = dca.sku_alias_name;
-
-                  // judge the door style of the current door color
-                  doorStyleData.treeStruct.forEach(el => {
-                    el.items.forEach(
-                      elem =>
-                        dc.door_style_id === elem.id &&
-                        (dc.door_style_name = elem.name)
-                    );
-                  });
-
-                  // convert string into array
-                  dca.alias_installation_type = isEmpty(
-                    dca.alias_installation_type
-                  )
-                    ? []
-                    : dca.alias_installation_type
-                        .split(',')
-                        .map(item => parseInt(item));
-
-                  // add door color to doorStyle variable according to 'alias_installation_type' of its alias
-                  categoryData.data.doorStyles.items.forEach(item => {
-                    if (
-                      dca.alias_installation_type.some(ait => ait === item.id)
-                    )
-                      item.items.forEach(ds => {
-                        if (ds.name === dc.door_style_name) ds.items.push(dc);
-                      });
-                  });
-                });
-              });
-
-              let molding = [];
-              let toeMoldingData = [];
-              let cabinets = categoryData.data.cabinets;
-              cabinets[cabinets.length - 1].items.forEach(index => {
-                if (index.name.toLowerCase().includes('molding')) {
-                  index.items.forEach(item => {
-                    molding.push(item);
-                  });
-                }
-                // store all toe kick molding templates
-                if (index.name.includes(TOE_KICK_MOLDING)) {
-                  index.items.forEach(item => {
-                    toeMoldingData.push(item);
-                  });
-                }
-              });
-              categoryData.data.toeMoldingData = toeMoldingData;
-              const promises = molding.map(child => {
-                return new Promise((resolve, reject) => {
-                  const url = child?.shape_svg;
-                  if (!url) {
-                    // Skip if no SVG URL available
-                    return resolve();
-                  }
-
-                  const loader = new SVGLoader();
-                  loader.load(
-                    url,
-                    data => {
-                      child.data = {
-                        paths: data.paths,
-                        svg_width: data.xml?.viewBox?.animVal?.width ?? 0,
-                        svg_height: data.xml?.viewBox?.animVal?.height ?? 0
-                      };
-                      resolve();
-                    },
-                    null,
-                    error => {
-                      console.error(error);
-                      reject(error);
-                    }
-                  );
-                });
-              });
-              return Promise.all(promises);
-            });
-
-          // Load Outline SVG Data
-          let svgLoadPromises = data.map(async item => {
-            if (item.outline) {
-              try {
-                const response = await fetch(item.outline, {
-                  cache: 'no-store'
-                });
-                const svgText = await response.text();
-
-                const loader = new SVGLoader();
-                const parsed = loader.parse(svgText);
-
-                if (isEmpty(parsed.paths)) return null;
-
-                return {
-                  paths: parsed.paths,
-                  svgWidth:
-                    parseFloat(parsed.xml.getAttribute('width')) ||
-                    parsed.xml.viewBox?.animVal?.width ||
-                    0,
-                  svgHeight:
-                    parseFloat(parsed.xml.getAttribute('height')) ||
-                    parsed.xml.viewBox?.animVal?.height ||
-                    0,
-                  reverse: !!parseFloat(parsed.xml.getAttribute('height'))
-                    ? false
-                    : true
-                };
-              } catch (err) {
-                console.error('Failed to load SVG:', item.outline, err);
-                return null;
-              }
-            } else {
-              return null;
-            }
-          });
-
-          let outlineSVGData = await Promise.all(svgLoadPromises);
-          // End: Load Outline SVG Data
-
-          const Item = [];
-
-          data.forEach((obj, index) => {
-            Item.push(
-              exporter({
-                ...obj,
-                type: 'cabinet',
-                outlineSVGData: outlineSVGData[index],
-                render2DItem,
-                render3DItem
-              })
-            );
-          });
-          appliances.forEach(obj => {
-            Item.push(
-              exporter({
-                ...obj,
-                render2DItem,
-                render3DItem: render3DApplianceItem,
-                type: 'appliance'
-              })
-            );
-          });
-          lighting.forEach(obj => {
-            Item.push(
-              exporter({
-                ...obj,
-                type: 'lighting',
-                render2DItem,
-                render3DItem: render3DLightingItem
-              })
-            );
-          });
-          furnishing.forEach(obj => {
-            Item.push(
-              exporter({
-                ...obj,
-                type: 'furnishing',
-                render2DItem,
-                render3DItem: render3DApplianceItem
-              })
-            );
-          });
-
-          for (let x in Item) MyCatalog.registerElement(Item[x]);
-
-          let MainComponent = (props, width, height) => (
-            <KitchenConfigurator
-              catalog={MyCatalog}
-              width={width}
-              height={height}
-              {...props}
-              logoImage={logoImg}
-              companyURL={companyUrl}
-              plugins={plugins}
-              toolbarButtons={toolbarButtons}
-              stateExtractor={state => state.get('KitchenConfigurator')}
-              categoryData={categoryData}
-              data={data}
-              configData={configdata}
-            />
-          );
-
-          const queryClient = new QueryClient();
-
-          const MainApp = props => (
-            <QueryClientProvider client={queryClient}>
-              <ReactQueryDevtools initialIsOpen={false} />
-              <AppContext.Provider>
-                <Provider store={store}>
-                  <ContainerDimensions>
-                    {({ width, height }) => (
-                      <HashRouter history={history.createHashHistory()}>
-                        <Router history={browserHistory}>
-                          <Switch>
-                            <Route
-                              exact
-                              path="/:visualizerName/"
-                              name="kc"
-                              render={routeProps => (
-                                <MainComponent
-                                  {...routeProps}
-                                  {...props}
-                                  width={width}
-                                  height={height}
-                                />
-                              )}
-                            />
-                            <Route path="/login" render={() => <Login />} />
-                            <Route
-                              path="/register"
-                              render={() => <Register />}
-                            />
-                            <Route
-                              path="/:visualizerName/project/:role/:token/:pid"
-                              render={routeProps => (
-                                <MainComponent
-                                  {...routeProps}
-                                  {...props}
-                                  width={width}
-                                  height={height}
-                                />
-                              )}
-                            />
-                          </Switch>
-                        </Router>
-                      </HashRouter>
-                    )}
-                  </ContainerDimensions>
-                </Provider>
-              </AppContext.Provider>
-            </QueryClientProvider>
-          );
-
-          setTimeout(() => {
-            ReactDOM.render(
-              <CrossSignOn App={MainApp} />,
-              document.getElementById('app')
-            );
-          }, 100);
-        })
-        .catch(err => {
-          alert(
-            'Something wrong happened. Do you want to clear the cache and restart the app?'
-          );
-          console.log('Failed to load Category Data in src/renderer.jsx', err);
-          sessionStorage.clear();
-          store.dispatch(newProject());
-        });
-    });
-}