]> git.proxmox.com Git - proxmox-widget-toolkit.git/commitdiff
(partially) fix #1223: add touchscreen override for extjs
authorDominik Csapak <d.csapak@proxmox.com>
Fri, 30 Mar 2018 07:48:41 +0000 (09:48 +0200)
committerThomas Lamprecht <t.lamprecht@proxmox.com>
Fri, 30 Mar 2018 08:10:46 +0000 (10:10 +0200)
the combination of firefox, touchscreen, mouse input and extjs
prevents normal click/touch input for buttons, lists, etc.

the workaround on firefox was to set
dom.w3c_touch_events.enabled
to 0 (in about:config)

or to upgrade to extjs >= 6.5.1 (of which there is no gpl release as of now)

so we introduce that workaround as it seems to not disrupt 'normal'
browsers and non-touchscreen devices

we then still have an issue with scrolling though, since extjs
now expects the user to drag the content instead of using the wheel

but it is still better than a completely non working interface

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
Toolkit.js

index 7e62e05a6e34e83e46a6638f740ff76f215b0295..4f1b623408e6a24fa938426c146188ce6d182263 100644 (file)
@@ -139,6 +139,49 @@ Ext.apply(Ext.form.field.VTypes, {
     passwordText: gettext('Passwords do not match')
 });
 
     passwordText: gettext('Passwords do not match')
 });
 
+// Firefox 52+ Touchscreen bug
+// see https://www.sencha.com/forum/showthread.php?336762-Examples-don-t-work-in-Firefox-52-touchscreen/page2
+// and https://bugzilla.proxmox.com/show_bug.cgi?id=1223
+Ext.define('EXTJS_23846.Element', {
+    override: 'Ext.dom.Element'
+}, function(Element) {
+    var supports = Ext.supports,
+        proto = Element.prototype,
+        eventMap = proto.eventMap,
+        additiveEvents = proto.additiveEvents;
+
+    if (Ext.os.is.Desktop && supports.TouchEvents && !supports.PointerEvents) {
+        eventMap.touchstart = 'mousedown';
+        eventMap.touchmove = 'mousemove';
+        eventMap.touchend = 'mouseup';
+        eventMap.touchcancel = 'mouseup';
+
+        additiveEvents.mousedown = 'mousedown';
+        additiveEvents.mousemove = 'mousemove';
+        additiveEvents.mouseup = 'mouseup';
+        additiveEvents.touchstart = 'touchstart';
+        additiveEvents.touchmove = 'touchmove';
+        additiveEvents.touchend = 'touchend';
+        additiveEvents.touchcancel = 'touchcancel';
+
+        additiveEvents.pointerdown = 'mousedown';
+        additiveEvents.pointermove = 'mousemove';
+        additiveEvents.pointerup = 'mouseup';
+        additiveEvents.pointercancel = 'mouseup';
+    }
+});
+
+Ext.define('EXTJS_23846.Gesture', {
+    override: 'Ext.event.publisher.Gesture'
+}, function(Gesture) {
+    var me = Gesture.instance;
+
+    if (Ext.supports.TouchEvents && !Ext.isWebKit && Ext.os.is.Desktop) {
+        me.handledDomEvents.push('mousedown', 'mousemove', 'mouseup');
+        me.registerEvents();
+    }
+});
+
 // we always want the number in x.y format and never in, e.g., x,y
 Ext.define('PVE.form.field.Number', {
     override: 'Ext.form.field.Number',
 // we always want the number in x.y format and never in, e.g., x,y
 Ext.define('PVE.form.field.Number', {
     override: 'Ext.form.field.Number',