| OLD | NEW |
| 1 .. _tutorial2: | 1 .. _tutorial2: |
| 2 | 2 |
| 3 ###################################### | 3 ###################################### |
| 4 C++ Tutorial: Getting Started (Part 2) | 4 C++ Tutorial: Getting Started (Part 2) |
| 5 ###################################### | 5 ###################################### |
| 6 | 6 |
| 7 .. contents:: | 7 .. contents:: |
| 8 :local: | 8 :local: |
| 9 :backlinks: none | 9 :backlinks: none |
| 10 :depth: 2 | 10 :depth: 2 |
| 11 | 11 |
| 12 Overview | 12 Overview |
| 13 ======== | 13 ======== |
| 14 | 14 |
| 15 This tutorial shows how to convert the finished PNaCl web application from | 15 This tutorial shows how to convert the finished PNaCl web application from |
| 16 :doc:`Part 1 <tutorial-part1>` to use the Native Client SDK build system and | 16 :doc:`Part 1 <tutorial-part1>` to use the Native Client SDK build system and |
| 17 common JavaScript files. It also demonstrates some techniques to make your | 17 common JavaScript files. It also demonstrates some techniques to make your web |
| 18 web application `Content Security Policy (CSP)-compliant | 18 application `Content Security Policy (CSP)-compliant |
| 19 <http://developer.chrome.com/apps/contentSecurityPolicy.html>`, which is | 19 </apps/contentSecurityPolicy>`_, which is necessary for `Chrome Apps |
| 20 necessary for `Chrome Apps | 20 </apps/about_apps>`_. |
| 21 <https://developer.chrome.com/apps/about_apps.html>`_. | |
| 22 | 21 |
| 23 Using the Native Client SDK build system makes it easy to build with all of the | 22 Using the Native Client SDK build system makes it easy to build with all of the |
| 24 SDK toolchains, and switch between the Debug and Release configurations. It | 23 SDK toolchains, and switch between the Debug and Release configurations. It |
| 25 also simplifies the makefiles for your project, as we'll see in the next | 24 also simplifies the makefiles for your project, as we'll see in the next |
| 26 section. Finally, it adds some useful commands for :ref:`running | 25 section. Finally, it adds some useful commands for :ref:`running |
| 27 <running_the_sdk_examples>` and :ref:`debugging <debugging_the_sdk_examples>` | 26 <running_the_sdk_examples>` and :ref:`debugging <debugging_the_sdk_examples>` |
| 28 your application. | 27 your application. |
| 29 | 28 |
| 30 The finished code for this example can be found in the | 29 The finished code for this example can be found in the |
| 31 ``pepper_$(VERSION)/getting_started/part2`` directory in the Native Client SDK | 30 ``pepper_$(VERSION)/getting_started/part2`` directory in the Native Client SDK |
| (...skipping 112 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 144 the target ``part2``, which will generate an executable called | 143 the target ``part2``, which will generate an executable called |
| 145 ``part2.pexe`` for PNaCl. For NaCl toolchains, the executable's file name | 144 ``part2.pexe`` for PNaCl. For NaCl toolchains, the executable's file name |
| 146 will be given a suffix for its architecture. For example, the ARM executable | 145 will be given a suffix for its architecture. For example, the ARM executable |
| 147 is called ``part2_arm.nexe``. | 146 is called ``part2_arm.nexe``. |
| 148 | 147 |
| 149 LIBS | 148 LIBS |
| 150 A list of libraries that this executable needs to link against. The library | 149 A list of libraries that this executable needs to link against. The library |
| 151 search path is already set up to only look in the directory for the current | 150 search path is already set up to only look in the directory for the current |
| 152 toolchain and architecture. In this example, we link against ``ppapi_cpp`` | 151 toolchain and architecture. In this example, we link against ``ppapi_cpp`` |
| 153 and ``ppapi``. ``ppapi_cpp`` is needed to use the `Pepper C++ interface | 152 and ``ppapi``. ``ppapi_cpp`` is needed to use the `Pepper C++ interface |
| 154 <https://developers.google.com/native-client/peppercpp/>`_. ``ppapi`` is | 153 </native-client/pepper_stable/cpp/>`_. ``ppapi`` is needed for communicating |
| 155 needed for communicating with the browser. | 154 with the browser. |
| 156 | 155 |
| 157 CFLAGS | 156 CFLAGS |
| 158 A list of extra flags to pass to the compiler. In this example, we pass | 157 A list of extra flags to pass to the compiler. In this example, we pass |
| 159 ``-Wall``, which turns on all warnings. | 158 ``-Wall``, which turns on all warnings. |
| 160 | 159 |
| 161 LDFLAGS | 160 LDFLAGS |
| 162 A list of additional flags to pass to the linker. This example does not need | 161 A list of additional flags to pass to the linker. This example does not need |
| 163 any special linker flags, so this variable is omitted. | 162 any special linker flags, so this variable is omitted. |
| 164 | 163 |
| 165 SOURCES | 164 SOURCES |
| (...skipping 58 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 224 Finally, the NMF rule generates a NaCl manifest file (``.nmf``) that references | 223 Finally, the NMF rule generates a NaCl manifest file (``.nmf``) that references |
| 225 each executable generated in the previous step: | 224 each executable generated in the previous step: |
| 226 | 225 |
| 227 .. naclcode:: | 226 .. naclcode:: |
| 228 | 227 |
| 229 $(eval $(call NMF_RULE,$(TARGET),)) | 228 $(eval $(call NMF_RULE,$(TARGET),)) |
| 230 | 229 |
| 231 Making index.html work for Chrome Apps | 230 Making index.html work for Chrome Apps |
| 232 ====================================== | 231 ====================================== |
| 233 | 232 |
| 234 This section describes the changes necessary to make the HTML and JavaScript | 233 This section describes the changes necessary to make the HTML and JavaScript in |
| 235 in part1 CSP-compliant. This is required if you want to build a `Chrome App | 234 part1 CSP-compliant. This is required if you want to build a `Chrome App |
| 236 <https://developer.chrome.com/apps/about_apps.html>`_, but is not necessary | 235 </apps/about_apps>`_, but is not necessary if you want to use PNaCl on the open |
| 237 if you want to use PNaCl on the open web. | 236 web. |
| 238 | 237 |
| 239 CSP rules | 238 CSP rules |
| 240 --------- | 239 --------- |
| 241 | 240 |
| 242 `Chrome Apps CSP | 241 `Chrome Apps CSP </apps/contentSecurityPolicy#what>`_ restricts you from doing |
| 243 <http://developer.chrome.com/apps/contentSecurityPolicy.html#what>`_ | 242 the following: |
| 244 restricts you from doing the following: | |
| 245 | 243 |
| 246 * You can’t use inline scripting in your Chrome App pages. The restriction | 244 * You can’t use inline scripting in your Chrome App pages. The restriction |
| 247 bans both ``<script>`` blocks and event handlers (``<button onclick="...">``). | 245 bans both ``<script>`` blocks and event handlers (``<button onclick="...">``). |
| 248 * You can’t reference any external resources in any of your app files (except | 246 * You can’t reference any external resources in any of your app files (except |
| 249 for video and audio resources). You can’t embed external resources in an | 247 for video and audio resources). You can’t embed external resources in an |
| 250 iframe. | 248 iframe. |
| 251 * You can’t use string-to-JavaScript methods like ``eval()`` and ``new | 249 * You can’t use string-to-JavaScript methods like ``eval()`` and ``new |
| 252 Function()``. | 250 Function()``. |
| 253 | 251 |
| 254 Making index.html CSP-compliant | 252 Making index.html CSP-compliant |
| (...skipping 236 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 491 // postMessage sends a message to it. | 489 // postMessage sends a message to it. |
| 492 common.naclModule.postMessage('hello'); | 490 common.naclModule.postMessage('hello'); |
| 493 } | 491 } |
| 494 | 492 |
| 495 // This function is called by common.js when a message is received from the | 493 // This function is called by common.js when a message is received from the |
| 496 // NaCl module. | 494 // NaCl module. |
| 497 function handleMessage(message) { | 495 function handleMessage(message) { |
| 498 var logEl = document.getElementById('log'); | 496 var logEl = document.getElementById('log'); |
| 499 logEl.textContent += message.data; | 497 logEl.textContent += message.data; |
| 500 } | 498 } |
| OLD | NEW |