Mercurial > hg > env-test-daniele

view templates.py @ 0:032bc65ebafc

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
added core components
author George Fazekas <gyorgy.fazekas@eecs.qmul.ac.uk>
date Wed, 06 Mar 2013 15:45:48 +0000
parents
children 15260ae0d6bc
line wrap: on
line source

audiotempl= '''

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<html lang="en" dir="ltr">

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8;charset=utf-8" >
	<link rel="stylesheet" type="text/css" href="../htempl/barrensa.css" TITLE="combined" />
	<link rel="stylesheet" href="../build/mediaelementplayer.min.css" TITLE="combined">
  	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>Digital Audio FX Perceptual Attributes</title>	
	
	<script src="../build/jquery.js"></script>	
	<script src="../build/mediaelement-and-player.min.js"></script>


	<script language = "JavaScript">
	
	window.onload = function () {
	
	document.getElementById("a1_1")[%i].selected = true;
	document.getElementById("a1_2")[%i].selected = true;
	document.getElementById("a1_3")[%i].selected = true;
	document.getElementById("a1_4")[%i].selected = true;

	document.getElementById("a2_1")[%i].selected = true;
	document.getElementById("a2_2")[%i].selected = true;
	document.getElementById("a2_3")[%i].selected = true;
	document.getElementById("a2_4")[%i].selected = true;

	document.getElementById("a3_1")[%i].selected = true;
	document.getElementById("a3_2")[%i].selected = true;
	document.getElementById("a3_3")[%i].selected = true;
	document.getElementById("a3_4")[%i].selected = true;
	
	document.getElementById("a4_1")[%i].selected = true;
	document.getElementById("a4_2")[%i].selected = true;
	document.getElementById("a4_3")[%i].selected = true;
	document.getElementById("a4_4")[%i].selected = true;
	
	document.getElementById("a5_1")[%i].selected = true;
	document.getElementById("a5_2")[%i].selected = true;
	document.getElementById("a5_3")[%i].selected = true;
	document.getElementById("a5_4")[%i].selected = true;
	
	document.getElementById("a6_1")[%i].selected = true;
	document.getElementById("a6_2")[%i].selected = true;
	document.getElementById("a6_3")[%i].selected = true;
	document.getElementById("a6_4")[%i].selected = true;
	
	document.getElementById("a7_1")[%i].selected = true;
	document.getElementById("a7_2")[%i].selected = true;
	document.getElementById("a7_3")[%i].selected = true;
	document.getElementById("a7_4")[%i].selected = true;
	
	document.getElementById("a8_1")[%i].selected = true;
	document.getElementById("a8_2")[%i].selected = true;
	document.getElementById("a8_3")[%i].selected = true;
	document.getElementById("a8_4")[%i].selected = true;
	
	document.getElementById("a9_1")[%i].selected = true;
	document.getElementById("a9_2")[%i].selected = true;
	document.getElementById("a9_3")[%i].selected = true;
	document.getElementById("a9_4")[%i].selected = true;
	
	document.getElementById("a10_1")[%i].selected = true;
	document.getElementById("a10_2")[%i].selected = true;
	document.getElementById("a10_3")[%i].selected = true;
	document.getElementById("a10_4")[%i].selected = true;
	
	
	}

	</script>
	
	<script language="JavaScript" src="../js/gen_validatorv4.js"
	    type="text/javascript" xml:space="preserve"></script>

</head>

<body>

<div id="mainPicture">
    	<div class="picture">
        	<div id="headerTitle">Digital Audio FX</div>
            <div id="headerSubtext">Perceptual Attributes Listening Test</div>
        </div>
    </div>
		<div class="contentBox">
	    
        
    	

  <h3 id="test 1">%i/%i</h3><br>
  <h4> Please play the two sounds one after the other.</h4>
<h4>Indicate in the menus below the audio players which perceptual attribute is affected mainly by the DAFx.</h4><br>
<p><i>Optionally</i>, you may choose another main perceptual attributes (attribute that is affected to an equal degree), and two secondary perceptual attributes (attributes that are affected to a lesser degree).</p>
<br>




<form name="attributes" action="doAttrib" method="POST">

<audio id="audio player 1_1" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
   <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" 															value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<audio id="audio player 1_2" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
    <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>

<div class="selects">
main:<img width=1px height=0px src='/images/spacer.gif'>	
<select name="attribute1_1" id="a1_1">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute1_2" id="a1_2">
	<option value="0"></option>
	<option value="1">duration</option>
	<option value="2">rhythm</option>
	<option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>
</p>
	
<p>other:
<select name="attribute1_3" id="a1_3">
	<option value="0"></option>
	<option value="1">duration</option>
	<option value="2">rhythm</option>
	<option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute1_4" id="a1_4">
	<option value="0"></option>
  	<option value="1">duration</option>
  	<option value="2">rhythm</option>
  	<option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>	

</p>
</div>

<br>

<audio id="audio player 2_1" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
   <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" 															value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<audio id="audio player 2_2" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
    <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<div class="selects">
<p>main:<img width=1px height=0px src='/images/spacer.gif'>	
<select name="attribute2_1" id="a2_1">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute2_2" id="a2_2">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>
</p>
	
<p>other:
<select name="attribute2_3" id="a2_3">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute2_4" id="a2_4">
	<option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>	
</p>
</div>
<br>


<audio id="audio player 3_1" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
   <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" 															value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<audio id="audio player 3_2" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
    <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<div class="selects">
<p>main:<img width=1px height=0px src='/images/spacer.gif'>	
<select name="attribute3_1" id="a3_1">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute3_2" id="a3_2">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>
</p>
	
<p>other:
<select name="attribute3_3" id="a3_3">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute3_4" id="a3_4">
  <option value="0"></option>
	<option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>	


</p>
<br>
</div>
<audio id="audio player 4_1" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
   <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" 															value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<audio id="audio player 4_2" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
    <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<div class="selects">
<p>main:<img width=1px height=0px src='/images/spacer.gif'>	
<select name="attribute4_1" id="a4_1">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute4_2" id="a4_2">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>
</p>
	
<p>other:
<select name="attribute4_3" id="a4_3">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute4_4" id="a4_4">
  <option value="0"></option>
	<option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>	


</p>
</div>
<br>

<audio id="audio player 5_1" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
   <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" 															value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<audio id="audio player 5_2" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
    <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<div class="selects">
<p>main:<img width=1px height=0px src='/images/spacer.gif'>	
<select name="attribute5_1" id="a5_1">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute5_2" id="a5_2">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>
</p>
	
<p>other:
<select name="attribute5_3" id="a5_3">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute5_4" id="a5_4">
  <option value="0"></option>
	<option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>	

</p>
</div>
<br>

<audio id="audio player 6_1" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
   <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" 															value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<audio id="audio player 6_2" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
    <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<div class="selects">
<p>main:<img width=1px height=0px src='/images/spacer.gif'>	
<select name="attribute6_1" id="a6_1">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute6_2" id="a6_2">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>
</p>
	
<p>other:
<select name="attribute6_3" id="a6_3">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute6_4" id="a6_4">
  <option value="0"></option>
	<option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>	

</p>
</div>
<br>

<audio id="audio player 7_1" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
   <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" 															value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<audio id="audio player 7_2" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
    <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<div class="selects">
<p>main:<img width=1px height=0px src='/images/spacer.gif'>	
<select name="attribute7_1" id="a7_1">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute7_2" id="a7_2">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>
</p>
	
<p>other:
<select name="attribute7_3" id="a7_3">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute7_4" id="a7_4">
  <option value="0"></option>
	<option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>	

</p>
</div>
<br>

<audio id="audio player 8_1" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
   <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" 															value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<audio id="audio player 8_2" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
    <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<div class="selects">
<p>main:<img width=1px height=0px src='/images/spacer.gif'>	
<select name="attribute8_1" id="a8_1">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute8_2" id="a8_2">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>
</p>
	
<p>other:
<select name="attribute8_3" id="a8_3">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute8_4" id="a8_4">
  <option value="0"></option>
	<option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>	

</p>
</div>
<br>

<audio id="audio player 9_1" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
   <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" 															value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<audio id="audio player 9_2" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
    <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<div class="selects">
<p>main:<img width=1px height=0px src='/images/spacer.gif'>	
<select name="attribute9_1" id="a9_1">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute9_2" id="a9_2">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>
</p>
	
<p>other:
<select name="attribute9_3" id="a9_3">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute9_4" id="a9_4">
  <option value="0"></option>
	<option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>	

</p>
</div>
<br>

<audio id="audio player 10_1" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
   <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" 															value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<audio id="audio player 10_2" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
    <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<div class="selects">
<p>main:<img width=1px height=0px src='/images/spacer.gif'>	
<select name="attribute10_1" id="a10_1">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute10_2" id="a10_2">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>
</p>
	
<p>other:
<select name="attribute10_3" id="a10_3">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute10_4" id="a10_4">
  <option value="0"></option>
	<option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>	


</p>
<br>
	<input type="hidden" name="pageId" value="%i">
	<input type="hidden" name="sessionId" value="%s">
	
	<input type="submit" value="submit" name="submitButton"/>
	
	</form>
	
	<script language="JavaScript" type="text/javascript"
	    xml:space="preserve">//<![CDATA[
	  var frmvalidator  = new Validator("attributes");

	frmvalidator.addValidation("attribute1_1","dontselect=0", "Please select at least one main attribute for each item");
	frmvalidator.addValidation("attribute2_1","dontselect=0", "Please select at least one main attribute for each item");
	frmvalidator.addValidation("attribute3_1","dontselect=0", "Please select at least one main attribute for each item");
	frmvalidator.addValidation("attribute4_1","dontselect=0", "Please select at least one main attribute for each item");
	frmvalidator.addValidation("attribute5_1","dontselect=0", "Please select at least one main attribute for each item");
	frmvalidator.addValidation("attribute6_1","dontselect=0", "Please select at least one main attribute for each item");
	frmvalidator.addValidation("attribute7_1","dontselect=0", "Please select at least one main attribute for each item");
	frmvalidator.addValidation("attribute8_1","dontselect=0", "Please select at least one main attribute for each item");
	frmvalidator.addValidation("attribute9_1","dontselect=0", "Please select at least one main attribute for each item");
	frmvalidator.addValidation("attribute10_1","dontselect=0", "Please select at least one main attribute for each item");

	//]]></script>
	
	</div>

	    </div>

</body>

<script>
$('audio,video').mediaelementplayer();
</script>
</html>
'''

