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

DrawerContent erweitert + styling und logik besser getrennt

Browse Source
This commit is contained in:
Moritz Dieing 2021-01-30 01:28:53 +01:00
parent 38399222e5
commit 69b9ef4773
10 changed files with 88 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
frontend/styles/view/main/drawer-content.css
View File

@ -1,11 +1,14 @@
#ruleContainer {
overflow: auto;
margin: 0;
margin: 1px;
height: 100%;
max-width: 256px;
padding: 0.5em 0.5em;
padding: 1.1em 0.5em 0.5em 0.5em;
}
#drawerContent {
padding: 0.5em 0;
width: 100%;
height: 100%;
align-items: center;
}

2
frontend/styles/view/main/help-dialog.css
View File

@ -4,4 +4,6 @@
#headingLayout {
width: 80vw;
align-items: center;
justify-content: center;
}

30
frontend/styles/view/main/inference-rule-field.css Normal file
View File

@ -0,0 +1,30 @@
#inferenceRuleField {
display: flex;
align-items: center;
border: 2px solid #e8e8e8;
border-radius: 5px;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
margin-top: 0.25em;
margin-bottom: 0.25em;
padding: 0px;
}
#headerField {
border-bottom: 2px solid #e8e8e8;
background-color: #f8f8f8;
align-items: center;
justify-content: center;
width: 100%;
padding: 0.5em 0em;
}
#ruleName {
margin: 1px;
}
#main {
align-items: center;
width: 100%;
margin: 0px;
padding-top: 0.2em;
}

4
frontend/styles/view/main/input-bar.css
View File

@ -13,3 +13,7 @@
#inputField {
height: 2.3em;
}
#inputBar {
align-items: center;
}

2
frontend/styles/view/main/upper-bar.css
View File

@ -1,5 +1,7 @@
#header {
height: var(--lumo-size-xl);
width: 100%;
align-items: center;
}
#header img {

12
src/main/java/edu/kit/typicalc/view/main/DrawerContent.java
View File

@ -2,7 +2,6 @@ package edu.kit.typicalc.view.main;
import com.vaadin.flow.component.dependency.CssImport;
import com.vaadin.flow.component.html.H3;
import com.vaadin.flow.component.orderedlayout.FlexComponent;
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
import com.vaadin.flow.i18n.LocaleChangeEvent;
import com.vaadin.flow.i18n.LocaleChangeObserver;
@ -12,6 +11,9 @@ public class DrawerContent extends VerticalLayout implements LocaleChangeObserve
private static final long serialVersionUID = -5751275682270653335L;
/*
* Id's for the imported css-file
*/
private static final String RULE_CONTAINER_ID = "ruleContainer";
private static final String DRAWER_CONTENT_ID = "drawerContent";
@ -24,13 +26,15 @@ public class DrawerContent extends VerticalLayout implements LocaleChangeObserve
ruleContainer.setId(RULE_CONTAINER_ID);
initRuleContainer();
add(heading, ruleContainer);
setWidthFull();
setHeightFull();
setAlignItems(FlexComponent.Alignment.CENTER);
setId(DRAWER_CONTENT_ID);
}
private void initRuleContainer() {
//TODO just demo content, exchange with correct rules
ruleContainer.add(new InferenceRuleField(getTranslation("abs-rule"), "root.absRule"));
ruleContainer.add(new InferenceRuleField(getTranslation("abs-rule"), "root.absRule"));
ruleContainer.add(new InferenceRuleField(getTranslation("abs-rule"), "root.absRule"));
ruleContainer.add(new InferenceRuleField(getTranslation("abs-rule"), "root.absRule"));
ruleContainer.add(new InferenceRuleField(getTranslation("abs-rule"), "root.absRule"));
}

7
src/main/java/edu/kit/typicalc/view/main/HelpDialog.java
View File

