Making your Physiome Interface with CMGUI and Mozilla
-----------------------------------------------------

!PDF version: `Cmgui-interfaces_v0.2.pdf`__

To view the demos you will need to install the mozCmgui Mozilla extension.
Download_ and follow the [Installation Instructions]

Shane Blackett

Bioengineering Institute

University of Auckland

10 November 2006

Updated

27 March 2007

Features
--------

- 3D Interface

- Controllable with Javascript and "gfx" commands

- Streams across the internet

- Works with Linux and Windows

ProjectTextureApp_0.01
----------------------

!Run: `ProjectTextureApp_0.01.xul`__

Javascript::

  function set_up_cmgui_and_create_window()
  { ...................................................
  // Initialise cmgui, loading files from memory.
  window.commandData.executeCommand("gfx read elements memory:/cube.exelem;");
  ....................................................
  }
  function download_files()
  {
  // Download files from internet
  ..................................................
  var files = [
  "cube.exelem"
  ];
  ...................................................
  }

ProjectTextureApp_0.02
----------------------

- Show steps and loaded files down left hand side

- Load background

- Load model

- Define texture coordinates

- Calculate texturea

ProjectTextureApp_0.02
----------------------

Layout that doesn't do anything

!Run: `ProjectTextureApp_0.02.xul`__

XUL::

  <vbox align="centre">
  <spacer flex="1"/>
  <label value="Step 1: Select background image."/>
  <hbox>
  <checkbox id="selectbackground"
  checked="false"
  disabled="true" />
  <textbox id="backgroundfilenametextbox"/>
  <button id="backgroundfilenamebutton"
  label="Browse"/>
  </hbox>
  <spacer flex="1"/>
  <label value="Step 2: Select model."/>
  <hbox>
  <checkbox id="selectmodel"
  checked="false"
  disabled="true" />
  <textbox id="modelfilenametextbox"/>
  <button id="modelfilenamebutton"
  label="Browse"/>
  </hbox>
  <spacer flex="1"/>
  </vbox>

!Run: `ProjectTextureApp_0.03.xul`__

ProjectTextureApp_0.04: Actions
-------------------------------

!Run: `ProjectTextureApp_0.04.xul`__

XUL::

  <textbox id="backgroundfilenametextbox"
  oncommand="load_background()"/>
  <button id="backgroundfilenamebutton"
  label="Browse"
  oncommand="browse_background()"/>

ProjectTextureApp_0.04: Actions
-------------------------------

Javascript::

  function load_background()
  { netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
  try
  {
  var background_filename = document.getElementById(
  "backgroundfilenametextbox");
  mozCmguiRunSafe(function(){window.commandData.executeCommand(
  "gfx modify texture background image " + background_filename.value
  )});
  }
  catch (e)
  {
  alert ("Unable to load file " + background_filename.value);
  }
  }

!Run: `ProjectTextureApp_0.05.xul`__

Wrinkles
--------

- OSX

- Unsigned applets

Help
----

- Firebug for javascript

Summary
-------

- Build graphical applications

- Same files for local and web server

- Record your methods in a user interface

- Testing write a test function or make an example

Source files
------------

To see the XUL files use "View source" in your browser.

!`ProjectTextureApp_0.01.js`__

!`ProjectTextureApp_0.02.js`__

!`ProjectTextureApp_0.03.js`__

!`ProjectTextureApp_0.04.js`__

!`ProjectTextureApp_0.05.js`__

!`cube.exelem`__

!`new_mesh.exelem`__

!`herald_old.png`__

__ Cmgui-interfaces_v0.2.pdf
__ ProjectTextureApp_0.01.xul
__ ProjectTextureApp_0.02.xul
__ ProjectTextureApp_0.03.xul
__ ProjectTextureApp_0.04.xul
__ ProjectTextureApp_0.05.xul
__ ProjectTextureApp_0.01.js
__ ProjectTextureApp_0.02.js
__ ProjectTextureApp_0.03.js
__ ProjectTextureApp_0.04.js
__ ProjectTextureApp_0.05.js
__ cube.exelem
__ new_mesh.exelem
__ herald_old.png

.. _Download: http://www.cmiss.org/ReleaseCenter/zinc