1. WebOPI -Bring BOY OPI to the Web and Mobile Xihui Chen, Kay Kasemir chenx1@ornl.gov Spring 2012 EPICS Meeting

2. 2Managed by UT-Battelle for the U.S. Department of Energy We already have good control system displays in control room

3. 3Managed by UT-Battelle for the U.S. Department of Energy Still, Users want Web Access to Ctrl. Sys. From Anywhere On any device – and any web browser

4. 4Managed by UT-Battelle for the U.S. Department of Energy WebOPI makes it to reality BOY OPI goes to Web Browser and Mobile

5. 5Managed by UT-Battelle for the U.S. Department of Energy SNS control room screens in Web Browser

6. 6Managed by UT-Battelle for the U.S. Department of Energy Mobile devices – iPhone, iPod, iPad – Andriod Phone (Opera 9+ or Firefox 2+ browser is required) – Maybe more… No Flash No Java Applets No browser add-on/plugin Compatible With… Safari 3+ Firefox 2+ IE 6+ Chrome 3+ Opera 9+

7. 7Managed by UT-Battelle for the U.S. Department of Energy Highly Compatible with BOY 98% BOY OPI functions are supported in WebOPI All widgets, except Data Browser widget (technically possible) Actions, Macros, Color & Font Macro Rules, JavaScript and Python Script Not supported (minor things) o No advance graphics o No clip (fill level property of Ellipse, Polygon) o No ramp on Gauge, Meter and Knob o No dash line o No 3D effect o No tooltip o No Console o No File Dialog o No Workspace

8. 8Managed by UT-Battelle for the U.S. Department of Energy Can anyone tell the difference? Arc is filled in different way No fill level on Ellipse and Polygon No ramp and 3D effect (gradient)

9. 9Managed by UT-Battelle for the U.S. Department of Energy No special requirement on OPI file Existing BOY OPI can be reused on WebOPI without any modification Well, one requirement: – Don’t rely on the unsupported functions as listed before

10. 10Managed by UT-Battelle for the U.S. Department of Energy Technologies behind Built on Eclipse RAP (Rich Ajax Platform) – Bring Eclipse RCP to Web – Single Sourcing between RCP and RAP applications – JavaScript and HTML5 on client Supported by all mainstream web browsers – Standard servlet technology Server runs on any JEE servlet container, such as Tomcat, Jetty, Glassfish, JBoss and WebSphere Single sourcing on most of BOY code

11. 11Managed by UT-Battelle for the U.S. Department of Energy Introduction to RAP Bring Eclipse RCP applications to web browser Single Sourcing between RCP and RAP applications http://www.eclipse.org/rap/

12. 12Managed by UT-Battelle for the U.S. Department of Energy WebOPI is Multi-User – Server side needs to manage the life cycle of each client PV connect/disconnect Widget activate/deactivate No workspace The major differences CSS BOY WebOPI

13. 13Managed by UT-Battelle for the U.S. Department of Energy Server and Clients share the load Major on server side, including – PV connection, read/write – Script executing – Clients life cycle management Client side – GUI rendering Control System Channel Access HTTP

14. 14Managed by UT-Battelle for the U.S. Department of Energy Server and Clients share the load Pros – Low hardware requirement for client devices – No firewall issue – Simple security management Cons – Heavy loaded OPI could slow down the server – Limit to number of clients

15. 15Managed by UT-Battelle for the U.S. Department of Energy How does WebOPI get updates? Traditional Webpages make updates by – Refreshing the page periodically Slow, waste traffic – Adobe Flash, Java Applet Doesn’t work on iPhone, iPod, iPad… – Web browser add-on Specific to certain web browsers. Won’t work on all your devices. WebOPI uses AJAX and long polling approach – XMLHttpRequest long polling A long-standing request that is answered only in case of server-side updates

16. 16Managed by UT-Battelle for the U.S. Department of Energy Performance Benchmark test – An OPI with 1000 text update widgets updated at 10Hz Server: Linux, 4 core, 2.66GHz, 4GB Memory – 18% CPU usage – <200M memory usage Only one Client: Chrome on Windows, 4 Core, 2.66G, 4GB Memory – 20% CPU usage – 50M memory usage – 300 kB/s Network – 100Mbps Local Area Network

17. 17Managed by UT-Battelle for the U.S. Department of Energy Take the best use of it Don’t deploy heavy loaded OPI – Eg. Hundreds of widgets updated at fast rate Split them to small OPIs if possible Close the webpage when it is not needed anymore

18. 18Managed by UT-Battelle for the U.S. Department of Energy Support all JEE servlet container – Tomcat, Jetty, Glassfish, JBoss and WebSphere Copy webopi.war to the predefined location specified by servlet container Configure css_rap.ini Copy opi files to opi_repository You are ready to see your opi on web! Deployment is simple org.csstudio.opibuilder/opi_repository=C:/path/BOY Examples/ org.csstudio.opibuilder/startup_opi=main.opi org.csstudio.opibuilder/mobile_startup_opi=mobile.opi org.csstudio.opibuilder/color_file=color.def org.csstudio.opibuilder/font_file=font.def

19. 19Managed by UT-Battelle for the U.S. Department of Energy Thank you! WebOPI homepage: – http://sourceforge.net/apps/trac/cs-studio/wiki/webopi http://sourceforge.net/apps/trac/cs-studio/wiki/webopi