aboutsummaryrefslogtreecommitdiffstats
path: root/demos/index.html
blob: 281924f46244a17d30bb4bba61e2832b09560050 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
<?php if(!isset($plain)) { ?>
<!doctype html>
<html lang="en">
<head>
	<title>jQuery UI Demos</title>
	<link type="text/css" href="demos.css" rel="stylesheet" />
	<script type="text/javascript" src="../jquery-1.2.6.js"></script>
	<script type="text/javascript" src="../ui/ui.core.js"></script>
	<script type="text/javascript" src="../ui/ui.accordion.js"></script>
	<script type="text/javascript" src="../ui/ui.datepicker.js"></script>
	<script type="text/javascript" src="../ui/ui.dialog.js"></script>
	<script type="text/javascript" src="../ui/ui.draggable.js"></script>
	<script type="text/javascript" src="../ui/ui.droppable.js"></script>
	<script type="text/javascript" src="../ui/ui.progressbar.js"></script>
	<script type="text/javascript" src="../ui/ui.resizable.js"></script>
	<script type="text/javascript" src="../ui/ui.selectable.js"></script>
	<script type="text/javascript" src="../ui/ui.slider.js"></script>
	<script type="text/javascript" src="../ui/ui.sortable.js"></script>
	<script type="text/javascript" src="../ui/ui.tabs.js"></script>
	
</head>
<body>
<?php } else {
	$base = 'repository/trunk/demos/';
	$section = $base . $_GET['load'];

	?>
	<script type="text/javascript">
		var section;

		<?php printf ('section = "%s";', $section); ?>

		section && jQuery(function($){
			$('dl.nav a').each(function(){
				this.setAttribute('href', '/' + section + '/' + this.getAttribute('href'));
				$(this).attr('target', 'preview');
			});
		});
	</script>
<?php } ?>

<table class="layout-grid" cellspacing="0" cellpadding="0">
	<tr>
		<td class="left-nav">
			<dl class="demos-nav">
				<dt>Interactions</dt>
					<dd><a href="draggable/index.html">Draggable</a></dd>
					<dd><a href="droppable/index.html">Droppable</a></dd>
					<dd><a href="resizable/index.html">Resizable</a></dd>
					<dd><a href="selectable/index.html">Selectable</a></dd>
					<dd><a href="sortable/index.html">Sortable</a></dd>	
				<dt>Widgets</dt>
					<dd><a href="accordion/index.html">Accordion</a></dd>
					<dd><a href="datepicker/index.html">Datepicker</a></dd>
					<dd><a href="dialog/index.html">Dialog</a></dd>
					<dd><a href="progressbar/index.html">Progressbar</a></dd>
					<dd><a href="slider/index.html">Slider</a></dd>
					<dd><a href="tabs/index.html">Tabs</a></dd>
				<dt>Effects</dt>
					<dd><a href="#">Easing</a></dd>
					<dd><a href="#">General</a></dd>
					<dd><a href="#">Show/Hide</a></dd>
			</dl>
		</td>
		<td class="normal">
							
			<div class="normal">
				
				<?php if(isset($plain) && isset($_GET['load'])) { 
					echo html_entity_decode('&lt;h3&gt;'. $_GET['load'] .'&lt;/h3&gt;'); 
					include($section .'/index.html'); 
					echo html_entity_decode('&lt;iframe id="preview" name="preview" src="/'. $section .'/default.html" width="520" height="314" border="0" frameborder="0" style="overflow:auto"&gt;&lt;/iframe&gt;'); 
				} else { ?>
				
				<h3>Instructions</h3>
				<p>
					These demos showcase some common uses of each jQuery UI plugin. Simply copy and paste code from the demos to get started. Have fun playing with them.
				</p>
				<?php  } ?>
			</div>
				
		</td>
	</tr>
</table>
<?php if(!isset($plain)) { ?>
</body>
</html>
<?php } ?>