Skip to content

Commit

Permalink
feat: add support to change source code position
Browse files Browse the repository at this point in the history
Close #72
  • Loading branch information
flang authored and javier-godoy committed Nov 23, 2023
1 parent 92d53b6 commit 102479f
Show file tree
Hide file tree
Showing 6 changed files with 108 additions and 12 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -62,4 +62,7 @@
*/
String language() default DEFAULT_VALUE;

/** Source code position in the layout */
SourcePosition sourcePosition() default SourcePosition.SECONDARY;

}
Original file line number Diff line number Diff line change
Expand Up @@ -11,23 +11,23 @@ public class MultiSourceCodeViewer extends Div {

private static final String DATA_URL = "source-url";
private static final String DATA_LANGUAGE = "source-language";
private static final String DATA_POSITION = "source-position";

private SourceCodeViewer codeViewer;
private Tab selectedTab;

public MultiSourceCodeViewer(List<SourceCodeTab> sourceCodeTabs, Map<String, String> properties) {

Tab tab;
if (sourceCodeTabs.size() > 1) {
Tabs tabs = new Tabs(createTabs(sourceCodeTabs));
tabs.addSelectedChangeListener(ev -> onTabSelected(ev.getSelectedTab()));
add(tabs);
tab = tabs.getSelectedTab();
selectedTab = tabs.getSelectedTab();
} else {
tab = createTab(sourceCodeTabs.get(0));
selectedTab = createTab(sourceCodeTabs.get(0));
}

String url = (String) ComponentUtil.getData(tab, DATA_URL);
String language = (String) ComponentUtil.getData(tab, DATA_LANGUAGE);
String url = (String) ComponentUtil.getData(selectedTab, DATA_URL);
String language = (String) ComponentUtil.getData(selectedTab, DATA_LANGUAGE);
codeViewer = new SourceCodeViewer(url, language, properties);

add(codeViewer);
Expand Down Expand Up @@ -74,6 +74,7 @@ private Tab createTab(SourceCodeTab sourceCodeTab) {
Tab tab = new Tab(caption);
ComponentUtil.setData(tab, DATA_URL, url);
ComponentUtil.setData(tab, DATA_LANGUAGE, language);
ComponentUtil.setData(tab, DATA_POSITION, sourceCodeTab.getSourcePosition());
return tab;
}

Expand All @@ -88,6 +89,8 @@ private String getExtension(String filename) {
}

private void onTabSelected(Tab tab) {
this.selectedTab = tab;

String url = (String) ComponentUtil.getData(tab, DATA_URL);
String language = (String) ComponentUtil.getData(tab, DATA_LANGUAGE);
fetchContents(url, language);
Expand All @@ -97,4 +100,8 @@ private void fetchContents(String url, String language) {
codeViewer.fetchContents(url, language);
}

public SourcePosition getSourcePosition() {
return (SourcePosition) ComponentUtil.getData(selectedTab, DATA_POSITION);
}

}
Original file line number Diff line number Diff line change
Expand Up @@ -17,5 +17,7 @@ public class SourceCodeTab {
private final String url;
private String caption;
private String language;
@NonNull
private final SourcePosition sourcePosition;

}
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
package com.flowingcode.vaadin.addons.demo;

public enum SourcePosition {

PRIMARY, SECONDARY;

public SourcePosition toggle() {
switch (this) {
case SECONDARY:
return PRIMARY;
case PRIMARY:
default:
return SECONDARY;
}
}

}
Original file line number Diff line number Diff line change
Expand Up @@ -28,14 +28,18 @@
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import java.util.Objects;
import java.util.Optional;
import org.apache.commons.lang3.StringUtils;

@SuppressWarnings("serial")
class SplitLayoutDemo extends Composite<SplitLayout> {

private MultiSourceCodeViewer code;
private SourcePosition sourcePosition;

public SplitLayoutDemo(Component demo, String sourceUrl) {
this(demo, Arrays.asList(new SourceCodeTab(sourceUrl)));
public SplitLayoutDemo(Component demo, String sourceUrl, SourcePosition sourcePosition) {
this(demo, Arrays.asList(new SourceCodeTab(sourceUrl, sourcePosition)));
}

public SplitLayoutDemo(Component demo, List<SourceCodeTab> tabs) {
Expand All @@ -46,11 +50,37 @@ public SplitLayoutDemo(Component demo, List<SourceCodeTab> tabs) {
properties.put("flow", Version.getFullVersion());

code = new MultiSourceCodeViewer(tabs, properties);
getContent().addToPrimary(demo);
getContent().addToSecondary(code);

this.sourcePosition = code.getSourcePosition();
switch (this.sourcePosition) {
case PRIMARY:
getContent().addToPrimary(code);
getContent().addToSecondary(demo);
break;
case SECONDARY:
default:
getContent().addToPrimary(demo);
getContent().addToSecondary(code);
}

getContent().setSizeFull();
}

public void switchSourcePosition(SourcePosition position) {
if (!this.sourcePosition.equals(position)) {
toggleSourcePosition();
}
}

public void toggleSourcePosition() {
Component primary = getContent().getPrimaryComponent();
Component secondary = getContent().getSecondaryComponent();
getContent().removeAll();
getContent().addToPrimary(secondary);
getContent().addToSecondary(primary);
this.sourcePosition = this.sourcePosition.toggle();
}

public void setOrientation(Orientation o) {
getContent().setOrientation(o);
getContent()
Expand All @@ -71,4 +101,20 @@ public void setSplitterPosition(int pos) {
public void setSizeFull() {
getContent().setSizeFull();
}

public void showSourceCode() {
getContent().setSplitterPosition(50);
}

public void hideSourceCode() {
switch (sourcePosition) {
case PRIMARY:
getContent().setSplitterPosition(0);
break;
case SECONDARY:
getContent().setSplitterPosition(100);
break;
}
}

}
25 changes: 23 additions & 2 deletions src/main/java/com/flowingcode/vaadin/addons/demo/TabbedDemo.java
Original file line number Diff line number Diff line change
Expand Up @@ -59,6 +59,7 @@ public class TabbedDemo extends VerticalLayout implements RouterLayout {
private SplitLayoutDemo currentLayout;
private Checkbox orientationCB;
private Checkbox codeCB;
private Checkbox codePositionCB;
private Checkbox themeCB;
private Orientation splitOrientation;
private Button helperButton;
Expand All @@ -83,6 +84,10 @@ public TabbedDemo() {
codeCB.setValue(true);
codeCB.addClassName("smallcheckbox");
codeCB.addValueChangeListener(ev -> updateSplitterPosition());
codePositionCB = new Checkbox("Toggle Code Position");
codePositionCB.setValue(true);
codePositionCB.addClassName("smallcheckbox");
codePositionCB.addValueChangeListener(ev -> toggleSourcePosition());
themeCB = new Checkbox("Dark Theme");
themeCB.setValue(false);
themeCB.addClassName("smallcheckbox");
Expand All @@ -92,7 +97,7 @@ public TabbedDemo() {
footer = new HorizontalLayout();
footer.setWidthFull();
footer.setJustifyContentMode(JustifyContentMode.END);
footer.add(codeCB, orientationCB, themeCB);
footer.add(codeCB, codePositionCB, orientationCB, themeCB);
footer.setClassName("demo-footer");

Package pkg = this.getClass().getPackage();
Expand Down Expand Up @@ -242,6 +247,8 @@ private Optional<SourceCodeTab> createSourceCodeTab(Class<?> annotatedClass, Dem
if (!annotation.language().equals(DemoSource.DEFAULT_VALUE)) {
builder.language(annotation.caption());
}

builder.sourcePosition(annotation.sourcePosition());

return Optional.of(builder.build());
}
Expand All @@ -264,13 +271,25 @@ public void removeRouterLayoutContent(HasElement oldContent) {

private void updateSplitterPosition() {
if (currentLayout != null) {
currentLayout.setSplitterPosition(codeCB.getValue() ? 50 : 100);
if (codeCB.getValue()) {
currentLayout.showSourceCode();
} else {
currentLayout.hideSourceCode();
}
orientationCB.setEnabled(codeCB.getValue());
codePositionCB.setEnabled(codeCB.getValue());
}
}

public void setSourceVisible(boolean visible) {
codeCB.setValue(visible);
codePositionCB.setVisible(visible);
}

public void toggleSourcePosition() {
if (currentLayout != null) {
currentLayout.toggleSourcePosition();
}
}

private void toggleSplitterOrientation() {
Expand Down Expand Up @@ -307,6 +326,7 @@ private void updateFooterButtonsVisibility() {
ComponentUtil.fireEvent(this, new TabbedDemoSourceEvent(this, hasSourceCode));
orientationCB.setVisible(hasSourceCode);
codeCB.setVisible(hasSourceCode);
codePositionCB.setVisible(hasSourceCode);
}

public void addTabbedDemoSourceListener(ComponentEventListener<TabbedDemoSourceEvent> listener) {
Expand All @@ -321,6 +341,7 @@ protected void onAttach(AttachEvent attachEvent) {
getUI().ifPresent(ui -> ui.getPage().retrieveExtendedClientDetails(receiver -> {
boolean mobile = receiver.getBodyClientWidth() <= MOBILE_DEVICE_BREAKPOINT_WIDTH;
codeCB.setValue(codeCB.getValue() && !mobile);
codePositionCB.setValue(codeCB.getValue() && !mobile);

boolean portraitOrientation = receiver.getBodyClientHeight() > receiver.getBodyClientWidth();
adjustSplitOrientation(portraitOrientation);
Expand Down

0 comments on commit 102479f

Please sign in to comment.