Ma/ueblueprint
1
0
Fork 0
mirror of https://github.com/barsdeveloper/ueblueprint.git synced 2026-06-10 04:03:11 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Various fixes

Browse Source
This commit is contained in:
barsdeveloper
2021-10-27 19:27:19 +02:00
parent 56c23fc192
commit 418630255e
41 changed files with 2401 additions and 2337 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
js/input/Drag.js Normal file → Executable file
View File

@@ -1,41 +1,41 @@
import MouseClickDrag from "./MouseClickDrag"
export default class Drag extends MouseClickDrag {
constructor(target, blueprint, options) {
super(target, blueprint, options)
this.stepSize = parseInt(options?.stepSize)
this.mousePosition = [0, 0]
}
snapToGrid(location) {
return [
this.stepSize * Math.round(location[0] / this.stepSize),
this.stepSize * Math.round(location[1] / this.stepSize)
]
}
startDrag() {
if (isNaN(this.stepSize) || this.stepSize <= 0) {
this.stepSize = parseInt(getComputedStyle(this.target).getPropertyValue('--ueb-grid-snap'))
if (isNaN(this.stepSize) || this.stepSize <= 0) {
this.stepSize = 1
}
}
// Get the current mouse position
this.mousePosition = this.stepSize != 1 ? this.snapToGrid(this.clickedPosition) : this.clickedPosition
}
dragTo(location, movement) {
const mousePosition = this.stepSize != 1 ? this.snapToGrid(location) : location
const d = [mousePosition[0] - this.mousePosition[0], mousePosition[1] - this.mousePosition[1]]
if (d[0] == 0 && d[1] == 0) {
return
}
this.target.dragDispatch(d)
// Reassign the position of mouse
this.mousePosition = mousePosition
}
}
import MouseClickDrag from "./MouseClickDrag"
export default class Drag extends MouseClickDrag {
constructor(target, blueprint, options) {
super(target, blueprint, options)
this.stepSize = parseInt(options?.stepSize)
this.mousePosition = [0, 0]
}
snapToGrid(location) {
return [
this.stepSize * Math.round(location[0] / this.stepSize),
this.stepSize * Math.round(location[1] / this.stepSize)
]
}
startDrag() {
if (isNaN(this.stepSize) || this.stepSize <= 0) {
this.stepSize = parseInt(getComputedStyle(this.target).getPropertyValue('--ueb-grid-snap'))
if (isNaN(this.stepSize) || this.stepSize <= 0) {
this.stepSize = 1
}
}
// Get the current mouse position
this.mousePosition = this.stepSize != 1 ? this.snapToGrid(this.clickedPosition) : this.clickedPosition
}
dragTo(location, movement) {
const mousePosition = this.stepSize != 1 ? this.snapToGrid(location) : location
const d = [mousePosition[0] - this.mousePosition[0], mousePosition[1] - this.mousePosition[1]]
if (d[0] == 0 && d[1] == 0) {
return
}
this.target.dragDispatch(d)
// Reassign the position of mouse
this.mousePosition = mousePosition
}
}

18
js/input/DragScroll.js Normal file → Executable file
View File

@@ -1,9 +1,9 @@
import MouseClickDrag from "./MouseClickDrag"
export default class DragScroll extends MouseClickDrag {
dragTo(location, movement) {
this.blueprint.scrollDelta([-movement[0], -movement[1]])
}
}
import MouseClickDrag from "./MouseClickDrag"
export default class DragScroll extends MouseClickDrag {
dragTo(location, movement) {
this.blueprint.scrollDelta([-movement[0], -movement[1]])
}
}

200
js/input/MouseClickDrag.js Normal file → Executable file
View File

