20 Replies Latest reply: Nov 15, 2014 10:22 PM by ianaa RSS

    Targeting a nested symbol's timeline?

    kalibahlu Community Member

      Hello, I'm new to Edge, Javascript and HTML5 (coming from Director/Flash/After Effects background) I'm wondering if there's a way to target a nested symbol from a button. I would like to make a simple Pause/Play toggle button that stops a nested symbol is it's playing and plays it if is stopped. In software's I'm familitar with, this can be done with a simple target path and  if/else conditional statement, but I can't find any examples that don't seem much more complicated. If you don't mind, could you please be specific as to where the code goes, as I'm new to this and don't yet have a grasp of the file structure? Thank you very much, I really appreciate your help

        • 1. Re: Targeting a nested symbol's timeline?
          sarhunt Employee Hosts

          Hey,

           

          To access the timeline of a nested symbol, use the following in your event:

          sym.getSymbol("symbolName").getSymbol("nestedElementName").play();


          You can also access elements within a nested symbol from the stage. For example:

          sym.getSymbol("kitten_1").getSymbol("kitten_paw").$("paw").hide();// Hides the element “paw” from within a nested symbol

           

          Hope that helps!

          Sarah

          • 2. Re: Targeting a nested symbol's timeline?
            kalibahlu Community Member

            Thank you so much, Sarah! You rock !

            • 3. Re: Targeting a nested symbol's timeline?
              sarhunt Employee Hosts

              No problem, good luck with your project!


              Sarah

              • 4. Re: Targeting a nested symbol's timeline?
                elecstraw

                This clarified things for me as well; thanks Sarah.

                 

                I am also new to JS and Jquery.  How would you target the parent of a nested symbol from the child of that symbol.  And also...  how would you then target an alternate nested symbol of the parent... and ultimately the child of that nested symbol... if you see what I mean

                 

                I have a button on the stage and wish to have another symbol(Symbol A) change position (tween) when the button is pressed.  At the same time I wish to start the timeline of one of Symbol A's nested symbols.

                 

                Getting myself notted up with the syntax.

                 

                Hope you can help.

                 

                Thanks

                 

                Andrew

                • 5. Re: Targeting a nested symbol's timeline?
                  sarhunt Employee Hosts

                  Hey Andrew,

                   

                  You'll probably be able to do all those things with the code below.

                   

                   

                  Access the a symbol timeline within another symbol

                  To access another symbol element from within a symbol, use the following in your event:

                  sym.getComposition().getStage().getSymbol("symbolName").play(); // Gets the stage from the composition level, then gets the symbol and plays the timeline

                   

                  To access a nested symbol timeline from within a symbol, use the following:

                   

                  sym.getComposition().getStage().getSymbol("symbolName1").getSymbol("symbolName2").play(0); // Gets the stage from the composition level, gets the parent symbol, then gets the nested symbol timeline

                   

                  You can access elements from within a symbol timeline from within another symbol. For example:

                  sym.getComposition().getStage().getSymbol("kitten_1").$("kitten_paw").hide(); // Gets the symbol element “kitten_1” and hides the element “kitten_paw”

                   

                  Access a nested symbol timeline from another symbol

                  To access the timeline of a nested symbol, use the following in your event:

                   

                  sym.getComposition().getStage().sym.getSymbol("symbolName").getSymbol("nestedElementName") .play();

                   

                  You can also access elements within a nested symbol from the stage. For example:

                  sym.getComposition().getStage().sym.getSymbol("kitten_1").getSymbol("kitten_paw").$("paw") .hide(); // Hides the element “paw” from within a nested symbol

                   

                  Hope that helps!


                  Sarah

                  • 6. Re: Targeting a nested symbol's timeline?
                    elecstraw Community Member

                    Thanks Sarah,

                     

                    I will give it a go...

                     

                    If an element is on the stage... for example a button (but1) .  Can you reference a symbol (symbol1) on the stage directly... so:

                     

                    sym.getSymbol("symbol1").play();

                     

                    or do you have to go back up to the composition and stage levels for any symbol on the stage.?

                     

                    Andrew

                    • 7. Re: Targeting a nested symbol's timeline?
                      elecstraw Community Member

                      Success...

                       

                      Many thanks Sarah... managed to get my syntax right.

                       

                      Andrew

                      • 8. Re: Targeting a nested symbol's timeline?
                        tfbkny Community Member

                        Love new features for which most of us shower you with kudos from all sides... that said you know we are a bunch of demanding scoundrels! ;D

                         

                        So, in the interest of moving past the congratulatory phase for a milestone worthy of a good pat on the shoulder for a job well done...

                         

                        - I wish there was a more visual way to target all existing symbols and elements without having to do all the singing and dancing each time... could be (or not) similart to the targeting in flash although I'd prefer a dropdown listing all the "targetable" elements and symbols (absolute and relative). That would be a really a huge help to avoid the trial and error process that is needed each time to get the target to respond to the properties being added or code being attached.

                         

                        - I also wish that Edge had a way to autocomplete instructions with multiple selectable suggestions (like in intelliJ IDEA et sim IDEs) where code from the linked APIs (Edge, jQuery, custom added ones) would be selectable as the code is being typed by triggering the autocomplete using a modifier key

                         

                        - Also snippets that could be reused over and over could prove very helpful... is there a way (other than keeping a manual archive in a commented-out code on an unused symbol) tha could serve that purpose?

                         

                        Lastly I've found scoping issues and I don't know if that has anything to do with targeting... but for instance, I could not define and use variables in a symbol unless I had declared on the stage on creationComplete. Just to give you an example: I could not do a simple var myVar=0; myVar++; alert (myVar); "inside" a symbol used as a button responding to a click event. Using the letter "i" withing that click event (since "i" it's likely already declared somewhere in the javascript API, would be perfectly fine as long as not "re-declaring it" using "var". The variable myVar could be used without issues once declaring it on Stage upon creationComplete as var myVar = 0;

                         

                        ...and as usual thanks for keeping up the awesome work!

                         

                        Cheers

                        tfbkny

                        • 9. Re: Targeting a nested symbol's timeline?
                          Lloydie73 Community Member

                          sarhunt, this makes perfect sense to me - but I cannot apply it in my project!

                           

                          stage

                               symHint2

                                    btnClose

                           

                          so btnClose is a symbol inside symHint2. I want btnClose to hide symHint2. so in the actions-for-btnClose panel, I have:

                           

                          sym.getSymbol("symHint2").hide();

                           

                          based on your logic. alas: no joy. can  you see what I cannot?

                          • 10. Re: Targeting a nested symbol's timeline?
                            resdesign CommunityMVP

                            I believe you should use"

                            getComposition().getStage().$('symHint2').hide();

                            • 11. Re: Targeting a nested symbol's timeline?
                              Lloydie73 Community Member

                              hi redesign,

                              This also makes sytactical sense, but alas: no joy

                              ea_dump.png

                              • 12. Re: Targeting a nested symbol's timeline?
                                resdesign CommunityMVP

                                Oops. Sorry. Add sym. To the beginning!

                                sym.getComposition()...

                                • 13. Re: Targeting a nested symbol's timeline?
                                  Lloydie73 Community Member

                                  viola! thanks a bunch.

                                  • 14. Re: Targeting a nested symbol's timeline?
                                    resdesign CommunityMVP

                                    Sorry for the mistake. I was not paying attention! Glad it works. :)

                                    • 15. Re: Targeting a nested symbol's timeline?
                                      Lloydie73 Community Member

                                      lol. thank you. so just so I have the right idea:

                                       

                                      sym.                    getComposition()      getSymbol()     $("......")

                                       

                                      namespace          root                          stage               jQuery object        

                                       

                                       

                                      or thereabouts?

                                      • 16. Re: Targeting a nested symbol's timeline?
                                        Noura

                                        Sarah, what if I want to get symbol from another composition, I've been stuck for days and I didn't find a thing.. any idea ?!

                                        • 17. Re: Targeting a nested symbol's timeline?
                                          ssshammi Community Member

                                          Hi i have a similar doubt, i have multiple symbols on stage and i name them btn1,btn2, etc. then how do i get the name of the current clicked symbol. can i do sym,e e.target.name ?? and if this is nested and i want to know its parents name, then how do i solve this problem. thanks again

                                          • 18. Re: Targeting a nested symbol's timeline?
                                            Pattitag

                                            I see that this discussion has been going on for awhile, but I am having difficulty with the animation of my nested symbols.

                                            On the main timeline- frame 00, I added: sym.getSymbol("ant").getSymbol("ant2").play();, on the frame where the main timeline stops, I added this: sym.getSymbol("ant").getSymbol("ant2").stop(); I tried just adding the stop and nothing changes.

                                             

                                            This code stops the nested animation entirely.

                                             

                                            I have several instances of this symbol on the stage with unique instance names. I want the nested animation to stop when the main timeline stops.

                                            Is there code that can call all instances of the same nested symbol without having to duplicate the code for each instance.

                                             

                                            Thanks for you help!

                                            • 19. Re: Targeting a nested symbol's timeline?
                                              resdesign CommunityMVP

                                              The code you wrote seems fine to me. So I am not sure why it is not worknig. Another way would be to use the play and stop directly on the timeline. Here is a sample.

                                              Sample with symbol and timeline stop.zip - Box

                                              • 20. Re: Targeting a nested symbol's timeline?
                                                ianaa

                                                My question is the same, however I don't understand the answer given.  I too need to toggle hide/show states of a nested element in a symbol with another different symbol.  I understand how to hide/show nested elements, but I want to toggle these with other symbols on the timeline.  Something like this..???:

                                                 

                                                if (sym.$("nested symbol element").is(":visible")) {

                                                  sym.$("another symbol").hide();

                                                } else {

                                                  sym.$("nested symbol element").show();

                                                }

                                                 

                                                This is all completely new to me so I'm not even sure if you need some kind of if statement....Basically, I just was to an element to remain at a certain state on a click but then turn back to its previous state with another click. ie.,there is a dim light bulb shown a page.  When you mouseover it it starts blinking.  When you click on it lights up completely.  When you click again will go dim again until the next mouseover when the blinking starts...etc.

                                                 

                                                I hope this is clear, and I hope for some help...