Skip to content
This repository was archived by the owner on Oct 8, 2021. It is now read-only.

Commit 43d3a0a

Browse files
committed
Merge branch 'master' of github.com:jquery/jquery-mobile
2 parents 7a7601a + 6fe7844 commit 43d3a0a

38 files changed

+26874
-24
lines changed

css/structure/jquery.mobile.forms.select.css

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,6 @@ label.ui-select { font-size: 16px; line-height: 1.4; font-weight: normal; margin
3434
.ui-selectmenu { padding: 6px; min-width: 160px; }
3535
.ui-selectmenu .ui-listview { margin: 0; }
3636
.ui-selectmenu .ui-btn.ui-li-divider { cursor: default; }
37-
.ui-selectmenu-hidden { top: -99999px; left: -9999px; }
3837
.ui-screen-hidden, .ui-selectmenu-list .ui-li .ui-icon { display: none; }
3938
.ui-selectmenu-list .ui-li .ui-icon { display: block; }
4039
.ui-li.ui-selectmenu-placeholder { display: none; }

css/structure/jquery.mobile.popup.css

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -169,4 +169,6 @@
169169
.ui-popup.ui-corner-all > .ui-footer:only-child {
170170
-webkit-border-radius: inherit;
171171
border-radius: inherit;
172-
}
172+
}
173+
174+
.ui-popup-hidden { top: -99999px; left: -9999px; }
Lines changed: 83 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
1+
<!doctype html>
2+
<html class="no-js ui-mobile-rendering" lang="en">
3+
<head>
4+
<title>Backbone.js, Require.js, and jQuery Mobile</title>
5+
<meta name="description" content="">
6+
7+
<meta name="viewport" content="width=device-width, initial-scale=1">
8+
9+
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
10+
<script src="js/libs/require.js" data-main="js/mobile"></script>
11+
</head>
12+
<body>
13+
14+
<div id="categories" data-role="page" data-title="Categories">
15+
16+
<div data-role="header">
17+
<h1>Categories</h1>
18+
</div><!-- /header -->
19+
20+
<div data-role="content">
21+
<h2>Select a Category Below:</h2>
22+
<ul data-role="listview" data-inset="true">
23+
<li><a href="#category?animals" class="animals">Animals</a></li>
24+
<li><a href="#category?colors" class="colors">Colors</a></li>
25+
<li><a href="#category?vehicles" class="vehicles">Vehicles</a></li>
26+
</ul>
27+
</div><!-- /content -->
28+
29+
</div>
30+
31+
<div id="animals" data-role="page" data-title="Animals">
32+
33+
<div data-role="header">
34+
<h1>Animals</h1>
35+
</div><!-- /header -->
36+
37+
<div data-role="content">
38+
<ul data-role="listview" data-inset="true">
39+
</ul>
40+
</div><!-- /content -->
41+
</div>
42+
43+
<div id="colors" data-role="page" data-title="Colors">
44+
45+
<div data-role="header">
46+
<h1>Colors</h1>
47+
</div><!-- /header -->
48+
49+
<div data-role="content">
50+
<ul data-role="listview" data-inset="true">
51+
</ul>
52+
</div><!-- /content -->
53+
54+
</div>
55+
56+
<div id="vehicles" data-role="page" data-title="Vehicles">
57+
58+
<div data-role="header">
59+
<h1>Vehicles</h1>
60+
</div><!-- /header -->
61+
62+
<div data-role="content">
63+
<ul data-role="listview" data-inset="true">
64+
</ul>
65+
</div><!-- /content -->
66+
67+
</div>
68+
69+
<!-- Underscore Template that is used to display all of the Category Models -->
70+
<script id="categoryItems" type="text/template">
71+
72+
<% _.each( collection.toJSON(), function( category, id ) { %>
73+
74+
<li class="ui-li ui-li-static ui-btn-up-c ui-corner-top">
75+
<%= category.type %>
76+
</li>
77+
78+
<% }); %>
79+
80+
</script>
81+
82+
</body>
83+
</html>
Lines changed: 98 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,98 @@
1+
// Category Collection
2+
// ===================
3+
4+
// Includes file dependencies
5+
define([ "jquery","backbone","models/CategoryModel" ], function( $, Backbone, CategoryModel ) {
6+
7+
// Extends Backbone.Router
8+
var Collection = Backbone.Collection.extend( {
9+
10+
// The Collection constructor
11+
initialize: function( models, options ) {
12+
13+
// Sets the type instance property (ie. animals)
14+
this.type = options.type;
15+
16+
},
17+
18+
// Sets the Collection model property to be a Category Model
19+
model: CategoryModel,
20+
21+
// Sample JSON data that in a real app will most likely come from a REST web service
22+
jsonArray: [
23+
24+
{ "category": "animals", "type": "Pets" },
25+
26+
{ "category": "animals", "type": "Farm Animals" },
27+
28+
{ "category": "animals", "type": "Wild Animals" },
29+
30+
{ "category": "colors", "type": "Blue" },
31+
32+
{ "category": "colors", "type": "Green" },
33+
34+
{ "category": "colors", "type": "Orange" },
35+
36+
{ "category": "colors", "type": "Purple" },
37+
38+
{ "category": "colors", "type": "Red" },
39+
40+
{ "category": "colors", "type": "Yellow" },
41+
42+
{ "category": "colors", "type": "Violet" },
43+
44+
{ "category": "vehicles", "type": "Cars" },
45+
46+
{ "category": "vehicles", "type": "Planes" },
47+
48+
{ "category": "vehicles", "type": "Construction" }
49+
50+
],
51+
52+
// Overriding the Backbone.sync method (the Backbone.fetch method calls the sync method when trying to fetch data)
53+
sync: function( method, model, options ) {
54+
55+
// Local Variables
56+
// ===============
57+
58+
// Instantiates an empty array
59+
var categories = [],
60+
61+
// Stores the this context in the self variable
62+
self = this,
63+
64+
// Creates a jQuery Deferred Object
65+
deferred = $.Deferred();
66+
67+
// Uses a setTimeout to mimic a real world application that retrieves data asynchronously
68+
setTimeout( function() {
69+
70+
// Filters the above sample JSON data to return an array of only the correct category type
71+
categories = _.filter( self.jsonArray, function( row ) {
72+
73+
return row.category === self.type;
74+
75+
} );
76+
77+
// Calls the options.success method and passes an array of objects (Internally saves these objects as models to the current collection)
78+
options.success( categories );
79+
80+
// Triggers the custom `added` method (which the Category View listens for)
81+
self.trigger( "added" );
82+
83+
// Resolves the deferred object (this triggers the changePage method inside of the Category Router)
84+
deferred.resolve();
85+
86+
}, 1000);
87+
88+
// Returns the deferred object
89+
return deferred;
90+
91+
}
92+
93+
} );
94+
95+
// Returns the Model class
96+
return Collection;
97+
98+
} );

0 commit comments

Comments
 (0)