Commit db48c7ff authored by uskyk's avatar uskyk
Browse files

Center on last step in proof tree

parent 78bb7325
Pipeline #167015 passed with stages
in 4 minutes and 24 seconds
...@@ -129,8 +129,18 @@ class MathjaxProofTree extends MathjaxAdapter { ...@@ -129,8 +129,18 @@ class MathjaxProofTree extends MathjaxAdapter {
} }
} }
// limit start zoom // limit start zoom
svg.viewBox.baseVal.width = Math.min(100000, svg.viewBox.baseVal.width); svg.viewBox.baseVal.width = Math.min(50000, svg.viewBox.baseVal.width);
svg.viewBox.baseVal.width = Math.max(20000, svg.viewBox.baseVal.width); svg.viewBox.baseVal.width = Math.max(20000, svg.viewBox.baseVal.width);
// center on first visible element
const finalConclusion = svg
.querySelector<SVGGraphicsElement>("#typicalc-prooftree > g[semantics='bspr_inferenceRule:down']")!
.children[1]! as SVGGraphicsElement;
const conclusionBBox = finalConclusion.getBBox();
const mainGroupElement = svg.children[1]! as SVGGraphicsElement;
const currentX = conclusionBBox.x + conclusionBBox.width / 2;
const desiredX = svg.viewBox.baseVal.width / 2;
mainGroupElement.setAttribute("transform",
mainGroupElement.getAttribute("transform") + " translate(" + (desiredX - currentX) + " 0)");
// MathJax layout of bussproofs is sometimes wrong: // MathJax layout of bussproofs is sometimes wrong:
// https://github.com/mathjax/MathJax/issues/2270 // https://github.com/mathjax/MathJax/issues/2270
...@@ -238,10 +248,18 @@ class MathjaxProofTree extends MathjaxAdapter { ...@@ -238,10 +248,18 @@ class MathjaxProofTree extends MathjaxAdapter {
} }
console.timeEnd('stepCalculation'); console.timeEnd('stepCalculation');
const thisShadowRoot = this.shadowRoot!; // svg-pan-zoom should not be used on empty SVGs
// should not be used on empty SVGs
if (nodeIterator.length >= 3) { if (nodeIterator.length >= 3) {
// a timeout is required, otherwise the proof tree is moved around
setTimeout(() => {
this.setupPanZoom(this.shadowRoot!, svg);
}, 100);
}
this.steps = steps;
this.showStep(0);
}
private setupPanZoom(thisShadowRoot: ShadowRoot, svg: SVGElement) {
window.svgPanZoomFun(svg, { window.svgPanZoomFun(svg, {
fit: false, fit: false,
controlIconsEnabled: true, controlIconsEnabled: true,
...@@ -340,6 +358,7 @@ class MathjaxProofTree extends MathjaxAdapter { ...@@ -340,6 +358,7 @@ class MathjaxProofTree extends MathjaxAdapter {
matrix.e = 0; matrix.e = 0;
matrix.f = 0; matrix.f = 0;
// this listener destroys tooltips if the mouse is moved away from the relevant element
svg.addEventListener("mousemove", (e) => { svg.addEventListener("mousemove", (e) => {
if (!this.hoveringOnElement || this.panningSvg) { if (!this.hoveringOnElement || this.panningSvg) {
return; return;
...@@ -349,14 +368,11 @@ class MathjaxProofTree extends MathjaxAdapter { ...@@ -349,14 +368,11 @@ class MathjaxProofTree extends MathjaxAdapter {
const rect = this.hoveringOnElement.getBoundingClientRect(); const rect = this.hoveringOnElement.getBoundingClientRect();
const x2 = (rect.left + rect.right) / 2; const x2 = (rect.left + rect.right) / 2;
const y2 = (rect.top + rect.bottom) / 2; const y2 = (rect.top + rect.bottom) / 2;
if ((x1-x2)*(x1-x2) + (y1-y2)*(y1-y2) > (rect.width*rect.width)) { // use relative distance if ((x1 - x2) * (x1 - x2) + (y1 - y2) * (y1 - y2) > (rect.width * rect.width)) { // use relative distance
this.destroyTooltip(); this.destroyTooltip();
} }
}); });
} }
this.steps = steps;
this.showStep(0);
}
protected calculateSteps(extraData: any): void { protected calculateSteps(extraData: any): void {
const data = typeof extraData === "string" ? JSON.parse(extraData) : []; const data = typeof extraData === "string" ? JSON.parse(extraData) : [];
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment