pd/index.html

   1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
   2 <html>
   3     <head>
   4         <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
   5         <title>Drop View</title>
   6         <script>
   7             if (typeof window.appwidget != 'undefined') {
   8                 listenBoxMessage();
   9             } else {
  10                 window.addEventListener("appwidgetready", onAppWidgetReady, false);
  11                 console.log("appwidgetready event is registered");
  12             }
  13
  14             function onAppWidgetReady() {
  15                 console.log("appwidgetready event is fired");
  16                 listenBoxMessage();
  17             }
  18
  19             function listenBoxMessage() {
  20                 window.addEventListener("boxmessage",
  21                 function(e) {
  22                     document.getElementById("fromBox").innerHTML += unescape(e) + '<br>';
  23                 }, false);
  24             }
  25
  26             function send () {
  27                 window.appwidget.sendMessageToBox("Hello, Dynamic Box");
  28             }
  29         </script>
  30         <style>
  31             * {
  32                 -webkit-user-select: none;
  33                 -user-select: none;
  34             }
  35         </style>
  36     </head>
  37     <body bgcolor="#FF9966" text="#FFFFFF">
  38         This is a Drop View.<br>A Drop View can control the Box.<br>
  39         <input type="button" value="Send message to Box" onclick="send()" />
  40         <div id="fromBox"></div>
  41     </body>
  42 </html>