| OLD | NEW |
|---|
| (Empty) | |
| 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" |
| 2 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
| 3 <html> |
| 4 <!-- |
| 5 Copyright (c) 2011 The Native Client Authors. All rights reserved. |
| 6 Use of this source code is governed by a BSD-style license that can be |
| 7 found in the LICENSE file. |
| 8 --> |
| 9 <head> |
| 10 <meta http-equiv="Pragma" content="no-cache" /> |
| 11 <meta http-equiv="Expires" content="-1" /> |
| 12 <script type="text/javascript" src="../common/check_browser.js"></script> |
| 13 <script> |
| 14 // Check for Native Client support in the browser before the DOM loads. |
| 15 var isValidBrowser = false; |
| 16 var browserSupportStatus = 0; |
| 17 // Fullscreen and mouselock support is in Chrome version 16. |
| 18 var CHROME_MINIMUM_VERSION = 16; |
| 19 |
| 20 var checker = new browser_version.BrowserChecker( |
| 21 CHROME_MINIMUM_VERSION, |
| 22 navigator["appVersion"], |
| 23 navigator["plugins"]); |
| 24 checker.checkBrowser(); |
| 25 |
| 26 isValidBrowser = checker.getIsValidBrowser(); |
| 27 browserSupportStatus = checker.getBrowserSupportStatus(); |
| 28 |
| 29 function handleMessage(message_event) { |
| 30 console.log(message_event.data); |
| 31 } |
| 32 </script> |
| 33 <title>Full-screen and Mouse-lock Example</title> |
| 34 </head> |
| 35 <body title="This tooltip should not be shown if the mouse is locked."> |
| 36 <h1>Full-screen and Mouse-lock Example</h1> |
| 37 <ul> |
| 38 <li>There are two different kinds of fullscreen mode: "tab fullscreen" and |
| 39 "browser fullscreen". |
| 40 <ul> |
| 41 <li>Tab fullscreen refers to when a tab enters fullscreen mode via the |
| 42 JS or Pepper fullscreen API.</li> |
| 43 <li>Browser fullscreen refers to the user putting the browser itself |
| 44 into fullscreen mode from the UI (e.g., pressing F11).</li> |
| 45 </ul> |
| 46 <span style="font-weight:bold"> |
| 47 NOTE: Mouse lock is only allowed in "tab fullscreen" mode. |
| 48 </span> |
| 49 </li> |
| 50 <li>Lock mouse: |
| 51 <ul> |
| 52 <li>left click in the grey box; or</li> |
| 53 <li>right click in the box to ensure that it is focused and |
| 54 then press Enter key. (You could verify that the tooltip window is |
| 55 dismissed properly by this second approach.)</li> |
| 56 </ul> |
| 57 </li> |
| 58 <li>Unlock mouse voluntarily (i.e., NaCl module unlocks mouse): |
| 59 <ul> |
| 60 <li>press Enter.</li> |
| 61 </ul> |
| 62 </li> |
| 63 <li>Unlock mouse involuntarily (i.e. Chrome unlocks mouse): |
| 64 <ul> |
| 65 <li>lose focus; or</li> |
| 66 <li>press Esc key; or</li> |
| 67 <li>exit from the "tab fullscreen" mode.</li> |
| 68 </ul> |
| 69 </li> |
| 70 </ul> |
| 71 <p>Clicking the mouse inside the grey square takes the NaCl module to/from |
| 72 combined fullscreen and mouselock mode.</p> |
| 73 <p>While in fullscreen, pressing Enter will exit/enter mouse lock mode.</p> |
| 74 <!-- Load the published .nexe. This includes the 'src' attribute which |
| 75 shows how to load multi-architecture modules. Each entry in the "nexes" |
| 76 object in the .nmf manifest file is a key-value pair: the key is the runtime |
| 77 ('x86-32', 'x86-64', etc.); the value is a URL for the desired NaCl module. |
| 78 To load the debug versions of your .nexes, set the 'src' attribute to the |
| 79 _dbg.nmf version of the manifest file. |
| 80 |
| 81 Note: The <EMBED> element is wrapped inside a <DIV>, which has both a 'load' |
| 82 and a 'message' event listener attached. This wrapping method is used |
| 83 instead of attaching the event listeners directly to the <EMBED> element to |
| 84 ensure that the listeners are active before the NaCl module 'load' event |
| 85 fires. This also allows you to use PPB_Messaging.PostMessage() (in C) or |
| 86 pp::Instance.PostMessage() (in C++) from within the initialization code in |
| 87 your NaCl module. |
| 88 --> |
| 89 <div id="listener"> |
| 90 <script type="text/javascript"> |
| 91 if (browserSupportStatus == |
| 92 browser_version.BrowserChecker.StatusValues.CHROME_VERSION_TOO_OLD) { |
| 93 alert('This example will only work on Chrome version ' + |
| 94 CHROME_MINIMUM_VERSION + |
| 95 ' or later.'); |
| 96 } else { |
| 97 var listener = document.getElementById('listener') |
| 98 listener.addEventListener('message', handleMessage, true); |
| 99 // Create two instances of the NaCl module. |
| 100 listener.innerHTML = '<embed id="mouselock_view" ' + |
| 101 'type="application/x-nacl" ' + |
| 102 'src="mouselock.nmf" ' + |
| 103 'width="300" height="300" />'; |
| 104 } |
| 105 </script> |
| 106 </div> |
| 107 </body> |
| 108 </html> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 8510041:
Add a mouselock example. (Closed)
Base URL: http://nativeclient-sdk.googlecode.com/svn/trunk/src/