IWMBrowser/iwmlib
IWMBrowser/iwmlib
4
0
Fork 0
Code Issues 6 Pull Requests Releases Wiki Activity

Fixed flippable scaling problem.

Browse Source
This commit is contained in:
Uwe Oestermeier 2024-02-12 15:05:12 +01:00
parent 57d6e8b461
commit 13ea23186f
5 changed files with 48 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
css/flipeffect.css
View File

@ -47,7 +47,6 @@
width: 44px;
height: 44px;
padding: 4px;
border: 1px solid red;
right: 0;
top: 0;
}
@ -58,7 +57,6 @@
width: 44px;
height: 44px;
padding: 4px;
border: 1px solid red;
right: 0;
bottom: 0;
}
@ -69,7 +67,6 @@
width: 44px;
height: 44px;
padding: 4px;
border: 1px solid red;
right: 0;
bottom: 0;
}

24
dist/iwmlib.js vendored
View File

@ -5504,6 +5504,7 @@
x: x,
y: y,
onComplete: (e) => {
console.log('onComplete', e);
if (this.flipped) {
this.hide(this.front);
// this.hide(this.infoBtn)
@ -5517,17 +5518,24 @@
//uo: check for special case that the front image must be adapted to the back size
let frontImage = this.front.querySelector('img');
if (frontImage) {
let scaleX = this.flipped ? w / this.scatterStartWidth : this.scatterStartWidth / w;
let scaleY = this.flipped ? h / this.scatterStartHeight : this.scatterStartHeight / h;
let ratio = this.scatterStartWidth / this.scatterStartHeight;
// Assumes that startWidth and startHeight are encoded in px
let sh = parseInt(this.startHeight);
let sw = parseInt(this.startWidth);
if (this.flipped) {
let scaleY = h / sh;
let scaleX = w / sw;
TweenLite.to(frontImage, duration, {
ease: Power1.easeOut,
scaleY: scaleY * targetScale * ratio,
scaleX: scaleX * targetScale,
onComplete: (e) => {
TweenLite.set(frontImage, { scale: 1.0 });
}
transformOrigin: '0% 0%',
scaleY,
scaleX
});
} else {
TweenLite.to(frontImage, duration, {
ease: Power1.easeOut,
transformOrigin: '0% 0%',
scaleY: 1.0,
scaleX: 1.0
});
}
}

24
dist/iwmlib.pixi.js vendored
View File

@ -8745,6 +8745,7 @@
x: x,
y: y,
onComplete: (e) => {
console.log('onComplete', e);
if (this.flipped) {
this.hide(this.front);
// this.hide(this.infoBtn)
@ -8758,17 +8759,24 @@
//uo: check for special case that the front image must be adapted to the back size
let frontImage = this.front.querySelector('img');
if (frontImage) {
let scaleX = this.flipped ? w / this.scatterStartWidth : this.scatterStartWidth / w;
let scaleY = this.flipped ? h / this.scatterStartHeight : this.scatterStartHeight / h;
let ratio = this.scatterStartWidth / this.scatterStartHeight;
// Assumes that startWidth and startHeight are encoded in px
let sh = parseInt(this.startHeight);
let sw = parseInt(this.startWidth);
if (this.flipped) {
let scaleY = h / sh;
let scaleX = w / sw;
TweenLite.to(frontImage, duration, {
ease: Power1.easeOut,
scaleY: scaleY * targetScale * ratio,
scaleX: scaleX * targetScale,
onComplete: (e) => {
TweenLite.set(frontImage, { scale: 1.0 });
}
transformOrigin: '0% 0%',
scaleY,
scaleX
});
} else {
TweenLite.to(frontImage, duration, {
ease: Power1.easeOut,
transformOrigin: '0% 0%',
scaleY: 1.0,
scaleX: 1.0
});
}
}

24
lib/flippable.js
View File

@ -632,6 +632,7 @@ export class DOMFlippable {
x: x,
y: y,
onComplete: (e) => {
console.log('onComplete', e)
if (this.flipped) {
this.hide(this.front)
// this.hide(this.infoBtn)
@ -645,17 +646,24 @@ export class DOMFlippable {
//uo: check for special case that the front image must be adapted to the back size
let frontImage = this.front.querySelector('img')
if (frontImage) {
let scaleX = this.flipped ? w / this.scatterStartWidth : this.scatterStartWidth / w
let scaleY = this.flipped ? h / this.scatterStartHeight : this.scatterStartHeight / h
let ratio = this.scatterStartWidth / this.scatterStartHeight
// Assumes that startWidth and startHeight are encoded in px
let sh = parseInt(this.startHeight)
let sw = parseInt(this.startWidth)
if (this.flipped) {
let scaleY = h / sh
let scaleX = w / sw
TweenLite.to(frontImage, duration, {
ease: Power1.easeOut,
scaleY: scaleY * targetScale * ratio,
scaleX: scaleX * targetScale,
onComplete: (e) => {
TweenLite.set(frontImage, { scale: 1.0 })
}
transformOrigin: '0% 0%',
scaleY,
scaleX
})
} else {
TweenLite.to(frontImage, duration, {
ease: Power1.easeOut,
transformOrigin: '0% 0%',
scaleY: 1.0,
scaleX: 1.0
})
}
}

0
rollup.config.mjs → rollup.config.js
View File