From e2ea89cc0b3f35be32f628055faa1b09d7d0a45f Mon Sep 17 00:00:00 2001 From: Sebastian Kupke Date: Tue, 15 Oct 2019 14:56:24 +0200 Subject: [PATCH] Added textAlpha and textActiveAlpha to Button and ButtonGroup. --- dist/iwmlib.js | 133 +++++++++--------- dist/iwmlib.pixi.js | 29 ++-- doc/out/AbstractPopup.html | 2 +- doc/out/Badge.html | 2 +- doc/out/BlurFilter.html | 2 +- doc/out/Button.html | 84 ++++++++++- doc/out/ButtonGroup.html | 84 ++++++++++- doc/out/DeepZoomImage.html | 2 +- doc/out/DeepZoomInfo.html | 2 +- doc/out/Flippable.html | 2 +- doc/out/FontInfo.html | 2 +- doc/out/Hypenate.html | 2 +- doc/out/InteractivePopup.html | 2 +- ...beledGraphics.exports.LabeledGraphics.html | 2 +- doc/out/LabeledGraphics.html | 2 +- doc/out/List.html | 2 +- doc/out/Message.html | 2 +- doc/out/MessageInteractivePopup.html | 2 +- doc/out/MessageMessageInteractivePopup.html | 2 +- doc/out/Modal.html | 2 +- doc/out/ModalInteractivePopup.html | 2 +- doc/out/ModalModalInteractivePopup.html | 2 +- doc/out/PIXIApp.html | 2 +- doc/out/Popup.html | 2 +- doc/out/PopupInteractivePopup.html | 2 +- doc/out/PopupMenu.html | 2 +- doc/out/PopupMenuPopupInteractivePopup.html | 2 +- ...pupMenuPopupMenuPopupInteractivePopup.html | 2 +- ...nuPopupMenuPopupPopupInteractivePopup.html | 2 +- .../PopupMenuPopupPopupInteractivePopup.html | 2 +- doc/out/PopupPopupInteractivePopup.html | 2 +- doc/out/Progress.html | 2 +- doc/out/Scrollview.html | 2 +- doc/out/Slider.html | 2 +- doc/out/Switch.html | 2 +- doc/out/TextLabel.TextLabel.html | 2 +- doc/out/Theme.html | 78 +++++++++- doc/out/ThemeDark.html | 4 +- doc/out/ThemeLight.html | 4 +- doc/out/ThemeRed.html | 4 +- doc/out/TileQuadNode.html | 2 +- doc/out/Tooltip.html | 2 +- doc/out/UITest.html | 2 +- doc/out/Volatile.html | 2 +- doc/out/global.html | 2 +- doc/out/index.html | 2 +- doc/out/pixi_abstractpopup.js.html | 2 +- doc/out/pixi_app.js.html | 2 +- doc/out/pixi_badge.js.html | 2 +- doc/out/pixi_blurfilter.js.html | 2 +- doc/out/pixi_button.js.html | 8 +- doc/out/pixi_buttongroup.js.html | 8 +- doc/out/pixi_deepzoom_image.js.html | 2 +- doc/out/pixi_flippable.js.html | 2 +- doc/out/pixi_labeledgraphics.js.html | 2 +- doc/out/pixi_list.js.html | 2 +- doc/out/pixi_message.js.html | 2 +- doc/out/pixi_modal.js.html | 2 +- doc/out/pixi_popup.js.html | 2 +- doc/out/pixi_popupmenu.js.html | 2 +- doc/out/pixi_progress.js.html | 2 +- doc/out/pixi_scrollview.js.html | 2 +- doc/out/pixi_slider.js.html | 2 +- doc/out/pixi_switch.js.html | 2 +- doc/out/pixi_theme.js.html | 6 +- doc/out/pixi_tooltip.js.html | 2 +- doc/out/pixi_volatile.js.html | 2 +- doc/out/uitest.js.html | 2 +- lib/pixi/button.html | 4 +- lib/pixi/button.js | 6 + lib/pixi/buttongroup.html | 25 ++++ lib/pixi/buttongroup.js | 6 + lib/pixi/theme.js | 4 + 73 files changed, 440 insertions(+), 161 deletions(-) diff --git a/dist/iwmlib.js b/dist/iwmlib.js index 55f6414..4d2024d 100644 --- a/dist/iwmlib.js +++ b/dist/iwmlib.js @@ -508,19 +508,6 @@ static toLine(event) { return `${event.type} #${event.target.id} ${event.clientX} ${event.clientY}` - let result = event.type; - let selector = this.selector(event.target); - result += ' selector: ' + selector; - if (event.target != document.querySelector(selector)) console.log('Cannot resolve', selector); - let keys = ['layerX', 'layerY', 'pageX', 'pageY', 'clientX', 'clientY']; - for (let key of keys) { - try { - result += ' ' + key + ':' + event[key]; - } catch (e) { - console.log('Invalid key: ' + key); - } - } - return result } static compareExtractedWithSimulated() { @@ -8245,7 +8232,7 @@ */ class Card { static setup(context, modules = []) { - console.log('Setup Card...', modules); + if (this.debug) console.log('Setup Card...', modules); /** * This is required for the callback functions to work properly. @@ -8269,28 +8256,55 @@ }); } + /** + * Removes the context and all registered components of the card. + * + * @static + * @param {DOMElement} context - The DOMElement representing the card. + * @memberof Card + */ static remove(context) { + //Remove all modules that are registered to the context. for (let module of Object.values(context.module)) { const moduleHasRemoveFunction = typeof module.remove === 'function'; - if (moduleHasRemoveFunction) module.remove(); + if (moduleHasRemoveFunction) { + module.remove(); + } + } + + // Remove the context itself. + if (context.parentNode != null) { + context.parentNode.removeChild(context); + } else { + console.warn('Tried removing card but it has already been removed.'); } } + /** + * Closes the card when an event happens on the card. + * Either the card is removed or the onClose callback is called. + * + * NOTE: Make sure to remove the card manually, when using the onClose callback! + * + * INFO: I just revisited this function and was wondering, why it takes the event as + * parameter instead of the context. The problem is that the card template defines + * the functions inside the HTML. When loaded, the HTML attributes need to be adjusted + * and the functions are overwritten. Using during the post processing step withing the postProcessResponseText function. + * + * @static + * @param {Event} event - event triggered on the car + * @memberof Card + */ static close(event) { let context = this.getContext(event.target); - if (context.onClose != null) { - context.onClose(); - } else { - this.remove(context); + if (context) { + if (context.onClose != null) { + context.onClose(); + } else { + this.remove(context); + } } - - // console.error("Remove") - // let context = this.getContext(event.target) - - // if (context) { - // this.remove(context) - // } else console.error('Could not find context!', event.target) } /** @@ -8324,21 +8338,6 @@ context.onClose = null; } - /** - * - * - * @static - * @param {*} event - * @memberof Card - */ - static remove(context) { - if (context.parentNode != null) { - context.parentNode.removeChild(context); - } else { - console.error('Tried removing card but it was already removed.'); - } - } - /** * Replaces a set of attributes using a provided function. * @@ -8462,7 +8461,7 @@ */ return html.replace( /<\s*(a|video|img|image|circle)\s(.*?)(xlink:href|href|src)\s*=\s*["'](\..*?)["']\s*(.*?)>/g, - function(data) { + function() { let path = that._getRelativePath(arguments[4]); const tag = `<${arguments[1]} ${arguments[2]} ${arguments[3]}="${path}" ${arguments[5]}>`; /* if (that.debug) */ console.log('Adjusted: ', tag); @@ -8719,7 +8718,7 @@ popup.placeAt(position); - InteractionMapper.on(this.interactionType, popup.element, e => { + InteractionMapper.on(this.interactionType, popup.element, () => { this._cleanup(context); }); @@ -8736,6 +8735,9 @@ return promise } + /** + * LEGACY but this may be required still for the editor + */ static _overlayCleanup(context, overlay) { /** * The cleanup functionality is now covered by the _cleanup function. @@ -8890,7 +8892,7 @@ */ static _activateCorrespondingHighlights(context, node, parent) { let highlightId = node.getAttribute('data-highlight-id'); - // console.log("Request Highlight: " + highlightId) + if (this.debug) console.log('Request Highlight: ' + highlightId); let correspondingHighlights = []; if (highlightId) { @@ -8946,7 +8948,7 @@ } static _calculateCenterRelativeTo(target, image) { - console.log('_calculateCenterRelativeTo', target, image); + // console.log('_calculateCenterRelativeTo', target, image) let bbox = image.getBBox(); let width = bbox.width; let height = bbox.height; @@ -8957,7 +8959,7 @@ let x = cx.endsWith('%') ? (parseFloat(cx) / 100) * width : cx; let y = cy.endsWith('%') ? (parseFloat(cy) / 100) * height : cx; - console.log({ x, y, width, height, radius }); + // console.log({ x, y, width, height, radius }) return { x, y } } @@ -9004,8 +9006,6 @@ let radius = parseFloat(node.getAttribute('r')); let svgRoot = node.closest('svg'); - let image = svgRoot.querySelector('image'); - //let position = Card._calculateCenterRelativeTo(node, image) /* As the popup is appended directly to the card. We have to @@ -9036,7 +9036,7 @@ .then(content => { this._openPopup(context, src, local, content, { highlight: node, - closeCommand: (popup, callback) => { + closeCommand: popup => { this._overlayCleanup(context, overlay); popup.remove(); } @@ -9071,7 +9071,7 @@ let content = { html: html.body.innerHTML, selector }; resolve(content); } else { - reject(` Popup request failed (Code: ${xhr.status}): Could not load resource: ${src}`); + reject(` Popup request failed (Code: ${xhr.status}): Could not load resource: ${source}`); } } }; @@ -9247,7 +9247,7 @@ // It's just an indicator that an action is possible. The click must be // captured from the whole subcard. - InteractionMapper.on(this.interactionType, zoomedFig, event => { + InteractionMapper.on(this.interactionType, zoomedFig, () => { this._cleanup(wrapper); }); @@ -9363,7 +9363,7 @@ iconClone.src = iconClone.src.replace('info.svg', 'close.svg'); iconClone.style.zIndex = 1000; iconClone.classList.add('zoomed-icon'); - iconClone.onclick = event => { + iconClone.onclick = () => { zoomIcon.style.display = savedDisplay; iconClone.remove(); zoomIcon.setAttribute('onclick', savedOnClick); @@ -9401,7 +9401,7 @@ } } }; - zoomable.onmouseup = event => { + zoomable.onmouseup = () => { zoomable.dragging = false; }; @@ -9511,7 +9511,7 @@ /* Removes the 'default' cleanup on the card */ clone.removeAttribute('onclick'); - InteractionMapper.on(this.interactionType, clone, event => { + InteractionMapper.on(this.interactionType, clone, () => { this._cleanup(context); }); @@ -9561,7 +9561,6 @@ }; if (this.dynamicHeight) { - let targetHeight = subcardContent.offsetHeight; subcardContent.classList.add('dynamic-height'); /** * Scale the content from 100% to it's target size. @@ -9569,6 +9568,8 @@ // TweenLite.set(subcardContent, { // height: "100%" // }) + // + // let targetHeight = subcardContent.offsetHeight // TweenLite.to(subcardContent, Card.animation.articleTransition, { // height: targetHeight + "px" // }) @@ -9641,7 +9642,6 @@ if (iconClone.tagName == 'img') { iconClone.src = iconClone.src.replace('info.svg', 'close.svg'); } - //console.log("ICON: ", iconClone) iconClone.classList.remove('info'); iconClone.classList.add('close', 'view-button', 'transparent-background'); @@ -9694,7 +9694,7 @@ clonedSubcard, clonedArticle, - { eventElements = [], src = null } = [] + { src = null } = [] ) { let indexbox = context.querySelector('.mainview'); let padding = parseInt(this.css(indexbox, 'padding')); @@ -9717,7 +9717,7 @@ let strparts = src.split('/'); let cardID = strparts[strparts.length - 2]; let cardName = strparts[strparts.length - 1]; - strparts = card.className.split(' '); + strparts = context.className.split(' '); let cardType = strparts[1]; let msg = 'Card: ' + cardID + ': closeTopic: ' + cardType + ', ' + cardName; console.log('Logging:', msg); @@ -9746,9 +9746,10 @@ }; if (this.dynamicHeight) { - TweenLite.to(subcardContent, this.animation.articleTransition, { - height: '100%' - }); + console.error('Dynamic height is not implemented yet.'); + // TweenLite.to(subcardContent, this.animation.articleTransition, { + // height: '100%' + // }) } let maxWidth = this.css(subcard, 'max-width'); @@ -9829,14 +9830,14 @@ * @memberof Card */ static openIndexCard(event, src) { - console.log('openIndexCard', src); + if (this.debug) console.log('openIndexCard', src); /* * Called by the expandIndexCard(...) */ let target = event.target; const saveCallback = url => { let handler = `Card.openIndexCard(event, '${url}')`; - console.log('File has changed', target, handler); + if (this.debug) console.log('File has changed', target, handler); //TODO If this is required, it should be accessing the interaction type. target.setAttribute('onclick', handler); @@ -10192,7 +10193,7 @@ } static _subcardChanged(context, closed = false) { - for (let [key, module] of Object.entries(context.module)) { + for (let module of Object.values(context.module)) { if (module.subcardChanged) { module.subcardChanged(closed); } @@ -10249,7 +10250,7 @@ } /** - * Unregisters all events on the infocard. + * Unregister all events on the infocard. * * * @static @@ -10263,7 +10264,7 @@ } Card.id = 0; - Card.debug = true; + Card.debug = false; Card._relativePath = ''; Card.scatterContainer = null; Card.interactionType = 'tap'; diff --git a/dist/iwmlib.pixi.js b/dist/iwmlib.pixi.js index 09cd33d..f255d3c 100644 --- a/dist/iwmlib.pixi.js +++ b/dist/iwmlib.pixi.js @@ -81,6 +81,8 @@ * large text. * @param {object} [opts.textStyleLargeActive=textStyleLarge + {fill: primaryColor}] - A textstyle object which * is used for large actived text. + * @param {number} [opts.textAlpha=Theme.textAlpha] - The alpha value of text. + * @param {number} [opts.textActiveAlpha=Theme.textActiveAlpha] - The alpha value of text when activated. */ constructor(opts = {}) { const colorPrimary = opts.primaryColor != null ? opts.primaryColor : 0x5ec7f8; // blue @@ -109,6 +111,8 @@ strokeActive: color2, strokeActiveWidth: 0.6, strokeActiveAlpha: 1, + textAlpha: 1, + textActiveAlpha: 1, iconColor: color2, iconColorActive: colorPrimary, background: color1 @@ -1331,19 +1335,6 @@ static toLine(event) { return `${event.type} #${event.target.id} ${event.clientX} ${event.clientY}` - let result = event.type; - let selector = this.selector(event.target); - result += ' selector: ' + selector; - if (event.target != document.querySelector(selector)) console.log('Cannot resolve', selector); - let keys = ['layerX', 'layerY', 'pageX', 'pageY', 'clientX', 'clientY']; - for (let key of keys) { - try { - result += ' ' + key + ':' + event[key]; - } catch (e) { - console.log('Invalid key: ' + key); - } - } - return result } static compareExtractedWithSimulated() { @@ -2311,6 +2302,8 @@ * for possible options. * @param {number} [opts.textStyleActive=Theme.textStyleActive] - A textstyle object for the styling of the label when the * button is activated. See PIXI.TextStyle for possible options. + * @param {number} [opts.textAlpha=Theme.textAlpha] - The alpha value of the text. + * @param {number} [opts.textActiveAlpha=Theme.textActiveAlpha] - The alpha value of the text when activated. * @param {string} [opts.style=default] - A shortcut for styling options. Possible values are default, link. * @param {number} [opts.radius=Theme.radius] - The radius of the four corners of the button (which is a rounded rectangle). * @param {boolean} [opts.disabled=false] - Is the button disabled? When disabled, the button has a lower alpha value @@ -2368,6 +2361,8 @@ strokeActiveAlpha: theme.strokeActiveAlpha, textStyle: {}, textStyleActive: {}, + textAlpha: theme.textAlpha, + textActiveAlpha: theme.textActiveAlpha, style: 'default', radius: theme.radius, disabled: false, @@ -2796,10 +2791,12 @@ if (this._active) { if (this.text) { this.text.style = this.opts.textStyleActive; + this.text.alpha = this.opts.textActiveAlpha; } } else { if (this.text) { this.text.style = this.opts.textStyle; + this.text.alpha = this.opts.textAlpha; } } @@ -3006,6 +3003,8 @@ * for possible options. * @param {number} [opts.textStyleActive=Theme.textStyleActive] - Button: A textstyle object for the styling of the label when the * button is activated. See PIXI.TextStyle for possible options. + * @param {number} [opts.textAlpha=Theme.textAlpha] - Button: The alpha value of the text. + * @param {number} [opts.textActiveAlpha=Theme.textActiveAlpha] - Button: The alpha value of the text when activated. * @param {string} [opts.style=default] - A shortcut for styling options. Possible values are default, link. * @param {number} [opts.radius=Theme.radius] - Button: The radius of the four corners of the button (which is a rounded rectangle). * @param {boolean} [opts.disabled=false] - Is the button group disabled? When disabled, the button group has a lower alpha value @@ -3056,6 +3055,8 @@ strokeActiveAlpha: theme.strokeActiveAlpha, textStyle: {}, textStyleActive: {}, + textAlpha: theme.textAlpha, + textActiveAlpha: theme.textActiveAlpha, style: 'default', radius: theme.radius, disabled: null, @@ -3134,6 +3135,8 @@ it.strokeActiveAlpha = it.strokeActiveAlpha != null ? it.strokeActiveAlpha : this.opts.strokeActiveAlpha; it.textStyle = it.textStyle || this.opts.textStyle; it.textStyleActive = it.textStyleActive || this.opts.textStyleActive; + it.textAlpha = it.textAlpha != null ? it.textAlpha : this.opts.textAlpha; + it.textActiveAlpha = it.textActiveAlpha != null ? it.textActiveAlpha : this.opts.textActiveAlpha; it.style = it.style || this.opts.style; it.radius = it.radius != null ? it.radius : this.opts.radius; if (!it.type) { diff --git a/doc/out/AbstractPopup.html b/doc/out/AbstractPopup.html index 072ec74..952c4f8 100644 --- a/doc/out/AbstractPopup.html +++ b/doc/out/AbstractPopup.html @@ -2918,7 +2918,7 @@ a string, a number or a PIXI.Text object.

diff --git a/doc/out/Badge.html b/doc/out/Badge.html index 66ee8ff..1429c70 100644 --- a/doc/out/Badge.html +++ b/doc/out/Badge.html @@ -2374,7 +2374,7 @@ a string, a number or a PIXI.Text object.

diff --git a/doc/out/BlurFilter.html b/doc/out/BlurFilter.html index 5cb0e61..7dccb87 100644 --- a/doc/out/BlurFilter.html +++ b/doc/out/BlurFilter.html @@ -1798,7 +1798,7 @@ app.scene.filters = [blurFilter] diff --git a/doc/out/Button.html b/doc/out/Button.html index a4569c1..269d87b 100644 --- a/doc/out/Button.html +++ b/doc/out/Button.html @@ -1471,7 +1471,7 @@
- button.js:110 + button.js:112
@@ -2467,6 +2467,78 @@ button is activated. See PIXI.TextStyle for possible options.

+ + + textAlpha + + + + + +number + + + + + + + + + Theme.textAlpha + + + + + + + + optional + + + + + +

The alpha value of the text.

+ + + + + + + textActiveAlpha + + + + + +number + + + + + + + + + Theme.textActiveAlpha + + + + + + + + optional + + + + + +

The alpha value of the text when activated.

+ + + + style @@ -3375,7 +3447,7 @@ the tint property of the icon sprite.

- button.js:207 + button.js:211
@@ -3499,7 +3571,7 @@ the tint property of the icon sprite.

- button.js:636 + button.js:642
@@ -3604,7 +3676,7 @@ the tint property of the icon sprite.

- button.js:365 + button.js:369
@@ -3709,7 +3781,7 @@ the tint property of the icon sprite.

- button.js:620 + button.js:626
@@ -3816,7 +3888,7 @@ the tint property of the icon sprite.

diff --git a/doc/out/ButtonGroup.html b/doc/out/ButtonGroup.html index df749cb..364838e 100644 --- a/doc/out/ButtonGroup.html +++ b/doc/out/ButtonGroup.html @@ -1471,7 +1471,7 @@
- buttongroup.js:84 + buttongroup.js:86
@@ -2571,6 +2571,78 @@ button is activated. See PIXI.TextStyle for possible options.

+ + + textAlpha + + + + + +number + + + + + + + + + Theme.textAlpha + + + + + + + + optional + + + + + +

Button: The alpha value of the text.

+ + + + + + + textActiveAlpha + + + + + +number + + + + + + + + + Theme.textActiveAlpha + + + + + + + + optional + + + + + +

Button: The alpha value of the text when activated.

+ + + + style @@ -3137,7 +3209,7 @@ app.scene.addChild(buttonGroup)
- buttongroup.js:590 + buttongroup.js:596
@@ -3261,7 +3333,7 @@ app.scene.addChild(buttonGroup)
- buttongroup.js:436 + buttongroup.js:442
@@ -3366,7 +3438,7 @@ app.scene.addChild(buttonGroup)
- buttongroup.js:311 + buttongroup.js:317
@@ -3471,7 +3543,7 @@ app.scene.addChild(buttonGroup)
- buttongroup.js:425 + buttongroup.js:431
@@ -3578,7 +3650,7 @@ app.scene.addChild(buttonGroup) diff --git a/doc/out/DeepZoomImage.html b/doc/out/DeepZoomImage.html index fe3380f..9ce1772 100644 --- a/doc/out/DeepZoomImage.html +++ b/doc/out/DeepZoomImage.html @@ -5096,7 +5096,7 @@ i.e. after loading a single tile

diff --git a/doc/out/DeepZoomInfo.html b/doc/out/DeepZoomInfo.html index cfce512..2604e01 100644 --- a/doc/out/DeepZoomInfo.html +++ b/doc/out/DeepZoomInfo.html @@ -2609,7 +2609,7 @@ on completion.

diff --git a/doc/out/Flippable.html b/doc/out/Flippable.html index 717337d..a42d993 100644 --- a/doc/out/Flippable.html +++ b/doc/out/Flippable.html @@ -2512,7 +2512,7 @@ front.on('click', event => flippable.toggle()) diff --git a/doc/out/FontInfo.html b/doc/out/FontInfo.html index a05cce5..9d53ea8 100644 --- a/doc/out/FontInfo.html +++ b/doc/out/FontInfo.html @@ -1559,7 +1559,7 @@ diff --git a/doc/out/Hypenate.html b/doc/out/Hypenate.html index 2afb923..2f42111 100644 --- a/doc/out/Hypenate.html +++ b/doc/out/Hypenate.html @@ -1761,7 +1761,7 @@ diff --git a/doc/out/InteractivePopup.html b/doc/out/InteractivePopup.html index c83a037..54db595 100644 --- a/doc/out/InteractivePopup.html +++ b/doc/out/InteractivePopup.html @@ -2343,7 +2343,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 cdcd441..c43d97a 100644 --- a/doc/out/LabeledGraphics.exports.LabeledGraphics.html +++ b/doc/out/LabeledGraphics.exports.LabeledGraphics.html @@ -1561,7 +1561,7 @@ diff --git a/doc/out/LabeledGraphics.html b/doc/out/LabeledGraphics.html index a434afb..b5596e3 100644 --- a/doc/out/LabeledGraphics.html +++ b/doc/out/LabeledGraphics.html @@ -2626,7 +2626,7 @@ than wanted

diff --git a/doc/out/List.html b/doc/out/List.html index 728b66f..691b501 100644 --- a/doc/out/List.html +++ b/doc/out/List.html @@ -2585,7 +2585,7 @@ app.scene.addChild(list) diff --git a/doc/out/Message.html b/doc/out/Message.html index 4d49272..17418af 100644 --- a/doc/out/Message.html +++ b/doc/out/Message.html @@ -2441,7 +2441,7 @@ a string, a number or a PIXI.Text object.

diff --git a/doc/out/MessageInteractivePopup.html b/doc/out/MessageInteractivePopup.html index e02297a..0ffe7c2 100644 --- a/doc/out/MessageInteractivePopup.html +++ b/doc/out/MessageInteractivePopup.html @@ -1789,7 +1789,7 @@ like Popup, Message...

diff --git a/doc/out/MessageMessageInteractivePopup.html b/doc/out/MessageMessageInteractivePopup.html index 4d36f23..49e1601 100644 --- a/doc/out/MessageMessageInteractivePopup.html +++ b/doc/out/MessageMessageInteractivePopup.html @@ -1789,7 +1789,7 @@ like Popup, Message...

diff --git a/doc/out/Modal.html b/doc/out/Modal.html index f79795a..a716c7d 100644 --- a/doc/out/Modal.html +++ b/doc/out/Modal.html @@ -2342,7 +2342,7 @@ a string or a PIXI.Text object.

diff --git a/doc/out/ModalInteractivePopup.html b/doc/out/ModalInteractivePopup.html index 019958d..57d8c70 100644 --- a/doc/out/ModalInteractivePopup.html +++ b/doc/out/ModalInteractivePopup.html @@ -1789,7 +1789,7 @@ like Popup, Message...

diff --git a/doc/out/ModalModalInteractivePopup.html b/doc/out/ModalModalInteractivePopup.html index 650e04f..ff978ae 100644 --- a/doc/out/ModalModalInteractivePopup.html +++ b/doc/out/ModalModalInteractivePopup.html @@ -1789,7 +1789,7 @@ like Popup, Message...

diff --git a/doc/out/PIXIApp.html b/doc/out/PIXIApp.html index 7eae6c7..16e0e55 100644 --- a/doc/out/PIXIApp.html +++ b/doc/out/PIXIApp.html @@ -5743,7 +5743,7 @@ rejected with an error. diff --git a/doc/out/Popup.html b/doc/out/Popup.html index ae04830..1e140f3 100644 --- a/doc/out/Popup.html +++ b/doc/out/Popup.html @@ -2336,7 +2336,7 @@ a string, a number or a PIXI.Text object.

diff --git a/doc/out/PopupInteractivePopup.html b/doc/out/PopupInteractivePopup.html index b02e044..2e93264 100644 --- a/doc/out/PopupInteractivePopup.html +++ b/doc/out/PopupInteractivePopup.html @@ -1789,7 +1789,7 @@ like Popup, Message...

diff --git a/doc/out/PopupMenu.html b/doc/out/PopupMenu.html index c53169c..69819b3 100644 --- a/doc/out/PopupMenu.html +++ b/doc/out/PopupMenu.html @@ -2390,7 +2390,7 @@ a string, a number or a PIXI.Text object.

diff --git a/doc/out/PopupMenuPopupInteractivePopup.html b/doc/out/PopupMenuPopupInteractivePopup.html index 03ac19e..580e21e 100644 --- a/doc/out/PopupMenuPopupInteractivePopup.html +++ b/doc/out/PopupMenuPopupInteractivePopup.html @@ -1789,7 +1789,7 @@ like Popup, Message...

diff --git a/doc/out/PopupMenuPopupMenuPopupInteractivePopup.html b/doc/out/PopupMenuPopupMenuPopupInteractivePopup.html index b1af2b1..6d3825a 100644 --- a/doc/out/PopupMenuPopupMenuPopupInteractivePopup.html +++ b/doc/out/PopupMenuPopupMenuPopupInteractivePopup.html @@ -1789,7 +1789,7 @@ like Popup, Message...

diff --git a/doc/out/PopupMenuPopupMenuPopupPopupInteractivePopup.html b/doc/out/PopupMenuPopupMenuPopupPopupInteractivePopup.html index 1940cf7..f703e01 100644 --- a/doc/out/PopupMenuPopupMenuPopupPopupInteractivePopup.html +++ b/doc/out/PopupMenuPopupMenuPopupPopupInteractivePopup.html @@ -1789,7 +1789,7 @@ like Popup, Message...

diff --git a/doc/out/PopupMenuPopupPopupInteractivePopup.html b/doc/out/PopupMenuPopupPopupInteractivePopup.html index f48b4e6..340aacb 100644 --- a/doc/out/PopupMenuPopupPopupInteractivePopup.html +++ b/doc/out/PopupMenuPopupPopupInteractivePopup.html @@ -1789,7 +1789,7 @@ like Popup, Message...

diff --git a/doc/out/PopupPopupInteractivePopup.html b/doc/out/PopupPopupInteractivePopup.html index 819c1fa..3968066 100644 --- a/doc/out/PopupPopupInteractivePopup.html +++ b/doc/out/PopupPopupInteractivePopup.html @@ -1789,7 +1789,7 @@ like Popup, Message...

diff --git a/doc/out/Progress.html b/doc/out/Progress.html index d78c378..98ad555 100644 --- a/doc/out/Progress.html +++ b/doc/out/Progress.html @@ -2875,7 +2875,7 @@ app.scene.addChild(progress) diff --git a/doc/out/Scrollview.html b/doc/out/Scrollview.html index c6106b2..ccfb9f6 100644 --- a/doc/out/Scrollview.html +++ b/doc/out/Scrollview.html @@ -1707,7 +1707,7 @@ app.loader diff --git a/doc/out/Slider.html b/doc/out/Slider.html index 0c40b3e..cef8b45 100644 --- a/doc/out/Slider.html +++ b/doc/out/Slider.html @@ -2966,7 +2966,7 @@ app.scene.addChild(slider) diff --git a/doc/out/Switch.html b/doc/out/Switch.html index 4305ddc..1d73de9 100644 --- a/doc/out/Switch.html +++ b/doc/out/Switch.html @@ -3396,7 +3396,7 @@ app.scene.addChild(switch1) diff --git a/doc/out/TextLabel.TextLabel.html b/doc/out/TextLabel.TextLabel.html index 8d1c737..bddde53 100644 --- a/doc/out/TextLabel.TextLabel.html +++ b/doc/out/TextLabel.TextLabel.html @@ -1690,7 +1690,7 @@ diff --git a/doc/out/Theme.html b/doc/out/Theme.html index 8a8d700..31e5b60 100644 --- a/doc/out/Theme.html +++ b/doc/out/Theme.html @@ -1471,7 +1471,7 @@
- theme.js:84 + theme.js:86
@@ -2884,6 +2884,78 @@ is used for large actived text.

+ + + + textAlpha + + + + + +number + + + + + + + + + Theme.textAlpha + + + + + + + + optional + + + + + +

The alpha value of text.

+ + + + + + + textActiveAlpha + + + + + +number + + + + + + + + + Theme.textActiveAlpha + + + + + + + + optional + + + + + +

The alpha value of text when activated.

+ + + @@ -3005,7 +3077,7 @@ const app = new PIXIApp({
- theme.js:175 + theme.js:179
@@ -3165,7 +3237,7 @@ const app = new PIXIApp({ diff --git a/doc/out/ThemeDark.html b/doc/out/ThemeDark.html index b106cc9..0c33ad7 100644 --- a/doc/out/ThemeDark.html +++ b/doc/out/ThemeDark.html @@ -1471,7 +1471,7 @@
- theme.js:207 + theme.js:211
@@ -1586,7 +1586,7 @@ const app = new PIXIApp({ diff --git a/doc/out/ThemeLight.html b/doc/out/ThemeLight.html index d383b36..16206ed 100644 --- a/doc/out/ThemeLight.html +++ b/doc/out/ThemeLight.html @@ -1472,7 +1472,7 @@ The color1 is set to 0xf6f6f6, color2 to 0x282828.

- theme.js:232 + theme.js:236
@@ -1598,7 +1598,7 @@ const app = new PIXIApp({ diff --git a/doc/out/ThemeRed.html b/doc/out/ThemeRed.html index b2ab865..903e5c3 100644 --- a/doc/out/ThemeRed.html +++ b/doc/out/ThemeRed.html @@ -1472,7 +1472,7 @@ The primaryColor is set to 0xd92f31.

- theme.js:260 + theme.js:264
@@ -1598,7 +1598,7 @@ const app = new PIXIApp({ diff --git a/doc/out/TileQuadNode.html b/doc/out/TileQuadNode.html index 5dafb89..e46f7e7 100644 --- a/doc/out/TileQuadNode.html +++ b/doc/out/TileQuadNode.html @@ -2050,7 +2050,7 @@ an indicator of tiles to free.

diff --git a/doc/out/Tooltip.html b/doc/out/Tooltip.html index 4c4e7d1..4a764b8 100644 --- a/doc/out/Tooltip.html +++ b/doc/out/Tooltip.html @@ -2512,7 +2512,7 @@ a string, a number or a PIXI.Text object.

diff --git a/doc/out/UITest.html b/doc/out/UITest.html index b215e59..6e74ce9 100644 --- a/doc/out/UITest.html +++ b/doc/out/UITest.html @@ -4183,7 +4183,7 @@ test.start() diff --git a/doc/out/Volatile.html b/doc/out/Volatile.html index f9809a8..3377785 100644 --- a/doc/out/Volatile.html +++ b/doc/out/Volatile.html @@ -2099,7 +2099,7 @@ app.scene.addChild(button) diff --git a/doc/out/global.html b/doc/out/global.html index 888c8cd..37eef3d 100644 --- a/doc/out/global.html +++ b/doc/out/global.html @@ -3320,7 +3320,7 @@ diff --git a/doc/out/index.html b/doc/out/index.html index 55f6208..503a256 100644 --- a/doc/out/index.html +++ b/doc/out/index.html @@ -1485,7 +1485,7 @@ diff --git a/doc/out/pixi_abstractpopup.js.html b/doc/out/pixi_abstractpopup.js.html index 4c9f0a0..2ad910b 100644 --- a/doc/out/pixi_abstractpopup.js.html +++ b/doc/out/pixi_abstractpopup.js.html @@ -1808,7 +1808,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 e2bf574..5b71f5f 100644 --- a/doc/out/pixi_app.js.html +++ b/doc/out/pixi_app.js.html @@ -2188,7 +2188,7 @@ class FpsDisplay extends PIXI.Graphics { diff --git a/doc/out/pixi_badge.js.html b/doc/out/pixi_badge.js.html index a740967..2e41aab 100644 --- a/doc/out/pixi_badge.js.html +++ b/doc/out/pixi_badge.js.html @@ -1569,7 +1569,7 @@ export default class Badge extends AbstractPopup { diff --git a/doc/out/pixi_blurfilter.js.html b/doc/out/pixi_blurfilter.js.html index 56c9696..7420b92 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 1e1163a..5f142ae 100644 --- a/doc/out/pixi_button.js.html +++ b/doc/out/pixi_button.js.html @@ -1527,6 +1527,8 @@ export default class Button extends PIXI.Container { * for possible options. * @param {number} [opts.textStyleActive=Theme.textStyleActive] - A textstyle object for the styling of the label when the * button is activated. See PIXI.TextStyle for possible options. + * @param {number} [opts.textAlpha=Theme.textAlpha] - The alpha value of the text. + * @param {number} [opts.textActiveAlpha=Theme.textActiveAlpha] - The alpha value of the text when activated. * @param {string} [opts.style=default] - A shortcut for styling options. Possible values are default, link. * @param {number} [opts.radius=Theme.radius] - The radius of the four corners of the button (which is a rounded rectangle). * @param {boolean} [opts.disabled=false] - Is the button disabled? When disabled, the button has a lower alpha value @@ -1584,6 +1586,8 @@ export default class Button extends PIXI.Container { strokeActiveAlpha: theme.strokeActiveAlpha, textStyle: {}, textStyleActive: {}, + textAlpha: theme.textAlpha, + textActiveAlpha: theme.textActiveAlpha, style: 'default', radius: theme.radius, disabled: false, @@ -2012,10 +2016,12 @@ export default class Button extends PIXI.Container { if (this._active) { if (this.text) { this.text.style = this.opts.textStyleActive + this.text.alpha = this.opts.textActiveAlpha } } else { if (this.text) { this.text.style = this.opts.textStyle + this.text.alpha = this.opts.textAlpha } } @@ -2171,7 +2177,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 e146e01..5182eec 100644 --- a/doc/out/pixi_buttongroup.js.html +++ b/doc/out/pixi_buttongroup.js.html @@ -1511,6 +1511,8 @@ export default class ButtonGroup extends PIXI.Container { * for possible options. * @param {number} [opts.textStyleActive=Theme.textStyleActive] - Button: A textstyle object for the styling of the label when the * button is activated. See PIXI.TextStyle for possible options. + * @param {number} [opts.textAlpha=Theme.textAlpha] - Button: The alpha value of the text. + * @param {number} [opts.textActiveAlpha=Theme.textActiveAlpha] - Button: The alpha value of the text when activated. * @param {string} [opts.style=default] - A shortcut for styling options. Possible values are default, link. * @param {number} [opts.radius=Theme.radius] - Button: The radius of the four corners of the button (which is a rounded rectangle). * @param {boolean} [opts.disabled=false] - Is the button group disabled? When disabled, the button group has a lower alpha value @@ -1561,6 +1563,8 @@ export default class ButtonGroup extends PIXI.Container { strokeActiveAlpha: theme.strokeActiveAlpha, textStyle: {}, textStyleActive: {}, + textAlpha: theme.textAlpha, + textActiveAlpha: theme.textActiveAlpha, style: 'default', radius: theme.radius, disabled: null, @@ -1639,6 +1643,8 @@ export default class ButtonGroup extends PIXI.Container { it.strokeActiveAlpha = it.strokeActiveAlpha != null ? it.strokeActiveAlpha : this.opts.strokeActiveAlpha it.textStyle = it.textStyle || this.opts.textStyle it.textStyleActive = it.textStyleActive || this.opts.textStyleActive + it.textAlpha = it.textAlpha != null ? it.textAlpha : this.opts.textAlpha + it.textActiveAlpha = it.textActiveAlpha != null ? it.textActiveAlpha : this.opts.textActiveAlpha it.style = it.style || this.opts.style it.radius = it.radius != null ? it.radius : this.opts.radius if (!it.type) { @@ -2174,7 +2180,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 876727c..ad33630 100644 --- a/doc/out/pixi_deepzoom_image.js.html +++ b/doc/out/pixi_deepzoom_image.js.html @@ -2512,7 +2512,7 @@ export class DeepZoomImage extends PIXI.Container { diff --git a/doc/out/pixi_flippable.js.html b/doc/out/pixi_flippable.js.html index ccccffa..4cfe37e 100644 --- a/doc/out/pixi_flippable.js.html +++ b/doc/out/pixi_flippable.js.html @@ -1906,7 +1906,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 f832b38..2146719 100644 --- a/doc/out/pixi_labeledgraphics.js.html +++ b/doc/out/pixi_labeledgraphics.js.html @@ -1855,7 +1855,7 @@ export class BitmapLabeledGraphics extends LabeledGraphics { diff --git a/doc/out/pixi_list.js.html b/doc/out/pixi_list.js.html index c2b3d34..d87dd33 100644 --- a/doc/out/pixi_list.js.html +++ b/doc/out/pixi_list.js.html @@ -1834,7 +1834,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 a5f19bc..f350309 100644 --- a/doc/out/pixi_message.js.html +++ b/doc/out/pixi_message.js.html @@ -1583,7 +1583,7 @@ export default class Message extends InteractivePopup { diff --git a/doc/out/pixi_modal.js.html b/doc/out/pixi_modal.js.html index 616bf22..c418ca2 100644 --- a/doc/out/pixi_modal.js.html +++ b/doc/out/pixi_modal.js.html @@ -1664,7 +1664,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 906daad..f42a9b9 100644 --- a/doc/out/pixi_popup.js.html +++ b/doc/out/pixi_popup.js.html @@ -1674,7 +1674,7 @@ export default class Popup extends InteractivePopup { diff --git a/doc/out/pixi_popupmenu.js.html b/doc/out/pixi_popupmenu.js.html index 1871c53..e091df9 100644 --- a/doc/out/pixi_popupmenu.js.html +++ b/doc/out/pixi_popupmenu.js.html @@ -1577,7 +1577,7 @@ export default class PopupMenu extends Popup { diff --git a/doc/out/pixi_progress.js.html b/doc/out/pixi_progress.js.html index 1830228..7b20d5b 100644 --- a/doc/out/pixi_progress.js.html +++ b/doc/out/pixi_progress.js.html @@ -1759,7 +1759,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 f83a6f2..ff7383a 100644 --- a/doc/out/pixi_scrollview.js.html +++ b/doc/out/pixi_scrollview.js.html @@ -1518,7 +1518,7 @@ export default class Scrollview extends Scrollbox { diff --git a/doc/out/pixi_slider.js.html b/doc/out/pixi_slider.js.html index e029f37..d24baea 100644 --- a/doc/out/pixi_slider.js.html +++ b/doc/out/pixi_slider.js.html @@ -1923,7 +1923,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 1fee27e..4819347 100644 --- a/doc/out/pixi_switch.js.html +++ b/doc/out/pixi_switch.js.html @@ -1977,7 +1977,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 1c92061..3f0773e 100644 --- a/doc/out/pixi_theme.js.html +++ b/doc/out/pixi_theme.js.html @@ -1524,6 +1524,8 @@ export default class Theme { * large text. * @param {object} [opts.textStyleLargeActive=textStyleLarge + {fill: primaryColor}] - A textstyle object which * is used for large actived text. + * @param {number} [opts.textAlpha=Theme.textAlpha] - The alpha value of text. + * @param {number} [opts.textActiveAlpha=Theme.textActiveAlpha] - The alpha value of text when activated. */ constructor(opts = {}) { const colorPrimary = opts.primaryColor != null ? opts.primaryColor : 0x5ec7f8 // blue @@ -1552,6 +1554,8 @@ export default class Theme { strokeActive: color2, strokeActiveWidth: 0.6, strokeActiveAlpha: 1, + textAlpha: 1, + textActiveAlpha: 1, iconColor: color2, iconColorActive: colorPrimary, background: color1 @@ -1718,7 +1722,7 @@ export class ThemeRed extends Theme { diff --git a/doc/out/pixi_tooltip.js.html b/doc/out/pixi_tooltip.js.html index 057a7f0..905b624 100644 --- a/doc/out/pixi_tooltip.js.html +++ b/doc/out/pixi_tooltip.js.html @@ -1611,7 +1611,7 @@ export default class Tooltip extends AbstractPopup { diff --git a/doc/out/pixi_volatile.js.html b/doc/out/pixi_volatile.js.html index 327d844..95642b6 100644 --- a/doc/out/pixi_volatile.js.html +++ b/doc/out/pixi_volatile.js.html @@ -1615,7 +1615,7 @@ export default class Volatile { diff --git a/doc/out/uitest.js.html b/doc/out/uitest.js.html index d9e855a..5cc5ea4 100644 --- a/doc/out/uitest.js.html +++ b/doc/out/uitest.js.html @@ -2466,7 +2466,7 @@ class Event { diff --git a/lib/pixi/button.html b/lib/pixi/button.html index 49d9f65..0812949 100644 --- a/lib/pixi/button.html +++ b/lib/pixi/button.html @@ -317,7 +317,9 @@ const button26 = new Button({ strokeActive: 0x28a745, textStyleActive: { fill: 0x28a745 - } + }, + textAlpha: .2, + textActiveAlpha: .6 }) app.scene.addChild(button1, button2, button3, button4, button5, button6) diff --git a/lib/pixi/button.js b/lib/pixi/button.js index ba322c0..3200451 100644 --- a/lib/pixi/button.js +++ b/lib/pixi/button.js @@ -81,6 +81,8 @@ export default class Button extends PIXI.Container { * for possible options. * @param {number} [opts.textStyleActive=Theme.textStyleActive] - A textstyle object for the styling of the label when the * button is activated. See PIXI.TextStyle for possible options. + * @param {number} [opts.textAlpha=Theme.textAlpha] - The alpha value of the text. + * @param {number} [opts.textActiveAlpha=Theme.textActiveAlpha] - The alpha value of the text when activated. * @param {string} [opts.style=default] - A shortcut for styling options. Possible values are default, link. * @param {number} [opts.radius=Theme.radius] - The radius of the four corners of the button (which is a rounded rectangle). * @param {boolean} [opts.disabled=false] - Is the button disabled? When disabled, the button has a lower alpha value @@ -138,6 +140,8 @@ export default class Button extends PIXI.Container { strokeActiveAlpha: theme.strokeActiveAlpha, textStyle: {}, textStyleActive: {}, + textAlpha: theme.textAlpha, + textActiveAlpha: theme.textActiveAlpha, style: 'default', radius: theme.radius, disabled: false, @@ -566,10 +570,12 @@ export default class Button extends PIXI.Container { if (this._active) { if (this.text) { this.text.style = this.opts.textStyleActive + this.text.alpha = this.opts.textActiveAlpha } } else { if (this.text) { this.text.style = this.opts.textStyle + this.text.alpha = this.opts.textAlpha } } diff --git a/lib/pixi/buttongroup.html b/lib/pixi/buttongroup.html index 3c8c872..93c5b36 100644 --- a/lib/pixi/buttongroup.html +++ b/lib/pixi/buttongroup.html @@ -339,12 +339,37 @@ const buttonGroup19 = new ButtonGroup({ app }) +const buttonGroup20 = new ButtonGroup({ + x: 10, + y: 1520, + type: 'checkbox', + buttons: [ + {label: 'one'}, + {label: 'two'}, + {label: 'three'} + ], + textAlpha: .7, + textActiveAlpha: .2 +}) + +const buttonGroup21 = new ButtonGroup({ + x: 300, + y: 1520, + type: 'checkbox', + buttons: [ + {label: 'eins', textAlpha: 1, textActiveAlpha: .2}, + {label: 'zwei', textAlpha: .2, textActiveAlpha: 1}, + {label: 'drei'} + ] +}) + 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, buttonGroup19) +app.scene.addChild(buttonGroup20, buttonGroup21) diff --git a/lib/pixi/buttongroup.js b/lib/pixi/buttongroup.js index 6ec72ad..a081a91 100644 --- a/lib/pixi/buttongroup.js +++ b/lib/pixi/buttongroup.js @@ -65,6 +65,8 @@ export default class ButtonGroup extends PIXI.Container { * for possible options. * @param {number} [opts.textStyleActive=Theme.textStyleActive] - Button: A textstyle object for the styling of the label when the * button is activated. See PIXI.TextStyle for possible options. + * @param {number} [opts.textAlpha=Theme.textAlpha] - Button: The alpha value of the text. + * @param {number} [opts.textActiveAlpha=Theme.textActiveAlpha] - Button: The alpha value of the text when activated. * @param {string} [opts.style=default] - A shortcut for styling options. Possible values are default, link. * @param {number} [opts.radius=Theme.radius] - Button: The radius of the four corners of the button (which is a rounded rectangle). * @param {boolean} [opts.disabled=false] - Is the button group disabled? When disabled, the button group has a lower alpha value @@ -115,6 +117,8 @@ export default class ButtonGroup extends PIXI.Container { strokeActiveAlpha: theme.strokeActiveAlpha, textStyle: {}, textStyleActive: {}, + textAlpha: theme.textAlpha, + textActiveAlpha: theme.textActiveAlpha, style: 'default', radius: theme.radius, disabled: null, @@ -193,6 +197,8 @@ export default class ButtonGroup extends PIXI.Container { it.strokeActiveAlpha = it.strokeActiveAlpha != null ? it.strokeActiveAlpha : this.opts.strokeActiveAlpha it.textStyle = it.textStyle || this.opts.textStyle it.textStyleActive = it.textStyleActive || this.opts.textStyleActive + it.textAlpha = it.textAlpha != null ? it.textAlpha : this.opts.textAlpha + it.textActiveAlpha = it.textActiveAlpha != null ? it.textActiveAlpha : this.opts.textActiveAlpha it.style = it.style || this.opts.style it.radius = it.radius != null ? it.radius : this.opts.radius if (!it.type) { diff --git a/lib/pixi/theme.js b/lib/pixi/theme.js index 5507fcf..126e868 100644 --- a/lib/pixi/theme.js +++ b/lib/pixi/theme.js @@ -78,6 +78,8 @@ export default class Theme { * large text. * @param {object} [opts.textStyleLargeActive=textStyleLarge + {fill: primaryColor}] - A textstyle object which * is used for large actived text. + * @param {number} [opts.textAlpha=Theme.textAlpha] - The alpha value of text. + * @param {number} [opts.textActiveAlpha=Theme.textActiveAlpha] - The alpha value of text when activated. */ constructor(opts = {}) { const colorPrimary = opts.primaryColor != null ? opts.primaryColor : 0x5ec7f8 // blue @@ -106,6 +108,8 @@ export default class Theme { strokeActive: color2, strokeActiveWidth: 0.6, strokeActiveAlpha: 1, + textAlpha: 1, + textActiveAlpha: 1, iconColor: color2, iconColorActive: colorPrimary, background: color1