@urso/core 0.9.4-dev → 0.9.6-dev

package/src/js/extra/browserEvents.js

@@ -2,7 +2,7 @@ class ExtraBrowserEvents {
     constructor() {
         this.singleton = true;
 
-        this.RESIZE_DELAY = 250; //delay for resize event (browser will refresh his own params)
+        this.RESIZE_DELAY = 0; //delay for resize event (browser will refresh his own params)
 
         this._keyPressHandler = this._keyPressHandler.bind(this);
         this.resizeHandler = this.resizeHandler.bind(this);
@@ -42,7 +42,9 @@ class ExtraBrowserEvents {
             Urso.clearTimeout(this._resizeTimeoutId)
 
         this.emit(Urso.events.EXTRA_BROWSEREVENTS_WINDOW_PRE_RESIZE);
-        this._resizeTimeoutId = Urso.setTimeout(() => this.emit(Urso.events.EXTRA_BROWSEREVENTS_WINDOW_RESIZE), this.RESIZE_DELAY);
+        this._resizeTimeoutId = Urso.setTimeout(() => 
+            this.emit(Urso.events.EXTRA_BROWSEREVENTS_WINDOW_RESIZE)
+        , this.RESIZE_DELAY);
     }
 
     _pointerEventsHandler(event) {

package/src/js/extra/main.js

@@ -1,11 +1,6 @@
 import * as PIXI from 'pixi.js';
 window.PIXI = PIXI;
 
-// import * as spine from '@esotericsoftware/spine-pixi-v8';
-// window.PIXI.spine = spine;
-
-// import * as particlesFx from 'revolt-fx';
-// window.PIXI.particlesFx = particlesFx;
 
 import { gsap } from 'gsap';
 window.gsap = gsap;
@@ -13,11 +8,40 @@ window.gsap = gsap;
 import { Howler, Howl } from 'howler';
 
 window.UrsoUtils = {
-    Howler: Howler,
-    Howl: Howl,
-    gsap: gsap,
-    PIXI: PIXI
+    Howler,
+    Howl,
+    gsap,
+    PIXI
+};
+
+const SoundAsset = {
+  extension: {
+    type: PIXI.ExtensionType.LoadParser,
+    name: 'sound-asset-loader',
+    priority: 100
+  },
+
+  test(url) {
+    return url.endsWith('.mp3') || url.endsWith('.ogg') || url.endsWith('.wav');
+  },
+
+
+  async load(url) {
+    return new Promise(async (resolve, reject) => {
+      try {
+        const response = await fetch(url);
+        if (!response.ok) {
+          throw new Error(`HTTP error! status: ${response.status}`);
+        }
+        const arrayBuffer = await response.arrayBuffer();
+        resolve(arrayBuffer);
+      } catch (error) {
+        reject(error);
+      }
+    });
+  }
 };
 
+PIXI.extensions.add(SoundAsset);
 
 export default {}

package/src/js/lib/cache.js

@@ -37,36 +37,65 @@ class LibCache {
 
         for (const key in atlases) {
             const atlas = atlases[key];
-            
             const page = new spine.TextureAtlasPage(key);
             const { w, h } = atlas.data.meta.size;
-            
+
             const baseTexture = new spine.SpineTexture(atlas.textureSource);
 
-            page.width = w;
-            page.height = h;
+            // Use actual texture dimensions for page (may differ from meta.size due to resolution scaling)
+            const texW = atlas.textureSource.pixelWidth || atlas.textureSource.source?.pixelWidth || w;
+            const texH = atlas.textureSource.pixelHeight || atlas.textureSource.source?.pixelHeight || h;
+
+            page.width = texW;
+            page.height = texH;
             page.texture = baseTexture;
             page.minFilter = page.magFilter = 9729;
             page.uWrap = page.vWrap = 33071;
             textureAtlas.pages.push(page);
 
-            for (const frameName in atlas._frames) {
-                const nameSplit = frameName.split('.');
-                const name = nameSplit.splice(0, nameSplit.length - 1).join('.')
-                const frame = atlas._frames[frameName];
-                const region = new spine.TextureAtlasRegion(page, name);
+            for (const frameName in atlas.data.frames) {
+                let normalizedName = frameName;
+                if (frameName.includes('.')) {
+                    const nameSplit = frameName.split('.');
+                    normalizedName = nameSplit.splice(0, nameSplit.length - 1).join('.');
+                }
+
+                const frame = atlas.data.frames[frameName];
+                const region = new spine.TextureAtlasRegion(page, normalizedName);
                 
-                region.width = frame.frame.w;
-                region.height = frame.frame.h;
-                region.u = frame.frame.x / baseTexture.texture.width;
-                region.v = frame.frame.y / baseTexture.texture.height;
-                region.u2 = (frame.frame.x + frame.frame.w) / baseTexture.texture.width;
-                region.v2 = (frame.frame.y + frame.frame.h) / baseTexture.texture.height;
-                region.rotate = false;
+                // Check if frame is rotated (TexturePacker boolean or 90 marker)
+                const isRotated = frame.rotated === true || frame.rotated === 90;
+
+                // Frame rect in the atlas (pixels)
+                const fx = frame.frame.x;
+                const fy = frame.frame.y;
+                const fw = frame.frame.w;
+                const fh = frame.frame.h;
+
+                // Region size (swap on rotation)
+                region.width = isRotated ? fh : fw;
+                region.height = isRotated ? fw : fh;
+
+                region.u = fx / texW;
+                region.v = fy / texH;
+                region.u2 = (fx + fw) / texW;
+                region.v2 = (fy + fh) / texH;
+                region.degrees = isRotated ? 90 : 0;
+                
+                // Original (untrimmed) size - already at export scale in JSON
                 region.originalWidth = frame.sourceSize.w;
                 region.originalHeight = frame.sourceSize.h;
-                region.texture = baseTexture;
 
+                // Offsets relative to original rect (bottom-left)
+                if (frame.spriteSourceSize) {
+                    region.offsetX = frame.spriteSourceSize.x;
+                    region.offsetY = frame.sourceSize.h - frame.spriteSourceSize.y - frame.spriteSourceSize.h;
+                } else {
+                    region.offsetX = 0;
+                    region.offsetY = 0;
+                }
+                
+                region.texture = baseTexture;
                 textureAtlas.regions.push(region);
             }
         }
@@ -130,6 +159,11 @@ class LibCache {
     };
 
     addTexture(key, someData) {
+        if(key.includes('.')) {
+            const keySplit = key.split('.');
+            key = keySplit.splice(0, keySplit.length - 1).join('.')
+        }
+
         this._setDataToAssetsList('texture', key, someData);
     };
 

package/src/js/lib/tween.js

@@ -1,153 +1,367 @@
-/**
- * @deprecated
- * tween interface over gsap timeline
- */
-class LibTween {
-
+/* eslint-disable object-shorthand */
+/* eslint-disable max-len */
+/* eslint-disable no-setter-return */
+/* eslint-disable guard-for-in */
+/* eslint-disable no-restricted-syntax */
+/* eslint-disable quote-props */
+/* eslint-disable quotes */
+/* eslint-disable func-names */
+class Tween {
     constructor() {
         this.singleton = true;
 
-        this._tweenIndex = 0;
         this._tweens = {};
+        this._currentTime = 0;
+        this._tweenIndex = 0;
+
+        Object.defineProperties(this, {
+            "globalTimeScale": {
+                "get": function () { return Urso.scenes.timeScale; },
+                "set": function () { Urso.logger.error('ComponentsSlotMachineTween: you cannot set globalTimeScale'); },
+            },
+        });
+
+        this.tweens = this._tweens;
+        this._subscibe();
+    }
+
+    // sys
+    update() {
+        this._update();
     }
 
     removeAll() {
-        for (let k in this._tweens)
+        for (const k in this._tweens) {
             this._tweens[k].stop();
-
-        this._tweens = {};
-    };
+        }
+    }
 
     add(object) {
         const key = this._keyGenerate();
-
-        const tl = gsap.timeline({
-            repeat: 1,
-            onComplete: () => { this._onCompleteHandler(key) },
-            onUpdate: () => { this._onUpdateHandler(key) }
-        });
-
+        const _this = this;
         const tween = {
             id: key,
             isRunning: false,
+            enableUpdate: false,
             target: object,
             to: this._to,
             start: this._start,
             pause: this._pause,
             resume: this._resume,
             stop: this._stop,
+            points: [],
+            manager: this,
 
             _timeScale: 1,
             get timeScale() {
                 return this._timeScale;
-            }, set timeScale(a) {
+            },
+            set timeScale(a) {
+                if (this._timeScale === a || !this.points[0]) {
+                    return this._timeScale;
+                }
+
+                const timeDiff = ~~(_this._currentTime - this.points[0].timeStart) * (_this.globalTimeScale * this._timeScale);
+
+                if (this.points[0].duration - timeDiff <= 0) {
+                    return this._timeScale;
+                }
+
+                this.points[0].duration -= timeDiff;
+                this.points[0].timeStart = _this._currentTime;
+
+                // update current point data
+                for (const k in this.points[0].propsTo) {
+                    this.points[0].propsFrom[k] = this.target[k];
+                }
+
+                this._timeScale = a;
+
                 return this._timeScale;
             },
-            _timeline: tl,
+
+            _started: false,
+            _paused: false,
+            _pauseTime: false,
+            _timeBonus: 0,
             _complete: false,
-            _paused: true,
+            _bkp: {
+                points: [],
+                obj: null,
+            },
             _functions: {
                 onStart: [],
+                onStartOnce: [],
                 onUpdate: [],
-                onComplete: []
-            }
+                onComplete: [],
+                onCompleteOnce: [],
+            },
         };
 
-        //need to add some functions
+        // need to add some functions
         tween.onComplete = {
-            add: (f) => {
+            addOnce: function (f) {
+                tween._functions.onCompleteOnce.push(f);
+                return tween;
+            },
+            add: function (f) {
                 tween._functions.onComplete.push(f);
                 return tween;
-            }
+            },
         };
 
         tween.onStart = {
-            add: (f) => {
+            addOnce: function (f) {
+                tween._functions.onStartOnce.push(f);
+                return tween;
+            },
+            add: function (f) {
                 tween._functions.onStart.push(f);
                 return tween;
-            }
+            },
         };
 
-        tween.onUpdate = {
-            add: (f) => {
-                tween._functions.onUpdate.push(f);
-                return tween;
-            }
+        tween.onUpdateCallback = function (f) {
+            tween._functions.onUpdate.push(f);
+            return tween;
         };
 
         this._tweens[key] = tween;
 
         return tween;
-    };
+    }
 
-    _keyGenerate() {
-        this._tweenIndex++;
-        return (new Date()).getTime() + '_' + this._tweenIndex;
-    };
+    _to(propsTo, duration, easing, autostart, startDelay) {
+        const propsFrom = {};
 
-    //todo easing
-    _to(propsTo, duration, easing = undefined, autostart = false, startDelay = 0) {
-        const params = Urso.helper.objectClone(propsTo, 10);
-        params.duration = duration / 1000;
-        params.easing = easing;
-        params.delay = startDelay;
+        for (const k in propsTo) {
+            propsFrom[k] = this.target[k];
+        }
+
+        if (!startDelay) {
+            startDelay = 0;
+        }
+
+        const timeStart = this.manager._currentTime + startDelay;
+        const point = {
+            propsTo,
+            duration,
+            easing,
+            propsFrom,
+            timeStart,
+            startDelay,
+        };
 
-        this._timeline.to(this.target, params);
-        //this.pause();
+        this.points.push(point);
+        this._complete = false;
 
-        if (autostart)
+        if (autostart) {
             this.start();
+        }
 
         return this;
-    };
+    }
 
     _start() {
-        for (let i = 0; i < this._functions.onStart.length; i++)
+        if (this.isRunning || !this.points || (this.points.length === 0 && this._bkp.points.length === 0)) {
+            return this;
+        }
+
+        if (this.points.length === 0 && this._bkp.points.length > 0) {
+            this.points = this._bkp.points;
+            const key = this.manager._keyGenerate();
+            this.manager._tweens[key] = this;
+        }
+
+        this.points[0].timeStart = this.manager._currentTime + this.points[0].startDelay;
+
+        this._bkp = {
+            points: Urso.helper.objectClone(this.points),
+            obj: null, // TODO save states for all points
+        };
+
+        this._started = true;
+        this.isRunning = true;
+        this._complete = false;
+
+        for (let i = 0; i < this._functions.onStartOnce.length; i++) {
+            this._functions.onStartOnce[i]();
+        }
+
+        for (let i = 0; i < this._functions.onStart.length; i++) {
             this._functions.onStart[i]();
+        }
+
+        if (this._timeBonus > 0) {
+            this.manager._calcStep(this, true);
+        }
 
-        this.resume();
         return this;
-    };
+    }
 
     _pause() {
         this._paused = true;
         this.isRunning = false;
-        this._timeline.pause();
+        this._pauseTime = this.manager._currentTime;
 
         return this;
-    };
+    }
 
     _resume() {
+        if (this.points && this.points[0]) {
+            this.points[0].timeStart += (this.manager._currentTime - this._pauseTime);
+        }
+
         this._paused = false;
         this.isRunning = true;
-        this._timeline.resume();
+        this._pauseTime = 0;
 
         return this;
-    };
+    }
 
     _stop() {
-        this.pause();
-        this._timeline.kill();
         this._complete = true;
+        this.isRunning = false;
+        delete this.manager._tweens[this.id];
 
         return this;
-    };
+    }
+
+    _update() {
+        const curTime = (new Date()).getTime();
+
+        // pause ?
+        if (this.gamePaused) {
+            const delta = curTime - this._currentTime;
+
+            for (const k in this._tweens) {
+                if (this._tweens[k].points && this._tweens[k].points[0]) {
+                    this._tweens[k].points[0].timeStart += delta;
+                }
+            }
+
+            return true;
+        }
+
+        this._currentTime = curTime;
+
+        for (const k in this._tweens) {
+            if (this._tweens[k]._complete) {
+                delete this._tweens[k]
+                continue; // todo remove old Tweens to garbage collect them (delete this._tweens[k];) if tween dont using in 1-5 min ?
+            } else if (this._tweens[k]._started && !this._tweens[k]._paused) {
+                this._calcStep(this._tweens[k]);
+            }
+        }
+        return true;
+    }
+
+    _keyGenerate() {
+        this._tweenIndex++;
+        return `${this._currentTime}_${this._tweenIndex}`;
+    }
+
+    _calcStep(tween, onStartCall) {
+        const point = tween.points[0]; // {propsTo: propsTo, duration: duration, easing: easing, propsFrom: propsFrom, timeStart: this._currentTime}
+
+        if (this._currentTime < point.timeStart) {
+            return false;
+        }
+
+        const progress = this._applyDelta(tween, point, onStartCall);
+
+        const tweenData = {
+            percent: +progress.toFixed(3),
+            vEnd: point.propsTo,
+        };
+
+        for (let i = 0; i < tween._functions.onUpdate.length; i++) {
+            tween._functions.onUpdate[i](tween, progress, tweenData);
+        }
+
+        // complete
+        if (progress === 1) {
+            tween.points.shift();
+
+            if (tween.points.length === 0) {
+                // no points
+                tween._complete = true;
+                tween.isRunning = false;
+                const { onComplete } = tween._functions;
+                const { onCompleteOnce } = tween._functions;
+
+                tween._functions.onStartOnce = [];
+                tween._functions.onCompleteOnce = [];
+
+                if (!tween.enableUpdate) {
+                    tween._functions.onStart = [];
+                    tween._functions.onUpdate = [];
+                    tween._functions.onComplete = [];
+                }
+
+                for (let i = 0; i < onCompleteOnce.length; i++) {
+                    onCompleteOnce[i]();
+                }
 
-    _onUpdateHandler(tweenKey) {
-        const tween = this._tweens[tweenKey];
-        const percentage = ~~(tween._timeline.progress() * 100);
+                for (let i = 0; i < onComplete.length; i++) {
+                    onComplete[i]();
+                }
+            } else {
+                // next point
+                const { startDelay } = tween.points[0];
 
-        for (let i = 0; i < tween._functions.onUpdate.length; i++)
-            tween._functions.onUpdate[i](tween, percentage);
+                // calc step for new point
+                tween.points[0].timeStart = this._currentTime + startDelay;
+
+                // update start data
+                for (const k in tween.points[0].propsTo) {
+                    tween.points[0].propsFrom[k] = tween.target[k];
+                }
+
+                if (startDelay) {
+                    setTimeout(function () {
+                        this._calcStep(tween);
+                    }, startDelay);
+                } else {
+                    this._calcStep(tween);
+                }
+            }
+        }
+
+        return true;
     }
 
-    _onCompleteHandler(tweenKey) {
-        const tween = this._tweens[tweenKey];
-        const onComplete = tween._functions.onComplete;
+    _applyDelta(tween, point, onStartCall) {
+        if (tween._timeBonus > 0) {
+            point.timeStart -= tween._timeBonus;
+            tween._timeBonus = 0;
+        }
+
+        const time = this._currentTime;
+        let progress = (time - point.timeStart) * tween.timeScale * (this.globalTimeScale / point.duration); // 0-1
+
+        // cannot finish tween onstart in one tick (callbacks magic)
+        if (progress >= 1 && onStartCall) {
+            progress = 0.99;
+        }
+
+        if (progress > 1) {
+            progress = 1;
+
+            tween._timeBonus = ~~((time - point.timeStart) - point.duration / (tween.timeScale * this.globalTimeScale));
+        }
+
+        // apply objects props
+        for (const k in point.propsTo) {
+            tween.target[k] = point.propsFrom[k] + (point.propsTo[k] - point.propsFrom[k]) * progress;
+        }
+
+        return progress;
+    }
 
-        for (let i = 0; i < onComplete.length; i++)
-            onComplete[i]();
+    _subscibe() {
+        this.addListener(Urso.events.MODULES_SCENES_UPDATE, this._update.bind(this), true);
     }
 }
 
-export default LibTween;
+export default Tween;

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

@@ -541,9 +541,15 @@ class ModulesAssetsService {
 
         const widthFactor = width / resCfg.width;
 
-        return Object
+        const quality = Object
             .keys(qualityFactors)
             .reduce(...this._qualityReducer(qualityFactors, widthFactor));
+        
+        if(isMobile && quality === 'high') {
+            return 'hd';
+        }
+
+        return quality;
     }
 
     /**

package/src/js/modules/i18n/controller.js

@@ -27,7 +27,7 @@ class ModulesI18nController {
         if (!jsonResource)
             return Urso.logger.error('ModulesI18nController setLocale error, no loaded json:' + localeKey + '. Check assets please');
 
-        this.#vocabulary = jsonResource.data;
+        this.#vocabulary = jsonResource;
         this.emit(Urso.events.MODULES_I18N_NEW_LOCALE_WAS_SET, localeKey);
     }
 

package/src/js/modules/logic/sounds.js

@@ -71,7 +71,7 @@ class ModulesLogicSounds {
             if (!json)
                 continue;
 
-            audiospriteData[audiospriteKey] = { json: json.data, audiosprite: audiosprite.data };
+            audiospriteData[audiospriteKey] = { json, audiosprite };
         }
 
         return audiospriteData;

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

@@ -58,6 +58,10 @@ export default class ModulesObjectsBaseModel {
         this.custom = Urso.helper.recursiveGet('custom', params, {}); //custom params
     }
 
+    modifyValue(key, val) {
+        return val;
+    }
+
     getAbsoluteSize() {
         return { width: this._baseObject.width, height: this._baseObject.height };
     }

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

@@ -1,5 +1,5 @@
 import ModulesObjectsBaseModel from './../baseModel';
-// import * as particlesFx from 'revolt-fx';
+import * as particlesFx from '@urso/revolt-fx';
 
 class ModulesObjectsModelsEmitterFx extends ModulesObjectsBaseModel {
     constructor(params) {
@@ -76,16 +76,16 @@ class ModulesObjectsModelsEmitterFx extends ModulesObjectsBaseModel {
     };
 
     _createBundle() {
-        // this._bundle = new particlesFx.FX();
-        // let fx_settings_data = Urso.cache.getJson(this.cfg);
+        this._bundle = new particlesFx.FX();
+        let fx_settings_data = Urso.cache.getJson(this.cfg);
 
-        // if (this.spritesheetFilter)
-        //     fx_settings_data.spritesheetFilter = this.spritesheetFilter;
+        if (this.spritesheetFilter)
+            fx_settings_data.spritesheetFilter = this.spritesheetFilter;
         
-        // this._defaultEmitterName = fx_settings_data.emitters[0].name;
+        this._defaultEmitterName = fx_settings_data.emitters[0].name;
 
-        // this._bundle.initBundle(fx_settings_data);
-        // this.autostart && this.play();
+        this._bundle.initBundle(fx_settings_data);
+        this.autostart && this.play();
     }
 
     _subscribeOnce() {