Skip to content

Commit 83cd1b2

Browse files
arschmitzjaspermdegroot
authored andcommitted
Demos: fix demos search panel and page Fixes jquery-archive#6619 - Demos: fix search panel and page
1 parent 35f5311 commit 83cd1b2

File tree

8 files changed

+249
-239
lines changed

8 files changed

+249
-239
lines changed

demos/_assets/css/jqm-demos.css

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -628,3 +628,42 @@
628628
color: #fff;
629629
text-shadow: none;
630630
}
631+
/* CSS for keywords highlighting in search results */
632+
.jqm-search-results-highlight {
633+
color: #07ade0;
634+
font-weight: 400;
635+
text-shadow: none;
636+
}
637+
.ui-btn-active .jqm-search-results-highlight,
638+
.ui-focus .jqm-search-results-highlight {
639+
color: #fff;
640+
text-shadow: 0 1px 0 #369;
641+
}
642+
.jqm-search .jqm-list .ui-li .ui-btn-text a.ui-link-inherit,
643+
.jqm-search-results-wrap .jqm-list .ui-li .ui-btn-text a.ui-link-inherit {
644+
padding: .5626em 15px;
645+
font-weight: 400;
646+
}
647+
.jqm-list .jqm-search-results-keywords {
648+
padding: 6px 0 0;
649+
font-size: .8em;
650+
font-weight: 300;
651+
color: #999;
652+
display:block;
653+
}
654+
.jqm-search-results-keywords .jqm-keyword-hash {
655+
margin-right: .2em;
656+
margin-left: .2em;
657+
font-weight: 400;
658+
color: #aaa;
659+
font-size: .75em;
660+
text-transform: uppercase;
661+
}
662+
.ui-btn-active .jqm-search-results-keywords,
663+
.ui-focus .jqm-search-results-keywords,
664+
.ui-btn-active .jqm-search-results-keywords .jqm-keyword-hash,
665+
.ui-focus .jqm-search-results-keywords .jqm-keyword-hash {
666+
color: #fff;
667+
text-shadow: 0 1px 0 #369;
668+
font-weight: 400;
669+
}

demos/_assets/js/globalnav.js

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

demos/_assets/js/index.php

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,7 @@
33
$files = array(
44
'jqm-demos.js',
55
'view-source.js',
6-
'h2widget.js',
7-
'globalnav.js'
6+
'h2widget.js'
87
);
98

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

demos/_assets/js/jqm-demos.js

Lines changed: 35 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,9 @@ $( document ).on( "pagecreate", function() {
6767
});
6868

