client/annotviz/app/pianoroll_h.html
author rougeronj
Tue, 14 Apr 2015 11:30:20 +0200
changeset 147 4902992b2783
parent 100 0d7dac03c1a0
child 150 c8fe9606d967
permissions -rw-r--r--
add scene width options to the scene and options for the 2 pianorolls
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
95
806739a26858 add vertical version for pianoroll
ymh <ymh.work@gmail.com>
parents:
diff changeset
     1
<!DOCTYPE html>
806739a26858 add vertical version for pianoroll
ymh <ymh.work@gmail.com>
parents:
diff changeset
     2
<html lang="en">
806739a26858 add vertical version for pianoroll
ymh <ymh.work@gmail.com>
parents:
diff changeset
     3
<head>
147
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
     4
<meta charset="utf-8">
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
     5
<meta name="viewport" content="width=device-width,initial-scale=1">
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
     6
<meta name="description" content="">
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
     7
<meta name="author" content="I.R.I">
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
     8
<link rel="shortcut icon" href="/img/favicon.ico">
95
806739a26858 add vertical version for pianoroll
ymh <ymh.work@gmail.com>
parents:
diff changeset
     9
147
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    10
<title>Horizontal Piano Roll</title>
95
806739a26858 add vertical version for pianoroll
ymh <ymh.work@gmail.com>
parents:
diff changeset
    11
147
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    12
<!-- Custom styles for this template -->
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    13
<link href="/css/annotviz.css" rel="stylesheet">
95
806739a26858 add vertical version for pianoroll
ymh <ymh.work@gmail.com>
parents:
diff changeset
    14
</head>
806739a26858 add vertical version for pianoroll
ymh <ymh.work@gmail.com>
parents:
diff changeset
    15
806739a26858 add vertical version for pianoroll
ymh <ymh.work@gmail.com>
parents:
diff changeset
    16
<body>
147
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    17
	<h1>Horizontal Piano Roll</h1>
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    18
	<noscript>You must enable JavaScript</noscript>
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    19
	<div id="canvasContainer"></div>
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    20
	<p>
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    21
		<a href="#" onclick="stop(); return false;">stop intervals</a> - <a
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    22
			href="#" onclick="start(); return false;">start intervals</a> - temps
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    23
		écoulé : <span id="timeStarted"></span>
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    24
	</p>
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    25
	<pre id="log"></pre>
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    26
	<script src="/js/libs-annotviz.js"></script>
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    27
	<script src="/js/annotviz.js"></script>
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    28
	<script>
98
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents: 95
diff changeset
    29
        var annotationChannel = 'PIANOROLL';
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents: 95
diff changeset
    30
        var eventCode = 'test_1';
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents: 95
diff changeset
    31
        var wsUri;
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents: 95
diff changeset
    32
        if (window.location.protocol === 'file:') {
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents: 95
diff changeset
    33
            wsUri = 'ws://127.0.0.1:8090/broadcast';
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents: 95
diff changeset
    34
        }
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents: 95
diff changeset
    35
        else {
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents: 95
diff changeset
    36
            wsUri = 'ws://' + window.location.hostname + ':8090/broadcast';
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents: 95
diff changeset
    37
        }
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents: 95
diff changeset
    38
        wsUri += '?channel='+annotationChannel+'&event_code='+eventCode;
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 98
diff changeset
    39
        
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 98
diff changeset
    40
        var logger = new annotviz.HtmlLogger(false, 'log');
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 98
diff changeset
    41
        
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 98
diff changeset
    42
        var stageView = new annotviz.StageView({
147
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    43
        	logger: logger,
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    44
        	sceneWidth: 1280,
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 98
diff changeset
    45
        });
98
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents: 95
diff changeset
    46
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents: 95
diff changeset
    47
        var doubleroll = new annotviz.DoubleRoll({
147
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    48
        	logger: logger,
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 98
diff changeset
    49
            stageView: stageView,
147
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    50
            ws: new annotviz.WsWrapper(wsUri),
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    51
        	orientation: 'horizontal',
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    52
        	sceneWidth: 1280,
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    53
        	zeroShift: 1,
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    54
            pianorolls : [
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    55
			  {
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    56
			    height: 384,
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    57
			    timeWidth: 10,
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    58
			    lineInterval: 5000,
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    59
			    noteHeight: undefined,
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    60
			    range: {
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    61
					bottom: 40,
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    62
					top: 90,
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    63
			    },
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    64
			    dynamicRange: true,
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    65
			  },
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    66
			  {
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    67
			    height: 384,
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    68
			    timeWidth: 60,
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    69
			    lineInterval: 5000,
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    70
			    noteHeight: undefined,
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    71
			    range:{
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    72
					bottom: 0,
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    73
					top: 128,
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    74
			    },
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    75
			    dynamicRange: false,
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    76
			  },
4902992b2783 add scene width options to the scene and options for the 2 pianorolls
rougeronj
parents: 100
diff changeset
    77
			],
95
806739a26858 add vertical version for pianoroll
ymh <ymh.work@gmail.com>
parents:
diff changeset
    78
        });
98
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents: 95
diff changeset
    79
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 98
diff changeset
    80
        function stop() { stageView.stop(); }
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 98
diff changeset
    81
        function start() { stageView.start(); }
98
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents: 95
diff changeset
    82
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents: 95
diff changeset
    83
        window.onload = function() {
100
0d7dac03c1a0 Merge with 72d767c5142df7fc6387215096321295fbaaa73d
rougeronj
parents: 98
diff changeset
    84
        	stageView.init();
98
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents: 95
diff changeset
    85
            start();
72d767c5142d refactor and make work annotsroll
ymh <ymh.work@gmail.com>
parents: 95
diff changeset
    86
        }
95
806739a26858 add vertical version for pianoroll
ymh <ymh.work@gmail.com>
parents:
diff changeset
    87
    </script>
806739a26858 add vertical version for pianoroll
ymh <ymh.work@gmail.com>
parents:
diff changeset
    88
</body>
806739a26858 add vertical version for pianoroll
ymh <ymh.work@gmail.com>
parents:
diff changeset
    89
</html>