musicGadget.xml

<?xml version="1.0" encoding="UTF-8" ?> 
<Module>
<ModulePrefs title="Music Notation Example" height="400" >
  <Require feature="wave" />
<!--  <Require feature="dynamic-height"/> -->
</ModulePrefs>
<Content type="html">
<![CDATA[ 
<!-- <script src="http://clef.cs.ubc.ca/salieri/nview/javascript/NoteServer.js" language="JavaScript"></script> -->
    <div id="content_div" ></div>    
<script type="text/javascript">
    var noteserveraddress = "clef.cs.ubc.ca"
    var htmlbase = "/salieri/nview";
    var versionstring = "";

// this functions takes a GMN-string and returns the URL
// that converts it into a GIF-file
function GetGIFURL(gmnstring,zoom,pagenum)
{
      gmnstring = escape(gmnstring);
      gmnstring = gmnstring.replace(/\//g,"%2F");

      var string = "http://" + noteserveraddress +
	"/scripts/salieri" + versionstring +
	"/gifserv.pl?";

      if (!zoom)
	  {	
	      zoom = "1.0";
	  }
      if (!pagenum)
	  {
	      pagenum = "1";
	  }

      	string = string + "pagewidth=21";
	string = string + "&pageheight=29.7";
	string = string + "&zoomfactor=" + zoom;
	string = string + "&pagesizeadjust=yes";
	string = string + "&outputformat=gif87";
	string = string + "&pagenum=" + pagenum;
	string = string  + "&gmndata=" + gmnstring;

	//	document.write(string);
        return string;
}

// this functions takes a GMN-string and returns the URL
// that converts it into a MIDI-file
function GetMIDIURL(gmnstring)
{
      gmnstring = escape(gmnstring);
      gmnstring = gmnstring.replace(/\//g,"%2F");

      var string = "http://" + noteserveraddress +
	"/scripts/salieri" + versionstring + 
	"/midserv.pl?";

      string = string + "gmndata=" + gmnstring;

      return string;
}
    var div = document.getElementById('content_div');

    function buttonClicked() {
//      var expr = wave.getState().get('music', '[ a b c ]');
      var music = document.getElementById('yourMusic').value;
      var size = document.getElementById('setSize').value;
      wave.getState().submitDelta({'music': music, 'size': size });
    }

    function stateUpdated() {
      if(!wave.getState().get('music')) {
        div.innerHTML = "No musical expression.";
      }
      else {
        document.getElementById('yourMusic').value = wave.getState().get('music');
        div.innerHTML = "<img src='" + GetGIFURL(wave.getState().get('music'), wave.getState().get('size')) + "' >" + "<br />" + "<a href='" + GetMIDIURL(escape(wave.getState().get('music'))) + "' >Listen</a> " + "<a href='http://www.salieri.org/guido/doc.html' >Help</a>";
        gadgets.window.adjustHeight();
      } 
    }
 
    function init() {
      if (wave && wave.isInWaveContainer()) {
        wave.setStateCallback(stateUpdated);
        // gadgets.window.adjustHeight();
      }
    }
    gadgets.util.registerOnLoadHandler(init);
//    gadgets.window.adjustHeight();

    // Reset value of "music" to empty
    function resetCounter(){
      wave.getState().submitDelta({'music': ''});
    }

    </script>
    <input id="yourMusic" size="30" value=""><br /><button id="butCount" onclick="buttonClicked()">Update</button>
    <input type=button value="Reset" id="butReset" onClick="resetCounter()"><input id="setSize" size="3" value="1.0" >
  ]]> 
  </Content>
</Module>