Index: examples/mouselock/mouselock.html |
=================================================================== |
--- examples/mouselock/mouselock.html (revision 0) |
+++ examples/mouselock/mouselock.html (revision 0) |
@@ -0,0 +1,108 @@ |
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" |
+ "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
+<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> |
+ <meta http-equiv="Pragma" content="no-cache" /> |
+ <meta http-equiv="Expires" content="-1" /> |
+ <script type="text/javascript" src="../common/check_browser.js"></script> |
+ <script> |
+ // Check for Native Client support in the browser before the DOM loads. |
+ var isValidBrowser = false; |
+ var browserSupportStatus = 0; |
+ // Fullscreen and mouselock support is in Chrome version 16. |
+ var CHROME_MINIMUM_VERSION = 16; |
+ |
+ var checker = new browser_version.BrowserChecker( |
+ CHROME_MINIMUM_VERSION, |
+ navigator["appVersion"], |
+ navigator["plugins"]); |
+ checker.checkBrowser(); |
+ |
+ isValidBrowser = checker.getIsValidBrowser(); |
+ browserSupportStatus = checker.getBrowserSupportStatus(); |
+ |
+ function handleMessage(message_event) { |
+ console.log(message_event.data); |
+ } |
+ </script> |
+ <title>Full-screen and Mouse-lock Example</title> |
+</head> |
+<body title="This tooltip should not be shown if the mouse is locked."> |
+ <h1>Full-screen and Mouse-lock Example</h1> |
+ <ul> |
+ <li>There are two different kinds of fullscreen mode: "tab fullscreen" and |
+ "browser fullscreen". |
+ <ul> |
+ <li>Tab fullscreen refers to when a tab enters fullscreen mode via the |
+ JS or Pepper fullscreen API.</li> |
+ <li>Browser fullscreen refers to the user putting the browser itself |
+ into fullscreen mode from the UI (e.g., pressing F11).</li> |
+ </ul> |
+ <span style="font-weight:bold"> |
+ NOTE: Mouse lock is only allowed in "tab fullscreen" mode. |
+ </span> |
+ </li> |
+ <li>Lock mouse: |
+ <ul> |
+ <li>left click in the grey box; or</li> |
+ <li>right click in the box to ensure that it is focused and |
+ then press Enter key. (You could verify that the tooltip window is |
+ dismissed properly by this second approach.)</li> |
+ </ul> |
+ </li> |
+ <li>Unlock mouse voluntarily (i.e., NaCl module unlocks mouse): |
+ <ul> |
+ <li>press Enter.</li> |
+ </ul> |
+ </li> |
+ <li>Unlock mouse involuntarily (i.e. Chrome unlocks mouse): |
+ <ul> |
+ <li>lose focus; or</li> |
+ <li>press Esc key; or</li> |
+ <li>exit from the "tab fullscreen" mode.</li> |
+ </ul> |
+ </li> |
+ </ul> |
+ <p>Clicking the mouse inside the grey square takes the NaCl module to/from |
+ combined fullscreen and mouselock mode.</p> |
+ <p>While in fullscreen, pressing Enter will exit/enter mouse lock mode.</p> |
+ <!-- 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. |
+ --> |
+ <div id="listener"> |
+ <script type="text/javascript"> |
+ if (browserSupportStatus == |
+ browser_version.BrowserChecker.StatusValues.CHROME_VERSION_TOO_OLD) { |
+ alert('This example will only work on Chrome version ' + |
+ CHROME_MINIMUM_VERSION + |
+ ' or later.'); |
+ } else { |
+ var listener = document.getElementById('listener') |
+ listener.addEventListener('message', handleMessage, true); |
+ // Create two instances of the NaCl module. |
+ listener.innerHTML = '<embed id="mouselock_view" ' + |
+ 'type="application/x-nacl" ' + |
+ 'src="mouselock.nmf" ' + |
+ 'width="300" height="300" />'; |
+ } |
+ </script> |
+ </div> |
+</body> |
+</html> |
Property changes on: examples/mouselock/mouselock.html |
___________________________________________________________________ |
Added: svn:eol-style |
+ LF |