examples/message-box/msg-box.html

   1 <html>\r
   2 <head>\r
   3 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">\r
   4 <title>MessageBox</title>\r
   5 \r
   6     <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />\r
   7     <!-- GC -->\r
   8         <!-- LIBS -->\r
   9         <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>\r
  10         <!-- ENDLIBS -->\r
  11 \r
  12     <script type="text/javascript" src="../../ext-all.js"></script>\r
  13     <script type="text/javascript" src="msg-box.js"></script>\r
  14 \r
  15     <!-- Common Styles for the examples -->\r
  16     <link rel="stylesheet" type="text/css" href="../shared/examples.css" />\r
  17 \r
  18     <style type="text/css">\r
  19         .x-window-dlg .ext-mb-download {\r
  20             background:transparent url(images/download.gif) no-repeat top left;\r
  21             height:46px;\r
  22         }\r
  23     </style>\r
  24 </head>\r
  25 <body>\r
  26 <script type="text/javascript" src="../shared/examples.js"></script><!-- EXAMPLES -->\r
  27 <h1>MessageBox Dialogs</h1>\r
  28 <p>The example shows how to use the MessageBox class. Some of the buttons have animations, some are normal.</p>\r
  29 <p>The js is not minified so it is readable. See <a href="msg-box.js">msg-box.js</a>.</p>\r
  30 \r
  31 <p>\r
  32     <b>Confirm</b><br />\r
  33     Standard Yes/No dialog.\r
  34     <button id="mb1">Show</button>\r
  35 </p>\r
  36 \r
  37 <p>\r
  38     <b>Prompt</b><br />\r
  39     Standard prompt dialog.\r
  40     <button id="mb2">Show</button>\r
  41 </p>\r
  42 \r
  43 <p>\r
  44     <b>Multi-line Prompt</b><br />\r
  45     A multi-line prompt dialog.\r
  46     <button id="mb3">Show</button>\r
  47 </p>\r
  48 \r
  49 <p>\r
  50     <b>Yes/No/Cancel</b><br />\r
  51     Standard Yes/No/Cancel dialog.\r
  52     <button id="mb4">Show</button>\r
  53 </p>\r
  54 \r
  55 <p>\r
  56     <b>Progress Dialog</b><br />\r
  57     Dialog with measured progress bar.\r
  58     <button id="mb6">Show</button>\r
  59 </p>\r
  60 \r
  61 <p>\r
  62     <b>Wait Dialog</b><br />\r
  63     Dialog with indefinite progress bar and custom icon (will close after 8 sec).\r
  64     <button id="mb7">Show</button>\r
  65 </p>\r
  66 \r
  67 <p>\r
  68     <b>Alert</b><br />\r
  69     Standard alert message dialog.\r
  70     <button id="mb8">Show</button>\r
  71 </p>\r
  72 \r
  73 <p>\r
  74     <b>Icons</b><br />\r
  75     Standard alert with optional icon.\r
  76     <select id="icons">\r
  77         <option id="error" selected="selected">Error</option>\r
  78         <option id="info">Informational</option>\r
  79         <option id="question">Question</option>\r
  80         <option id="warning">Warning</option>\r
  81     </select>\r
  82     <button id="mb9">Show</button>\r
  83 </p>\r
  84 </body>\r
  85 </html>\r