| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html> | 2 <html> |
| 3 <!-- | 3 <!-- |
| 4 Copyright (c) 2012 The Chromium Authors. All rights reserved. | 4 Copyright (c) 2012 The Chromium Authors. All rights reserved. |
| 5 Use of this source code is governed by a BSD-style license that can be | 5 Use of this source code is governed by a BSD-style license that can be |
| 6 found in the LICENSE file. | 6 found in the LICENSE file. |
| 7 --> | 7 --> |
| 8 <head> | 8 <head> |
| 9 <title>Mouse Lock Example</title> | 9 <title>Mouse Lock Example</title> |
| 10 <style type="text/css"> | 10 <style type="text/css"> |
| 11 :-webkit-full-screen { | 11 :-webkit-full-screen { |
| 12 width: 100%; | 12 width: 100%; |
| 13 height: 100%; | 13 height: 100%; |
| 14 } | 14 } |
| 15 </style> | 15 </style> |
| 16 </head> | 16 </head> |
| 17 <body title="This tooltip should not be shown if the mouse is locked."> | 17 <body title="This tooltip should not be shown if the mouse is locked."> |
| 18 <div id="container"> | 18 <div id="container"> |
| 19 <ul> | 19 <ul> |
| 20 <li>There are two different kinds of fullscreen mode - "tab fullscreen" and | |
| 21 "browser fullscreen". | |
| 22 <ul> | |
| 23 <li>"tab fullscreen" refers to when a tab enters fullscreen mode via the | |
| 24 JS or Pepper fullscreen API;</li> | |
| 25 <li>"browser fullscreen" refers to the user putting the browser itself | |
| 26 into fullscreen mode from the UI (e.g., pressing F11).</li> | |
| 27 </ul> | |
| 28 <span style="font-weight:bold"> | |
| 29 NOTE: Mouse lock is only allowed in "tab fullscreen" mode. | |
| 30 </span> | |
| 31 </li> | |
| 32 <li>Lock mouse: | 20 <li>Lock mouse: |
| 33 <ul> | 21 <ul> |
| 34 <li>left click in either of the two boxes; or</li> | 22 <li>left click in either of the two boxes; or</li> |
| 35 <li>right click in either of the boxes to ensure that it is focused and | 23 <li>right click in either of the boxes to ensure that it is focused and |
| 36 then press Enter key. (You could verify that the tooltip window is | 24 then press Enter key. (You could verify that the tooltip window is |
| 37 dismissed properly by this second approach.)</li> | 25 dismissed properly by this second approach.)</li> |
| 38 </ul> | 26 </ul> |
| 39 </li> | 27 </li> |
| 40 <li>Unlock mouse voluntarily: | 28 <li>Unlock mouse voluntarily: |
| 41 <ul> | 29 <ul> |
| 42 <li>press Enter.</li> | 30 <li>press Enter.</li> |
| 43 </ul> | 31 </ul> |
| 44 </li> | 32 </li> |
| 45 <li>Unlock mouse involuntarily: | 33 <li>Unlock mouse involuntarily: |
| 46 <ul> | 34 <ul> |
| 47 <li>lose focus; or</li> | 35 <li>lose focus; or</li> |
| 48 <li>press Esc key; or</li> | 36 <li>press Esc key; or</li> |
| 49 <li>exit from the "tab fullscreen" mode.</li> | 37 <li>exit from "tab fullscreen"/"browser fullscreen"/"Flash fullscreen". |
| 38 <ul> |
| 39 <li>"tab fullscreen" refers to when a tab enters fullscreen mode via |
| 40 the JS or Pepper fullscreen API;</li> |
| 41 <li>"browser fullscreen" refers to the user putting the browser |
| 42 itself into fullscreen mode from the UI (e.g., pressing F11). |
| 43 </li> |
| 44 <li>"Flash fullscreen" refers to the fullscreen mode used by Pepper |
| 45 Flash. You could enter Flash fullscreen by pressing 'f' key |
| 46 when either of the boxes is focused, and exit by pressing Esc |
| 47 key.</li> |
| 48 </ul> |
| 49 </li> |
| 50 </ul> | 50 </ul> |
| 51 </li> | 51 </li> |
| 52 </ul> | 52 </ul> |
| 53 <div> | 53 <div> |
| 54 <button onclick="ToggleFullscreen();"> | 54 <button onclick="ToggleFullscreen();"> |
| 55 Toggle Tab Fullscreen | 55 Toggle Tab Fullscreen |
| 56 </button> | 56 </button> |
| 57 <button onclick="AddAPlugin();"> | 57 <button onclick="AddAPlugin();"> |
| 58 Add A Plugin | 58 Add A Plugin |
| 59 </button> | 59 </button> |
| (...skipping 26 matching lines...) Expand all Loading... |
| 86 function RemoveAPlugin() { | 86 function RemoveAPlugin() { |
| 87 if (plugins_container.firstElementChild) | 87 if (plugins_container.firstElementChild) |
| 88 plugins_container.removeChild(plugins_container.firstElementChild); | 88 plugins_container.removeChild(plugins_container.firstElementChild); |
| 89 } | 89 } |
| 90 document.body.onkeydown = function (e) { | 90 document.body.onkeydown = function (e) { |
| 91 if (String.fromCharCode(e.keyCode) == "X") | 91 if (String.fromCharCode(e.keyCode) == "X") |
| 92 RemoveAPlugin(); | 92 RemoveAPlugin(); |
| 93 } | 93 } |
| 94 </script> | 94 </script> |
| 95 </html> | 95 </html> |
| OLD | NEW |