Skip to content

Commit b198f57

Browse files
committed
Merge branch 'master' of https://github.com/jquery/jquery-mobile
2 parents 488e8f7 + 67c245c commit b198f57

File tree

12 files changed

+277
-24
lines changed

12 files changed

+277
-24
lines changed

docs/api/data-attributes.html

Lines changed: 28 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -109,12 +109,37 @@ <h2><a href="../content/content-collapsible-set.html">Collapsible set</a></h2>
109109
<td>swatch letter (a-z) - Sets all collapsibles in set</td>
110110
</tr>
111111
</table>
112-
112+
113113
<h2><a href="../pages/page-dialogs.html">Dialog</a></h2>
114+
<p>Container with <code>data-role="page"</code> or <code>"dialog"</code> linked to with <code>data-rel="dialog"</code> on the anchor.</p>
114115
<table>
116+
<tr>
117+
<th>data-close-btn-text</th>
118+
<td>string (text for the close button, dialog only)</td>
119+
</tr>
120+
<tr>
121+
<th>data-dom-cache</th>
122+
<td>true | <strong>false</strong></td>
123+
</tr>
124+
<tr>
125+
<th>data-id</th>
126+
<td>string (unique id for the page)</td>
127+
</tr>
128+
<tr>
129+
<th>data-fullscreen</th>
130+
<td>true | false (used in conjunction with fixed toolbars)</td>
131+
</tr>
115132
<tr>
116133
<th>data-overlay-theme</th>
117-
<td>swatch letter (a-z) - overlay theme</td>
134+
<td>swatch letter (a-z) - overlay theme when the page is opened in a dialog</td>
135+
</tr>
136+
<tr>
137+
<th>data-theme</th>
138+
<td>swatch letter (a-z)</td>
139+
</tr>
140+
<tr>
141+
<th>data-title</th>
142+
<td>string (title used when page is shown)</td>
118143
</tr>
119144
</table>
120145

@@ -280,7 +305,7 @@ <h2><a href="../lists/docs-lists.html">Listview item</a></h2>
280305
</table>
281306

282307
<h2><a href="../pages/page-anatomy.html">Page</a></h2>
283-
<p>Container with <code>data-role="page"</code> or <code>"dialog"</code></p>
308+
<p>Container with <code>data-role="page"</code></p>
284309
<table>
285310
<tr>
286311
<th>data-close-btn-text</th>
@@ -407,7 +432,6 @@ <h3>More in this section</h3>
407432
<li><a href="../../docs/api/globalconfig.html">Configuring defaults</a></li>
408433
<li><a href="../../docs/api/events.html">Events</a></li>
409434
<li><a href="../../docs/api/methods.html">Methods &amp; Utilities</a></li>
410-
<li><a href="../../docs/api/mediahelpers.html">Responsive layout</a></li>
411435
<li data-theme="a"><a href="../../docs/api/data-attributes.html">Data attribute reference</a></li>
412436
<li><a href="../../docs/api/themes.html">Theme framework</a></li>
413437
</ul>

docs/forms/selects/index.html

Lines changed: 70 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -583,18 +583,85 @@ <h3>Optgroup support</h3>
583583
</div>
584584

585585

586-
<h2>Styling with data attributes</h2>
586+
<h2>Theming selects</h2>
587587
<p>You can specify any jQuery Mobile button <code>data-</code> attribute on a select element, too. In this example, we're setting the theme, icon and inline properties:</p>
588588

589589
<div data-role="fieldcontain">
590590
<label for="select-choice-11" class="select">Actions</label>
591-
<select name="select-choice-11" id="select-choice-11" data-theme="a" data-icon="gear" data-inline="true" data-native-menu="false">
591+
<select name="select-choice-11" id="select-choice-11" data-theme="e" data-icon="gear" data-inline="true" data-native-menu="false">
592592
<option value="edit">Edit user</option>
593593
<option value="delete">Delete user</option>
594594
</select>
595595
</div>
596596

