- From: poot <cvsmail@w3.org>
- Date: Thu, 25 Mar 2010 16:57:02 +0900 (JST)
- To: public-html-diffs@w3.org
workers; hixie: Fix the recently added examples. (whatwg r4866)
http://dev.w3.org/cvsweb/html5/workers/Overview.html?r1=1.238&r2=1.239&f=h
http://html5.org/tools/web-apps-tracker?from=4865&to=4866
===================================================================
RCS file: /sources/public/html5/workers/Overview.html,v
retrieving revision 1.238
retrieving revision 1.239
diff -u -d -r1.238 -r1.239
--- Overview.html 25 Mar 2010 00:52:59 -0000 1.238
+++ Overview.html 25 Mar 2010 07:56:32 -0000 1.239
@@ -466,16 +466,76 @@
example. Shared workers use slightly different APIs, since each
worker can have multiple connections.<p>This first example shows how you connect to a worker and how a
worker can send a message back to the page when it connects to
- it. Received messages are displayed in a log.<p>Here is the HTML page:<pre>EXAMPLE workers/shared/001/test.html</pre><p>Here is the JavaScript worker:<pre>EXAMPLE workers/shared/001/test.js</pre><hr><p>This second example extends the first one by changing two things:
+ it. Received messages are displayed in a log.<p>Here is the HTML page:<pre><!DOCTYPE HTML>
+<title>Shared workers: demo 1</title>
+<pre id="log">Log:</pre>
+<script>
+ var worker = new SharedWorker('test.js');
+ var log = document.getElementById('log');
+ worker.port.onmessage = function(e) { // note: not worker.onmessage!
+ log.textContent += '\n' + e.data;
+ }
+</script>
+</pre><p>Here is the JavaScript worker:<pre>onconnect = function(e) {
+ var port = e.ports[0];
+ port.postMessage('Hello World!');
+}
+</pre><hr><p>This second example extends the first one by changing two things:
first, messages are received using <code title="">addEventListener()</code> instead of an <span title="event
handler IDL attributes">event handler IDL attribute</span>, and
second, a message is sent <em>to</em> the worker, causing the worker
to send another message in return. Received messages are again
- displayed in a lot.<p>Here is the HTML page:<pre>EXAMPLE workers/shared/001/test.html</pre><p>Here is the JavaScript worker:<pre>EXAMPLE workers/shared/001/test.js</pre><hr><p>Finally, the example is extended to show how two pages can
+ displayed in a log.<p>Here is the HTML page:<pre><!DOCTYPE HTML>
+<title>Shared workers: demo 1</title>
+<pre id="log">Log:</pre>
+<script>
+ var worker = new SharedWorker('test.js');
+ var log = document.getElementById('log');
+ worker.port.onmessage = function(e) { // note: not worker.onmessage!
+ log.textContent += '\n' + e.data;
+ }
+</script>
+</pre><p>Here is the JavaScript worker:<pre>onconnect = function(e) {
+ var port = e.ports[0];
+ port.postMessage('Hello World!');
+}
+</pre><hr><p>Finally, the example is extended to show how two pages can
connect to the same worker; in this case, the second page is merely
in an <code>iframe</code> on the first page, but the same principle
would apply to an entirely separate page in a separate
- <span>top-level browsing context</span>.<p>Here is the outer HTML page:<pre>EXAMPLE workers/shared/003/test.html</pre><p>Here is the inner HTML page:<pre>EXAMPLE workers/shared/003/inner.html</pre><p>Here is the JavaScript worker:<pre>EXAMPLE workers/shared/003/test.js</pre><h4 id="shared-state-using-a-shared-worker"><span class="secno">1.2.5 </span>Shared state using a shared worker</h4><p><i>This section is non-normative.</i><p>In this example, multiple windows (viewers) can be opened that
+ <span>top-level browsing context</span>.<p>Here is the outer HTML page:<pre><!DOCTYPE HTML>
+<title>Shared workers: demo 3</title>
+<pre id="log">Log:</pre>
+<script>
+ var worker = new SharedWorker('test.js');
+ var log = document.getElementById('log');
+ worker.port.addEventListener('message', function(e) {
+ log.textContent += '\n' + e.data;
+ }, false);
+ worker.port.start();
+ worker.port.postMessage('ping');
+</script>
+<iframe src="inner.html"></iframe>
+</pre><p>Here is the inner HTML page:<pre><!DOCTYPE HTML>
+<title>Shared workers: demo 3 inner frame</title>
+<pre id=log>Inner log:</pre>
+<script>
+ var worker = new SharedWorker('test.js');
+ var log = document.getElementById('log');
+ worker.port.onmessage = function(e) {
+ log.textContent += '\n' + e.data;
+ }
+</script>
+</pre><p>Here is the JavaScript worker:<pre>var count = 0;
+onconnect = function(e) {
+ count += 1;
+ var port = e.ports[0];
+ port.postMessage('Hello World! You are connection #' + count);
+ port.onmessage = function(e) {
+ port.postMessage('pong');
+ }
+}
+</pre><h4 id="shared-state-using-a-shared-worker"><span class="secno">1.2.5 </span>Shared state using a shared worker</h4><p><i>This section is non-normative.</i><p>In this example, multiple windows (viewers) can be opened that
are all viewing the same map. All the windows share the same map
information, with a single worker coordinating all the viewers. Each
viewer can move around independently, but if they set any data on
Received on Thursday, 25 March 2010 07:57:31 UTC