Skip to content

Commit 2a6c7fc

Browse files
author
scottjehl
committed
This commit decouples all widgets from the page plugin so that they can be used ad-hoc.
- Internally, each plugin self-initializes by binding to the pagecreate event. - Unit tests have been added and adjusted to support some internal changes involved in this commit. - In the process, the portions of the page plugin that were used to enhance the header,content,and footer sections of a native-app style page layout are now located in jquery.mobile.page.sections.js. - No public API options have changed, except that the page plugin no longer has options for keepNative, and degradeInputs, as plugins now handle these internally (keepNative was never documented, and degradeInputs only affected slider, so it lives there now. Page options related to the page sections are now located in the page.sections script, but they are still configurable via the page plugin's options api. - Make, Ant, and index files are updated with a new load order for all JS files.
1 parent c7b6392 commit 2a6c7fc

27 files changed

+577
-407
lines changed

‎Makefile

Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -46,21 +46,25 @@ JSFILES = js/jquery.ui.widget.js \
4646
js/jquery.mobile.core.js \
4747
js/jquery.mobile.navigation.js \
4848
js/jquery.mobile.transition.js \
49-
js/jquery.mobile.fixHeaderFooter.js \
49+
js/jquery.mobile.dialog.js \
50+
js/jquery.mobile.page.sections.js \
51+
js/jquery.mobile.collapsible.js \
52+
js/jquery.mobile.fieldContain.js \
53+
js/jquery.mobile.grid.js \
54+
js/jquery.mobile.navbar.js \
55+
js/jquery.mobile.listview.js \
56+
js/jquery.mobile.listview.filter.js \
57+
js/jquery.mobile.nojs.js \
5058
js/jquery.mobile.forms.checkboxradio.js \
59+
js/jquery.mobile.forms.button.js \
60+
js/jquery.mobile.forms.slider.js \
5161
js/jquery.mobile.forms.textinput.js \
5262
js/jquery.mobile.forms.select.js \
5363
js/jquery.mobile.buttonMarkup.js \
54-
js/jquery.mobile.forms.button.js \
55-
js/jquery.mobile.forms.slider.js \
56-
js/jquery.mobile.collapsible.js \
5764
js/jquery.mobile.controlGroup.js \
58-
js/jquery.mobile.fieldContain.js \
59-
js/jquery.mobile.listview.js \
60-
js/jquery.mobile.listview.filter.js \
61-
js/jquery.mobile.dialog.js \
62-
js/jquery.mobile.navbar.js \
63-
js/jquery.mobile.grid.js \
65+
js/jquery.mobile.links.js \
66+
js/jquery.mobile.fixHeaderFooter.js \
67+
js/jquery.mobile.media.classes.js \
6468
js/jquery.mobile.init.js
6569

6670
# The files to include when compiling the CSS files

‎build.xml

Lines changed: 31 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -19,33 +19,37 @@
1919
jquery.mobile.forms.textinput.css,
2020
jquery.mobile.listview.css,
2121
jquery.mobile.forms.slider.css"/>
22-
<property name="js-sources" value="jquery.ui.widget.js,
23-
jquery.mobile.widget.js,
24-
jquery.mobile.media.js,
25-
jquery.mobile.support.js,
26-
jquery.mobile.vmouse.js,
27-
jquery.mobile.event.js,
28-
jquery.mobile.hashchange.js,
29-
jquery.mobile.page.js,
30-
jquery.mobile.core.js,
31-
jquery.mobile.navigation.js,
32-
jquery.mobile.transition.js,
33-
jquery.mobile.fixHeaderFooter.js,
34-
jquery.mobile.forms.checkboxradio.js,
35-
jquery.mobile.forms.textinput.js,
36-
jquery.mobile.forms.select.js,
37-
jquery.mobile.buttonMarkup.js,
38-
jquery.mobile.forms.button.js,
39-
jquery.mobile.forms.slider.js,
40-
jquery.mobile.collapsible.js,
41-
jquery.mobile.controlGroup.js,
42-
jquery.mobile.fieldContain.js,
43-
jquery.mobile.listview.js,
44-
jquery.mobile.listview.filter.js,
45-
jquery.mobile.dialog.js,
46-
jquery.mobile.navbar.js,
47-
jquery.mobile.grid.js,
48-
jquery.mobile.init.js"/>
22+
<property name="js-sources" value="js/jquery.ui.widget.js,
23+
js/jquery.mobile.widget.js,
24+
js/jquery.mobile.media.js,
25+
js/jquery.mobile.support.js,
26+
js/jquery.mobile.vmouse.js,
27+
js/jquery.mobile.event.js,
28+
js/jquery.mobile.hashchange.js,
29+
js/jquery.mobile.page.js,
30+
js/jquery.mobile.core.js,
31+
js/jquery.mobile.navigation.js,
32+
js/jquery.mobile.transition.js,
33+
js/jquery.mobile.dialog.js,
34+
js/jquery.mobile.page.sections.js,
35+
js/jquery.mobile.collapsible.js,
36+
js/jquery.mobile.fieldContain.js,
37+
js/jquery.mobile.grid.js,
38+
js/jquery.mobile.navbar.js,
39+
js/jquery.mobile.listview.js,
40+
js/jquery.mobile.listview.filter.js,
41+
js/jquery.mobile.nojs.js,
42+
js/jquery.mobile.forms.checkboxradio.js,
43+
js/jquery.mobile.forms.button.js,
44+
js/jquery.mobile.forms.slider.js,
45+
js/jquery.mobile.forms.textinput.js,
46+
js/jquery.mobile.forms.select.js,
47+
js/jquery.mobile.buttonMarkup.js,
48+
js/jquery.mobile.controlGroup.js,
49+
js/jquery.mobile.links.js,
50+
js/jquery.mobile.fixHeaderFooter.js,
51+
js/jquery.mobile.media.classes.js,
52+
js/jquery.mobile.init.js"/>
4953

5054
<target name="merge">
5155
<antcall target="merge_css" />

‎js/index.php

Lines changed: 15 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -12,21 +12,26 @@
1212
'jquery.mobile.core.js',
1313
'jquery.mobile.navigation.js',
1414
'jquery.mobile.transition.js',
15-
'jquery.mobile.fixHeaderFooter.js',
15+
16+
'jquery.mobile.dialog.js',
17+
'jquery.mobile.page.sections.js',
18+
'jquery.mobile.collapsible.js',
19+
'jquery.mobile.fieldContain.js',
20+
'jquery.mobile.grid.js',
21+
'jquery.mobile.navbar.js',
22+
'jquery.mobile.listview.js',
23+
'jquery.mobile.listview.filter.js',
24+
'jquery.mobile.nojs.js',
1625
'jquery.mobile.forms.checkboxradio.js',
26+
'jquery.mobile.forms.button.js',
27+
'jquery.mobile.forms.slider.js',
1728
'jquery.mobile.forms.textinput.js',
1829
'jquery.mobile.forms.select.js',
1930
'jquery.mobile.buttonMarkup.js',
20-
'jquery.mobile.forms.button.js',
21-
'jquery.mobile.forms.slider.js',
22-
'jquery.mobile.collapsible.js',
2331
'jquery.mobile.controlGroup.js',
24-
'jquery.mobile.fieldContain.js',
25-
'jquery.mobile.listview.js',
26-
'jquery.mobile.listview.filter.js',
27-
'jquery.mobile.dialog.js',
28-
'jquery.mobile.navbar.js',
29-
'jquery.mobile.grid.js',
32+
'jquery.mobile.links.js',
33+
'jquery.mobile.fixHeaderFooter.js',
34+
'jquery.mobile.media.classes.js',
3035
'jquery.mobile.init.js'
3136
);
3237