597-
597+
<p>The <code>data-overlay-theme</code> attribute can be added a select element to set the color of the overlay layer that the dialog-based custom select menus and the outer border of the smaller custom menus. By default, the content block colors for swatch A will be used for the overlays.</p>
598+
599+
<div data-role="fieldcontain">
600+
<label for="select-choice-15" class="select">Size</label>
601+
<select name="select-choice-15" id="select-choice-15" data-theme="b" data-overlay-theme="d" data-native-menu="false">
602+
<option value="t">Tall</option>
603+
<option value="g">Grande</option>
604+
<option value="v">Vente</option>
605+
</select>
606+
</div>
607+
608+
<div data-role="fieldcontain">
609+
<label for="select-choice-13" class="select">Choose state(s):</label>
610+
<select name="select-choice-13" id="select-choice-13" data-native-menu="false" data-theme="a" data-overlay-theme="e">
611+
<option>Choose options</option>
612+
<option value="AL">Alabama</option>
613+
<option value="AK">Alaska</option>
614+
<option value="AZ">Arizona</option>
615+
<option value="AR">Arkansas</option>
616+
<option value="CA">California</option>
617+
<option value="CO">Colorado</option>
618+
<option value="CT">Connecticut</option>
619+
<option value="DE">Delaware</option>
620+
<option value="FL">Florida</option>
621+
<option value="GA">Georgia</option>
622+
<option value="HI">Hawaii</option>
623+
<option value="ID">Idaho</option>
624+
<option value="IL">Illinois</option>
625+
<option value="IN">Indiana</option>
626+
<option value="IA">Iowa</option>
627+
<option value="KS">Kansas</option>
628+
<option value="KY">Kentucky</option>
629+
<option value="LA">Louisiana</option>
630+
<option value="ME">Maine</option>
631+
<option value="MD">Maryland</option>
632+
<option value="MA">Massachusetts</option>
633+
<option value="MI">Michigan</option>
634+
<option value="MN">Minnesota</option>
635+
<option value="MS">Mississippi</option>
636+
<option value="MO">Missouri</option>
637+
<option value="MT">Montana</option>
638+
<option value="NE">Nebraska</option>
639+
<option value="NV">Nevada</option>
640+
<option value="NH">New Hampshire</option>
641+
<option value="NJ">New Jersey</option>
642+
<option value="NM">New Mexico</option>
643+
<option value="NY">New York</option>
644+
<option value="NC">North Carolina</option>
645+
<option value="ND">North Dakota</option>
646+
<option value="OH">Ohio</option>
647+
<option value="OK">Oklahoma</option>
648+
<option value="OR">Oregon</option>
649+
<option value="PA">Pennsylvania</option>
650+
<option value="RI">Rhode Island</option>
651+
<option value="SC">South Carolina</option>
652+
<option value="SD">South Dakota</option>
653+
<option value="TN">Tennessee</option>
654+
<option value="TX">Texas</option>
655+
<option value="UT">Utah</option>
656+
<option value="VT">Vermont</option>
657+
<option value="VA">Virginia</option>
658+
<option value="WA">Washington</option>
659+
<option value="WV">West Virginia</option>
660+
<option value="WI">Wisconsin</option>
661+
<option value="WY">Wyoming</option>
662+
</select>
663+
</div>
664+
598665

599666
<h2>Calling the select menu plugin</h2>
600667
<p>The select menu plugin will auto initialize on any page that contains a select menu, no need for a <code>data-role</code> attribute in the markup. However, you can directly call the select menu plugin on any selector, just like any normal jQuery plugin:</p>

docs/pages/dialog-overlay.html

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1">
6+
<title>jQuery Mobile Framework - Dialog Example</title>
7+
<link rel="stylesheet" href="../../css/themes/default/" />
8+
<link rel="stylesheet" href="../_assets/css/jqm-docs.css"/>
9+
<script src="../../js/jquery.js"></script>
10+
<script src="../../experiments/themeswitcher/jquery.mobile.themeswitcher.js"></script>
11+
<script src="../_assets/js/jqm-docs.js"></script>
12+
<script src="../../js/"></script>
13+
</head>
14+
<body>
15+
16+
<div data-role="page" data-overlay-theme="e">
17+
<div data-role="header" data-theme="b">
18+
<h1>Dialog</h1>
19+
</div>
20+
21+
<div data-role="content" data-theme="d">
22+
<h1>Custom overlay</h1>
23+
<p>This dialog adds <code>data-overlay-theme="e"</code> to the page container to set the overlay swatch color.</p>
24+
<a href="docs-dialogs.html" data-role="button" data-rel="back" data-theme="a" data-inline="true">I like it</a>
25+
</div>
26+
27+
<div data-role="footer" data-theme="c">
28+
<form style="padding-top:4px;">
29+
<input type="checkbox" name="checkbox-0" id="checkbox-0" class="custom" />
30+
<label for="checkbox-0">Don't show this message again </label>
31+
</form>
32+
</div>
33+
</div>
34+
35+
36+
</body>
37+
</html>

