You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
311 lines
9.8 KiB
311 lines
9.8 KiB
// Turn off Ajax for local file browsing |
|
if ( location.protocol.substr(0,4) === 'file' || |
|
location.protocol.substr(0,11) === '*-extension' || |
|
location.protocol.substr(0,6) === 'widget' ) { |
|
|
|
// Start with links with only the trailing slash and that aren't external links |
|
var fixLinks = function() { |
|
$( "a[href$='/'], a[href='.'], a[href='..']" ).not( "[rel='external']" ).each( function() { |
|
if( !$( this ).attr( "href" ).match("http") ){ |
|
this.href = $( this ).attr( "href" ).replace( /\/$/, "" ) + "/index.html"; |
|
} |
|
}); |
|
}; |
|
|
|
// Fix the links for the initial page |
|
$( fixLinks ); |
|
|
|
// Fix the links for subsequent ajax page loads |
|
$( document ).on( "pagecreate", fixLinks ); |
|
|
|
// Check to see if ajax can be used. This does a quick ajax request and blocks the page until its done |
|
$.ajax({ |
|
url: '.', |
|
async: false, |
|
isLocal: true |
|
}).error(function() { |
|
// Ajax doesn't work so turn it off |
|
$( document ).on( "mobileinit", function() { |
|
$.mobile.ajaxEnabled = false; |
|
|
|
var message = $( '<div>' , { |
|
'class': "jqm-content", |
|
style: "border:none; padding: 10px 15px; overflow: auto;", |
|
'data-ajax-warning': true |
|
}); |
|
|
|
message |
|
.append( "<h3>Note: Navigation may not work if viewed locally</h3>" ) |
|
.append( "<p>The Ajax-based navigation used throughout the jQuery Mobile docs may need to be viewed on a web server to work in certain browsers. If you see an error message when you click a link, please try a different browser.</p>" ); |
|
|
|
$( document ).on( "pagecreate", function( event ) { |
|
$( event.target ).append( message ); |
|
}); |
|
}); |
|
}); |
|
} |
|
|
|
$( document ).on( "pagecreate", ".jqm-demos", function( event ) { |
|
var search, |
|
page = $( this ), |
|
that = this, |
|
searchUrl = ( $( this ).hasClass( "jqm-home" ) ) ? "_search/" : "../_search/", |
|
searchContents = $( ".jqm-search ul.jqm-list" ).find( "li:not(.ui-collapsible)" ), |
|
version = $.mobile.version || "dev", |
|
words = version.split( "-" ), |
|
ver = words[0], |
|
str = words[1] || "", |
|
text = ver; |
|
|
|
// Insert jqm version in header |
|
if ( str.indexOf( "rc" ) == -1 ) { |
|
str = str.charAt( 0 ).toUpperCase() + str.slice( 1 ); |
|
} else { |
|
str = str.toUpperCase().replace( ".", "" ); |
|
} |
|
|
|
if ( $.mobile.version && str ) { |
|
text += " " + str; |
|
} |
|
|
|
$( ".jqm-version" ).html( text ); |
|
|
|
// Global navmenu panel |
|
$( ".jqm-navmenu-panel ul" ).listview(); |
|
|
|
$( document ).on( "panelopen", ".jqm-search-panel", function() { |
|
$( this ).find( "input" ).focus(); |
|
}) |
|
|
|
$( ".jqm-navmenu-link" ).on( "click", function() { |
|
page.find( ".jqm-navmenu-panel:not(.jqm-panel-page-nav)" ).panel( "open" ); |
|
}); |
|
|
|
// Turn off autocomplete / correct for demos search |
|
$( this ).find( ".jqm-search input" ).attr( "autocomplete", "off" ).attr( "autocorrect", "off" ); |
|
|
|
// Global search |
|
$( ".jqm-search-link" ).on( "click", function() { |
|
page.find( ".jqm-search-panel" ).panel( "open" ); |
|
}); |
|
|
|
// Initalize search panel list and filter also remove collapsibles |
|
$( this ).find( ".jqm-search ul.jqm-list" ).html( searchContents ).listview({ |
|
inset: false, |
|
theme: null, |
|
dividerTheme: null, |
|
icon: false, |
|
autodividers: true, |
|
autodividersSelector: function ( li ) { |
|
return ""; |
|
}, |
|
arrowKeyNav: true, |
|
enterToNav: true, |
|
highlight: true, |
|
submitTo: searchUrl |
|
}).filterable(); |
|
|
|
// Initalize search page list and remove collapsibles |
|
$( this ).find( ".jqm-search-results-wrap ul.jqm-list" ).html( searchContents ).listview({ |
|
inset: true, |
|
theme: null, |
|
dividerTheme: null, |
|
icon: false, |
|
arrowKeyNav: true, |
|
enterToNav: true, |
|
highlight: true |
|
}).filterable(); |
|
|
|
// Fix links on homepage to point to sub directories |
|
if ( $( event.target ).hasClass( "jqm-home") ) { |
|
$( this ).find( "a" ).each( function() { |
|
$( this ).attr( "href", $( this ).attr( "href" ).replace( "../", "" ) ); |
|
}); |
|
} |
|
|
|
// Search results page get search query string and enter it into filter then trigger keyup to filter |
|
if ( $( event.target ).hasClass( "jqm-demos-search-results") ) { |
|
search = $.mobile.path.parseUrl( window.location.href ).search.split( "=" )[ 1 ]; |
|
setTimeout(function() { |
|
e = $.Event( "keyup" ); |
|
e.which = 65; |
|
$( that ).find( ".jqm-content .jqm-search-results-wrap input" ).val( search ).trigger(e).trigger( "change" ); |
|
}, 0 ); |
|
} |
|
}); |
|
|
|
// Append keywords list to each list item |
|
$( document ).one( "pagecreate", ".jqm-demos", function( event ) { |
|
$( this ).find( ".jqm-search-results-list li, .jqm-search li" ).each(function() { |
|
var text = $( this ).attr( "data-filtertext" ); |
|
|
|
$( this ) |
|
.find( "a" ) |
|
.append( "<span class='jqm-search-results-keywords ui-li-desc'>" + text + "</span>" ); |
|
}); |
|
}); |
|
|
|
// Functions for highlighting text used for keywords highlight in search |
|
jQuery.fn.highlight = function( pat ) { |
|
function innerHighlight( node, pat ) { |
|
var skip = 0; |
|
if ( node.nodeType == 3 ) { |
|
var pos = node.data.toUpperCase().indexOf( pat ); |
|
if ( pos >= 0 ) { |
|
var spannode = document.createElement( "span" ); |
|
spannode.className = "jqm-search-results-highlight"; |
|
var middlebit = node.splitText( pos ); |
|
var endbit = middlebit.splitText( pat.length ); |
|
var middleclone = middlebit.cloneNode( true ); |
|
spannode.appendChild( middleclone ); |
|
middlebit.parentNode.replaceChild( spannode, middlebit ); |
|
skip = 1; |
|
} |
|
} else if ( node.nodeType == 1 && node.childNodes && !/(script|style)/i.test( node.tagName ) ) { |
|
for ( var i = 0; i < node.childNodes.length; ++i ) { |
|
i += innerHighlight( node.childNodes[i], pat ); |
|
} |
|
} |
|
return skip; |
|
} |
|
return this.length && pat && pat.length ? this.each(function() { |
|
innerHighlight( this, pat.toUpperCase() ); |
|
}) : this; |
|
}; |
|
|
|
// Function to remove highlights in text |
|
jQuery.fn.removeHighlight = function() { |
|
return this.find( "span.jqm-search-results-highlight" ).each(function() { |
|
this.parentNode.firstChild.nodeName; |
|
with ( this.parentNode ) { |
|
replaceChild( this.firstChild, this ); |
|
normalize(); |
|
} |
|
}).end(); |
|
}; |
|
|
|
// Extension to listview to add keyboard navigation |
|
$( document ).on( "mobileinit", function() { |
|
(function( $, undefined ) { |
|
|
|
$.widget( "mobile.listview", $.mobile.listview, { |
|
options: { |
|
arrowKeyNav: false, |
|
enterToNav: false, |
|
highlight: false, |
|
submitTo: false |
|
}, |
|
_create: function() { |
|
this._super(); |
|
|
|
if ( this.options.arrowKeyNav ) { |
|
this._on( document, { "pageshow": "arrowKeyNav" }); |
|
} |
|
|
|
if ( this.options.enterToNav ) { |
|
this._on( document, { "pageshow": "enterToNav" }); |
|
} |
|
|
|
}, |
|
submitTo: function() { |
|
var url, |
|
form = this.element.parent().find( "form" ); |
|
|
|
form.attr( "method", "get" ) |
|
.attr( "action", this.options.submitTo ); |
|
|
|
url = this.options.submitTo + "?search=" + this.element.parent().find( "input" ).val(); |
|
|
|
window.location = url; |
|
}, |
|
enterToNav: function() { |
|
var form = this.element.parent().find( "form" ); |
|
|
|
form.append( "<button type='submit' data-icon='carat-r' data-inline='true' class='ui-hidden-accessible' data-iconpos='notext'>Submit</button>" ) |
|
.parent() |
|
.trigger( "create" ); |
|
|
|
this.element.parent().find( "form" ).children( ".ui-btn" ).addClass( "ui-hidden-accessible" ); |
|
|
|
this._on( form, { |
|
"submit": "submitHandler" |
|
}); |
|
}, |
|
enhanced: false, |
|
arrowKeyNav: function() { |
|
var input = this.element.prev("form").find( "input" ); |
|
|
|
if ( !this.enhanced ) { |
|
this._on( input, { |
|
"keyup": "handleKeyUp" |
|
}); |
|
|
|
this.enhanced = true; |
|
} |
|
}, |
|
handleKeyUp: function( e ) { |
|
var search, |
|
input = this.element.prev("form").find( "input" ); |
|
|
|
if ( e.which === $.ui.keyCode.DOWN ) { |
|
if ( this.element.find( "li.ui-btn-active" ).length === 0 ) { |
|
this.element.find( "li:first" ).toggleClass( "ui-btn-active" ).find("a").toggleClass( "ui-btn-active" ); |
|
} else { |
|
this.element.find( "li.ui-btn-active a" ).toggleClass( "ui-btn-active"); |
|
this.element.find( "li.ui-btn-active" ).toggleClass( "ui-btn-active" ).next().toggleClass( "ui-btn-active" ).find("a").toggleClass( "ui-btn-active" ); |
|
} |
|
|
|
this.highlightDown(); |
|
} else if ( e.which === $.ui.keyCode.UP ) { |
|
if ( this.element.find( "li.ui-btn-active" ).length !== 0 ) { |
|
this.element.find( "li.ui-btn-active a" ).toggleClass( "ui-btn-active"); |
|
this.element.find( "li.ui-btn-active" ).toggleClass( "ui-btn-active" ).prev().toggleClass( "ui-btn-active" ).find("a").toggleClass( "ui-btn-active" ); |
|
} else { |
|
this.element.find( "li:last" ).toggleClass( "ui-btn-active" ).find("a").toggleClass( "ui-btn-active" ); |
|
} |
|
this.highlightUp(); |
|
} else if ( typeof e.which !== "undefined" ) { |
|
this.element.find( "li.ui-btn-active" ).removeClass( "ui-btn-active" ); |
|
|
|
if ( this.options.highlight ) { |
|
search = input.val(); |
|
|
|
this.element.find( "li" ).each(function() { |
|
$( this ).removeHighlight(); |
|
$( this ).highlight( search ); |
|
}); |
|
} |
|
} |
|
}, |
|
submitHandler: function() { |
|
if ( this.element.find( "li.ui-btn-active" ).length !== 0 ) { |
|
var href = this.element.find( "li.ui-btn-active a" ).attr( "href" ); |
|
|
|
$( ":mobile-pagecontainer" ).pagecontainer( "change", href ); |
|
return false; |
|
} |
|
|
|
if ( this.options.submitTo ) { |
|
this.submitTo(); |
|
} |
|
}, |
|
highlightDown: function() { |
|
if ( this.element.find( "li.ui-btn-active" ).hasClass( "ui-screen-hidden" ) ) { |
|
this.element.find( "li.ui-btn-active" ).find("a").toggleClass( "ui-btn-active" ); |
|
this.element.find( "li.ui-btn-active" ).toggleClass( "ui-btn-active" ).next().toggleClass( "ui-btn-active" ).find("a").toggleClass( "ui-btn-active" ); |
|
this.highlightDown(); |
|
} |
|
return; |
|
}, |
|
highlightUp: function() { |
|
if ( this.element.find( "li.ui-btn-active" ).hasClass( "ui-screen-hidden" ) ) { |
|
this.element.find( "li.ui-btn-active" ).find("a").toggleClass( "ui-btn-active" ); |
|
this.element.find( "li.ui-btn-active" ).toggleClass( "ui-btn-active" ).prev().toggleClass( "ui-btn-active" ).find("a").toggleClass( "ui-btn-active" ); |
|
this.highlightUp(); |
|
} |
|
return; |
|
} |
|
}); |
|
})( jQuery ); |
|
|
|
});
|
|
|