Hybrid View

  1. #1
    Sencha Premium Member
    Join Date
    Aug 2012
    Posts
    4
    Vote Rating
    0
    kotarf is on a distinguished road

      0  

    Default Programmatically Fire Element Events

    Programmatically Fire Element Events


    Hi everyone

    Problem

    Is it possible in Sencha Touch 2.1 to programmatically fire Ext.event.Event events within the framework?

    In the API docs example at Ext.event.Event, I see how to get access to an event object.

    http://docs.sencha.com/touch/2-1/#!/api/Ext.event.Event

    In the Ext.event.Event example, the listener has access to an event object (e) which contains all the information about the browser event that occurred (type such as mouseup-mousedown, position in x y, etc).

    How can we take this event object and programmatically fire it again?

    Attempt

    My attempts have all used private methods within the framework. I have tried to access the the DOM event publisher at Ext.event.Dispatcher.getInstance().getPublishers().dom , and then call its onEvent() method with the event object that was used in the first place. It does not work. I suspect that one problem will be that the timestamps of the recorded event are in the past. Another problem is that the events could be batched up before processing. I have tried doing the same thing with the Touch Gestures publisher with some luck.

    Doing things like this is not good because it requires a thorough understanding of the internals (which I don’t have) and private methods may change over time. I don’t have a good understanding of how Sencha Touch takes a browser event and causes an event on an Ext.dom.Element followed by events on Ext.Components.

    I’d much rather a solution that uses only public methods.

    I’ve also tried to get the Ext.dom.Element by id using Ext.get(id), and then firing the event with the same name (tap, touchstart, single tap). No luck with this either. I need to investigate what the arguments should be for the fireEvent.

    The goal, as always, is to use as much of the framework as possible.

    Help

    Advice on how my attempts are totally wrong or could be improved!

    Information about the internals of the framework with regard to browser events and event publishing would be extremely helpful.

    Let me know if this whole idea is not possible
    · Is it only possible if we listen for events on Components, and then fire events back on the element
    property (Ext.dom.Element)?
    Information about Ext.dom.Element and Ext.dom.Publisher specifically

    Information about the abstraction layers of the framework… DOM->Ext.dom.Element->CompositeElement->Component?

    Information explaining how Ext.Js does it with injectEvent

    Related

    This has been done in Ext.Js. Ext.Js 4 provides an injectEvent() method that is similar to what I want to do.

    Ext.Js also provides an Ext.ux.event.Recorder which I believe is related to this; however I have not seen examples of it being used.

    This idea resembles what has been described for Ext.js several years ago at
    http://www.sencha.com/forum/showthread.php?69272-Feature-Request-Ext.Element.fireEvent()
    and may have been implemented as injectEvent.

    Any and all help is appreciated
    Last edited by kotarf; 6 Dec 2012 at 1:01 PM. Reason: correcting bad inconsistencies!

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,642
    Vote Rating
    817
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Sencha Touch doesn't have these, one is a ux so it's not actually part of the framework.

    To do this you can use fireEvent method and build the e object.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha Premium Member
    Join Date
    Aug 2012
    Posts
    4
    Vote Rating
    0
    kotarf is on a distinguished road

      0  

    Default


    Thank you for the response

    I have managed make progress by using private methods within the framework. I use the onEvent method with the dispatcher, as described above in my attempts. However, solving this with exposed functionality is more attractive.

    Related to your proposed solution – if I understand it correctly, I could call fireEvent on the Ext.dom.Element instance associated with an event object e that was recorded (or build the event object myself). So something like

    Code:
              
    var element = Ext.get( id of target from event object )
    element.fireEvent( … )
    Is this correct?

    Additionally,

    · When doing <Ext.dom.Element>.fireEvent (…) , what should the parameters to this call be for framework events like tap or mousedown? Or just help me find where in the API documentation this stuff is found as I've had trouble finding it

    · Are all the elements on the page represented 1:1 as Element instances in the application? Ie- can Ext.get(id) return nothing for an element that actually exists on the page?

    Thank you
    -Frank

Thread Participants: 1