hart-estate-widget 0.0.5 → 0.0.9

package/build/index.css

@@ -0,0 +1 @@
+*,*:before,*:after{box-sizing:border-box;-webkit-box-sizing:border-box;margin:0;padding:0}html,body{font-size:20px}.widget-application{--vh: 100vh;width:100%;height:calc(100*var(--vh));overflow:hidden;position:relative;z-index:1}.widget-application *,.widget-application *:before,.widget-application *:after{font-family:"Lato",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;outline:none;font-weight:400;text-decoration:none}.widget-application .widget-close{position:absolute;display:flex;align-items:center;justify-content:center;z-index:3;right:15px;top:15px;color:#000;background-color:#fad436;padding:5px 15px;border-radius:10px;font-size:.8rem;border:none;cursor:pointer}.widget-application .widget-close:hover{box-shadow:1px 1px 10px rgba(0,0,0,.15)}.widget-application .widget-tab{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:60px 30px 125px 30px}@media(max-width: 630px){.widget-application .widget-tab{padding:60px 15px 90px 15px}}.widget-application .widget-tab--panes-hidden{padding:60px 30px}.widget-application .widget-tab__image{max-width:100%;max-height:100%;object-fit:contain;display:block}.widget-application .widget-tab__threesixty{width:100%;height:100%;touch-action:none;-webkit-touch-action:none}.widget-application .widget-tab__threesixty-container{width:100% !important;height:100% !important;position:relative;cursor:move;background-image:none !important}.widget-application .widget-tab__threesixty-container img{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);max-width:100%;max-height:100%;object-fit:contain;user-select:none;-webkit-user-select:none;user-drag:none;-webkit-user-drag:none}.widget-application .widget-tab--panorama .widget-tab__image,.widget-application .widget-tab--model .widget-tab__image{position:absolute;z-index:1;left:0;top:0;width:100%;height:100%;object-fit:cover}.widget-application .widget-tab-panes{position:absolute;z-index:3;left:50%;bottom:5px;max-width:100%;padding:0 30px 15px 30px;transform:translateX(-50%);display:flex;align-items:center;justify-content:flex-start;overflow-x:auto}@media(max-width: 630px){.widget-application .widget-tab-panes{padding:0 15px 15px 15px}}.widget-application .widget-tab-panes .widget-tab-pane{width:85px;height:85px;border-radius:5px;margin:0 10px;background-color:#f4f7f7;cursor:pointer;border-width:3px;border-style:solid;border-color:#f4f7f7;overflow:hidden;display:flex;align-items:center;justify-content:center;flex:none;transition:border .3s ease;position:relative;user-select:none;-webkit-user-select:none;user-drag:none;-webkit-user-drag:none}@media(max-width: 630px){.widget-application .widget-tab-panes .widget-tab-pane{width:50px;height:50px;margin:0 5px}}.widget-application .widget-tab-panes .widget-tab-pane::before{content:"";position:absolute;left:0;top:0;width:100%;height:100%;box-shadow:inset 1px 1px 10px rgba(0,0,0,.3)}.widget-application .widget-tab-panes .widget-tab-pane--active,.widget-application .widget-tab-panes .widget-tab-pane:hover{border-color:#fad436}.widget-application .widget-tab-panes .widget-tab-pane__image{width:100%;height:100%;object-fit:cover;object-position:center;display:block}.widget-application .widget-tab-panes .widget-tab-pane__icon{width:16px;height:16px;object-fit:contain;object-position:center;display:block;position:absolute;left:10px;bottom:8px}@media(max-width: 630px){.widget-application .widget-tab-panes .widget-tab-pane__icon{width:12px;height:12px;left:5px;bottom:3px}}.widget-application .widget-instructions{position:absolute;z-index:2;left:0;top:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-color:rgba(0,0,0,.3)}.widget-application .widget-instructions__content{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;background-color:#fff;box-shadow:1px 1px 10px rgba(0,0,0,.5);border-radius:5px;overflow:hidden;width:350px}.widget-application .widget-instructions__head{width:100%;padding:10px;border-bottom:1px solid #d1d1d1;color:rgba(74,74,74,.7);text-align:center;font-size:.8rem}.widget-application .widget-instructions__body{width:100%;padding:10px;text-align:center;font-size:.7rem}.widget-application .widget-instructions__body p{margin:10px 0}.widget-application .widget-instructions__footer{width:100%}.widget-application .widget-instructions__footer button{width:100%;background-color:#fad436;font-size:.8rem;font-weight:500;text-align:center;color:#000;cursor:pointer;border:none;padding:10px 5px}/*# sourceMappingURL=index.css.map */

package/build/index.css.map

@@ -0,0 +1 @@
+{"version":3,"sourceRoot":"","sources":["../src/assets/sass/index.sass","../src/assets/sass/vars.sass","../src/assets/sass/components/tabs.sass","../src/assets/sass/components/instructions.sass"],"names":[],"mappings":"AAEA,mBACE,sBACA,8BACA,SACA,UAEF,UACE,eAEF,oBACE,YAEA,WACA,2BACA,gBACA,kBACA,UAEA,+EACE,8BACA,mCACA,kCACA,aACA,gBACA,qBAEF,kCACE,kBACA,aACA,mBACA,uBACA,UACA,WACA,SACA,MC9BI,KD+BJ,iBC7BQ,QD8BR,iBACA,mBACA,gBACA,YACA,eACA,wCACE,wCEzCJ,gCACE,WACA,YACA,aACA,mBACA,uBACA,6BACA,yBAPF,gCAQI,6BACF,8CACE,kBACF,uCACE,eACA,gBACA,mBACA,cACF,4CACE,WACA,YACA,kBACA,0BACA,sDACE,sBACA,uBACA,kBACA,YACA,iCACA,0DACE,kBACA,SACA,QACA,gCACA,eACA,gBACA,mBD1BR,iBACA,yBACA,eACA,uBC2BI,uHACE,kBACA,UACA,OACA,MACA,WACA,YACA,iBAEN,sCACE,kBACA,UACA,SACA,WACA,eACA,yBACA,2BACA,aACA,mBACA,2BACA,gBACA,yBAZF,sCAaI,0BACF,uDACE,WACA,YACA,kBACA,cACA,iBD9DM,QC+DN,eACA,iBACA,mBACA,aDlEM,QCmEN,gBACA,aACA,mBACA,uBACA,UACA,2BACA,kBDrEJ,iBACA,yBACA,eACA,uBCoEI,yBAlBF,uDAmBI,WACA,YACA,cACF,+DACE,WACA,kBACA,OACA,MACA,WACA,YACA,6CACF,4HAEE,aDxFI,QCyFN,8DACE,WACA,YACA,iBACA,uBACA,cACF,6DACE,WACA,YACA,mBACA,uBACA,cACA,kBACA,UACA,WACA,yBATF,6DAUI,WACA,YACA,SACA,YCjHR,yCACE,kBACA,UACA,OACA,MACA,WACA,YACA,aACA,mBACA,uBACA,gCACA,kDACE,aACA,sBACA,uBACA,2BACA,iBFdE,KEeF,uCACA,kBACA,gBACA,YACF,+CACE,WACA,aACA,gCACA,wBACA,kBACA,gBACF,+CACE,WACA,aACA,kBACA,gBACA,iDACE,cACJ,iDACE,WACA,wDACE,WACA,iBFlCI,QEmCJ,gBACA,gBACA,kBACA,WACA,eACA,YACA","file":"index.css"}

package/build/index.js

@@ -3,13 +3,55 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+Object.defineProperty(exports, "ImageTab", {
+  enumerable: true,
+  get: function get() {
+    return _ImageTab.default;
+  }
+});
+Object.defineProperty(exports, "Instructions", {
+  enumerable: true,
+  get: function get() {
+    return _Instructions.default;
+  }
+});
+Object.defineProperty(exports, "PanoramaTab", {
+  enumerable: true,
+  get: function get() {
+    return _PanoramaTab.default;
+  }
+});
+Object.defineProperty(exports, "RotationTab", {
+  enumerable: true,
+  get: function get() {
+    return _RotationTab.default;
+  }
+});
+Object.defineProperty(exports, "TabWrapper", {
+  enumerable: true,
+  get: function get() {
+    return _TabWrapper.default;
+  }
+});
+Object.defineProperty(exports, "Widget", {
+  enumerable: true,
+  get: function get() {
+    return _Widget.default;
+  }
+});
 
 var _react = _interopRequireDefault(require("react"));
 
-var _Widget = _interopRequireDefault(require("./Widget"));
+var _Widget = _interopRequireDefault(require("./components/Widget"));
+
+var _ImageTab = _interopRequireDefault(require("./components/ImageTab"));
+
+var _Instructions = _interopRequireDefault(require("./components/Instructions"));
+
+var _RotationTab = _interopRequireDefault(require("./components/RotationTab"));
+
+var _PanoramaTab = _interopRequireDefault(require("./components/PanoramaTab"));
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _TabWrapper = _interopRequireDefault(require("./components/TabWrapper"));
 
-var _default = _Widget.default;
-exports.default = _default;
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/build/utils/helpers.js

@@ -0,0 +1,79 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getVerticesLocations = exports.getScale = exports.findWallVertices = exports.findRoomCenter = exports.findMinMaxCoordinates = void 0;
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+const findWallVertices = (walls, wall, vertices) => {
+  const currentWall = walls.find(el => el.ID === wall);
+  return currentWall.Vertices.map(vertex => vertices.find(el => el.ID === vertex));
+};
+
+exports.findWallVertices = findWallVertices;
+
+const getVerticesLocations = vertices => vertices.map(vertex => vertex.Location);
+
+exports.getVerticesLocations = getVerticesLocations;
+
+const findMinMaxCoordinates = (room, walls, vertices) => {
+  let maxX = 0;
+  let minX = Infinity;
+  let maxY = 0;
+  let minY = Infinity;
+  room.Walls.forEach(wall => {
+    const [coord1, coord2] = getVerticesLocations(findWallVertices(walls, wall, vertices)); // CALCULATE MAX COORDS
+
+    if (coord1.X > maxX) maxX = coord1.X;
+    if (coord1.X > maxX) maxX = coord1.X;
+    if (coord2.Y > maxY) maxY = coord2.Y;
+    if (coord2.Y > maxY) maxY = coord2.Y; // CALCULATE MIN COORDS
+
+    if (coord1.X < minX) minX = coord1.X;
+    if (coord1.X < minX) minX = coord1.X;
+    if (coord2.Y < minY) minY = coord2.Y;
+    if (coord2.Y < minY) minY = coord2.Y;
+  });
+  return {
+    maxX,
+    minX,
+    maxY,
+    minY
+  };
+};
+
+exports.findMinMaxCoordinates = findMinMaxCoordinates;
+
+const findRoomCenter = (room, walls, vertices) => {
+  const {
+    maxX,
+    minX,
+    maxY,
+    minY
+  } = findMinMaxCoordinates(room, walls, vertices);
+  const left = (maxX + minX) / 2;
+  const top = (maxY + minY) / 2;
+  return {
+    left,
+    top
+  };
+};
+
+exports.findRoomCenter = findRoomCenter;
+
+const getScale = (image, json) => {
+  const imageWidth = image.width;
+  const imageHeight = image.height;
+  const baseImageWidth = 1024;
+  const baseImageHeight = imageHeight * (baseImageWidth / imageWidth);
+  const deltaX = imageWidth / baseImageWidth / json.Scale.X;
+  const deltaY = imageHeight / baseImageHeight / json.Scale.X;
+  return {
+    X: deltaX,
+    Y: deltaY
+  };
+};
+
+exports.getScale = getScale;

package/package.json

@@ -2,28 +2,35 @@
   "name": "hart-estate-widget",
   "description": "HART Estate widget",
   "author": "HART",
-  "keywords": ["react", "hart", "widget", "estate"],
-  "version": "0.0.5",
+  "keywords": [],
+  "version": "0.0.9",
   "private": false,
   "main": "build/index.js",
   "module": "build/index.js",
-  "files": [ "build", "README.md" ],
+  "files": [
+    "build",
+    "README.md"
+  ],
   "repository": {
-      "type": "git",
-      "url": "https://gitlab.myhart.ru/hart_estate/hart-estate-widget"
+    "type": "git",
+    "url": "https://gitlab.myhart.ru/hart_estate/hart-estate-widget"
   },
   "scripts": {
-    "start": "node scripts/start.js",
-    "build": "rm -rf build && NODE_ENV=production babel src --out-dir build --copy-files"
+    "start": "babel src --watch --out-dir build --copy-files",
+    "start-example": "cd ./example && npm run start",
+    "build": "rm -rf build && NODE_ENV=production babel src --out-dir build --copy-files && npm run build:sass",
+    "build:sass": "sass src/assets/sass/index.sass:build/index.css --style compressed"
   },
   "dependencies": {
-    "@babel/polyfill": "^7.12.1",
+    "core-js": "^3.21.0",
     "mobx": "^6.3.13",
     "mobx-react-lite": "^3.2.3",
+    "panolens": "^0.12.1",
     "panzoom": "^9.4.2",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "react-scripts": "^5.0.0"
+    "three": "^0.137.5",
+    "three-device-orientation": "^1.0.3"
   },
   "devDependencies": {
     "@babel/cli": "^7.17.0",
@@ -33,7 +40,6 @@
     "eslint": "^8.0.0",
     "eslint-config-react-app": "^7.0.0",
     "eslint-plugin-react": "^7.28.0",
-    "rewire": "^6.0.0",
     "sass": "^1.46.0"
   },
   "browserslist": {

package/build/Widget.js

@@ -1,35 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-require("core-js/modules/es.object.assign.js");
-
-var _react = _interopRequireDefault(require("react"));
-
-var _mobxReactLite = require("mobx-react-lite");
-
-var _store = _interopRequireDefault(require("./store"));
-
-var _Application = _interopRequireDefault(require("./Application"));
-
-var _defaultConfig = _interopRequireDefault(require("./defaultConfig"));
-
-require("./assets/sass/index.sass");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-const Widget = (0, _mobxReactLite.observer)(options => {
-  const config = Object.assign(_defaultConfig.default, options);
-
-  _store.default.setConfig(config);
-
-  return /*#__PURE__*/_react.default.createElement(_Application.default, {
-    width: config.width,
-    height: config.height
-  });
-});
-var _default = Widget;
-exports.default = _default;