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

Updated to PixiJS v5.

Browse Source
This commit is contained in:
Sebastian Kupke
2019-09-10 16:34:59 +02:00
parent a775126f9c
commit ebe0b1253f
29 changed files with 46482 additions and 67844 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dist/iwmlib.3rdparty.js
Vendored
+44868 -66279
View File
File diff suppressed because one or more lines are too long
dist/iwmlib.3rdparty.min.js
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
dist/iwmlib.js
Vendored
+735 -652
View File
File diff suppressed because it is too large Load Diff
dist/iwmlib.pixi.js
Vendored
+36 -40
View File
@@ -2894,7 +2894,7 @@
}
const url = Button.iconIsUrl(icon) ? icon : `../../assets/icons/${icon}.png`;
const iconTexture = PIXI.Texture.fromImage(url, true);
const iconTexture = PIXI.Texture.from(url);
const sprite = new PIXI.Sprite(iconTexture);
sprite.tint = color;
@@ -3728,7 +3728,7 @@
// closeButton
//-----------------
if (this.opts.closeButton) {
let closeButton = PIXI.Sprite.fromImage('../../assets/icons/close.png', true);
let closeButton = PIXI.Sprite.from('../../assets/icons/close.png');
closeButton.width = this.headerStyle.fontSize;
closeButton.height = closeButton.width;
closeButton.tint = this.theme.color2;
@@ -4312,8 +4312,7 @@
resolution,
autoResize,
backgroundColor,
forceCanvas,
roundPixels // not needed for PixiJS >= 5
forceCanvas
});
this.width = width;
@@ -4944,7 +4943,7 @@
* }).setup().run()
*
* // Add a video sprite
* const sprite = new PIXI.Sprite(PIXI.Texture.fromVideo("assets/blurfilter.mp4"))
* const sprite = new PIXI.Sprite(PIXI.Texture.from("assets/blurfilter.mp4"))
* sprite.width = app.size.width
* sprite.height = app.size.height
* app.scene.addChild(sprite)
@@ -4970,10 +4969,15 @@
}
apply(filterManager, input, output) {
let renderTarget = filterManager.getRenderTarget(true);
let renderTarget = filterManager.getFilterTexture();
this.tiltShiftXFilter.apply(filterManager, input, renderTarget);
this.tiltShiftYFilter.apply(filterManager, renderTarget, output);
filterManager.returnRenderTarget(renderTarget);
filterManager.returnFilterTexture(renderTarget);
// let renderTarget = filterManager.getRenderTarget(true)
// this.tiltShiftXFilter.apply(filterManager, input, renderTarget)
// this.tiltShiftYFilter.apply(filterManager, renderTarget, output)
// filterManager.returnRenderTarget(renderTarget)
}
/**
@@ -5050,19 +5054,23 @@
uniform mat3 projectionMatrix;
varying vec2 vVertexPosition;
varying vec2 vTextureCoord;
void main(void) {
gl_Position = vec4((projectionMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0);
vVertexPosition = aVertexPosition;
vTextureCoord = aTextureCoord;
gl_Position = vec4((projectionMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0);
}
`;
const fragment = `
varying vec2 vVertexPosition;
varying vec2 vTextureCoord;
uniform vec4 filterArea;
uniform sampler2D uSampler;
uniform int shape;
uniform vec4 rectangle;
uniform vec3 circle;
@@ -5075,15 +5083,12 @@
}
void main(void) {
// textureCoord to pixelCoord
vec2 pixelCoord = vTextureCoord * filterArea.xy - vec2(4.0, 4.0); // FIXME: There's a shift of 4 * 4 pixels, don't know why...
bool inside = false;
if (shape == 1) {
inside = distance(pixelCoord, circle.xy) <= circle.z;
inside = distance(vVertexPosition, circle.xy) <= circle.z;
} else if (shape == 2) {
inside = pixelCoord.x >= rectangle.x && pixelCoord.x <= rectangle.z && pixelCoord.y >= rectangle.y && pixelCoord.y <= rectangle.w;
inside = vVertexPosition.x >= rectangle.x && vVertexPosition.x <= rectangle.z && vVertexPosition.y >= rectangle.y && vVertexPosition.y <= rectangle.w;
}
if (inside) {
@@ -6396,9 +6401,7 @@
for (let j = 0; j < elements.length; j++) {
// if(elements[j].tagName == "svg") return false;
const target = elements[j];
let hammer = new Hammer(target, opts);
let hammer = new Hammer(elements[j], opts);
if (window.propagating !== 'undefined') {
hammer = propagating(hammer);
@@ -6419,23 +6422,16 @@
hammer.get('tap').set(opts);
}
console.log('APPLY HAMMER ON', type);
target.addEventListener("click", ()=>{
console.log("Hello");
});
hammer.on(type, event => {
console.log('FIRED');
cb(event);
});
if (Hammer.__hammers.has(target)) {
const elementHammers = Hammer.__hammers.get(target);
if (Hammer.__hammers.has(elements[j])) {
const elementHammers = Hammer.__hammers.get(elements[j]);
elementHammers.push(hammer);
Hammer.__hammers.set(target, elementHammers);
Hammer.__hammers.set(elements[j], elementHammers);
} else {
Hammer.__hammers.set(target, [hammer]);
Hammer.__hammers.set(elements[j], [hammer]);
}
}
} else {
@@ -8501,7 +8497,7 @@
}
/**
* Loads a tile from image using the PIXI.Texture.fromImage method.
* Loads a tile from image using the PIXI.Texture.from method.
*
* @static
* @param {*} imageId
@@ -8511,7 +8507,7 @@
* @memberof Tile
*/
static fromImage(imageId, crossorigin, scaleMode) {
return new Tile(PIXI.Texture.fromImage(imageId, crossorigin, scaleMode), imageId)
return new Tile(PIXI.Texture.from(imageId, crossorigin, scaleMode), imageId)
}
/**
@@ -8762,7 +8758,7 @@
constructor(tiles, compression) {
super(tiles);
this.destroyed = false;
this.loader = new PIXI.loaders.Loader();
this.loader = new PIXI.Loader();
this.loader.on('load', this._onLoaded.bind(this));
this.loader.on('error', this._onError.bind(this));
if (compression) {
@@ -9868,7 +9864,7 @@
* @return {Sprite} sprite - A sprite with a single tile texture
*/
thumbnail() {
return new PIXI.Sprite.fromImage(this.info.baseURL)
return new PIXI.Sprite.from(this.info.baseURL)
}
/** Returns a list of all tiles of a given level.
@@ -10368,7 +10364,7 @@
let canvas = globalScatterLoaderCanvas;
canvas.width = w;
canvas.height = h;
let renderer = new PIXI.WebGLRenderer(w, h, {
let renderer = new PIXI.Renderer(w, h, {
view: canvas,
resolution: resolution
});
@@ -10627,8 +10623,8 @@
* Class that represents a PixiJS Flippable.
*
* @example
* const front = PIXI.Sprite.fromImage('./assets/front.jpg')
* const back = PIXI.Sprite.fromImage('./assets/back.jpg')
* const front = PIXI.Sprite.from('./assets/front.jpg')
* const back = PIXI.Sprite.from('./assets/back.jpg')
* app.scene.addChild(front)
*
* // Create the flippable
@@ -10649,7 +10645,7 @@
* @constructor
* @param {PIXI.DisplayObject} front - The object to show initially. Should have been added to the scene.
* @param {PIXI.DisplayObject} back - The object to show on the backside. Should have not been added to the scene.
* @param {PIXI.WebGLRenderer|PIXI.CanvasRenderer} renderer - The renderer of the application.
* @param {PIXI.Renderer|PIXI.CanvasRenderer} renderer - The renderer of the application.
* @param {object} [opts] - An options object which can contain the following properties.
* @param {number} [opts.duration=1] - The duration of the flip animation in seconds.
* @param {GSAP.Ease} [opts.ease=Power2.easeOut] - The ease of the flip animation.
@@ -10733,7 +10729,7 @@
// shadow
//--------------------
const shadow = new PIXI.projection.Sprite3d(PIXI.Texture.fromImage('../../assets/images/shadow.png'));
const shadow = new PIXI.projection.Sprite3d(PIXI.Texture.from('../../assets/images/shadow.png'));
shadow.renderable = false;
shadow.anchor.set(0.5);
shadow.scale3d.set(0.98);
@@ -11384,7 +11380,7 @@
if (child.scatter) {
let polygon = child.scatter.polygon;
let shape = new PIXI.Polygon(polygon.flatAbsolutePoints());
shape.close();
//shape.close() not possible in PixiJS v5
this.drawShape(shape);
}
}
@@ -15522,8 +15518,8 @@
* Class that represents a PixiJS List.
*
* @example
* const elephant1 = PIXI.Sprite.fromImage('./assets/elephant-1.jpg')
* const elephant2 = PIXI.Sprite.fromImage('./assets/elephant-2.jpg')
* const elephant1 = PIXI.Sprite.from('./assets/elephant-1.jpg')
* const elephant2 = PIXI.Sprite.from('./assets/elephant-2.jpg')
*
* // Create the list
* const list = new List([elephant1, elephant2])