mgcanvas/index.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <meta http-equiv="X-UA-Compatible" content="IE=9">
   5 <meta charset="UTF-8">
   6 <title>Mind Graph Canvas</title>
   7 <style type="text/css">
   8         h1, h2, h3 {
   9                 margin:0px;
  10         }
  11         body, textarea {
  12                 font-family: Consolas, 'Courier New', Courier, Monaco, monospace;
  13                 font-size: 14px;
  14                 line-height: 1.2;
  15         }
  16 </style>
  17 <script type="text/javascript" src="./header.js" charset="UTF-8"></script>
  18 <script type="text/javascript">
  19
  20 var mgmain;
  21 var memdb;
  22
  23 onload = function() {
  24         memdb = new MemoryDB("./../memdb/memdb.php");
  25         memdb.syncDB();
  26
  27         var c = document.getElementById("mainCanvas");
  28         mgmain = new MGCanvas(c);
  29         mgmain.loadGraphFromMemoryDB(memdb);
  30 }
  31 </script>
  32 </head>
  33 <body>
  34 <h1>Mind Graph Canvas</h1>
  35 <canvas id="mainCanvas" width="1024" height="768" style="border:1px solid #000000;"></canvas>
  36 <br />
  37 <button onclick="mgmain.bringToCenter();">Center</button>
  38 <button onclick="mgmain.isPaused = !mgmain.isPaused;">Freeze</button>
  39 <button onclick="mgmain.zoomIn();">+</button>
  40 <button onclick="mgmain.zoomOut();">-</button>
  41 <button onclick="mgmain.moveViewRelative(0, -10);">↑</button>
  42 <button onclick="mgmain.moveViewRelative(0, 10);">↓</button>
  43 <button onclick="mgmain.moveViewRelative(-10, 0);">←</button>
  44 <button onclick="mgmain.moveViewRelative(10, 0);">→</button>
  45 <br />
  46 identifier:<input id="identBox" type="text"></input>
  47 <br />
  48 <button onclick="mgmain.setIdentifierForSelectedNode(getElementById('identBox').value);">setNodeIdent</button>
  49 <button onclick="memdb.addNode(getElementById('identBox').value);">addNode</button>
  50
  51 </body>
  52 </html>