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

Prettified all files.

Browse Source
This commit is contained in:
Sebastian Kupke
2019-07-18 12:26:39 +02:00
parent 7744b92771
commit 2d400a18ec
125 changed files with 11184 additions and 8154 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/pixi/app.js
+122 -74
View File
@@ -4,7 +4,7 @@ import Theme from './theme.js'
import Progress from './progress.js'
import Modal from './modal.js'
import Message from './message.js'
import {debounce} from '../utils.js'
import { debounce } from '../utils.js'
/**
* A special InteractionManager for fullscreen apps, which may
@@ -21,7 +21,6 @@ import {debounce} from '../utils.js'
* @see {@link https://stackoverflow.com/questions/29710696/webgl-drawing-buffer-size-does-not-equal-canvas-size}
*/
class FullscreenInteractionManager extends PIXI.interaction.InteractionManager {
mapPositionToPoint(point, x, y) {
let resolution = this.renderer.resolution
let extendWidth = 1.0
@@ -29,8 +28,10 @@ class FullscreenInteractionManager extends PIXI.interaction.InteractionManager {
let dy = 0
let canvas = this.renderer.view
let context = canvas.getContext('webgl')
if (context.drawingBufferWidth < canvas.width ||
context.drawingBufferHeight < canvas.height) {
if (
context.drawingBufferWidth < canvas.width ||
context.drawingBufferHeight < canvas.height
) {
extendWidth = context.drawingBufferWidth / canvas.width
extendHeight = context.drawingBufferHeight / canvas.height
//dx = wantedWidth - context.drawingBufferWidth
@@ -63,7 +64,6 @@ class FullscreenInteractionManager extends PIXI.interaction.InteractionManager {
* @see {@link http://pixijs.download/dev/docs/PIXI.Application.html|PIXI.Application}
*/
export default class PIXIApp extends PIXI.Application {
/**
* Creates an instance of a PixiApp.
*
@@ -86,12 +86,23 @@ export default class PIXIApp extends PIXI.Application {
* @param {boolean} [opts.adaptive=true] - Adds Graphics adaptive calculation of quadratic curve and arc subdivision.
*/
constructor({
width = null, height = null, view = null,
transparent = true, backgroundColor = 0x282828, theme = 'dark',
antialias = true, resolution = window.devicePixelRatio || 1, autoResize = true,
fpsLogging = false, progress = {}, forceCanvas = false, roundPixels = true, monkeyPatchMapping = true, adaptive = true,
graphql = false }) {
width = null,
height = null,
view = null,
transparent = true,
backgroundColor = 0x282828,
theme = 'dark',
antialias = true,
resolution = window.devicePixelRatio || 1,
autoResize = true,
fpsLogging = false,
progress = {},
forceCanvas = false,
roundPixels = true,
monkeyPatchMapping = true,
adaptive = true,
graphql = false
}) {
const fullScreen = !width || !height
if (fullScreen) {
@@ -109,7 +120,7 @@ export default class PIXIApp extends PIXI.Application {
autoResize,
backgroundColor,
forceCanvas,
roundPixels // not needed for PixiJS >= 5
roundPixels // not needed for PixiJS >= 5
})
this.width = width
@@ -132,7 +143,10 @@ export default class PIXIApp extends PIXI.Application {
console.log('App is in fullScreen mode or autoResize mode')
const resizeDebounced = debounce(event => this.resize(event), 50)
window.addEventListener('resize', resizeDebounced)
document.body.addEventListener('orientationchange', this.checkOrientation.bind(this))
document.body.addEventListener(
'orientationchange',
this.checkOrientation.bind(this)
)
}
if (monkeyPatchMapping) {
console.log('Using monkey patched coordinate mapping')
@@ -159,15 +173,17 @@ export default class PIXIApp extends PIXI.Application {
// GraphQL
if (this.graphql && typeof apollo !== 'undefined') {
const networkInterface = apollo.createNetworkInterface({
uri: '/graphql'
})
const wsClient = new subscriptions.SubscriptionClient(`wss://${location.hostname}/subscriptions`, {
reconnect: true,
connectionParams: {}
})
const wsClient = new subscriptions.SubscriptionClient(
`wss://${location.hostname}/subscriptions`,
{
reconnect: true,
connectionParams: {}
}
)
const networkInterfaceWithSubscriptions = subscriptions.addGraphQLSubscriptions(
networkInterface,
@@ -180,7 +196,11 @@ export default class PIXIApp extends PIXI.Application {
}
// progress
this._progress = new Progress(Object.assign({ theme: this.theme }, this.progressOpts, { app: this }))
this._progress = new Progress(
Object.assign({ theme: this.theme }, this.progressOpts, {
app: this
})
)
this._progress.visible = false
this.stage.addChild(this._progress)
@@ -205,9 +225,12 @@ export default class PIXIApp extends PIXI.Application {
checkOrientation(event) {
var value = this.orientation()
if (value != this.orient) {
setTimeout(100, function () {
this.orientationChanged(true)
}.bind(this))
setTimeout(
100,
function() {
this.orientationChanged(true)
}.bind(this)
)
this.orient = value
}
}
@@ -230,9 +253,7 @@ export default class PIXIApp extends PIXI.Application {
* @param {number} [width] - The width of the app.
* @param {number} [height] - The height of the app.
*/
layout(width, height) {
}
layout(width, height) {}
/**
* Draws the display tree of the app. Typically this can be delegated
@@ -303,7 +324,10 @@ export default class PIXIApp extends PIXI.Application {
* @param {number} [opts.height=window.innerHeight] - The height of the app to resize to.
* @return {PIXIApp} - Returns the PIXIApp for chaining.
*/
resize(event, { width = window.innerWidth, height = window.innerHeight } = {}) {
resize(
event,
{ width = window.innerWidth, height = window.innerHeight } = {}
) {
this.width = width
this.height = height
this.expandRenderer()
@@ -324,7 +348,8 @@ export default class PIXIApp extends PIXI.Application {
monkeyPatchPixiMapping() {
if (this.originalMapPositionToPoint === null) {
let interactionManager = this.renderer.plugins.interaction
this.originalMapPositionToPoint = interactionManager.mapPositionToPoint
this.originalMapPositionToPoint =
interactionManager.mapPositionToPoint
interactionManager.mapPositionToPoint = (point, x, y) => {
return this.fixedMapPositionToPoint(point, x, y)
}
@@ -332,7 +357,7 @@ export default class PIXIApp extends PIXI.Application {
}
/**
* In some browsers the canvas is distorted if the screen resolution and
* In some browsers the canvas is distorted if the screen resolution and
* overall size of the canvas exceeds the internal limits (e.g. 4096 x 4096 pixels).
* To compensate these distortions we need to fix the mapping to the actual
* drawing buffer coordinates.
@@ -351,8 +376,11 @@ export default class PIXIApp extends PIXI.Application {
let canvas = this.renderer.view
let context = canvas.getContext('webgl')
if (context !== null && (context.drawingBufferWidth < canvas.width ||
context.drawingBufferHeight < canvas.height)) {
if (
context !== null &&
(context.drawingBufferWidth < canvas.width ||
context.drawingBufferHeight < canvas.height)
) {
extendWidth = context.drawingBufferWidth / canvas.width
extendHeight = context.drawingBufferHeight / canvas.height
//dx = wantedWidth - context.drawingBufferWidth
@@ -360,7 +388,12 @@ export default class PIXIApp extends PIXI.Application {
}
x *= extendWidth
y *= extendHeight
return this.originalMapPositionToPoint.call(interactionManager, local, x, y + dy)
return this.originalMapPositionToPoint.call(
interactionManager,
local,
x,
y + dy
)
}
/**
@@ -394,7 +427,6 @@ export default class PIXIApp extends PIXI.Application {
* called without a parameter.
*/
progress(value) {
if (typeof value === 'undefined') {
return this._progress
}
@@ -412,8 +444,9 @@ export default class PIXIApp extends PIXI.Application {
* @return {Modal} Returns the Modal object.
*/
modal(opts = {}) {
let modal = new Modal(Object.assign({ theme: this.theme }, opts, { app: this }))
let modal = new Modal(
Object.assign({ theme: this.theme }, opts, { app: this })
)
this.scene.addChild(modal)
return modal
@@ -426,8 +459,9 @@ export default class PIXIApp extends PIXI.Application {
* @return {Message} Returns the Message object.
*/
message(opts = {}) {
let message = new Message(Object.assign({ theme: this.theme }, opts, { app: this }))
let message = new Message(
Object.assign({ theme: this.theme }, opts, { app: this })
)
this.scene.addChild(message)
return message
@@ -446,21 +480,26 @@ export default class PIXIApp extends PIXI.Application {
* @param {boolean} [opts.progress=false] - Should a progress bar display the loading status?
* @return {PIXIApp} The PIXIApp object for chaining.
*/
loadSprites(resources, loaded = null, { resolutionDependent = true, progress = false } = {}) {
loadSprites(
resources,
loaded = null,
{ resolutionDependent = true, progress = false } = {}
) {
this.loadTextures(
resources,
textures => {
let sprites = new Map()
this.loadTextures(resources, textures => {
for (let [key, texture] of textures) {
sprites.set(key, new PIXI.Sprite(texture))
}
let sprites = new Map()
for (let [key, texture] of textures) {
sprites.set(key, new PIXI.Sprite(texture))
}
if (loaded) {
loaded.call(this, sprites)
}
}, { resolutionDependent, progress })
if (loaded) {
loaded.call(this, sprites)
}
},
{ resolutionDependent, progress }
)
return this
}
@@ -478,8 +517,11 @@ export default class PIXIApp extends PIXI.Application {
* @param {boolean} [opts.progress=false] - Should a progress bar display the loading status?
* @return {PIXIApp} The PIXIApp object for chaining.
*/
loadTextures(resources, loaded = null, { resolutionDependent = true, progress = false } = {}) {
loadTextures(
resources,
loaded = null,
{ resolutionDependent = true, progress = false } = {}
) {
if (!Array.isArray(resources)) {
resources = [resources]
}
@@ -487,17 +529,21 @@ export default class PIXIApp extends PIXI.Application {
const loader = this.loader
for (let resource of resources) {
if (!loader.resources[resource]) {
if (resolutionDependent) {
let resolution = Math.round(this.renderer.resolution)
switch (resolution) {
case 2:
loader.add(resource, resource.replace(/\.([^.]*)$/, '@2x.$1'))
loader.add(
resource,
resource.replace(/\.([^.]*)$/, '@2x.$1')
)
break
case 3:
loader.add(resource, resource.replace(/\.([^.]*)$/, '@3x.$1'))
loader.add(
resource,
resource.replace(/\.([^.]*)$/, '@3x.$1')
)
break
default:
loader.add(resource)
@@ -540,7 +586,6 @@ export default class PIXIApp extends PIXI.Application {
* rejected with an error.
*/
query(query, opts = {}) {
if (typeof query === 'string') {
opts = Object.assign({}, opts, { query })
} else {
@@ -572,7 +617,6 @@ export default class PIXIApp extends PIXI.Application {
* rejected with an error.
*/
mutate(mutation, opts = {}) {
if (typeof mutation === 'string') {
opts = Object.assign({}, opts, { mutation })
} else {
@@ -604,7 +648,6 @@ export default class PIXIApp extends PIXI.Application {
* rejected with an error.
*/
subscribe(subscription, opts = {}) {
if (typeof subscription === 'string') {
opts = Object.assign({}, opts, { subscription })
} else {
@@ -635,13 +678,13 @@ export default class PIXIApp extends PIXI.Application {
* @param {DisplayObject} displayObject - The PIXI displayObject.
* @param {number} x - The x coordinate.
* @param {number} y - The y coordinate.
*
*
* @return {PIXI.Point} Returns a PIXI.Point.
*/
convertPointFromPageToNode(displayObject, x, y) {
let resolution = this.renderer.resolution
console.log("resolution", resolution)
console.log('resolution', resolution)
let pixiGlobal = window.convertPointFromPageToNode(app.view, x, y)
pixiGlobal.x /= resolution
pixiGlobal.y /= resolution
@@ -655,7 +698,7 @@ export default class PIXIApp extends PIXI.Application {
* @param {DisplayObject} displayObject - The PIXI displayObject.
* @param {number} x - The x coordinate.
* @param {number} y - The y coordinate.
*
*
* @return {Point} Returns a DOM Point.
*/
@@ -665,7 +708,11 @@ export default class PIXIApp extends PIXI.Application {
pixiGlobal.x *= resolution
pixiGlobal.y *= resolution
// console.log("app.convertPointFromNodeToPage", pixiGlobal)
return window.convertPointFromNodeToPage(app.view, pixiGlobal.x, pixiGlobal.y)
return window.convertPointFromNodeToPage(
app.view,
pixiGlobal.x,
pixiGlobal.y
)
}
}
@@ -679,7 +726,6 @@ export default class PIXIApp extends PIXI.Application {
* @see {@link http://pixijs.download/dev/docs/PIXI.Graphics.html|PIXI.Graphics}
*/
class FpsDisplay extends PIXI.Graphics {
/**
* Creates an instance of a FpsDisplay.
*
@@ -687,25 +733,27 @@ class FpsDisplay extends PIXI.Graphics {
* @param {PIXIApp} app - The PIXIApp where the frames per second should be displayed.
*/
constructor(app) {
super()
this.app = app
this.lineStyle(3, 0x434f4f, 1)
.beginFill(0x434f4f, .6)
.beginFill(0x434f4f, 0.6)
.drawRoundedRect(0, 0, 68, 32, 5)
.endFill()
.position.set(20, 20)
this.text = new PIXI.Text(this.fps, new PIXI.TextStyle({
fontFamily: 'Arial',
fontSize: 14,
fontWeight: 'bold',
fill: '#f6f6f6',
stroke: '#434f4f',
strokeThickness: 3
}))
this.text = new PIXI.Text(
this.fps,
new PIXI.TextStyle({
fontFamily: 'Arial',
fontSize: 14,
fontWeight: 'bold',
fill: '#f6f6f6',
stroke: '#434f4f',
strokeThickness: 3
})
)
this.text.position.set(6, 6)
this.addChild(this.text)
@@ -721,7 +769,7 @@ class FpsDisplay extends PIXI.Graphics {
* @return {PIXIApp} Returns the PIXIApp object for chaining.
*/
refreshFps() {
this.text.text = `${(this.app.ticker.FPS).toFixed(1)} fps`
this.text.text = `${this.app.ticker.FPS.toFixed(1)} fps`
return this
}