@urso/core 0.3.5 → 0.3.6

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

@@ -1,168 +1,168 @@
-class ModulesScenesResolutions {
-
-    constructor() {
-        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);
-        this.refreshSceneSize();
-
-        //TODO optimization (performance)
-        /*if (devicePixelRatio > 2)
-            devicePixelRatio = 2;*/ // when we are calculating canvas size
-    }
-
-    _subscribeOnce() {
-        this.addListener(Urso.events.EXTRA_BROWSEREVENTS_WINDOW_RESIZE, this.refreshSceneSize, true);
-        this.addListener(Urso.events.MODULES_SCENES_NEW_SCENE_INIT, this.refreshSceneSize, true);
-    }
-
-    getTemplateSize() {
-        return this._templateSize;
-    }
-
-    refreshSceneSize() {
-        let windowSize = this._getWindowSize();
-        let orientation = this._getOrientation(windowSize);
-        let configResolution = this._getResolutionConfig(windowSize);
-
-        let windowRatio = windowSize.width / windowSize.height;
-        let optimalRatio = this._getOptimalRatio(configResolution, windowRatio, orientation);
-
-        let currentResolution = Urso.helper.objectClone(configResolution);
-        currentResolution.name = 'currentResolution';
-        currentResolution.base = configResolution;
-        currentResolution.width = (optimalRatio > windowRatio) ? Math.floor(windowSize.width) : Math.floor(Math.floor(windowSize.height) * optimalRatio);
-        currentResolution.height = (optimalRatio > windowRatio) ? Math.floor(Math.floor(windowSize.width) / optimalRatio) : Math.floor(windowSize.height);
-
-        this._templateSize = this._calculateTemplateSize(currentResolution);
-        this._applyResolutionToPixi(currentResolution);
-
-        console.log('[SCENE] New Orientation', orientation);
-        console.log('[SCENE] New Resolution', currentResolution, 'windowSize:', windowSize);
-        console.log('[SCENE] New Template Size', this._templateSize);
-
-        //update InstancesModes
-        Object.values(this._orientations).forEach((orientationValue) => Urso.removeInstancesMode(orientationValue + 'Orientation'));
-        Urso.addInstancesMode(orientation + 'Orientation');
-
-        //send new resolution event
-        this.emit(Urso.events.MODULES_SCENES_NEW_RESOLUTION, { resolution: currentResolution, template: this._templateSize });
-
-        if (this._currentOrientation !== this._templateSize.orientation) {
-            this._currentOrientation = this._templateSize.orientation;
-            this.emit(Urso.events.MODULES_SCENES_ORIENTATION_CHANGE, this._templateSize.orientation);
-        }
-
-        return true;
-    };
-
-    _getWindowSize() {
-        const iOS = Urso.device.iOS;
-        const { width, height } = document.body.getBoundingClientRect();
-
-        let windowSize = {
-            width: iOS ? window.innerWidth : width,
-            height: iOS ? window.innerHeight : height
-        };
-
-        if (window.devicePixelRatio && window.devicePixelRatio !== 1) {
-            windowSize.width *= window.devicePixelRatio;
-            windowSize.height *= window.devicePixelRatio;
-        }
-
-        return windowSize;
-    }
-
-    _getOrientation(windowSize) {
-        return windowSize.width > windowSize.height ? this._orientations.landscape : this._orientations.portrait;  //todo move to constants
-    }
-
-    _getResolutionConfig(windowSize) {
-        let orientation = this._getOrientation(windowSize);
-        let mainDimension = windowSize.width > windowSize.height ? 'width' : 'height'; //todo move to constants
-        let config = this.getInstance('ResolutionsConfig').get();
-        let currentResolution = config[0];
-
-        //select optimal resolution from config
-        for (let resolution of config) {
-            if (resolution.orientation !== orientation)
-                continue;
-
-            if (
-                (currentResolution.orientation !== orientation) ||
-                (
-                    currentResolution[mainDimension] < resolution[mainDimension] &&
-                    resolution[mainDimension] < windowSize[mainDimension]
-                ) ||
-                (
-                    windowSize[mainDimension] < currentResolution[mainDimension] &&
-                    resolution[mainDimension] < currentResolution[mainDimension]
-                )
-            )
-                currentResolution = resolution;
-        }
-
-        return currentResolution;
-    }
-
-    _getOptimalRatio(configResolution, windowRatio, orientation) {
-        let optimalRatio = configResolution.width / configResolution.height;
-
-        if (configResolution.adaptive) {
-            let display = !Urso.helper.mobileAndTabletCheck() ? 'desktop' : 'mobile'; //todo move to constants
-            let adaptiveParams = this.getInstance('ResolutionsConfig').getAdaptive()[display];
-
-            if (adaptiveParams.supported) {
-                let limits = adaptiveParams.limits[orientation];
-                optimalRatio = Urso.math.intMakeBetween(windowRatio, limits.min, limits.max);
-            }
-        }
-
-        return optimalRatio;
-    }
-
-    _calculateTemplateSize(resolution) {
-        this._templateSize.orientation = resolution.orientation;
-        this._templateSize.width = resolution.base.width;
-        this._templateSize.height = resolution.base.height;
-
-        let dimensionsArray = ['width', 'height'];
-
-        //adaptive corrections
-        if (resolution.adaptive) {
-            let dimensionsPassiveKey = (resolution.width / resolution.height > resolution.base.width / resolution.base.height) ? 0 : 1;
-            let dimensionsMainKey = (dimensionsPassiveKey === 1) ? 0 : 1;
-
-            this._templateSize[dimensionsArray[dimensionsPassiveKey]] =
-                ~~(
-                    resolution[dimensionsArray[dimensionsPassiveKey]] *
-                    resolution.base[dimensionsArray[dimensionsMainKey]] / resolution[dimensionsArray[dimensionsMainKey]]
-                );
-        }
-
-        return this._templateSize;
-    }
-
-    _applyResolutionToPixi(resolution) {
-        let maxResolutionFactor = Math.min(this.getInstance('ResolutionsConfig').maxSize() / Math.max(resolution.width, resolution.height), 1);
-        let dp = window.devicePixelRatio;
-        let canvasSize = {
-            width: ~~(resolution.width * maxResolutionFactor),
-            height: ~~(resolution.height * maxResolutionFactor)
-        };
-
-        this.getInstance('PixiWrapper').resize(canvasSize.width, canvasSize.height);
-        this.getInstance('PixiWrapper').setWorldScale(canvasSize.width / this._templateSize.width, canvasSize.height / this._templateSize.height);
-        this.getInstance('PixiWrapper').setCanvasWidth(resolution.width / dp);
-        this.getInstance('PixiWrapper').setCanvasHeight(resolution.height / dp);
-
-        this._activeResolution = resolution;
-        return true;
-    };
-}
-
-module.exports = ModulesScenesResolutions;
+class ModulesScenesResolutions {
+
+    constructor() {
+        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);
+        this.refreshSceneSize();
+
+        //TODO optimization (performance)
+        /*if (devicePixelRatio > 2)
+            devicePixelRatio = 2;*/ // when we are calculating canvas size
+    }
+
+    _subscribeOnce() {
+        this.addListener(Urso.events.EXTRA_BROWSEREVENTS_WINDOW_RESIZE, this.refreshSceneSize, true);
+        this.addListener(Urso.events.MODULES_SCENES_NEW_SCENE_INIT, this.refreshSceneSize, true);
+    }
+
+    getTemplateSize() {
+        return this._templateSize;
+    }
+
+    refreshSceneSize() {
+        let windowSize = this._getWindowSize();
+        let orientation = this._getOrientation(windowSize);
+        let configResolution = this._getResolutionConfig(windowSize);
+
+        let windowRatio = windowSize.width / windowSize.height;
+        let optimalRatio = this._getOptimalRatio(configResolution, windowRatio, orientation);
+
+        let currentResolution = Urso.helper.objectClone(configResolution);
+        currentResolution.name = 'currentResolution';
+        currentResolution.base = configResolution;
+        currentResolution.width = (optimalRatio > windowRatio) ? Math.floor(windowSize.width) : Math.floor(Math.floor(windowSize.height) * optimalRatio);
+        currentResolution.height = (optimalRatio > windowRatio) ? Math.floor(Math.floor(windowSize.width) / optimalRatio) : Math.floor(windowSize.height);
+
+        this._templateSize = this._calculateTemplateSize(currentResolution);
+        this._applyResolutionToPixi(currentResolution);
+
+        console.log('[SCENE] New Orientation', orientation);
+        console.log('[SCENE] New Resolution', currentResolution, 'windowSize:', windowSize);
+        console.log('[SCENE] New Template Size', this._templateSize);
+
+        //update InstancesModes
+        Object.values(this._orientations).forEach((orientationValue) => Urso.removeInstancesMode(orientationValue + 'Orientation'));
+        Urso.addInstancesMode(orientation + 'Orientation');
+
+        //send new resolution event
+        this.emit(Urso.events.MODULES_SCENES_NEW_RESOLUTION, { resolution: currentResolution, template: this._templateSize });
+
+        if (this._currentOrientation !== this._templateSize.orientation) {
+            this._currentOrientation = this._templateSize.orientation;
+            this.emit(Urso.events.MODULES_SCENES_ORIENTATION_CHANGE, this._templateSize.orientation);
+        }
+
+        return true;
+    };
+
+    _getWindowSize() {
+        const iOS = Urso.device.iOS;
+        const { width, height } = document.body.getBoundingClientRect();
+
+        let windowSize = {
+            width: iOS ? window.innerWidth : width,
+            height: iOS ? window.innerHeight : height
+        };
+
+        if (window.devicePixelRatio && window.devicePixelRatio !== 1) {
+            windowSize.width *= window.devicePixelRatio;
+            windowSize.height *= window.devicePixelRatio;
+        }
+
+        return windowSize;
+    }
+
+    _getOrientation(windowSize) {
+        return windowSize.width > windowSize.height ? this._orientations.landscape : this._orientations.portrait;  //todo move to constants
+    }
+
+    _getResolutionConfig(windowSize) {
+        let orientation = this._getOrientation(windowSize);
+        let mainDimension = windowSize.width > windowSize.height ? 'width' : 'height'; //todo move to constants
+        let config = this.getInstance('ResolutionsConfig').get();
+        let currentResolution = config[0];
+
+        //select optimal resolution from config
+        for (let resolution of config) {
+            if (resolution.orientation !== orientation)
+                continue;
+
+            if (
+                (currentResolution.orientation !== orientation) ||
+                (
+                    currentResolution[mainDimension] < resolution[mainDimension] &&
+                    resolution[mainDimension] < windowSize[mainDimension]
+                ) ||
+                (
+                    windowSize[mainDimension] < currentResolution[mainDimension] &&
+                    resolution[mainDimension] < currentResolution[mainDimension]
+                )
+            )
+                currentResolution = resolution;
+        }
+
+        return currentResolution;
+    }
+
+    _getOptimalRatio(configResolution, windowRatio, orientation) {
+        let optimalRatio = configResolution.width / configResolution.height;
+
+        if (configResolution.adaptive) {
+            let display = !Urso.helper.mobileAndTabletCheck() ? 'desktop' : 'mobile'; //todo move to constants
+            let adaptiveParams = this.getInstance('ResolutionsConfig').getAdaptive()[display];
+
+            if (adaptiveParams.supported) {
+                let limits = adaptiveParams.limits[orientation];
+                optimalRatio = Urso.math.intMakeBetween(windowRatio, limits.min, limits.max);
+            }
+        }
+
+        return optimalRatio;
+    }
+
+    _calculateTemplateSize(resolution) {
+        this._templateSize.orientation = resolution.orientation;
+        this._templateSize.width = resolution.base.width;
+        this._templateSize.height = resolution.base.height;
+
+        let dimensionsArray = ['width', 'height'];
+
+        //adaptive corrections
+        if (resolution.adaptive) {
+            let dimensionsPassiveKey = (resolution.width / resolution.height > resolution.base.width / resolution.base.height) ? 0 : 1;
+            let dimensionsMainKey = (dimensionsPassiveKey === 1) ? 0 : 1;
+
+            this._templateSize[dimensionsArray[dimensionsPassiveKey]] =
+                ~~(
+                    resolution[dimensionsArray[dimensionsPassiveKey]] *
+                    resolution.base[dimensionsArray[dimensionsMainKey]] / resolution[dimensionsArray[dimensionsMainKey]]
+                );
+        }
+
+        return this._templateSize;
+    }
+
+    _applyResolutionToPixi(resolution) {
+        let maxResolutionFactor = Math.min(this.getInstance('ResolutionsConfig').maxSize() / Math.max(resolution.width, resolution.height), 1);
+        let dp = window.devicePixelRatio;
+        let canvasSize = {
+            width: ~~(resolution.width * maxResolutionFactor),
+            height: ~~(resolution.height * maxResolutionFactor)
+        };
+
+        this.getInstance('PixiWrapper').resize(canvasSize.width, canvasSize.height);
+        this.getInstance('PixiWrapper').setWorldScale(canvasSize.width / this._templateSize.width, canvasSize.height / this._templateSize.height);
+        this.getInstance('PixiWrapper').setCanvasWidth(resolution.width / dp);
+        this.getInstance('PixiWrapper').setCanvasHeight(resolution.height / dp);
+
+        this._activeResolution = resolution;
+        return true;
+    };
+}
+
+module.exports = ModulesScenesResolutions;

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

