1. This material is based upon work supported by the U.S. Department of Energy Office of Science under Cooperative Agreement DE-SC0000661. Michigan State University designs and establishes FRIB as a DOE Office of Science National User Facility in support of the mission of the Office of Nuclear Physics. Mengxuan Zhao eTraveler

2.  A universal tool to define and control process Following the steps in approved traveler forms Different permission for different users according to their “role” in the process  Gathered data can be used for multi-purpose (new FRIB Controls Database Schema)  Simple, clean and nice GUI to improve user experience Motivation M. Zhao, 18 Nov 2011, Slide 2

3.  Based on Web Data gathering forms presented in a web browser Cross-platform (OS and web browser)  Service oriented Database read/write operations handled by web service Forms hosted by web application, which can be accessed remotely  Security Authentication / Authorization  In E-traveler, users can : Create a new traveler using existing traveler form View the existing travelers Search for travelers which meet the specific conditions (user defined query) Generate reports (TBD in the next step) Product Overview M. Zhao, 18 Nov 2011, Slide 3

4. Architecture M. Zhao, 18 Nov 2011, Slide 4

5.  Associated with the database A representation of specific data in XML or JSON format Handled by web services (RESTful) Using Jersey, an Implementation of JAX-RS (Java API for RESTful Web Services  Files (images, spreadsheets, etc.) are not stored in the database as blob. Stored in a shared folder on the server that both web app and web service have access. Their path on the server is stored in the database To be discussed Web Resource M. Zhao, 18 Nov 2011, Slide 5

6.  Root of web resources: http://host:port/ETraveler/rest  GET, POST are available  GET /etchCavities, list of web resources /etchCavities/2, the web resource of the given id /etchCavities/count, get the number of web resources /etchCavities/query?var=name&operand=john, search for the web resource which matches the given condition  POST /etchCavities, create a new web resource /etchCavities/2, update the given web resource REST Resource Url M. Zhao, 18 Nov 2011, Slide 6

7.  Developed with GWT (Google Web Toolkit) Development in Java Compiled to JavaScript by GWT compiler Deployment to any Java EE Server Easy debugging and test with the GWT toolkit  Front end: GUI Constructed by widgets Only get/set data operations Able to read received resource data in XML format  Back end: Java Servlet Send/Receive resource data to/from the RESTFul web service Web Application M. Zhao, 18 Nov 2011, Slide 7

8.  Welcome page: menu to choose the traveler form User Interface M. Zhao, 18 Nov 2011, Slide 8 The page is initially loaded like this Double click on the form to fill out, and choose an operation desired. If there is no existing travelers in the database, the second option is grayed out

9. User Interface M. Zhao, 18 Nov 2011, Slide 9 A blank form is displayed if choose to create a new traveler

10. User Interface M. Zhao, 18 Nov 2011, Slide 10 If choose to select from the existing travelers, all the travelers of this form is listed below Choose one traveler from the list, and its description is displayed beside

11. GUI widgets M. Zhao, 18 Nov 2011, Slide 11 Suggest Box Date Picker Pulldown Box Attached File File Uploader with a file uploaded

12. Feature: Autofill M. Zhao, 18 Nov 2011, Slide 12 Fields are filled with data received as resource for the existing traveler A form is split to several pages

13. Feature: Search for a traveler M. Zhao, 18 Nov 2011, Slide 13 Search for travelers of the given traveler Form - All possible variables are listed here. - The selection is single selection. Choose one operator among {=,,[]} Value of the variable is user defined. If travelers satisfying the given condition are found, they will be displayed below

14. Feature: Warning flag M. Zhao, 18 Nov 2011, Slide 14 If a field is filled with improper value, a flag will be displayed to warn the user

15. Feature: Check Mandatory Fields M. Zhao, 18 Nov 2011, Slide 15 If all the mandatory fields are not completed or completed with improper value, an alert is displayed when user attempts to submit the form

16.  The UI has slight differences on different browsers (font, button, pop- up window, etc.) Cross Platform M. Zhao, 18 Nov 2011, Slide 16

17. Cross Platform M. Zhao, 18 Nov 2011, Slide 17 GWT bug: cellTable does not display on IE9

18.  Security: Authentication/Authorization  Version control History control Data modification log  Report generation Features to implement M. Zhao, 18 Nov 2011, Slide 18