RubyGems - RubyApp - Versions diffs - 0.6.59 → 0.6.60 - Mend

RubyApp 0.6.59 → 0.6.60

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (870) hide show

data/lib/ruby_app/resources/elements/mobile/document/jquery.mobile-1.1.0/demos/docs/pages/pages-themes/theme-e.html ADDED

@@ -0,0 +1,163 @@
+<!DOCTYPE html>
+<html>
+	<head>
+	<meta charset="utf-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+	<title>jQuery Mobile Docs - Theming Pages</title>
+	<link rel="stylesheet"  href="../../../css/themes/default/jquery.mobile-1.1.0.css" />
+	<link rel="stylesheet" href="../../_assets/css/jqm-docs.css"/>
+	<script src="../../../experiments/themeswitcher/jquery.mobile.themeswitcher.js"></script>
+	<script src="../../../js/jquery.js"></script>
+	<script src="../../../docs/_assets/js/jqm-docs.js"></script>
+	<script src="../../../js/jquery.mobile-1.1.0.js"></script>
+</head>
+<body>
+	<div data-role="page" class="type-interior" data-theme="e">
+		<div data-role="header" data-theme="e">
+			<h1>Theming pages</h1>
+			<a href="../../../" data-icon="home" data-iconpos="notext" data-direction="reverse">Home</a>
+		<a href="../../nav.html" data-icon="search" data-iconpos="notext" data-rel="dialog" data-transition="fade">Search</a>
+		</div><!-- /header -->
+	<div data-role="content">
+		<div class="content-primary">
+			<ul data-role="controlgroup" data-type="horizontal" class="localnav">
+				<li><a href="../pages-themes.html" data-role="button" data-transition="fade">Theme Overview</a></li>
+				<li><a href="theme-a.html" data-role="button" data-transition="fade">A&nbsp;</a></li>
+				<li><a href="theme-b.html" data-role="button" data-transition="fade">B&nbsp;</a></li>
+				<li><a href="theme-c.html" data-role="button" data-transition="fade">C&nbsp;</a></li>
+				<li><a href="theme-d.html" data-role="button" data-transition="fade">D&nbsp;</a></li>
+				<li><a href="theme-e.html" data-role="button" data-transition="fade" class="ui-btn-active">E&nbsp;</a></li>
+			</ul>
+			<h2>Theme E Sample Page</h2>
+			<p>This is an example of <code>data-theme="e"</code> applied to the same element as <code>data-role="page"</code>, showing how the theme is inherited by widgets throughout the page.</p>
+					<div data-role="fieldcontain">
+			         <label for="name-a">Text Input:</label>
+			         <input type="text" name="name" id="name-a" value=""  />
+					</div>
+					<div data-role="fieldcontain">
+						<label for="switch-a">Flip switch:</label>
+						<select name="switch-a" id="switch-a" data-role="slider">
+							<option value="off">Off</option>
+							<option value="on">On</option>
+						</select>
+					</div>
+					<div data-role="fieldcontain">
+						<label for="slider-a">Slider:</label>
+					 	<input type="range" name="slider" id="slider-a" value="0" min="0" max="100"  />
+					</div>
+					<div data-role="fieldcontain">
+					<fieldset data-role="controlgroup" data-type="horizontal">
+				    	<legend>Font styling:</legend>
+				    	<input type="checkbox" name="checkbox-6a" id="checkbox-6a" class="custom" />
+						<label for="checkbox-6a">b</label>
+						<input type="checkbox" name="checkbox-7a" id="checkbox-7a" class="custom" />
+						<label for="checkbox-7a"><em>i</em></label>
+						<input type="checkbox" name="checkbox-8a" id="checkbox-8a" class="custom" />
+						<label for="checkbox-8a">u</label>
+				    </fieldset>
+					</div>
+					<div data-role="fieldcontain">
+					    <fieldset data-role="controlgroup">
+					    	<legend>Choose a pet:</legend>
+					         	<input type="radio" name="radio-choice-1" id="radio-choice-1a" value="choice-1" />
+					         	<label for="radio-choice-1a">Cat</label>
+					         	<input type="radio" name="radio-choice-1" id="radio-choice-2a" value="choice-2"  />
+					         	<label for="radio-choice-2a">Dog</label>
+					         	<input type="radio" name="radio-choice-1" id="radio-choice-3a" value="choice-3"  />
+					         	<label for="radio-choice-3a">Hamster</label>
+					         	<input type="radio" name="radio-choice-1" id="radio-choice-4a" value="choice-4"  />
+					         	<label for="radio-choice-4a">Lizard</label>
+					    </fieldset>
+					</div>
+					<div data-role="fieldcontain">
+						<label for="select-choice-a" class="select">Choose shipping method:</label>
+						<select name="select-choice-a" id="select-choice-a">
+							<option value="standard">Standard: 7 day</option>
+							<option value="rush">Rush: 3 days</option>
+							<option value="express">Express: next day</option>
+							<option value="overnight">Overnight</option>
+						</select>
+					</div>
+					<h2>Collapsible Sets</h2>
+					<div data-role="collapsible-set">
+						<div data-role="collapsible" data-collapsed="false">
+							<h3>Section 1</h3>
+							<p>I'm the collapsible content in a set so this feels like an accordion. I'm visible by default because I have the <code>data-collapsed="false"</code> attribute; to collapse me, either click my header or expand another header in my set.</p>
+						</div>
+						<div data-role="collapsible">
+							<h3>Section 2</h3>
+							<p>I'm the collapsible content in a set so this feels like an accordion. I'm hidden by default because I have the "collapsed" state; you need to expand the header to see me.</p>
+						</div>
+						<div data-role="collapsible">
+							<h3>Section 3</h3>
+							<p>I'm the collapsible content in a set so this feels like an accordion. I'm hidden by default because I have the "collapsed" state; you need to expand the header to see me.</p>
+						</div>
+					</div>
+					<h2>Inset List</h2>
+					<ul data-role="listview" data-inset="true">
+						<li><a href="index.html">Inbox <span class="ui-li-count" >12</span></a></li>
+						<li><a href="index.html">Outbox <span class="ui-li-count">0</span></a></li>
+						<li><a href="index.html">Drafts <span class="ui-li-count">4</span></a></li>
+						<li><a href="index.html">Sent <span class="ui-li-count">328</span></a></li>
+						<li><a href="index.html">Trash <span class="ui-li-count">62</span></a></li>
+					</ul>
+				</div><!--/content-primary -->
+				<div class="content-secondary">
+					<div data-role="collapsible" data-collapsed="true" data-theme="e" data-content-theme="e">
+						<h3>More in this section</h3>
+							<ul data-role="listview" data-theme="e" data-dividertheme="e">
+								<li data-role="list-divider">Pages &amp; Dialogs</li>
+								<li><a href="../../page-anatomy.html">Anatomy of a page</a></li>
+								<li><a href="../../page-template.html" data-ajax="false">Single page template</a></li>
+								<li><a href="../../multipage-template.html" data-ajax="false">Multi-page template</a></li>
+								<li><a href="../../page-titles.html">Page titles</a></li>
+								<li><a href="../../page-links.html">Linking pages</a></li>
+								<li><a href="../../page-transitions.html" data-ajax="false">Page transitions</a></li>
+								<li><a href="../../page-dialogs.html">Dialogs</a></li>
+								<li><a href="../../page-cache.html">Prefetching &amp; caching pages</a></li>
+								<li><a href="../../page-navmodel.html">Ajax, hashes &amp; history</a></li>
+								<li><a href="../../page-dynamic.html">Dynamically Injecting Pages</a></li>
+								<li><a href="../../page-scripting.html">Scripting pages</a></li>
+								<li data-theme="a"><a href="../../pages-themes.html">Theming pages</a></li>
+							</ul>
+					</div>
+				</div>
+			</div><!-- /content -->
+			<div data-role="footer" class="footer-docs" data-theme="e">
+					<p>&copy; 2011-12 The jQuery Foundation</p>
+			</div>
+			</div><!-- /page -->
+			</body>
+			</html>