@@ -1,100 +1,100 @@
import Pointing from "./Pointing"
/**
* This class manages the ui gesture of mouse click and drag. Tha actual operations are implemented by the subclasses.
*/
export default class MouseClickDrag extends Pointing {
constructor(target, blueprint, options) {
super(target, blueprint, options)
this.clickButton = options?.clickButton ?? 0
this.exitAnyButton = options?.exitAnyButton ?? true
this.moveEverywhere = options?.moveEverywhere ?? false
this.looseTarget = options?.looseTarget ?? false
this.started = false
this.clickedPosition = [0, 0]
const movementListenedElement = this.moveEverywhere ? document.documentElement : this.movementSpace
let self = this
this.mouseDownHandler = function (e) {
switch (e.button) {
case self.clickButton:
// Either doesn't matter or consider the click only when clicking on the parent, not descandants
if (self.looseTarget || e.target == e.currentTarget) {
e.stopPropagation()
self.started = false
// Attach the listeners
movementListenedElement.addEventListener('mousemove', self.mouseStartedMovingHandler)
document.addEventListener('mouseup', self.mouseUpHandler)
self.clickedPosition = self.getLocation(e)
self.clicked(self.clickedPosition)
}
break
default:
if (!self.exitAnyButton) {
self.mouseUpHandler(e)
}
break
}
}
this.mouseStartedMovingHandler = function (e) {
e.preventDefault()
e.stopPropagation()
// Delegate from now on to self.mouseMoveHandler
movementListenedElement.removeEventListener('mousemove', self.mouseStartedMovingHandler)
movementListenedElement.addEventListener('mousemove', self.mouseMoveHandler)
// Do actual actions
self.startDrag()
self.started = true
}
this.mouseMoveHandler = function (e) {
e.preventDefault()
e.stopPropagation()
const location = self.getLocation(e)
const movement = [e.movementX, e.movementY]
self.dragTo(location, movement)
}
this.mouseUpHandler = function (e) {
if (!self.exitAnyButton || e.button == self.clickButton) {
// Remove the handlers of "mousemove" and "mouseup"
movementListenedElement.removeEventListener('mousemove', self.mouseStartedMovingHandler)
movementListenedElement.removeEventListener('mousemove', self.mouseMoveHandler)
document.removeEventListener('mouseup', self.mouseUpHandler)
self.endDrag()
}
}
this.target.addEventListener('mousedown', this.mouseDownHandler)
if (this.clickButton == 2) {
this.target.addEventListener('contextmenu', this.preventDefault)
}
}
preventDefault(e) {
e.preventDefault()
}
unlistenDOMElement() {
this.target.removeEventListener('mousedown', this.mouseDownHandler)
if (this.clickButton == 2) {
this.target.removeEventListener('contextmenu', this.preventDefault)
}
}
/* Subclasses will override the following methods */
clicked(location) {
}
startDrag() {
}
dragTo(location, movement) {
}
endDrag() {
}
}
import Pointing from "./Pointing"
/**
* This class manages the ui gesture of mouse click and drag. Tha actual operations are implemented by the subclasses.
*/
export default class MouseClickDrag extends Pointing {
constructor(target, blueprint, options) {
super(target, blueprint, options)
this.clickButton = options?.clickButton ?? 0
this.exitAnyButton = options?.exitAnyButton ?? true
this.moveEverywhere = options?.moveEverywhere ?? false
this.looseTarget = options?.looseTarget ?? false
this.started = false
this.clickedPosition = [0, 0]
const movementListenedElement = this.moveEverywhere ? document.documentElement : this.movementSpace
let self = this
this.mouseDownHandler = function (e) {
switch (e.button) {
case self.clickButton:
// Either doesn't matter or consider the click only when clicking on the parent, not descandants
if (self.looseTarget || e.target == e.currentTarget) {
e.stopPropagation()
self.started = false
// Attach the listeners
movementListenedElement.addEventListener('mousemove', self.mouseStartedMovingHandler)
document.addEventListener('mouseup', self.mouseUpHandler)
self.clickedPosition = self.getLocation(e)
self.clicked(self.clickedPosition)
}
break
default:
if (!self.exitAnyButton) {
self.mouseUpHandler(e)
}
break
}
}
this.mouseStartedMovingHandler = function (e) {
e.preventDefault()
e.stopPropagation()
// Delegate from now on to self.mouseMoveHandler
movementListenedElement.removeEventListener('mousemove', self.mouseStartedMovingHandler)
movementListenedElement.addEventListener('mousemove', self.mouseMoveHandler)
// Do actual actions
self.startDrag()
self.started = true
}
this.mouseMoveHandler = function (e) {
e.preventDefault()
e.stopPropagation()
const location = self.getLocation(e)
const movement = [e.movementX, e.movementY]
self.dragTo(location, movement)
}
this.mouseUpHandler = function (e) {
if (!self.exitAnyButton || e.button == self.clickButton) {
// Remove the handlers of "mousemove" and "mouseup"
movementListenedElement.removeEventListener('mousemove', self.mouseStartedMovingHandler)
movementListenedElement.removeEventListener('mousemove', self.mouseMoveHandler)
document.removeEventListener('mouseup', self.mouseUpHandler)
self.endDrag()
}
}
this.target.addEventListener('mousedown', this.mouseDownHandler)
if (this.clickButton == 2) {
this.target.addEventListener('contextmenu', this.preventDefault)
}
}
preventDefault(e) {
e.preventDefault()
}
unlistenDOMElement() {
this.target.removeEventListener('mousedown', this.mouseDownHandler)
if (this.clickButton == 2) {
this.target.removeEventListener('contextmenu', this.preventDefault)
}
}
/* Subclasses will override the following methods */
clicked(location) {
}
startDrag() {
}
dragTo(location, movement) {
}
endDrag() {
}
}

62
js/input/MouseWheel.js Normal file → Executable file
View File

