+<!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=iso-8859-1">
-<title>ProgressBar</title>
-
-<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
-<!-- GC -->
- <!-- LIBS -->
- <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
- <!-- ENDLIBS -->
-
-<script type="text/javascript" src="../../ext-all.js"></script>
-<script type="text/javascript" src="progress-bar.js"></script>
-<link rel="stylesheet" type="text/css" href="progress-bar.css" />
-
-<!-- Common Styles for the examples -->
-<link rel="stylesheet" type="text/css" href="../shared/examples.css" />
-</head>
-<body>
-<script type="text/javascript" src="../shared/examples.js"></script><!-- EXAMPLES -->
-<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><br />
- Deferred rendering, dynamic show/hide and built-in progress text:
- <button id="btn1">Show</button><br />
- <div class="status" id="p1text">Nothing to see here.</div>
- <div id="p1" style="width:300px;"></div>
-</p>
-
-<p>
- <b>Additional Options</b><br />
- Rendered on page load, left-aligned text and % width:
- <button id="btn2">Show</button><br />
- <div id="p2" style="width:50%;"></div>
-</p>
-
-<p>
- <b>Waiting Bar</b><br />
- Wait for a long operation to complete (example will stop after 5 secs):
- <button id="btn3">Show</button><br />
- <div id="p3"></div>
- <span class="status" id="p3text">Ready</span>
-</p>
-
-<p>
- <b>Custom Styles</b><br />
- Rendered like Windows XP with custom progress text element:
- <button id="btn4">Show</button><br />
- <div id="p4" style="width:300px;"></div>
- <div class="status"><b>Status:</b> <span id="p4text"></span></div>
-</p>
-
-</body>
+ <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>
git.ithinksw.org / extjs.git / blobdiff