Proxmox/proxmox-widget-toolkit
5
0
Fork 0
Code Pull Requests Releases Activity

(partially) fix : add touchscreen override for extjs

Browse Source 
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>
This commit is contained in:
Dominik Csapak 2018-03-30 09:48:41 +02:00 committed by Thomas Lamprecht
parent fde8e8bbb9
commit aea77b2c69
1 changed files with 43 additions and 0 deletions

43
Toolkit.js

@ -139,6 +139,49 @@ Ext.apply(Ext.form.field.VTypes, {
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',