data/lib/ruby_app/resources/elements/mobile/document/jquery.mobile-1.1.0/demos/docs/pages/phonegap.html ADDED

@@ -0,0 +1,115 @@
+<!DOCTYPE html>
+<html>
+	<head>
+	<meta charset="utf-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+	<title>jQuery Mobile Docs - Phonegap</title>
+	<link rel="stylesheet"  href="../../css/themes/default/jquery.mobile-1.1.0.css" />
+	<link rel="stylesheet" href="../_assets/css/jqm-docs.css"/>
+	<script src="../../js/jquery.js"></script>
+	<script src="../../docs/_assets/js/jqm-docs.js"></script>
+	<script src="../../js/jquery.mobile-1.1.0.js"></script>
+</head>
+<body>
+	<div data-role="page" class="type-interior">
+		<div data-role="header" data-theme="f">
+		<h1>PhoneGap apps</h1>
+		<a href="../../" data-icon="home" data-iconpos="notext" data-direction="reverse">Home</a>
+		<a href="../nav.html" data-icon="search" data-iconpos="notext" data-rel="dialog" data-transition="fade">Search</a>
+	</div><!-- /header -->
+	<div data-role="content">
+		<div class="content-primary">
+			<h2>Building PhoneGap apps with jQuery Mobile</h2>
+			<p><a href="http://phonegap.com/" rel="external">PhoneGap</a> is an HTML5 app platform that allows developers to author native applications with web technologies and get access to APIs and app stores. Applications are built as normal HTML pages and packaged up to run as a native application within a UIWebView or WebView (a chromeless browser, referred to hereafter as a webview). Since PhoneGap is frequently used in conjunction with jQuery Mobile, we wanted to offer a few tips and recommendations to help you get staretd. </p>
+			<p>The initial application document is loaded by the PhoneGap application by a local file:// URL. This means that if you want to pull in pages from your company's remote server (phone home) you will have to refer to them with absolute URLs to your server. Because your document originates from a file:// URL, loading pages or assets from your remote server is considered a cross-domain request that can be blocked in certain scenarios. </p>
+			<p>Your ability to access cross-domain pages from within a Phone Gap jQuery Mobile application is controlled by two key things: <code>$.support.cors</code> and <code>$.mobile.allowCrossDomainPages</code>, and can also be influenced by the white list feature in later builds of PhoneGap.</p>
+			<h2>$.support.cors</h2>
+			<p>In jQuery core, there is a <a href="http://api.jquery.com/jQuery.support/" rel="external">$.support.cors</a> boolean that indicates whether or not jQuery thinks the browser supports the W3C "<a hre="http://www.w3.org/TR/cors/" rel="external">Cross-Origin Resource Sharing</a>" feature to support cross-domain requests.</p>
+			<p>Since jQuery Mobile relies on jQuery core's $.ajax() functionality, <code>$.support.cors</code> must be set to <code>true</code> to tell <code>$.ajax</code> to load cross-domain pages. We've heard reports that webviews on some platforms, like BlackBerry, support cross-domain loading, but that jQuery core incorrectly sets <code>$.support.cors</code> value to <code>false</code> which disables cross-domain $.ajax() requests and will cause the page or assets to fail to load. </p>
+			<h2>$.mobile.buttonMarkup.hoverDelay</h2>
+			<p>If you find that the button down/hover state (lists, buttons, links etc) feels sluggish the <code>$.mobile.buttonMarkup.hoverDelay</code> setting might be of use. It will decrease the time between the touch event and the application of the relevant class but will also result in a higher chance that the same class will be applied even when the user is scrolling (eg, over a long list of links).</p>
+			<h2>$.mobile.allowCrossDomainPages</h2>
+			<p>When jQuery Mobile attempts to load an external page, the request runs through <code>$.mobile.loadPage()</code>. This will only allow cross-domain requests if the <code>$.mobile.allowCrossDomainPages</code> configuration option is set to <code>true</code>. Because the jQuery Mobile framework tracks what page is being viewed within the browser's location hash, it is possible for a cross-site scripting (XSS) attack to occur if the XSS code in question can manipulate the hash and set it to a cross-domain URL of its choice. This is the main reason that the default setting for <code>$.mobile.allowCrossDomainPages</code> is set to <code>false</code>.</p>
+			<p>So in PhoneGap apps that must "phone home" by loading assets off a remote server, both the <code>$.support.cors</code> AND <code>$.mobile.allowCrossDomainPages</code> must be set to <code>true</code>.  The  <code>$.mobile.allowCrossDomainPages</code> option must be set before any cross-domain request is made so we recommend wrapping this in a <code>mobileinit</code> handler:</p>
+<pre><code>$( document ).bind( "mobileinit", function() {
+    // Make your jQuery Mobile framework configuration changes here!
+    $.mobile.allowCrossDomainPages = true;
+});</code></pre>
+			<h2>PhoneGap White Listing</h2>
+			<p>PhoneGap 1.0 introduced the idea of white-listing servers that its internal webview is allowed to make cross-domain requests to. You can find info about it here on the <a href="http://wiki.phonegap.com/w/page/40796976/Install%20the%20latest%20%28trunk%29%20source%20of%20iOS%20PhoneGap">PhoneGap wiki</a>:</p>
+			<p>However, not all platforms support this white-listing feature so check the PhoneGap documentation for details. Older versions of PhoneGap prior to 1.0 defaulted to allowing cross-domain requests to any server.</p>
+			<h2>Still having issues?</h2>
+			<p>Here are a few more tips that aren't specifically related to PhoneGap but are good to know:</p>
+			<p><strong>We recommend disabling the <a href="../api/globalconfig.html">pushState feature</a> for installed apps </strong>because there are edge cases where this feature can cause unexpected navigation behavior and since URLs aren't visible in a webview, it's not worth keeping this active in these situations. </p>
+			<p><strong>Android enforces a timeout when loading URLs in a webview</strong> which may be too short for your needs. You can change this timeout by editing a Java class generated by the Eclipse plugin for Android:</p>
+			<code>super.setIntegerProperty("loadUrlTimeoutValue", 60000);</code>
+      </div>
+		<!--/content-primary -->
+				<div class="content-secondary">
+					<div data-role="collapsible" data-collapsed="true" data-theme="b" data-content-theme="d">
+							<h3>More in this section</h3>
+							<ul data-role="listview" data-theme="c" data-dividertheme="d">
+								<li data-role="list-divider">Pages &amp; Dialogs</li>
+								<li><a href="page-anatomy.html">Anatomy of a page</a></li>
+								<li><a href="page-template.html" data-ajax="false">Single page template</a></li>
+								<li><a href="multipage-template.html" data-ajax="false">Multi-page template</a></li>
+								<li><a href="page-titles.html">Page titles</a></li>
+								<li><a href="page-links.html">Linking pages</a></li>
+								<li><a href="page-transitions.html">Page transitions</a></li>
+								<li><a href="page-dialogs.html">Dialogs</a></li>
+								<li><a href="page-cache.html">Prefetching &amp; caching pages</a></li>
+								<li><a href="page-navmodel.html">Ajax, hashes &amp; history</a></li>
+								<li><a href="page-dynamic.html">Dynamically injecting pages</a></li>
+								<li><a href="page-scripting.html">Scripting pages</a></li>
+								<li data-theme="a"><a href="phonegap.html">PhoneGap apps</a></li>
+								<li><a href="touchoverflow.html">touchOverflow feature</a></li>
+								<li><a href="pages-themes.html">Theming pages</a></li>
+							</ul>
+					</div>
+				</div>
+			</div><!-- /content -->
+			<div data-role="footer" class="footer-docs" data-theme="c">
+					<p>&copy; 2011-12 The jQuery Foundation</p>
+			</div>
+			</div><!-- /page -->
+			</body>
+			</html>

