Skip to content

Commit b791e99

Browse files
Demos: added global search.
1 parent 972b26e commit b791e99

File tree

107 files changed

+439
-233
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

107 files changed

+439
-233
lines changed

demos/_assets/css/jqm-demos.css

Lines changed: 25 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -299,8 +299,7 @@ body, .jqm-demos {
299299
.jqm-list .ui-btn-active .ui-li-desc {
300300
color: #fff;
301301
}
302-
.jqm-demos-home .jqm-list .ui-li .ui-btn-text a.ui-link-inherit,
303-
.jqm-demos-index .jqm-list .ui-li .ui-btn-text a.ui-link-inherit {
302+
.jqm-demos .jqm-list .ui-li .ui-btn-text a.ui-link-inherit {
304303
text-overflow: clip;
305304
overflow: visible;
306305
white-space: normal;
@@ -320,11 +319,34 @@ body, .jqm-demos {
320319
margin-bottom: -.5em;
321320
}
322321
.jqm-demos-home .jqm-content > .ui-listview-filter .ui-input-search,
323-
.jqm-demos-index .jqm-content > .ui-listview-filter .ui-input-search {
322+
.jqm-demos-index .jqm-content > .ui-listview-filter .ui-input-search,
323+
.jqm-demos .jqm-search > .ui-listview-filter .ui-input-search {
324324
border-color: #e5e5e5;
325325
border-color: rgba(0, 0, 0, .1);
326326
}
327327

328+
/* Search */
329+
.jqm-search {
330+
position: absolute;
331+
top: 2.5em;
332+
right: 0;
333+
left: auto;
334+
width: 300px;
335+
max-width: 100%;
336+
margin-bottom: 1em;
337+
z-index: 999;
338+
}
339+
.jqm-search > .ui-listview-filter {
340+
margin: 0;
341+
}
342+
.jqm-demos .jqm-search > .ui-listview-filter .ui-input-search {
343+
}
344+
.jqm-demos .jqm-search > .ui-listview-filter .ui-input-search.ui-focus {
345+
-webkit-box-shadow: inset 0px 1px 4px rgba(0, 0, 0, .2);
346+
-moz-box-shadow: inset 0px 1px 4px rgba(0, 0, 0, .2);
347+
box-shadow: inset 0px 1px 4px rgba(0, 0, 0, .2);
348+
}
349+
328350
/* Nav panels */
329351
.jqm-demos .jqm-nav-panel {
330352
margin-top: 10px;

demos/_assets/js/globalnav-panel.js

Lines changed: 0 additions & 48 deletions
This file was deleted.

demos/_assets/js/globalnav.js

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
(function( $, undefined ) {
2+
$( document ).on( "mobileinit", function(){
3+
$.widget( "mobile.listview", $.mobile.listview, {
4+
options: {
5+
theme: null,
6+
countTheme: "c",
7+
headerTheme: "b",
8+
dividerTheme: "b",
9+
icon: "arrow-r",
10+
splitIcon: "arrow-r",
11+
splitTheme: "b",
12+
corners: true,
13+
shadow: true,
14+
inset: false,
15+
initSelector: ":jqmData(role='listview')",
16+
globalNav: false
17+
},
18+
_create: function(){
19+
this._super();
20+
if ( this.options.globalNav ){
21+
this._globalnav();
22+
}
23+
},
24+
_globalnav: function(){
25+
var base = $( "base" ).attr( "href" ).split('demos')[0],
26+
base = base.split('next.html')[0] + this.options.globalNav + "/";
27+
28+
this.element.find( "a" ).each(function() {
29+
var href = base + $( this ).attr( "href" );
30+
$( this ).attr( "href", href );
31+
});
32+
}
33+
});
34+
});
35+
})( jQuery );

demos/_assets/js/index.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
'jqm-demos.js',
55
'view-source.js',
66
'h2widget.js',
7-
'globalnav-panel.js'
7+
'globalnav.js'
88
);
99

1010
require_once('../../../combine.php');

demos/_assets/js/jqm-demos.js

Lines changed: 16 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -66,13 +66,20 @@ $( document ).on( "pageinit", function() {
6666
});
6767

6868

69-
// replace path by full links
70-
$( document ).on( "pagecreate", ".jqm-demos-home, .jqm-demos-index", function() {
71-
var base = $( "base" ).attr( "href" ).split('demos')[0],
72-
base = base.split('next.html')[0] + "demos/";
73-
74-
$( this ).find( ".jqm-content .jqm-list.jqm-include a" ).each(function() {
75-
var href = base + $( this ).attr( "href" );
76-
$( this ).attr( "href", href );
77-
});
69+
// global search
70+
$( document ).on( "pageinit", ".jqm-demos", function() {
71+
$( this ).find( ".jqm-search ul" ).listview({
72+
globalNav: "demos",
73+
inset: true,
74+
theme: "d",
75+
dividerTheme: "d",
76+
icon: false,
77+
filter: true,
78+
filterReveal: true,
79+
filterPlaceholder: "Search...",
80+
autodividers: true,
81+
autodividersSelector: function ( li ) {
82+
return "";
83+
}
84+
});
7885
});

demos/examples/backbone-require/index.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@
2222
<h1>jQuery Mobile</h1>
2323
<a href="#panel-nav" data-icon="bars" data-iconpos="notext">Navigation</a>
2424
<a href="../../../" data-icon="home" data-iconpos="notext" data-ajax="false">Home</a>
25+
<?php include( '../../search.html' ); ?>
2526
</div><!-- /header -->
2627

2728
<div data-role="content" class="jqm-content">
@@ -148,7 +149,7 @@ <h1>jQuery Mobile, Backbone.js and Require.js</h1>
148149
<p>Copyright 2013 The jQuery Foundation</p>
149150
</div><!-- /footer -->
150151

151-
<?php include( '../../nav.html' ); ?>
152+
<?php include( '../../global-nav.html' ); ?>
152153

153154
</div><!-- /page -->
154155
</body>

demos/examples/index.html

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@
1919
<h1>jQuery Mobile</h1>
2020
<a href="#panel-nav" data-icon="bars" data-iconpos="notext">Navigation</a>
2121
<a href="../../" data-icon="home" data-iconpos="notext" data-ajax="false">Home</a>
22+
<?php include( '../search.html' ); ?>
2223
</div><!-- /header -->
2324

2425
<div data-role="content" class="jqm-content">
@@ -27,7 +28,7 @@ <h1>Demo Showcase</h1>
2728

2829
<p class="jqm-intro">This section explores how you can customize, extend, re-style and take full advantage of jQuery Mobile.</p>
2930

30-
<ul data-role="listview" data-inset="true" data-filter="true" data-theme="d" data-divider-theme="d" data-icon="false" class="jqm-list jqm-include" data-filter-placeholder="Search demos...">
31+
<ul data-role="listview" data-inset="true" data-filter="true" data-theme="d" data-divider-theme="d" data-icon="false" data-filter-placeholder="Search demos..." data-global-nav="demos" class="jqm-list">
3132
<?php include( '../nav-examples.html' ); ?>
3233
</ul>
3334

@@ -39,7 +40,7 @@ <h1>Demo Showcase</h1>
3940
<p>Copyright 2013 The jQuery Foundation</p>
4041
</div><!-- /footer -->
4142

42-
<?php include( '../nav.html' ); ?>
43+
<?php include( '../global-nav.html' ); ?>
4344

4445
</div><!-- /page -->
4546
</body>

demos/examples/listviews/autodividers-linkbar.html

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@
2121
<h1>jQuery Mobile</h1>
2222
<a href="#panel-nav" data-icon="bars" data-iconpos="notext">Navigation</a>
2323
<a href="../../../" data-icon="home" data-iconpos="notext" data-ajax="false">Home</a>
24+
<?php include( '../../search.html' ); ?>
2425
</div><!-- /header -->
2526

2627
<div data-role="content" class="jqm-content">
@@ -41,7 +42,7 @@ <h1>Listview Autodivider Linkbar</h1>
4142
<p>Copyright 2013 The jQuery Foundation</p>
4243
</div><!-- /footer -->
4344

44-
<?php include( '../../nav.html' ); ?>
45+
<?php include( '../../global-nav.html' ); ?>
4546

4647
</div><!-- /page -->
4748

@@ -54,6 +55,7 @@ <h1>Listview Autodivider Linkbar</h1>
5455
<div data-role="header">
5556
<h1>Listview Autodivider Linkbar</h1>
5657
<a href="../../../" data-icon="home" data-iconpos="notext" data-ajax="false">Home</a>
58+
<?php include( '../../search.html' ); ?>
5759
</div><!-- /header -->
5860

5961
<div data-role="content">

demos/examples/listviews/autodividers-selector.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,7 @@
3737
<h1>jQuery Mobile</h1>
3838
<a href="#panel-nav" data-icon="bars" data-iconpos="notext">Navigation</a>
3939
<a href="../../../" data-icon="home" data-iconpos="notext" data-ajax="false">Home</a>
40+
<?php include( '../../search.html' ); ?>
4041
</div><!-- /header -->
4142

4243
<div data-role="content" class="jqm-content">
@@ -73,7 +74,7 @@ <h1>Custom autodivider selector</h1>
7374
<p>Copyright 2013 The jQuery Foundation</p>
7475
</div><!-- /footer -->
7576

76-
<?php include( '../../nav.html' ); ?>
77+
<?php include( '../../global-nav.html' ); ?>
7778

7879
</div><!-- /page -->
7980
</body>

demos/examples/listviews/grid-listview.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@
2020
<h1>jQuery Mobile</h1>
2121
<a href="#panel-nav" data-icon="bars" data-iconpos="notext">Navigation</a>
2222
<a href="../../../" data-icon="home" data-iconpos="notext" data-ajax="false">Home</a>
23+
<?php include( '../../search.html' ); ?>
2324
</div><!-- /header -->
2425

2526
<div data-role="content" class="jqm-content">
@@ -48,7 +49,7 @@ <h2>Starting points</h2>
4849
<p>Copyright 2013 The jQuery Foundation</p>
4950
</div><!-- /footer -->
5051

51-
<?php include( '../../nav.html' ); ?>
52+
<?php include( '../../global-nav.html' ); ?>
5253

5354
</div><!-- /page -->
5455

demos/examples/panels/panel-styling.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -129,6 +129,7 @@
129129
<h1>jQuery Mobile</h1>
130130
<a href="#panel-nav" data-icon="bars" data-iconpos="notext">Navigation</a>
131131
<a href="../../../" data-icon="home" data-iconpos="notext" data-ajax="false">Home</a>
132+
<?php include( '../../search.html' ); ?>
132133
</div><!-- /header -->
133134

134135
<div data-role="content" class="jqm-content">
@@ -156,7 +157,7 @@ <h1>Panel styling</h1>
156157
<p>Copyright 2013 The jQuery Foundation</p>
157158
</div><!-- /footer -->
158159

159-
<?php include( '../../nav.html' ); ?>
160+
<?php include( '../../global-nav.html' ); ?>
160161

161162
</div><!-- /page -->
162163

demos/examples/panels/panel-swipe-open.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,7 @@
6262
<h1>jQuery Mobile</h1>
6363
<a href="#panel-nav" data-icon="bars" data-iconpos="notext">Navigation</a>
6464
<a href="../../../" data-icon="home" data-iconpos="notext" data-ajax="false">Home</a>
65+
<?php include( '../../search.html' ); ?>
6566
</div><!-- /header -->
6667

6768
<div data-role="content" class="jqm-content">
@@ -83,7 +84,7 @@ <h1>Open panel on swipe</h1>
8384
<p>Copyright 2013 The jQuery Foundation</p>
8485
</div><!-- /footer -->
8586

86-
<?php include( '../../nav.html' ); ?>
87+
<?php include( '../../global-nav.html' ); ?>
8788

8889
</div><!-- /page -->
8990

demos/examples/popups/dynamic-popup.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -74,6 +74,7 @@
7474
<h1>jQuery Mobile</h1>
7575
<a href="#panel-nav" data-icon="bars" data-iconpos="notext">Navigation</a>
7676
<a href="../../../" data-icon="home" data-iconpos="notext" data-ajax="false">Home</a>
77+
<?php include( '../../search.html' ); ?>
7778
</div><!-- /header -->
7879

7980
<div data-role="content" class="jqm-content">
@@ -93,7 +94,7 @@ <h1>Dynamic popup</h1>
9394
<p>Copyright 2013 The jQuery Foundation</p>
9495
</div><!-- /footer -->
9596

96-
<?php include( '../../nav.html' ); ?>
97+
<?php include( '../../global-nav.html' ); ?>
9798

9899
</div><!-- /page -->
99100

demos/examples/redirect/index.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,6 +61,7 @@
6161
<h1>jQuery Mobile</h1>
6262
<a href="#panel-nav" data-icon="bars" data-iconpos="notext">Navigation</a>
6363
<a href="../../../" data-icon="home" data-iconpos="notext" data-ajax="false">Home</a>
64+
<?php include( '../../search.html' ); ?>
6465
</div><!-- /header -->
6566

6667
<div data-role="content" class="jqm-content">
@@ -79,7 +80,7 @@ <h1>Redirect: Source Page</h1>
7980
<p>Copyright 2013 The jQuery Foundation</p>
8081
</div><!-- /footer -->
8182

82-
<?php include( '../../nav.html' ); ?>
83+
<?php include( '../../global-nav.html' ); ?>
8384

8485
</div><!-- /page -->
8586
</body>

demos/examples/slider/tooltip.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@
2020
<h1>jQuery Mobile</h1>
2121
<a href="#panel-nav" data-icon="bars" data-iconpos="notext">Navigation</a>
2222
<a href="../../../" data-icon="home" data-iconpos="notext" data-ajax="false">Home</a>
23+
<?php include( '../../search.html' ); ?>
2324
</div><!-- /header -->
2425

2526
<div data-role="content" class="jqm-content">
@@ -44,7 +45,7 @@ <h1>Slider tooltip extension</h1>
4445
<p>Copyright 2013 The jQuery Foundation</p>
4546
</div><!-- /footer -->
4647

47-
<?php include( '../../nav.html' ); ?>
48+
<?php include( '../../global-nav.html' ); ?>
4849

4950
</div><!-- /page -->
5051
</body>

demos/examples/swipe/swipe-list.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -158,6 +158,7 @@
158158
<h1>jQuery Mobile</h1>
159159
<a href="#panel-nav" data-icon="bars" data-iconpos="notext">Navigation</a>
160160
<a href="../../../" data-icon="home" data-iconpos="notext" data-ajax="false">Home</a>
161+
<?php include( '../../search.html' ); ?>
161162
</div><!-- /header -->
162163

163164
<div data-role="content" class="jqm-content">
@@ -172,7 +173,7 @@ <h1>Swipe to delete list item</h1>
172173

173174
</div><!-- /content -->
174175

175-
<?php include( '../../nav.html' ); ?>
176+
<?php include( '../../global-nav.html' ); ?>
176177

177178
</div><!-- /page -->
178179

demos/examples/swipe/swipe-page.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@
2222
<h1>jQuery Mobile</h1>
2323
<a href="#panel-nav" data-icon="bars" data-iconpos="notext">Navigation</a>
2424
<a href="../../../" data-icon="home" data-iconpos="notext" data-ajax="false">Home</a>
25+
<?php include( '../../search.html' ); ?>
2526
</div><!-- /header -->
2627

2728
<div data-role="content" class="jqm-content">
@@ -41,7 +42,7 @@ <h1>Swipe to navigate</h1>
4142
<p>Copyright 2013 The jQuery Foundation</p>
4243
</div><!-- /footer -->
4344

44-
<?php include( '../../nav.html' ); ?>
45+
<?php include( '../../global-nav.html' ); ?>
4546

4647
</div><!-- /page -->
4748

0 commit comments

Comments
 (0)