Mashup your Application

Transcription

1 Mashup your Application Presented by: Jane Raymond

2 Presentation Outline Overview Flash Charting Alternatives HTML Editor Control Google Maps & Directions

3 Mashup Overview A web page or application that uses and combines data, presentation or functionality from two or more sources to create new services. - Wikipedia.org

4 Overview External controls have traditionally been available to NOMADS applications through the COM interface -- but -- How do we make external controls available to inomads? How do we make non COM-based external features available to NOMADS and inomads?

5 Overview inomads OCX emulation PxPlus control with similar properties/methods. Chart emulation Interchangeable PxPlus chart classes Pvx Plus Extended Controls Available through the Nomads COM interface Select from a list of Pvx Plus Controls in addition to the list of Activex Controls

6 Shockwave Flash inomads OCX Emulation for Flash Flash (ShockwaveFlash.ShockwaveFlash) controls accessible interchangeably to both the Nomads and inomads environments: Nomads - Processed as a COM control inomads - Processed through an intermediary PxPlus control with similar properties and methods.

7 Charting Alternatives Charting alternatives to the internal chart control Richer UI experience Interactive, animated charts Additional formats available Scatter, Donut, Gauge Little or no code changes to switch

8 Charting Alternatives Charting options: Standard internal charting control (Nomads only) Flash-based Web/Internet based HTML5 canvas graph library

9 Charting Alternatives Standard internal charting control (Nomads only) N/A N/A

10 Charting Alternatives Flash-based FusionCharts Free (free open-source) FusionCharts (commercially available) N/A N/A N/A

11 Charting Alternatives Web/Internet based Google Visualization API charts

12 Charting Alternatives HTML5 canvas graph library rgraph charts

13 Chart emulation Charting Alternatives Define chart using Nomads chart definition interface Interchangeable PxPlus chart classes Support for common control properties BackColor$, Col, Cols, CtlName$, Enabled, Fmt$, Height, Left, Line, Lines, Sep$, SepLoad$, TextColor$, Top, Visible, Width, _PropList$, _PropSep$, _PropValue$ Support for chart-specific properties CurrentPoint, CurrentSet, LegendLocation$, NumPoints, NumSets, RangeMax, RangeMin, SelectIndex, Title1$, Title2$, xaxistitle$, yaxistitle$ Extra features supported through properties

14 Charting Alternatives To select a chart type: NOMADS Set the global variable %Nomad_Chart$ to: (Default - Standard internal chart control) fusioncharts, fusionfree, google or rgraph inomads Pick a charting object for the template (default is fusionfree) inomads Administration - System Administration Functions Template Settings Options Miscellaneous - Charting object to use

15 Charting Alternatives Documentation available at: General Topics Charting Alternatives in PxPlus Fusion, Google and Rgraph Charts

16 HTML Editor Control TinyMCE HTML editor control Allows editing of HTML documents on panel Editing interface resembles how the page will be displayed in the browser Does not require any HTML knowledge

17 HTML Editor Control Extended Pvx Plus Control Defined in NOMADS as an External Tool (COM control) Pvx Plus Controls Tinymce Editor Control

18 HTML Editor Control HTML editor properties toolbaralign$ Left, right, center toolbarlocation$ Top, bottom, external (external is inomads only) toolbarlayout$ Choose from four predefined layouts Simple, advanced, extended and fullpage Customizable to create your own toolbar layout

19 HTML Editor Control Value$ property Easy access to resultant HTML Save/restore HTML to text files as desired To save, read Value$ and write to file To load, read file and set Value$

20 HTML Editor Control Documentation available at: General Topics Extended Nomads Objects TinyMCE HTML Editor Information on the TinyMCE Javascript WYSIWYG Editor available at:

21 Google Maps Interface Google map control Provides ability to insert map onto panel (Requires internet access)

22 Google Maps Interface Features UI Control Control map type - roadmap, satellite, hybrid or terrain Disable various map user interface features Zoom, map type, draggability, scrollwheel, etc. Click events Click, rightclick, markerclick

23 Google Maps Interface Features (continued) Marker support Infowindow support Geocode Functions Converts street addresses to latitude, longitude and vice versa

24 Google Maps Interface Directions Requests Given a start point, an end point and optional waypoints, displays route on the map and directions in a directions pane Supports different travel modes (driving, walking, bicycling), route options (avoid highways, tolls, etc.), route alternatives, waypoint optimization, etc. Version 10 Feature

25 Google Maps Interface Extended Pvx Plus Control Defined in NOMADS as an External Tool (COM control) Pvx Plus Controls Google Maps Control Minimum definition requirement: latitude and longitude of centerpoint of map maptypeid roadmap, satellite, hybrid or terrain zoom factor for the map For directions requests, must also set showdirectionspane (0=disabled, 1=left, 2=right) and directionspanepercent

26 Google Maps Interface Documentation available at: General Topics Extended Nomads Objects Google Maps Interface Flash tutorials available at: Also visit the Google website for terms and conditions:

27 Thank you Lunch Time 12:00 1:30