Jump to content
Search Community

How to detect if EasePack was already loaded on the page

Randall test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

What is the most reliable and efficient way to detect if EasePack JS file was already loaded elsewhere on the page and is available (in an effort to prevent loading it again)?

 

[EDIT: also, detecting if the various plugins were loaded too would be helpful]

Link to comment
Share on other sites

Hey Randall,

 

Nice to see you in here;)

 

I'm sure Jack might have a better more efficient approach, but for now I'm thinking you could just test for the existence of an ease that is unique to EasePack and GSAP.

 

Something like:

 

 

if(SlowMo){
console.log("EasePack loaded");
}else{
console.log("EasePack not loaded");
}

 

if you want to get around any "uncaught exception errors blah blah not defined" this should work too:

 

 

try {
var easePackIsLoaded = SlowMo;
easePackIsLoaded = true;
} catch (err) {
var easePackIsLoaded = false;
}
if (easePackIsLoaded) {
console.log("EasePack is loaded");
} else {
console.log("EasePack is NOT loaded");
}

 

I'm sure you know this, but just putting it out there, EasePack is included with TweenMax.js

 

As for checking the existence of a plugin, I'll let Jack chime in.

 

 

-c

Link to comment
Share on other sites

To make things consistent with the Flash version, we put each class at the reverse domain package, so for example the Elastic class is at:

 

com.greensock.easing.Elastic

 

Same with the plugins. For example, you could see if the CSSPlugin was loaded by seeing if this exists:

 

com.greensock.plugins.CSSPlugin

 

EasePack is what contains the Elastic class, so you can check for that. And to be clear, "com" is an object at the window level, and "greensock" is an object that's a property of "com", etc. So to avoid errors you could do:

 

if (com && com.greensock && com.greensock.easing && com.greensock.easing.Elastic) {
   //loaded EasePack
}

 

Or create a function that makes it easier like:

 

//like isLoaded("com.greensock.easing.Elastic")
function isLoaded(class) {
   var parts = class.split("."),
       curPart = window;
   for (var i = 0; i < parts.length; i++) {
       curPart = curPart[parts[i]];
       if (!curPart) {
           return false;
       }
   }
   return true;
}

 

Does that help?

Link to comment
Share on other sites

Briliant. Thank you. This is what I was looking for. And I'm always in favor of a wrapper method.

 

I was previously approaching it from a non-class perspective and simply trying to see if 'something' was undefined or not.

 

Also, I was making the assumption that once a class was detected that it is also immediately ready for use because it was immediately invoked.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...