@urso/core 0.4.17 → 0.4.18

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@urso/core",
-  "version": "0.4.17",
+  "version": "0.4.18",
   "description": "HTML5 game engine",
   "main": "build/js/index.js",
   "author": "Megbrimef",

package/src/js/modules/objects/models/slider.js

@@ -7,19 +7,15 @@ class ModulesObjectsModelsSlider extends Urso.Core.Modules.Objects.BaseModel {
         this._sliderHandle = null;
         this._baseObject = null;
         this._handleIsPulling = false;
-
-        this._setVariables();
+        this._points = [];
         this._addBaseObject();
-        this._createSliderTextures();
-        this._createValueText();
-        this._setDefaultValue();
     }
 
     setupParams(params) {
         super.setupParams(params);
         this.contents = [];
         this.points = Urso.helper.recursiveGet('points', params, [0, 1]);
-        this.defaultValue = Urso.helper.recursiveGet('defaultValue', params, this.points[0]);
+        this.defaultValue = Urso.helper.recursiveGet('defaultValue', params, false);
         this.bgTexture = Urso.helper.recursiveGet('bgTexture', params, false);
         this.fillTexture = Urso.helper.recursiveGet('fillTexture', params, false);
         this.handleTexture = Urso.helper.recursiveGet('handleTexture', params, false);
@@ -30,19 +26,19 @@ class ModulesObjectsModelsSlider extends Urso.Core.Modules.Objects.BaseModel {
     }
 
     _setVariables() {
-        if(this.isVertical) {
+        if (this.isVertical) {
             this.positionKey = 'y';
-            this.targetObjParam = 'height';
-        }else {
+            this.sizeKey = 'height';
+        } else {
             this.positionKey = 'x';
-            this.targetObjParam = 'width';
+            this.sizeKey = 'width';
         }
     }
 
     _createSliderTextures() {
         this._sliderBg = this._createTexture(this.bgTexture);
 
-        if(this.fillTexture)
+        if (this.fillTexture)
             this._fillTexture = this._createFillTexture(this.fillTexture);
 
         this._sliderHandle = this._createTexture(this.handleTexture);
@@ -51,13 +47,13 @@ class ModulesObjectsModelsSlider extends Urso.Core.Modules.Objects.BaseModel {
         this._setEvents(this._sliderHandle._baseObject);
     }
 
-    _createFillTexture(model){
+    _createFillTexture(model) {
         const fillTexture = this._createTexture(model);
         const { width, height } = fillTexture._baseObject;
         this._fillMask = Urso.objects.create({
             type: Urso.types.objects.GRAPHICS,
             figure: {
-            rectangle: [0, 0, width, height]
+                rectangle: [0, 0, width, height]
             },
             x: -width * fillTexture.anchorX,
             y: -height * fillTexture.anchorY,
@@ -70,15 +66,15 @@ class ModulesObjectsModelsSlider extends Urso.Core.Modules.Objects.BaseModel {
     _createValueText() {
         if (this.minValueTextModel) {
             this.minValueText = Urso.objects.create(this.minValueTextModel, this);
-            this.minValueText.text = this.points[0];
+            this.minValueText.text = this._points[0];
         }
 
         if (this.maxValueTextModel) {
             this.maxValueText = Urso.objects.create(this.maxValueTextModel, this);
-            this.maxValueText.text = this.points.length <= 2 ? '100' : this.points[this.points.length - 1];
+            this.maxValueText.text = this._points.length <= 2 ? '100' : this._points[this._points.length - 1];
         }
 
-        if(this.currentValueTextModel){
+        if (this.currentValueTextModel) {
             this.currentValueText = Urso.objects.create(this.currentValueTextModel, this);
         }
     }
@@ -118,6 +114,12 @@ class ModulesObjectsModelsSlider extends Urso.Core.Modules.Objects.BaseModel {
 
     _addBaseObject() {
         this._baseObject = new PIXI.Container();
+        
+        this._setPoints();
+        this._setVariables();
+        this._createSliderTextures();
+        this._createValueText();
+        this._setDefaultValue();
     };
 
     _onPointerDown(obj) {
@@ -130,15 +132,23 @@ class ModulesObjectsModelsSlider extends Urso.Core.Modules.Objects.BaseModel {
             return
 
         const value = this.isVertical ? y : x;
+        const globalPosition = this.toGlobal(this[this.positionKey])[this.positionKey];
 
-        if (value < this[this.positionKey])
+        if (value < globalPosition)
             this._sliderHandle[this.positionKey] = 0;
-        else if (value >= this[this.positionKey] + this._sliderBg._baseObject[this.targetObjParam])
-            this._sliderHandle[this.positionKey] = this._sliderBg._baseObject[this.targetObjParam];
+        else if (value >= globalPosition + this._sliderBg._baseObject[this.sizeKey])
+            this._sliderHandle[this.positionKey] = this._sliderBg._baseObject[this.sizeKey];
         else
-            this._sliderHandle[this.positionKey] = value - this[this.positionKey];
+            this._sliderHandle[this.positionKey] = value - globalPosition
 
-        this._setFillMask();
+        this._updateValueOnMove()
+    }
+
+    _updateValueOnMove() {
+        const { value } = this._calculateClosestPoint(this._sliderHandle);
+
+        if (this.currentValueText)
+            this.currentValueText.text = value;
 
         const data = { class: this.class, name: this.name, position: this._sliderHandle[this.positionKey] };
         this.emit(Urso.events.MODULES_OBJECTS_SLIDER_HANDLE_MOVE, data)
@@ -153,62 +163,82 @@ class ModulesObjectsModelsSlider extends Urso.Core.Modules.Objects.BaseModel {
         else
             targetObj = this._sliderHandle;
 
-        const {x, y} = targetObj;
-        const value = this.isVertical ? y : x;
-        this._dropHandle(value);
+        const { coord, value } = this._calculateClosestPoint(targetObj);
+        this._dropHandle(coord, value);
+    }
+
+    _setPoints() {
+        if (this.points.length > 1) {
+            this._points = [...this.points];
+            return;
+        }
+
+        const firstPoint = this.points[0] > 0 ? 0 : this.points[0];
+        const lastPoint = this.points[0] > 0 ? this.points[0] : 0;
+
+        for (let i = firstPoint; i <= lastPoint; i++)
+            this._points.push(i);
     }
 
-    _setDefaultValue(){
-        if(!this.points.includes(this.defaultValue))
-            this.defaultValue = this.points[0];
+    _setDefaultValue() {
+        if(!this.defaultValue)
+            this.defaultValue = this._points[0];
 
-        let value = this.points.indexOf(this.defaultValue) * 
-                    this._sliderBg._baseObject[this.targetObjParam] / (this.points.length - 1);
+        if (!this._points.includes(this.defaultValue))
+            this.defaultValue = this._points[0];
+
+        let value = this._points.indexOf(this.defaultValue) *
+            this._sliderBg._baseObject[this.sizeKey] / (this._points.length - 1);
 
         this._setNewValue(value, this.defaultValue);
     }
 
-    _dropHandle(givenValue) {
-        let value;
-        let coord;
+    _dropHandle(coord, value) {
+        const data = { class: this.class, name: this.name, position: coord, value: value };
+
+        this.emit(Urso.events.MODULES_OBJECTS_SLIDER_HANDLE_DROP, data);
+        this._setNewValue(coord, value);
+    }
+
+    _calculateClosestPoint({ x, y }) {
+        const givenValue = this.isVertical ? y : x;
+        let value, coord;
 
-        if(this.points.length <= 2){
+        if (this._points.length <= 2) {
             coord = givenValue;
-            value = ~~(100 / this._sliderBg._baseObject[this.targetObjParam] * givenValue);
+            value = ~~(100 / this._sliderBg._baseObject[this.sizeKey] * givenValue);
         }
         // calculate closest point
-        else{
-            for (let i = 0; i < this.points.length; i++) {
-                let pointCoord = i * this._sliderBg._baseObject[this.targetObjParam] / (this.points.length - 1);
-    
+        else {
+            for (let i = 0; i < this._points.length; i++) {
+                let pointCoord = i * this._sliderBg._baseObject[this.sizeKey] / (this._points.length - 1);
+
                 if (typeof (coord) === 'number' && givenValue - pointCoord < coord - givenValue) {
                     coord = coord;
                 } else {
                     coord = pointCoord;
-                    value = this.points[i];
+                    value = this._points[i];
                 }
             }
         }
-        const data = { class: this.class, name: this.name, position: coord, value: value };
-
-        this.emit(Urso.events.MODULES_OBJECTS_SLIDER_HANDLE_DROP, data);
-        this._setNewValue(coord, value);
+        
+        return { coord, value };
     }
 
-    _setFillMask(){
-        if(!this._fillMask)
+    _setFillMask() {
+        if (!this._fillMask)
             return
 
-        const progress = (this._sliderHandle[this.positionKey] - this._sliderBg[this.positionKey]) * 
-                        100 / this._fillTexture._baseObject[this.targetObjParam] * 0.01;
-        
+        const progress = (this._sliderHandle[this.positionKey] - this._sliderBg[this.positionKey]) *
+            100 / this._fillTexture._baseObject[this.sizeKey] * 0.01;
+
         const scaleKey = this.isVertical ? 'scaleY' : 'scaleX';
         this._fillMask[scaleKey] = progress;
     }
 
-    _setNewValue(coord, value){
+    _setNewValue(coord, value) {
         this._sliderHandle[this.positionKey] = coord;
-            
+
         if (this.currentValueText)
             this.currentValueText.text = value;