data/lib/ruby_app/resources/elements/mobile/document/jquery.mobile-1.1.0/demos/docs/pages/touchoverflow.html ADDED

@@ -0,0 +1,127 @@
+<!DOCTYPE html>
+<html>
+	<head>
+	<meta charset="utf-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+	<title>jQuery Mobile Docs - touchOverflow</title>
+	<link rel="stylesheet"  href="../../css/themes/default/jquery.mobile-1.1.0.css" />
+	<link rel="stylesheet" href="../_assets/css/jqm-docs.css"/>
+	<script src="../../js/jquery.js"></script>
+	<script src="../../docs/_assets/js/jqm-docs.js"></script>
+	<script src="../../js/jquery.mobile-1.1.0.js"></script>
+</head>
+<body>
+	<div data-role="page" class="type-interior">
+		<div data-role="header" data-theme="f">
+		<h1>touchOverflow</h1>
+		<a href="../../" data-icon="home" data-iconpos="notext" data-direction="reverse">Home</a>
+		<a href="../nav.html" data-icon="search" data-iconpos="notext" data-rel="dialog" data-transition="fade">Search</a>
+	</div><!-- /header -->
+	<div data-role="content">
+		<div class="content-primary">
+			<div class="ui-body ui-body-e">
+					<h2>touchOverflowEnabled: Deprecated in 1.1.0</h2>
+					<p>Prior to jQuery Mobile 1.1, true fixed toolbar support was contingent on native browser support for the CSS property <code>overflow-scrolling: touch</code>, which is currently only supported in iOS5. As of version 1.1, jQuery Mobile no longer uses this CSS property at all. We've removed all internal usage of this property in the framework, but we've left it defined globally on the $.mobile object to reduce the risk that its removal will cause trouble with existing applications. This property is flagged for removal, so please update your code to no longer use it. The support test for this property, however, remains defined under <code>$.support</code> and we have no plans to remove that test at this time. </p>
+			</div>
+			<h2 id="ios5">touchOverflow: Improved page transitions and true fixed toolbars</h2>
+			<p>Currently, both the page you're viewing and the one you're navigating to are sitting next to each other in the viewport, which lets us leverage native scrolling for the broadest possible device support. The downside to this approach is that since both pages share the same viewport, when a page transition starts, we must first scroll to the top of the document, then start animating to ensure that the pages are lined up vertically. If you hit the Back button, we need to scroll up, transition, then restore the previous scroll position. Since mobile browsers are pretty slow, these scroll movements can detract from the flow of the experience.</p>
+			<p>The way to really improve this situation is to have both pages in separate containers, each with its own internal scroll bar. The means no more scrolling the document or needing to restore scroll positions for a smoother experience. It also has the benefit of making fixed toolbars very easy to implement by simply placing them outside the containers with internal scrolling.<p>
+			<h2>How it works</h2>
+			<p>To leverage iOS5&#8242;s support for a touch-targeted version of <code>overflow:auto</code> which allows for internal scrolling regions with the native momentum scrolling, we've added a feature called touchOverflow that leverages these new CSS capabilities to  enable us to bring both true &#8220;fixed&#8221; toolbars and super smooth transitions to iOS5, all by using web standards and very little additional code.</p>
+			<p>A feature called <code>touchOverflowEnabled</code> is designed to leverage the upcoming wave of browsers that support overflow scrolling in CSS. Note that this feature is off by default to give us more time to test and debug this for best performance but we hope to turn it on by default at a later point. Here's how to enable this <a href="../api/globalconfig.html">global option</a>:</p>
+<pre><code>&lt;script&gt;
+$(document).bind(&quot;mobileinit&quot;, function(){
+<strong>  $.mobile.touchOverflowEnabled = true;
+</strong>});
+&lt;/script&gt;</code></pre>
+			<p>When this feature is activated, the framework looks for browser support for both the <code>overflow:</code> and <code>-webkit-overflow-scrolling:touch</code> CSS properties. In browsers that support both, it switches to a dual page container model with native overflow: scrolling within each, which brings true fixed toolbars smooth transitions. Coupled with iOS&#8217;s already excellent hardware-accelerated transitions, it's now possible to build interfaces that are very close to native performance.</p>
+			<p>To demo this feature, check out <a href="../config/touchOverflow.html">this page</a> in iOS5.</p>
+			<h2>A few downsides</h2>
+			<p>Nothing is perfect, especially a new feature, so there are a few downsides to keep in mind.  When activating this feature:</p>
+			<ul>
+				<li>Sometimes child elements like lists and forms wouldn't render when embedded in a page with <code>overflow:</code> in iOS5. This was a pretty random phenomenon but is not acceptable so we've added a <code>translate-z</code> CSS property which forces iOS to render the contents. The downside with this fix is that when a transform is applied, all elements are set to position:relative which can cause issues in your layout.</li>
+				<li>The <code>-webkit-overflow-scrolling:touch</code> property seems to disable the events to scroll you to the top of the page when the time is tapped in the status bar. We hope Apple fixes this because it's a very useful feature.</li>
+				<li>When <code>overflow:</code> and <code>-webkit-overflow-scrolling:touch</code> properties are set, iOS appears to ignore any overflow:hidden properties on the parent, which is the page in our case. So if you have an image or code block that is wider than the viewport, horizontal scrolling will be seen. </li>
+				<li>When this feature is active, we are disabling user zoom by manipulating the meta viewport tag because both the toolbars and page content can easily be zoomed to an odd size and it's very difficult to zoom back out. Even though we believe in allowing users to zoom the page, alleviating the usability concerns we have with fixed toolbars and overflow containers is more important.</li>
+				<li>Scroll position can be lost when going back to a page that has been re-loaded. If DOM caching is on, this shouldn't be as much of an issue.</li>
+				<li>This is still an experimental feature, so not all the kinks have been worked out yet. Use with caution and test thoroughly.</li>
+			</ul>
+			<h2>Don&#8217;t other mobile platforms already support overflow?</h2>
+			<p>Yes, but there&#8217;s a catch. Both Android Honeycomb and the Blackberry PlayBook support <code>overflow:</code> properties, but we found in testing that their implementation of overflow wasn't smooth enough, so pages would stutter and hang during scrolling, leading to an unusable experience. We're working with device makers to ensure that they are included when performance improves.</p>
+			<p>More importantly, targeting overflow correctly is a major issue. If we simply placed an <code>overflow: auto</code> CSS rule on the pages, other popular mobile platforms like older versions of Android and iOS would essentially just clip off the content and make it effectively inaccessible (yes, you can do a two-finger scroll gesture in iOS but nobody knows that). The smart thing about Apple&#8217;s implementation for iOS5 is that they added an additional CSS property <code>-webkit-overflow-scrolling:touch</code> that allows us to test for this touch scrolling property and, if supported, add in the <code>overflow</code> rules for just those browsers. This is the only safe way to target overflow without resorting to complex and unmaintainable user agent detection.</p>
+			<p>We will be working with device and browser makers to encourage support for <em>both</em> these CSS-based properties because we strongly believe that this a critical piece needed to build rich mobile web apps. The project will add any vendor-prefixed additions to touch scrolling property if, for example, Opera, Firefox or Microsoft added this support. Once people see how much better page transitions and fixed toolbars are on iOS5, we&#8217;re hoping this will be supported quickly by other browsers. JS-based scroller scripts may still have a place in this new world as a polyfill for browsers that don&#8217;t yet support these new CSS capabilities but we see this as a brief, interim tool in the evolution of the mobile web.</p>
+			<h2>Debugging touchOverflow</h2>
+			<p>Generally touchOverflow is only enabled on devices that support touch-scrolling of overflow areas, not desktop browsers.  This can make it difficult to debug problems with the touchOverflow feature.  To enable touchOverflow on all browsers, use the following code:
+<pre><code>&lt;script&gt;
+$(document).bind(&quot;mobileinit&quot;, function() {
+  <strong>$.support.touchOverflow = true;</strong>
+  $.mobile.touchOverflowEnabled = true;
+});
+&lt;/script&gt;</code></pre>
+		</div><!--/content-primary -->
+		<div class="content-secondary">
+					<div data-role="collapsible" data-collapsed="true" data-theme="b" data-content-theme="d">
+							<h3>More in this section</h3>
+							<ul data-role="listview" data-theme="c" data-dividertheme="d">
+								<li data-role="list-divider">Pages &amp; Dialogs</li>
+								<li><a href="page-anatomy.html">Anatomy of a page</a></li>
+								<li><a href="page-template.html" data-ajax="false">Single page template</a></li>
+								<li><a href="multipage-template.html" data-ajax="false">Multi-page template</a></li>
+								<li><a href="page-titles.html">Page titles</a></li>
+								<li><a href="page-links.html">Linking pages</a></li>
+								<li><a href="page-transitions.html">Page transitions</a></li>
+								<li><a href="page-dialogs.html">Dialogs</a></li>
+								<li><a href="page-cache.html">Prefetching &amp; caching pages</a></li>
+								<li><a href="page-navmodel.html">Ajax, hashes &amp; history</a></li>
+								<li><a href="page-dynamic.html">Dynamically injecting pages</a></li>
+								<li><a href="page-scripting.html">Scripting pages</a></li>
+								<li><a href="phonegap.html">PhoneGap apps</a></li>
+								<li data-theme="a"><a href="touchoverflow.html">touchOverflow feature</a></li>
+								<li><a href="pages-themes.html">Theming pages</a></li>
+							</ul>
+					</div>
+				</div>
+			</div><!-- /content -->
+			<div data-role="footer" class="footer-docs" data-theme="c">
+					<p>&copy; 2011-12 The jQuery Foundation</p>
+			</div>
+			</div><!-- /page -->
+			</body>
+			</html>

