<!DOCTYPE html>
<html>
  <!--
  Copyright 2013 Google Inc.

  Use of this source code is governed by a BSD-style license that can be
  found in the LICENSE file.
  -->
<head>

  <title>Skia Hello World</title>

  <script type="text/javascript">
    "use strict";

    var SkiaModule = null;  // Global application object.

    // Force a re-draw of the given element.
    function refresh(elem) {
      var old_display_style = elem.style.display;
      elem.style.display = "none";
      elem.style.display = old_display_style;
    }

    // When the module loads, begin running the application.
    function moduleDidLoad() {
      SkiaModule = document.getElementById("skia_nacl");
      run();
    }

    function handleMessage(message_event) {
      var skdebugf_cmd = "SkDebugf:";
      if (message_event.data.indexOf(skdebugf_cmd) == 0) {
        var msg_contents = message_event.data.slice(skdebugf_cmd.length)
        console.log("Skia: " + msg_contents);
      } else {
        alert(message_event.data);
      }
    }

    // Run the application.
    function run() {
      if (SkiaModule) {
        var cmd = "init";
        SkiaModule.postMessage(cmd);
      } else {
        alert("The Skia module has not properly loaded...");
      }
    }
  </script>
</head>
<body>

<h1>Skia Hello World</h1>
<p>
  <div id="listener">
    <script type="text/javascript">
      var listener = document.getElementById('listener');
      listener.addEventListener('load', moduleDidLoad, true);
      listener.addEventListener('message', handleMessage, true);
    </script>

    <embed name="nacl_module"
       id="skia_nacl"
       width=300 height=300
       src="skhello.nmf"
       type="application/x-nacl" />
  </div>
</p>
</body>
</html>