arnekeller/Typicalc
1
0
Fork 0
mirror of https://gitlab.kit.edu/uskyk/typicalc.git synced 2024-11-08 18:30:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix explanation text language switch

Browse Source 
closes #30
This commit is contained in:
Arne Keller 2021-09-20 10:32:25 +02:00
parent cbe7d47cdd
commit 2bc908e660
3 changed files with 19 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
frontend/src/mathjax-explanation.ts
View File

@ -15,17 +15,17 @@ class MathjaxExplanation extends MathjaxAdapter {
} }
protected calculateSteps(_extraData: any) { protected calculateSteps(_extraData: any) {
let first = true;
let stepIdx = 0; let stepIdx = 0;
for (let text of this.shadowRoot!.querySelectorAll<SVGGraphicsElement>(".tc-text")) { for (let text of this.shadowRoot!.querySelectorAll<HTMLElement>(".tc-text")) {
let thisStepIdx = stepIdx; let thisStepIdx = stepIdx;
stepIdx++; stepIdx++;
text.onclick = () => { text.onclick = () => {
// @ts-ignore // @ts-ignore
this.$server!.switchToStep(thisStepIdx); this.$server!.switchToStep(thisStepIdx);
}; };
if (first) { // show initial step
first = false; // show first step if (thisStepIdx === this.lastStepShown) {
this.scrollToElementIfNeeded(text);
continue; continue;
} }
text.style.opacity = "0.5"; text.style.opacity = "0.5";
@ -38,19 +38,22 @@ class MathjaxExplanation extends MathjaxAdapter {
lastEl.style.opacity = "0.5"; lastEl.style.opacity = "0.5";
} }
let el = this.getElementForStep(n); let el = this.getElementForStep(n);
this.lastStepShown = n;
if (el) { if (el) {
this.lastStepShown = n; this.scrollToElementIfNeeded(el);
// scroll to element if needed
const hostEl = this.shadowRoot!.host as HTMLElement;
const dy = el.offsetTop - hostEl.offsetTop - hostEl.scrollTop;
// end of text is below the container or the start of the text is above the container:
if (dy + el.offsetHeight > hostEl.offsetHeight || dy < 0) {
hostEl.scrollBy(0, -hostEl.scrollTop + el.offsetTop - hostEl.offsetTop);
}
el.style.opacity = "1.0"; el.style.opacity = "1.0";
} }
} }
private scrollToElementIfNeeded(el: HTMLElement) {
const hostEl = this.shadowRoot!.host as HTMLElement;
const dy = el.offsetTop - hostEl.offsetTop - hostEl.scrollTop;
// end of text is below the container or the start of the text is above the container:
if (dy + el.offsetHeight > hostEl.offsetHeight || dy < 0) {
hostEl.scrollBy(0, -hostEl.scrollTop + el.offsetTop - hostEl.offsetTop);
}
}
private getElementForStep(n: number): HTMLElement | null { private getElementForStep(n: number): HTMLElement | null {
return this.shadowRoot!.getElementById("tc-text-" + n) return this.shadowRoot!.getElementById("tc-text-" + n)
} }

5
src/main/java/edu/kit/typicalc/view/content/typeinferencecontent/MathjaxExplanation.java
View File

@ -34,8 +34,9 @@ public class MathjaxExplanation extends LitTemplate implements MathjaxAdapter {
* *
* @param view the type inference view this explanation text is attached to * @param view the type inference view this explanation text is attached to
* @param latex the latex texts for all steps * @param latex the latex texts for all steps
* @param initialStep the step to show initially
*/ */
public MathjaxExplanation(TypeInferenceView view, List<String> latex) { public MathjaxExplanation(TypeInferenceView view, List<String> latex, int initialStep) {
this.typeInferenceView = view; this.typeInferenceView = view;
this.latex = latex; this.latex = latex;
StringBuilder finalTex = new StringBuilder("<div>"); StringBuilder finalTex = new StringBuilder("<div>");
@ -46,7 +47,7 @@ public class MathjaxExplanation extends LitTemplate implements MathjaxAdapter {
} }
var finalString = finalTex.append("</div>").toString(); var finalString = finalTex.append("</div>").toString();
content.add(new Html(finalString)); content.add(new Html(finalString));
showStep(0); showStep(initialStep);
} }
@Override @Override

3
src/main/java/edu/kit/typicalc/view/content/typeinferencecontent/TypeInferenceView.java
View File

@ -130,7 +130,7 @@ public class TypeInferenceView extends VerticalLayout
container.setId(CONTENT_ID2); container.setId(CONTENT_ID2);
unification = new MathjaxUnification(lc.getUnification()); unification = new MathjaxUnification(lc.getUnification());
var explainer = new ExplanationCreator(typeInferer, getLocale()); var explainer = new ExplanationCreator(typeInferer, getLocale());
this.explanation = new MathjaxExplanation(this, explainer.getExplanationTexts()); this.explanation = new MathjaxExplanation(this, explainer.getExplanationTexts(), this.currentStep);
if (tree == null) { if (tree == null) {
tree = new MathjaxProofTree(lc.getTree(), stepAnnotations); tree = new MathjaxProofTree(lc.getTree(), stepAnnotations);
@ -144,7 +144,6 @@ public class TypeInferenceView extends VerticalLayout
TypeInferenceRules rules = new TypeInferenceRules(); TypeInferenceRules rules = new TypeInferenceRules();
rules.setId(RULES_ID); rules.setId(RULES_ID);
rulesVisible = false;
rules.getElement().setVisible(rulesVisible); rules.getElement().setVisible(rulesVisible);
button.addClickListener(e -> { button.addClickListener(e -> {
rulesVisible = !rulesVisible; rulesVisible = !rulesVisible;