Now calling 'this' to allow overloading of methods.

This commit is contained in:
Severin Opel 2020-04-21 12:43:55 +02:00
parent 6445ab3f57
commit 6ab63eb32c

View File

@ -33,7 +33,7 @@ const SCALE = 1.5
export default class Highlight extends Object {
static disableAnimations() {
_HighlightEnabled = false
let expanded = document.querySelectorAll('.' + Highlight.expandedClass)
let expanded = document.querySelectorAll('.' + this.expandedClass)
for (let obj of expanded) {
this.shrink(obj)
}
@ -44,11 +44,11 @@ export default class Highlight extends Object {
}
static removeAnimations(svgRoot) {
let expanded = svgRoot.querySelectorAll('.' + Highlight.expandedClass)
let expanded = svgRoot.querySelectorAll('.' + this.expandedClass)
for (let obj of expanded) {
TweenLite.set(obj, { scale: 1 })
obj.classList.remove('zooming')
obj.classList.remove(Highlight.expandedClass)
obj.classList.remove(this.expandedClass)
}
let defs = svgRoot.querySelector('defs')
while (defs.firstChild) {
@ -91,7 +91,7 @@ export default class Highlight extends Object {
onComplete: () => {
console.log('expand complete')
obj.classList.remove('zooming')
obj.classList.add(Highlight.expandedClass)
obj.classList.add(this.expandedClass)
obj.setAttribute('stroke-width', stroke / scale)
if (onComplete) onComplete()
}
@ -111,7 +111,7 @@ export default class Highlight extends Object {
onComplete: () => {
//console.log("shrink complete")
obj.classList.remove('zooming')
obj.classList.remove(Highlight.expandedClass)
obj.classList.remove(this.expandedClass)
obj.setAttribute('stroke-width', stroke)
}
})
@ -150,7 +150,7 @@ export default class Highlight extends Object {
let maskImageId = 'maskImage' + id
let maskImage = svgRoot.getElementById(maskImageId)
if (circle.classList.contains(Highlight.expandedClass)) {
if (circle.classList.contains(this.expandedClass)) {
if (!circle.classList.contains('zooming')) {
this.shrink(circle, { stroke })
this.shrink(maskImage, { stroke })
@ -173,7 +173,7 @@ export default class Highlight extends Object {
this.shrink(m, { stroke })
}
Highlight._createSVGMask(svgRoot, image, id)
this._createSVGMask(svgRoot, image, id)
// TweenLite.set(maskImage, { transformOrigin: `${tx}% ${ty}%` })
@ -184,7 +184,7 @@ export default class Highlight extends Object {
}
static openHighlight(target, { animation = 0.5, scale = SCALE, onExpanded = null } = {}) {
if (Highlight._isExpanded(target)) {
if (this._isExpanded(target)) {
console.log('Target is already expanded!')
return
} else {
@ -208,11 +208,11 @@ export default class Highlight extends Object {
let image = svgRoot.querySelector('image')
// eslint-disable-next-line no-unused-vars
let [mask, maskImage] = Highlight._getSVGMask(target, {
let [mask, maskImage] = this._getSVGMask(target, {
svgRoot,
image
})
let center = Highlight._calculateCenterRelativeTo(target, image)
let center = this._calculateCenterRelativeTo(target, image)
console.log('_calculateCenterRelativeTo', center)
TweenLite.set(maskImage, {
transformOrigin: `${center.x} ${center.y}`
@ -224,16 +224,16 @@ export default class Highlight extends Object {
onComplete: onExpanded
})
target.classList.add(Highlight.expandedClass)
target.classList.add(this.expandedClass)
}
}
static toggleHighlight(node, options = {}) {
console.log('toggleHighlight', Highlight._isExpanded(node))
if (Highlight._isExpanded(node)) {
Highlight.closeHighlight(node, options)
console.log('toggleHighlight', this._isExpanded(node))
if (this._isExpanded(node)) {
this.closeHighlight(node, options)
} else {
Highlight.openHighlight(node, options)
this.openHighlight(node, options)
}
}
@ -256,7 +256,7 @@ export default class Highlight extends Object {
let maskImage = svgRoot.getElementById(maskImageId)
if (!mask || !maskImage)
[mask, maskImage] = Highlight._createSVGMask(circle, {
[mask, maskImage] = this._createSVGMask(circle, {
svgRoot,
image,
id
@ -345,13 +345,13 @@ export default class Highlight extends Object {
}
static _isExpanded(target) {
return target.classList.contains(Highlight.expandedClass)
return target.classList.contains(this.expandedClass)
}
static closeHighlight(target, { animation = 0.5 } = {}) {
target.classList.remove(Highlight.expandedClass)
target.classList.remove(this.expandedClass)
// eslint-disable-next-line no-unused-vars
let [mask, maskImage] = Highlight._getSVGMask(target)
let [mask, maskImage] = this._getSVGMask(target)
// console.log('Close Highlight', maskImage)
TweenLite.to([target, maskImage], animation, {
scale: 1
@ -362,7 +362,7 @@ export default class Highlight extends Object {
if (!_HighlightEnabled) return
event.stopPropagation()
Highlight.animateCircle(event.target)
this.animateCircle(event.target)
return false
}