Mercurial > dive4elements > river
changeset 5815:2aabd9752d5e interaktive-karte
Initial interaction model for riverselection on image map.
| author | Raimund Renkert <rrenkert@intevation.de> |
|---|---|
| date | Wed, 24 Apr 2013 15:14:56 +0200 |
| parents | f145a0ce38f2 |
| children | 4126ff35beb8 |
| files | flys-client/src/main/java/de/intevation/flys/client/client/ui/LinkSelection.java flys-client/src/main/java/de/intevation/flys/client/client/ui/MapSelection.java flys-client/src/main/java/de/intevation/flys/client/client/ui/ModuleSelection.java flys-client/src/main/webapp/FLYS.css flys-client/src/main/webapp/images/FLYS_Karte.png |
| diffstat | 5 files changed, 180 insertions(+), 16 deletions(-) [+] |
line wrap: on
line diff
--- a/flys-client/src/main/java/de/intevation/flys/client/client/ui/LinkSelection.java Wed Apr 24 15:13:09 2013 +0200 +++ b/flys-client/src/main/java/de/intevation/flys/client/client/ui/LinkSelection.java Wed Apr 24 15:14:56 2013 +0200 @@ -1,15 +1,20 @@ package de.intevation.flys.client.client.ui; +import java.util.HashMap; +import java.util.LinkedHashMap; +import java.util.Map; + import com.google.gwt.core.client.GWT; - import com.smartgwt.client.types.VerticalAlignment; import com.smartgwt.client.widgets.Canvas; -import com.smartgwt.client.widgets.Img; +import com.smartgwt.client.widgets.HTMLPane; import com.smartgwt.client.widgets.Label; import com.smartgwt.client.widgets.form.DynamicForm; import com.smartgwt.client.widgets.form.fields.LinkItem; import com.smartgwt.client.widgets.form.fields.events.ClickEvent; import com.smartgwt.client.widgets.form.fields.events.ClickHandler; +import com.smartgwt.client.widgets.form.fields.events.ItemHoverEvent; +import com.smartgwt.client.widgets.form.fields.events.ItemHoverHandler; import com.smartgwt.client.widgets.layout.HLayout; import com.smartgwt.client.widgets.layout.VLayout; @@ -39,6 +44,35 @@ /** The selected river*/ protected Data river; + private static Map<String, LinkItem> rivers; + + private static Trigger trigger; + + private Canvas module; + + private class Trigger { + + private LinkSelection ls; + + public Trigger(LinkSelection ls) { + this.ls = ls; + // TODO Auto-generated constructor stub + } + + public void trigger(String name) { + DataItem item = new DefaultDataItem( + name, + null, + name); + + river = new DefaultData( + "river", + null, + null, + new DataItem [] {item}); + this.ls.fireStepForwardEvent (new StepForwardEvent (getData())); + } + } /** * This method currently returns a * {@link com.smartgwt.client.widgets.form.DynamicForm} that contains all @@ -50,13 +84,19 @@ */ @Override public Canvas create(DataList data) { + trigger = new Trigger(this); + createCallback(); + rivers = new HashMap<String, LinkItem>(); VLayout v = new VLayout(); v.setMembersMargin(10); v.setAlign(VerticalAlignment.TOP); if (data.getState() == null) { - Canvas module = super.createWidget(data); + module = super.createWidget(data); v.addMember(module); } + else { + module = null; + } Canvas content = createWidget(data); v.addMember(content); @@ -113,27 +153,49 @@ VLayout layout = new VLayout(); layout.setAlign(VerticalAlignment.TOP); layout.setHeight(25); - - VLayout formLayout = new VLayout(); + HLayout colums = new HLayout(); + VLayout formLayout1 = new VLayout(); + VLayout formLayout2 = new VLayout(); - formLayout.setLayoutLeftMargin(60); + formLayout1.setLayoutLeftMargin(60); + int size = data.size(); - for (int i = 0; i < size; i++) { Data d = data.get(i); Label label = new Label(d.getDescription()); label.setValign(VerticalAlignment.TOP); label.setHeight(20); + label.setWidth(400); + LinkedHashMap<String, String> it = new LinkedHashMap<String, String>(); + + boolean defaultSet = false; + boolean first = true; + + DataItem def = d.getDefault(); + String defValue = def != null ? def.getStringValue() : null; + + if (defValue != null && defValue.length() > 0) { + defaultSet = true; + } + + int counter = 0; for (DataItem item: d.getItems()) { LinkItem link = new LinkItem("river"); link.setLinkTitle(item.getLabel()); link.setTarget(item.getStringValue()); link.setShowTitle(false); DynamicForm f = new DynamicForm(); + rivers.put(item.getStringValue(), link); f.setItems(link); - formLayout.addMember(f); + if (counter < d.getItems().length/2) { + formLayout1.addMember(f); + } + else { + formLayout2.addMember(f); + } + counter++; link.addClickHandler(new ClickHandler() { @Override public void onClick(ClickEvent event) { @@ -141,7 +203,6 @@ ((LinkItem)event.getItem()).getLinkTitle(), null, ((LinkItem)event.getItem()).getLinkTitle()); - river = new DefaultData( "river", null, @@ -150,19 +211,38 @@ fireStepForwardEvent (new StepForwardEvent (getData())); } }); + link.addItemHoverHandler(new ItemHoverHandler() { + @Override + public void onItemHover(ItemHoverEvent event) { + GWT.log(((LinkItem)event.getItem()).getLinkTitle()); + String river = ((LinkItem)event.getItem()).getLinkTitle(); + for (String s : rivers.keySet()) { + LinkItem item = rivers.get(s); + if (item.getLinkTitle().equals(s)) { + item.setCellStyle("riverLinkHighlight"); + } + else { + item.setCellStyle("formCell"); + } + } + callHighlightRiver(river); + } + }); + } + if (module != null) { + getModuleSelection().setRivers(rivers); } label.setWidth(50); - layout.addMember(label); - layout.addMember(formLayout); + colums.addMember(formLayout1); + colums.addMember(formLayout2); + layout.addMember(colums); } - layout.setAlign(VerticalAlignment.TOP); - - String baseUrl = GWT.getHostPageBaseURL(); - Img map = new Img(baseUrl + messages.riverMap(), 494, 582); + layout.addMember(getNextButton()); + HTMLPane map = new HTMLPane(); + map.setContentsURL("images/FLYS_Karte_interactive.html"); helperContainer.addMember(map); - return layout; } @@ -170,6 +250,7 @@ @Override protected Data[] getData() { Data[] module = super.getData(); + if (module != null) { return new Data[] {module[0], river}; } @@ -177,5 +258,33 @@ return new Data[] {river}; } } + + private native void createCallback() /*-{ + $wnd.highlightRiver = @de.intevation.flys.client.client.ui.LinkSelection::highlightCallback(Ljava/lang/String;); + $wnd.selectRiver = @de.intevation.flys.client.client.ui.LinkSelection::selectCallback(Ljava/lang/String;); + }-*/; + + private static void highlightCallback(String name) { + for (String s : rivers.keySet()) { + if (s.equals(name)) { + LinkItem item = rivers.get(name); + item.setCellStyle("riverLinkHighlight"); + item.redraw(); + } + else { + LinkItem item = rivers.get(s); + item.setCellStyle("formCell"); + item.redraw(); + } + } + } + + private static void selectCallback(String name) { + trigger.trigger(name); + } + + private native void callHighlightRiver(String name) /*-{ + $wnd.highlight(name); + }-*/; } // vim:set ts=4 sw=4 si et sta sts=4 fenc=utf8 :
--- a/flys-client/src/main/java/de/intevation/flys/client/client/ui/MapSelection.java Wed Apr 24 15:13:09 2013 +0200 +++ b/flys-client/src/main/java/de/intevation/flys/client/client/ui/MapSelection.java Wed Apr 24 15:14:56 2013 +0200 @@ -68,5 +68,9 @@ return null; } } + + public ModuleSelection getModuleSelection() { + return this.moduleSelection; + } } // vim:set ts=4 sw=4 si et sta sts=4 fenc=utf8 :
--- a/flys-client/src/main/java/de/intevation/flys/client/client/ui/ModuleSelection.java Wed Apr 24 15:13:09 2013 +0200 +++ b/flys-client/src/main/java/de/intevation/flys/client/client/ui/ModuleSelection.java Wed Apr 24 15:14:56 2013 +0200 @@ -8,7 +8,10 @@ import com.smartgwt.client.widgets.Canvas; import com.smartgwt.client.widgets.Label; import com.smartgwt.client.widgets.form.DynamicForm; +import com.smartgwt.client.widgets.form.fields.LinkItem; import com.smartgwt.client.widgets.form.fields.RadioGroupItem; +import com.smartgwt.client.widgets.form.fields.events.ChangeEvent; +import com.smartgwt.client.widgets.form.fields.events.ChangeHandler; import com.smartgwt.client.widgets.layout.HLayout; import com.smartgwt.client.widgets.layout.VLayout; @@ -23,7 +26,10 @@ import de.intevation.flys.client.shared.model.DefaultDataItem; import de.intevation.flys.client.shared.model.Module; +import java.util.ArrayList; import java.util.LinkedHashMap; +import java.util.List; +import java.util.Map; /** * The ModuleSelection combines the river selection and the module selection in @@ -37,6 +43,9 @@ private static final long serialVersionUID = -5634831815175543328L; + private List<String> fixRivers; + private List<String> minfoRivers; + /** The message class that provides i18n strings.*/ protected FLYSConstants MESSAGES = GWT.create(FLYSConstants.class); @@ -46,6 +55,9 @@ /** */ protected Module[] modules; + /** */ + protected Map<String, LinkItem> rivers; + /** The ModuleService used to retrieve the available modules of a user.*/ protected ModuleServiceAsync moduleService = GWT.create(ModuleService.class); @@ -54,6 +66,18 @@ * The default constructor. */ public ModuleSelection() { + rivers = null; + //TODO: put all the rivers into a config file, or something. + fixRivers = new ArrayList(); + fixRivers.add("Rhein"); + fixRivers.add("Elbe"); + fixRivers.add("Donau"); + + minfoRivers = new ArrayList<String>(); + minfoRivers.add("Elbe"); + minfoRivers.add("Rhein"); + minfoRivers.add("Oder"); + readModules(); } @@ -134,6 +158,25 @@ radio = new RadioGroupItem("plugin"); + radio.addChangeHandler(new ChangeHandler() { + @Override + public void onChange(ChangeEvent event) { + String selected = (String)event.getValue(); + if (!rivers.isEmpty()) { + for (Map.Entry<String, LinkItem> s: rivers.entrySet()) { + if (selected.equals("minfo") && !minfoRivers.contains(s.getKey())) { + s.getValue().hide(); + } + else if (selected.equals("fixanalysis") && !fixRivers.contains(s.getKey())) { + s.getValue().hide(); + } + else { + s.getValue().show(); + } + } + } + } + }); label.setWidth(50); label.setHeight(25); @@ -172,5 +215,9 @@ return new Data[] {data}; } + + public void setRivers(Map<String, LinkItem> rivers) { + this.rivers = rivers; + } } // vim:set ts=4 sw=4 si et sta sts=4 fenc=utf8 :