Hammer.js Ereignispriorität

Question

Ich habe die hammer.js-Bibliothek für meine Veranstaltungen implementiert. Das Problem ist, dass mehrere Ereignisse gleichzeitig ausgelöst werden.

Kann ich eine Ereignispriorität festlegen? Nehmen wir an, wenn die Umwandlung durchgeführt wird, werden alle anderen Ereignisse ignoriert. Wenn die Transformation stoppt, können andere Ereignisse ausgeführt werden.

hammertime.on("transform", function(evt) { 
     //transform 
    } 

    hammertime.on("drag", function(ev) { 
     //drag 
    } 

Ich habe bereits versucht, so etwas wie dieses: Drag Disabiling wenn wir

hammertime.on("transform", function(evt) { 
      //transform 
      hammertime.options.drag="false"; 
} 

Umwandlung beginnen und enabeling es zurück, wenn Transformation beendet ist

hammertime.on("transformend", function(evt) { 
      //transformend 
      hammertime.options.drag="true"; 
} 

Dieser Ansatz funktioniert gut, außer manchmal wird der Widerstand nicht wieder auf wahr gesetzt. Ich möchte eine 100% ige Arbeitslösung. Bitte helfen ...

Answer 1

Eine billige Art und Weise, dies zu tun ist Ihre Event-Handler zusammenarbeiten haben:

var transforming = false; 
hammertime.on("transformstart", function (ev) { transforming = true; ... }); 
hammertime.on("transformend", function (ev) { transforming = false; }); 
hammertime.on("drag", function (ev) { if (!transforming) { ... } }); 

Wenn Hammer nicht immer Ihre transformend anrufen, dann leider alles, was Sie tun können, um den Fehler zu arbeiten Verwenden Sie eine Art Timer, der Ihre Transformation beendet, wenn eine bestimmte Zeit verstreicht. Es ist nicht perfekt, aber es können Sie von der möglichen Fehler in Hammer erholen:

var transformTimer = undefined, 
    transforming = false; 
hammertime.on("transform", function (ev) { 
    transforming = true; 
    if (transformTimer !== undefined) clearTimeout(transformTimer); 
    transformTimer = setTimeout(function() { 
     transformTimer = undefined; 
     transforming = false; 
    }, 1000); // end the transform after 1s of idle time. 

    // your transform code goes here 
}); 
hammertime.on("transformend", function() { 
    if (transformTimer !== undefined) { 
     clearTimeout(transformTimer); 
     transformTimer = undefined; 
    } 
    transforming = false; 
}); 
hammertime.on("drag", function (ev) { if (!transforming) { ... } }); 

Answer 2

versuchen ev.gesture.stopDetect();

sehen das Wiki von Hammer für einige Details darüber! https://github.com/EightMedia/hammer.js/wiki/Event-delegation-and-how-to-stopPropagation---preventDefaults

Answer 3

Ich habe gerade diesen Fehler behoben.

  var transforming = false; 
      var transformTimer = null;   

      hammertime2.on('touch drag dragend transform', function(ev) { 
       manageMultitouch(ev); 
      }); 

      hammertime2.on("transformstart", function(evt) {      
       transforming = true; 
      }); 

      hammertime2.on("transformend", function(evt) { 
       setTimeout(function() {  
        transforming = false; 
       }, 1000); 
      }); 

     function manageMultitouch(ev){    

      if (transforming && (ev.type == 'drag' || ev.type =='dragend')) return; 

      switch(ev.type) { 
       case 'touch':      
        break; 

       case 'drag': 
        break; 

       case 'transform': 
        transforming = true;      
        break; 

       case 'dragend': 
        break; 
      } 

     } 

Der wichtige Teil hier ist, dass, während Sie ‚Transform‘ gesetzt tun immer transforming = true;