@@ -1,73 +1,73 @@
-class ModulesScenesResolutionsConfig {
-    constructor() {
-        this.singleton = true;
-
-        this._orientations = ['landscape', 'portrait'];
-
-        this.contents = [
-            {
-                "name": 'default',
-                "width": 1920,
-                "height": 1080,
-                "orientation": 'landscape',
-                "adaptive": true
-            }
-        ];
-
-        this.adaptiveConfig = {//works only if "adaptive": true  for current resolution
-            desktop: {
-                supported: true,
-                limits: {
-                    landscape: {
-                        min: 1, // width:height factor
-                        max: 2
-                    },
-                    portrait: {
-                        min: 0.5,
-                        max: 1
-                    }
-                }
-            },
-            mobile: {
-                supported: true,
-                limits: {
-                    landscape: {
-                        min: 1, // width:height factor
-                        max: 2
-                    },
-                    portrait: {
-                        min: 0.5,
-                        max: 1
-                    }
-                }
-            }
-        };
-    }
-
-    get() {
-        return this.contents;
-    };
-
-
-    getAdaptive() {
-        return this.adaptiveConfig;
-    };
-
-    maxSize() {
-        return Math.max(this.maxWidth(), this.maxHeight());
-    };
-
-    maxWidth() {
-        return this._maxDimension.call(this, 'width');
-    };
-
-    maxHeight() {
-        return this._maxDimension.call(this, 'height');
-    };
-
-    _maxDimension(dim) {
-        return this.contents.reduce((result, resolution) => resolution[dim] > result ? resolution[dim] : result, 0);
-    };
-}
-
-module.exports = ModulesScenesResolutionsConfig;
+class ModulesScenesResolutionsConfig {
+    constructor() {
+        this.singleton = true;
+
+        this._orientations = ['landscape', 'portrait'];
+
+        this.contents = [
+            {
+                "name": 'default',
+                "width": 1920,
+                "height": 1080,
+                "orientation": 'landscape',
+                "adaptive": true
+            }
+        ];
+
+        this.adaptiveConfig = {//works only if "adaptive": true  for current resolution
+            desktop: {
+                supported: true,
+                limits: {
+                    landscape: {
+                        min: 1, // width:height factor
+                        max: 2
+                    },
+                    portrait: {
+                        min: 0.5,
+                        max: 1
+                    }
+                }
+            },
+            mobile: {
+                supported: true,
+                limits: {
+                    landscape: {
+                        min: 1, // width:height factor
+                        max: 2
+                    },
+                    portrait: {
+                        min: 0.5,
+                        max: 1
+                    }
+                }
+            }
+        };
+    }
+
+    get() {
+        return this.contents;
+    };
+
+
+    getAdaptive() {
+        return this.adaptiveConfig;
+    };
+
+    maxSize() {
+        return Math.max(this.maxWidth(), this.maxHeight());
+    };
+
+    maxWidth() {
+        return this._maxDimension.call(this, 'width');
+    };
+
+    maxHeight() {
+        return this._maxDimension.call(this, 'height');
+    };
+
+    _maxDimension(dim) {
+        return this.contents.reduce((result, resolution) => resolution[dim] > result ? resolution[dim] : result, 0);
+    };
+}
+
+module.exports = ModulesScenesResolutionsConfig;

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