docs/pages/page-dialogs.html

Lines changed: 16 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -60,21 +60,29 @@ <h2>History &amp; Back button behavior</h2>
6060
<p>Since dialogs are typically used to support actions within a page, the framework does not include dialogs in the hash state history tracking. This means that dialogs will not appear in your browsing history chronology when the Back button is clicked. For example, if you are on a page, click a link to open a dialog, close the dialog, then navigate to another page, if you were to click the browser's Back button at that point you will navigate back to the first page, not the dialog.</p>
6161

6262
<h2>Styling &amp; theming</h2>
63-
<p>Dialogs can be styled with different themes, just like any page. Here is a different dialog design:</p>
63+
<p>Dialogs can be styled with different theme swatches, just like any page by adding <code>data-theme</code> attributes to the header, content, or footer containers. Here is an example of a different dialog design:</p>
6464
<a href="dialog-alt.html" data-role="button" data-inline="true" data-rel="dialog" data-transition="pop">An alternate color scheme</a>
65+
66+
<p>Dialogs appear float above an overlay layer. This overlay adopts the swatch A content color by default, but the <code>data-overlay-theme</code> attribute can be added to the page wrapper to set the overlay to any swatch letter. Here is an example of a dialog with the overlay set to swatch e:</p>
67+
<a href="dialog-overlay.html" data-role="button" data-inline="true" data-rel="dialog" data-transition="pop">Custom overlay swatch</a>
6568

6669

6770
<p>And dialogs can be can used more like a control sheet to offer multiple buttons by removing the header:</p>
6871
<a href="dialog-buttons.html" data-role="button" data-inline="true" data-rel="dialog" data-transition="slidedown">Share photos...</a>
6972

70-
<p>For the sake of readability, dialogs have a default <code>max-width</code> of 500 pixels (plus 15px padding on each side). To override this, use the following CSS in your theme:</p>
71-
72-
<code>
73-
.ui-dialog .ui-header,
74-
.ui-dialog .ui-content,
75-
.ui-dialog .ui-footer { <strong>max-width: 100%;</strong> }
76-
</code>
73+
<h2>Dialog width and margins</h2>
74+
<p>For the sake of readability, dialogs have a default <code>max-width</code> of 500 pixels (plus 15px padding on each side). There is also a 10% top <code>margin</code> to give dialogs larger top margin on larger screens, but collapse to a small margin on smartphones. To override these styles, add the following CSS override rule to your stylesheet and tweak as needed:</p>
75+
76+
<code><pre>
77+
.ui-dialog .ui-header,
78+
.ui-dialog .ui-content,
79+
.ui-dialog .ui-footer {
80+
<strong> max-width: 500px;
81+
margin: 10% auto 15px auto; </strong>
82+
}
83+
</pre></code>
7784

85+
7886

7987

8088

docs/toolbars/docs-headers.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -169,7 +169,7 @@ <h3>More in this section</h3>
169169
<li><a href="docs-navbar.html">Navbars</a></li>
170170
<li><a href="bars-fixed.html">Fixed positioning</a></li>
171171
<li><a href="bars-fullscreen.html">Fullscreen positioning</a></li>
172-
<li><a href="footer-persist-a.html">Persistent footer nav bar</a></li>
172+
<li><a href="footer-persist-a.html">Persistent footer navbar</a></li>
173173
<li><a href="bars-themes.html">Theming toolbars</a></li>
174174

175175
</ul>

