mirror of
https://github.com/moparisthebest/app-UI
synced 2024-12-23 07:58:49 -05:00
57 lines
1.8 KiB
HTML
57 lines
1.8 KiB
HTML
|
<!DOCTYPE html>
|
||
|
<html>
|
||
|
<head>
|
||
|
<title>View Navigator Sample</title>
|
||
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
|
||
|
|
||
|
<script src="../../../src/libs/jquery-1.7.1.js"></script>
|
||
|
<script src="../../../src/libs/jquery.animate-enhanced.js"></script>
|
||
|
<script src="../../../src/libs/iscroll.js"></script>
|
||
|
<script src="../../../src/libs/noClickDelay.js"></script>
|
||
|
|
||
|
<link rel="stylesheet" href="../../../src/viewnavigator/viewnavigator.css" type="text/css" />
|
||
|
<script src="../../../src/viewnavigator/viewnavigator.js"></script>
|
||
|
|
||
|
<script>
|
||
|
|
||
|
$(document).ready( function() {
|
||
|
|
||
|
//Setup the default view
|
||
|
var defaultView = getView();
|
||
|
defaultView.backLabel = null;
|
||
|
|
||
|
//Setup the ViewNavigator
|
||
|
window.viewNavigator = new ViewNavigator( 'body' );
|
||
|
window.viewNavigator.pushView( defaultView );
|
||
|
|
||
|
|
||
|
} );
|
||
|
|
||
|
function pushView() {
|
||
|
//create a view and push it onto the view navigator
|
||
|
var view = getView();
|
||
|
window.viewNavigator.pushView( view );
|
||
|
}
|
||
|
|
||
|
function popView() {
|
||
|
//pop a view from the view navigator
|
||
|
window.viewNavigator.popView();
|
||
|
}
|
||
|
|
||
|
function getView() {
|
||
|
//create a view descriptor with random content
|
||
|
var bodyView =$('<div id="defaultView"><input type="text" placeholder="Email" /> <br/><textarea type="text" placeholder="Text Area" /> <br/>' +
|
||
|
'<select><option value="volvo">Red</option><option value="saab">White</option><option value="mercedes">Blue</option></select></div>');
|
||
|
var links = bodyView.find('a');
|
||
|
|
||
|
return { title: "Default View " + parseInt(Math.random()*1000),
|
||
|
backLabel: "Back",
|
||
|
view: bodyView
|
||
|
};
|
||
|
}
|
||
|
|
||
|
</script>
|
||
|
|
||
|
</head>
|
||
|
<body></body>
|
||
|
</html>
|