Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

resized image texture #32

Closed
DouweCnossen opened this issue Aug 7, 2019 · 0 comments · Fixed by #33
Closed

resized image texture #32

DouweCnossen opened this issue Aug 7, 2019 · 0 comments · Fixed by #33

Comments

@DouweCnossen
Copy link

It seems like lightning is caching the resized image texture and not the original so if the same image is loaded again the resizeMode calculation is off. You can recreate the issue here:
https://webplatformforembedded.github.io/Lightning/docs/renderEngine/textures/clipping

class TextureDemo extends lng.Application {
    static _template() {
        return {
            MyTexture: {
                x: 200,
                y: 250,
                texture: {type: lng.textures.ImageTexture, src: '/Lightning/img/LngDocs_LilLightningIdle.png'},
                transitions: {
                    'texture.x': {duration: 4}
                }
            },
            Wrapper: {
                rect: true, w: 200, h: 200, color: 0xFFAAAAAA,
                Contain: {
                    x: w=>w/2, y: h=>h/2, mount: 0.5,
                    texture: {type: lng.textures.ImageTexture, src: '/Lightning/img/LngDocs_LilLightningIdle.png', resizeMode: {type: 'contain', w: 200, h: 200}}
                }
            },
            Cover: {
                x: 200, y: 0,
                texture: {type: lng.textures.ImageTexture, src: '/Lightning/img/LngDocs_LilLightningIdle.png', resizeMode: {type: 'cover', w: 200, h: 200, clipY: 0}}
            }
        }
    };
    
    _init() {
        const myTexture = this.tag("MyTexture");
        myTexture.transition('texture.x').on('finish', () => {
            const current = myTexture.getSmooth('texture.x');
            myTexture.setSmooth('texture.x', current ? 0 : 50);
        })
        myTexture.setSmooth('texture.x', 50); 
        
        // This keeps the image the same as the template
        this.patch({
            Cover: {
                x: 200, y: 0,
                texture: {type: lng.textures.ImageTexture, src: '/Lightning/img/LngDocs_LilLightningIdle.png', resizeMode: {type: 'cover', w: 200, h: 200, clipY: 0}}
            }    
        });        
        
        // This does not appear as the same even though the following patch shouldn't change the image's appearance 
        setTimeout(() => {
            this.patch({
                Cover: {
                    x: 200, y: 0,
                    texture: {type: lng.textures.ImageTexture, src: '/Lightning/img/LngDocs_LilLightningIdle.png', resizeMode: {type: 'cover', w: 200, h: 200, clipY: 0}}
                }    
            }); 
        }, 1000);
    }
}

const options = {stage: {w: window.innerWidth, h: window.innerHeight, useImageWorker: false}};
const app = new TextureDemo(options);
document.body.appendChild(app.stage.getCanvas());
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant