jquery-mobile/experiments/converter/index.html
Kin Blas 161f5e6ae3 Removed jquery.js from js/index.php and updated all html doc/experiments/test files that incuded "js/" so that they also include jquery.js manually.
This makes our include model match the include model on the CDN, and allows devs to make use of mobileinit for debugging some of the samples since that must be set up after jquery.js, but before jquery-mobile.
2011-01-20 11:26:12 -08:00

100 lines
No EOL
3.6 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>jQuery Mobile Framework - Converter Demo Application</title>
<link rel="stylesheet" href="../../themes/default/" />
<link rel="stylesheet" href="converter.css" />
<script type="text/javascript" src="../../js/jquery.js"></script>
<script type="text/javascript" src="../../js/"></script>
</head>
<body>
<div data-role="page" id="start" data-theme="a">
<script type="text/javascript" src="jquery.tmpl.js"></script>
<script type="text/javascript" src="storage.js"></script>
<script type="text/javascript" src="application.js"></script>
<style>
.field { padding: 15px; }
</style>
<script id="conversion-field" type="text/x-jquery-tmpl">
<li>
<p class="currency-from">${$item.symbols[from]} <span class="unit">${from}</span></p>
<p class="currency-to ui-li-aside">${$item.symbols[to]} <span id="${from}${to}" class="rate">NaN</span> <span class="unit">${to}</span></p>
</li>
</script>
<script id="conversion-edit-field" type="text/x-jquery-tmpl">
<li>
<label for="${from}${to}" class="ui-input-text conversion-${type}" title="From ${from} to ${to}">${$item.symbols[from]} to ${$item.symbols[to]}</label>
<a href="#" class="deletebutton ui-aux">Delete</a>
</li>
</script>
<div data-role="header" data-theme="e">
<a href="#customize" data-rel="dialog" data-transition="pop" data-icon="gear" class="ui-btn-right">Edit</a>
<h1>Currency converter</h1>
</div>
<div class="ui-bar ui-bar-a">
<form method="get" action="" data-role="autoform" id="curr-form">
<label for="term" data-role="nojs">Search:</label>
<input type="search" name="term" id="term" placeholder="Type a value..." value="25" data-theme="a" />
</form>
</div>
<div data-role="content">
<ul id="conversions" data-role="listview" data-theme="a">
</ul>
</div>
</div>
<div data-role="page" id="customize" class="ui-body-b">
<div data-role="header" data-theme="b" data-backbtn="false">
<h1>Edit conversions</h1>
<a href="#start" data-transition="fade" data-theme="b" data-icon="check" class="ui-btn-right">Done</a>
</div>
<div data-role="content">
<ul id="edit-conversions" data-role="listview" data-theme="c" data-inset="true">
</ul>
</div>
<div class="ui-body">
<a href="#add-currency-dialog" data-role="button">Add new...</a>
<a id="restore" href="#" data-role="button" data-theme="c">Restore defaults</a>
</div>
</div>
<div data-role="page" id="add-currency-dialog" class="ui-body-b">
<div data-role="header" data-theme="a">
<h1>Add new</h1>
<a href="#customize" class="ui-back" data-icon="arrow-l">Cancel</a>
</div>
<div data-role="content">
<h2>Select currencies to convert:</h2>
<div data-role="fieldcontain">
<label for="currency-options-from">From</label>
<select name="currency-options" id="currency-options-from" data-theme="c">
<option value="EUR">EUR to Euro</option>
<option value="USD">USD to US Dollar</option>
<option value="GBP">GBP to Great Britain Pound</option>
</select>
</div>
<div data-role="fieldcontain">
<label for="currency-options-to">To</label>
<select name="currency-options" id="currency-options-to" data-theme="c">
<option value="EUR">EUR to Euro</option>
<option value="USD">USD to US Dollar</option>
<option value="GBP">GBP to Great Britain Pound</option>
</select>
</div>
<div data-role="fieldcontain">
<a id="cancel" href="#customize" data-role="button" data-theme="c" data-inline="true">Cancel</a>
<a id="add" href="#customize" data-role="button" data-theme="b" data-inline="true">Add conversion</a>
</div>
</div>
</div>
</body>
</html>