How to add a symbol to the stage with a unique click function

I created a symbol in the Library and am loading multiples of it based on json data. However, I want to give each one a unique click function based on the json data. For example if you are the 4th symbol, you should change the color of another symbol when clicked. However, if the 5th symbol is clicked, it should be a different color. And so on.

What I would do:
add a class name for each symbol in your json file or on symbol creation.
Then use each class name and assign it a click event.
to assign a unique id or class to symbol you create use:
for (var i=0;i<data.length;i++){
var el = sym.createChildSymbol("pEl", container);
el.element.attr("id","newEl"+i);
// or for a class use el.element.addclass('className'+i);
Note when using the new id make sure you add  # in name
example
sym.$('#pEl'+i).......
and a dot for the class name
sym.$('.className'+i) ..............

Similar Messages

  • How to add a symbol to the beginning of a project?

    I have a pretty intricate Animate composition.  I want to add a simple Symbol/Animation at the beginning.  I've tried inserting time and it did nothing.  Basically, I just want to shift everything over a couple of frames.  I thought of turning the balance of the composition into a symbol, but a lot of the interactivity is based on Labels on the stage's main timeline, and it breaks when I try to convert to a symbol.  I'm not sure what I'm missing here?  Any help would be truly appreciated!
    Thanks!
    Jon

    Hiya Res,
    I will definitely give it another shot.  I tried that, but I think I might've given up too easily .  I'll let you know how it works out. 
    Thanks!

  • How to add actions only when the stage playhead passes a label/certain time?

    I have an animation that is 2 seconds long. On the 1 sec mark there is sym.stop(); and a label called 'in'. At the 2 sec mark there is another sym.stop();
    So what I want to happen is for the animation to play up until 'in', then on mouseenter for the stage have sym.play();, and on mouseleave sym.playReverse();. This will make it so that only the second half of the animation will get played on mouseenter/leave.
    My problem is that the mouseenter/leave also gets applied to the first half of the animation, not allowing the second half to animate if the user mouses over during the first half. I know this requires an if statement but I don't know how to write it. So it would be something like this: if the playhead reaches 'in', apply mouseenter/leave actions.

    yes, I am. By the way I've found the solution. Someone might find this usefull.
    In design.xml having
    <component name="ExtendedTextInput" namespace="mynamespace" category="beta" displayName="ExtendedTextInput"/>
    use this
    <component name="ExtendedTextInput" namespace="mynamespace" category="beta" displayName="ExtendedTextInput">
            <defaultAttribute name="text" value="ExtendedTextInput"/>
        </component>
    so when adding this component to design view, it will have text setted to value ('ExtendedTextInput' in this case).

  • How to add a symbol in the table control

    Hi Experts,
    I have  created a Table control and want to insert a Symbol in a column and also want it to be interactive. That means when that symbol is being clicked it should perform some action.
    Your help is appreciated. This is a little urgent.
    ~Sid
    "Max points are guarenteed"

    Hi,
    Create a pushbutton in table control by dragging it from tool and place it in table control.And then set the name for that pushbutton.Make that push button field as output only field by check/mark -ing  a check box of output field in program tab of screen attributes .Now the icon check box for that field will be active .Mark/check that <b>icon</b> check box as well.Once you done this ,then in Loop endloop of table control in PBO do the code like this.
    Process Before Output.
      LOOP AT   it_t001l INTO x_t001l WITH CONTROL tc CURSOR tc-current_line.
        MODULE tc_get_lines.
      ENDLOOP.
    MODULE tc_get_lines OUTPUT.
    IF x_t001l-status  = 'X'.
        CALL FUNCTION 'ICON_CREATE'
        EXPORTING
          name                         = 'ICON_OKAY'
         info                             = 'Completed'
       IMPORTING
         RESULT                      =  x_t001l-change .  
    *----- x_t001l-change -
    > name of the push button in table control
      ELSE.
        CALL FUNCTION 'ICON_CREATE'
       EXPORTING
         name                        = 'ICON_MASS_CHANGE'
          info                        = 'Partial'
      IMPORTING
        RESULT                      =  x_t001l-change .
      ENDIF.
      g_tc_lines = sy-loopc.
    ENDMODULE.                    "TC_GET_LINES OUTPUT
    In top include
    DATA:BEGIN OF x_t001l.
            INCLUDE STRUCTURE t001l.
    DATA:sel,
    <b>change(60),   "</b>  ---> name of push button
         END OF x_t001l.

  • How do you remove a symbol from the stage in Edge animate?

    Hello-
    I'm wondering how to remove a symbol from the stage in Edge Animate so you can jump to another place in the timeline.  In Flash, the symbol was only on the stage for the amount of frames you indicated.  Not sure how it works here.
    For example, I have 2 buttons on my first screen with some text that animates in.  I want the button click to take the user to another section in the timeline or (basically another scene, like in Flash)  that contains different content.  If I change the visibility the buttons are still there and will ( I assume) create problems when other elements are placed on top. 
    Or is the only way with code.  If that is the case what would that code be?
    I would appreciate any help.
    Thank you!

    What I usually do, is, once you have everything set up in the scene you are done with. highlight it all
    right click
    group elements in DIV
    Now all those items act as 1 group and then you give it a properties name, much like a symbol.
    THEN you can refer to that scene name and move it anywhere or hide it and slide in another scene that has the content for that next scene.
    basically you take all the elements that make up 1 scene, gruop it up, name it, and then in the code for the button say something like:
    on click:
    scenename.play(framenumber);
    that will then animate that scene according to any animation you gave it, such as moving to the left, off stage. while moving scene 2 that you create into the stage.
    or just have something like this hide it
    sym.$("scenename").hide();
    sym.$("scene2name").show();
    but if you do that, make sure in your CompositionReady code you hide all scenes EXCEPT the 1st one, so the user doesnt see them all instanatly anyway.

  • JSON content - click to show another symbol on the stage

    Hi,
    Thanks to Zaxist I have a working code like the one below:
    $.getJSON("content.json",
              function(data){
                        for(var i=0; i<data.length; i++){
                        var s = sym.createChildSymbol("template","content");
                        s.$("title").html(data[i].title);
                        s.$("description").html(data[i].description);
                        s.$("seira").html(data[i].seira);
                        s.$("imageholder").css({"background-image":"url('"+data[i]. image+"')"});
                        s.$("imageholder").data('Large', data[i].largeimage);
                        s.$("imageholder").click("click", function(e){
                                                                sym.getComposition().getStage().$("finte").css({"background-image":"url("+$(this).data('L arge')+")"});
    Now, I am trying on the click function to show specific symbol on the stage, for example when click on the first item the symbol red will appear, if cliked the second item the (previous symbols that was appeared will be hided) and the new symbol blue will appear. An so on with all the other ellements that JSON files has.
    I tried this on the code, but nothing:
    $.getJSON("content.json",
              function(data){
                        for(var i=0; i<data.length; i++){
                        var s = sym.createChildSymbol("template","content");
                        s.$("title").html(data[i].title);
                        s.$("description").html(data[i].description);
                        s.$("seira").html(data[i].seira);
                        s.$("imageholder").css({"background-image":"url('"+data[i]. image+"')"});
                        s.$("imageholder").data('Large', data[i].largeimage);
                        s.$("imageholder").click("click", function(e){
                                                                sym.getComposition().getStage().$("finte").css({"background-image":"url("+$(this).data('L arge')+")"});
                                                                if (data[i]=3) {
                                                                                                                                                                                                                                                                sym.getComposition().getStage().$("red").show();
                                                                else {
                                                                sym.getComposition().getStage().$("red").hide();
                                                                if (data[i]=5) {
                                                                                                                                                                                                                                                                                                                             sym.getComposition().getStage().$("blue").show();
                                                                else {
                                                                sym.getComposition().getStage().$("blue").hide();
    Could you help me?
    Thanks in advanced!

    Zaxist please I need your help again.
    I have this:
    $.getJSON("images1.json",
              function(data){
                        for(var i=0; i<data.length; i++){
                        var s = sym.getSymbol("base").createChildSymbol("template", "content");
                        s.element.attr('id', 'basara'+i)
                                            s.getSymbolElement().css({"background-size":"contain",
                                               "float": "left",
    "margin": "100 125px 125px 100",
    "clearboth":"{ clear: both; }"
                        s.$("description").html(data[i].description);
                        s.$("code").html(data[i].code);
                        s.$("imageholder").css({"background-image":"url('"+data[i]. image+"')",
                                                                                                                                                                     "background-size":"cover"
                        s.$("imageholder").data('myIndex', i);
                                                                          s.$("imageholder").data('Large', data[i].image);
                         s.$("imageholder").click("click", function(e){
                                                                     if ($(this).data("myIndex") == 0){
    sym.getComposition().getStage().getSymbol('holders').$("holder1").css({"background-image": "url("+$(this).data('Large')+")"});
                            else if ($(this).data("myIndex") == 1) {
    sym.getComposition().getStage().getSymbol('holders').$("holder1").css({"background-image": "url("+$(this).data('Large')+")"});
                            else if ($(this).data("myIndex") == 2) {
    sym.getComposition().getStage().getSymbol('holders').$("holder1").css({"background-image": "url("+$(this).data('Large')+")"});
    $.getJSON("images2.json",
              function(data){
                        for(var i=0; i<data.length; i++){
                       var s = sym.getSymbol("podia").createChildSymbol("template", "contentpodia");
                                           s.getSymbolElement().css({"background-size":"contain",
                                               "float": "left"});
                        s.$("description").html(data[i].description);
                        s.$("code").html(data[i].code);
                        s.$("imageholder").css({"background-image":"url('"+data[i]. image+"')",
                                                                                                                                                                     "background-size":"cover"
                        s.$("imageholder").data('myIndex', i);
                                                                          s.$("imageholder").data('Large', data[i].image);
                         s.$("imageholder").click("click", function(e){
                                                                     if ($(this).data("myIndex") == 0){
    sym.getComposition().getStage().getSymbol('holders').$("holder2").css({"background-image": "url("+$(this).data('Large')+")"});
                            else if ($(this).data("myIndex") == 1) {
    sym.getComposition().getStage().getSymbol('holders').$("holder2").css({"background-image": "url("+$(this).data('Large')+")"});
                            else if ($(this).data("myIndex") == 2) {
    sym.getComposition().getStage().getSymbol('holders').$("holder2").css({"background-image": "url("+$(this).data('Large')+")"});
    I want to import symbol podia inside to base to handle it by content2.
    I am writing this:
    var basewithpodia = sym.getSymbol("base").createChildSymbol("podia", "content2");
    it places the symbol inside, without the data of the JSON file.
    How can I make it to work?

  • How to add one symbol in between the user give input.

    Hi,
         In my flash had the following code.
    import flash.events.TextEvent;
    tf.addEventListener(TextEvent.TEXT_INPUT, tfHandler);
    function tfHandler(e:TextEvent):void{
        trace(e.target.text.length);
        if(e.target.text.length == 2){
            e.target.appendText("-");
            stage.focus = tf;
            tf.setSelection(tf.text.length,tf.text.length);
         Like this How to do in AS2.?
    Thanks with,
    Viswa

    Use:
    tf.onChanged = function(){
        if(tf.length == 3){
           tf.text += "-";
           Selection.setSelection(tf.text.length, tf.text.length);

  • How to remove a dynamic symbol from the stage?

    I'm loading dynamically copies of a Library symbol with a button click. Question is, when I move around in the timeline, I don't want to see the symbols at certain points. Can I loop through the json file and remove each symbol from the stage? Or is there a better way of accomplishing this?
    Being new to Edge Animate, I'm also unsure as to the names of the symbols as they are placed on the stage. If I use the browser's developer tools, I can see that the divs are named Stage_90, Stage_91, Stage_92 etc. However doing something like the following does not seem to work:
    sym.$("Stage_90").hide();
    I appreciate the help. Thanks again.

    I got it. It should be:
    $("#region1").remove();  
    // # was missing.
    I actually added that to time 0 on the main timeline so when I got back there it removes the image.
    It's not working from the symbol yet but I guess I should eventually get it working from there instead.
    Thanks for your time.

  • How to target a label on the stage from a loaded composition

    from EdgeCommons I'm using EC.loadComposition to load another website into a container within EA.
    Now, from a button inside this loaded composition I would like to call a stop function to target a label on the main stage of the EA file.
    sym.getComposition().getStage().stop("scene4"); does not work.
    It think it has to go outside of sym because the composition container is actually an iframe.
    Thank you

    Hi,
    I think you may have replied to my post accidentally. I had asked a question regarding javascripts that could target the stage from a symbol, not about coloring book apps.  However I have made one in Flash, here is the page I made (don't laugh, I never finished it).
    http://boogerbunch.com/home.html
    Here is a link to the forum I used to get the Info to build it, I would think the process would be very close in edge.
    http://www.kirupa.com/developer/mx2004/coloringbook.htm
    Good luck!
    >>> scottsalter0 <[email protected]> 3/1/2013 10:29 AM >>>
    Adobe Community ( http://forums.adobe.com/index.jspa )
    Re: How to target a label on the stage from a div embedded in a symbol?
    created by scottsalter0 ( http://forums.adobe.com/people/scottsalter0 ) in Edge Animate - View the full discussion ( http://forums.adobe.com/message/5113759#5113759 ) 
    Hi there,
    I noticed your Edge Colouring Page post on the Adobe Forums.
    For my University work, I need to create a colouring page using Adobe Edge Animate. Is it possible if you could post a tutorial or step-by-step guide on how to do this please?
    Many Thanks
    Reply to this message by replying to this email -or- go to the message on Adobe Community ( http://forums.adobe.com/message/5113759#5113759 )
    Start a new discussion in Edge Animate by email ( mailto:[email protected] ) or at Adobe Community ( http://forums.adobe.com/choose-container!input.jspa?contentType=1&containerType=14&contain er=4823 )

  • How to add a report into the SAP-SCRIPT .using PERFORM ......ENDPERFORM

    My question is that How to add a report into the SAP-SCRIPT .
    by using PERFORM ......ENDPERFORM
    I don't know how to used it .

    Hi Sandeep,
    Please check this link
    http://help.sap.com/saphelp_40b/helpdata/en/d1/803279454211d189710000e8322d00/content.htm
    http://www.allinterview.com/showanswers/37425.html
    Calling ABAP Subroutines: PERFORM
    You can use the PERFORM command to call an ABAP subroutine (form) from any program, subject to the normal ABAP runtime authorization checking. You can use such calls to subroutines for carrying out calculations, for obtaining data from the database that is needed at display or print time, for formatting data, and so on.
    PERFORM commands, like all control commands, are executed when a document is formatted for display or printing. Communication between a subroutine that you call and the document is by way of symbols whose values are set in the subroutine.
    Syntax in a form window:
    /: PERFORM <form> IN PROGRAM <prog>
    /: USING &INVAR1&
    /: USING &INVAR2&
    /: CHANGING &OUTVAR1&
    /: CHANGING &OUTVAR2&
    /: ENDPERFORM
    INVAR1 and INVAR2 are variable symbols and may be of any of the four SAPscript symbol types.
    OUTVAR1 and OUTVAR2 are local text symbols and must therefore be character strings.
    The ABAP subroutine called via the command line stated above must be defined in the ABAP report prog as follows:
    FORM <form> TABLES IN_TAB STRUCTURE ITCSY
    OUT_TAB STRUCTURE ITCSY.
    ENDFORM.
    The values of the SAPscript symbols passed with /: USING... are now stored in the internal table IN_TAB . Note that the system passes the values as character string to the subroutine, since the field Feld VALUE in structure ITCSY has the domain TDSYMVALUE (CHAR 80). See the example below on how to access the variables.
    The internal table OUT_TAB contains names and values of the CHANGING parameters in the PERFORM statement. These parameters are local text symbols, that is, character fields. See the example below on how to return the variables within the subroutine.
    From within a SAPscript form, a subroutine GET_BARCODE in the ABAP program QCJPERFO is called. Then the simple barcode contained there (u2018First pageu2019, u2018Next pageu2019, u2018Last pageu2019) is printed as local variable symbol.
    Definition in the SAPscript form:
    /: PERFORM GET_BARCODE IN PROGRAM QCJPERFO
    /: USING &PAGE&
    /: USING &NEXTPAGE&
    /: CHANGING &BARCODE&
    /: ENDPERFORM
    / &BARCODE&
    Coding of the calling ABAP program:
    REPORT QCJPERFO.
    FORM GET_BARCODE TABLES IN_PAR STUCTURE ITCSY
    OUT_PAR STRUCTURE ITCSY.
    DATA: PAGNUM LIKE SY-TABIX, "page number
    NEXTPAGE LIKE SY-TABIX. "number of next page
    READ TABLE IN_PAR WITH KEY u2018PAGEu2019.
    CHECK SY-SUBRC = 0.
    PAGNUM = IN_PAR-VALUE.
    READ TABLE IN_PAR WITH KEY u2018NEXTPAGEu2019.
    CHECK SY-SUBRC = 0.
    NEXTPAGE = IN_PAR-VALUE.
    READ TABLE IN_PAR WITH KEY u2018BARCODEu2019.
    CHECK SY-SUBRC = 0.
    IF PAGNUM = 1.
    OUT_PAR-VALUE = u2018|u2019. "First page
    ELSE.
    OUT_PAR-VALUE = u2018||u2019. "Next page
    ENDIF.
    IF NEXTPAGE = 0.
    OUT_PAR-VALUE+2 = u2018Lu2019. "Flag: last page
    ENDIF.
    MODIFY OUT_PAR INDEX SY-TABIX.
    ENDFORM.
    Best regards,
    raam

  • How to add a symbol to existing keyframes

    I have completed a bunch of keyframes with 2 symbol on each moving around.  Now I want to add another symbol that will be static.  That is, at the same position in each keyframe.
    How can I add the new symbol to 250 keyframes that are already set and already have 2 symbols in each?
    I can see how to do it one by one... but there must be a better way than that.  selecting a herd of keyframes and pasting in the new symbol, ends up only effecting which ever one has the play head.
    I also realize I should have put this final symbol in at the start but too late now.  So how can I insert a new symbol in 250 keyframes all at once?

    Create a new layer for this new symbol.  Place the symbol in the first frame.  Right click the last frame on that layer where you want the symbol to extend to (250?) and select Insert Frame.

  • How to add a page in the SAP Scripts

    Hi All,
    I want to know how to add a page in the sap scripts. there is already sap script developed by some other person.
    Now I have to add a page in front of that and have to add some more data.I added a page in page windows but thats not at all working.
    Please help me out in this.
    Thanks,
    Praveen

    new page will create in sap scripts using new page command.
    you have to set condition like after some number of records displayed in page new page has to be trigger.
    ex:YOU HAVE SO MANY RECORDS FOR PRINTING BUT YOU WANT TO DISPLAY 100 RECORDS IN FIRST PAGE REMAINING IN SECOND PAGE LIKE THAT.
    Here you can use NEW PAGE COMMAND .
    IT IS OPPOSITE PURPOSE OF PROTECT AND ENDPOTECT.
    Reward if useful.

  • How to add log messages in the sever/webui objects?

    Hi,
    I am new to the OA Framework.
    Can any one share any information in how to add log messages in the sever/webui objects?
    What are the beans I need to use to show in the diagnostic page?
    Can I get sample code for this log staments?
    Thanks in advance,
    Padma

    Hello. This forum is for reporting problems with the published Oracle documentation. You have a better change of getting a reply if you post your question on the Database - General forum.
    Regards,
    Diana

  • How to add an item into the Newsstand

    How to add an item into the Newsstand.  Please do NOT reply using  "tech-language." Use standard- normal everyday English. Thanks,
    Don Otlin
    Franklin Square, NY

    Open Newsstand. Tap on the "Store" button in the upper right. Any newspaper or magazine you download from the store will appear in Newsstand.

  • CRM  IC Winclient - How to add new fields in the BP Search of TRX CIC0

    Hello Experts,
    I want to know how to add new fields in the BP Search of TRX CIC0. In the HTML that we're using here I need to add the URL of the BP.
    Can you help me?
    Thanks in advance.
    Caíque Escaler

    Hi
    make append to tables in se11 - CCMBP1FIELDS, CCMBP2FIELDS
    in spro in Define customer-specific search control -> mark fields with X.
    and enhance html template CRM_CIC_SEARCH_DISPLAY. -> tcode smw0, look for package CRM_CIC_COMPONENTS for html CRM_CIC_SEARCH_DISPLAY. export it from SAP, edit, and import.
    you will need to enhance function module used for searching - you will find him in spro in Search Strategies.
    Regards
    Radek

Maybe you are looking for

  • ITunes won't open due to conflict with QuickTime

    I get the following error message when I try to open iTunes: QuickTime 7.0d0 is installed. iTunes requires 7.03 or later. Please reinstall iTunes. I've reinstalled iTunes, that didn't solve the problem. I uninstalled both QT and iTunes, then download

  • Help with images required

    Hi, I am a new Macbook owner. I transfered some photos from my canon camera last week. Today some of these are corrupt. I tried sending the folder to a friend yesterday using podmail. Quite a lot of my images are now corrupt, but not all. All I have

  • Using Java Mail to Access Hotmail

    I'm writing an organizer program which currently handles contacts and a personal calendar. I want to add email functionality, starting with Hotmail access, since that's what I use. Could you folks please point me in the direction of tutorials on how

  • How do I change he time the screen reverts to the Log in requirement when idle.

    If I do not use the system for more than a few minutes it reverts to the Login screen requiring the typing of the pasword all day long, How do I change this time out feature to lengthenit. Thanks   O T This question was solved. View Solution.

  • How do I start on Oracle Generic Connectivity?

    Hi, I am new to Oracle and can i know where i can get info on setting up Oracle Generic Connectivity to connect Oracle with non-Oracle databases?