Removed TweenMax dependency
This commit is contained in:
parent
17bbe1a90e
commit
ab835d6fc3
@ -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…
Reference in New Issue
Block a user