/src/visualiser/index.html

http://github.com/hhughes/ocaml-frui · HTML · 96 lines · 96 code · 0 blank · 0 comment · 0 complexity · 2796c222d5e4a880d2c86d107a7f8f44 MD5 · raw file

  1. <html>
  2. <head>
  3. <style type='text/css'>
  4. div#top {
  5. position: absolute;
  6. top: 0;
  7. height: 25px;
  8. left: 0;
  9. right: 0;
  10. }
  11. div#main {
  12. position: absolute;
  13. left: 10px;
  14. right: 10px;
  15. bottom: 10px;
  16. top: 35px;
  17. border: 1px solid black;
  18. }
  19. div.msg {
  20. position: absolute;
  21. display: inline-block;
  22. height: 20px;
  23. width: 2px;
  24. background-color: black;
  25. }
  26. div.thread {
  27. position: absolute;
  28. height: 20px;
  29. width: 200px;
  30. border: 1px solid black;
  31. }
  32. div.fn {
  33. position: absolute;
  34. height: 20px;
  35. border-left: 1px solid black;
  36. border-right: 1px solid black;
  37. background-color: lightgrey;
  38. }
  39. div#msg_count {
  40. position: absolute;
  41. right: 5px;
  42. bottom: 5px;
  43. }
  44. div#visualiser {
  45. position: absolute;
  46. left: 0px;
  47. top: 0px;
  48. right: 200px;
  49. height: 400px;
  50. overflow-y: scroll;
  51. }
  52. div#widgets {
  53. position: absolute;
  54. top: 0px;
  55. right: 0px;
  56. height: 400px;
  57. }
  58. div#pie {
  59. position: absolute;
  60. top: 0px;
  61. right: 0px;
  62. width: 200px;
  63. height: 200px;
  64. }
  65. div#cloud {
  66. position: absolute;
  67. right: 0px;
  68. top: 200px;
  69. width: 200px;
  70. height: 200px;
  71. }
  72. div#timeline {
  73. position: absolute;
  74. left: 0px;
  75. top: 400px;
  76. }
  77. </style>
  78. </head>
  79. <body>
  80. <div id='top'>
  81. Enter url of json file: <input type='text' id='json_url' value='http://localhost:8080/events' /><button id='visualise' type='button'>Visualise</button><button id='next_msg' type='button'>Add</button><button id='start' type='button'>Start</button><button id='msg' type='button'>Msg</button><button id='test1a' type='button'>Test1a</button><button id='test1b' type='button'>Test1b</button><button id='test2' type='button'>Test2</button><button id='test1000' type='button'>Test1000</button><button id='test10000' type='button'>Test10000</button>
  82. </div>
  83. <div id='main'>
  84. <div id='visualiser'>
  85. <div id='msg_count'></div>
  86. </div>
  87. <div id='widgets'>
  88. <div id='pie'></div>
  89. <div id='cloud'></div>
  90. </div>
  91. <div id='timeline'></div>
  92. </div>
  93. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
  94. <script src="./main.js"></script>
  95. </body>
  96. </html>