@@ -1,31 +1,31 @@
import Pointing from "./Pointing"
export default class MouseWheel extends Pointing {
/**
*
* @param {HTMLElement} target
* @param {import("../Blueprint").Blueprint} blueprint
* @param {Object} options
*/
constructor(target, blueprint, options) {
super(target, blueprint, options)
this.looseTarget = options?.looseTarget ?? true
let self = this
this.mouseWheelHandler = function (e) {
e.preventDefault()
const location = self.getLocation(e)
self.wheel(Math.sign(e.deltaY), location)
}
this.movementSpace.addEventListener('wheel', this.mouseWheelHandler, false)
// Prevent movement space from being scrolled
this.movementSpace.parentElement?.addEventListener('wheel', e => e.preventDefault())
}
/* Subclasses will override the following method */
wheel(variation, location) {
}
}
import Pointing from "./Pointing"
export default class MouseWheel extends Pointing {
/**
*
* @param {HTMLElement} target
* @param {import("../Blueprint").Blueprint} blueprint
* @param {Object} options
*/
constructor(target, blueprint, options) {
super(target, blueprint, options)
this.looseTarget = options?.looseTarget ?? true
let self = this
this.mouseWheelHandler = function (e) {
e.preventDefault()
const location = self.getLocation(e)
self.wheel(Math.sign(e.deltaY), location)
}
this.movementSpace.addEventListener('wheel', this.mouseWheelHandler, false)
// Prevent movement space from being scrolled
this.movementSpace.parentElement?.addEventListener('wheel', e => e.preventDefault())
}
/* Subclasses will override the following method */
wheel(variation, location) {
}
}

44
js/input/Pointing.js Normal file → Executable file
View File

@@ -1,22 +1,22 @@
import Utility from "../Utility"
export default class Pointing {
constructor(target, blueprint, options) {
/** @type {HTMLElement} */
this.target = target
/** @type {import("../Blueprint").Blueprint}" */
this.blueprint = blueprint
this.movementSpace = this.blueprint?.getGridDOMElement() ?? document.documentElement
}
getLocation(mouseEvent) {
const scaleCorrection = 1 / Utility.getScale(this.target)
const targetOffset = this.movementSpace.getBoundingClientRect()
let location = [
(mouseEvent.clientX - targetOffset.x) * scaleCorrection,
(mouseEvent.clientY - targetOffset.y) * scaleCorrection
]
return location
}
}
import Utility from "../Utility"
export default class Pointing {
constructor(target, blueprint, options) {
/** @type {HTMLElement} */
this.target = target
/** @type {import("../Blueprint").Blueprint}" */
this.blueprint = blueprint
this.movementSpace = this.blueprint?.getGridDOMElement() ?? document.documentElement
}
getLocation(mouseEvent) {
const scaleCorrection = 1 / Utility.getScale(this.target)
const targetOffset = this.movementSpace.getBoundingClientRect()
let location = [
(mouseEvent.clientX - targetOffset.x) * scaleCorrection,
(mouseEvent.clientY - targetOffset.y) * scaleCorrection
]
return location
}
}

54
js/input/Select.js Normal file → Executable file
View File

@@ -1,27 +1,27 @@
import MouseClickDrag from "./MouseClickDrag"
export default class Select extends MouseClickDrag {
constructor(target, blueprint, options) {
super(target, blueprint, options)
this.stepSize = options?.stepSize
this.mousePosition = [0, 0]
this.selectorElement = this.blueprint.selectorElement
}
startDrag() {
this.selectorElement.startSelecting(this.clickedPosition)
}
dragTo(location, movement) {
this.selectorElement.doSelecting(location)
}
endDrag() {
if (this.started) {
this.selectorElement.finishSelecting()
} else {
this.blueprint.unselectAll()
}
}
}
import MouseClickDrag from "./MouseClickDrag"
export default class Select extends MouseClickDrag {
constructor(target, blueprint, options) {
super(target, blueprint, options)
this.stepSize = options?.stepSize
this.mousePosition = [0, 0]
this.selectorElement = this.blueprint.selectorElement
}
startDrag() {
this.selectorElement.startSelecting(this.clickedPosition)
}
dragTo(location, movement) {
this.selectorElement.doSelecting(location)
}
endDrag() {
if (this.started) {
this.selectorElement.finishSelecting()
} else {
this.blueprint.unselectAll()
}
}
}

18
js/input/Zoom.js Normal file → Executable file
View File

@@ -1,9 +1,9 @@
import MouseWheel from "./MouseWheel";
export default class Zoom extends MouseWheel {
wheel(variation, location) {
let zoomLevel = this.blueprint.getZoom()
zoomLevel -= variation
this.blueprint.setZoom(zoomLevel, location)
}
}
import MouseWheel from "./MouseWheel";
export default class Zoom extends MouseWheel {
wheel(variation, location) {
let zoomLevel = this.blueprint.getZoom()
zoomLevel -= variation
this.blueprint.setZoom(zoomLevel, location)
}
}