data/lib/ruby_app/resources/elements/mobile/document/jquery.mobile-1.1.0/demos/docs/pages/transition-success.html ADDED

@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html>
+	<head>
+	<meta charset="utf-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+	<title>jQuery Mobile Framework - Dialog Example</title>
+	<link rel="stylesheet"  href="../../css/themes/default/jquery.mobile-1.1.0.css" />
+	<link rel="stylesheet" href="../_assets/css/jqm-docs.css"/>
+	<script src="../../js/jquery.js"></script>
+	<script src="../../docs/_assets/js/jqm-docs.js"></script>
+	<script src="../../js/jquery.mobile-1.1.0.js"></script>
+</head>
+<body>
+<div data-role="page">
+	<div data-role="header" data-theme="e">
+		<h1>Ta-da!</h1>
+	</div><!-- /header -->
+	<div data-role="content" data-theme="e">
+		<p>That was an animated page transition effect that we added with a <code>data-transition</code> attribute on the link.</p>
+		<p>Since it uses CSS transforms, this should be hardware accelerated on many mobile devices.</p>
+		<p>What do you think?</p>
+		<a href="docs-transitions.html" data-role="button" data-theme="b" data-rel="back">I like it</a>
+	</div>
+</div>
+</body>
+</html>

data/lib/ruby_app/resources/elements/mobile/document/jquery.mobile-1.1.0/demos/docs/toolbars/bars-fixed-events.html ADDED