6969
$( document ).on( "pagecreate", ".jqm-demos", function() {
70-
var page = $( this );
70+
var page = $( this ),
71+
searchUrl = ( $( this ).hasClass( "jqm-home") )? "_search/": "../_search/",
72+
searchContents = $( ".jqm-search ul.jqm-list").find( "li:not(.ui-collapsible)" );
7173

7274
// global navmenu panel
7375
$( ".jqm-navmenu-link" ).on( "click", function() {
@@ -78,9 +80,8 @@ $( document ).on( "pagecreate", ".jqm-demos", function() {
7880
$( ".jqm-search-link" ).on( "click", function() {
7981
page.find( ".jqm-search-panel" ).panel( "open" );
8082
});
81-
82-
$( this ).find( ".jqm-search ul.jqm-list" ).listview({
83-
globalNav: "demos",
83+
84+
$( this ).find( ".jqm-search ul.jqm-list" ).html( searchContents ).listview({
8485
inset: false,
8586
theme: null,
8687
dividerTheme: null,
@@ -92,11 +93,10 @@ $( document ).on( "pagecreate", ".jqm-demos", function() {
9293
arrowKeyNav: true,
9394
enterToNav: true,
9495
highlight: true,
95-
submitTo: "_search/"
96-
});
96+
submitTo: searchUrl
97+
}).filterable();
9798

98-
$( this ).find( ".jqm-content ul.jqm-list" ).listview({
99-
globalNav: "demos",
99+
$( this ).find( ".jqm-content ul.jqm-list" ).html( searchContents ).listview({
100100
inset: true,
101101
theme: null,
102102
dividerTheme: null,
@@ -112,16 +112,24 @@ $( document ).on( "pagecreate", ".jqm-demos", function() {
112112
});
113113
});
114114

115+
//fix links on homepage to point to sub directories
116+
$( document ).on( "pagecreate", ".jqm-home", function(){
117+
$( this ).find( "a" ).each( function() {
118+
$( this ).attr( "href", $( this ).attr( "href" ).replace( "../", "" ) );
119+
});
120+
});
121+
115122
$( document ).on( "pageshow", ".jqm-demos", function() {
116123
$( this ).find( ".jqm-search input" ).attr( "autocomplete", "off" ).attr( "autocorrect", "off" );
117124
});
118125

119-
$( document ).on( "pageshow", ".jqm-demos-search-results", function() {
120-
var search = $.mobile.path.parseUrl( window.location.href ).search.split( "=" )[1], self = this;
126+
$( document ).on( "pagecreate", ".jqm-demos-search-results", function() {
127+
var search = $.mobile.path.parseUrl( window.location.href ).search.split( "=" )[1],
128+
that = this;
121129
setTimeout(function() {
122130
e = $.Event( "keyup" );
123131
e.which = 65;
124-
$( self ).find( ".jqm-content .jqm-search-results-wrap input" ).val( search ).trigger(e).trigger( "change" );
132+
$( that ).find( ".jqm-content .jqm-search-results-wrap input" ).val( search ).trigger(e).trigger( "change" );
125133
}, 0 );
126134
});
127135

@@ -176,7 +184,6 @@ $( document ).on( "mobileinit", function() {
176184
corners: true,
177185
shadow: true,
178186
inset: false,
179-
initSelector: ":jqmData(role='listview')",
180187
arrowKeyNav: false,
181188
enterToNav: false,
182189
highlight: false,
@@ -200,9 +207,7 @@ $( document ).on( "mobileinit", function() {
200207
form.attr( "method", "get" )
201208
.attr( "action", this.options.submitTo );
202209

203-
var base = $( "base" ).attr( "href" ).split( "demos" )[0];
204-
base = base.split( "index.html" )[0] + "demos" + "/";
205-
url = base + this.options.submitTo + "?search=" + this.element.parent().find( "input" ).val();
210+
var url = this.options.submitTo + "?search=" + this.element.parent().find( "input" ).val();
206211

207212
$( ":mobile-pagecontainer" ).pagecontainer( "change", url );
208213
},
@@ -221,7 +226,7 @@ $( document ).on( "mobileinit", function() {
221226
},
222227
enhanced: false,
223228
arrowKeyNav: function() {
224-
var input = this.element.parent().find( "input" );
229+
var input = this.element.prev("form").find( "input" );
225230

226231
if ( !this.enhanced ) {
227232
this._on( input, {
@@ -232,24 +237,25 @@ $( document ).on( "mobileinit", function() {
232237
}
233238
},
234239
handleKeyUp: function( e ) {
235-
var input = this.element.parent().find( "input" );
240+
var input = this.element.prev("form").find( "input" );
236241

237-
if ( e.which === $.mobile.keyCode.DOWN ) {
242+
if ( e.which === $.ui.keyCode.DOWN ) {
238243
if ( this.element.find( "li.ui-btn-active" ).length == 0 ) {
239-
this.element.find( "li:first" ).toggleClass( "ui-btn-active" );
244+
this.element.find( "li:first" ).toggleClass( "ui-btn-active" ).find("a").toggleClass( "ui-btn-active" );
240245
} else {
241-
this.element.find( "li.ui-btn-active" ).toggleClass( "ui-btn-active" ).next().toggleClass( "ui-btn-active" );
246+
this.element.find( "li.ui-btn-active a" ).toggleClass( "ui-btn-active");
247+
this.element.find( "li.ui-btn-active" ).toggleClass( "ui-btn-active" ).next().toggleClass( "ui-btn-active" ).find("a").toggleClass( "ui-btn-active" );
242248
}
243249

244250
this.highlightDown();
245-
} else if ( e.which === $.mobile.keyCode.UP ) {
251+
} else if ( e.which === $.ui.keyCode.UP ) {
246252
if ( this.element.find( "li.ui-btn-active" ).length !== 0 ) {
247-
this.element.find( "li.ui-btn-active" ).toggleClass( "ui-btn-active" ).prev().toggleClass( "ui-btn-active" );
248-
249-
this.highlightUp()
253+
this.element.find( "li.ui-btn-active a" ).toggleClass( "ui-btn-active");
254+
this.element.find( "li.ui-btn-active" ).toggleClass( "ui-btn-active" ).prev().toggleClass( "ui-btn-active" ).find("a").toggleClass( "ui-btn-active" );
250255
} else {
251-
this.element.find( "li:last" ).toggleClass( "ui-btn-a" ).toggleClass( "ui-btn-active" );
256+
this.element.find( "li:last" ).toggleClass( "ui-btn-active" ).find("a").toggleClass( "ui-btn-active" );
252257
}
258+
this.highlightUp();
253259
} else if ( typeof e.which !== "undefined" ) {
254260
this.element.find( "li.ui-btn-active" ).removeClass( "ui-btn-active" );
255261

@@ -277,16 +283,16 @@ $( document ).on( "mobileinit", function() {
277283
},
278284
highlightDown: function() {
279285
if ( this.element.find( "li.ui-btn-active" ).hasClass( "ui-screen-hidden" ) ) {
280-
this.element.find( "li.ui-btn-active" ).toggleClass( "ui-btn-active" ).next().toggleClass( "ui-btn-active" );
281-
286+
this.element.find( "li.ui-btn-active" ).find("a").toggleClass( "ui-btn-active" );
287+
this.element.find( "li.ui-btn-active" ).toggleClass( "ui-btn-active" ).next().toggleClass( "ui-btn-active" ).find("a").toggleClass( "ui-btn-active" );
282288
this.highlightDown();
283289
}
284290
return;
285291
},
286292
highlightUp: function() {
287293
if ( this.element.find( "li.ui-btn-active" ).hasClass( "ui-screen-hidden" ) ) {
288-
this.element.find( "li.ui-btn-active" ).toggleClass( "ui-btn-active" ).prev().toggleClass( "ui-btn-active" );
289-
294+
this.element.find( "li.ui-btn-active" ).find("a").toggleClass( "ui-btn-active" );
295+
this.element.find( "li.ui-btn-active" ).toggleClass( "ui-btn-active" ).prev().toggleClass( "ui-btn-active" ).find("a").toggleClass( "ui-btn-active" );
290296
this.highlightUp();
291297
}
292298
return;

demos/_search/index.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@
2727

2828
<h2>Search Results</h2>
2929
<div class="jqm-search-results-wrap">
30-
<ul class="jqm-list jqm-search-results-list">
30+
<ul class="jqm-list jqm-search-results-list" data-filter="true">
3131
<?php include( '../jqm-contents.php' ); ?>
3232
</ul>
3333
</div>

0 commit comments

Comments
 (0)