@@ -1,84 +1,92 @@
-class ModulesScenesService {
-    constructor() {
-        this.singleton = true;
-        this._displayInProgress = false;
-        this._currentSceneName = false;
-        this._currentSceneTemplate = false;
-        this._sceneModel;
-
-        this._pixiWrapper;
-
-        this.init();
-
-        this._assetsLoadedHandler = this._assetsLoadedHandler.bind(this);
-    }
-
-    init() {
-        this._pixiWrapper = this.getInstance('PixiWrapper');
-        this._pixiWrapper.init();
-    }
-
-    display(name) {
-        if (this._displayInProgress) {
-            console.warn("Scenes.display is busy ", this._currentSceneName);
-            return false;
-        }
-
-        let template = Urso.template.scene(name);
-
-        if (!template) {
-            console.error('Scenes.display error: no template for scene', name);
-            return false;
-        }
-
-        console.log('[SCENE] display:', name);
-        this._displayInProgress = true;
-        this.emit(Urso.events.MODULES_SCENES_DISPLAY_START, name);
-
-        //destroy all components, if _sceneModel exists. Not exists only in first call
-        if (this._sceneModel)
-            this._sceneModel.destroy();
-
-        this._currentSceneName = name;
-        Urso.observer.clearAllLocal();
-        Urso.observer.setPrefix(name);
-
-        //parse template
-        this._currentSceneTemplate = Urso.template.parse(template);
-
-        console.log('[SCENE] current template:', this._currentSceneTemplate)
-        this._sceneModel = this.getInstance('Model');
-
-        //write model by template (functions)  //todo set in model (this.getInstance('Model', params);)
-        this._sceneModel.loadUpdate = (loadProgress) => { this._currentSceneTemplate.components.forEach(component => component.loadUpdate(loadProgress)); }
-        this._sceneModel.create = () => { this._currentSceneTemplate.components.forEach(component => component.create()); }
-        this._sceneModel.update = (deltaTime) => { this._currentSceneTemplate.components.forEach(component => component.update(deltaTime)); }
-        this._sceneModel.destroy = () => { this._currentSceneTemplate.components.forEach(component => component.destroy()); }
-
-        //start new scene by wrapper
-        this.getInstance('PixiWrapper').setNewScene(this._sceneModel);
-        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);
-    }
-
-    _assetsLoadedHandler() {
-        Urso.objects.create(this._currentSceneTemplate.objects);
-
-        //call all components create
-        this._sceneModel.create();
-
-        this.emit(Urso.events.MODULES_SCENES_DISPLAY_FINISHED);
-        this._displayInProgress = false;
-    }
-}
-
-module.exports = ModulesScenesService;
+class ModulesScenesService {
+    constructor() {
+        this.singleton = true;
+
+        this._displayInProgress = false;
+        this._currentSceneName = false;
+        this._currentSceneTemplate = false;
+        this._sceneModel;
+
+        this.timeScale = 1;
+
+        this._pixiWrapper;
+
+        this.init();
+
+        this._assetsLoadedHandler = this._assetsLoadedHandler.bind(this);
+    }
+
+    init() {
+        this._pixiWrapper = this.getInstance('PixiWrapper');
+        this._pixiWrapper.init();
+    }
+
+    setTimeScale(value) {
+        this.timeScale = value;
+        gsap.globalTimeline.timeScale(this.timeScale);
+    }
+
+    display(name) {
+        if (this._displayInProgress) {
+            console.warn("Scenes.display is busy ", this._currentSceneName);
+            return false;
+        }
+
+        let template = Urso.template.scene(name);
+
+        if (!template) {
+            console.error('Scenes.display error: no template for scene', name);
+            return false;
+        }
+
+        console.log('[SCENE] display:', name);
+        this._displayInProgress = true;
+        this.emit(Urso.events.MODULES_SCENES_DISPLAY_START, name);
+
+        //destroy all components, if _sceneModel exists. Not exists only in first call
+        if (this._sceneModel)
+            this._sceneModel.destroy();
+
+        this._currentSceneName = name;
+        Urso.observer.clearAllLocal();
+        Urso.observer.setPrefix(name);
+
+        //parse template
+        this._currentSceneTemplate = Urso.template.parse(template);
+
+        console.log('[SCENE] current template:', this._currentSceneTemplate)
+        this._sceneModel = this.getInstance('Model');
+
+        //write model by template (functions)  //todo set in model (this.getInstance('Model', params);)
+        this._sceneModel.loadUpdate = (loadProgress) => { this._currentSceneTemplate.components.forEach(component => component.loadUpdate(loadProgress)); }
+        this._sceneModel.create = () => { this._currentSceneTemplate.components.forEach(component => component.create()); }
+        this._sceneModel.update = (deltaTime) => { this._currentSceneTemplate.components.forEach(component => component.update(deltaTime)); }
+        this._sceneModel.destroy = () => { this._currentSceneTemplate.components.forEach(component => component.destroy()); }
+
+        //start new scene by wrapper
+        this.getInstance('PixiWrapper').setNewScene(this._sceneModel);
+        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);
+    }
+
+    _assetsLoadedHandler() {
+        Urso.objects.create(this._currentSceneTemplate.objects);
+
+        //call all components create
+        this._sceneModel.create();
+
+        this.emit(Urso.events.MODULES_SCENES_DISPLAY_FINISHED);
+        this._displayInProgress = false;
+    }
+}
+
+module.exports = ModulesScenesService;