@ -4,8 +4,6 @@ import com.vaadin.flow.component.dependency.CssImport;
import com.vaadin.flow.component.dialog.Dialog;
import com.vaadin.flow.component.html.H3;
import com.vaadin.flow.component.html.H5;
import com.vaadin.flow.component.orderedlayout.FlexComponent;
import com.vaadin.flow.component.orderedlayout.FlexComponent.JustifyContentMode;
import com.vaadin.flow.component.orderedlayout.HorizontalLayout;
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
import com.vaadin.flow.i18n.LocaleChangeEvent;
@ -16,6 +14,9 @@ public class HelpDialog extends Dialog implements LocaleChangeObserver {
private static final long serialVersionUID = 4470277770276296164L;
/*
* Id's for the imported css-file
*/
private static final String HEADING_LAYOUT_ID = "headingLayout";
private static final String CONTENT_LAYOUT_ID = "contentLayout";
@ -27,8 +28,6 @@ public class HelpDialog extends Dialog implements LocaleChangeObserver {
heading = new H3(getTranslation("root.operatingHelp"));
headingLayout.setId(HEADING_LAYOUT_ID);
headingLayout.add(heading);
headingLayout.setAlignItems(FlexComponent.Alignment.CENTER);
headingLayout.setJustifyContentMode(JustifyContentMode.CENTER);
final VerticalLayout contentLayout = new VerticalLayout();
inputSyntax = new H5(getTranslation("root.inputSyntax"));

31
src/main/java/edu/kit/typicalc/view/main/InferenceRuleField.java
View File

@ -2,34 +2,51 @@ package edu.kit.typicalc.view.main;
import com.vaadin.flow.component.UI;
import com.vaadin.flow.component.button.Button;
import com.vaadin.flow.component.dependency.CssImport;
import com.vaadin.flow.component.dependency.JsModule;
import com.vaadin.flow.component.html.Div;
import com.vaadin.flow.component.html.H5;
import com.vaadin.flow.component.html.H4;
import com.vaadin.flow.component.icon.Icon;
import com.vaadin.flow.component.icon.VaadinIcon;
import com.vaadin.flow.component.orderedlayout.HorizontalLayout;
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
import com.vaadin.flow.i18n.LocaleChangeEvent;
import com.vaadin.flow.i18n.LocaleChangeObserver;
@CssImport("./styles/view/main/inference-rule-field.css")
@JsModule("./src/copy-to-clipboard.js")
public class InferenceRuleField extends Div implements LocaleChangeObserver {
//TODO add css!
public class InferenceRuleField extends VerticalLayout implements LocaleChangeObserver {
private static final long serialVersionUID = -8551851183297707985L;
/*
* Id's for the imported css-file
*/
private static final String INFERENCE_RULE_FIELD_ID = "inferenceRuleField";
private static final String HEADER_ID = "headerField";
private static final String MAIN_ID = "main";
private static final String RULE_NAME_ID = "ruleName";
private final String nameKey;
private final Button copyButton;
private final H5 ruleName;
private final H4 ruleName;
private final MathjaxDisplay rule;
public InferenceRuleField(final String latex, final String nameKey) {
this.nameKey = nameKey;
this.ruleName = new H5(getTranslation(nameKey));
final HorizontalLayout header = new HorizontalLayout();
header.setId(HEADER_ID);
this.ruleName = new H4(getTranslation(nameKey));
ruleName.setId(RULE_NAME_ID);
header.add(ruleName);
final VerticalLayout main = new VerticalLayout();
main.setId(MAIN_ID);
this.copyButton = new Button(getTranslation("root.copyLatex"), new Icon(VaadinIcon.CLIPBOARD));
this.rule = new MathjaxDisplay(latex); //TODO scale, when method implemented
copyButton.addClickListener(event -> UI.getCurrent().getPage().executeJs("window.copyToClipboard($0)", latex));
add(ruleName, rule, copyButton);
main.add(rule, copyButton);
add(header, main);
setId(INFERENCE_RULE_FIELD_ID);
}

7
src/main/java/edu/kit/typicalc/view/main/InputBar.java
View File

@ -15,7 +15,6 @@ import com.vaadin.flow.component.dependency.CssImport;
import com.vaadin.flow.component.html.H5;
import com.vaadin.flow.component.icon.Icon;
import com.vaadin.flow.component.icon.VaadinIcon;
import com.vaadin.flow.component.orderedlayout.FlexComponent;
import com.vaadin.flow.component.orderedlayout.HorizontalLayout;
import com.vaadin.flow.i18n.LocaleChangeEvent;
import com.vaadin.flow.i18n.LocaleChangeObserver;
@ -28,7 +27,11 @@ public class InputBar extends HorizontalLayout implements LocaleChangeObserver {
private static final long serialVersionUID = -6099700300418752958L;
/*
* Id's for the imported css-file
*/
private static final String INPUT_FIELD_ID = "inputField";
private static final String INPUT_BAR_ID = "inputBar";
private final Tooltip infoTooltip;
private final Icon infoIcon;
@ -67,7 +70,7 @@ public class InputBar extends HorizontalLayout implements LocaleChangeObserver {
inferTypeButton.addThemeVariants(ButtonVariant.LUMO_PRIMARY);
add(infoTooltip, infoIcon, exampleButton, lambdaButton, inputField, inferTypeButton);
setAlignItems(FlexComponent.Alignment.CENTER);
setId(INPUT_BAR_ID);
}
private void onTypeInferButtonClick(final Consumer<String> callback) {

11
src/main/java/edu/kit/typicalc/view/main/UpperBar.java
View File

@ -8,7 +8,6 @@ import com.vaadin.flow.component.dialog.Dialog;
import com.vaadin.flow.component.html.H1;
import com.vaadin.flow.component.icon.Icon;
import com.vaadin.flow.component.icon.VaadinIcon;
import com.vaadin.flow.component.orderedlayout.FlexComponent;
import com.vaadin.flow.component.orderedlayout.HorizontalLayout;
import edu.kit.typicalc.view.content.infocontent.StartPageView;
import edu.kit.typicalc.view.main.MainView.MainViewListener;
@ -21,6 +20,9 @@ public class UpperBar extends HorizontalLayout {
private static final long serialVersionUID = -7344967027514015830L;
/*
* Id's for the imported css-file
*/
private static final String VIEW_TITLE_ID = "viewTitle";
private static final String INPUT_BAR_ID = "inputBar";
private static final String HELP_ICON_ID = "helpIcon";
@ -41,21 +43,18 @@ public class UpperBar extends HorizontalLayout {
this.presenter = presenter;
this.viewTitle = new H1(getTranslation("root.typicalc"));
viewTitle.addClickListener(event -> this.getUI().get().navigate(StartPageView.class));
viewTitle.setId(VIEW_TITLE_ID);
this.inputBar = new InputBar(this::typeInfer);
inputBar.setId(INPUT_BAR_ID);
this.helpIcon = new Icon(VaadinIcon.QUESTION_CIRCLE);
helpIcon.addClickListener(event -> onHelpIconClick());
helpIcon.setId(HELP_ICON_ID);
viewTitle.addClickListener(event -> this.getUI().get().navigate(StartPageView.class));
add(new DrawerToggle(), viewTitle, inputBar, helpIcon);
setId(UPPER_BAR_ID);
getThemeList().set("dark", true); //TODO remove magic string
setWidthFull();
setSpacing(false);
setAlignItems(FlexComponent.Alignment.CENTER);
}
/**