Differences

This shows you the differences between two versions of the page.

Link to this comparison view

google_maps [2012/04/09 19:09]
dragan.milicev
google_maps [2012/07/09 10:56] (current)
srdjan.lukovic [GUI Code]
Line 1: Line 1:
-====== Google Maps ======+====== Interactive Maps ======
  
-The **Google Maps** sample is a [[SOLoist Sample Applications|SOLoist sample application]] that fully embeds [[http://maps.google.com/ | Google Maps]] that interact with the enclosing application by exhanging geo-coordinates. This example demonstrates how complex external components can be integrated with SOLoist code.+**Interactive Maps** is a [[SOLoist Sample Applications|SOLoist sample application]] that fully embeds [[http://maps.google.com/ | Google Maps]] that interact with the enclosing application by exhanging geo-coordinates. This example demonstrates how complex external components can be integrated with SOLoist code in order to interchange the data and keep them in sync
  
 The user can browse the map. By selecting an object of //House// in the suggest box, the map view will be positioned on the location based on the coordinates stored in the object's //coordinates// attribute.  The user can browse the map. By selecting an object of //House// in the suggest box, the map view will be positioned on the location based on the coordinates stored in the object's //coordinates// attribute. 
Line 7: Line 7:
 When the marker is unlocked by unchecking the checkbox, and a different location is selected in the map, all the data from Google Maps will be automatically saved to the selected object's attributes.  When the marker is unlocked by unchecking the checkbox, and a different location is selected in the map, all the data from Google Maps will be automatically saved to the selected object's attributes. 
  
-The user can also type in an address in the text input field and perform geocoding, when Google Maps will provide the coordinates.+The user can also type in an address in the text input field, when Google Maps provides the coordinates.
  
-This way, the geo-coordinates from Google Maps and the values of attrobutes from SOLoist object are kept in sync. +This way, the geo-coordinates from Google Maps and the values of attributes from SOLoist objects are kept in sync. 
  
 ==== Live example ==== ==== Live example ====
Line 15: Line 15:
 [[http://soloistdemo.org/SampleApplications/gmaps.html]]\\ [[http://soloistdemo.org/SampleApplications/gmaps.html]]\\
 [[http://soloistdemo.org/SampleApplications/oql?q=SELECT+h%2C+h.code%2C+h.address%2C+h.city%2C+h.country%2C+h.coordinates%0D%0AFROM+House+h&f=html | OQL Query: Houses]] [[http://soloistdemo.org/SampleApplications/oql?q=SELECT+h%2C+h.code%2C+h.address%2C+h.city%2C+h.country%2C+h.coordinates%0D%0AFROM+House+h&f=html | OQL Query: Houses]]
-|{{screen:personsandbankaccounts.png?300}}|+|{{screen:googlemaps.png?300}}|
  
 ===== UML Model ===== ===== UML Model =====
Line 28: Line 28:
  
 import rs.sol.sampleapps.House; import rs.sol.sampleapps.House;
-import rs.sol.soloist.server.builtindomains.builtindatatypes.Text; 
 import rs.sol.soloist.server.guiconfiguration.components.GUIHTMLComponent; import rs.sol.soloist.server.guiconfiguration.components.GUIHTMLComponent;
 import rs.sol.soloist.server.guiconfiguration.components.GUILabelComponent; import rs.sol.soloist.server.guiconfiguration.components.GUILabelComponent;
 import rs.sol.soloist.server.guiconfiguration.components.GUIPanelComponent; import rs.sol.soloist.server.guiconfiguration.components.GUIPanelComponent;
 import rs.sol.soloist.server.guiconfiguration.construction.GUIComponentBinding; import rs.sol.soloist.server.guiconfiguration.construction.GUIComponentBinding;
-import rs.sol.soloist.server.guiconfiguration.elementcomponents.GUICollectionInput+import rs.sol.soloist.server.guiconfiguration.elementcomponents.GUIEdit
-import rs.sol.soloist.server.guiconfiguration.elementcomponents.GUIElementComponent; +import rs.sol.soloist.server.guiconfiguration.elementcomponents.GUIInput;
-import rs.sol.soloist.server.guiconfiguration.elementcomponents.GUISuggestWidget; +
-import rs.sol.soloist.server.guiconfiguration.layout.TableLayoutData;+
 import rs.sol.soloist.server.guiconfiguration.nonvisualcompoments.GUIFindAllInstancesSAPComponent; import rs.sol.soloist.server.guiconfiguration.nonvisualcompoments.GUIFindAllInstancesSAPComponent;
 import rs.sol.soloist.server.uml.concepts.runtime.ISlot; import rs.sol.soloist.server.uml.concepts.runtime.ISlot;
Line 42: Line 39:
 public class GoogleMapsFragment { public class GoogleMapsFragment {
  
- private ISlot<Text> house;+ private ISlot<?> house;
  private GUIPanelComponent rootPanel;  private GUIPanelComponent rootPanel;
  
  public GoogleMapsFragment(GUIPanelComponent rootPanel) {  public GoogleMapsFragment(GUIPanelComponent rootPanel) {
  this.rootPanel = rootPanel;  this.rootPanel = rootPanel;
- this.house = rootPanel.input;+ this.house = rootPanel.opRelay1();
  init();  init();
  }  }
Line 54: Line 51:
  houseLocationDetails();  houseLocationDetails();
   
- GUIElementComponent coordinates = GUIElementComponent.createSlotEditor(rootPanel, House.PROPERTIES.coordinates, house); + GUIEdit coordinates = GUIEdit.createField(rootPanel, House.PROPERTIES.coordinates); 
- coordinates.styleName.set(Text.fromString("#coordinatesH"));+ GUIComponentBinding.create(house, coordinates.ipElement()); 
 + coordinates.setStyle("#coordinatesH");
  GUIHTMLComponent.create(rootPanel, "<div id=\"map_canvasH\"></div>");  GUIHTMLComponent.create(rootPanel, "<div id=\"map_canvasH\"></div>");
  
  GUIHTMLComponent html1 = GUIHTMLComponent.create(rootPanel, "");  GUIHTMLComponent html1 = GUIHTMLComponent.create(rootPanel, "");
- html1.styleName.set(Text.fromString("#tab1886H"));+ html1.setStyle("#tab1886H");
   
- GUIComponentBinding.create(house, html1.html);+ GUIComponentBinding.create(house, html1.ipHTML());
  }  }
  
  private void houseLocationDetails() {  private void houseLocationDetails() {
  GUIPanelComponent table = GUIPanelComponent.createTable(rootPanel);  GUIPanelComponent table = GUIPanelComponent.createTable(rootPanel);
- table.styleName.set(Text.fromString("form"));+ table.setStyle("form");
   
  int row = 0, col = 0;  int row = 0, col = 0;
- GUILabelComponent.create(table, "House", row, col++).styleName.set(Text.fromString("formLabel")); + GUILabelComponent.create(table, "House", row, col++).setStyle("formLabel"); 
- GUILabelComponent.create(table, "Address", row, col++).styleName.set(Text.fromString("formLabel")); + GUILabelComponent.create(table, "Address", row, col++).setStyle("formLabel"); 
- GUILabelComponent.create(table, "City", row, col++).styleName.set(Text.fromString("formLabel")); + GUILabelComponent.create(table, "City", row, col++).setStyle("formLabel"); 
- GUILabelComponent.create(table, "Country", row, col++).styleName.set(Text.fromString("formLabel"));+ GUILabelComponent.create(table, "Country", row, col++).setStyle("formLabel");
   
- GUIFindAllInstancesSAPComponent allHouses = GUIFindAllInstancesSAPComponent.create(rootPanel, House.FQ_TYPE_NAME); + GUIFindAllInstancesSAPComponent allHouses = GUIFindAllInstancesSAPComponent.create(rootPanel, House.CLASSIFIER); 
- GUIElementComponent suggestBox = GUIElementComponent.createInput(table, new GUISuggestWidget(), new GUICollectionInput()); + GUIInput suggestBox = GUIInput.createSuggest(table); 
- GUIComponentBinding.create(allHouses.valueGUICollectionInput.get(suggestBox).collection);+ GUIComponentBinding.create(allHouses.opValue()suggestBox.ipCollection());
   
- GUIElementComponent seAddress = GUIElementComponent.createSlotEditor(table, House.PROPERTIES.address, house); + GUIEdit seAddress = GUIEdit.createField(table, House.PROPERTIES.address); 
- seAddress.styleName.set(Text.fromString("#addressH")); + GUIComponentBinding.create(house, seAddress.ipElement()); 
- GUIElementComponent seCity = GUIElementComponent.createSlotEditor(table, House.PROPERTIES.city, house); + seAddress.setStyle("#addressH"); 
- seCity.styleName.set(Text.fromString("#cityH")); +  
- GUIElementComponent seCountry = GUIElementComponent.createSlotEditor(table, House.PROPERTIES.country, house); + GUIEdit seCity = GUIEdit.createField(table, House.PROPERTIES.city); 
- seCountry.styleName.set(Text.fromString("#countryH"));+ GUIComponentBinding.create(house, seCity.ipElement()); 
 + seCity.setStyle("#cityH"); 
 + 
 + GUIEdit seCountry = GUIEdit.createField(table, House.PROPERTIES.country); 
 + GUIComponentBinding.create(house, seCountry.ipElement()); 
 + seCountry.setStyle("#countryH");
   
  row++; col = 0;  row++; col = 0;
- TableLayoutData.setRowColumn(suggestBox, row, col++); + suggestBox.setRowColumn(row, col++); 
- TableLayoutData.setRowColumn(seAddress, row, col++); + seAddress.setRowColumn(row, col++); 
- TableLayoutData.setRowColumn(seCity, row, col++); + seCity.setRowColumn(row, col++); 
- TableLayoutData.setRowColumn(seCountry, row, col++);+ seCountry.setRowColumn(row, col++);
   
- GUIComponentBinding.create(suggestBox.value, rootPanel.input);+ GUIComponentBinding.create(suggestBox.opValue(), rootPanel.ipRelay1());
  }  }
   
Line 104: Line 107:
 import rs.sol.soloist.helpers.init.Initializer; import rs.sol.soloist.helpers.init.Initializer;
 import rs.sol.soloist.helpers.init.InitializerFailedException; import rs.sol.soloist.helpers.init.InitializerFailedException;
-import rs.sol.soloist.server.builtindomains.builtindatatypes.Text; 
 import rs.sol.soloist.server.guiconfiguration.components.GUIApplicationComponent; import rs.sol.soloist.server.guiconfiguration.components.GUIApplicationComponent;
 import rs.sol.soloist.server.guiconfiguration.components.GUILabelComponent; import rs.sol.soloist.server.guiconfiguration.components.GUILabelComponent;
Line 120: Line 122:
  public void init() throws InitializerFailedException {  public void init() throws InitializerFailedException {
  GUIApplicationComponent application = new GUIApplicationComponent();  GUIApplicationComponent application = new GUIApplicationComponent();
- application.name.set(Text.fromString("GMapsSample"));+ application.setName("GMapsSample");
  SoloistServiceServlet.registerApplication(application);  SoloistServiceServlet.registerApplication(application);
- application.context.set(createContextAndStyles());+ application.setContext(createContextAndStyles());
   
  GUIPanelComponent root = GUIPanelComponent.createFlow(application);  GUIPanelComponent root = GUIPanelComponent.createFlow(application);
   
  GUILabelComponent title = GUILabelComponent.create(root, "Google Maps");  GUILabelComponent title = GUILabelComponent.create(root, "Google Maps");
- title.styleName.set(Text.fromString("titleStyle"));+ title.setStyle("titleStyle");
   
  GUIPanelComponent topPanel = GUIPanelComponent.createFlow(root);  GUIPanelComponent topPanel = GUIPanelComponent.createFlow(root);
- topPanel.styleName.set(Text.fromString("topPanel"));+ topPanel.setStyle("topPanel");
  
  new GoogleMapsFragment(topPanel);  new GoogleMapsFragment(topPanel);
Line 137: Line 139:
  private GUIContext createContextAndStyles() {  private GUIContext createContextAndStyles() {
  GUIContext context = new GUIContext();  GUIContext context = new GUIContext();
- context.supercontext.set(DefaultContextInit.getRoot());+ DefaultContextInit.getRoot().addContext(context);
  
  GUIObjectSetting person = GUIObjectSetting.create(context, House.CLASSIFIER);  GUIObjectSetting person = GUIObjectSetting.create(context, House.CLASSIFIER);
Print/export