‎js/jquery.mobile.buttonMarkup.js

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -138,4 +138,13 @@ var attachEvents = function() {
138138
attachEvents = null;
139139
};
140140

141+
//links in bars, or those with data-role become buttons
142+
//auto self-init widgets
143+
$( document ).bind( "pagecreate", function( e ){
144+
145+
$( ":jqmData(role='button'), .ui-bar > a, .ui-header > a, .ui-footer > a", e.target )
146+
.not( ".ui-btn, :jqmData(role='none'), :jqmData(role='nojs')" )
147+
.buttonMarkup();
148+
});
149+
141150
})( jQuery );

‎js/jquery.mobile.collapsible.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,11 @@
66
*/
77
(function( $, undefined ) {
88

9+
//auto self-init widgets
10+
$( document ).bind( "pagecreate", function( e ){
11+
$( ":jqmData(role='collapsible')", e.target ).collapsible();
12+
});
13+
914
$.widget( "mobile.collapsible", $.mobile.widget, {
1015
options: {
1116
expandCueText: " click to expand contents",

‎js/jquery.mobile.controlGroup.js

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,15 +4,22 @@
44
* Dual licensed under the MIT or GPL Version 2 licenses.
55
* http://jquery.org/license
66
*/
7-
(function($, undefined ) {
7+
(function( $, undefined ) {
8+
9+
//auto self-init widgets
10+
$( document ).bind( "pagecreate", function( e ){
11+
$( ":jqmData(role='controlgroup')", e.target ).controlgroup({ excludeInvisible: false });
12+
});
813

914
$.fn.controlgroup = function( options ) {
1015

1116
return this.each(function() {
17+
1218
var $el = $( this ),
1319
o = $.extend({
1420
direction: $el.jqmData( "type" ) || "vertical",
15-
shadow: false
21+
shadow: false,
22+
excludeInvisible: true
1623
}, options ),
1724
groupheading = $el.find( ">legend" ),
1825
flCorners = o.direction == "horizontal" ? [ "ui-corner-left", "ui-corner-right" ] : [ "ui-corner-top", "ui-corner-bottom" ],
@@ -36,7 +43,7 @@ $.fn.controlgroup = function( options ) {
3643
.filter( ":last" ).addClass( flCorners[ 1 ] ).addClass( "ui-controlgroup-last" );
3744
}
3845

39-
flipClasses( $el.find( ".ui-btn" + ( o.dontFilterOutInvisible ? "" : ":visible" ) ) );
46+
flipClasses( $el.find( ".ui-btn" + ( o.excludeInvisible ? ":visible" : "" ) ) );
4047
flipClasses( $el.find( ".ui-btn-inner" ) );
4148

4249
if ( o.shadow ) {

‎js/jquery.mobile.dialog.js

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -6,25 +6,30 @@
66

77
(function( $, window, undefined ) {
88

9+
//auto self-init widgets
10+
$( ":jqmData(role='dialog')" ).live( "pagecreate", function(){
11+
$( this ).dialog();
12+
});
13+
914
$.widget( "mobile.dialog", $.mobile.widget, {
1015
options: {
11-
closeBtnText: "Close"
16+
closeBtnText : "Close",
17+
theme : "a"
1218
},
1319
_create: function() {
1420
var $el = this.element;
21+
22+
$el.jqmData( "theme", this.options.theme );
1523

1624
// Class the markup for dialog styling
1725
// Set aria role
1826
$el.attr( "role", "dialog" )
19-
.addClass( "ui-page ui-dialog ui-body-a" )
20-
.find( ":jqmData(role=header)" )
27+
.addClass( "ui-dialog" )
28+
.find( ":jqmData(role='header')" )
2129
.addClass( "ui-corner-top ui-overlay-shadow" )
2230
.prepend( "<a href='#' data-" + $.mobile.ns + "icon='delete' data-" + $.mobile.ns + "rel='back' data-" + $.mobile.ns + "iconpos='notext'>"+ this.options.closeBtnText + "</a>" )
2331
.end()
24-
.find( ".ui-content:not([class*='ui-body-'])" )
25-
.addClass( 'ui-body-c' )
26-
.end()
27-
.find( ".ui-content,:jqmData(role='footer')" )
32+
.find( ":jqmData(role='content'),:jqmData(role='footer')" )
2833
.last()
2934
.addClass( "ui-corner-bottom ui-overlay-shadow" );
3035

‎js/jquery.mobile.fieldContain.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,11 @@
77

88
(function( $, undefined ) {
99

10+
//auto self-init widgets
11+
$( document ).bind( "pagecreate", function( e ){
12+
$( ":jqmData(role='fieldcontain')", e.target ).fieldcontain();
13+
});
14+
1015
$.fn.fieldcontain = function( options ) {
1116
return this.addClass( "ui-field-contain ui-body ui-br" );
1217
};

‎js/jquery.mobile.fixHeaderFooter.js

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,35 @@
66
*/
77

88
(function( $, undefined ) {
9+
10+
//auto self-init widgets
11+
$( document ).bind( "pagecreate", function( e ){
12+
13+
if( $( ":jqmData(position='fixed')", e.target ).length ){
14+
$( e.target ).each(function(){
15+
16+
if ( !$.support.scrollTop ) {
17+
return this;
18+
}
19+
20+
var $this = $( this );
21+
22+
if ( $this.jqmData( "fullscreen" ) ) {
23+
$this.addClass( "ui-page-fullscreen" );
24+
}
25+
26+
// Should be slidedown
27+
$this.find( ".ui-header:jqmData(position='fixed')" ).addClass( "ui-header-fixed ui-fixed-inline fade" );
28+
29+
// Should be slideup
30+
$this.find( ".ui-footer:jqmData(position='fixed')" ).addClass( "ui-footer-fixed ui-fixed-inline fade" );
31+
32+
})
33+
34+
}
35+
});
36+
37+
938

1039
$.fn.fixHeaderFooter = function( options ) {
1140

‎js/jquery.mobile.forms.button.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,13 @@
77

88
(function( $, undefined ) {
99

10+
//auto self-init widgets
11+
$( document ).bind( "pagecreate", function( e ){
12+
$( "button, [type='button'], [type='submit'], [type='reset'], [type='image']", e.target )
13+
.not( ":jqmData(role='none'), :jqmData(role='nojs')" )
14+
.button();
15+
});
16+
1017
$.widget( "mobile.button", $.mobile.widget, {
1118
options: {
1219
theme: null,

‎js/jquery.mobile.forms.checkboxradio.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,13 @@
77

88
(function( $, undefined ) {
99

10+
//auto self-init widgets
11+
$( document ).bind( "pagecreate", function( e ){
12+
$( "input[type='checkbox'],input[type='radio']", e.target )
13+
.not( ":jqmData(role='none'), :jqmData(role='nojs')" )
14+
.checkboxradio();
15+
});
16+
1017
$.widget( "mobile.checkboxradio", $.mobile.widget, {
1118
options: {
1219
theme: null

‎js/jquery.mobile.forms.select.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,13 @@
77

88
(function( $, undefined ) {
99

10+
//auto self-init widgets
11+
$( document ).bind( "pagecreate", function( e ){
12+
$( "select:not(:jqmData(role='slider'))", e.target )
13+
.not( ":jqmData(role='none'), :jqmData(role='nojs')" )
14+
.selectmenu();
15+
});
16+
1017
$.widget( "mobile.selectmenu", $.mobile.widget, {
1118
options: {
1219
theme: null,

‎js/jquery.mobile.forms.slider.js

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,23 @@
77

88
( function( $, undefined ) {
99

10+
//auto self-init widgets
11+
$( document ).bind( "pagecreate", function( e ){
12+
13+
var nativeSel = ":jqmData(role='none'), :jqmData(role='nojs')";
14+
15+
//degrade range back to number type
16+
$( "input[type='range']:not("+ nativeSel +")", e.target ).each(function(){
17+
$(this).replaceWith(
18+
$( "<div>" ).html( $(this).clone() ).html()
19+
.replace( /\s+type=["']?\w+['"]?/, " type=\"number\" data-" + $.mobile.ns + "role=\"slider\" " ) );
20+
});
21+
22+
//now self-init
23+
$( ":jqmData(role='slider'):not("+ nativeSel +")", e.target ).slider();
24+
25+
});
26+
1027
$.widget( "mobile.slider", $.mobile.widget, {
1128
options: {
1229
theme: null,

‎js/jquery.mobile.forms.textinput.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,13 @@
77

88
(function( $, undefined ) {
99

10+
//auto self-init widgets
11+
$( document ).bind( "pagecreate", function( e ){
12+
$( "input[type='text'], input[type='search'], input[type='number'], input[type='password'], textarea", e.target )
13+
.not( ":jqmData(role='none'), :jqmData(role='nojs')" )
14+
.textinput();
15+
});
16+
1017
$.widget( "mobile.textinput", $.mobile.widget, {
1118
options: {
1219
theme: null

‎js/jquery.mobile.links.js

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
/*
2+
* jQuery Mobile Framework : "fieldcontain" plugin - simple class additions to make form row separators
3+
* Copyright (c) jQuery Project
4+
* Dual licensed under the MIT or GPL Version 2 licenses.
5+
* http://jquery.org/license
6+
*/
7+
8+
(function( $, undefined ) {
9+
10+
$( document ).bind( "pagecreate", function( e ){
11+
12+
//links within content areas
13+
$( e.target )
14+
.find( "a" )
15+
.not( ".ui-btn, .ui-link-inherit, :jqmData(role='none'), :jqmData(role='nojs')" )
16+
.addClass( "ui-link" );
17+
18+
});
19+
20+
})( jQuery );

‎js/jquery.mobile.listview.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,12 @@
66
*/
77

88
(function( $, undefined ) {
9+
10+
//auto self-init widgets
11+
$( document ).bind( "pagecreate", function( e ){
12+
$( ":jqmData(role='listview')", e.target ).listview();
13+
});
14+
915
//Keeps track of the number of lists per page UID
1016
//This allows support for multiple nested list in the same page
1117
//https://github.com/jquery/jquery-mobile/issues/1617

0 commit comments

Comments
 (0)