From 2bc908e6602a8c32ce68e29c8fb32e52034f5676 Mon Sep 17 00:00:00 2001
From: Arne Keller <arne.keller@student.kit.edu>
Date: Mon, 20 Sep 2021 10:32:25 +0200
Subject: [PATCH] Fix explanation text language switch

closes #30
---
 frontend/src/mathjax-explanation.ts           | 27 ++++++++++---------
 .../MathjaxExplanation.java                   |  5 ++--
 .../TypeInferenceView.java                    |  3 +--
 3 files changed, 19 insertions(+), 16 deletions(-)

diff --git a/frontend/src/mathjax-explanation.ts b/frontend/src/mathjax-explanation.ts
index 94f83eb..99aeed8 100644
--- a/frontend/src/mathjax-explanation.ts
+++ b/frontend/src/mathjax-explanation.ts
@@ -15,17 +15,17 @@ class MathjaxExplanation extends MathjaxAdapter {
 	}
 
 	protected calculateSteps(_extraData: any) {
-		let first = true;
 		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;
 			stepIdx++;
 			text.onclick = () => {
 				// @ts-ignore
 				this.$server!.switchToStep(thisStepIdx);
 			};
-			if (first) {
-				first = false; // show first step
+			// show initial step
+			if (thisStepIdx === this.lastStepShown) {
+				this.scrollToElementIfNeeded(text);
 				continue;
 			}
 			text.style.opacity = "0.5";
@@ -38,19 +38,22 @@ class MathjaxExplanation extends MathjaxAdapter {
 			lastEl.style.opacity = "0.5";
 		}
 		let el = this.getElementForStep(n);
+		this.lastStepShown = n;
 		if (el) {
-			this.lastStepShown = n;
-			// 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);
-			}
+			this.scrollToElementIfNeeded(el);
 			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 {
 		return this.shadowRoot!.getElementById("tc-text-" + n)
 	}
diff --git a/src/main/java/edu/kit/typicalc/view/content/typeinferencecontent/MathjaxExplanation.java b/src/main/java/edu/kit/typicalc/view/content/typeinferencecontent/MathjaxExplanation.java
index 9c2de43..e963e71 100644
--- a/src/main/java/edu/kit/typicalc/view/content/typeinferencecontent/MathjaxExplanation.java
+++ b/src/main/java/edu/kit/typicalc/view/content/typeinferencecontent/MathjaxExplanation.java
@@ -34,8 +34,9 @@ public class MathjaxExplanation extends LitTemplate implements MathjaxAdapter {
      *
      * @param view the type inference view this explanation text is attached to
      * @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.latex = latex;
         StringBuilder finalTex = new StringBuilder("<div>");
@@ -46,7 +47,7 @@ public class MathjaxExplanation extends LitTemplate implements MathjaxAdapter {
         }
         var finalString = finalTex.append("</div>").toString();
         content.add(new Html(finalString));
-        showStep(0);
+        showStep(initialStep);
     }
 
     @Override
diff --git a/src/main/java/edu/kit/typicalc/view/content/typeinferencecontent/TypeInferenceView.java b/src/main/java/edu/kit/typicalc/view/content/typeinferencecontent/TypeInferenceView.java
index bac6466..1fed82a 100644
--- a/src/main/java/edu/kit/typicalc/view/content/typeinferencecontent/TypeInferenceView.java
+++ b/src/main/java/edu/kit/typicalc/view/content/typeinferencecontent/TypeInferenceView.java
@@ -130,7 +130,7 @@ public class TypeInferenceView extends VerticalLayout
         container.setId(CONTENT_ID2);
         unification = new MathjaxUnification(lc.getUnification());
         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) {
             tree = new MathjaxProofTree(lc.getTree(), stepAnnotations);
@@ -144,7 +144,6 @@ public class TypeInferenceView extends VerticalLayout
 
         TypeInferenceRules rules = new TypeInferenceRules();
         rules.setId(RULES_ID);
-        rulesVisible = false;
         rules.getElement().setVisible(rulesVisible);
         button.addClickListener(e -> {
             rulesVisible = !rulesVisible;