Fix scrolling scale, other knot style fixes

This commit is contained in:
barsdeveloper
2023-01-21 15:51:47 +01:00
parent efe560adda
commit a17bbeb2de
15 changed files with 238 additions and 84 deletions

View File

@@ -195,27 +195,28 @@ export default class BlueprintTemplate extends ITemplate {
}
gridTopVisibilityBoundary() {
return this.blueprint.scrollY - this.blueprint.translateY
return this.blueprint.scaleCorrect(this.blueprint.scrollY) - this.blueprint.translateY
}
gridRightVisibilityBoundary() {
return this.gridLeftVisibilityBoundary() + this.viewportSize[0]
this.blueprint
return this.gridLeftVisibilityBoundary() + this.blueprint.scaleCorrect(this.viewportSize[0])
}
gridBottomVisibilityBoundary() {
return this.gridTopVisibilityBoundary() + this.viewportSize[1]
return this.gridTopVisibilityBoundary() + this.blueprint.scaleCorrect(this.viewportSize[1])
}
gridLeftVisibilityBoundary() {
return this.blueprint.scrollX - this.blueprint.translateX
return this.blueprint.scaleCorrect(this.blueprint.scrollX) - this.blueprint.translateX
}
centerViewport(x = 0, y = 0, smooth = true) {
const centerX = this.gridLeftVisibilityBoundary() + this.viewportSize[0] / 2
const centerY = this.gridTopVisibilityBoundary() + this.viewportSize[1] / 2
const centerX = this.gridLeftVisibilityBoundary() + this.blueprint.scaleCorrect(this.viewportSize[0] / 2)
const centerY = this.gridTopVisibilityBoundary() + this.blueprint.scaleCorrect(this.viewportSize[1] / 2)
this.blueprint.scrollDelta(
x - centerX,
y - centerY,
this.blueprint.scaleCorrectReverse(x - centerX),
this.blueprint.scaleCorrectReverse(y - centerY),
smooth
)
}

View File

@@ -102,13 +102,23 @@ export default class NodeTemplate extends ISelectableDraggableTemplate {
const inputContainer = /** @type {HTMLElement} */(this.element.querySelector(".ueb-node-inputs"))
const outputContainer = /** @type {HTMLElement} */(this.element.querySelector(".ueb-node-outputs"))
this.element.nodeNameElement = /** @type {HTMLElement} */(this.element.querySelector(".ueb-node-name-text"))
let hasInput = false
let hasOutput = false
this.element.getPinElements().forEach(p => {
if (p.isInput()) {
inputContainer.appendChild(p)
hasInput = true
} else if (p.isOutput()) {
outputContainer.appendChild(p)
hasOutput = true
}
})
if (hasInput) {
this.element.classList.add("ueb-node-has-inputs")
}
if (hasOutput) {
this.element.classList.add("ueb-node-has-outputs")
}
}
createPinElements() {

View File

@@ -13,6 +13,10 @@ import PinTemplate from "./PinTemplate"
export default class MinimalPinTemplate extends PinTemplate {
render() {
return html`<div class="ueb-pin-icon">${this.renderIcon()}</div>`
return html`
<div class="ueb-pin-wrapper">
<div class="ueb-pin-icon">${this.renderIcon()}</div>
</div>
`
}
}