OLD | NEW |
(Empty) | |
| 1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. |
| 2 // Use of this source code is governed by a BSD-style license that can be |
| 3 // found in the LICENSE file. |
| 4 |
| 5 // Javascript module pattern: |
| 6 // see http://en.wikipedia.org/wiki/Unobtrusive_JavaScript#Namespaces |
| 7 // In essence, we define an anonymous function which is immediately called and |
| 8 // returns a new object. The new object contains only the exported definitions; |
| 9 // all other definitions in the anonymous function are inaccessible to external |
| 10 // code. |
| 11 var common = (function () { |
| 12 |
| 13 /** |
| 14 * Create the Native Client <embed> element as a child of the DOM element |
| 15 * named "listener". |
| 16 * |
| 17 * @param {string} name The name of the example. |
| 18 * @param {string} tool The name of the toolchain, e.g. "glibc", "newlib" etc. |
| 19 * @param {number} width The width to create the plugin. |
| 20 * @param {number} height The height to create the plugin. |
| 21 */ |
| 22 function createNaClModule(name, tool, width, height) { |
| 23 var moduleEl = document.createElement('embed'); |
| 24 moduleEl.setAttribute('name', 'nacl_module'); |
| 25 moduleEl.setAttribute('id', 'nacl_module'); |
| 26 moduleEl.setAttribute('width', width); |
| 27 moduleEl.setAttribute('height',height); |
| 28 moduleEl.setAttribute('src', name + '_' + tool + '.nmf'); |
| 29 moduleEl.setAttribute('type', 'application/x-nacl'); |
| 30 |
| 31 // The <EMBED> element is wrapped inside a <DIV>, which has both a 'load' |
| 32 // and a 'message' event listener attached. This wrapping method is used |
| 33 // instead of attaching the event listeners directly to the <EMBED> element |
| 34 // to ensure that the listeners are active before the NaCl module 'load' |
| 35 // event fires. |
| 36 var listenerDiv = document.getElementById('listener'); |
| 37 listenerDiv.appendChild(moduleEl); |
| 38 } |
| 39 |
| 40 /** Add the default "load" and "message" event listeners to the element with |
| 41 * id "listener". |
| 42 * |
| 43 * The "load" event is sent when the module is successfully loaded. The |
| 44 * "message" event is sent when the naclModule posts a message using |
| 45 * PPB_Messaging.PostMessage() (in C) or pp::Instance().PostMessage() (in |
| 46 * C++). |
| 47 */ |
| 48 function attachDefaultListeners() { |
| 49 var listenerDiv = document.getElementById('listener'); |
| 50 listenerDiv.addEventListener('load', moduleDidLoad, true); |
| 51 listenerDiv.addEventListener('message', handleMessage, true); |
| 52 } |
| 53 |
| 54 /** |
| 55 * Called when the NaCl module is loaded. |
| 56 * |
| 57 * This event listener is registered in createNaClModule above. |
| 58 */ |
| 59 function moduleDidLoad() { |
| 60 common.naclModule = document.getElementById('nacl_module'); |
| 61 updateStatus('SUCCESS'); |
| 62 |
| 63 if (typeof window.moduleDidLoad !== 'undefined') { |
| 64 window.moduleDidLoad(); |
| 65 } |
| 66 } |
| 67 |
| 68 /** |
| 69 * Hide the NaCl module's embed element. |
| 70 * |
| 71 * We don't want to hide by default; if we do, it is harder to determine that |
| 72 * a plugin failed to load. Instead, call this function inside the example's |
| 73 * "moduleDidLoad" function. |
| 74 * |
| 75 */ |
| 76 function hideModule() { |
| 77 // Setting common.naclModule.style.display = "None" doesn't work; the |
| 78 // module will no longer be able to receive postMessages. |
| 79 common.naclModule.style.height = "0"; |
| 80 } |
| 81 |
| 82 /** |
| 83 * Return true when |s| starts with the string |prefix|. |
| 84 * |
| 85 * @param {string} s The string to search. |
| 86 * @param {string} prefix The prefix to search for in |s|. |
| 87 */ |
| 88 function startsWith(s, prefix) { |
| 89 // indexOf would search the entire string, lastIndexOf(p, 0) only checks at |
| 90 // the first index. See: http://stackoverflow.com/a/4579228 |
| 91 return s.lastIndexOf(prefix, 0) === 0; |
| 92 } |
| 93 |
| 94 /** |
| 95 * Add a message to an element with id "log", separated by a <br> element. |
| 96 * |
| 97 * This function is used by the default "log:" message handler. |
| 98 * |
| 99 * @param {string} message The message to log. |
| 100 */ |
| 101 function logMessage(message) { |
| 102 var logEl = document.getElementById('log'); |
| 103 logEl.innerHTML += message + '<br>'; |
| 104 console.log(message) |
| 105 } |
| 106 |
| 107 /** |
| 108 */ |
| 109 var defaultMessageTypes = { |
| 110 'alert': alert, |
| 111 'log': logMessage |
| 112 }; |
| 113 |
| 114 /** |
| 115 * Called when the NaCl module sends a message to JavaScript (via |
| 116 * PPB_Messaging.PostMessage()) |
| 117 * |
| 118 * This event listener is registered in createNaClModule above. |
| 119 * |
| 120 * @param {Event} message_event A message event. message_event.data contains |
| 121 * the data sent from the NaCl module. |
| 122 */ |
| 123 function handleMessage(message_event) { |
| 124 if (typeof message_event.data === 'string') { |
| 125 for (var type in defaultMessageTypes) { |
| 126 if (defaultMessageTypes.hasOwnProperty(type)) { |
| 127 if (startsWith(message_event.data, type + ':')) { |
| 128 func = defaultMessageTypes[type]; |
| 129 func(message_event.data.slice(type.length + 1)); |
| 130 } |
| 131 } |
| 132 } |
| 133 } |
| 134 |
| 135 if (typeof window.handleMessage !== 'undefined') { |
| 136 window.handleMessage(message_event); |
| 137 } |
| 138 } |
| 139 |
| 140 /** |
| 141 * Common entrypoint for NaCl module loading. This function should be hooked |
| 142 * up to the document body's onload event, for example: |
| 143 * |
| 144 * <body onload="common.onload(...)"> |
| 145 * |
| 146 * @param {string} name The name of the example. |
| 147 * @param {string} tool The name of the toolchain, e.g. "glibc", "newlib" etc. |
| 148 * @param {number} width The width to create the plugin. |
| 149 * @param {number} height The height to create the plugin. |
| 150 */ |
| 151 function pageDidLoad(name, tool, width, height) { |
| 152 // If the page loads before the Native Client module loads, then set the |
| 153 // status message indicating that the module is still loading. Otherwise, |
| 154 // do not change the status message. |
| 155 updateStatus('Page loaded.'); |
| 156 if (common.naclModule == null) { |
| 157 updateStatus('Creating embed: ' + tool) |
| 158 |
| 159 // We use a non-zero sized embed to give Chrome space to place the bad |
| 160 // plug-in graphic, if there is a problem. |
| 161 width = typeof width !== 'undefined' ? width : 200; |
| 162 height = typeof height !== 'undefined' ? height : 200; |
| 163 createNaClModule(name, tool, width, height); |
| 164 attachDefaultListeners(); |
| 165 } else { |
| 166 // It's possible that the Native Client module onload event fired |
| 167 // before the page's onload event. In this case, the status message |
| 168 // will reflect 'SUCCESS', but won't be displayed. This call will |
| 169 // display the current message. |
| 170 updateStatus('Waiting.'); |
| 171 } |
| 172 } |
| 173 |
| 174 /** Saved text to display in the element with id 'statusField'. */ |
| 175 var statusText = 'NO-STATUSES'; |
| 176 |
| 177 /** |
| 178 * Set the global status message. If the element with id 'statusField' |
| 179 * exists, then set its HTML to the status message as well. |
| 180 * |
| 181 * @param {string} opt_message The message to set. If null or undefined, then |
| 182 * set element 'statusField' to the message from the last call to |
| 183 * updateStatus. |
| 184 */ |
| 185 function updateStatus(opt_message) { |
| 186 if (opt_message) { |
| 187 statusText = opt_message; |
| 188 } |
| 189 var statusField = document.getElementById('statusField'); |
| 190 if (statusField) { |
| 191 statusField.innerHTML = statusText; |
| 192 } |
| 193 } |
| 194 |
| 195 // The symbols to export. |
| 196 return { |
| 197 /** A reference to the NaCl module, once it is loaded. */ |
| 198 naclModule: null, |
| 199 |
| 200 onload: pageDidLoad, |
| 201 attachDefaultListeners: attachDefaultListeners, |
| 202 createNaClModule: createNaClModule, |
| 203 hideModule: hideModule, |
| 204 updateStatus: updateStatus |
| 205 }; |
| 206 |
| 207 }()); |
OLD | NEW |