msyds/gf-core
1
0
Fork 0
forked from GitHub/gf-core
Code Pull Requests Activity

use TabBar for the links in the upper-left corner of the editor

Browse Source
This commit is contained in:
krasimir
2010-10-07 15:09:59 +00:00
parent 5f84c53681
commit 339de4c281
2 changed files with 70 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files

134
src/ui/gwt/src/org/grammaticalframework/ui/gwt/client/EditorApp.java
View File

@@ -16,7 +16,7 @@ public class EditorApp implements EntryPoint {
protected PGFWrapper pgf; protected PGFWrapper pgf;
protected VerticalPanel outputPanel; protected VerticalPanel outputPanel;
protected Widget translatePanel; protected Widget editorPanel;
protected BrowsePanel browsePanel; protected BrowsePanel browsePanel;
protected QueryPanel queryPanel; protected QueryPanel queryPanel;
protected DocumentsPanel documentsPanel; protected DocumentsPanel documentsPanel;
@@ -215,7 +215,7 @@ public class EditorApp implements EntryPoint {
// //
protected Widget createUI() { protected Widget createUI() {
translatePanel = createTranslatePanel(); editorPanel = createEditorPanel();
browsePanel = createBrowsePanel(); browsePanel = createBrowsePanel();
queryPanel = createQueryPanel(); queryPanel = createQueryPanel();
documentsPanel = createDocumentsPanel(); documentsPanel = createDocumentsPanel();
@@ -228,19 +228,19 @@ public class EditorApp implements EntryPoint {
hPanel.setVerticalAlignment(HorizontalPanel.ALIGN_MIDDLE); hPanel.setVerticalAlignment(HorizontalPanel.ALIGN_MIDDLE);
hPanel.setStylePrimaryName("my-HeaderPanel"); hPanel.setStylePrimaryName("my-HeaderPanel");
Widget linksPanel = createLinksPanel(vPanel); TabBar linksPanel = createLinksPanel(vPanel);
hPanel.add(linksPanel); hPanel.add(linksPanel);
hPanel.setCellHorizontalAlignment(linksPanel,HorizontalPanel.ALIGN_LEFT); hPanel.setCellHorizontalAlignment(linksPanel,HorizontalPanel.ALIGN_LEFT);
linksPanel.selectTab(1);
Widget settingsPanel = createSettingsPanel(); Widget settingsPanel = createSettingsPanel();
hPanel.add(settingsPanel); hPanel.add(settingsPanel);
hPanel.setCellHorizontalAlignment(settingsPanel,HorizontalPanel.ALIGN_RIGHT); hPanel.setCellHorizontalAlignment(settingsPanel,HorizontalPanel.ALIGN_RIGHT);
vPanel.add(hPanel); vPanel.add(hPanel);
vPanel.add(translatePanel); vPanel.add(editorPanel);
History.newItem("translate"); History.addHistoryListener(new MyHistoryListener(linksPanel));
History.addHistoryListener(new MyHistoryListener(vPanel));
return vPanel; return vPanel;
} }
@@ -249,7 +249,7 @@ public class EditorApp implements EntryPoint {
return new SettingsPanel(pgf); return new SettingsPanel(pgf);
} }
protected Widget createTranslatePanel() { protected Widget createEditorPanel() {
textPanel = new TextInputPanel(); textPanel = new TextInputPanel();
textPanel.addValueChangeHandler(new ValueChangeHandler<String>() { textPanel.addValueChangeHandler(new ValueChangeHandler<String>() {
public void onValueChange(ValueChangeEvent<String> event) { public void onValueChange(ValueChangeEvent<String> event) {
@@ -287,29 +287,29 @@ public class EditorApp implements EntryPoint {
outputPanel = new VerticalPanel(); outputPanel = new VerticalPanel();
outputPanel.addStyleName("my-translations"); outputPanel.addStyleName("my-translations");
final DockPanel translatePanel = new DockPanel(); final DockPanel editorPanel = new DockPanel();
translatePanel.setStyleName("my-TranslatePanel"); editorPanel.setStyleName("my-EditorPanel");
translatePanel.add(textPanel, DockPanel.NORTH); editorPanel.add(textPanel, DockPanel.NORTH);
translatePanel.add(bagPanel, DockPanel.CENTER); editorPanel.add(bagPanel, DockPanel.CENTER);
translatePanel.add(outputPanel, DockPanel.EAST); editorPanel.add(outputPanel, DockPanel.EAST);
translatePanel.setCellHeight(bagPanel, "100%"); editorPanel.setCellHeight(bagPanel, "100%");
translatePanel.setCellWidth(bagPanel, "70%"); editorPanel.setCellWidth(bagPanel, "70%");
translatePanel.setCellHeight(outputPanel, "100%"); editorPanel.setCellHeight(outputPanel, "100%");
translatePanel.setCellWidth(outputPanel, "30%"); editorPanel.setCellWidth(outputPanel, "30%");
translatePanel.setCellVerticalAlignment(bagPanel, HasVerticalAlignment.ALIGN_TOP); editorPanel.setCellVerticalAlignment(bagPanel, HasVerticalAlignment.ALIGN_TOP);
translatePanel.setCellHorizontalAlignment(outputPanel, HasHorizontalAlignment.ALIGN_RIGHT); editorPanel.setCellHorizontalAlignment(outputPanel, HasHorizontalAlignment.ALIGN_RIGHT);
Window.addWindowResizeListener(new WindowResizeListener() { Window.addWindowResizeListener(new WindowResizeListener() {
public void onWindowResized(int w, int h) { public void onWindowResized(int w, int h) {
translatePanel.setPixelSize(w-20, h-50); editorPanel.setPixelSize(w-20, h-50);
} }
}); });
int w = Window.getClientWidth(); int w = Window.getClientWidth();
int h = Window.getClientHeight(); int h = Window.getClientHeight();
translatePanel.setPixelSize(w-20, h-50); editorPanel.setPixelSize(w-20, h-50);
return translatePanel; return editorPanel;
} }
protected BrowsePanel createBrowsePanel() { protected BrowsePanel createBrowsePanel() {
@@ -324,56 +324,31 @@ public class EditorApp implements EntryPoint {
return new DocumentsPanel(pgf); return new DocumentsPanel(pgf);
} }
protected Widget createLinksPanel(final Panel parent) { protected TabBar createLinksPanel(final Panel parent) {
HorizontalPanel linksPanel = new HorizontalPanel(); TabBar tabBar = new TabBar();
linksPanel.setStylePrimaryName("my-LinksPanel"); tabBar.setStylePrimaryName("my-LinksPanel");
tabBar.addTab("Documents");
Hyperlink documentsLink = new Hyperlink("Documents", "documents"); tabBar.addTab("Editor");
documentsLink.addClickListener(new ClickListener() { tabBar.addTab("Query");
public void onClick(Widget sender) { tabBar.addTab("Browse");
parent.remove(browsePanel);
parent.remove(queryPanel); tabBar.addSelectionHandler(new SelectionHandler<Integer>() {
parent.remove(translatePanel); public void onSelection(SelectionEvent<Integer> event) {
parent.add(documentsPanel);
}
});
linksPanel.add(documentsLink);
Hyperlink translateLink = new Hyperlink("Translate", "translate");
translateLink.addClickListener(new ClickListener() {
public void onClick(Widget sender) {
parent.remove(documentsPanel); parent.remove(documentsPanel);
parent.remove(browsePanel); parent.remove(editorPanel);
parent.remove(queryPanel); parent.remove(queryPanel);
parent.add(translatePanel);
}
});
linksPanel.add(translateLink);
Hyperlink queryLink = new Hyperlink("Query", "query");
queryLink.addClickListener(new ClickListener() {
public void onClick(Widget sender) {
parent.remove(documentsPanel);
parent.remove(translatePanel);
parent.remove(browsePanel); parent.remove(browsePanel);
parent.add(queryPanel);
switch (event.getSelectedItem().intValue()) {
case 0: parent.add(documentsPanel); History.newItem("documents"); break;
case 1: parent.add(editorPanel); History.newItem("editor"); break;
case 2: parent.add(queryPanel); History.newItem("query"); break;
case 3: parent.add(browsePanel); History.newItem("browse"); break;
}
} }
}); });
linksPanel.add(queryLink);
Hyperlink browseLink = new Hyperlink("Browse", "browse"); return tabBar;
browseLink.addClickListener(new ClickListener() {
public void onClick(Widget sender) {
parent.remove(documentsPanel);
parent.remove(translatePanel);
parent.remove(queryPanel);
parent.add(browsePanel);
browsePanel.onActivate();
}
});
linksPanel.add(browseLink);
return linksPanel;
} }
protected Widget createErrorMsg(final PGF.TcError error) { protected Widget createErrorMsg(final PGF.TcError error) {
@@ -392,36 +367,25 @@ public class EditorApp implements EntryPoint {
// //
protected class MyHistoryListener implements HistoryListener { protected class MyHistoryListener implements HistoryListener {
private final Panel parent; private final TabBar linksPanel;
public MyHistoryListener(Panel parent) { public MyHistoryListener(TabBar linksPanel) {
this.parent = parent; this.linksPanel = linksPanel;
} }
public void onHistoryChanged(String token) { public void onHistoryChanged(String token) {
if (token.equals("documents")) { if (token.equals("documents")) {
parent.add(documentsPanel); linksPanel.selectTab(0);
parent.remove(translatePanel); } else if (token.equals("editor")) {
parent.remove(queryPanel); linksPanel.selectTab(1);
parent.remove(browsePanel);
} else if (token.equals("translate")) {
parent.remove(documentsPanel);
parent.add(translatePanel);
parent.remove(queryPanel);
parent.remove(browsePanel);
} else if (token.equals("query")) { } else if (token.equals("query")) {
parent.remove(documentsPanel); linksPanel.selectTab(2);
parent.remove(translatePanel);
parent.add(queryPanel);
parent.remove(browsePanel);
} else if (token.equals("browse")) { } else if (token.equals("browse")) {
parent.remove(documentsPanel); linksPanel.selectTab(3);
parent.remove(translatePanel);
parent.remove(queryPanel);
parent.add(browsePanel);
browsePanel.onActivate(); browsePanel.onActivate();
browsePanel.browse(null); browsePanel.browse(null);
} else if (token.startsWith("browse:")) { } else if (token.startsWith("browse:")) {
linksPanel.selectTab(4);
browsePanel.browse(token.substring(7)); browsePanel.browse(token.substring(7));
} }
} }

23
src/ui/gwt/src/org/grammaticalframework/ui/gwt/public/Editor.css
View File

@@ -32,7 +32,7 @@
background-color: rgb(147, 194, 241); background-color: rgb(147, 194, 241);
} }
.my-TranslatePanel { .my-EditorPanel {
padding-top: 1em; padding-top: 1em;
padding-bottom: 1em padding-bottom: 1em
} }
@@ -131,7 +131,26 @@
} }
.my-LinksPanel * { .my-LinksPanel * {
margin: 0 0.1em; margin: 0 0.2em;
}
.my-LinksPanel .gwt-TabBarItem {
font-weight: normal;
color: gray;
outline: 0;
}
.my-LinksPanel .gwt-TabBarItem-selected {
font-weight: bold;
color: black;
}
.my-LinksPanel .gwt-TabBarItem:hover {
text-decoration: underline;
}
.my-LinksPanel .gwt-TabBarItem-selected:hover {
text-decoration: none;
} }
.my-HeaderPanel { .my-HeaderPanel {