diff --git a/lib/card/card.js b/lib/card/card.js index d47fcf4..374c0f3 100644 --- a/lib/card/card.js +++ b/lib/card/card.js @@ -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) }