Use separate handlers for titlebar and content
Fix needed for touch devices. Change-Id: Iffc0e7fe1303b7a0e4aae88ba7649bda0677320f
This commit is contained in:
parent
9dab231984
commit
3799d72bd8
1 changed files with 36 additions and 13 deletions
|
@ -60,6 +60,9 @@ L.Control.LokDialog = L.Control.extend({
|
||||||
dialogIdPrefix: 'lokdialog-',
|
dialogIdPrefix: 'lokdialog-',
|
||||||
|
|
||||||
onPan: function (ev) {
|
onPan: function (ev) {
|
||||||
|
if (!draggedObject)
|
||||||
|
return;
|
||||||
|
|
||||||
var id = toZoomTargetId(draggedObject.id);
|
var id = toZoomTargetId(draggedObject.id);
|
||||||
var target = findZoomTarget(id);
|
var target = findZoomTarget(id);
|
||||||
|
|
||||||
|
@ -71,8 +74,9 @@ L.Control.LokDialog = L.Control.extend({
|
||||||
if (window.mode.isDesktop() &&
|
if (window.mode.isDesktop() &&
|
||||||
(newX < -target.width/2 || newY < -target.height/2
|
(newX < -target.width/2 || newY < -target.height/2
|
||||||
|| newX > window.innerWidth - target.width/2
|
|| newX > window.innerWidth - target.width/2
|
||||||
|| newY > window.innerHeight - target.height/2))
|
|| newY > window.innerHeight - target.height/2)) {
|
||||||
return;
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
target.transformation.translate = {
|
target.transformation.translate = {
|
||||||
x: newX,
|
x: newX,
|
||||||
|
@ -618,8 +622,6 @@ L.Control.LokDialog = L.Control.extend({
|
||||||
},
|
},
|
||||||
|
|
||||||
_setupGestures: function(dialogContainer, id, canvas) {
|
_setupGestures: function(dialogContainer, id, canvas) {
|
||||||
var self = this;
|
|
||||||
var dialogID = id;
|
|
||||||
var targetId = toZoomTargetId(canvas.id);
|
var targetId = toZoomTargetId(canvas.id);
|
||||||
var zoomTarget = $('#' + targetId).parent().get(0);
|
var zoomTarget = $('#' + targetId).parent().get(0);
|
||||||
var titlebar = $('#' + targetId).prev().children().get(0);
|
var titlebar = $('#' + targetId).prev().children().get(0);
|
||||||
|
@ -661,23 +663,44 @@ L.Control.LokDialog = L.Control.extend({
|
||||||
if (findZoomTarget(targetId) != null) {
|
if (findZoomTarget(targetId) != null) {
|
||||||
removeZoomTarget(targetId);
|
removeZoomTarget(targetId);
|
||||||
}
|
}
|
||||||
|
|
||||||
zoomTargets.push({key: targetId, value: zoomTarget, titlebar: titlebar, transformation: transformation, initialState: state, width:width, height: height});
|
zoomTargets.push({key: targetId, value: zoomTarget, titlebar: titlebar, transformation: transformation, initialState: state, width:width, height: height});
|
||||||
|
|
||||||
var hammerAll = new Hammer(zoomTarget);
|
var hammerTitlebar = new Hammer(titlebar);
|
||||||
hammerAll.add(new Hammer.Pan({ threshold: 20, pointers: 0 }));
|
hammerTitlebar.add(new Hammer.Pan({ threshold: 20, pointers: 0 }));
|
||||||
hammerAll.add(new Hammer.Pinch({ threshold: 0 })).recognizeWith([hammerAll.get('pan')]);
|
hammerTitlebar.add(new Hammer.Pinch({ threshold: 0 })).recognizeWith([hammerTitlebar.get('pan')]);
|
||||||
|
|
||||||
hammerAll.on('panstart panmove panstop', function(ev) {
|
hammerTitlebar.on('panstart', this.onPan);
|
||||||
self.onPan(ev, dialogID);
|
hammerTitlebar.on('panmove', this.onPan);
|
||||||
});
|
hammerTitlebar.on('pinchstart pinchmove', this.onPinch);
|
||||||
hammerAll.on('pinchstart pinchmove', this.onPinch);
|
hammerTitlebar.on('hammer.input', function(ev) {
|
||||||
hammerAll.on('hammer.input', function(ev) {
|
|
||||||
if (ev.isFirst) {
|
if (ev.isFirst) {
|
||||||
draggedObject = ev.target;
|
draggedObject = ev.target;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (ev.isFinal) {
|
if (ev.isFinal && draggedObject) {
|
||||||
|
var id = toZoomTargetId(draggedObject.id);
|
||||||
|
var target = findZoomTarget(id);
|
||||||
|
if (target) {
|
||||||
|
target.initialState.startX = target.transformation.translate.x;
|
||||||
|
target.initialState.startY = target.transformation.translate.y;
|
||||||
|
}
|
||||||
|
draggedObject = null;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
var hammerContent = new Hammer(canvas);
|
||||||
|
hammerContent.add(new Hammer.Pan({ threshold: 20, pointers: 0 }));
|
||||||
|
hammerContent.add(new Hammer.Pinch({ threshold: 0 })).recognizeWith([hammerContent.get('pan')]);
|
||||||
|
|
||||||
|
hammerContent.on('panstart', this.onPan);
|
||||||
|
hammerContent.on('panmove', this.onPan);
|
||||||
|
hammerContent.on('pinchstart pinchmove', this.onPinch);
|
||||||
|
hammerContent.on('hammer.input', function(ev) {
|
||||||
|
if (ev.isFirst) {
|
||||||
|
draggedObject = ev.target;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (ev.isFinal && draggedObject) {
|
||||||
var id = toZoomTargetId(draggedObject.id);
|
var id = toZoomTargetId(draggedObject.id);
|
||||||
var target = findZoomTarget(id);
|
var target = findZoomTarget(id);
|
||||||
if (target) {
|
if (target) {
|
||||||
|
|
Loading…
Reference in a new issue