gaggo
Premium-
Posts
52 -
Joined
-
Last visited
Content Type
Profiles
Forums
Store
Blog
Product
Showcase
FAQ
Downloads
Everything posted by gaggo
-
OK, just renewed my membership, I had an outdated copy of "gsap-bonus.tgz". All good now!
- 1 reply
-
- 2
-
Hi there! I have been happily using Draggable in combination with ThrowPropsPlugin for a while, and wanted to migrate my code to the new GSAP V.3 now. I found out that the ThrowPropsPlugin has been succeeded by the InertiaPlugin – but it seems like it's not part of my premium download package (yet)? Can someone point me to a complete migration instruction? I'm using the archive "gsap-bonus.tgz" with NPM. Basically, I want to use it like seen here, but with npm and proper imports from 'gsap': https://codepen.io/GreenSock/pen/zDwEk Thanks a lot!
-
Wow Zach, things can be so simple!! This is what totally solved it for me: tweenMousePosition(newPos) { gsap.to(this.mousePos, 0.8, { x: newPos.x, y: newPos.y, onUpdate: () => this.adjustMask(), ease: "power4.out", overwrite: "auto" }); } Thanks so much for your help!!
-
Ah, I see... in the quickSetter mouse follow example, I can see the good old dummy ease I always used back in the days: pos.x += (mouse.x - pos.x) * speed; pos.y += (mouse.y - pos.y) * speed; So no more support for GSAP's great easing functionality? I especially love `CustomEase` ...
-
Hi Zach, thanks for your swift answer! I made a pen with gsap 2.x: https://codepen.io/hirasso/pen/yLeaYwR Basically I want the position of my mouse (or devicemotion on mobile) not to be applied immediately, but rather with gsap's great easing capabilities. I'd like to migrate this to GSAP V.3
-
Hi there, I used to use TweenMax.updateTo() like described here: https://greensock.com/docs/v2/TweenMax/updateTo() How would I solve this using the new gsap Version 3? I'm using npm with the bonus packages.
-
OK, I found the solution: Browserify expects commonJS modules Babelify runs before the final Browserify process and converts all es6 modules to commonJS – files inside node_modules are ignored by default GSAP V2 uses es6 modules and resides inside node_modules, which caused the errors Adding this to the package.json of the npm GSAP solves this: "browserify": { "transform": ["babelify"] } Could you please put this inside by default? Could save a lot of people some trouble.
-
...This also creates problems when I use premium plugins like the ThrowPropsPlugin. I have to re-write this line: import { TweenLite, _gsScope, TweenPlugin, Ease } from "gsap/TweenLite.js"; to import { TweenLite, _gsScope, TweenPlugin, Ease } from "../gsap/TweenLite.js"; ...making it also reference the relative folder outside the default node_modules location.
-
Hi there, I'm having problems once again with babelify and gsap. When importing any file from gsap: import TweenLite from 'gsap/TweenLite'; ...I keep getting this error in the console: SyntaxError: 'import' and 'export' may only appear at the top level (22:0) while parsing [...]/node_modules/gsap/TweenLite.js [...] is my local path. The file exists. It works just fine, if I copy the full gsap folder in my project and reference it relatively: import TweenLite from '../gsap/TweenLite'; This is not related to the many issues in the internet, that are being solved by installing `babel-preset-es2015`. (One example: https://github.com/babel/babelify/issues/157#issuecomment-188146766)
-
Hi Craig, ok thank you, I think in this case I will have to write a callback function for the snap property and determine which element is closest to the value. Thanks again for your hints!
-
Hi there, just got a club license to use the amazing ThrowPropsPlugin in combination with `draggable` and `type`:`scroll`. Now I would very much like an option to make the scrolling snap to certain elements, if flicked. Is there an option or approach for this?
-
Thanks guys, your work is greatly appreciated! I sometimes work without a decent internet connection, that's why I tend to import everything locally. But you are right, using a CDN for the production site totally makes sense. Again, thank you!!
-
Yes, I saw your post over at GitHub. Thanks so much for trying to work it out!
-
Hi Jack, so this is the reply that I got from the guys over at browserify: https://github.com/substack/node-browserify/issues/1686#issuecomment-279503986 They claim it's gsap, you say it's browserify... I would be happy to help, but sadly I am not firm enough for that kind of thing.
-
So – I somehow "fixed" the problem. I replaced this line in both files: import TweenLite from 'gsap'; with import 'gsap/TweenMax'; Any idea why?
-
If you are interested, you can test it yourself. I am really puzzled about this. browserify assets/js/script1.js -o dist/js/script1.js -t babelify browserify assets/js/script2.js -o dist/js/script2.js -t babelify ...and here are the two source files: https://rassohilber.com/debug/tweenlite/assets/js/script1.js https://rassohilber.com/debug/tweenlite/assets/js/script2.js When I switch out the order of the two scripts are embedded in my html page, the last included always doesn't work. `TweenLite` is only an empty object in the second included file.
-
OK, thanks again for your feedback. I will report back as soon as I have found out about what happens there.
-
Thanks for your response! I just set up another test, using Flickity twice from two different files: https://rassohilber.com/debug/flickity/ This works without any problems. Maybe this helps finding the solution?
-
Hi there, I set up a test case on my server: https://rassohilber.com/debug/tweenlite/ There are two scripts included on the page, both importing TweenLite from the same npm gsap package. The first animates the .el-1, the second should animate .el-2. If you open the console, you see what I mean (the second script errors). Sorry for saying, TweenLite pollutes the global namespace. I didn't really know what I was talking about there EDIT: I should maybe add that I am using watchify with babelify transform. EDIT #2: ...but the babelify transform doesn't make a difference, just tested it without it.
-
Hi there, I have two javascript-files in my included in my html page, each calling this in it's beginning: import TweenLite from 'gsap'; Later, when I try to call the TweenLite.to function, I get this error in the second file that I include in my html: Uncaught TypeError: Cannot read property 'to' of undefined at bodyScroll (app.js:692) at HTMLAnchorElement.<anonymous> (app.js:640) at HTMLDocument.dispatch (jquery.js:5201) at HTMLDocument.elemData.handle (jquery.js:5009) Any ideas? EDIT: It seems like TweenLite pollutes the global namespace. Shouldn't this never be the case with browserify?
-
Hmm, so just now, I recieved my first digest, without changing anything Anyways, thank you!
- 7 replies
-
- directionalrotation
- transform
-
(and 1 more)
Tagged with:
-
Hi Carl, thanks so much for your explanations! About the notifications: I checked all my spam-folders and couldn't find any mails from greensock.com. Also, my Notifications indicator on my profile page showed "NOTIFICATIONS (0)", although you had answered, If I remember correctly. I had to go over "Topics" and then go to this post to find out you had answered me. Maybe it's me, maybe a bug... You never really know P.s.: Another Bug I have when posting here: The whole screen fills with the following message: "Warning: Illegal string offset 'post' in /home/greensoc/public_html/forums/hooks/StopSpamAjax_435022f28bbe04c34c3a760af68881c7.php on line 53 Warning: Illegal string offset 'post' in /home/greensoc/public_html/forums/hooks/StopSpamAjax_435022f28bbe04c34c3a760af68881c7.php on line 53 Warning: Illegal string offset 'post' in "
- 7 replies
-
- directionalrotation
- transform
-
(and 1 more)
Tagged with:
-
Hmm ok, I see... Can you tell me the order in which the transforms are applied? I would need to rotate first and translateX/translateY later. P.s.: Thanks for the tip with the transform order, didn't know that! P.P.s: Is there a way to get email notifications for posts I am following here in the forum?
- 7 replies
-
- directionalrotation
- transform
-
(and 1 more)
Tagged with: