Popup close buttons can take a URL.

This commit is contained in:
2021-02-24 16:13:50 +01:00
parent 114c217ffa
commit ac779af339
68 changed files with 18127 additions and 43084 deletions
+3 -3
View File
@@ -269,7 +269,7 @@ export default class Card {
*/
return html.replace(
/<\s*(a|video|img|image|circle)\s(.*?)(xlink:href|href|src)\s*=\s*["'](\..*?)["']\s*(.*?)>/g,
function () {
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)
@@ -298,7 +298,7 @@ export default class Card {
return new Promise((resolve, reject) => {
let request = new XMLHttpRequest()
request.onreadystatechange = function () {
request.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status == 200 || Card._isLocal()) {
try {
@@ -1593,7 +1593,7 @@ export default class Card {
})
},
onUpdateParams: ['{self}'],
onUpdate: function (self) {
onUpdate: function(self) {
let transform = self.target._gsTransform
TweenLite.set(title, {
+4 -4
View File
@@ -54,7 +54,7 @@ export default class CardWrapper extends Object {
isClickable(node) {
if (node == null) return false
// console.log("isClickable", node, this.isClickPrevented(node))
// console.log("isClickable", node, this.isClickPrevented(node))
if (this.isClickPrevented(node)) {
return false
}
@@ -101,8 +101,8 @@ export default class CardWrapper extends Object {
let clickRects = activeNodes.map(link => {
let rect = link.getBoundingClientRect()
// Since the getBoundingClientRect is untransformed we cannot rely on it's size
// We need a transformed bottom right to calculate local width and height
// Since the getBoundingClientRect is untransformed we cannot rely on it's size
// We need a transformed bottom right to calculate local width and height
let bottomRight = Points.fromPageToNode(element, {
x: rect.x + rect.width,
y: rect.y + rect.height
@@ -200,4 +200,4 @@ export default class CardWrapper extends Object {
this.tapNodes.set(objOrSelector, handler)
}
}
}
}
+2 -2
View File
@@ -117,10 +117,10 @@ export default class Errors {
window.addEventListener(
'error',
event => {
if (typeof(event.error) == 'undefined') {
if (typeof event.error == 'undefined') {
// This sometimes happens in Edge. Since we have no error
// position, we cannot do much beside an info log.
console.info("Catched undefined error", event)
console.info('Catched undefined error', event)
return
}
this.appendError(event.error, event.filename)
+24 -3
View File
@@ -18,7 +18,7 @@ export class InteractivePopup extends AbstractPopup {
* @constructor
* @param {object} [opts] - An options object to specify to style and behaviour of the popup.
* @param {boolean} [opts.closeOnPopup=false] - Should the popup be closed when the user clicks on the popup?
* @param {boolean} [opts.closeButton=true] - Should a close button be displayed on the upper right corner?
* @param {boolean|string} [opts.closeButton=true] - Should a close button be displayed on the upper right corner? Alternatively, a URL to the image can be specified.
* @param {object} [opts.button] - A Button object to be display on the lower right corner.
* @param {object} [opts.buttonGroup] - A ButtonGroup object to be displayed on the lower right corner.
*/
@@ -73,7 +73,16 @@ export class InteractivePopup extends AbstractPopup {
// closeButton
//-----------------
if (this.opts.closeButton) {
let closeButton = PIXI.Sprite.from('../../assets/icons/close.png')
let url = null
if (typeof this.opts.closeButton === 'string' || this.opts.closeButton instanceof String) {
url = InteractivePopup.iconIsUrl(this.opts.closeButton)
? this.opts.closeButton
: `../../assets/icons/${this.opts.closeButton}.png`
} else {
url = '../../assets/icons/close.png'
}
let closeButton = PIXI.Sprite.from(url)
closeButton.width = this.headerStyle.fontSize
closeButton.height = closeButton.width
closeButton.tint = this.theme.color2
@@ -172,6 +181,18 @@ export class InteractivePopup extends AbstractPopup {
return size
}
/**
* Tests if an icon string is an url.
*
* @private
* @static
* @param {string} url - The url to test.
* @return {boolean} true if the url is an url to an image.
*/
static iconIsUrl(url) {
return /\.(png|svg|gif|jpg|jpeg|tif|tiff)$/i.test(url)
}
}
/**
@@ -197,7 +218,7 @@ export default class Popup extends InteractivePopup {
*
* @constructor
* @param {object} [opts] - An options object to specify to style and behaviour of the popup.
* @param {boolean} [opts.closeButton=false] - Should a close button be displayed on the upper right corner?
* @param {boolean|string} [opts.closeButton=false] - Should a close button be displayed on the upper right corner? Alternatively, a URL to the image can be specified.
* @param {number} [opts.minWidth=0] - The minimum width of the popup.
* @param {number} [opts.minHeight=0] - The minimum height of the popup.
*/
-1
View File
@@ -315,7 +315,6 @@ export class DisplayObjectScatter extends AbstractScatter {
if (y != null) this.y = y
}
getWorldScatter() {
return this
}
+8 -3
View File
@@ -113,9 +113,14 @@ export default class PopupMenu extends Popup {
if (this.autoClose) {
this.close()
}
setTimeout((event, key) => {
func(event, key)
}, 20, event, key)
setTimeout(
(event, key) => {
func(event, key)
},
20,
event,
key
)
}
/** Update the menu item denoted by key.
+16 -21
View File
@@ -184,7 +184,7 @@ export class Dates {
return new Date(date.getTime() + 1)
}
static * iterYears(start, end) {
static *iterYears(start, end) {
let date = this.create(start.getFullYear(), 0, 1)
while (date <= end) {
yield date
@@ -193,7 +193,7 @@ export class Dates {
yield date
}
static * iterMonths(year, limit = 12) {
static *iterMonths(year, limit = 12) {
let month = 0
while (month < limit) {
let date = this.create(year.getFullYear(), month, 1)
@@ -202,7 +202,7 @@ export class Dates {
}
}
static * iterMonthsOfYears(years) {
static *iterMonthsOfYears(years) {
for (let year of years) {
for (let month of this.iterMonths(year)) {
yield month
@@ -210,7 +210,7 @@ export class Dates {
}
}
static * iterDays(month) {
static *iterDays(month) {
let day = 1
let limit = Dates.daysInMonth(month)
while (day <= limit) {
@@ -220,7 +220,7 @@ export class Dates {
}
}
static * iterDaysOfMonths(months) {
static *iterDaysOfMonths(months) {
for (let month of months) {
for (let day of this.iterDays(month)) {
yield day
@@ -398,16 +398,12 @@ export class Points {
static distanceToRect(p, r) {
let dx = 0
let dy = 0
if (p.x < r.x)
dx = p.x - r.x
else if (p.x > r.x + r.width)
dx = p.x - (r.x + r.width)
if (p.y < r.y)
dy = p.y - r.y
else if (p.y > r.y + r.height)
dy = p.y - (r.y + r.height)
if (p.x < r.x) dx = p.x - r.x
else if (p.x > r.x + r.width) dx = p.x - (r.x + r.width)
if (p.y < r.y) dy = p.y - r.y
else if (p.y > r.y + r.height) dy = p.y - (r.y + r.height)
return Math.sqrt(dx * dx + dy * dy)
/* let cx = Math.max(Math.min(p.x, r.x + r.width), r.x)
/* let cx = Math.max(Math.min(p.x, r.x + r.width), r.x)
let cy = Math.max(Math.min(p.y, r.y + r.height), r.y)
let result = Math.sqrt((p.x - cx) * (p.x - cx) + (p.y - cy) * (p.y - cy))
console.log("distanceToRect", p, r, result)
@@ -451,8 +447,7 @@ export class Sets {
const i = sets.reduce((m, s, i) => (s.size < sets[m].size ? i : m), 0)
const [smallest] = sets.splice(i, 1)
const res = new Set()
for (let val of smallest)
if (sets.every(s => s.has(val))) res.add(val)
for (let val of smallest) if (sets.every(s => s.has(val))) res.add(val)
return res
}
@@ -1001,11 +996,11 @@ export class LowPassFilter {
next(nextValue) {
// push new value to the end, and remove oldest one
let removed = this.__push(nextValue)
// smooth value using all values from buffer
// smooth value using all values from buffer
let result = this.buffer.reduce((last, current) => {
return this.smoothing * current + (1 - this.smoothing) * last
}, removed)
// replace smoothed value
return this.smoothing * current + (1 - this.smoothing) * last
}, removed)
// replace smoothed value
this.buffer[this.buffer.length - 1] = result
return result
}
@@ -1026,4 +1021,4 @@ export class LowPassFilter {
}
return values
}
}
}