Working on cards.

lib/card/highlight.js

@@ -30,7 +30,7 @@ function round(value) {
  * @class Highlight
  * @extends {Object}
  */
-class Highlight extends Object {
+export class Highlight extends Object {
 
     static disableAnimations() {
         _HighlightEnabled = false
@@ -194,7 +194,7 @@ class Highlight extends Object {
         onExpanded = null
     } = {}) {
 
-        console.log('Open Highlight!')
+        console.log('Open Highlight!', target)
 
         if (Highlight._isExpanded(target)) {
             console.log('Target is already expanded!')
@@ -202,7 +202,7 @@ class Highlight extends Object {
         } else {
 
             let targetId = target.getAttribute('id')
-            console.log(targetId)
+            console.log(targetId, targetId && targetId.startsWith('@@'))
             if(targetId && targetId.startsWith('@@')){
                 let id = targetId.slice(2)
                 const imageId = '#maskImage'+id
@@ -214,7 +214,7 @@ class Highlight extends Object {
                     }else console.error('Could not find corresponding image element.')
                 }else console.log('Element was no parent:', target)
             }
-
+            console.log("_bringToFront")
             this._bringToFront(target)
 
             let svgRoot = target.closest('svg')
@@ -222,21 +222,21 @@ class Highlight extends Object {
 
             // eslint-disable-next-line no-unused-vars
             let [mask, maskImage] = Highlight._getSVGMask(target, { svgRoot, image })
+
+            console.log({svgRoot, image, mask, maskImage})
             let center = Highlight._calculateCenterRelativeTo(target, image)
 
             TweenLite.set(maskImage, { transformOrigin: `${center.x}% ${center.y}%` })
             TweenLite.set(target, { transformOrigin: '50% 50%' })
 
-            TweenLite.to(target, 2, {
-
-            })
-
             TweenLite.to([target, maskImage], animation, {
                 scale,
                 onComplete: onExpanded
             })
 
             target.classList.add('expanded')
+            console.log({target, maskImage, scale, animation})
+            console.log(maskImage)
         }
 
         return
@@ -397,4 +397,4 @@ class Highlight extends Object {
 }
 
 Highlight.expandedClass = 'expanded'
-window.Highlight = Highlight
+