Файл: module-assets/admin/uniform/demo/demo.html
Строк: 273
<?php
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" charset="utf-8">
/*global optionValues*/
(function () {
var params, url;
optionValues = {
min: false,
jquery: "1.4.2",
theme: "default"
};
params = window.location.search;
function css(src) {
document.write('<link rel="stylesheet" href="' + src + '" type="text/css" />');
}
function script(src) {
document.write('<script src="' + src + '" type="text/javascript" charset="utf-8"></sc' + 'ript>');
}
if (params) {
params = params.substr(1).split('&');
for (i = 0; i < params.length; i ++) {
var equals = params[i].split('=');
if (Object.prototype.hasOwnProperty.call(optionValues, equals[0])) {
optionValues[equals[0]] = equals[1];
}
}
}
css('../themes/' + optionValues.theme + '/css/uniform.' + optionValues.theme + '.css');
url = '://ajax.googleapis.com/ajax/libs/jquery/'
if (window.location.protocol == 'https:') {
url = 'https' + url;
} else {
url = 'http' + url;
}
url += optionValues.jquery;
if (optionValues.min) {
url += '/jquery.min.js';
} else {
url += '/jquery.js';
}
script(url);
if (optionValues.min) {
script('../jquery.uniform.min.js');
} else {
script('../jquery.uniform.js');
}
}());
</script>
<script type="text/javascript">
// Can't merge with previous script block since this relies on jQuery and that
// was not loaded until the previous script block ends
$(function () {
var $min, $remove, $apply, $uniformed;
// Debugging code to check for multiple click events
$selects = $("select").click(function () {
if (typeof console !== 'undefined' && typeof console.log !== 'undefined') {
console.log($(this).attr('id') + " clicked");
}
});
$uniformed = $(".styleThese").find("input, textarea, select, button, a.uniformTest").not(".skipThese");
$uniformed.uniform();
$("#optionsForm input, #optionsForm select").change(function () {
this.form.submit();
});
if (optionValues.min) {
$min = $("#optionsMin");
if ($min.prop) {
$min.prop("checked", true);
} else {
$min.attr("checked", "checked");
}
}
$("#optionsJquery").val(optionValues.jquery);
$("#optionsTheme").val(optionValues.theme);
$("#jqueryCurrentVersion").text("Using " + jQuery.fn.jquery);
$remove = $("#remove");
$apply = $("#apply");
$remove.click(function () {
$uniformed.uniform.restore();
$remove.hide();
$apply.show();
return false;
});
$apply.click(function () {
$uniformed.uniform();
$apply.hide();
$remove.show();
return false;
});
});
</script>
<style type="text/css" media="screen">
body {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #666;
padding: 40px;
}
h1 {
margin-top: 0;
}
label {
font-size: 10px;
font-weight: bold;
text-transform: uppercase;
display: block;
margin-bottom: 3px;
clear: both;
}
.error {
background-color: #FF8080;
}
.hide {
display: none;
}
</style>
</head>
<body>
<h1>Uniform Demo</h1>
<form method=GET action="?" id="optionsForm">
Options:
<input type=checkbox name="min" id="optionsMin"> Minified
<select name="theme" id="optionsTheme">
<option value="default">Default</option>
<option value="agent">Agent</option>
<option value="aristo">Aristo</option>
<option value="jeans">Jeans</option>
</select>
<select name="jquery" id="optionsJquery">
<option value="1.3">jQuery 1.3.x</option>
<option value="1.4.2">jQuery 1.4.2</option>
<option value="1.4">jQuery 1.4.x</option>
<option value="1.5">jQuery 1.5.x</option>
<option value="1.6">jQuery 1.6.x</option>
<option value="1.7">jQuery 1.7.x</option>
<option value="1.8">jQuery 1.8.x</option>
<option value="1.9.0">jQuery 1.9.0</option>
</select>
<span id="jqueryCurrentVersion"></span>
<button id="remove">Remove</button>
<button id="apply" style="display:none">Apply</button>
</form>
<form class="styleThese">
<table width="100%">
<tr>
<td width="50%">
<div>
<label>Message:</label>
<textarea cols="40" rows="5"></textarea>
</div>
<div>
<label>Unstyled:</label>
<input class="skipThese" type="text" size="40" value="This is unstyled on purpose" />
</div>
<div>
<label>Your Name:</label>
<input type="text" size="40" value="John Doe"/>
</div>
<div>
<label>Your Email:</label>
<input type="email" size="40" value="mr_hotshot0357@example.com" />
</div>
<div>
<label>Search:</label>
<input type="search" size="40"/>
</div>
<div>
<label>Phone:</label>
<input type="tel" size="40"/>
</div>
<div>
<label>URL:</label>
<input type="url" size="40"/>
</div>
<div>
<label>Datetime:</label>
<input type="datetime" size="40"/>
</div>
<div>
<label>Date:</label>
<input type="date" size="40"/>
</div>
<div>
<label>Month:</label>
<input type="month" size="40"/>
</div>
<div>
<label>Week:</label>
<input type="week" size="40"/>
</div>
<div>
<label>Time:</label>
<input type="time" size="40"/>
</div>
<div>
<label>Datetime-local:</label>
<input type="datetime-local" size="40"/>
</div>
</td>
<td>
<div>
<label>Number:</label>
<input type="number" size="40"/>
</div>
<div>
<label>Range:</label>
<input type="range" size="40"/>
</div>
<div>
<label>Color:</label>
<input type="color" size="40"/>
</div>
<div>
<label>Some Password:</label>
<input type="password" size="40"/>
</div>
<div>
<label>I found your site:</label>
<select id="demoFoundSite">
<option value="google">Through Google</option>
<option value="twitter">Through Twitter</option>
<option value="other">Other…</option>
<option value="hi"><Hi></option>
</select>
</div>
<div>
<label>How do you feel?</label>
<select id="demoFeeling" multiple="multiple" size=4>
<option value="elated">Elated</option>
<option value="happy">Happy</option>
<option value="content">Content</option>
<option value="ok">Ok</option>
<option value="unhappy">Unhappy</option>
<option value="frustrated">Frustrated</option>
<option value="cranky">Cranky</option>
<option value="mad">Mad</option>
<option value="unlisted">Anything else</option>
</select>
</div>
<div>
<label>
<input type="radio" name="radio" value="hi" /> Saying hi
</label>
<label>
<input type="radio" name="radio" value="feedback" /> Sending feedback
</label>
<label>
<input type="radio" name="radio" value="default" checked="CHECKED" /> Default Seleted Radio
</label>
</div>
<div>
<label>
<input type="checkbox" id="contactBack" /> Please contact me back
</label>
<label>
<input type="checkbox" checked="CHECKED" id="goodDay" /> Today is a good day
</label>
</div>
<div>
<label>Upload a file:</label>
<input type="file" />
</div>
</td>
</tr>
</table>
<div class="error">
<!-- Here are some fields with "display: none" on them.
When Uniform wraps them, the surrounding div should also get
the "display: none" style applied. -->
<input type="text" value="You should not see this." class="hide" />
<select id="demoHide" class="hide">
<option>If you can see this, it's an error</option>
</select>
<input type="checkbox" class="hide" />
<input type="radio" name="radio" class="hide" value="hidden" />
<input type="file" class="hide" />
</div>
<div>
<input type="submit" />
<input type="reset" />
</div>
</form>
<p class="styleThese">
<a href="http://google.com/">Normal link</a>,
<a href="http://google.com" class="uniformTest">uniformed link (self)</a> and
<a href="http://google.com" class="uniformTest" target="newWindow">uniformed link (new window)</a>.
</p>
</body>
</html>
?>