This commit is contained in:
ucrhh 2021-03-05 20:42:49 +01:00
commit 098a358a0d
15 changed files with 83 additions and 36 deletions

View File

@ -5,3 +5,7 @@ vaadin-button {
vaadin-button, iron-icon, vaadin-drawer-toggle { vaadin-button, iron-icon, vaadin-drawer-toggle {
cursor: pointer; cursor: pointer;
} }
#closeIcon:hover {
color: rgb(120, 120, 120);
}

View File

@ -0,0 +1,3 @@
:host(:hover)::before {
opacity: 0.12;
}

View File

@ -15,7 +15,8 @@
#languageSelect { #languageSelect {
position: absolute; position: absolute;
right: 0; margin: 0;
left: 0;
} }
#accordion { #accordion {

View File

@ -4,11 +4,13 @@ import com.vaadin.flow.component.button.Button;
import com.vaadin.flow.component.icon.Icon; import com.vaadin.flow.component.icon.Icon;
import com.vaadin.flow.component.icon.VaadinIcon; import com.vaadin.flow.component.icon.VaadinIcon;
import com.vaadin.flow.component.orderedlayout.HorizontalLayout; import com.vaadin.flow.component.orderedlayout.HorizontalLayout;
import com.vaadin.flow.i18n.LocaleChangeEvent;
import com.vaadin.flow.i18n.LocaleChangeObserver;
/** /**
* Provides a GUI in form of buttons for the user to navigate through steps. * Provides a GUI in form of buttons for the user to navigate through steps.
*/ */
public class ControlPanel extends HorizontalLayout { public class ControlPanel extends HorizontalLayout implements LocaleChangeObserver {
public static final String ID = "control-panel"; public static final String ID = "control-panel";
private final Button firstStep; private final Button firstStep;
@ -85,4 +87,13 @@ public class ControlPanel extends HorizontalLayout {
public void setEnabledShareButton(boolean setEnabled) { public void setEnabledShareButton(boolean setEnabled) {
share.setEnabled(setEnabled); share.setEnabled(setEnabled);
} }
@Override
public void localeChange(LocaleChangeEvent event) {
share.getElement().setAttribute("title", getTranslation("root.shareButtonTooltip"));
firstStep.getElement().setAttribute("title", getTranslation("root.firstStepTooltip"));
previousStep.getElement().setAttribute("title", getTranslation("root.previousStepTooltip"));
nextStep.getElement().setAttribute("title", getTranslation("root.nextStepTooltip"));
lastStep.getElement().setAttribute("title", getTranslation("root.lastStepTooltip"));
}
} }

View File

@ -25,7 +25,7 @@ public class ShareDialog extends Dialog implements LocaleChangeObserver {
private static final String CLOSE_ICON_ID = "closeIcon"; private static final String CLOSE_ICON_ID = "closeIcon";
private final TextField urlField; private final TextField urlField;
private final TextField packageField; private final TextArea packageArea;
private final TextArea latexArea; private final TextArea latexArea;
private final H3 heading; private final H3 heading;
@ -34,11 +34,9 @@ public class ShareDialog extends Dialog implements LocaleChangeObserver {
* to the String that is passed as corresponding parameter. * to the String that is passed as corresponding parameter.
* *
* @param url a permalink to share with other users * @param url a permalink to share with other users
* @param latexPackages the needed LaTeX-packages to use the displayed mathematics
* in other LaTeX documents. Should be in the form \\usepackage&ltpackage&gt
* @param latexCode LaTeX code for users to copy into their own LaTeX document(s) * @param latexCode LaTeX code for users to copy into their own LaTeX document(s)
*/ */
public ShareDialog(String url, String latexPackages, String latexCode) { public ShareDialog(String url, String latexCode) {
HorizontalLayout headingLayout = new HorizontalLayout(); HorizontalLayout headingLayout = new HorizontalLayout();
headingLayout.setId(HEADING_LAYOUT_ID); headingLayout.setId(HEADING_LAYOUT_ID);
@ -55,17 +53,17 @@ public class ShareDialog extends Dialog implements LocaleChangeObserver {
setId(SHARE_DIALOG_ID); setId(SHARE_DIALOG_ID);
urlField = new TextField(); urlField = new TextField();
packageField = new TextField(); packageArea = new TextArea();
latexArea = new TextArea(); latexArea = new TextArea();
urlField.setValue(url); urlField.setValue(url);
urlField.setClassName(FIELD_CLASS); urlField.setClassName(FIELD_CLASS);
packageField.setValue(latexPackages); packageArea.setValue(getTranslation("share.neededPackages"));
packageField.setClassName(FIELD_CLASS); packageArea.setClassName(FIELD_CLASS);
latexArea.setValue(latexCode); latexArea.setValue(latexCode);
latexArea.setClassName(FIELD_CLASS); latexArea.setClassName(FIELD_CLASS);
layout.add(urlField, packageField, latexArea); layout.add(urlField, packageArea, latexArea);
add(headingLayout, layout); add(headingLayout, layout);
} }
@ -75,7 +73,7 @@ public class ShareDialog extends Dialog implements LocaleChangeObserver {
public void localeChange(LocaleChangeEvent localeChangeEvent) { public void localeChange(LocaleChangeEvent localeChangeEvent) {
heading.setText(getTranslation("share.heading")); heading.setText(getTranslation("share.heading"));
urlField.setLabel(getTranslation("share.url.label")); urlField.setLabel(getTranslation("share.url.label"));
packageField.setLabel(getTranslation("share.packages.label")); packageArea.setLabel(getTranslation("share.packages.label"));
latexArea.setLabel(getTranslation("share.latex.label")); latexArea.setLabel(getTranslation("share.latex.label"));
} }
} }

View File

@ -82,7 +82,7 @@ public class TypeInferenceView extends VerticalLayout
@Override @Override
public void shareButton() { public void shareButton() {
UI.getCurrent().getPage().executeJs("return decodeURI(window.location.href)").then(url -> UI.getCurrent().getPage().executeJs("return decodeURI(window.location.href)").then(url ->
new ShareDialog(url.asString(), lc.getLatexPackages(), lc.getTree()).open() new ShareDialog(url.asString(), lc.getTree()).open()
); );
} }

View File

@ -77,16 +77,6 @@ public class LatexCreator implements StepVisitor {
return constraintsCreator.getTreeNumbers(); return constraintsCreator.getTreeNumbers();
} }
/**
* Returns needed LaTeX packages
*
* @return the packages needed for the LaTeX-code from getTree() to work
*/
public String getLatexPackages() {
return BUSSPROOFS;
}
private String conclusionToLatex(Conclusion conclusion) { private String conclusionToLatex(Conclusion conclusion) {
String typeAssumptions = typeAssumptionsToLatex(conclusion.getTypeAssumptions()); String typeAssumptions = typeAssumptionsToLatex(conclusion.getTypeAssumptions());
String term = new LatexCreatorTerm(conclusion.getLambdaTerm()).getLatex(); String term = new LatexCreatorTerm(conclusion.getLambdaTerm()).getLatex();
@ -155,8 +145,7 @@ public class LatexCreator implements StepVisitor {
tree.insert(0, generateConclusion(varL, LABEL_VAR, UIC)); tree.insert(0, generateConclusion(varL, LABEL_VAR, UIC));
String typeAbstraction = generateTypeAbstraction(varL.getTypeAbsInPremise()); String typeAbstraction = generateTypeAbstraction(varL.getTypeAbsInPremise());
String instantiatedType = new LatexCreatorType(varL.getInstantiatedTypeAbs()).getLatex(); String instantiatedType = new LatexCreatorType(varL.getInstantiatedTypeAbs()).getLatex();
String premiseRight = DOLLAR_SIGN + typeAbstraction + INSTANTIATE_SIGN + instantiatedType String premiseRight = DOLLAR_SIGN + typeAbstraction + INSTANTIATE_SIGN + instantiatedType + DOLLAR_SIGN;
+ DOLLAR_SIGN + NEW_LINE;
String premiseLeft = AXC + CURLY_LEFT + DOLLAR_SIGN + ALIGN_BEGIN String premiseLeft = AXC + CURLY_LEFT + DOLLAR_SIGN + ALIGN_BEGIN
+ generateVarStepPremise(varL).replace(DOLLAR_SIGN, "") + generateVarStepPremise(varL).replace(DOLLAR_SIGN, "")
+ SPACE + LATEX_NEW_LINE + SPACE // todo less replacement fixups + SPACE + LATEX_NEW_LINE + SPACE // todo less replacement fixups

View File

@ -74,6 +74,4 @@ public final class LatexCreatorConstants {
protected static final String ALIGN_END = "\\end{aligned}"; protected static final String ALIGN_END = "\\end{aligned}";
protected static final String SPLIT_BEGIN = "\\begin{split}"; protected static final String SPLIT_BEGIN = "\\begin{split}";
protected static final String SPLIT_END = "\\end{split}"; protected static final String SPLIT_END = "\\end{split}";
protected static final String BUSSPROOFS = "\\usepackage{bussproofs}";
} }

View File

@ -71,6 +71,7 @@ public class InferenceRuleField extends VerticalLayout implements LocaleChangeOb
@Override @Override
public void localeChange(LocaleChangeEvent event) { public void localeChange(LocaleChangeEvent event) {
ruleName.setText(getTranslation(nameKey)); ruleName.setText(getTranslation(nameKey));
copyButton.getElement().setAttribute("title", getTranslation("root.copyLatexTooltip"));
} }
} }

View File

@ -35,12 +35,15 @@ public class InputBar extends HorizontalLayout implements LocaleChangeObserver {
private static final String INFER_BUTTON_ID = "inferButton"; private static final String INFER_BUTTON_ID = "inferButton";
private static final String EXAMPLE_BUTTON_ID = "exampleButton"; private static final String EXAMPLE_BUTTON_ID = "exampleButton";
private static final String LAMBDA_BUTTON_ID = "lambdaButton"; private static final String LAMBDA_BUTTON_ID = "lambdaButton";
private static final String ASS_BUTTON_ID = "assButton";
private static final short MAX_INPUT_LENGTH = 1000; private static final short MAX_INPUT_LENGTH = 1000;
private final transient Consumer<Pair<String, Map<String, String>>> callback; private final transient Consumer<Pair<String, Map<String, String>>> callback;
private final Button infoIcon;
private final TextField inputField; private final TextField inputField;
private TypeAssumptionsArea typeAssumptionsArea; private TypeAssumptionsArea typeAssumptionsArea;
private final Button exampleButton;
private final Button inferTypeButton; private final Button inferTypeButton;
private final Button typeAssumptions; private final Button typeAssumptions;
@ -53,7 +56,7 @@ public class InputBar extends HorizontalLayout implements LocaleChangeObserver {
protected InputBar(Consumer<Pair<String, Map<String, String>>> callback) { protected InputBar(Consumer<Pair<String, Map<String, String>>> callback) {
this.callback = callback; this.callback = callback;
Button infoIcon = new Button(new Icon(VaadinIcon.INFO_CIRCLE)); infoIcon = new Button(new Icon(VaadinIcon.INFO_CIRCLE));
infoIcon.addClickListener(event -> onInfoIconClick()); infoIcon.addClickListener(event -> onInfoIconClick());
inputField = new TextField(); inputField = new TextField();
@ -78,8 +81,9 @@ public class InputBar extends HorizontalLayout implements LocaleChangeObserver {
lambdaButton.setId(LAMBDA_BUTTON_ID); lambdaButton.setId(LAMBDA_BUTTON_ID);
UI.getCurrent().getPage().executeJs("window.lambdaButtonListener($0, $1);", LAMBDA_BUTTON_ID, INPUT_FIELD_ID); UI.getCurrent().getPage().executeJs("window.lambdaButtonListener($0, $1);", LAMBDA_BUTTON_ID, INPUT_FIELD_ID);
typeAssumptions = new Button("", event -> onTypeAssumptionsButton()); typeAssumptions = new Button("", event -> onTypeAssumptionsButton());
typeAssumptions.setId(ASS_BUTTON_ID);
typeAssumptionsArea = new TypeAssumptionsArea(); typeAssumptionsArea = new TypeAssumptionsArea();
Button exampleButton = new Button(VaadinIcon.PAPERCLIP.create(), event -> onExampleButtonClick()); exampleButton = new Button(VaadinIcon.PAPERCLIP.create(), event -> onExampleButtonClick());
exampleButton.setId(EXAMPLE_BUTTON_ID); exampleButton.setId(EXAMPLE_BUTTON_ID);
inferTypeButton = new Button("", event -> onTypeInferButtonClick()); inferTypeButton = new Button("", event -> onTypeInferButtonClick());
inferTypeButton.addClickShortcut(Key.ENTER).listenOn(this); inferTypeButton.addClickShortcut(Key.ENTER).listenOn(this);
@ -138,5 +142,7 @@ public class InputBar extends HorizontalLayout implements LocaleChangeObserver {
inputField.setPlaceholder(getTranslation("root.inputFieldPlaceholder")); inputField.setPlaceholder(getTranslation("root.inputFieldPlaceholder"));
inferTypeButton.setText(getTranslation("root.typeInfer")); inferTypeButton.setText(getTranslation("root.typeInfer"));
typeAssumptions.setText(getTranslation("root.typeAssumptions")); typeAssumptions.setText(getTranslation("root.typeAssumptions"));
infoIcon.getElement().setAttribute("title", getTranslation("root.inputSyntax"));
exampleButton.getElement().setAttribute("title", getTranslation("root.exampleTooltip"));
} }
} }

View File

@ -9,6 +9,9 @@ import com.vaadin.flow.component.html.H1;
import com.vaadin.flow.component.icon.Icon; import com.vaadin.flow.component.icon.Icon;
import com.vaadin.flow.component.icon.VaadinIcon; import com.vaadin.flow.component.icon.VaadinIcon;
import com.vaadin.flow.component.orderedlayout.HorizontalLayout; import com.vaadin.flow.component.orderedlayout.HorizontalLayout;
import com.vaadin.flow.i18n.LocaleChangeEvent;
import com.vaadin.flow.i18n.LocaleChangeObserver;
import edu.kit.typicalc.view.main.MainView.MainViewListener; import edu.kit.typicalc.view.main.MainView.MainViewListener;
import org.apache.commons.lang3.tuple.Pair; import org.apache.commons.lang3.tuple.Pair;
@ -20,7 +23,9 @@ import java.util.function.Consumer;
* Contains all the components constantly shown in the upper part of the webpage. * Contains all the components constantly shown in the upper part of the webpage.
*/ */
@CssImport("./styles/view/main/upper-bar.css") @CssImport("./styles/view/main/upper-bar.css")
public class UpperBar extends HorizontalLayout { @CssImport(value = "./styles/view/button-hover.css", themeFor = "vaadin-button")
@CssImport(value = "./styles/view/button-hover.css", themeFor = "vaadin-drawer-toggle")
public class UpperBar extends HorizontalLayout implements LocaleChangeObserver {
private static final long serialVersionUID = -7344967027514015830L; private static final long serialVersionUID = -7344967027514015830L;
/* /*
@ -32,6 +37,8 @@ public class UpperBar extends HorizontalLayout {
private static final String UPPER_BAR_ID = "header"; private static final String UPPER_BAR_ID = "header";
private final InputBar inputBar; private final InputBar inputBar;
private final Button toggle;
private final Button helpButton;
private final transient MainViewListener presenter; private final transient MainViewListener presenter;
private final transient Consumer<Pair<String, Map<String, String>>> setTermInURL; private final transient Consumer<Pair<String, Map<String, String>>> setTermInURL;
@ -47,15 +54,16 @@ public class UpperBar extends HorizontalLayout {
this.presenter = presenter; this.presenter = presenter;
this.setTermInURL = setTermInURL; this.setTermInURL = setTermInURL;
toggle = new DrawerToggle();
H1 viewTitle = new H1(new Anchor("/", getTranslation("root.typicalc"))); H1 viewTitle = new H1(new Anchor("/", getTranslation("root.typicalc")));
viewTitle.setId(VIEW_TITLE_ID); viewTitle.setId(VIEW_TITLE_ID);
this.inputBar = new InputBar(this::typeInfer); this.inputBar = new InputBar(this::typeInfer);
inputBar.setId(INPUT_BAR_ID); inputBar.setId(INPUT_BAR_ID);
Button helpIcon = new Button(new Icon(VaadinIcon.QUESTION_CIRCLE)); helpButton = new Button(new Icon(VaadinIcon.QUESTION_CIRCLE));
helpIcon.addClickListener(event -> onHelpIconClick()); helpButton.addClickListener(event -> onHelpIconClick());
helpIcon.setId(HELP_ICON_ID); helpButton.setId(HELP_ICON_ID);
add(new DrawerToggle(), viewTitle, inputBar, helpIcon); add(toggle, viewTitle, inputBar, helpButton);
setId(UPPER_BAR_ID); setId(UPPER_BAR_ID);
getThemeList().set("dark", true); getThemeList().set("dark", true);
setSpacing(false); setSpacing(false);
@ -94,4 +102,10 @@ public class UpperBar extends HorizontalLayout {
Dialog helpDialog = new HelpDialog(); Dialog helpDialog = new HelpDialog();
helpDialog.open(); helpDialog.open();
} }
@Override
public void localeChange(LocaleChangeEvent event) {
toggle.getElement().setAttribute("title", getTranslation("root.drawerToggleTooltip"));
helpButton.getElement().setAttribute("title", getTranslation("root.helpIconTooltip"));
}
} }

View File

@ -80,3 +80,7 @@ root.varLetLatex=\
\\LeftLabel{\\textrm V{\\small AR}}\ \\LeftLabel{\\textrm V{\\small AR}}\
\\BinaryInfC{$\\Gamma \\vdash \\texttt{x} : \\tau$}\ \\BinaryInfC{$\\Gamma \\vdash \\texttt{x} : \\tau$}\
\\end{prooftree} \\end{prooftree}
share.neededPackages=\
\\usepackage{bussproofs}\n\
\\usepackage{amsmath}

View File

@ -107,6 +107,15 @@ root.text7=Der Teilen-Knopfs wird betätigt, um das entsprechende Dialogfenster
root.image8=/carousel/UseExportDialog.png root.image8=/carousel/UseExportDialog.png
root.text8=In dem Dialogfenster sind der Permalink zur aktuellen Seite, der Latex-Code des Baums und die im Code \ root.text8=In dem Dialogfenster sind der Permalink zur aktuellen Seite, der Latex-Code des Baums und die im Code \
verwendeten Pakete aufgelistet. verwendeten Pakete aufgelistet.
root.copyLatexTooltip=Kopiere LaTeX-code
root.drawerToggleTooltip=Ableitungsregeln
root.helpIconTooltip=Hilfe und Sprachwechsel
root.exampleTooltip=Beispielterme
root.shareButtonTooltip=LaTeX-Code und Permalink
root.lastStepTooltip=Letzter Schritt
root.firstStepTooltip=Erster Schritt
root.previousStepTooltip=Vorheriger Schritt
root.nextStepTooltip=Nächster Schritt
root.absLetLatex=\ root.absLetLatex=\
\\begin{prooftree}\ \\begin{prooftree}\

View File

@ -100,6 +100,15 @@ root.text7=The share button is clicked to open up the corresponding dialog.
root.image8=/carousel/UseExportDialog.png root.image8=/carousel/UseExportDialog.png
root.text8=The dialog contains a permalink to the current page, the LaTeX-code of the tree and the packages needed \ root.text8=The dialog contains a permalink to the current page, the LaTeX-code of the tree and the packages needed \
to compile the code. to compile the code.
root.copyLatexTooltip=Copy LaTeX code
root.drawerToggleTooltip=Type inference rules
root.helpIconTooltip=Help and language switch
root.exampleTooltip=Example terms
root.shareButtonTooltip=LaTeX code and permalink
root.lastStepTooltip=Last step
root.firstStepTooltip=First step
root.previousStepTooltip=Previous step
root.nextStepTooltip=Next step
root.absLetLatex=\ root.absLetLatex=\
\\begin{prooftree}\ \\begin{prooftree}\

View File

@ -47,7 +47,7 @@ public class InputBarElement extends HorizontalLayoutElement {
* Opens the type assumptions area. * Opens the type assumptions area.
*/ */
public void openTypeAssumptionsArea() { public void openTypeAssumptionsArea() {
$(ButtonElement.class).first().click(); $(ButtonElement.class).id("assButton").click();
} }
} }