diff --git a/dist/iwmlib.js b/dist/iwmlib.js
index 480b8b6..98d036b 100644
--- a/dist/iwmlib.js
+++ b/dist/iwmlib.js
@@ -4457,6 +4457,8 @@
DOMScatter$1.zIndex = 1000;
+ /* eslint-disable no-unused-vars */
+
class CardLoader {
constructor(
src,
@@ -4477,7 +4479,7 @@
this.x = x;
this.y = y;
this.scale = scale;
- this.rotation = 0;
+ this.rotation = rotation;
this.maxScale = maxScale;
this.minScale = minScale;
this.wantedWidth = width;
@@ -4485,12 +4487,6 @@
this.maxWidth = maxWidth != null ? maxWidth : window.innerWidth;
this.maxHeight = maxHeight != null ? maxHeight : window.innerHeight;
this.addedNode = null;
- console.log({
- width,
- height,
- maxWidth,
- maxHeight
- });
}
unload() {
@@ -4575,7 +4571,6 @@
return new Promise((resolve, reject) => {
let isFrame = domNode instanceof HTMLIFrameElement;
let iframe = isFrame ? domNode : document.createElement('iframe');
- console.log('FrameLoader.load', isFrame, iframe, this.src);
iframe.frameBorder = 0;
iframe.style.scrolling = false;
iframe.width = this.wantedWidth;
@@ -4602,14 +4597,9 @@
let xhr = new XMLHttpRequest();
xhr.open('GET', this.src, false);
xhr.onload = e => {
- domNode.innerHTML = xhr.response;
+ domNode.innerHTML = this.prepare(xhr.response);
this.addedNode = domNode.firstElementChild;
let { width, height } = this.size(this.addedNode);
- console.log('HTMLLoader.load', {
- added: this.addedNode,
- width,
- height
- });
if (width) this.wantedWidth = width || this.wantedWidth;
if (height) this.wantedHeight = height || this.wantedHeight;
resolve(this);
@@ -4621,6 +4611,18 @@
})
}
+ /**
+ * Preoares the html before it is assigned with innerHTML.
+ * Can be overwritten in subclasses.
+ *
+ * @param {*} html
+ * @returns
+ * @memberof HTMLLoader
+ */
+ prepare(html) {
+ return html
+ }
+
/**
* Tries to determine the size of the addedNode.
* Checks for explicit width and height style attributes.
@@ -4776,7 +4778,6 @@
}
setupFlippable(flippable, loader) {
- console.log('setupFlippable', loader.wantedWidth);
flippable.wantedWidth = loader.wantedWidth;
flippable.wantedHeight = loader.wantedHeight;
flippable.wantedScale = loader.scale;
@@ -4786,7 +4787,6 @@
}
start({ targetCenter = null } = {}) {
- console.log('DOMFlip.start', targetCenter);
if (this.preloadBack) {
this.flippable.start({ duration: this.flipDuration, targetCenter });
} else {
@@ -4936,7 +4936,6 @@
clickInfo() {
this.bringToFront();
- console.log('clickInfo');
this.infoBtn.click();
}
@@ -4963,6 +4962,7 @@
let startScale = this.element._gsTransform.scaleX;
let w = this.element.style.width;
let h = this.element.style.height;
+ // eslint-disable-next-line no-console
console.log(info, startX, startY, startAngle, startScale, w, h);
}
@@ -5032,14 +5032,12 @@
let y = this.flipped ? yy : this.startY;
let onUpdate = this.onUpdate !== null ? () => this.onUpdate(this) : null;
- console.log('start', this.flipDuration);
TweenLite.to(this.card, this.flipDuration, {
rotationY: targetY,
ease: Power1.easeOut,
transformOrigin: '50% 50%',
onUpdate,
onComplete: e => {
- console.log('start end', this.flipDuration);
if (this.flipped) {
//this.hide(this.front)
this.enable(this.backBtn);
@@ -5070,8 +5068,6 @@
},
force3D: true
});
-
- console.log('start 2', this.wantedWidth, this.startWidth, { w, h });
// See https://greensock.com/forums/topic/7997-rotate-the-shortest-way/
TweenLite.to(this.element, this.flipDuration / 2, {
scale: targetScale,
diff --git a/dist/iwmlib.pixi.js b/dist/iwmlib.pixi.js
index 52dc372..9af57e2 100644
--- a/dist/iwmlib.pixi.js
+++ b/dist/iwmlib.pixi.js
@@ -2569,34 +2569,12 @@
}
const badge = new Badge(opts);
-
- switch (opts.align) {
- case 'left':
- badge.x = this.x - badge.width / 2 + opts.offsetLeft;
- break
- case 'center':
- badge.x = this.x + this.width / 2 - badge.width / 2 + opts.offsetLeft;
- break
- case 'right':
- badge.x = this.x + this.width - badge.width / 2 + opts.offsetLeft;
- }
-
- switch (opts.verticalAlign) {
- case 'top':
- badge.y = this.y - badge.height / 2 + opts.offsetTop;
- break
- case 'middle':
- badge.y = this.y + this.height / 2 - badge.height / 2 + opts.offsetTop;
- break
- case 'bottom':
- badge.y = this.y + this.height - badge.height / 2 + opts.offsetTop;
- }
-
this.addChild(badge);
-
this.badge = badge;
}
+ this.layout();
+
// set position
//-----------------
this.position.set(this.opts.x, this.opts.y);
@@ -2681,6 +2659,40 @@
this.icon = icon;
+ // badge
+ //--------------------
+ if (this.badge) {
+
+ this.removeChild(this.badge);
+ const width = this.width;
+ const height = this.height;
+ this.addChild(this.badge);
+
+ const badge = this.badge;
+
+ switch (badge.opts.align) {
+ case 'left':
+ badge.x = -badge.width / 2 + badge.opts.offsetLeft;
+ break
+ case 'center':
+ badge.x = width / 2 - badge.width / 2 + badge.opts.offsetLeft;
+ break
+ case 'right':
+ badge.x = width - badge.width / 2 + badge.opts.offsetLeft;
+ }
+
+ switch (badge.opts.verticalAlign) {
+ case 'top':
+ badge.y = -badge.height / 2 + badge.opts.offsetTop;
+ break
+ case 'middle':
+ badge.y = height / 2 - badge.height / 2 + badge.opts.offsetTop;
+ break
+ case 'bottom':
+ badge.y = height - badge.height / 2 + badge.opts.offsetTop;
+ }
+ }
+
// draw
//-----------------
this.draw();
@@ -7859,6 +7871,8 @@
DOMScatter.zIndex = 1000;
+ /* eslint-disable no-unused-vars */
+
class CardLoader {
constructor(
src,
@@ -7879,7 +7893,7 @@
this.x = x;
this.y = y;
this.scale = scale;
- this.rotation = 0;
+ this.rotation = rotation;
this.maxScale = maxScale;
this.minScale = minScale;
this.wantedWidth = width;
@@ -7887,12 +7901,6 @@
this.maxWidth = maxWidth != null ? maxWidth : window.innerWidth;
this.maxHeight = maxHeight != null ? maxHeight : window.innerHeight;
this.addedNode = null;
- console.log({
- width,
- height,
- maxWidth,
- maxHeight
- });
}
unload() {
@@ -8042,7 +8050,6 @@
}
setupFlippable(flippable, loader) {
- console.log('setupFlippable', loader.wantedWidth);
flippable.wantedWidth = loader.wantedWidth;
flippable.wantedHeight = loader.wantedHeight;
flippable.wantedScale = loader.scale;
@@ -8052,7 +8059,6 @@
}
start({ targetCenter = null } = {}) {
- console.log('DOMFlip.start', targetCenter);
if (this.preloadBack) {
this.flippable.start({ duration: this.flipDuration, targetCenter });
} else {
@@ -8202,7 +8208,6 @@
clickInfo() {
this.bringToFront();
- console.log('clickInfo');
this.infoBtn.click();
}
@@ -8229,6 +8234,7 @@
let startScale = this.element._gsTransform.scaleX;
let w = this.element.style.width;
let h = this.element.style.height;
+ // eslint-disable-next-line no-console
console.log(info, startX, startY, startAngle, startScale, w, h);
}
@@ -8298,14 +8304,12 @@
let y = this.flipped ? yy : this.startY;
let onUpdate = this.onUpdate !== null ? () => this.onUpdate(this) : null;
- console.log('start', this.flipDuration);
TweenLite.to(this.card, this.flipDuration, {
rotationY: targetY,
ease: Power1.easeOut,
transformOrigin: '50% 50%',
onUpdate,
onComplete: e => {
- console.log('start end', this.flipDuration);
if (this.flipped) {
//this.hide(this.front)
this.enable(this.backBtn);
@@ -8336,8 +8340,6 @@
},
force3D: true
});
-
- console.log('start 2', this.wantedWidth, this.startWidth, { w, h });
// See https://greensock.com/forums/topic/7997-rotate-the-shortest-way/
TweenLite.to(this.element, this.flipDuration / 2, {
scale: targetScale,
diff --git a/doc/out/AbstractPopup.html b/doc/out/AbstractPopup.html
index 92e6fc2..53f6f81 100644
--- a/doc/out/AbstractPopup.html
+++ b/doc/out/AbstractPopup.html
@@ -2924,7 +2924,7 @@ a string, a number or a PIXI.Text object.
diff --git a/doc/out/Badge.html b/doc/out/Badge.html
index 9ca0a6d..94510bb 100644
--- a/doc/out/Badge.html
+++ b/doc/out/Badge.html
@@ -2380,7 +2380,7 @@ a string, a number or a PIXI.Text object.
diff --git a/doc/out/BlurFilter.html b/doc/out/BlurFilter.html
index e7d5fa4..0539813 100644
--- a/doc/out/BlurFilter.html
+++ b/doc/out/BlurFilter.html
@@ -1804,7 +1804,7 @@ app.scene.filters = [blurFilter]
diff --git a/doc/out/Button.html b/doc/out/Button.html
index c2f1b3d..31d6611 100644
--- a/doc/out/Button.html
+++ b/doc/out/Button.html
@@ -3505,7 +3505,7 @@ the tint property of the icon sprite.
@@ -3610,7 +3610,7 @@ the tint property of the icon sprite.
@@ -3715,7 +3715,7 @@ the tint property of the icon sprite.
@@ -3822,7 +3822,7 @@ the tint property of the icon sprite.
diff --git a/doc/out/ButtonGroup.html b/doc/out/ButtonGroup.html
index b627c1f..f083136 100644
--- a/doc/out/ButtonGroup.html
+++ b/doc/out/ButtonGroup.html
@@ -3800,7 +3800,7 @@ app.scene.addChild(buttonGroup)
diff --git a/doc/out/DeepZoomImage.html b/doc/out/DeepZoomImage.html
index ae386ce..ebe9906 100644
--- a/doc/out/DeepZoomImage.html
+++ b/doc/out/DeepZoomImage.html
@@ -5102,7 +5102,7 @@ i.e. after loading a single tile
diff --git a/doc/out/DeepZoomInfo.html b/doc/out/DeepZoomInfo.html
index 3e0eff4..f806fc5 100644
--- a/doc/out/DeepZoomInfo.html
+++ b/doc/out/DeepZoomInfo.html
@@ -2615,7 +2615,7 @@ on completion.
diff --git a/doc/out/Flippable.html b/doc/out/Flippable.html
index c6009df..0753009 100644
--- a/doc/out/Flippable.html
+++ b/doc/out/Flippable.html
@@ -2518,7 +2518,7 @@ front.on('click', event => flippable.toggle())
diff --git a/doc/out/FontInfo.html b/doc/out/FontInfo.html
index 9f41c13..7b323ed 100644
--- a/doc/out/FontInfo.html
+++ b/doc/out/FontInfo.html
@@ -1565,7 +1565,7 @@
diff --git a/doc/out/Hypenate.html b/doc/out/Hypenate.html
index b7fdafe..51d6c52 100644
--- a/doc/out/Hypenate.html
+++ b/doc/out/Hypenate.html
@@ -1767,7 +1767,7 @@
diff --git a/doc/out/InteractivePopup.html b/doc/out/InteractivePopup.html
index 7d462ec..3096cf2 100644
--- a/doc/out/InteractivePopup.html
+++ b/doc/out/InteractivePopup.html
@@ -2349,7 +2349,7 @@ a string, a number or a PIXI.Text object.
diff --git a/doc/out/LabeledGraphics.exports.LabeledGraphics.html b/doc/out/LabeledGraphics.exports.LabeledGraphics.html
index adfb475..ae30037 100644
--- a/doc/out/LabeledGraphics.exports.LabeledGraphics.html
+++ b/doc/out/LabeledGraphics.exports.LabeledGraphics.html
@@ -1567,7 +1567,7 @@
diff --git a/doc/out/LabeledGraphics.html b/doc/out/LabeledGraphics.html
index 391c734..6c3aade 100644
--- a/doc/out/LabeledGraphics.html
+++ b/doc/out/LabeledGraphics.html
@@ -2632,7 +2632,7 @@ than wanted
diff --git a/doc/out/List.html b/doc/out/List.html
index 25deaa3..471c0b0 100644
--- a/doc/out/List.html
+++ b/doc/out/List.html
@@ -2591,7 +2591,7 @@ app.scene.addChild(list)
diff --git a/doc/out/Message.html b/doc/out/Message.html
index 32ef279..1c0e719 100644
--- a/doc/out/Message.html
+++ b/doc/out/Message.html
@@ -2447,7 +2447,7 @@ a string, a number or a PIXI.Text object.
diff --git a/doc/out/MessageInteractivePopup.html b/doc/out/MessageInteractivePopup.html
index d8105de..8689cfd 100644
--- a/doc/out/MessageInteractivePopup.html
+++ b/doc/out/MessageInteractivePopup.html
@@ -1795,7 +1795,7 @@ like Popup, Message...
diff --git a/doc/out/MessageMessageInteractivePopup.html b/doc/out/MessageMessageInteractivePopup.html
index b18521c..dec2a0b 100644
--- a/doc/out/MessageMessageInteractivePopup.html
+++ b/doc/out/MessageMessageInteractivePopup.html
@@ -1795,7 +1795,7 @@ like Popup, Message...
diff --git a/doc/out/Modal.html b/doc/out/Modal.html
index d7c2d93..0e6181f 100644
--- a/doc/out/Modal.html
+++ b/doc/out/Modal.html
@@ -2348,7 +2348,7 @@ a string or a PIXI.Text object.
diff --git a/doc/out/ModalInteractivePopup.html b/doc/out/ModalInteractivePopup.html
index 9decd58..9096373 100644
--- a/doc/out/ModalInteractivePopup.html
+++ b/doc/out/ModalInteractivePopup.html
@@ -1795,7 +1795,7 @@ like Popup, Message...
diff --git a/doc/out/ModalModalInteractivePopup.html b/doc/out/ModalModalInteractivePopup.html
index 9d58b6e..468b05a 100644
--- a/doc/out/ModalModalInteractivePopup.html
+++ b/doc/out/ModalModalInteractivePopup.html
@@ -1795,7 +1795,7 @@ like Popup, Message...
diff --git a/doc/out/PIXIApp.html b/doc/out/PIXIApp.html
index ca1a6f5..343817c 100644
--- a/doc/out/PIXIApp.html
+++ b/doc/out/PIXIApp.html
@@ -5749,7 +5749,7 @@ rejected with an error.
diff --git a/doc/out/Popup.html b/doc/out/Popup.html
index 95072f7..b2bd7d1 100644
--- a/doc/out/Popup.html
+++ b/doc/out/Popup.html
@@ -2342,7 +2342,7 @@ a string, a number or a PIXI.Text object.
diff --git a/doc/out/PopupInteractivePopup.html b/doc/out/PopupInteractivePopup.html
index 290058a..0e42048 100644
--- a/doc/out/PopupInteractivePopup.html
+++ b/doc/out/PopupInteractivePopup.html
@@ -1795,7 +1795,7 @@ like Popup, Message...
diff --git a/doc/out/PopupMenu.html b/doc/out/PopupMenu.html
index a00f44f..06e683f 100644
--- a/doc/out/PopupMenu.html
+++ b/doc/out/PopupMenu.html
@@ -2396,7 +2396,7 @@ a string, a number or a PIXI.Text object.
diff --git a/doc/out/PopupMenuPopupInteractivePopup.html b/doc/out/PopupMenuPopupInteractivePopup.html
index ebff136..31edb4f 100644
--- a/doc/out/PopupMenuPopupInteractivePopup.html
+++ b/doc/out/PopupMenuPopupInteractivePopup.html
@@ -1795,7 +1795,7 @@ like Popup, Message...
diff --git a/doc/out/PopupMenuPopupMenuPopupInteractivePopup.html b/doc/out/PopupMenuPopupMenuPopupInteractivePopup.html
index 5ba9e22..462a88a 100644
--- a/doc/out/PopupMenuPopupMenuPopupInteractivePopup.html
+++ b/doc/out/PopupMenuPopupMenuPopupInteractivePopup.html
@@ -1795,7 +1795,7 @@ like Popup, Message...
diff --git a/doc/out/PopupMenuPopupMenuPopupPopupInteractivePopup.html b/doc/out/PopupMenuPopupMenuPopupPopupInteractivePopup.html
index a202c34..ea09a09 100644
--- a/doc/out/PopupMenuPopupMenuPopupPopupInteractivePopup.html
+++ b/doc/out/PopupMenuPopupMenuPopupPopupInteractivePopup.html
@@ -1795,7 +1795,7 @@ like Popup, Message...
diff --git a/doc/out/PopupMenuPopupPopupInteractivePopup.html b/doc/out/PopupMenuPopupPopupInteractivePopup.html
index 0b425ae..c18fe02 100644
--- a/doc/out/PopupMenuPopupPopupInteractivePopup.html
+++ b/doc/out/PopupMenuPopupPopupInteractivePopup.html
@@ -1795,7 +1795,7 @@ like Popup, Message...
diff --git a/doc/out/PopupPopupInteractivePopup.html b/doc/out/PopupPopupInteractivePopup.html
index 3d795e0..aafb5e2 100644
--- a/doc/out/PopupPopupInteractivePopup.html
+++ b/doc/out/PopupPopupInteractivePopup.html
@@ -1795,7 +1795,7 @@ like Popup, Message...
diff --git a/doc/out/Progress.html b/doc/out/Progress.html
index 76ffe52..d5675fb 100644
--- a/doc/out/Progress.html
+++ b/doc/out/Progress.html
@@ -2881,7 +2881,7 @@ app.scene.addChild(progress)
diff --git a/doc/out/Scrollview.html b/doc/out/Scrollview.html
index 917edcc..f0d2941 100644
--- a/doc/out/Scrollview.html
+++ b/doc/out/Scrollview.html
@@ -1713,7 +1713,7 @@ app.loader
diff --git a/doc/out/Slider.html b/doc/out/Slider.html
index f7a0519..8e248dc 100644
--- a/doc/out/Slider.html
+++ b/doc/out/Slider.html
@@ -2972,7 +2972,7 @@ app.scene.addChild(slider)
diff --git a/doc/out/Switch.html b/doc/out/Switch.html
index a39418a..2b4a44f 100644
--- a/doc/out/Switch.html
+++ b/doc/out/Switch.html
@@ -3402,7 +3402,7 @@ app.scene.addChild(switch1)
diff --git a/doc/out/TextLabel.TextLabel.html b/doc/out/TextLabel.TextLabel.html
index bda6c4f..f2a0cba 100644
--- a/doc/out/TextLabel.TextLabel.html
+++ b/doc/out/TextLabel.TextLabel.html
@@ -1696,7 +1696,7 @@
diff --git a/doc/out/Theme.html b/doc/out/Theme.html
index b35b789..2727b58 100644
--- a/doc/out/Theme.html
+++ b/doc/out/Theme.html
@@ -3171,7 +3171,7 @@ const app = new PIXIApp({
diff --git a/doc/out/ThemeDark.html b/doc/out/ThemeDark.html
index 34be186..7d52464 100644
--- a/doc/out/ThemeDark.html
+++ b/doc/out/ThemeDark.html
@@ -1592,7 +1592,7 @@ const app = new PIXIApp({
diff --git a/doc/out/ThemeLight.html b/doc/out/ThemeLight.html
index 2c43d69..4b99e10 100644
--- a/doc/out/ThemeLight.html
+++ b/doc/out/ThemeLight.html
@@ -1604,7 +1604,7 @@ const app = new PIXIApp({
diff --git a/doc/out/ThemeRed.html b/doc/out/ThemeRed.html
index f256719..c5c751d 100644
--- a/doc/out/ThemeRed.html
+++ b/doc/out/ThemeRed.html
@@ -1604,7 +1604,7 @@ const app = new PIXIApp({
diff --git a/doc/out/TileQuadNode.html b/doc/out/TileQuadNode.html
index 30e6b3b..ecf3e3a 100644
--- a/doc/out/TileQuadNode.html
+++ b/doc/out/TileQuadNode.html
@@ -2056,7 +2056,7 @@ an indicator of tiles to free.
diff --git a/doc/out/Tooltip.html b/doc/out/Tooltip.html
index a2d166a..294a4be 100644
--- a/doc/out/Tooltip.html
+++ b/doc/out/Tooltip.html
@@ -2518,7 +2518,7 @@ a string, a number or a PIXI.Text object.
diff --git a/doc/out/UITest.html b/doc/out/UITest.html
index e8bb23c..129fa96 100644
--- a/doc/out/UITest.html
+++ b/doc/out/UITest.html
@@ -4189,7 +4189,7 @@ test.start()
diff --git a/doc/out/Volatile.html b/doc/out/Volatile.html
index a155ce0..7bc122b 100644
--- a/doc/out/Volatile.html
+++ b/doc/out/Volatile.html
@@ -2105,7 +2105,7 @@ app.scene.addChild(button)
diff --git a/doc/out/global.html b/doc/out/global.html
index b60d478..76ab0c5 100644
--- a/doc/out/global.html
+++ b/doc/out/global.html
@@ -3326,7 +3326,7 @@
diff --git a/doc/out/index.html b/doc/out/index.html
index 9f15b12..0164d5c 100644
--- a/doc/out/index.html
+++ b/doc/out/index.html
@@ -1491,7 +1491,7 @@
diff --git a/doc/out/pixi_abstractpopup.js.html b/doc/out/pixi_abstractpopup.js.html
index 9e6648d..997facd 100644
--- a/doc/out/pixi_abstractpopup.js.html
+++ b/doc/out/pixi_abstractpopup.js.html
@@ -1814,7 +1814,7 @@ export default class AbstractPopup extends PIXI.Graphics {
diff --git a/doc/out/pixi_app.js.html b/doc/out/pixi_app.js.html
index 000577b..f6da038 100644
--- a/doc/out/pixi_app.js.html
+++ b/doc/out/pixi_app.js.html
@@ -2195,7 +2195,7 @@ class FpsDisplay extends PIXI.Graphics {
diff --git a/doc/out/pixi_badge.js.html b/doc/out/pixi_badge.js.html
index 132b317..99e9bea 100644
--- a/doc/out/pixi_badge.js.html
+++ b/doc/out/pixi_badge.js.html
@@ -1575,7 +1575,7 @@ export default class Badge extends AbstractPopup {
diff --git a/doc/out/pixi_blurfilter.js.html b/doc/out/pixi_blurfilter.js.html
index 1cf9b7b..ff4a158 100644
--- a/doc/out/pixi_blurfilter.js.html
+++ b/doc/out/pixi_blurfilter.js.html
@@ -1733,7 +1733,7 @@ class TiltShiftYFilter extends TiltShiftAxisFilter {
diff --git a/doc/out/pixi_button.js.html b/doc/out/pixi_button.js.html
index 106286e..16e0550 100644
--- a/doc/out/pixi_button.js.html
+++ b/doc/out/pixi_button.js.html
@@ -1791,34 +1791,12 @@ export default class Button extends PIXI.Container {
}
const badge = new Badge(opts)
-
- switch (opts.align) {
- case 'left':
- badge.x = this.x - badge.width / 2 + opts.offsetLeft
- break
- case 'center':
- badge.x = this.x + this.width / 2 - badge.width / 2 + opts.offsetLeft
- break
- case 'right':
- badge.x = this.x + this.width - badge.width / 2 + opts.offsetLeft
- }
-
- switch (opts.verticalAlign) {
- case 'top':
- badge.y = this.y - badge.height / 2 + opts.offsetTop
- break
- case 'middle':
- badge.y = this.y + this.height / 2 - badge.height / 2 + opts.offsetTop
- break
- case 'bottom':
- badge.y = this.y + this.height - badge.height / 2 + opts.offsetTop
- }
-
this.addChild(badge)
-
this.badge = badge
}
+ this.layout()
+
// set position
//-----------------
this.position.set(this.opts.x, this.opts.y)
@@ -1903,6 +1881,39 @@ export default class Button extends PIXI.Container {
this.icon = icon
+ // badge
+ //--------------------
+ if (this.badge) {
+ this.removeChild(this.badge)
+ const width = this.width
+ const height = this.height
+ this.addChild(this.badge)
+
+ const badge = this.badge
+
+ switch (badge.opts.align) {
+ case 'left':
+ badge.x = -badge.width / 2 + badge.opts.offsetLeft
+ break
+ case 'center':
+ badge.x = width / 2 - badge.width / 2 + badge.opts.offsetLeft
+ break
+ case 'right':
+ badge.x = width - badge.width / 2 + badge.opts.offsetLeft
+ }
+
+ switch (badge.opts.verticalAlign) {
+ case 'top':
+ badge.y = -badge.height / 2 + badge.opts.offsetTop
+ break
+ case 'middle':
+ badge.y = height / 2 - badge.height / 2 + badge.opts.offsetTop
+ break
+ case 'bottom':
+ badge.y = height - badge.height / 2 + badge.opts.offsetTop
+ }
+ }
+
// draw
//-----------------
this.draw()
@@ -2163,7 +2174,7 @@ export default class Button extends PIXI.Container {
diff --git a/doc/out/pixi_buttongroup.js.html b/doc/out/pixi_buttongroup.js.html
index 6d37fd8..5e154f5 100644
--- a/doc/out/pixi_buttongroup.js.html
+++ b/doc/out/pixi_buttongroup.js.html
@@ -2153,7 +2153,7 @@ export default class ButtonGroup extends PIXI.Container {
diff --git a/doc/out/pixi_deepzoom_image.js.html b/doc/out/pixi_deepzoom_image.js.html
index d87a3ac..2f0777b 100644
--- a/doc/out/pixi_deepzoom_image.js.html
+++ b/doc/out/pixi_deepzoom_image.js.html
@@ -2557,7 +2557,7 @@ export class DeepZoomImage extends PIXI.Container {
diff --git a/doc/out/pixi_flippable.js.html b/doc/out/pixi_flippable.js.html
index 12b1507..3b8792f 100644
--- a/doc/out/pixi_flippable.js.html
+++ b/doc/out/pixi_flippable.js.html
@@ -1912,7 +1912,7 @@ export default class Flippable extends PIXI.projection.Camera3d {
diff --git a/doc/out/pixi_labeledgraphics.js.html b/doc/out/pixi_labeledgraphics.js.html
index 9165ae0..67acfce 100644
--- a/doc/out/pixi_labeledgraphics.js.html
+++ b/doc/out/pixi_labeledgraphics.js.html
@@ -1861,7 +1861,7 @@ export class BitmapLabeledGraphics extends LabeledGraphics {
diff --git a/doc/out/pixi_list.js.html b/doc/out/pixi_list.js.html
index 6b57f8b..724d866 100644
--- a/doc/out/pixi_list.js.html
+++ b/doc/out/pixi_list.js.html
@@ -1840,7 +1840,7 @@ export default class List extends PIXI.Container {
diff --git a/doc/out/pixi_message.js.html b/doc/out/pixi_message.js.html
index 8571976..1c0f50d 100644
--- a/doc/out/pixi_message.js.html
+++ b/doc/out/pixi_message.js.html
@@ -1589,7 +1589,7 @@ export default class Message extends InteractivePopup {
diff --git a/doc/out/pixi_modal.js.html b/doc/out/pixi_modal.js.html
index f914c79..5258e05 100644
--- a/doc/out/pixi_modal.js.html
+++ b/doc/out/pixi_modal.js.html
@@ -1670,7 +1670,7 @@ export default class Modal extends PIXI.Container {
diff --git a/doc/out/pixi_popup.js.html b/doc/out/pixi_popup.js.html
index 3d21a7c..a735a45 100644
--- a/doc/out/pixi_popup.js.html
+++ b/doc/out/pixi_popup.js.html
@@ -1680,7 +1680,7 @@ export default class Popup extends InteractivePopup {
diff --git a/doc/out/pixi_popupmenu.js.html b/doc/out/pixi_popupmenu.js.html
index 2af7442..1f064b6 100644
--- a/doc/out/pixi_popupmenu.js.html
+++ b/doc/out/pixi_popupmenu.js.html
@@ -1583,7 +1583,7 @@ export default class PopupMenu extends Popup {
diff --git a/doc/out/pixi_progress.js.html b/doc/out/pixi_progress.js.html
index 06d0687..18c81e2 100644
--- a/doc/out/pixi_progress.js.html
+++ b/doc/out/pixi_progress.js.html
@@ -1765,7 +1765,7 @@ export default class Progress extends PIXI.Container {
diff --git a/doc/out/pixi_scrollview.js.html b/doc/out/pixi_scrollview.js.html
index 704a93c..4b0de8c 100644
--- a/doc/out/pixi_scrollview.js.html
+++ b/doc/out/pixi_scrollview.js.html
@@ -1524,7 +1524,7 @@ export default class Scrollview extends Scrollbox {
diff --git a/doc/out/pixi_slider.js.html b/doc/out/pixi_slider.js.html
index 9bdbc46..b29ae90 100644
--- a/doc/out/pixi_slider.js.html
+++ b/doc/out/pixi_slider.js.html
@@ -1929,7 +1929,7 @@ export default class Slider extends PIXI.Container {
diff --git a/doc/out/pixi_switch.js.html b/doc/out/pixi_switch.js.html
index 584883f..b21356f 100644
--- a/doc/out/pixi_switch.js.html
+++ b/doc/out/pixi_switch.js.html
@@ -1983,7 +1983,7 @@ export default class Switch extends PIXI.Container {
diff --git a/doc/out/pixi_theme.js.html b/doc/out/pixi_theme.js.html
index f916a8f..8bfa9b1 100644
--- a/doc/out/pixi_theme.js.html
+++ b/doc/out/pixi_theme.js.html
@@ -1724,7 +1724,7 @@ export class ThemeRed extends Theme {
diff --git a/doc/out/pixi_tooltip.js.html b/doc/out/pixi_tooltip.js.html
index 394d4da..886be01 100644
--- a/doc/out/pixi_tooltip.js.html
+++ b/doc/out/pixi_tooltip.js.html
@@ -1617,7 +1617,7 @@ export default class Tooltip extends AbstractPopup {
diff --git a/doc/out/pixi_volatile.js.html b/doc/out/pixi_volatile.js.html
index 802fd2f..aa9652d 100644
--- a/doc/out/pixi_volatile.js.html
+++ b/doc/out/pixi_volatile.js.html
@@ -1621,7 +1621,7 @@ export default class Volatile {
diff --git a/doc/out/uitest.js.html b/doc/out/uitest.js.html
index a57fd9e..6b96098 100644
--- a/doc/out/uitest.js.html
+++ b/doc/out/uitest.js.html
@@ -2472,7 +2472,7 @@ class Event {
diff --git a/lib/pixi/button.html b/lib/pixi/button.html
index d478174..4286b4c 100644
--- a/lib/pixi/button.html
+++ b/lib/pixi/button.html
@@ -289,13 +289,33 @@ const button24 = new Button({
}
})
+const button25 = new Button({
+ x: 300,
+ y: 460,
+ icon: 'add',
+ badge: {
+ content: 'Click the button',
+ align: 'center',
+ verticalAlign: 'top',
+ offsetTop: -20,
+ radius: 12,
+ fill: 0x5856d6
+ },
+ action: event => {
+ const countries = ['Tajikistan', 'Zambia', 'Dominica', 'Australia', 'Botswana', 'Mozambique', 'Lesotho', 'Thailand', 'Gabon', 'Cuba', 'Mexico', 'Central African Republic', 'Réunion', 'Montenegro', 'Romania', 'Jamaica', 'Thailand', 'Cameroon', 'French Guiana', 'Nigeria', 'Tokelau', 'Slovenia', 'Kuwait', 'Palestinian Territories', 'Estonia', 'Germany', 'Cameroon', 'Somalia', 'El Salvador', 'San Marino', 'Sierra Leone', 'Sierra Leone', 'Gibraltar', 'Benin', 'Russia', 'Iraq', 'Tunisia', 'Greenland', 'Côte d\'Ivoire', 'Tanzania', 'Zambia', 'Bermuda', 'Somalia', 'Malaysia', 'Croatia', 'Togo', 'Belgium', 'Uruguay', 'Equatorial Guinea', 'Nigeria', 'St. Martin', 'Tuvalu', 'South Africa', 'Hong Kong SAR China', 'Palau', 'Canary Islands', 'Algeria', 'Hong Kong SAR China', 'Brunei', 'Dominican Republic', 'Sierra Leone', 'Moldova', 'Indonesia', 'Central African Republic', 'Anguilla', 'Malaysia', 'Bahrain', 'Indonesia', 'Peru', 'Namibia', 'Congo - Brazzaville', 'Micronesia', 'Cambodia', 'Réunion', 'Honduras', 'Hungary', 'Brazil', 'Trinidad & Tobago', 'Hungary', 'Madagascar', 'Sierra Leone', 'Seychelles', 'St. Martin', 'New Caledonia', 'Tokelau', 'Macedonia', 'Netherlands', 'Panama', 'Venezuela', 'Nepal', 'Guernsey', 'Papua New Guinea', 'Finland', 'Malaysia', 'Hong Kong SAR China', 'Trinidad & Tobago', 'Montserrat', 'Comoros', 'Benin', 'South Korea', 'Peru', 'Botswana', 'Cambodia', 'Isle of Man', 'Mozambique']
+ const country = countries[Math.floor(Math.random() * countries.length)]
+ button25.badge.content = country
+ button25.layout()
+ }
+})
+
app.scene.addChild(button1, button2, button3, button4, button5, button6)
app.scene.addChild(button7, button8)
app.scene.addChild(button9, button10, button11)
app.scene.addChild(button12, button13)
app.scene.addChild(button14, button15, button16, button17)
app.scene.addChild(button18, button19, button20, button21)
-app.scene.addChild(button22, button23, button24)
+app.scene.addChild(button22, button23, button24, button25)