mirror of
https://github.com/barsdeveloper/ueblueprint.git
synced 2026-03-06 23:57:30 +08:00
Fix comments dragging nodes
This commit is contained in:
@@ -32,14 +32,6 @@ export default class CommentNodeTemplate extends IResizeableTemplate {
|
||||
return this.element.querySelector(".ueb-node-top")
|
||||
}
|
||||
|
||||
/** @param {Map} changedProperties */
|
||||
willUpdate(changedProperties) {
|
||||
super.willUpdate(changedProperties)
|
||||
if (changedProperties.has("sizeX") || changedProperties.has("sizeY")) {
|
||||
this.manageNodesBind()
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
return html`
|
||||
<div class="ueb-node-border">
|
||||
@@ -53,15 +45,19 @@ export default class CommentNodeTemplate extends IResizeableTemplate {
|
||||
}
|
||||
|
||||
manageNodesBind() {
|
||||
this.element.blueprint
|
||||
.getNodes(false, [
|
||||
this.element.topBoundary(),
|
||||
this.element.rightBoundary(),
|
||||
this.element.bottomBoundary(),
|
||||
this.element.leftBoundary(),
|
||||
])
|
||||
.filter(node => !node.boundComments.includes(this.element))
|
||||
.forEach(node => node.bindToComment(this.element))
|
||||
let nodes = this.element.blueprint.getNodes()
|
||||
for (let node of nodes) {
|
||||
if (
|
||||
node.topBoundary() >= this.element.topBoundary()
|
||||
&& node.rightBoundary() <= this.element.rightBoundary()
|
||||
&& node.bottomBoundary() <= this.element.bottomBoundary()
|
||||
&& node.leftBoundary() >= this.element.leftBoundary()
|
||||
) {
|
||||
node.bindToComment(this.element)
|
||||
} else {
|
||||
node.unbindFromComment(this.element)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/** @param {Number} value */
|
||||
@@ -83,4 +79,8 @@ export default class CommentNodeTemplate extends IResizeableTemplate {
|
||||
}
|
||||
return false
|
||||
}
|
||||
|
||||
endResize() {
|
||||
this.manageNodesBind()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -61,29 +61,33 @@ export default class IResizeableTemplate extends NodeTemplate {
|
||||
onDrag: (location, movement) => {
|
||||
movement[1] = location[1] - this.element.topBoundary()
|
||||
if (this.setSizeY(this.element.sizeY - movement[1])) {
|
||||
this.element.addLocation([0, movement[1]])
|
||||
this.element.addLocation([0, movement[1]], false)
|
||||
}
|
||||
}
|
||||
},
|
||||
onEndDrag : () => this.endResize(),
|
||||
}),
|
||||
new MouseClickDrag(this.#RHandler, this.element.blueprint, {
|
||||
onDrag: (location, movement) => {
|
||||
movement[0] = location[0] - this.element.rightBoundary()
|
||||
this.setSizeX(this.element.sizeX + movement[0])
|
||||
}
|
||||
},
|
||||
onEndDrag : () => this.endResize(),
|
||||
}),
|
||||
new MouseClickDrag(this.#BHandler, this.element.blueprint, {
|
||||
onDrag: (location, movement) => {
|
||||
movement[1] = location[1] - this.element.bottomBoundary()
|
||||
this.setSizeY(this.element.sizeY + movement[1])
|
||||
}
|
||||
},
|
||||
onEndDrag : () => this.endResize(),
|
||||
}),
|
||||
new MouseClickDrag(this.#LHandler, this.element.blueprint, {
|
||||
onDrag: (location, movement) => {
|
||||
movement[0] = location[0] - this.element.leftBoundary()
|
||||
if (this.setSizeX(this.element.sizeX - movement[0])) {
|
||||
this.element.addLocation([movement[0], 0])
|
||||
this.element.addLocation([movement[0], 0], false)
|
||||
}
|
||||
}
|
||||
},
|
||||
onEndDrag : () => this.endResize(),
|
||||
}),
|
||||
new MouseClickDrag(this.#TRHandler, this.element.blueprint, {
|
||||
onDrag: (location, movement) => {
|
||||
@@ -91,9 +95,10 @@ export default class IResizeableTemplate extends NodeTemplate {
|
||||
movement[1] = location[1] - this.element.topBoundary()
|
||||
this.setSizeX(this.element.sizeX + movement[0])
|
||||
if (this.setSizeY(this.element.sizeY - movement[1])) {
|
||||
this.element.addLocation([0, movement[1]])
|
||||
this.element.addLocation([0, movement[1]], false)
|
||||
}
|
||||
}
|
||||
},
|
||||
onEndDrag : () => this.endResize(),
|
||||
}),
|
||||
new MouseClickDrag(this.#BRHandler, this.element.blueprint, {
|
||||
onDrag: (location, movement) => {
|
||||
@@ -101,29 +106,32 @@ export default class IResizeableTemplate extends NodeTemplate {
|
||||
movement[1] = location[1] - this.element.bottomBoundary()
|
||||
this.setSizeX(this.element.sizeX + movement[0])
|
||||
this.setSizeY(this.element.sizeY + movement[1])
|
||||
}
|
||||
},
|
||||
onEndDrag : () => this.endResize(),
|
||||
}),
|
||||
new MouseClickDrag(this.#BLHandler, this.element.blueprint, {
|
||||
onDrag: (location, movement) => {
|
||||
movement[0] = location[0] - this.element.leftBoundary()
|
||||
movement[1] = location[1] - this.element.bottomBoundary()
|
||||
if (this.setSizeX(this.element.sizeX - movement[0])) {
|
||||
this.element.addLocation([movement[0], 0])
|
||||
this.element.addLocation([movement[0], 0], false)
|
||||
}
|
||||
this.setSizeY(this.element.sizeY + movement[1])
|
||||
}
|
||||
},
|
||||
onEndDrag : () => this.endResize(),
|
||||
}),
|
||||
new MouseClickDrag(this.#TLHandler, this.element.blueprint, {
|
||||
onDrag: (location, movement) => {
|
||||
movement[0] = location[0] - this.element.leftBoundary()
|
||||
movement[1] = location[1] - this.element.topBoundary()
|
||||
if (this.setSizeX(this.element.sizeX - movement[0])) {
|
||||
this.element.addLocation([movement[0], 0])
|
||||
this.element.addLocation([movement[0], 0], false)
|
||||
}
|
||||
if (this.setSizeY(this.element.sizeY - movement[1])) {
|
||||
this.element.addLocation([0, movement[1]])
|
||||
this.element.addLocation([0, movement[1]], false)
|
||||
}
|
||||
}
|
||||
},
|
||||
onEndDrag : () => this.endResize(),
|
||||
}),
|
||||
]
|
||||
}
|
||||
@@ -139,4 +147,6 @@ export default class IResizeableTemplate extends NodeTemplate {
|
||||
this.element.setNodeHeight(value)
|
||||
return true
|
||||
}
|
||||
|
||||
endResize() {}
|
||||
}
|
||||
|
||||
@@ -129,7 +129,7 @@ export default class NodeTemplate extends ISelectableDraggableTemplate {
|
||||
firstUpdated(changedProperties) {
|
||||
super.firstUpdated(changedProperties)
|
||||
this.setupPins()
|
||||
Promise.all(this.element.getPinElements().map(n => n.updateComplete)).then(() => this.element.acknowledgeReflow())
|
||||
this.element.updateComplete.then(() => this.element.acknowledgeReflow())
|
||||
}
|
||||
|
||||
setupPins() {
|
||||
|
||||
Reference in New Issue
Block a user