-
Notifications
You must be signed in to change notification settings - Fork 1
/
saltygme.html
168 lines (149 loc) · 5.5 KB
/
saltygme.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
<!DOCTYPE html>
<html>
<head>
<title>Saltygme!</title>
<script type="text/javascript">
SaltygmeModule = null; // Global application object.
statusText = 'Loading game music...';
voiceCount = 0;
currentTrack = 0;
trackCount = 0;
// Indicate load success.
function moduleDidLoad() {
SaltygmeModule = document.getElementById('saltygme');
updateStatus('Playing');
}
function prevTrack() {
SaltygmeModule.postMessage('prevTrack');
updateStatus();
}
function nextTrack() {
SaltygmeModule.postMessage('nextTrack');
updateStatus();
}
function toggleSound(play) {
if (play == false) {
SaltygmeModule.postMessage('stopPlayback');
updateStatusField('Paused');
} else {
SaltygmeModule.postMessage('startPlayback');
updateStatusField('Playing track ' + track + ' / ' + g_trackCount);
}
}
// The 'message' event handler. This handler is fired when the NaCl module
// posts a message to the browser by calling PPB_Messaging.PostMessage()
// (in C) or pp::Instance.PostMessage() (in C++). This implementation
// simply displays the content of the message in an alert panel.
function handleMessage(message_event) {
console.log("handle message: " + message_event.data);
if (message_event.data == undefined)
return;
obj = message_event.data.split(':');
param = obj[0];
value = obj[1];
if (param == "songLoaded")
{
console.log("song loaded = " + value);
SaltygmeModule.postMessage('voiceCount');
SaltygmeModule.postMessage('currentTrack');
SaltygmeModule.postMessage('trackCount');
}
else if (param == "voiceCount")
{
console.log("voice count = " + value);
voiceCount = value;
updateStatus();
}
else if (param == "currentTrack")
{
console.log("current track = " + value);
currentTrack = value;
updateStatus();
}
else if (param == "trackCount")
{
console.log("track count = " + value);
trackCount = value;
updateStatus();
}
}
// If the page loads before the Native Client module loads, then set the
// status message indicating that the module is still loading. Otherwise,
// do not change the status message.
function pageDidLoad() {
console.log("pageDidLoad()\n");
if (SaltygmeModule == null) {
updateStatus('Loading game music...');
} else {
// It's possible that the Native Client module onload event fired
// before the page's onload event. In this case, the status message
// will reflect 'SUCCESS', but won't be displayed. This call will
// display the current message.
updateStatus();
}
}
// Set the global status message. If the element with id 'statusField'
// exists, then set its HTML to the status message as well.
// opt_message The message test. If this is null or undefined, then
// attempt to set the element with id 'statusField' to the value of
// |statusText|.
function updateStatus(opt_message) {
if (opt_message)
statusText = opt_message;
var statusField = document.getElementById('status_field');
if (statusField) {
statusField.innerHTML = statusText;
}
var metadataField = document.getElementById('metadata_field');
if (metadataField && SaltygmeModule) {
metadataField.innerHTML = currentTrack + " / " + trackCount + ", " + voiceCount + " voices";
}
}
</script>
</head>
<body onload="pageDidLoad()">
<h1>Native Client Module Saltygme</h1>
<p>
<!-- Load the published .nexe. This includes the 'nacl' attribute which
shows how to load multi-architecture modules. Each entry in the "nexes"
object in the .nmf manifest file is a key-value pair: the key is the
instruction set architecture ('x86-32', 'x86-64', etc.); the value is a URL
for the desired NaCl module.
To load the debug versions of your .nexes, set the 'nacl' attribute to the
_dbg.nmf version of the manifest file.
Note: Since this NaCl module does not use any real-estate in the browser,
it's width and height are set to 0.
Note: The <EMBED> element is wrapped inside a <DIV>, which has both a 'load'
and a 'message' event listener attached. This wrapping method is used
instead of attaching the event listeners directly to the <EMBED> element to
ensure that the listeners are active before the NaCl module 'load' event
fires. This also allows you to use PPB_Messaging.PostMessage() (in C) or
pp::Instance.PostMessage() (in C++) from within the initialization code in
your NaCl module.
-->
<div id="listener">
<script type="text/javascript">
var listener = document.getElementById('listener');
listener.addEventListener('load', moduleDidLoad, true);
listener.addEventListener('message', handleMessage, true);
</script>
<embed name="nacl_module"
id="saltygme"
width=512 height=256
src="saltygme.nmf"
autoplay=1
songurl="http://10.0.1.104:5103/ducktales.nsfe"
type="application/x-nacl" />
</div>
<div id="saltygme_controls">
<button onclick="prevTrack()"><<</button>
<button onclick="toggleSound(true)">Play</button>
<button onclick="toggleSound(false)">Pause</button>
<button onclick="nextTrack()">>></button>
</div>
<div id="status_field">Loading song...</div>
<div id="channels_field"></div>
<div id="metadata_field"></div>
</p>
</body>
</html>