hart-estate-widget 0.0.17 → 0.0.20
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.
@@ -33,6 +33,9 @@ const ModelTab = (0, _mobxReactLite.observer)(_ref => {
|
|
33
33
|
} = _modelStore.default;
|
34
34
|
(0, _react.useEffect)(() => {
|
35
35
|
const container = document.querySelector('.widget-tab__model-scene');
|
36
|
+
|
37
|
+
_modelStore.default.setContainer(container);
|
38
|
+
|
36
39
|
container.appendChild(_modelStore.default.renderer.domElement);
|
37
40
|
|
38
41
|
_modelStore.default.setCurrentControlsType('orbit');
|
@@ -11,6 +11,8 @@ var _reactDom = _interopRequireDefault(require("react-dom"));
|
|
11
11
|
|
12
12
|
var _store = _interopRequireDefault(require("../store"));
|
13
13
|
|
14
|
+
var _modelStore = _interopRequireDefault(require("../store/modelStore"));
|
15
|
+
|
14
16
|
var _Application = _interopRequireDefault(require("./Application"));
|
15
17
|
|
16
18
|
var _defaultConfig = _interopRequireDefault(require("../config/defaultConfig"));
|
@@ -27,6 +29,8 @@ class Widget {
|
|
27
29
|
constructor(container) {
|
28
30
|
let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
29
31
|
|
32
|
+
_defineProperty(this, "requiredParams", ['tabs', 'tabPanes', 'width', 'height', 'env']);
|
33
|
+
|
30
34
|
const config = _objectSpread(_objectSpread({}, _defaultConfig.default), options);
|
31
35
|
|
32
36
|
const widgetContainer = document.querySelector(container);
|
@@ -46,7 +50,16 @@ class Widget {
|
|
46
50
|
}
|
47
51
|
|
48
52
|
updateOptions(config) {
|
49
|
-
|
53
|
+
const newConfig = _objectSpread({}, config);
|
54
|
+
|
55
|
+
this.requiredParams.forEach(param => {
|
56
|
+
if (config[param]) return;
|
57
|
+
newConfig[param] = this.options[param];
|
58
|
+
});
|
59
|
+
|
60
|
+
_modelStore.default.removeHouse();
|
61
|
+
|
62
|
+
_store.default.setConfig(newConfig);
|
50
63
|
}
|
51
64
|
|
52
65
|
on(event, callback) {
|
@@ -95,6 +95,7 @@ class HouseStore {
|
|
95
95
|
|
96
96
|
(0, _mobx.makeAutoObservable)(this);
|
97
97
|
this.modelStore = modelStore;
|
98
|
+
this.houseGroup.name = 'House-Group';
|
98
99
|
this.globalPlane = new THREE.Plane(new THREE.Vector3(0, -this.wallsHeight - 0.5, 0), 1);
|
99
100
|
this.clippingPlanes = [this.globalPlane];
|
100
101
|
this.setCenterPosition().loadTextures().then(() => {
|
@@ -15,7 +15,7 @@ var THREE = _interopRequireWildcard(require("three"));
|
|
15
15
|
|
16
16
|
var _cameraControls = _interopRequireDefault(require("camera-controls"));
|
17
17
|
|
18
|
-
var _houseStore = _interopRequireDefault(require("
|
18
|
+
var _houseStore = _interopRequireDefault(require("../store/houseStore"));
|
19
19
|
|
20
20
|
var _grass = _interopRequireDefault(require("../assets/img/grass.png"));
|
21
21
|
|
@@ -70,6 +70,12 @@ class ModelStore {
|
|
70
70
|
this.scene.add(this.houseStore.houseGroup);
|
71
71
|
});
|
72
72
|
|
73
|
+
_defineProperty(this, "removeHouse", () => {
|
74
|
+
const selectedObject = this.scene.getObjectByName('House-Group');
|
75
|
+
this.scene.remove(selectedObject);
|
76
|
+
this.initialized = false;
|
77
|
+
});
|
78
|
+
|
73
79
|
_defineProperty(this, "setJoystickState", value => {
|
74
80
|
this.isJoystickActive = value;
|
75
81
|
});
|
@@ -78,6 +84,12 @@ class ModelStore {
|
|
78
84
|
this.joystickDirections = directions;
|
79
85
|
});
|
80
86
|
|
87
|
+
_defineProperty(this, "setContainer", container => {
|
88
|
+
this.container = container;
|
89
|
+
this.updateRendererSize();
|
90
|
+
this.updateCameraSize();
|
91
|
+
});
|
92
|
+
|
81
93
|
_defineProperty(this, "createScene", () => {
|
82
94
|
this.scene = new THREE.Scene();
|
83
95
|
const light = new THREE.AmbientLight(0xffffff);
|
@@ -107,22 +119,30 @@ class ModelStore {
|
|
107
119
|
_defineProperty(this, "createRenderer", () => {
|
108
120
|
this.renderer = new THREE.WebGLRenderer();
|
109
121
|
this.renderer.setPixelRatio(window.devicePixelRatio);
|
110
|
-
this.
|
122
|
+
this.updateRendererSize();
|
111
123
|
this.renderer.localClippingEnabled = true;
|
112
124
|
return this;
|
113
125
|
});
|
114
126
|
|
127
|
+
_defineProperty(this, "updateRendererSize", () => {
|
128
|
+
this.renderer.setSize(this.width, this.height);
|
129
|
+
});
|
130
|
+
|
115
131
|
_defineProperty(this, "createCamera", () => {
|
116
|
-
this.camera = new THREE.PerspectiveCamera(75,
|
132
|
+
this.camera = new THREE.PerspectiveCamera(75, this.width / this.height, 0.1, 1000);
|
117
133
|
this.camera.position.set(0, 0, 0);
|
118
134
|
window.addEventListener('resize', () => {
|
119
|
-
this.
|
120
|
-
this.
|
121
|
-
this.renderer.setSize(window.innerWidth, window.innerHeight);
|
135
|
+
this.updateCameraSize();
|
136
|
+
this.updateRendererSize();
|
122
137
|
});
|
123
138
|
return this;
|
124
139
|
});
|
125
140
|
|
141
|
+
_defineProperty(this, "updateCameraSize", () => {
|
142
|
+
this.camera.aspect = this.width / this.height;
|
143
|
+
this.camera.updateProjectionMatrix();
|
144
|
+
});
|
145
|
+
|
126
146
|
_defineProperty(this, "createControls", () => {
|
127
147
|
this.controls = new _cameraControls.default(this.camera, this.renderer.domElement);
|
128
148
|
this.controls.minDistance = 0.5;
|
@@ -221,6 +241,18 @@ class ModelStore {
|
|
221
241
|
this.createScene().createRenderer().createCamera().createControls().addKeyEvents();
|
222
242
|
}
|
223
243
|
|
244
|
+
get width() {
|
245
|
+
var _this$container;
|
246
|
+
|
247
|
+
return ((_this$container = this.container) === null || _this$container === void 0 ? void 0 : _this$container.offsetWidth) || window.innerWidth;
|
248
|
+
}
|
249
|
+
|
250
|
+
get height() {
|
251
|
+
var _this$container2;
|
252
|
+
|
253
|
+
return ((_this$container2 = this.container) === null || _this$container2 === void 0 ? void 0 : _this$container2.offsetHeight) || window.innerHeight;
|
254
|
+
}
|
255
|
+
|
224
256
|
}
|
225
257
|
|
226
258
|
var _default = new ModelStore();
|