Default.aspx 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128
  1. <%@ Page Language="C#" %>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml" >
  4. <head id="Head1" runat="server">
  5. <style type="text/css">
  6. button {border: solid 1px black}
  7. #HoverLabel {color: blue}
  8. </style>
  9. <title>Application Demo</title>
  10. </head>
  11. <body style="background-color:Aqua; font-size:medium">
  12. <form id="form1" runat="server">
  13. <asp:ScriptManager runat="server" ID="ScriptManager01">
  14. <scripts>
  15. <asp:ScriptReference Path="HoverButton.js" />
  16. <asp:ScriptReference Path="HighVis.js" />
  17. </scripts>
  18. </asp:ScriptManager>
  19. <p><strong>Sys.Application Sample</strong></p>
  20. <script type="text/javascript">
  21. // Attach a handler to the init event.
  22. Sys.Application.add_init(applicationInitHandler);
  23. function applicationInitHandler() {
  24. // Add two custom controls to the application.
  25. $create(Demo.HoverButton, {text: 'A HoverButton Control'},
  26. {click: start, hover: doSomethingOnHover,
  27. unhover: doSomethingOnUnHover},
  28. null, $get('Button1'));
  29. $create(Demo.HighVis, null, null, null, $get('Button2'));
  30. }
  31. // Attach a handler to the load event.
  32. Sys.Application.add_load(applicationLoadHandler);
  33. function applicationLoadHandler() {
  34. // Redirect to alternate page if not business hours.
  35. var d = new Date();
  36. if (!(8 < d.getHours() < 17)) {
  37. window.location = "AfterHours.aspx";
  38. }
  39. }
  40. /*
  41. // Attach a handler to the unLoad event.
  42. Sys.Application.add_unload(applicationUnloadHandler);
  43. function applicationUnloadHandler() {
  44. // Redirect user to a survey form.
  45. window.open("SurveyForm.aspx");
  46. }
  47. function pageLoad() {
  48. // Make sure the scripts read in the proper order.
  49. Sys.Application.queueScriptReference("StopWatch.js");
  50. Sys.Application.queueScriptReference("StatusBar.js");
  51. Sys.Application.queueScriptReference("DownloadTracker.js");
  52. // Add custom controls to the application.
  53. $create(Demo.DownloadTracker, null, null, null, $get('div1'));
  54. }
  55. */
  56. function doSomethingOnHover() {
  57. var hoverMessage = "The mouse is over the button.";
  58. $get('HoverLabel').innerHTML = hoverMessage;
  59. }
  60. function doSomethingOnUnHover() {
  61. $get('HoverLabel').innerHTML = "";
  62. }
  63. function start() {
  64. alert("The start function handled the HoverButton click event.");
  65. }
  66. function tick() {
  67. var d = new Date();
  68. while($get('DataBox')) {
  69. window.setInterval(checkTime(d), 100);
  70. }
  71. }
  72. function checkTime(d) {
  73. if (!(8 < d.getHours() < 17)) {
  74. Sys.Application.removeComponent(DataBox);
  75. }
  76. }
  77. function checkComponent() {
  78. if (!($find('MyComponent', div1))) {
  79. div1.innerHTML = 'MyComponent is not available.';
  80. }
  81. }
  82. function listComponents() {
  83. var c = Sys.Application.getComponents();
  84. var s = "";
  85. for (var i=0; i<c.length; i++) {
  86. var id = c[i].get_id();
  87. var type = Object.getType(c[i]).getName();
  88. s += 'Item ' + i + ': id=' + id + ', type=' + type + '.<br />';
  89. }
  90. //div1.innerHTML = s;
  91. alert(s);
  92. }
  93. </script>
  94. <button type="button" id="Button1"> </button>
  95. <br />
  96. <div id="HoverLabel">
  97. </div>
  98. <br />
  99. <button type="button" id="Button2"> </button>
  100. <br />
  101. This text will change appearance when you click the button above.
  102. <br />
  103. <button type="button" id="Button3" onclick="listComponents()"> </button>
  104. <br />
  105. <div id="DataBox">This is my DataBox</div>
  106. <div id="div1"></div>
  107. <div id="div2"></div>
  108. <div id="div3">
  109. </div>
  110. </form>
  111. </body>
  112. </html>