| 753 | } |
| 754 | } |
| 755 | mouseHandler(event) { |
| 756 | var bbox = this.layers.overlay.canvas.getBoundingClientRect() |
| 757 | var x = (event.clientX || 0) - bbox.left |
| 758 | var y = (event.clientY || 0) - bbox.top |
| 759 | var type = event.type |
| 760 | var touchmap = { |
| 761 | touchstart: "mousedown", |
| 762 | touchmove: "mousemove", |
| 763 | touchend: "mouseup", |
| 764 | touchcancel: "mouseup", |
| 765 | } |
| 766 | if (type in touchmap) { |
| 767 | type = touchmap[type] |
| 768 | if (event.touches && event.touches[0]) { |
| 769 | var touch = event.touches[0] |
| 770 | var x = (touch.clientX || 0) - bbox.left |
| 771 | var y = (touch.clientY || 0) - bbox.top |
| 772 | } |
| 773 | } |
| 774 | |
| 775 | x = x / this.containerScale |
| 776 | y = y / this.containerScale |
| 777 | |
| 778 | event.preventDefault() |
| 779 | // do drawing-related stuff |
| 780 | if (type == "mousedown" || (type == "mouseenter" && event.buttons == 1)) { |
| 781 | this.drawing = true |
| 782 | this.tool.begin(this, this.ctx_current, x, y) |
| 783 | this.tool.begin(this, this.ctx_overlay, x, y, true) |
| 784 | this.history.editBegin(x, y) |
| 785 | } |
| 786 | if (type == "mouseup" || type == "mousemove") { |
| 787 | if (this.drawing) { |
| 788 | if (x > 0 && y > 0) { |
| 789 | this.tool.move(this, this.ctx_current, x, y) |
| 790 | this.tool.move(this, this.ctx_overlay, x, y, true) |
| 791 | this.history.editMove(x, y) |
| 792 | } |
| 793 | } |
| 794 | } |
| 795 | if (type == "mouseup" || type == "mouseout") { |
| 796 | if (this.drawing) { |
| 797 | this.drawing = false |
| 798 | this.tool.end(this, this.ctx_current, x, y) |
| 799 | this.tool.end(this, this.ctx_overlay, x, y, true) |
| 800 | this.history.editEnd(x, y) |
| 801 | } |
| 802 | } |
| 803 | } |
| 804 | getOptionValue(section_name) { |
| 805 | var section = IMAGE_EDITOR_SECTIONS.find((s) => s.name == section_name) |
| 806 | return this.options && section_name in this.options ? this.options[section_name] : section.default |