0

I want to detect pinch event on an IFrame (Extjs 5 Component). What's wrong with this code??

Ext.create('Ext.ux.IFrame', {
        autoScroll: true,
        src: 'resources/docs/doc1.html',
        cls: 'iframeStyle',
        listeners: {
            pinch: function (event) {
                alert('event.scale= ' + event.scale);
            }
        }
    })
Forgotten Angel
  • 233
  • 1
  • 3
  • 15

1 Answers1

0

Out of the box, Ext.ux.Iframe does not have "pinch" as an event. Only the events listed on the API can be added using the "listeners" syntax. http://docs.sencha.com/extjs/5.0/5.0.1-apidocs/#!/api/Ext.ux.IFrame

You'd want something along the lines of: 

Ext.create('Ext.ux.IFrame', {
    autoScroll: true,
    src: 'resources/docs/doc1.html',
    cls: 'iframeStyle',
    listeners: {
        afterrender: function(container) {
            container.addManagedListener(container.el, "touchstart", function (event) {
                alert('event.scale= ' + event.scale);
            });
        }
    }
})

The code is untested but addManagedListener is what you'll want!

Lesley.Oakey
  • 358
  • 1
  • 7
  • You have some errors on the code you wrote, but still not working :( `Ext.create('Ext.ux.IFrame', { autoScroll: true, src: 'resources/docs/doc1.html', cls: 'iframeStyle', listeners: { afterrender: function (container) { container.addManagedListener(container.el, "pinch", function (event) { alert('event.scale= ' + event.scale); }); } }` I tested this on Ipad and galaxy tab – Forgotten Angel Dec 17 '14 at 10:42
  • Aha, you're right my code is wrong. I'll update the example. I set up a test example and using the "click" or "touchstart" events in place of "pinch" work fine. It may be that further to the change in the way the listener is added the actual event may need to be altered. Unfortunately looking at pinch/zoom for ExtJS support it doesn't look good and is not currently being considered by the development team http://sencha.com/forum/showthread.php?287219. Pinch detection in native JS is not well supported also (for android at least. I think you can use `gesturestart` for IOS) – Lesley.Oakey Dec 17 '14 at 11:30
  • Not working!! I tried with click event and I tried with the "toggle device mode" in chrome... – Forgotten Angel Dec 17 '14 at 13:43