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

Prevent dragging of button group if buttons are not wider than maxWidth.

Browse Source
This commit is contained in:
Sebastian Kupke 2019-08-07 15:24:18 +02:00
parent 56910a8c58
commit cdc6461064
3 changed files with 76 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
dist/iwmlib.pixi.js vendored
View File

@ -3378,18 +3378,21 @@
* @param {*} event
*/
onStart(event) {
this.__dragging = true;
this.capture(event);
if ((this.opts.maxWidth != null && this.__initWidth > this.opts.maxWidth) || (this.opts.maxHeight != null && this.__initHeight > this.opts.maxHeight)) {
this.__dragging = true;
this.__delta = {
x: this.container.position.x - event.data.global.x,
y: this.container.position.y - event.data.global.y
};
this.capture(event);
TweenLite.killTweensOf(this.container.position, { x: true, y: true });
if (typeof ThrowPropsPlugin != 'undefined') {
ThrowPropsPlugin.track(this.container.position, 'x,y');
this.__delta = {
x: this.container.position.x - event.data.global.x,
y: this.container.position.y - event.data.global.y
};
TweenLite.killTweensOf(this.container.position, { x: true, y: true });
if (typeof ThrowPropsPlugin != 'undefined') {
ThrowPropsPlugin.track(this.container.position, 'x,y');
}
}
}
@ -3484,25 +3487,28 @@
* @param {*} event
*/
onScroll(event) {
this.capture(event);
if (this.opts.orientation === 'horizontal') {
this.container.position.x -= event.deltaX;
if (this.container.position.x > 0) {
this.container.position.x = 0;
} else if (this.container.position.x + this.__initWidth < this.opts.maxWidth) {
this.container.position.x = this.opts.maxWidth - this.__initWidth;
}
} else {
this.container.position.y -= event.deltaY;
if (this.container.position.y > 0) {
this.container.position.y = 0;
} else if (this.container.position.y + this.container.height < this.opts.maxHeight) {
this.container.position.y = this.opts.maxHeight - this.container.height;
if ((this.opts.maxWidth != null && this.__initWidth > this.opts.maxWidth) || (this.opts.maxHeight != null && this.__initHeight > this.opts.maxHeight)) {
this.capture(event);
if (this.opts.orientation === 'horizontal') {
this.container.position.x -= event.deltaX;
if (this.container.position.x > 0) {
this.container.position.x = 0;
} else if (this.container.position.x + this.__initWidth < this.opts.maxWidth) {
this.container.position.x = this.opts.maxWidth - this.__initWidth;
}
} else {
this.container.position.y -= event.deltaY;
if (this.container.position.y > 0) {
this.container.position.y = 0;
} else if (this.container.position.y + this.container.height < this.opts.maxHeight) {
this.container.position.y = this.opts.maxHeight - this.container.height;
}
}
this.stack();
}
this.stack();
}
/**

16
lib/pixi/buttongroup.html
View File

@ -30,7 +30,7 @@
const app = new PIXIApp({
view: canvas,
width: 1000,
height: 1400
height: 1700
}).setup().run()
const buttonGroup1 = new ButtonGroup({
@ -324,12 +324,24 @@ const buttonGroup18 = new ButtonGroup({
app
})
const buttonGroup19 = new ButtonGroup({
x: 10,
y: 1420,
buttons: [
{label: 'move'},
{label: 'explanation dried'},
{label: 'out catch'}
],
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, buttonGroup18)
app.scene.addChild(buttonGroup14, buttonGroup15, buttonGroup16, buttonGroup17, buttonGroup18, buttonGroup19)
</script>
</body>
</html>

56
lib/pixi/buttongroup.js
View File

@ -440,18 +440,21 @@ export default class ButtonGroup extends PIXI.Container {
* @param {*} event
*/
onStart(event) {
this.__dragging = true
this.capture(event)
if ((this.opts.maxWidth != null && this.__initWidth > this.opts.maxWidth) || (this.opts.maxHeight != null && this.__initHeight > this.opts.maxHeight)) {
this.__dragging = true
this.__delta = {
x: this.container.position.x - event.data.global.x,
y: this.container.position.y - event.data.global.y
}
this.capture(event)
TweenLite.killTweensOf(this.container.position, { x: true, y: true })
if (typeof ThrowPropsPlugin != 'undefined') {
ThrowPropsPlugin.track(this.container.position, 'x,y')
this.__delta = {
x: this.container.position.x - event.data.global.x,
y: this.container.position.y - event.data.global.y
}
TweenLite.killTweensOf(this.container.position, { x: true, y: true })
if (typeof ThrowPropsPlugin != 'undefined') {
ThrowPropsPlugin.track(this.container.position, 'x,y')
}
}
}
@ -546,25 +549,28 @@ export default class ButtonGroup extends PIXI.Container {
* @param {*} event
*/
onScroll(event) {
this.capture(event)
if (this.opts.orientation === 'horizontal') {
this.container.position.x -= event.deltaX
if (this.container.position.x > 0) {
this.container.position.x = 0
} else if (this.container.position.x + this.__initWidth < this.opts.maxWidth) {
this.container.position.x = this.opts.maxWidth - this.__initWidth
}
} else {
this.container.position.y -= event.deltaY
if (this.container.position.y > 0) {
this.container.position.y = 0
} else if (this.container.position.y + this.container.height < this.opts.maxHeight) {
this.container.position.y = this.opts.maxHeight - this.container.height
if ((this.opts.maxWidth != null && this.__initWidth > this.opts.maxWidth) || (this.opts.maxHeight != null && this.__initHeight > this.opts.maxHeight)) {
this.capture(event)
if (this.opts.orientation === 'horizontal') {
this.container.position.x -= event.deltaX
if (this.container.position.x > 0) {
this.container.position.x = 0
} else if (this.container.position.x + this.__initWidth < this.opts.maxWidth) {
this.container.position.x = this.opts.maxWidth - this.__initWidth
}
} else {
this.container.position.y -= event.deltaY
if (this.container.position.y > 0) {
this.container.position.y = 0
} else if (this.container.position.y + this.container.height < this.opts.maxHeight) {
this.container.position.y = this.opts.maxHeight - this.container.height
}
}
this.stack()
}
this.stack()
}
/**