Browse Source

Removed TweenMax dependency

obersalzberg
Uwe Oestermeier 1 year ago
parent
commit
ab835d6fc3
1 changed files with 34 additions and 34 deletions
  1. +34
    -34
      lib/card/card.js

+ 34
- 34
lib/card/card.js View File

@ -431,7 +431,7 @@ export default class Card {
zIndex: this.zIndices.popup
})
TweenMax.to(popup.element, this.animation.popup, {
TweenLite.to(popup.element, this.animation.popup, {
autoAlpha: 1,
ease: Power2.easeIn
})
@ -451,7 +451,7 @@ export default class Card {
* TEST if this intereferes with the editor.
*/
if (overlay) {
TweenMax.to(overlay, 0.2, {
TweenLite.to(overlay, 0.2, {
autoAlpha: 0, onComplete: () => {
popup.remove()
//this._cleanup(context)
@ -507,9 +507,9 @@ export default class Card {
if (editable) {
if (this.debug) console.log("Append overlay.", context)
overlay.classList.add('overlay')
TweenMax.set(overlay, { autoAlpha: 0 })
TweenLite.set(overlay, { autoAlpha: 0 })
context.appendChild(overlay)
TweenMax.to(overlay, 0.5, { autoAlpha: 0.25 })
TweenLite.to(overlay, 0.5, { autoAlpha: 0.25 })
}
// Extract the body from the Popup site.
@ -949,17 +949,17 @@ export default class Card {
const scaleFactor = 2
const transformOrigin = 'bottom right'
TweenMax.set(zoomedFig, {
TweenLite.set(zoomedFig, {
x: current.x,
y: current.y,
width: current.width + borderX,
height: current.height + borderY,
transformOrigin
})
TweenMax.set(zoomable, { opacity: 0 })
TweenLite.set(zoomable, { opacity: 0 })
let icon = zoomedFig.querySelector(".icon")
TweenMax.set(icon, {
TweenLite.set(icon, {
transformOrigin
})
zoomedFig.style.transformOrigin = "calc(100% - " + parseFloat(zoomedFigStyle.borderRightWidth) + "px) calc(100% - " + parseFloat(zoomedFigStyle.borderBottomWidth) + "px)"
@ -1029,7 +1029,7 @@ export default class Card {
zoomParent.appendChild(zoomedFig)
zoomedFig.style.opacity = 0.5
zoomContainer.appendChild(zoomable)
TweenMax.set(zoomable, { x: current.x, y: current.y, width: current.width, height: current.height })
TweenLite.set(zoomable, { x: current.x, y: current.y, width: current.width, height: current.height })
let editor = mainController.topController().ensureEditor(img)
let savedDisplay = zoomIcon.style.display
let iconClone = zoomIcon.cloneNode(true)
@ -1046,14 +1046,14 @@ export default class Card {
zoomedFig.remove()
zoomContainer.remove()
zoomParent.appendChild(zoomable)
TweenMax.set(zoomable, { x: 0, y: 0 })
TweenLite.set(zoomable, { x: 0, y: 0 })
zoomable.onmousedown = null
zoomable.onmousemove = null
zoomable.onmouseup = null
zoomable.onmousewheel = null
}
wrapper.appendChild(iconClone)
TweenMax.set(iconClone, { x: current.iconPos.x, y: current.iconPos.y })
TweenLite.set(iconClone, { x: current.iconPos.x, y: current.iconPos.y })
zoomable.onmousedown = event => {
if (this.debug) console.log('mousedown', event.target)
@ -1067,7 +1067,7 @@ export default class Card {
event.preventDefault()
let dx = event.pageX - zoomable.dragStartPos.x
let dy = event.pageY - zoomable.dragStartPos.y
TweenMax.set([zoomable, iconClone], { x: '+=' + dx, y: '+=' + dy })
TweenLite.set([zoomable, iconClone], { x: '+=' + dx, y: '+=' + dy })
zoomable.dragStartPos = { x: event.pageX, y: event.pageY }
if (editor) {
editor.showControls()
@ -1086,7 +1086,7 @@ export default class Card {
let zoom = direction ? zoomFactor : 1 / zoomFactor
startZoom *= zoom
TweenMax.set(zoomable, { scale: startZoom })
TweenLite.set(zoomable, { scale: startZoom })
if (editor) {
editor.showControls()
}
@ -1117,17 +1117,17 @@ export default class Card {
let zoomedCaption = zoomedFig.querySelector("figcaption.zoomcap")
TweenMax.to(zoomedCaption, this.animation.fade, {
TweenLite.to(zoomedCaption, this.animation.fade, {
autoAlpha: 0,
})
TweenMax.to(zoomedFig, this.animation.zoomable, {
TweenLite.to(zoomedFig, this.animation.zoomable, {
css: {
scaleX: 1,
scaleY: 1
},
onComplete: () => {
TweenMax.set(zoomable, {
TweenLite.set(zoomable, {
opacity: 1
})
let div = zoomedFig.parentNode
@ -1204,7 +1204,7 @@ export default class Card {
let padding = parseInt(this.css(indexbox, 'padding'))
let maxWidth = this.css(card, 'max-width')
TweenMax.set(clone, {
TweenLite.set(clone, {
css: {
position: 'absolute',
width: globalIndexCardRect.width,
@ -1215,12 +1215,12 @@ export default class Card {
}
})
TweenMax.set(articleClone, {
TweenLite.set(articleClone, {
autoAlpha: 0
})
TweenMax.set(card, { css: { maxWidth: '100%' } })
TweenMax.set(clone, {
TweenLite.set(card, { css: { maxWidth: '100%' } })
TweenLite.set(clone, {
x: localOrigin.x - padding,
y: localOrigin.y - padding,
scaleX,
@ -1244,10 +1244,10 @@ export default class Card {
/**
* Scale the content from 100% to it's target size.
*/
// TweenMax.set(subcardContent, {
// TweenLite.set(subcardContent, {
// height: "100%"
// })
// TweenMax.to(subcardContent, Card.animation.articleTransition, {
// TweenLite.to(subcardContent, Card.animation.articleTransition, {
// height: targetHeight + "px"
// })
}
@ -1270,7 +1270,7 @@ export default class Card {
}
let desiredBorderBottomWidth = parseInt(window.getComputedStyle(titlebar).borderBottomWidth)
TweenMax.to(clone, Card.animation.articleTransition, {
TweenLite.to(clone, Card.animation.articleTransition, {
x: -padding,
y: -padding,
ease: ExpoScaleEase.config(scaleX, 1),
@ -1282,10 +1282,10 @@ export default class Card {
onUpdateParams: ['{self}'],
onUpdate: (self) => {
let transform = self.target._gsTransform
TweenMax.set(title, {
TweenLite.set(title, {
scale: 1 / transform.scaleX
})
TweenMax.set(titlebar, {
TweenLite.set(titlebar, {
height: start.height * 1 / transform.scaleY
})
@ -1294,7 +1294,7 @@ export default class Card {
}
})
TweenMax.to([articleClone], this.animation.articleTransition / 2, {
TweenLite.to([articleClone], this.animation.articleTransition / 2, {
delay: this.animation.articleTransition / 2,
autoAlpha: 1
})
@ -1327,11 +1327,11 @@ export default class Card {
let titlebarStyle = window.getComputedStyle(previewTitlebar)
let titlebar = clone.querySelector(".titlebar")
TweenMax.to(titlebar, this.animation.articleTransition, {
TweenLite.to(titlebar, this.animation.articleTransition, {
height: parseInt(titlebarStyle.height)
})
TweenMax.to(articleClone, this.animation.articleTransition / 2, {
TweenLite.to(articleClone, this.animation.articleTransition / 2, {
autoAlpha: 0
})
@ -1341,13 +1341,13 @@ export default class Card {
}
if (this.dynamicHeight) {
TweenMax.to(subcardContent, this.animation.articleTransition, {
TweenLite.to(subcardContent, this.animation.articleTransition, {
height: "100%"
})
}
TweenMax.set(card, { autoAlpha: 1, css: { maxWidth } })
TweenMax.to(clone, this.animation.articleTransition, {
TweenLite.set(card, { autoAlpha: 1, css: { maxWidth } })
TweenLite.to(clone, this.animation.articleTransition, {
x: localOrigin.x - padding,
y: localOrigin.y - padding,
scaleX,
@ -1356,7 +1356,7 @@ export default class Card {
rotation: angle,
onComplete: () => {
// article.remove()
TweenMax.to(clone, this.animation.fade,
TweenLite.to(clone, this.animation.fade,
{
//delay: 0.2,
autoAlpha: 0,
@ -1373,11 +1373,11 @@ export default class Card {
onUpdate: function (self) {
let transform = self.target._gsTransform
TweenMax.set(title, {
TweenLite.set(title, {
scale: 1 / transform.scaleX
})
TweenMax.set(titlebar, {
TweenLite.set(titlebar, {
height: original.height * 1 / transform.scaleY
})
@ -1508,7 +1508,7 @@ export default class Card {
// TODO: What is this good for?
// let article = parsedHTML.querySelector('article')
// card.insertAdjacentElement('afterbegin', article)
// TweenMax.set(article, { autoAlpha: 0 })
// TweenLite.set(article, { autoAlpha: 0 })
Card.expandIndexCard(card, parsedHTML, 'article', relativeSource, saveCallback)
}

Loading…
Cancel
Save