Skip to main content
S
stefan_zero
Participant
October 1, 2018
Answered

Using JSFL to Access the Snippets Panel

  • October 1, 2018
  • 3 replies
  • 1059 views

I can use JSFL to add an object from the Component Panel to my Animate CC project.  For example:

var componentPanel = 'User Interface'

var component = 'Button'

fl.componentsPanel.addItemToDocument({x:320, y:180}, componentPanel, component);

Is there a similar way to access the Code Snippets panel, so I can add a new layer with a snippet to my timeline?

    This topic has been closed for replies.
    Correct answer ClayUUID

    The one thing I was curious about was how snippet scripts generate an instance name for unnamed clips. Turns out the code for it is in Configuration\CodeSnippets\SetInstanceName.xml. The magic words are:

    fl.getDocumentDOM().getDataFromDocument("defaultNewInstanceName");

    And no, this is not mentioned in the official documentation. Interesting to know!

    3 replies

    JoãoCésar17023019
    Community Expert
    JoãoCésar17023019Community Expert
    Community Expert
    October 3, 2018

    Hi.

    The Code Snippets Panel is in fact a Window SWF panel. The same type used by custom extensions/panels.

    Check page 486 from the oficial JSFL API doc.

    I cannot give you a definitive answer of how to call methods from it directly, but in the example below you'll see how you can create a reference to it and access some files and folders that are used by this particular panel.

    Again, I'm just trying to give you a hint. You'll have to inspect all the files and try to figure it out yourself how to correctly call the functions you need.

    Example:

    var codeSnippetsJSFLFile = fl.commonConfigURI + "CodeSnippets/CodeSnippets.jsfl"; // JSFL file used by the Code Snippets panel
    var codeSnippetsFolder =  fl.configURI + "CodeSnippets"; // folder where the XML files used by the Code Snippets panel are located
    var stringsXMLFile =  fl.configURI + "CodeSnippets/CodeSnippetsStrings.xml"; // this XML stores warning messages for the user
    var stringsXML =  XML(FLfile.read(fl.configURI + "CodeSnippets/CodeSnippetsStrings.xml")); // read the above XML content
    var codeSnippets;
    fl.trace(codeSnippetsJSFLFile);
    fl.trace(codeSnippetsFolder);
    fl.trace(stringsXMLFile);
    fl.trace(stringsXML);
    if (fl.swfPanels.length > 0)
    {
         for (var i = 0; i < fl.swfPanels.length; i++)
         {
              if (fl.swfPanels.path.split("\\").pop() == "Code Snippets.swf")
              {
                   codeSnippets = fl.swfPanels; // get the Code Snippets panel
                   fl.trace(codeSnippets);
                   fl.runScript(codeSnippetsJSFLFile, "createNewSnippet"); // poor call of a function that is used by the panel
                   break;
              }
         }
    }

    I hope this helps.

    Regards,

    JC

    C
    ClayUUIDCorrect answer
    Legend
    October 3, 2018

    The one thing I was curious about was how snippet scripts generate an instance name for unnamed clips. Turns out the code for it is in Configuration\CodeSnippets\SetInstanceName.xml. The magic words are:

    fl.getDocumentDOM().getDataFromDocument("defaultNewInstanceName");

    And no, this is not mentioned in the official documentation. Interesting to know!

      C
      ClayUUID
      Legend
      October 1, 2018

      Why use such an indirect approach? JSFL allows adding any arbitrary code directly to a clip's Actions without having to go through the Snippets.

      frame.actionScript

      Availability

      Flash MX 2004.

      Usage

      frame.actionScript

      Description

      Property; a string that represents ActionScript code. To insert a new line character, use "\n".

      Example

      The following example assigns stop() to first frame top layer action:

      fl.getDocumentDOM().getTimeline().layers[0].frames[0].actionScript = 'stop();';

      S
      stefan_zeroAuthor
      Participant
      October 2, 2018

      Hi ClayUUID,

      Thank you for your response.   Actually, I already have written JSFL functions that can read code from files and insert them into any MovieClip that has been given an Instance Name.

      So let me back up a step to explain why I want to access the Code Snippets Panel directly.  In our projects, we have been writing my custom Code Snippets that do some quite powerful features, such as making Movie Clips touch-scrollable with custom scroll bars, that makes the Animate CC Canvas behave similar to DOM scrollable elements with inertia.

      Our goal is to write JSFL Scripts (programs) that will insert the latest version of our custom Code Snippets into particular MovieClips, so we can automate our testing procedure.  Therefore, I need programmatic access to the Code Snippets panel.

      According to klad's response before yours, there is probably not a documented way to use JSFL to access the Code Snippets panel, but perhaps someone knows of an undocumented (backdoor) way to get a reference to that object.

      Thanks.

      C
      ClayUUID
      Legend
      October 2, 2018

      I'm curious why you're even using custom snippets, when JSFL is all-around more capable and more directly accessible from the UI.

      kglad
      Community Expert
      kgladCommunity Expert
      Community Expert
      October 1, 2018

      you can add custom scripts to the snippet panel, Add interactivity with code snippets in Animate CC

      S
      stefan_zeroAuthor
      Participant
      October 1, 2018

      That wasn't exactly the question I was asking.

      I know I can use the Animate CC GUI to double click an item in the Code Snippets panel to get it to be added to my Animate CC project.

      I am looking for a way to write a JSFL function that I can use to pass in a parameter for a particular Code Snippet that I would like to add to my project.

      kglad
      Community Expert
      kgladCommunity Expert
      Community Expert
      October 1, 2018

      i don't think animate jsfl has been updated since there's been a snippets panel so the answer is either no, it's not reference-able, or you'll need some trial-and-error to find a reference

      Firefly Community Gallery
      Adobe Firefly

      Remix with Firefly Community Gallery

      Thousands of free creations to fall in love with and remix in Firefly.

      Explore now
      Terms & ConditionsAccessibility statement
      Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices