События Touchstart и Touchmove не работают - PullRequest
Новая
       25

События Touchstart и Touchmove не работают

0 голосов
/ 15 ноября 2018

У меня дизайнер плиточного пола.Код позволяет пользователю щелкнуть, чтобы заполнить отдельные квадраты в сетке выбранной плиткой на холсте или заполнить быстрее, перетаскивая мышь для заполнения.Рабочий стол работает нормально, но на iPhone он позволяет заполнять сетку только одним касанием.

Я пытался добавить слушателей, а также привязку, но не могу заставить ее работать.Я прокомментировал события мыши.

/*mouse code $(canvas).bind("mousedown touchstart", function(e) {
$(canvas).bind("mousemove touchmove", function(e) {*/

$(canvas).bind("mousedown touchstart", function(e) {
$(canvas).bind("mousemove touchmove", function(e) {
  if (tileNumber != 0) {
    function fill(s, gx, gy) {
        ctx.fillStyle = s;
        if (tabTitle == "Edge" || tabTitle == "edge") {
          if (gy > h - 1) {
            ctx.fillRect(gx * size, canvas.height - edgeSize, size, edgeSize);
          }
        } else if (tabTitle == "Corner") {
          if (gx > w - 1 && gy > h - 1) {
            ctx.fillStyle = "#f7f7f7";
            ctx.fillRect(gx * size, gy * size, size, size);
            ctx.fillStyle = s;
            if (tileAlign == "top left") {
              ctx.fillRect(gx * size, gy * size, edgeSize, edgeSize);
            } else if (tileAlign == "top right") {
              ctx.fillRect((gx * size) + (size - edgeSize), gy * size, edgeSize, edgeSize);
            } else if (tileAlign == "bottom left") {
              ctx.fillRect(gx * size, (gy * size) + (size - edgeSize), edgeSize, edgeSize);
            } else if (tileAlign == "bottom right") {
              ctx.fillRect((gx * size) + (size - edgeSize), (gy * size) + (size - edgeSize), edgeSize, edgeSize);
            } else {
              ctx.fillRect(gx * size, gy * size, edgeSize, edgeSize);
            };
          }
        } else {
          ctx.fillRect(gx * size, gy * size, size, size);
        };
        ctx.fillStyle = "#000000"
        ctx.fillStyle = ctx.createPattern(base_image, "repeat");
        ctx.fillRect(gx * size, gy * size, size, size);
        ctx.strokeRect(gx * size, gy * size, size, size);
    }
    // reset
    prodIdDetail = "";

    // get mouse click position
    var mx = e.offsetX;
    var my = e.offsetY;

    // calculate grid square numbers
    var gx = ~~ (mx / size);
    var gy = ~~ (my / size);

    fill(fillTile, gx, gy);

    // populate my dictionary with tile locations
    if (tabTitle == "Edge" || tabTitle == "edge") {
      if (gy > h - 1) {
        gridModel[gx + "." + gy + ".edge"] = properName;
      }
    } else {
      gridModel[gx + "." + gy] = properName;
    };


    // dubugging
    //console.log("Down")
  };
});
});
...