History for Developing Applications With Mozilla and CMGUI
changed:
-
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