chocolatechip-ui.com/android.html at master · rbiggs/chocolatechip-ui.com · GitHub

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
89
90
91
92
93
94
95
96
97
98
99
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="initial-scale=1.0, maximum-scale=2.0, user-scalable=yes">
	<meta name="viewport" content="width=device-height">
	<meta name="viewport" content="width=device-height">
   <meta name="apple-mobile-web-app-capable" button-content="yes">
	<title>ChocolateChip-UI</title>
	<link rel="stylesheet" href="css/main.css" />
	<style type="text/css">
		.primary-section.documentation img {
			margin: 10px 0;
		}
		.primary-section.documentation img:nth-of-type(odd) {
			margin-left: 40px;
			margin-right: 40px;
		}
	</style>
	<script src="scripts/jquery-1.7.2.min.js" type="text/javascript"></script>
	<script type="text/javascript">
		$(function() {
			var tutorialmenu = $("#side-menu a");
			$.extend({
				UISelectedTutorialItem : null
			});
			var UITutorialContainer = $("#tutorial_container");

			$.each(tutorialmenu, function(idx, item) {
				var item = $(item);
				item.on("click", function(e) {
					if (item.hasClass("selected")) {
						e.preventDefault();
					} else {
						if (!item.hasClass('external')) e.preventDefault();
						if (!!$.UISelectedTutorialItem) {
							$("#side-menu a").removeClass("selected");
						}
						$.UISelectedTutorialItem = "#" + item[0].id
						item.addClass("selected");
						if (item.hasClass('external')) return;
						var tutorialChoice = $($.UISelectedTutorialItem)[0].href;
						tutorialChoice = tutorialChoice.split("#");
						tutorialChoice = "android/" + tutorialChoice[1];
						$.ajax(tutorialChoice, {
							success: function(data) {
								UITutorialContainer.empty();
								UITutorialContainer.html(data).hide().fadeIn();
							},
							error: function(e) {
								return e;
							}
						})
					}
				});
			});
		});
	</script>
</head>
<body id="documentation">
<div id="header">
	<div id="header-content">
		<h1>ChocolateChip-UI</h1>
		<h2>The Web app development framework</h2>
		<h3>It's tiny, but delicious</h3>
		<img id="itbd" src="images/itbd.png" alt="It's tiny, but delicious" width="247" height="79">
	</div>
</div>
<div id="nav">
	<ul class="menu">
		<li><a href="index.html" title="This is the way home!">Home</a></li>
		<li><a href="downloads.html" title="Click here to download ChocolateChip-UI">Downloads</a></li>
		<li><a href="tutorials.html" title="Learn how to quickly and effeciently create Web apps with ChococlateChip-UI">Tutorials</a></li>
		<li><a href="documentation.html" title="The lowdown on how all of this works">Documentation</a></li>
		<li><a href="snippets.html" title="Use these in your IDE to speed up app building.">Snippets</a></li>
		<li class='selected'>Android</li>
		<li id="chuiAbout" title='The "Why", "When" and "Who done it".'><a href="about.html">About</a></li>
	</ul>
</div>
<div id="content">
<div class="primary-section documentation" id="tutorial_container">
	<h2>Choose a Feature from the Menu on the Left</h2>
	<p>ChocolateChip-UI is a powerful and easy to use framework for creating mobile Web apps. This version has a theme based on Android's Holo theme. Click on a menu item on the left to learn more about how to use the Android specific version of ChocolateChip-UI.</p>

</div>
<div class="secondary-section">
	<h2>Android</h2>
	<ul id="side-menu">
		<li><a id="t_01" href="#holo_theme.html">Dark Holo Theme</a></li>
		<li><a id="t_02" href="#differences.html">How it Differs from iOS ChUI</a></li>
		<li><a id="t_03" href="#custom_color.html">Custom Color Scheme</a></li>
		<li><a id="t_04" href="#pure_android.html">Pure Android</a></li>
		<li><a id="t_05" href="#write_once.html">Write Once, Deploy for Both</a></li>
	</ul>
</div>
</div>

</body>
</html>