experiments/scrollview/scrollview.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
function ResizePageContentHeight(page) {
22
var $page = $(page),
33
$content = $page.children( ".ui-content" ),
4-
hh = $page.children( ".ui-header" ).outerHeight() : 0,
5-
fh = $page.children( ".ui-footer" ).outerHeight() : 0,
4+
hh = $page.children( ".ui-header" ).outerHeight() || 0,
5+
fh = $page.children( ".ui-footer" ).outerHeight() || 0,
66
pt = parseFloat($content.css( "padding-top" )),
77
pb = parseFloat($content.css( "padding-bottom" )),
88
wh = window.innerHeight;

js/jquery.mobile.forms.select.custom.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
"<div data-" + $.mobile.ns + "role='content'></div>"+
2525
"</div>" ).appendTo( $.mobile.pageContainer ).page(),
2626

27-
listbox = $("<div>", { "class": "ui-selectmenu ui-selectmenu-hidden ui-overlay-shadow ui-corner-all ui-overlay-" + widget.options.overlayTheme + " " + $.mobile.defaultDialogTransition } ).insertAfter(screen),
27+
listbox = $("<div>", { "class": "ui-selectmenu ui-selectmenu-hidden ui-overlay-shadow ui-corner-all ui-body-" + widget.options.overlayTheme + " " + $.mobile.defaultDialogTransition } ).insertAfter(screen),
2828

2929
list = $( "<ul>", {
3030
"class": "ui-selectmenu-list",

tests/speed/stats/index.php

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,24 @@
11
<?php
22
$db = new PDO('sqlite:./stats.db');
3-
$db->query('CREATE TABLE IF NOT EXISTS stats (id INTEGER, agent TEXT, point TEXT, value REAL, time TIMESTAMP, PRIMARY KEY (id))');
3+
$db->query('CREATE TABLE IF NOT EXISTS stats (id INTEGER, agent TEXT, point TEXT, value REAL, time TIMESTAMP, pathname TEXT, PRIMARY KEY (id))');
44

55
// making a sad attempt here to provide a clean REST-respecting url scheme.
66
// stats with a GET returns - wait for it - the stats, and a post with the
77
// the right params will create a new entry
88
if ( $_SERVER['REQUEST_METHOD'] == "GET" ) {
99
$json = Array();
10-
$st = $db->prepare( 'SELECT agent, point, value, time FROM stats' );
10+
$st = $db->prepare( 'SELECT point, avg(value) as avg_value, pathname, strftime(\'%Y-%m-%d\', time) as day FROM stats GROUP BY pathname, point, strftime(\'%Y-%m-%d\', time) ORDER BY time;' );
1111
$st->execute();
1212
$result = $st->fetchAll(PDO::FETCH_ASSOC);
1313
header("Content-Type: application/json");
1414
echo json_encode($result);
15-
} elseif ( $_POST['datapoint'] && $_POST['value'] && $_POST['agent'] ) {
16-
$st = $db->prepare('INSERT INTO stats (agent, point, value, time) VALUES (:agent, :data_point, :value, DATETIME(\'now\'))');
15+
} elseif ( $_POST['datapoint'] && $_POST['value'] && $_POST['agent'] && $_POST['pathname']) {
16+
$st = $db->prepare('INSERT INTO stats (agent, point, value, pathname, time) VALUES (:agent, :data_point, :value, :pathname, DATETIME(\'now\'))');
1717
$st->execute(array(
1818
':agent' => $_POST['agent'],
1919
':data_point' => $_POST['datapoint'],
20-
':value' => $_POST['value']
20+
':value' => $_POST['value'],
21+
':pathname' => $_POST['pathname']
2122
));
2223

2324
echo "success";

tests/speed/stats/perf.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,8 @@ window.Perf = (function($, Perf) {
99
report: function( data, after ) {
1010
var self = this;
1111

12+
data.pathname = location.pathname;
13+
1214
$.post( self.reportUrl, data, after );
1315
},
1416

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<script type="text/javascript" src="../../../../js/jquery.js"></script>
6+
<script type="text/javascript" src="http://www.filamentgroup.com/examples/charting_v2/visualize.jQuery.js"></script>
7+
<script type="text/javascript" src="visualize.js"></script>
8+
<link rel="stylesheet" href="visualize.css" type="text/css" media="screen" />
9+
</head>
10+
<body>
11+
<div id="tables">
12+
</div>
13+
14+
<div id="graphs">
15+
16+
</div>
17+
</body>
18+
</html>

0 commit comments

Comments
 (0)