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
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
|
<!DOCTYPE html>
<html>
<!--
Copyright (c) 2011 The Native Client Authors. All rights reserved.
Use of this source code is governed by a BSD-style license that can be
found in the LICENSE file.
-->
<head>
<title>Load Progress Example</title>
<script type="text/javascript" src="check_browser.js"></script>
<script type="text/javascript">
// Check for Native Client support in the browser before the DOM loads.
var isValidBrowser = false;
var browserSupportStatus = 0;
var checker = new browser_version.BrowserChecker(
14, // Minumum Chrome version.
navigator["appVersion"],
navigator["plugins"]);
checker.checkBrowser();
loadProgressModule = null; // Global application object.
statusText = 'NO-STATUS';
isValidBrowser = checker.getIsValidBrowser();
browserSupportStatus = checker.getBrowserSupportStatus();
// Handler that gets called when the NaCl module starts loading. This
// event is always triggered when an <EMBED> tag has a MIME type of
// application/x-nacl.
function moduleDidStartLoad() {
appendToEventLog('loadstart');
}
// Progress event handler. |event| contains a couple of interesting
// properties that are used in this example:
// total The size of the NaCl module in bytes. Note that this value
// is 0 until |lengthComputable| is true. In particular, this
// value is 0 for the first 'progress' event.
// loaded The number of bytes loaded so far.
// lengthComputable A boolean indicating that the |total| field
// represents a valid length.
//
// event The ProgressEvent that triggered this handler.
function moduleLoadProgress(event) {
var loadPercent = 0.0;
var loadPercentString;
if (event.lengthComputable && event.total > 0) {
loadPercent = event.loaded / event.total * 100.0;
loadPercentString = loadPercent + '%';
} else {
// The total length is not yet known.
loadPercent = -1.0;
loadPercentString = 'Computing...';
}
//appendToEventLog('progress: ' + loadPercentString + ' (' + event.loaded + ' of ' + event.total + ' bytes)');
updateStatus("Loading module : "+ Math.floor(event.loaded / event.total * 100.0) + "% complete");
}
// Handler that gets called if an error occurred while loading the NaCl
// module. Note that the event does not carry any meaningful data about
// the error, you have to check lastError on the <EMBED> element to find
// out what happened.
function moduleLoadError() {
appendToEventLog('error: ' + loadProgressModule.lastError);
}
// Handler that gets called if the NaCl module load is aborted.
function moduleLoadAbort() {
appendToEventLog('abort');
}
// When the NaCl module has loaded indicate success.
function moduleDidLoad() {
loadProgressModule = document.getElementById('load_progress');
appendToEventLog('load');
updateStatus('SUCCESS');
}
function check_dl_status() {
var module = document.getElementById('load_progress');
module.postMessage("get_package_status");
module.postMessage(0);
};
// Handler that gets called when the NaCl module loading has completed.
// You will always get one of these events, regardless of whether the NaCl
// module loaded successfully or not. For example, if there is an error
// during load, you will get an 'error' event and a 'loadend' event. Note
// that if the NaCl module loads successfully, you will get both a 'load'
// event and a 'loadend' event.
function moduleDidEndLoad() {
appendToEventLog('loadend');
var lastError = event.target.lastError;
if (lastError == undefined || lastError.length == 0) {
lastError = '<none>';
window.setTimeout(check_dl_status, 1000);
}
appendToEventLog('lastError: ' + lastError);
}
// Handle a message coming from the NaCl module.
function handleMessage(message_event) {
var data = message_event.data;
if (data == "loaded") {
updateStatus("Data Loaded!");
} else if (data == "none") {
// nothing
updateStatus("Downloading package: connecting");
window.setTimeout(check_dl_status, 1000);
} else {
updateStatus("Downloading package: " + data + " bytes");
window.setTimeout(check_dl_status, 1000);
};
}
// Set the global status message. Updates the 'status_field' element with
// the new text.
// opt_message The message text. If this is null or undefined, then
// attempt to set the element with id 'status_field' 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;
}
}
// Append an event name to the 'event_log_field' element. Event names
// are separated by a <br> tag so they get listed one per line.
// logMessage The message to append to the log.
function appendToEventLog(logMessage) {
var eventLogField = document.getElementById('event_log_field');
if (eventLogField.innerHTML.length == 0) {
eventLogField.innerHTML = logMessage;
} else {
eventLogField.innerHTML = eventLogField.innerHTML +
'<br />' +
logMessage;
}
}
</script>
</head>
<body bgcolor=#000000>
<font color=#FFFFFF>
<h1>Native Client Load Event Example</h1>
<h2>Status</h2>
<div id="status_field">NO-STATUS</div>
<div id="listener">
<script type="text/javascript">
var listener = document.getElementById('listener');
listener.addEventListener('loadstart', moduleDidStartLoad, true);
listener.addEventListener('progress', moduleLoadProgress, true);
listener.addEventListener('error', moduleLoadError, true);
listener.addEventListener('abort', moduleLoadAbort, true);
listener.addEventListener('load', moduleDidLoad, true);
listener.addEventListener('loadend', moduleDidEndLoad, true);
listener.addEventListener('message', handleMessage, true);
switch (browserSupportStatus) {
case browser_version.BrowserChecker.StatusValues.NACL_ENABLED:
appendToEventLog('Native Client plugin enabled.');
break;
case browser_version.BrowserChecker.StatusValues.UNKNOWN_BROWSER:
updateStatus('UNKNOWN BROWSER');
break;
case browser_version.BrowserChecker.StatusValues.CHROME_VERSION_TOO_OLD:
appendToEventLog(
'Chrome too old: You must use Chrome version 14 or later.');
updateStatus('NEED CHROME 14 OR LATER');
break;
case browser_version.BrowserChecker.StatusValues.NACL_NOT_ENABLED:
appendToEventLog(
'NaCl disabled: Native Client is not enabled.<br>' +
'Please go to <b>chrome://plugins</b> and enable Native Client ' +
'plugin.');
updateStatus('NaCl NOT ENABLED');
break;
case browser_version.BrowserChecker.StatusValues.NOT_USING_SERVER:
appendToEventLog(
'file: URL detected, please use a web server to host Native ' +
'Client applications.');
updateStatus('NaCl NOT ENABLED');
default:
appendToEventLog('Unknown error: Unable to detect browser and/or ' +
'Native Client support.');
updateStatus('UNKNOWN ERROR');
break;
}
</script>
<!-- Load the published .nexe. This includes the 'src' 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 runtime
('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 'src' attribute to the
_dbg.nmf version of the manifest file.
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.
-->
<embed name="nacl_module"
id="load_progress"
width=1024 height=600
src="godot_nacl.nmf"
type="application/x-nacl"
package="data.pcz"
arg1="-path" arg2="."
no_arg1="-test" no_arg2="gui" />
<script type="text/javascript">
loadProgressModule = document.getElementById('load_progress');
// Futher diagnose NaCl loading.
if (loadProgressModule == null ||
typeof loadProgressModule.readyState == 'undefined') {
switch (browserSupportStatus) {
case browser_version.BrowserChecker.StatusValues.NACL_ENABLED:
// The NaCl plugin is enabled and running, it's likely that the flag
// isn't set.
appendToEventLog(
'NaCl flag disabled: The Native Client flag is not enabled.<br>' +
'Please go to <b>chrome://flags</b> enable Native Client and ' +
'relaunch your browser. See also: ' +
'<a href="http://code.google.com/chrome/nativeclient/docs/' +
'running.html">Running Web Applications that Use Native Client' +
'</a>');
updateStatus('NaCl NOT ENABLED');
break;
case browser_version.BrowserChecker.StatusValues.UNKNOWN_BROWSER:
appendToEventLog('Native Client applications are not supported by ' +
'this browser.');
break;
default:
appendToEventLog('Unknown error when loading Native Client ' +
'application.');
}
}
</script>
</div>
<h2>Event Log</h2>
<div id="event_log_field">event log?</div>
</body>
</html>
|