Upgrade to ExtJS 4.0.0 - Released 04/26/2011
[extjs.git] / examples / simple-widgets / progress-bar.html
index 95c21b6..6a578bd 100644 (file)
@@ -1,57 +1,55 @@
-<html>\r
-<head>\r
-<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">\r
-<title>ProgressBar</title>\r
-\r
-<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />\r
-<!-- GC -->\r
-       <!-- LIBS -->\r
-       <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>\r
-       <!-- ENDLIBS -->\r
-\r
-<script type="text/javascript" src="../../ext-all.js"></script>\r
-<script type="text/javascript" src="progress-bar.js"></script>\r
-<link rel="stylesheet" type="text/css" href="progress-bar.css" />\r
-\r
-<!-- Common Styles for the examples -->\r
-<link rel="stylesheet" type="text/css" href="../shared/examples.css" />\r
-</head>\r
-<body>\r
-<script type="text/javascript" src="../shared/examples.js"></script><!-- EXAMPLES -->\r
-<h1>Progress Bar</h1>\r
-<p>The example shows how to use the ProgressBar class. The js is not minified so it is readable.\r
-See <a href="progress-bar.js">progress-bar.js</a>.</p>\r
-\r
-<p>\r
-    <b>Basic Progress Bar</b><br />\r
-    Deferred rendering, dynamic show/hide and built-in progress text:\r
-    <button id="btn1">Show</button><br />\r
-    <div class="status" id="p1text">Nothing to see here.</div>\r
-    <div id="p1" style="width:300px;"></div>\r
-</p>\r
-\r
-<p>\r
-    <b>Additional Options</b><br />\r
-    Rendered on page load, left-aligned text and % width:\r
-    <button id="btn2">Show</button><br />\r
-    <div id="p2" style="width:50%;"></div>\r
-</p>\r
-\r
-<p>\r
-    <b>Waiting Bar</b><br />\r
-    Wait for a long operation to complete (example will stop after 5 secs):\r
-    <button id="btn3">Show</button><br />\r
-    <div id="p3"></div>\r
-    <span class="status" id="p3text">Ready</span>\r
-</p>\r
-\r
-<p>\r
-    <b>Custom Styles</b><br />\r
-    Rendered like Windows XP with custom progress text element:\r
-    <button id="btn4">Show</button><br />\r
-    <div id="p4" style="width:300px;"></div>\r
-    <div class="status"><b>Status:</b> <span id="p4text"></span></div>\r
-</p>\r
-\r
-</body>\r
-</html>\r
+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
+"http://www.w3.org/TR/html4/strict.dtd">
+<html>
+    <head>
+        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+        <title>
+            ProgressBar
+        </title>
+        <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css">
+        <link rel="stylesheet" type="text/css" href="progress-bar.css">
+        <link rel="stylesheet" type="text/css" href="../shared/example.css">
+        <script type="text/javascript" src="../../bootstrap.js">
+</script>
+        <script type="text/javascript" src="progress-bar.js">
+</script>
+        <style type="text/css">
+p {
+                margin: 20px;
+            }
+        </style>
+    </head>
+    <body>
+        <h1>
+            Progress Bar
+        </h1>
+        <p>
+            The example shows how to use the ProgressBar class. The js is not minified so it is readable. See <a href="progress-bar.js">progress-bar.js</a>.
+        </p>
+        <p>
+            <b>Basic Progress Bar:</b> Deferred rendering, dynamic show/hide and built-in progress text: <button id="btn1">Show</button><br>
+        </p>
+        <div class="status" id="p1text">
+            Nothing to see here.
+        </div>
+        <div id="p1" style="width:300px;"></div>
+        <p>
+            <b>Additional Options:</b> Rendered on page load, left-aligned text and % width: <button id="btn2">Show</button><br>
+        </p>
+        <div id="p2" style="width:50%;"></div>
+        <p>
+            <b>Waiting Bar:</b> Wait for a long operation to complete (example will stop after 5 secs): <button id="btn3">Show</button><br>
+        </p>
+        <div id="p3"></div>
+        <p>
+            <span class="status" id="p3text">Ready</span>
+        </p>
+        <p>
+            <b>Custom Styles:</b> Rendered like Windows XP with custom progress text element: <button id="btn4">Show</button><br>
+        </p>
+        <div id="p4" style="width:300px;"></div>
+        <div class="status">
+            <b>Status:</b> <span id="p4text"></span>
+        </div>
+    </body>
+</html>