The structure of PANORAMA is more like a normal three-tier web application which contains game server, the central database and the user client shown in Figure 1. We can see that VRML game is only part of the whole system and the main flow process is controlled by the AJAX script used. When a game event occurs like getting the current rank list or updating some data on the server, the VRML world will trigger the callback javascript which then invokes HTTP request through an unique URL indication. When the game server receives such request, it extracts the information from the HTTP header and processes it in the server engine.

There may be several problems in such design like \textit{security trust}(how to protect user data from modifying) and \textit{synchronization issue}(when several clients update and read from the database). We discuss respective solutions in Section 4.

We have built one game and one application within such platform. The game shown in Figure 2 is named 'My naughty tigers' that player places boxes to drive the jumping tiger into the smoke. Multi-players can rank their scores after each winning. The other application is called 'My Photo Gallery' in Figure 3 which gives a gallery walking view to enjoy pictures and also can upload new ones without refreshing the page.

...

System Implementation

Google web user interface

GWT

  public static native void
    setEventIn(node, field,value) {
        document.Contact3D.setNodeEventIn
                       (node, field, value);
    }
  

Callback function in javascript

Callback function is usually invoked when VRML game needs to communicate with the outside world. In List 2, we give a sample code to describe how this works both in VRML and HTML.

javascript

  DEF Script Script {
    field MFString url ["OnEvent(par)"]
    url "javascript:
         function value_changed(v, t) {
           #load the current URL in default
           Browser.loadURL(url, v); 
         }"
  }
  

HTML

  <script language=Javascript>
  function onEvent(par){
    alert(par1);
  }
  </script>
  

...

---

---

In the above source code, the URL loaded by VRML is only the function name embedded in the current HTML file. The parameter passed is a \texttt{MFString} type value with each sub-string matching the list of the function definition. When event occurs, the javascript function will be invoked and makes the request.

AJAX request and URL agent

Making an AJAX request is widely used and standardized in nowadays web sites. The procedure works like that the script first checks the version of the client browser and then instantiates a \texttt{XMLHTTP} object and finally makes the connection to the server agent. A \texttt{setTimeOut()} callback function can be set up since games always need to update the scene frequently. More details about the exact code and tutorials can be found on the Mozilla developing center[6]. At the server side when the agent receives a request, it should first identify which HTTP method the client uses (\texttt{POST} or \texttt{GET}) and then extract the the variable values from the header file and process the request. This can be easily handled by reading the \texttt{_GET} or \texttt{_POST} variables in PHP.

Future Improvement

The initial result shows that the current PANORAMA is promising but still there is a lot of work left. we consider adding the following features in the next release version.

future work

Authorization mechanism. The server should maintain authorization function otherwise one can easily change other's data through the HTTP header request. Since it's nothing to do with VRML, normal web solution is sustainable.

Synchronization issues. Upon the time the paper is written, we haven't experienced large scale multi-user scenarios on PANORAMA and such problem didn't occur at this moment. But we think it's a web developing problem rather than a complex game engine design and PHP can easily handle that.

Modification in GWT for better VRML support Again, we discovery that the GWT is a well developed framework which greatly saves time on debugging web applications and building UI. Since it uses an open source license, it's possible to build a dervied package that specially serve for the VRML game development.

Comparison with Other Platforms

Inside the web game market, there are already several other platforms exists(e.g. Flash 3D, Quick Time VR, etc.). Those products are dominated by big companies and have been developed for years. But we believe PANORAMA as a VRML platform can still competing with others with the following advantages:

other platforms

1. Open source licensed. Comparing with other commercial platforms, PANORAMA can be totally built upon open source softwares. For example, the server can use Apache while the VRML client has Flux[9] and the GWT library is already Apache licensed. Such environment gives developers more spaces to investigate and expand.
2. The out performance of VRML. By fully supporting the DirectX9, VRML players gain the best performance in 3D graphics rendering, resulting in high quality game images. The VRML/X3D are also open standards file format with a rich set of components featuring visualization and entertainment.
3. Royalty free Development. Commercial platforms need you to buy the authoring tools to create content while VRML applications can be totally developed by text editors. Some respect authoring tool like Flux Studio and VrmlPad are free to download and use.

The disadvantage of PANORAMA can be concluded into unifying issues. Apart from the weak compatibility between different players, the support of browser is also a problem. Almost all the VRML players need user to install the plug-in manually, without any notification by the browser. But we think this dilemma can be gradually conquered when the application is getting widely used.

Conclusions

Traditional VRML games are mostly played in single user mode lacking communication with others. With the popularity of AJAX technique, it's possible to build multi-users games in VRML through the EAI interface. In this paper, we are proposing PANORAMA, an early bird work which uses AJAX for communication and GWT for building UI, resulting in a hybrid platform that is general enough to adapt to games and other applications. We evaluate small games and discuss several pitfalls which can be fixed in the next release. Also we recognize that building a framework based on the GWT is meaningful and surely can boost the popularity of web 3D games.

References

\bibitem{blaxxun} Blaxxun Product. Blaxxun Communication Server. \texttt{www.blaxxuntechnologies.com}.
\bibitem{vrml}Bittmanagement. Bittmanagement Developer Website. \texttt{www.bitmanagement.com/developer/}.
\bibitem{gwt} Google Inc. Google Web Toolkit. \texttt{code.google. com/webtoolkit/}.
\bibitem{social}PANORAMA system : Being social. Vrije Universiteit Amsterdam. \texttt{www.few.vu.nl/\~dvyas/ resources.html}.
\bibitem{dlp}Distributed Logic Programming. Vrije Universiteit Amsterdam. \texttt{dlp.cs.vu.nl/}.
\bibitem{ajax}Mozilla developer center. AJAX:Getting Started.\\\ \texttt{developer.mozilla.org/en/docs/}.
\bibitem{web3d}Web 3D CONSORTIUM. VRML Viewers, Browsers\\ \ and Plug-ins. \texttt{www.web3d.org/x3d/ vrml/tools}.
\bibitem{vrmlstandard}ISO/IEC 14772-1:1997 and ISO/IEC 14772-2:2004.\\\ Virtual Reality Modeling Language (VRML).
\bibitem{flux}Media Machines. Flux Studio.\\\ \ \ \ \ \ \ \texttt{www.mediamachines.com}.

---

[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _

---

(C) Æliens 27/08/2009

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.