welcome_templ= '''

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<html lang="en" dir="ltr">

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8;charset=utf-8" >
	<link rel="stylesheet" type="text/css" href="../htempl/barrensa.css">
  	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>Digital Audio FX Perceptual Attributes</title>	
	



<script language="JavaScript" src="../js/gen_validatorv4.js"
    type="text/javascript" xml:space="preserve"></script>
</head>
<body>

<div id="mainPicture">
    	<div class="picture">
        	<div id="headerTitle">Digital Audio FX</div>
            <div id="headerSubtext">Perceptual Attributes Listening Test</div>
        </div>
    </div>
		<div class="contentBox">
		
		<h2>Welcome!</h2><br />
		<div align="justify">
		  <p>
		In this test we want to establish which perceptual attributes are affected by the application of digital audio effects (DAFx) on monotimbral audio material. Moreover, a goal is to find out if potential users of audio effects applications agree with established classifications. <br />
		<img width=25px height=0px src='/images/spacer.gif'>
		On the next pages you will be asked to listen to 'dry' source files followed by the same file after application of a DAFx. Please indicate in the menus below the audio players which perceptual attribute is affected mainly by the DAFx. <i>Optionally</i>, you may choose another main perceptual attribute (attribute that is affected to an equal degree), and two secondary perceptual attributes (attributes that are affected to a lesser degree).<br />
		<img width=25px height=0px src='/images/spacer.gif'>
		 The selection consists of: duration, rhythm, loudness, pitch, harmony, space, and timbre/quality. If you think the difference is not noticable or you cannot pinpoint any differences, please select 'none/unknown'.<br /><br />

	Before you begin, please give us some brief information about yourself and your musical or audio related background below. 
	</p>	</div>

	<br />	<br />



<form name="userinfos" action="doStart" method="POST">
<div class="selects">
</p>
Select Username<br />
<input type="text" name="uinfo00" id="uinfo00" />
<br /><br />

Age<br />
<select name="uinfo01" id="uinfo01">
  <option value="0"></option>
  <option value="1">< 18</option>
  <option value="2">18-24</option>
  <option value="3">25-34</option>
  <option value="4">35-44</option>
	<option value="5">45-54</option>
	<option value="5">55-64</option>
	<option value="6">65-74</option>
	<option value="7">> 74</option>
</select>
<br /><br />

Sex<br />
<select name="uinfo02" id="uinfo02">
  <option value="0"></option>
  <option value="1">female</option>
  <option value="2">male</option>
</select>


<br /><br /><br />

Rate your expertise on the following topics:
<br /><br />
Audio Production<br />
<select name="info1" id="info1">
  <option value="0"></option>
  <option value="1">not familiar</option>
  <option value="2">somewhat familiar</option>
  <option value="3">very familiar</option>
	<option value="4">expert</option>
</select>
<br /><br />
Electronic Music Composition<br />
<select name="info2" id="info2">
  <option value="0"></option>
  <option value="1">not familiar</option>
  <option value="2">somewhat familiar</option>
  <option value="3">very familiar</option>
	<option value="4">expert</option>
</select>

<br /><br />
Playing a Musical Instrument<br />
<select name="info3" id="info3">
  <option value="0"></option>
  <option value="1">not familiar</option>
  <option value="2">somewhat familiar</option>
  <option value="3">very familiar</option>
	<option value="4">expert</option>

</select>

<br /><br />
Audio Digital Signal Processing<br />
<select name="info4" id="info4">
  <option value="0"></option>
  <option value="1">not familiar</option>
  <option value="2">somewhat familiar</option>
  <option value="3">very familiar</option>
	<option value="4">expert</option>

</select>

<br /><br />
It is encouraged to use high quality headphones for this test. However, if you use loudspeakers instead make sure you're in the correct position between the speakers in order to evaluate stereo effects. Please specify (the closest to) your listening conditions:
<br />
<select name="info5" id="info5">
  <option value="0"></option>
  <option value="1">high quality headphones</option>
  <option value="2">low quality headphones</option>
  <option value="3">loudspeakers / professional studio</option>
	<option value="4">loudspeakers / semi-professional studio</option>
	<option value="5">hifi speakers / home</option>
</select>

<br />
<br />
<h4>Please note that HTML5 support is limited on this website and ADOBE FLASH is recommended</h4>
<input type="hidden" name="pageId" value="0">
<input type="hidden" name="sessionId" value="%s">
<input type="submit" value="submit" name="startButton">
</p>
</form>

<script language="JavaScript" type="text/javascript"
    xml:space="preserve">//<![CDATA[
  var frmvalidator  = new Validator("userinfos");

  frmvalidator.addValidation("uinfo00","req","Please select a username");
  frmvalidator.addValidation("uinfo00","maxlen=20",	"Max length for username is 20");
  frmvalidator.addValidation("uinfo00","minlen=3",	"Min length for username is 3");
  frmvalidator.addValidation("uinfo01","dontselect=0", "Please specify all information");
  frmvalidator.addValidation("uinfo02","dontselect=0", "Please specify all information");

  frmvalidator.addValidation("info1","dontselect=0", "Please specify all information");
  frmvalidator.addValidation("info2","dontselect=0", "Please specify all information");
  frmvalidator.addValidation("info3","dontselect=0", "Please specify all information");
  frmvalidator.addValidation("info4","dontselect=0", "Please specify all information");
  frmvalidator.addValidation("info5","dontselect=0", "Please specify all information");

//]]></script>


</div>
	<br />
<h3>Thank you for participating in this project!</h3><br />

	</div>
</body>

</html>
'''




