/dxweb/priv/www/index.html

http://github.com/hyperthunk/nodewatch · HTML · 179 lines · 161 code · 9 blank · 9 comment · 0 complexity · d3cdf4c1eb488cd40476d06a42155b41 MD5 · raw file

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  5. <title>jQuery UI Example Page</title>
  6. <!--
  7. <link type="text/css" href="/static/css/dark-hive/jquery-ui-1.8.11.custom.css" rel="stylesheet" />
  8. <link type="text/css" href="/static/css/ui.jqgrid.css" media="screen" rel="stylesheet" />
  9. <link type="text/css" href="/static/css/base.css" media="screen" rel="stylesheet" />
  10. <link type="text/css" href="/static/css/jquery.notice.css" media="screen" rel="Stylesheet"/>
  11. <link type="text/css" href="/static/css/jquery.hintbox.css" media="screen" rel="Stylesheet"/>
  12. <link type="text/css" href="/static/css/jquery.validator.css" media="screen" rel="Stylesheet"/>
  13. <link type="text/css" href="/static/css/uniform.default.css" media="screen" rel="stylesheet" charset="utf-8" />
  14. -->
  15. <script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
  16. <script type="text/javascript" src="js/jquery-ui-1.8.11.custom.min.js"></script>
  17. <script type="text/javascript" src="js/grid.locale-en.js"></script>
  18. <script type="text/javascript" src="js/jquery.jqGrid.min.js"></script>
  19. <script type="text/javascript" src="js/jquery.collapsible.js"></script>
  20. <script type="text/javascript" src="js/jquery.hintbox.js"></script>
  21. <script type="text/javascript" src="js/jquery.notice.js"></script>
  22. <script type="text/javascript" src="js/jquery.validator.js"></script>
  23. <script type="text/javascript" src="js/jquery.cookie.js"></script>
  24. <script type="text/javascript" src="js/jquery.uniform.min.js"></script>
  25. <script type="text/javascript" src="js/underscore.js"></script>
  26. <script type="text/javascript" src="js/underscore.string.min.js"></script>
  27. <script type="text/javascript" src="js/pure_min.js"></script>
  28. <script type="text/javascript" src="js/backbone-min.js"></script>
  29. <script type="text/javascript" src="js/raphael-min.js"></script>
  30. <script type="text/javascript" src="js/elycharts.min.js"></script>
  31. <script type="text/javascript" src="js/nodewatch.helpers.js"></script>
  32. <script type="text/javascript" src="js/nodewatch.models.js"></script>
  33. <script type="text/javascript" src="js/nodewatch.views.js"></script>
  34. <script type="text/javascript" src="js/nodewatch.controllers.js"></script>
  35. <style>
  36. .example_div {
  37. border:1px solid #C0C0C0;
  38. padding:0.5em;
  39. margin:10px 0 0 0;
  40. font-family:arial;
  41. font-size:13px;
  42. }
  43. .chart_div {
  44. border:1px solid #C0C0C0;
  45. float:left;
  46. margin:10px 0 0 0;
  47. width:290px;
  48. font-family:arial;
  49. font-size:13px;
  50. }
  51. .chart_code, .chart_code_api {
  52. padding:0.5em;
  53. }
  54. .chart_template, .chart_buttons {
  55. border-top: 1px solid #C0C0C0;
  56. padding:0.5em;
  57. }
  58. .chart_redraw {}
  59. .chart_canvas {
  60. width: 290px; height: 290px;
  61. margin-right: 2em;
  62. float: left;
  63. }
  64. .chart_spacer {
  65. clear: both;
  66. }
  67. .tab {
  68. margin-left:1em;
  69. }
  70. .structKey {
  71. font-weight: bold;
  72. }
  73. .structKey a {
  74. border-bottom:1px dotted red;
  75. color:black;
  76. cursor:help;
  77. text-decoration:none;
  78. }
  79. .highlight_line {
  80. background-color: yellow;
  81. }
  82. </style>
  83. <script type="text/javascript">
  84. $(function(){
  85. $.elycharts.templates['line_basic_6'] = {
  86. type : "line",
  87. margins : [10, 40, 40, 30],
  88. defaultSeries : {
  89. highlight : {
  90. newProps : {
  91. r : 8,
  92. opacity : 1
  93. },
  94. overlayProps : {
  95. fill : "white",
  96. opacity : 0.2
  97. }
  98. }
  99. },
  100. series : {
  101. serie1 : {
  102. color : "90-#003000-#009000",
  103. tooltip : {
  104. frameProps : {
  105. stroke : "green"
  106. }
  107. }
  108. },
  109. serie2 : {
  110. color : "90-#000060-#0000B0",
  111. tooltip : {
  112. frameProps : {
  113. stroke : "blue"
  114. }
  115. }
  116. },
  117. },
  118. defaultAxis : {
  119. labels : true
  120. },
  121. axis : {
  122. x : {
  123. labelsRotate : 45,
  124. labelsProps : {
  125. font : "12px Verdana"
  126. }
  127. }
  128. },
  129. features : {
  130. grid : {
  131. draw : true,
  132. forceBorder : true,
  133. ny : 5
  134. }
  135. },
  136. barMargins : 10
  137. };
  138. $("#chart-sample").chart({
  139. template : "line_basic_6",
  140. tooltips : {
  141. serie1 : ["a", "b", "c", "d"],
  142. serie2 : ["a", "b", "c", "d"]
  143. },
  144. values : {
  145. serie1 : [84, 32, 10, 10],
  146. serie2 : [39, 51, 98, 88]
  147. },
  148. labels : ["first", "second", "third", "fourth"],
  149. defaultSeries : {
  150. type : "bar",
  151. stacked : true
  152. },
  153. axis : {
  154. r : {
  155. max : 100,
  156. suffix : "%"
  157. }
  158. }
  159. });
  160. });
  161. </script>
  162. </head>
  163. <body>
  164. <div id="content-main">
  165. <h2>Nodewatch</h2>
  166. <div id='chart-sample' class='chart_canvas'>
  167. </div>
  168. </div>
  169. </body>
  170. </html>