@urso/core 0.3.11 → 0.4.2

package/package.json

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

package/src/js/components/deviceRotate/controller.js

@@ -42,20 +42,20 @@ class ComponentsDeviceRotateController extends ComponentsBaseController {
   }
 
   get _showOnLandscape() {
-    return !this._resolutionsConfig.find(resolution => resolution.orientation === 'landscape');
+    return !this._resolutionsConfig.find(resolution => resolution.orientation === Urso.device.ScreenOrientation.LANDSCAPE);
   }
 
   get _showOnPortrait() {
-    return !this._resolutionsConfig.find(resolution => resolution.orientation === 'portrait');
+    return !this._resolutionsConfig.find(resolution => resolution.orientation === Urso.device.ScreenOrientation.PORTRAIT);
   }
 
   get _isPortrait() {
-    return this._orientation === 'portrait';
+    return this._orientation === Urso.device.ScreenOrientation.PORTRAIT;
   }
 
   get _needShow() {
-    return (this._orientation === 'portrait' && this._showOnPortrait) ||
-      (this._orientation !== 'portrait' && this._showOnLandscape)
+    return (this._orientation === Urso.device.ScreenOrientation.PORTRAIT && this._showOnPortrait) ||
+      (this._orientation !== Urso.device.ScreenOrientation.PORTRAIT && this._showOnLandscape)
   }
 
   set _isVisible(needShowDiv) {
@@ -63,7 +63,7 @@ class ComponentsDeviceRotateController extends ComponentsBaseController {
   }
 
   _updateOrientation() {
-    this._orientation = innerWidth > innerHeight ? 'landscape' : 'portrait';
+    this._orientation = innerWidth > innerHeight ? Urso.device.ScreenOrientation.LANDSCAPE : Urso.device.ScreenOrientation.PORTRAIT;
   }
 
   _updateVisibility() {

package/src/js/components/fullscreen/android.js

@@ -33,7 +33,7 @@ class ComponentsFullscreenAndroid {
   }
 
   _updateOrientation() {
-    this._orientation = innerWidth > innerHeight ? 'landscape' : 'portrait';
+    this._orientation = innerWidth > innerHeight ? Urso.device.ScreenOrientation.LANDSCAPE : Urso.device.ScreenOrientation.PORTRAIT;
   }
 
   get isFullscreen() {
@@ -49,7 +49,7 @@ class ComponentsFullscreenAndroid {
   }
 
   get _isPortrait() {
-    return this._orientation === 'portrait';
+    return this._orientation === Urso.device.ScreenOrientation.PORTRAIT;
   }
 
   get _needShowOnCurrentOrientation() {
@@ -58,11 +58,11 @@ class ComponentsFullscreenAndroid {
   }
 
   get _showOnLandscape() {
-    return this._orientationsConfig.find(resolution => resolution.orientation === 'landscape');
+    return this._orientationsConfig.find(resolution => resolution.orientation === Urso.device.ScreenOrientation.LANDSCAPE);
   }
 
   get _showOnPortrait() {
-    return this._orientationsConfig.find(resolution => resolution.orientation === 'portrait');
+    return this._orientationsConfig.find(resolution => resolution.orientation === Urso.device.ScreenOrientation.PORTRAIT);
   }
 
   set isVisible(needShowDiv) {

package/src/js/components/fullscreen/controller.js

@@ -37,15 +37,15 @@ class ComponentsFullscreenController extends ComponentsBaseController {
   }
 
   get _showOnLandscape() {
-    return this._resolutionsConfig.find(resolution => resolution.orientation === 'landscape');
+    return this._resolutionsConfig.find(resolution => resolution.orientation === Urso.device.ScreenOrientation.LANDSCAPE);
   }
 
   get _showOnPortrait() {
-    return this._resolutionsConfig.find(resolution => resolution.orientation === 'portrait');
+    return this._resolutionsConfig.find(resolution => resolution.orientation === Urso.device.ScreenOrientation.PORTRAIT);
   }
 
   get _isPortrait() {
-    return innerWidth > innerHeight ? 'portrait' : 'landscape';
+    return innerWidth > innerHeight ? Urso.device.ScreenOrientation.PORTRAIT : Urso.device.ScreenOrientation.LANDSCAPE;
   }
 
   get isFullscreen() {

package/src/js/components/fullscreen/ios.js

@@ -55,7 +55,7 @@ class ComponentsFullscreenIos {
   }
 
   _updateOrientation() {
-    this._orientation = innerWidth > innerHeight ? 'landscape' : 'portrait';
+    this._orientation = innerWidth > innerHeight ? Urso.device.ScreenOrientation.LANDSCAPE : Urso.device.ScreenOrientation.PORTRAIT;
   }
 
   _updateResize() {
@@ -68,7 +68,7 @@ class ComponentsFullscreenIos {
   }
 
   get _isPortrait() {
-    return this._orientation === 'portrait';
+    return this._orientation === Urso.device.ScreenOrientation.PORTRAIT;
   }
 
   get _needShowOnCurrentOrientation() {
@@ -76,11 +76,11 @@ class ComponentsFullscreenIos {
   }
 
   get _showOnLandscape() {
-    return this._orientationsConfig.find(resolution => resolution.orientation === 'landscape');
+    return this._orientationsConfig.find(resolution => resolution.orientation === Urso.device.ScreenOrientation.LANDSCAPE);
   }
 
   get _showOnPortrait() {
-    return this._orientationsConfig.find(resolution => resolution.orientation === 'portrait');
+    return this._orientationsConfig.find(resolution => resolution.orientation === Urso.device.ScreenOrientation.PORTRAIT);
   }
 
   set isVisible(needShowDiv) {

package/src/js/lib/composition.js

@@ -1,48 +1,44 @@
 // Class for creating multi inheritance.
-class LibComposition
-{
+class LibComposition {
 	// Inherit method to create base classes.
-	static inherit(..._bases)
-	{
+	static inherit(..._bases) {
 		class classes {
 
 			// The base classes
-  			get base() { return _bases; }
+			get base() { return _bases; }
 
-			constructor(..._args)
-			{
+			constructor(..._args) {
 				let index = 0;
 
-				for (let b of this.base) 
-				{
+				for (let b of this.base) {
 					let obj = new b(_args[index++]);
-                    LibComposition.copy(this, obj);
+					LibComposition.copy(this, obj);
 				}
 			}
-		
+
 		}
 
 		// Copy over properties and methods
-		for (let base of _bases) 
-		{
-            LibComposition.copy(classes, base);
-            LibComposition.copy(classes.prototype, base.prototype);
+		for (let base of _bases) {
+			LibComposition.copy(classes, base);
+			LibComposition.copy(classes.prototype, base.prototype, true);
 		}
 
 		return classes;
 	}
 
 	// Copies the properties from one class to another
-	static copy(_target, _source) 
-	{
-    		for (let key of Reflect.ownKeys(_source)) 
-			{
-        		if (key !== "constructor" && key !== "prototype" && key !== "name") 
-				{
-	        	    let desc = Object.getOwnPropertyDescriptor(_source, key);
-	        	    Object.defineProperty(_target, key, desc);
-        		}
-    		}
+	static copy(_target, _source, protoFlag) {
+		for (let key of Reflect.ownKeys(_source)) {
+			if (key !== "constructor" && key !== "prototype" && key !== "name") {
+				let desc = Object.getOwnPropertyDescriptor(_source, key);
+				Object.defineProperty(_target, key, desc);
+			}
+		}
+
+		if (protoFlag && Object.getPrototypeOf(_source) !== Object.prototype) {
+			LibComposition.copy(_target, Object.getPrototypeOf(_source));
+		}
 	}
 }
 
@@ -50,7 +46,7 @@ module.exports = LibComposition;
 
 
 /**
- * 
+ *
  example:
 
 

package/src/js/lib/device.js

@@ -476,6 +476,16 @@ LibDevice = function () {
     */
     this.fullscreenKeyboard = false;
 
+    /**
+    * Enum for possible screen orientations.
+    * @readonly
+    * @enum {string}
+    */
+    this.ScreenOrientation = {
+        LANDSCAPE: 'landscape',
+        PORTRAIT: 'portrait'
+    };
+
 };
 
 // Device is really a singleton/static entity; instantiate it

package/src/js/modules/assets/config.js

@@ -2,6 +2,8 @@ class ModulesAssetsConfig {
     constructor() {
         this.singleton = true;
 
+        this.defaultQualityFactor = 1;
+
         /**
          * quality settings for resource loading selection
          */

package/src/js/modules/assets/controller.js

@@ -18,7 +18,14 @@ class ModulesAssetsController {
      * Current quality getter
      */
     getQuality() {
-        this.getInstance('Service').getQuality();
+        return this.getInstance('Service').getQuality();
+    }
+
+    /**
+     * Current asset resolution
+     */
+    getCurrentResolution() {
+        return this.getInstance('Service').getCurrentResolution();
     }
 
     /**

package/src/js/modules/assets/service.js

@@ -160,10 +160,13 @@ class ModulesAssetsService {
         }
     }
 
-    _processLoadedImage(assetModel) {
-        const { qualityFactors } = this.getInstance('Config');
+    getCurrentResolution() {
+        const { qualityFactors, defaultQualityFactor } = this.getInstance('Config');
+        return qualityFactors[this._currentQuality] || defaultQualityFactor || 1;
+    }
 
-        const resolution = qualityFactors[this._currentQuality] || 1;
+    _processLoadedImage(assetModel) {
+        const resolution = this.getCurrentResolution();
 
         const assetKey = assetModel.key;
         //textures cache

package/src/js/modules/instances/controller.js

@@ -1,3 +1,6 @@
+const MODES_NAMESPACE = 'modifications';
+const MIXINS_NAMESPACE = 'mixins';
+
 class ModulesInstancesController {
     constructor() {
         this._modes = [];
@@ -181,10 +184,18 @@ class ModulesInstancesController {
     _checkPathExist(entitiesArray, noModes) {
         let currentTestObject = window;
         let testMode;
+        let mixins = [];
 
         for (let entitiesIndex = 0; entitiesIndex < entitiesArray.length; entitiesIndex++) {
-            if (!noModes && this._modes && entitiesIndex === entitiesArray.length - 1)
-                testMode = this._checkPathWithModes(currentTestObject, entitiesArray, entitiesIndex);
+            const lastElementModesCondition = !noModes && this._modes && entitiesIndex === entitiesArray.length - 1;
+
+            //get path modification
+            if (lastElementModesCondition && currentTestObject[MODES_NAMESPACE])
+                testMode = this._checkPathWithModes(currentTestObject[MODES_NAMESPACE], entitiesArray, entitiesIndex);
+
+            //get path mixins
+            if (lastElementModesCondition && currentTestObject[MIXINS_NAMESPACE])
+                mixins = this._getMixins(currentTestObject[MIXINS_NAMESPACE], entitiesArray, entitiesIndex);
 
             if (testMode)
                 currentTestObject = testMode;
@@ -194,6 +205,13 @@ class ModulesInstancesController {
                 return false;
         }
 
+        //mixins
+        mixins.forEach((mixin) => {
+            //use this mixin constructions:
+            //const ComponentsMixinEntitie = (superclass) => class extends superclass { ... }
+            currentTestObject = mixin(currentTestObject);
+        })
+
         return currentTestObject;
     }
 
@@ -214,6 +232,20 @@ class ModulesInstancesController {
 
         return false;
     }
+
+    _getMixins(currentTestObject, entitiesArray, entitiesIndex) {
+        const mixins = [];
+
+        for (let mode of this._modes) {
+            const capMode = Urso.helper.capitaliseFirstLetter(mode);
+
+            if (currentTestObject[capMode] && currentTestObject[capMode][entitiesArray[entitiesIndex]]) {
+                mixins.push(currentTestObject[capMode][entitiesArray[entitiesIndex]]);
+            }
+        }
+
+        return mixins;
+    }
 }
 
 module.exports = ModulesInstancesController;

package/src/js/modules/objects/baseModel.js

@@ -12,8 +12,13 @@ class ModulesObjectsBaseModel {
         this._baseObject = null; //link to pixi object
         this._uid = Urso.helper.recursiveGet('_uid', params, false); //will setup on create
         this._templatePath = false;
+        this._parsed = false;
     }
 
+    /**
+     * setup params to object model
+     * @param {Object} params
+     */
     setupParams(params) {
         this.type = Urso.helper.recursiveGet('type', params, null);
 

package/src/js/modules/objects/controller.js

@@ -11,16 +11,17 @@ class ModulesObjectsController {
         this._applyClassesToWorld = this._applyClassesToWorld.bind(this);
     };
 
-    create(objects, parent, doNotRefreshStylesFlag) { //TODO parse template for assets and objects (groups, components)
+    create(objects, parent, doNotRefreshStylesFlag) {
         let result;
 
         if (Array.isArray(objects)) {
             result = [];
+
             for (const object of objects) {
-                result.push(this.getInstance('Create').add(object, parent));
+                result.push(this._createSingleObject(object, parent, doNotRefreshStylesFlag));
             }
         } else
-            result = this.getInstance('Create').add(objects, parent);
+            result = this._createSingleObject(objects, parent, doNotRefreshStylesFlag);
 
         if (!doNotRefreshStylesFlag)
             this.refreshStyles(parent);
@@ -28,6 +29,15 @@ class ModulesObjectsController {
         return result;
     }
 
+    _createSingleObject(object, parent, doNotRefreshStylesFlag) {
+        //parse template for assets and objects (groups, components)
+        if (!object._parsed) { //todo only for objects, contains components && groups in future
+            return Urso.scenes.addObject(object, parent, doNotRefreshStylesFlag);
+        }
+
+        return this.getInstance('Create').add(object, parent);
+    }
+
     find(selector) {
         return this.getInstance('Find').do(selector);
     }

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

@@ -6,6 +6,10 @@ class ModulesObjectsModelsSpine extends Urso.Core.Modules.Objects.BaseModel {
         this._addBaseObject();
     }
 
+    /**
+     * setup params to object model
+     * @param {Object} params
+     */
     setupParams(params) {
         super.setupParams(params);
 
@@ -21,27 +25,98 @@ class ModulesObjectsModelsSpine extends Urso.Core.Modules.Objects.BaseModel {
         params.animation = this.animation; //we redefine original property here
     }
 
+    /**
+     * play spine animation
+     * @param {String} animationName
+     * @param {Boolean} [loopFlag]
+     * @param {Number} [track] - you can define track number for current animation
+     */
     play(animationName, loopFlag = false, track = 0) {
         this._baseObject.state.setAnimation(track, animationName, loopFlag);
     }
 
-    addToSlot(object, slotName) {
-        const spine = this._baseObject;
-        const slotIndex = spine.spineData.slots.findIndex(({ name }) => name === slotName);
-        const currentSlot = spine.slotContainers[slotIndex];
+    /**
+     * play spine animation and execute function after animation completes
+     * @param {String} animation - name of the animation to be played
+     * @param {Function} func - function to be executed
+     */
+    playAndThen(animation, func) {
+        this.playInSequenceAndThen([animation], func);
+    }
 
-        if (currentSlot) {
-            object._baseObject.scale.y = -1;
+    /**
+     * play spine animations in sequence
+     * @param {String[]} animations - names of the animations to be played
+     */
+    playInSequence(animations) {
+        this.stop();
+        const defaultTrack = 0;
+        animations.forEach(e => this._baseObject.state.addAnimation(defaultTrack, e));
+    }
 
-            Urso.objects.removeChild(object.parent, object)
-            currentSlot.addChild(object._baseObject);
-        } else {
-            Urso.logger.warn('ModulesObjectsModelsSpine addToSlot error: no spine slot ' + slotName);
-        }
+    /**
+     * play spine animations in sequence and execute function after last animation completes
+     * @param {String[]} animations - names of the animations to be played
+     * @param {Function} func - function to be executed
+     */
+    playInSequenceAndThen(animations, func) {
+        let animationsLeft = animations.length;
+        let removeSelf = () => { };
+        let completer = {
+            complete: () => {
+                if (--animationsLeft === 0) {
+                    func();
+                    removeSelf();
+                }
+            }
+        };
+        removeSelf = () => this._baseObject.state.removeListener(completer);
+        this._baseObject.state.addListener(completer);
+        this.playInSequence(animations);
     }
 
     /**
-     *
+     * stop track animation
+     * @param {Number} [track] - you can define track number to stop
+     */
+    stopTrack(track) {
+        this._baseObject.state.clearTrack(track);
+    }
+
+    /**
+     * stop all animations
+     */
+    stop() {
+        this._baseObject.state.clearTracks();
+    }
+
+    /**
+     * reset all animations
+     */
+    reset() {
+        this._baseObject.state.setEmptyAnimations();
+    }
+
+    /**
+     * add object to spine slot
+     * @param {String} slotName
+     * @param {Object} object - created by engine object
+     */
+    addToSlot(slotName, object) {
+        this._addToSlot(slotName, object, false);
+    }
+
+    /**
+     * replace spine slot with new object
+     * @param {String} slotName
+     * @param {Object} object - created by engine object
+     */
+    replaceSlotWith(slotName, object) {
+        this._addToSlot(slotName, object, true);
+    }
+
+    /**
+     * set/update animation config
      * @param {*} config
      * @param {boolean} [noObjectCreate] dont use this flag out of core
      *
@@ -59,11 +134,18 @@ class ModulesObjectsModelsSpine extends Urso.Core.Modules.Objects.BaseModel {
             this._baseObject.state.timeScale = config.timeScale;*/ //deprecated - now we use getTimeScale getter
 
         if (config.onComplete) {
+            if (this._baseObject.state.listeners.length !== 0) {
+                Urso.logger.warn('ModulesObjectsModelsSpine setAnimationConfig warning: animation state listeners will be cleared');
+            }
             this._baseObject.state.clearListeners();
             this._baseObject.state.addListener({ complete: this.animation.onComplete });
         }
     }
 
+    /**
+     * system function
+     * add object to pixi tree
+     */
     _addBaseObject() {
         let spineAsset = Urso.cache.getSpine(this.assetKey);
 
@@ -81,6 +163,30 @@ class ModulesObjectsModelsSpine extends Urso.Core.Modules.Objects.BaseModel {
             this.play(this.animation.name, this.animation.loop);
     };
 
+    _addToSlot(slotName, object, replaceSlotContents) {
+        const spine = this._baseObject;
+        const slotIndex = spine.spineData.slots.findIndex(({ name }) => name === slotName);
+        const currentSlot = spine.slotContainers[slotIndex];
+
+        if (currentSlot) {
+            object._baseObject.scale.y = -1;
+
+            Urso.objects.removeChild(object.parent, object);
+
+            if (replaceSlotContents)
+                currentSlot.removeChildren(); //todo check if its proxy and reset parent
+
+            //object.parent = this; //todo && make removeChild
+            currentSlot.addChild(object._baseObject);
+        } else {
+            Urso.logger.warn('ModulesObjectsModelsSpine _addToSlot error: no spine slot ' + slotName);
+        }
+    }
+
+    /**
+     * get animation timeScale
+     * @returns Number
+     */
     getTimeScale() {
         return Urso.scenes.timeScale * this.animation.timeScale;
     }

package/src/js/modules/scenes/controller.js

@@ -30,6 +30,10 @@ class ModulesScenesController {
         return this.getInstance('PixiWrapper').getCachedMouseCoords();
     }
 
+    addObject(objects, parent, doNotRefreshStylesFlag) {
+        this._service.addObject(objects, parent, doNotRefreshStylesFlag);
+    }
+
     get timeScale() {
         return this._service.timeScale;
     }

package/src/js/modules/scenes/resolutions.js

@@ -4,7 +4,6 @@ class ModulesScenesResolutions {
         this.singleton = true;
         this._activeResolution = false; //object
         this._templateSize = { orientation: 0, width: 0, height: 0 };
-        this._orientations = { landscape: 'landscape', portrait: 'portrait' }
         this._currentOrientation = null;
 
         this.refreshSceneSize = this.refreshSceneSize.bind(this);
@@ -53,7 +52,7 @@ class ModulesScenesResolutions {
         console.log('[SCENE] New Template Size', this._templateSize);
 
         //update InstancesModes
-        Object.values(this._orientations).forEach((orientationValue) => Urso.removeInstancesMode(orientationValue + 'Orientation'));
+        Object.values(Urso.device.ScreenOrientation).forEach((orientationValue) => Urso.removeInstancesMode(orientationValue + 'Orientation'));
         Urso.addInstancesMode(orientation + 'Orientation');
 
         //send new resolution event
@@ -68,12 +67,9 @@ class ModulesScenesResolutions {
     };
 
     _getWindowSize() {
-        const iOS = Urso.device.iOS;
-        const { width, height } = document.body.getBoundingClientRect();
-
         let windowSize = {
-            width: iOS ? window.innerWidth : width,
-            height: iOS ? window.innerHeight : height
+            width: window.innerWidth,
+            height: window.innerHeight
         };
 
         if (window.devicePixelRatio && window.devicePixelRatio !== 1) {
@@ -85,7 +81,7 @@ class ModulesScenesResolutions {
     }
 
     _getOrientation(windowSize) {
-        return windowSize.width > windowSize.height ? this._orientations.landscape : this._orientations.portrait;  //todo move to constants
+        return windowSize.width > windowSize.height ? Urso.device.ScreenOrientation.LANDSCAPE : Urso.device.ScreenOrientation.PORTRAIT;
     }
 
     _getResolutionConfig(windowSize) {

package/src/js/modules/scenes/resolutionsConfig.js

@@ -2,14 +2,14 @@ class ModulesScenesResolutionsConfig {
     constructor() {
         this.singleton = true;
 
-        this._orientations = ['landscape', 'portrait'];
+        this._orientations = [Urso.device.ScreenOrientation.LANDSCAPE, Urso.device.ScreenOrientation.PORTRAIT]; //you can use only one orientation for config contents
 
         this.contents = [
             {
                 "name": 'default',
                 "width": 1920,
                 "height": 1080,
-                "orientation": 'landscape',
+                "orientation": Urso.device.ScreenOrientation.LANDSCAPE,
                 "adaptive": true
             }
         ];

package/src/js/modules/scenes/service.js

@@ -26,6 +26,19 @@ class ModulesScenesService {
         gsap.globalTimeline.timeScale(this.timeScale);
     }
 
+    addObject(objects, parent, doNotRefreshStylesFlag) {
+        const newTemplatePart = Urso.template.parse({ objects: [objects] }, true);
+        Urso.assets.preload(newTemplatePart.assets, () => this._newTemplateAssetsLoadedHandler(newTemplatePart, parent, doNotRefreshStylesFlag));
+    }
+
+    _newTemplateAssetsLoadedHandler(newTemplatePart, parent, doNotRefreshStylesFlag) {
+        Urso.objects.create(newTemplatePart.objects, parent, doNotRefreshStylesFlag);
+
+        //components create
+        newTemplatePart.components.forEach(component => component.create());
+        this._currentSceneTemplate.components = Urso.helper.mergeArrays(this._currentSceneTemplate.components, newTemplatePart.components);
+    }
+
     display(name) {
         if (this._displayInProgress) {
             console.warn("Scenes.display is busy ", this._currentSceneName);
@@ -68,12 +81,12 @@ class ModulesScenesService {
         this.emit(Urso.events.MODULES_SCENES_NEW_SCENE_INIT, name);
 
         Urso.assets.preload(this._currentSceneTemplate.assets, this._assetsLoadedHandler);
-
     }
 
     loadUpdate(loadProgress) {
         if (!this._sceneModel)
             return;
+
         this._sceneModel.loadUpdate(loadProgress);
         this.emit(Urso.events.MODULES_ASSETS_LOAD_PROGRESS, loadProgress);
     }

package/src/js/modules/template/controller.js

@@ -19,8 +19,8 @@ class ModulesTemplateController {
     };
 
     //make template
-    parse(template) {
-        return this.getInstance('Service').parse(template);
+    parse(template, additionalTemplateFlag) {
+        return this.getInstance('Service').parse(template, additionalTemplateFlag);
     }
 
 }