Exit
  • Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
  • 한국 커뮤니티
0

Custom Symbol Type Class

New Here ,
May 29, 2020 May 29, 2020

I'm looking for a way to designate a custom javascript class for instantiated symbols.  I have developed/coopted a hacky way to associate programattically instantiated symbols with a specific javascript class, but I can't seem to force Animate to use my classes for timeline-instantiated instances. 

Does anyone know if this is possible?  Or at least a way to catch when a certain type of symbol has been instantiated on the timeline?

646
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
May 29, 2020 May 29, 2020

What exactly do you mean by designating a class for symbols? All symbols already derive from the CreateJS MovieClip class. JavaScript doesn't support multiple inheritance, so if you want to bolt some custom methods to all symbols, just add them to MovieClip.

 

http://phrogz.net/js/classes/ExtendingJavaScriptObjectsAndClasses.html

 

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
May 30, 2020 May 30, 2020

I've successfully extended  the class, the problem is I can't get Animate to use my custom class when it creates symbol instances in the timeline.   

Right now, I have linked a class to a symbol in Animate, gotten a reference to the linked class from the library, extended the linked class, and then replaced createJs's reference to the linked class in the library object.  When I instntiate a copy of the symbol in js, it uses my custom class straight from the Library object, but when it's instantiated by the timeline, it's still using the original linked class.  

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
May 30, 2020 May 30, 2020

Yikes. Why aren't you just adding to the base class, like this?

createjs.MovieClip.prototype.test = function() {
	alert(this);
}

Works perfectly for runtime and timeline instantiated symbols.

 

What do you even need this for anyway? What functionality are you adding that must exist as a method of every single symbol in the project? A procedural library that accepts symbol references as arguments would probably do the job just as well.

 

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
May 30, 2020 May 30, 2020

Well, simply put, I've been tasked with finding ways to adapt old class-based actionscript libraries.  The intent is to compile typescript and/or es6 into regular js files which are then picked up by animate. There are a few additional requirements, but needless to say, it is not just a matter of adding a few methods to the movieclip class here or there, but also a desire for the OOP features/architecture, as well as not having to manually copy and paste the scripts into an action window in animate with every transpile.  

In order to make them programatically instantiate, I was able to get access to the library object and replace the linked class with an extended version of itelf.  If  I could find where the timeline is storing its classes (it doesn's seem to look at the library object that I have access to), I could pull the same maneuver there and write a class binding script to run at the beginning.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jun 02, 2020 Jun 02, 2020
LATEST

To answer your question, why do we even need this, we are converting instructional materials from AS3 to HTML5/Canvas. The specific use case in the AS3/SWF environment was to have a master FLA containing a library symbol with a linked AS3 class, which extended MovieClip and had its own constructor, methods, and properties, which referred to internal named stage movieclip instances amongst other things. The main symbol would be copy/pasted onto the stage of many other FLAs (usually only one instance per FLA) and the timeline scripts in those FLAs would command the symbol to do different things by calling the symbol's methods and properties.  We are now migrating that AS3 content to HTML5/Canvas and are presuming that we can make Global Include js files work in a similar fashion to AS3 linked classes by extending the symbol's class.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines