Skip to content
This repository has been archived by the owner before Nov 9, 2022. It is now read-only.
Permalink
master
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Go to file
 
 
Cannot retrieve contributors at this time
<!DOCTYPE html>
<!--HTML5 doctype-->
<html>
<head>
<title>App Framework Kitchen Sink</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, minimal-ui">
<meta name="apple-mobile-web-app-capable" content="yes" />
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" type="text/css" href="src/css/icons.css" />
<link rel="stylesheet" type="text/css" href="../build/af.ui.css" />
<script type="text/javascript" charset="utf-8" src="./jquery.min.js"></script>
<script type="text/javascript" charset="utf-8" src="3rdparty/fastclick.js"></script>
<script type="text/javascript" charset="utf-8" src="src/af.shim.js"></script>
<script type="text/javascript" charset="utf-8" src="src/af.ui.js"></script>
<script src="src/af.desktopBrowsers.js"></script>
<script type="text/javascript" charset="utf-8" src="src/af.actionsheet.js"></script>
<script type="text/javascript" charset="utf-8" src="src/af.animation.js"></script>
<script type="text/javascript" charset="utf-8" src="src/af.touchEvents.js"></script>
<script type="text/javascript" charset="utf-8" src="src/af.popup.js"></script>
<script type="text/javascript" charset="utf-8" src="src/af.drawer.js"></script>
<script type="text/javascript" charset="utf-8" src="src/af.toast.js"></script>
<script type="text/javascript" charset="utf-8" src="src/af.animateheader.js"></script>
<script type="text/javascript" charset="utf-8" src="src/af.splashscreen.js"></script>
<script type="text/javascript" charset="utf-8" src="src/af.swipereveal.js"></script>
<script>
$.afui.useOSThemes=true;
$.afui.loadDefaultHash=true;
$(document).ready(function(){
//$.afui.splitview.enable();
})
if($.os.ios)
$.afui.animateHeader();
</script>
</head>
<body >
<div id="splashscreen" class='ui-loader heavy'>
App Framework
<br>
<br>
<span class='ui-icon ui-icon-loading spin'></span>
<h1>Starting app</h1>
</div>
<div class="view" id="mainview">
<header>
<h1>What</h1>
</header>
<div class="pages">
<div data-left-drawer="left" class="panel" id="main" data-title="Main" data-selected="true">
<ul class="list">
<li><a href="#login" data-transition="up-reveal">Login View (modal)</a></li>
<li><a href="#drawer" >Drawer</a></li>
<li><a href="ajax.html" data-refresh="true" >Ajax</a></li>
<li><a href="#toast" data-transition="flip">Toast</a></li>
<li><a href="#afforms" >Form Elements</a></li>
<li><a href="#popup">Popup</a></li>
<li><a href="#actionsheet">Actionsheet</a></li>
<li><a href="#foobar">Button Groups</a></li>
<li><a href="#cards">cards</a></li>
</ul>
</div>
<div class="panel" id="popup" data-title="Popup Plugin" data-include="partials/popup.html">
</div>
<div class="panel" id="actionsheet" data-title="Actionsheet Plugin" data-include="partials/actionsheet.html">
</div>
<div class="panel" id="toast" data-title="Toast Plugin" data-include="partials/toast.html">
</div>
<div data-left-drawer="left" class="panel" id="foobar" data-title="Foobar">
Foobar stuff goes here
<div class='button-grouped tabbed'>
<a class='button'>One</a>
<a class='button'>two</a>
<a class='button'>three</a>
</div>
</div>
<div data-left-drawer="left" class="panel" id="cards" data-title="Cards">
<br>
<div class="card">
<h1>Card One</h1>
<h2>Card Two</h2>
</div>
<div class="card">
<h1 class='info'>Meeting</h1>
<p>This is card content</p>
</div>
</div>
<div class="panel" id="drawer" data-title="Drawer">
<a href="#" class="button" onclick="$.afui.drawer.hide('#left')">Hide Left</a>
<a href="#" class="button" data-menu-close>Hide Active</a>
<a href="#" class="button" data-menu-close data-right-menu="right">Hide Right</a>
<br>
<a href="#" class="button" data-left-menu="left" >Cover Left</a>
<br>
<a href="#" class="button" onclick="$.afui.drawer.show('#right','right')">Cover Right</a>
<br>
<a href="#" class="button" data-left-menu="left" data-transition="push">Left Push</a>
<br>
<a href="#" class="button" onclick="$.afui.drawer.show('#left','left','reveal')">Left Reveal</a>
<br>
<a href="#" class="button" onclick="$.afui.drawer.show('#right','right','push')">Right Push</a>
<br>
<a href="#" class="button" onclick="$.afui.drawer.show('#right','right','reveal')">Right Reveal</a>
</div>
<div id="afforms" title="Form Styles" class="panel" data-include="partials/forms.html"></div>
</div>
<footer>
<a href="#main" class="icon home">Main</a>
<a href="#about" class="icon html5" data-transition="up-reveal">About</a>
<a href="#test" class="icon trash">test</a>
<a href="#touchevents" class="icon trash">Touch Events</a>
</footer>
<nav id="left" data-include="partials/leftnav.html">
</nav>
<nav id="right">
<div class="view active" id="navView2">
<header>
<h1>What</h1>
</header>
<div class="pages">
<div class="panel active" id="rightNav" data-title="Foobar">
This is the right nav
</div>
</div>
</div>
</nav>
</div>
<div class="view" id="touchView">
<header><h1></h1></header>
<div class="pages">
<div class="panel" data-title="touch events" id="touchevents" data-include="partials/touch.html">
</div>
</div>
</div>
<div class="view" id="aboutView">
<header>
<h1>Bar</h1>
</header>
<div class="pages">
<div class="panel" id="about" data-title="Bar">
About
</div>
</div>
<footer>
<a href="#" class="icon home" data-back >Home</a>
<a href="#test" class="icon home">Test</a>
</footer>
</div>
<div class="view" id="testView">
<header>
<h1>Bar</h1>
</header>
<div class="pages">
<div class="panel" id="test" data-title="Test Tabbar">
About
</div>
</div>
<footer>
<a class="button" href="#main">Something</a>
</footer>
</div>
<div class="view" id="loginView">
<div class="pages">
<div class="panel" id="login">
<h1>Login</h1>
<div style="height:300px">
</div>
<label>Test<input type="text" placeholder="Username">
<br>
<a class='button' href='#' data-message='Hi There' data-alert>Alert</a>
<a class='button' href='#main' data-transition='up-reveal:dismiss'>Back</a>
<div style="height:300px;background:green;">
asdf
</div>
more stuff
</div>
</div>
</div>
</body>
</html>