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

Merge branch 'master' of gitea.iwm-tuebingen.de:IWMBrowser/iwmlib

Browse Source
This commit is contained in:
Uwe Oestermeier
2019-08-01 19:34:49 +02:00
parent 488c1807d6 0182e9663e
commit 81e21736b7
73 changed files with 249 additions and 157 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/pixi/button.js
+13 -7
View File
@@ -252,13 +252,11 @@ export default class Button extends PIXI.Container {
this.capture(e)
})
this.button.on('pointerout', e => {
this.capture(e)
TweenLite.to([this.button, this.content], this.theme.fast, {
alpha: 1,
overwrite: 'none'
})
})
this.button.on('pointerout', this.onEnd.bind(this))
this.button.on('pointercancel', this.onEnd.bind(this))
this.button.on('pointerupoutside', this.onEnd.bind(this))
this.button.on('pointertap', this.onEnd.bind(this))
this.button.on('scroll', this.onEnd.bind(this))
// eslint-disable-next-line no-unused-vars
this.button.on('pointerdown', e => {
@@ -691,4 +689,12 @@ export default class Button extends PIXI.Container {
this.icon.tint = value
}
}
onEnd(event) {
this.capture(event)
TweenLite.to([this.button, this.content], this.theme.fast, {
alpha: 1,
overwrite: 'none'
})
}
}
lib/pixi/buttongroup.html
+23 -2
View File
@@ -10,7 +10,7 @@
<script src="../3rdparty/highlight/highlight.pack.js"></script>
<script src="../../dist/iwmlib.3rdparty.js"></script>
<!-- <script src="../3rdparty/gsap/src/uncompressed/plugins/ThrowPropsPlugin.js"></script> -->
<script src="../3rdparty/gsap/src/uncompressed/plugins/ThrowPropsPlugin.js"></script>
<script src="../../dist/iwmlib.js"></script>
<script src="../../dist/iwmlib.pixi.js"></script>
@@ -303,12 +303,33 @@ const buttonGroup17 = new ButtonGroup({
app
})
const buttonGroup18 = new ButtonGroup({
x: 10,
y: 1340,
buttons: [
{label: 'move'},
{label: 'explanation dried'},
{label: 'out catch'},
{label: 'late either'},
{label: 'tell pour'},
{label: 'willing apart airplane'},
{label: 'high war'},
{label: 'future struck'},
{label: 'sense image'},
{label: 'never'},
{label: 'mark cloth'},
{label: 'everywhere due large'}
],
maxWidth: 500,
app
})
app.scene.addChild(buttonGroup1, buttonGroup2, buttonGroup3)
app.scene.addChild(buttonGroup4)
app.scene.addChild(buttonGroup5, buttonGroup6)
app.scene.addChild(buttonGroup7, buttonGroup8)
app.scene.addChild(buttonGroup9, buttonGroup10, buttonGroup11, buttonGroup12, buttonGroup13)
app.scene.addChild(buttonGroup14, buttonGroup15, buttonGroup16, buttonGroup17)
app.scene.addChild(buttonGroup14, buttonGroup15, buttonGroup16, buttonGroup17, buttonGroup18)
</script>
</body>
</html>
lib/pixi/buttongroup.js
+40 -22
View File
@@ -556,7 +556,7 @@ export default class ButtonGroup extends PIXI.Container {
this.buttons.forEach((it, index) => {
const leftCorner = it.__originalPosition.x + this.container.x
const rightCorner = it.__originalPosition.x + it.width
const rightCorner = it.__originalPosition.x + it.button.width
const paddingLeft = index * this.opts.stackPadding
const paddingRight = reverseCounter * this.opts.stackPadding
if (leftCorner < paddingLeft) {
@@ -564,7 +564,7 @@ export default class ButtonGroup extends PIXI.Container {
it.x = -this.container.x + paddingLeft
} else if (rightCorner > -this.container.x + this.opts.maxWidth - paddingRight) {
// right border
it.x = -this.container.x + this.opts.maxWidth - it.width - paddingRight
it.x = -this.container.x + this.opts.maxWidth - it.button.width - paddingRight
} else {
it.x = it.__originalPosition.x
}
@@ -575,21 +575,30 @@ export default class ButtonGroup extends PIXI.Container {
})
const min = Math.min(...sorted.map(it => it.x))
const max = Math.max(...sorted.map(it => it.x))
const max = Math.max(...sorted.map(it => it.x + it.button.width))
const center = (min + max) / 2
// z-index
sorted
.sort((a, b) => {
const distanceA = Math.abs(a.x - center)
const distanceB = Math.abs(b.x - center)
if (distanceA < distanceB) {
return 1
} else if (distanceA > distanceB) {
return -1
} else {
return 0
const centerA = a.x + a.button.width / 2
const centerB = b.x + b.button.width / 2
if (centerA < center && centerB < center) {
if (a.x < b.x) {
return -1
} else if (b.x < a.x) {
return 1
}
} else if (centerA > center && centerB > center) {
if (a.x + a.button.width > b.x + b.button.width) {
return -1
} else if (b.x + b.button.width < a.x + a.button.x) {
return 1
}
}
return 0
})
.forEach(it => it.parent.addChild(it))
}
@@ -604,7 +613,7 @@ export default class ButtonGroup extends PIXI.Container {
this.buttons.forEach((it, index) => {
const topCorner = it.__originalPosition.y + this.container.y
const bottomCorner = it.__originalPosition.y + it.height
const bottomCorner = it.__originalPosition.y + it.button.height
const paddingTop = index * this.opts.stackPadding
const paddingBottom = reverseCounter * this.opts.stackPadding
if (topCorner < paddingTop) {
@@ -612,7 +621,7 @@ export default class ButtonGroup extends PIXI.Container {
it.y = -this.container.y + paddingTop
} else if (bottomCorner > -this.container.y + this.opts.maxHeight - paddingBottom) {
// bottom border
it.y = -this.container.y + this.opts.maxHeight - it.height - paddingBottom
it.y = -this.container.y + this.opts.maxHeight - it.button.height - paddingBottom
} else {
it.y = it.__originalPosition.y
}
@@ -623,21 +632,30 @@ export default class ButtonGroup extends PIXI.Container {
})
const min = Math.min(...sorted.map(it => it.y))
const max = Math.max(...sorted.map(it => it.y))
const max = Math.max(...sorted.map(it => it.y + it.button.height))
const center = (min + max) / 2
// z-index
sorted
.sort((a, b) => {
const distanceA = Math.abs(a.y - center)
const distanceB = Math.abs(b.y - center)
if (distanceA < distanceB) {
return 1
} else if (distanceA > distanceB) {
return -1
} else {
return 0
const centerA = a.y + a.button.height / 2
const centerB = b.y + b.button.height / 2
if (centerA < center && centerB < center) {
if (a.y < b.y) {
return -1
} else if (b.y < a.y) {
return 1
}
} else if (centerA > center && centerB > center) {
if (a.y + a.button.height > b.y + b.button.height) {
return -1
} else if (b.y + b.button.height < a.y + a.button.y) {
return 1
}
}
return 0
})
.forEach(it => it.parent.addChild(it))
}
lib/popup.js
+7 -3
View File
@@ -1,3 +1,6 @@
/* eslint-disable no-console */
/* eslint-disable no-case-declarations */
/* eslint-disable no-unused-vars */
import { Elements } from './utils.js'
import Poppable from './poppable.js'
@@ -181,6 +184,7 @@ export default class Popup extends Poppable {
}
for (let key in content) {
console.log('using', key, this.loaded)
switch (key) {
case 'selector':
break
@@ -289,7 +293,7 @@ export default class Popup extends Poppable {
handleClose(e) {
let closing = this.closingEvent(e)
if (closing) {
this.close()
this.close(e)
} else {
this.setupCloseHandler()
}
@@ -417,11 +421,11 @@ export default class Popup extends Poppable {
/** Close and remove the Popup from the DOM tree.
*/
close() {
close(event) {
//console.log("Popup.close", this.closeCommand)
this.unregister(this.context)
if (this.closeCommand) {
this.closeCommand(this, () => this.remove())
this.closeCommand(this, () => this.remove(), event)
} else {
this.remove()
}