0 Replies Latest reply on Sep 26, 2013 5:16 AM by gcgCui

    Can´t find the way to make it work


      Hi I asked this in this forum and others but nobody could give me an answer. I´m gonna try to explain it with more information and all the ways I had try to make it work.


      First I´ll show you how my proyect is structured :


      Captura de pantalla 2013-09-26 a la(s) 13.09.31.png


      Those are all the scenes of the proyect (it is an interactive book).


      My problem is with the scene5 (" _escena5") it looks like this :


      Captura de pantalla 2013-09-26 a la(s) 13.10.16.png

      Ok the current action affects to the symbol selected "_filtroEscena5" and it has this inside :


      Captura de pantalla 2013-09-26 a la(s) 13.10.51.png


      Allright,now I will explain the action:


      I need to drag the symbol "_filtroEscena5" but only when I click on the "Ellipse". Ok, the easy way to do this is with a handle on the .draggable property well this works fine. The problem is the other part of the action. I have on the "_escena5" a few triggers "btnFantasma", "btnOsos" and "btnVini" those trigges have to been activate when the ellipse goes over. This is a scene of a lantern, you drag the light and when you illuminate the Triggers something happens.


      So here is my problem, I can´t get the last part working. I first used the accept drop function. I made my triggers droppable and at the accept parameter I put this:




      But this does not work, if I make a rectangle o something like these to test it and put it on the accept it works, but not with the "Ellipse".


      So I tried other thing...


      At the draggable property of the "_filtroEscena5" I call the drag parameter and set this function :



      drag : sym.getSymbol("_escena5").getSymbol('_filtroEscena5').$('Ellipse').draggable({



                                                 start: function(e){},

                                                 drag: function(e,ui){},






      I do this to get the id of the Ellipse and then on the drop function of the Triggers i set this :



               if(ui.draggable.attr('id')=="Stage__escena5__filtroEscena5_Ellipse"){alert("es vini");









      This made it responds only to the Ellipse element and then destroy the draggable property to make sure than when I drag it again I move all the symbol and not just the "Ellipse". And this is the problem with it, if I stop dragging the lantern at a trigger it works but if I stop it at any other place when I drag the Ellipse again it moves alone, the symbol does not move with it.

      So I call a function at the stop parameter at the .draggable property of "_filtroEscena5" and call again this:






      All right now I move all the symbol only when I touch and drag the "Ellipse" and don´t care where I stopped it, when I drag it again it works. The problem? this broke the drop function for the triggers it´s like when you stop the drag and then ejecute the drop so when you stop the drag you lose the id information.


      I don´t know what more I can do I tried other things but nothing change because this is for tablets and can´t use the mouseover like on the browser.


      Plese some help my I spent a lot of time with it.



      Thanks again.