@@ -0,0 +1,84 @@
+<!DOCTYPE html>
+<html>
+	<head>
+	<meta charset="utf-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+	<title>jQuery Mobile Framework - Fixed Toolbars</title>
+	<link rel="stylesheet"  href="../../css/themes/default/jquery.mobile-1.1.0.css" />
+	<link rel="stylesheet" href="../_assets/css/jqm-docs.css"/>
+	<script src="../../js/jquery.js"></script>
+	<script src="../../docs/_assets/js/jqm-docs.js"></script>
+	<script src="../../js/jquery.mobile-1.1.0.js"></script>
+</head>
+<body>
+<div data-role="page" class="type-interior">
+	<div data-role="header" data-position="fixed" data-theme="f">
+		<h1>Fixed toolbars</h1>
+		<a href="../../" data-icon="home" data-iconpos="notext" data-direction="reverse">Home</a>
+		<a href="../nav.html" data-icon="search" data-iconpos="notext" data-rel="dialog" data-transition="fade">Search</a>
+	</div>
+	<div data-role="content">
+		<div class="content-primary">
+				<h2>Fixed toolbars</h2>
+			    <ul data-role="controlgroup" data-type="horizontal" class="localnav">
+			      <li><a href="bars-fixed.html" data-role="button" data-transition="fade">Basics</a></li>
+			      <li><a href="bars-fixed-options.html" data-role="button" data-transition="fade">Options</a></li>
+			      <li><a href="bars-fixed-methods.html" data-role="button" data-transition="fade">Methods</a></li>
+			      <li><a href="bars-fixed-events.html" data-role="button" data-transition="fade" class="ui-btn-active">Events</a></li>
+			    </ul>
+				<p>The fixedtoolbar plugin has the following custom events:</p>
+				<dl>
+					<dt><code>create</code> triggered when a fixed toolbar is created</dt>
+					<dd>
+						<pre><code>
+$( ".selector" ).fixedtoolbar({
+   create: function(event, ui) { ... }
+});
+						</code></pre>
+					</dd>
+				</div><!--/content-primary -->
+				<div class="content-secondary">
+					<div data-role="collapsible" data-collapsed="true" data-theme="b" data-content-theme="d">
+							<h3>More in this section</h3>
+							<ul data-role="listview" data-theme="c" data-dividertheme="d">
+								<li data-role="list-divider">Toolbars</li>
+								<li><a href="docs-bars.html">Toolbar basics</a></li>
+								<li><a href="docs-headers.html">Header bars</a></li>
+								<li><a href="docs-footers.html">Footer bars</a></li>
+								<li><a href="docs-navbar.html">Navbars</a></li>
+								<li data-theme="a"><a href="bars-fixed.html">Fixed positioning</a></li>
+								<li><a href="footer-persist-a.html">Persistent toolbars</a></li>
+								<li><a href="bars-themes.html">Theming toolbars</a></li>
+							</ul>
+					</div>
+				</div>
+			</div><!-- /content -->
+			<div data-role="footer" class="footer-docs" data-theme="a" data-position="fixed">
+					<h1>Fixed Footer</h1>
+			</div>
+			</div><!-- /page -->
+			</body>
+			</html>