audiotemplast = '''

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<html lang="en" dir="ltr">

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8;charset=utf-8" >
	<link rel="stylesheet" type="text/css" href="../htempl/barrensa.css" TITLE="combined" />
	<link rel="stylesheet" href="../build/mediaelementplayer.min.css" TITLE="combined">
  	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>Digital Audio FX Perceptual Attributes</title>	
	
	<script src="../build/jquery.js"></script>	
	<script src="../build/mediaelement-and-player.min.js"></script>


	<script language = "JavaScript">
	
	window.onload = function () {
	
	document.getElementById("a1_1")[%i].selected = true;
	document.getElementById("a1_2")[%i].selected = true;
	document.getElementById("a1_3")[%i].selected = true;
	document.getElementById("a1_4")[%i].selected = true;
	
	document.getElementById("a2_1")[%i].selected = true;
	document.getElementById("a2_2")[%i].selected = true;
	document.getElementById("a2_3")[%i].selected = true;
	document.getElementById("a2_4")[%i].selected = true;
	
	document.getElementById("a3_1")[%i].selected = true;
	document.getElementById("a3_2")[%i].selected = true;
	document.getElementById("a3_3")[%i].selected = true;
	document.getElementById("a3_4")[%i].selected = true;
	
	document.getElementById("a4_1")[%i].selected = true;
	document.getElementById("a4_2")[%i].selected = true;
	document.getElementById("a4_3")[%i].selected = true;
	document.getElementById("a4_4")[%i].selected = true;
	
	document.getElementById("a5_1")[%i].selected = true;
	document.getElementById("a5_2")[%i].selected = true;
	document.getElementById("a5_3")[%i].selected = true;
	document.getElementById("a5_4")[%i].selected = true;
	
	document.getElementById("a6_1")[%i].selected = true;
	document.getElementById("a6_2")[%i].selected = true;
	document.getElementById("a6_3")[%i].selected = true;
	document.getElementById("a6_4")[%i].selected = true;
	
	}

	</script>
	
	<script language="JavaScript" src="/js/gen_validatorv4.js"
	    type="text/javascript" xml:space="preserve"></script>

</head>

<body>

<div id="mainPicture">
    	<div class="picture">
        	<div id="headerTitle">Digital Audio FX</div>
            <div id="headerSubtext">Perceptual Attributes Listening Test</div>
        </div>
    </div>
		<div class="contentBox">
	    
        
    	

		  <h3 id="test 1">%i/%i</h3><br>
		  <h4> Please play the two sounds one after the other.</h4>
		<h4>Indicate in the menus below the audio players which perceptual attribute is affected mainly by the DAFx.</h4><br>
		<p><i>Optionally</i>, you may choose another main perceptual attribute (attribute that is affected to an equal degree), and two secondary perceptual attributes (attributes that are affected to a lesser degree).</p>
		<br>


<form name="attributes" action="doAttrib2" method="POST">

<audio id="audio player 1_1" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
   <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" 															value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<audio id="audio player 1_2" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
    <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>

<div class="selects">
main:<img width=1px height=0px src='/images/spacer.gif'>	
<select name="attribute1_1" id="a1_1">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute1_2" id="a1_2">
	<option value="0"></option>
	<option value="1">duration</option>
	<option value="2">rhythm</option>
	<option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>
</p>
	
<p>other:
<select name="attribute1_3" id="a1_3">
	<option value="0"></option>
	<option value="1">duration</option>
	<option value="2">rhythm</option>
	<option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute1_4" id="a1_4">
	<option value="0"></option>
  	<option value="1">duration</option>
  	<option value="2">rhythm</option>
  	<option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>	



</p>
</div>

<br>

<audio id="audio player 2_1" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
   <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" 															value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<audio id="audio player 2_2" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
    <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<div class="selects">
<p>main:<img width=1px height=0px src='/images/spacer.gif'>	
<select name="attribute2_1" id="a2_1">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute2_2" id="a2_2">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>
</p>
	
<p>other:
<select name="attribute2_3" id="a2_3">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute2_4" id="a2_4">
	<option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>	

</p>
</div>
<br>


<audio id="audio player 3_1" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
   <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" 															value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<audio id="audio player 3_2" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
    <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<div class="selects">
<p>main:<img width=1px height=0px src='/images/spacer.gif'>	
<select name="attribute3_1" id="a3_1">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute3_2" id="a3_2">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>
</p>
	
<p>other:
<select name="attribute3_3" id="a3_3">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute3_4" id="a3_4">
  <option value="0"></option>
	<option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>	

</p>
<br>
</div>
<audio id="audio player 4_1" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
   <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" 															value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<audio id="audio player 4_2" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
    <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<div class="selects">
<p>main:<img width=1px height=0px src='/images/spacer.gif'>	
<select name="attribute4_1" id="a4_1">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute4_2" id="a4_2">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>
</p>
	
<p>other:
<select name="attribute4_3" id="a4_3">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute4_4" id="a4_4">
  <option value="0"></option>
	<option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>	

</p>
</div>
<br>

<audio id="audio player 5_1" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
   <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" 															value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<audio id="audio player 5_2" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
    <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<div class="selects">
<p>main:<img width=1px height=0px src='/images/spacer.gif'>	
<select name="attribute5_1" id="a5_1">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute5_2" id="a5_2">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>
</p>
	
<p>other:
<select name="attribute5_3" id="a5_3">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute5_4" id="a5_4">
  <option value="0"></option>
	<option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>	

</p>
</div>
<br>

<audio id="audio player 6_1" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
   <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" 															value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<audio id="audio player 6_2" controls>
  <source src="../audio/%s.mp3" type="audio/mpeg" />
    <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=../audio/%s.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=../audio/%s.mp3" /></object>
</audio>
<div class="selects">
<p>main:<img width=1px height=0px src='/images/spacer.gif'>	
<select name="attribute6_1" id="a6_1">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute6_2" id="a6_2">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>
</p>
	
<p>other:
<select name="attribute6_3" id="a6_3">

  <option value="0"></option>
  <option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>

<select name="attribute6_4" id="a6_4">
  <option value="0"></option>
	<option value="1">duration</option>
  <option value="2">rhythm</option>
  <option value="3">loudness</option>
	<option value="4">pitch</option>
	<option value="5">harmony</option>
	<option value="6">space</option>
	<option value="7">timbre/quality</option>
	<option value="8">none/unknown</option>
</select>	


</p>
<br>
	<input type="hidden" name="pageId" value="%i">
	<input type="hidden" name="sessionId" value="%s">
	
	<input type="submit" value="submit" name="submitButton"/>
	
	</form>
	
	<script language="JavaScript" type="text/javascript"
	    xml:space="preserve">//<![CDATA[
	  var frmvalidator  = new Validator("attributes");

	frmvalidator.addValidation("attribute1_1","dontselect=0", "Please select at least one main attribute for each item");
	frmvalidator.addValidation("attribute2_1","dontselect=0", "Please select at least one main attribute for each item");
	frmvalidator.addValidation("attribute3_1","dontselect=0", "Please select at least one main attribute for each item");
	frmvalidator.addValidation("attribute4_1","dontselect=0", "Please select at least one main attribute for each item");
	frmvalidator.addValidation("attribute5_1","dontselect=0", "Please select at least one main attribute for each item");
	frmvalidator.addValidation("attribute6_1","dontselect=0", "Please select at least one main attribute for each item");


	//]]></script>
	</div>

	    </div>

</body>

<script>
$('audio,video').mediaelementplayer();
</script>
</html>
'''






endtempl = '''
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
</head>
<body>
<p>results</p>
<table border="1">
<tr>
<th>Audio File</th>
<th>Main 1</th>
<th>Main 2</th>
<th>Other 1</th>
<th>Other 2</th>
</tr>
%s
</table>
<p> <a href="http://www.elec.qmul.ac.uk/digitalmusic">thanks!</a> </p>
</body>
</html>
'''
#<p> <a href="/out/">thanks!</a> </p>

endtempl2 = '''
<tr>
<td>%s</td>
<td><center>%s</center></td>
<td><center>%s</center></td>
<td><center>%s</center></td>
<td><center>%s</center></td>
</tr>
'''