tapedialog.html

<div hidden="hidden" id="tapeDialogMain" Title="Tape control">
<div style="overflow-y: scroll; height: 190px; width: 100%;border-style:solid">
	<span></span>
	<div>
	<table id="tapeDialogTable" style="height: 100%; width: 100%">
	</table>
	</div>
</div>

<div style="padding-top: 5px">
	<button onclick="" class="ui-state-default ui-corner-all" title=".ui-icon-play"><span class="ui-icon ui-icon-play"></span></button>
	<button onclick="" class="ui-state-default ui-corner-all" title=".ui-icon-pause"><span class="ui-icon ui-icon-pause"></span></button>
	<button onclick="tapeFirst();" class="ui-state-default ui-corner-all" title=".ui-icon-seek-first"><span class="ui-icon ui-icon-seek-first"></span></button>
	<button onclick="tapeRew();" class="ui-state-default ui-corner-all" title=".ui-icon-seek-prev"><span class="ui-icon ui-icon-seek-prev"></span></button>
	<button onclick="tapeFwd();" class="ui-state-default ui-corner-all" title=".ui-icon-seek-next"><span class="ui-icon ui-icon-seek-next"></span></button>
	<button onclick="tapeLast();" class="ui-state-default ui-corner-all" title=".ui-icon-seek-end"><span class="ui-icon ui-icon-seek-end"></span></button>
	<button onclick="" class="ui-state-default ui-corner-all" title=".ui-icon-stop"><span class="ui-icon ui-icon-stop"></span></button>
	<button onclick="tapeEject();" class="ui-state-default ui-corner-all" title=".ui-icon-eject"><span class="ui-icon ui-icon-eject"></span></button>
</div>
</div>

<script type="text/javascript">
$(function() {
	$("#tapeDialogMain").dialog({
				autoOpen: false,
				width: 600,
				height: 400,
				buttons: [
					{
						text: "Ok",
						click: function() {
							$( this ).dialog( "close" );
						}
					}
				]
				}
				);
	});
</script>