Skip to content

Commit 32126cb

Browse files
committed
Demos: wrap h2widget in mobile init so it can be rolled into _assets/js/ update grunt file to include h2widget in demos build
1 parent 6e3c4f1 commit 32126cb

File tree

13 files changed

+99
-58
lines changed

13 files changed

+99
-58
lines changed

docs/demos/_assets/js/h2widget.js

Lines changed: 96 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -1,58 +1,108 @@
11
(function( $, undefined ) {
2+
//special click handling to make widget work remove after nav changes in 1.4
3+
var href,
4+
ele = "";
5+
$( document ).on( "click", "a", function( e ) {
6+
href = $( this ).attr( "href" );
7+
var hash = $.mobile.path.parseUrl( href );
8+
if( typeof href !== "undefined" && hash !== "" && href !== href.replace( hash,"" ) && hash.search( "/" ) === -1 ){
9+
//remove the hash from the link to allow normal loading of the page.
10+
var newHref = href.replace( hash,"" );
11+
$( this ).attr( "href", newHref );
12+
}
13+
ele = $( this );
14+
});
15+
$( document ).on( "pagebeforechange", function( e, f ){
16+
f.originalHref = href;
17+
});
18+
$( document ).on("pagebeforechange", function( e,f ){
19+
var hash = $.mobile.path.parseUrl(f.toPage).hash;
20+
if( typeof hash !== "undefined" && hash.search( "/" ) === -1 && hash !== "" && $( hash ).length > 0 && !$( ".ui-page-active " + hash ).hasClass( "ui-page" ) && !$( ".ui-page-active " + hash ).hasClass( "ui-panel" ) && !$( ".ui-page-active " + hash ).hasClass( "ui-popup" )){
21+
//scroll to the id
22+
var pos = $( hash ).offset().top;
23+
$.mobile.silentScroll( pos );
24+
return false;
25+
} else if( $.mobile.path.parseUrl( f.originalHref ).hash !== "" ){
26+
$( ele ).attr( href, f.originalHref );
27+
$.mobile.document.one( "pagechange", function(){
28+
hash = $.mobile.path.parseUrl(f.originalHref).hash;
29+
var pos = $( ".ui-page-active " + hash) .offset().top;
30+
$.mobile.silentScroll( pos );
31+
} );
32+
}
33+
});
34+
$( document ).on( "mobileinit", function(){
35+
hash = window.location.hash;
36+
$.mobile.document.one( "pageshow", function(){
37+
if( hash !== "" && !$( ".ui-page-active " + hash ).hasClass( "ui-page" ) && !$( ".ui-page-active " + hash ).hasClass( "ui-panel" ) && !$( ".ui-page-active " + hash ).hasClass( "ui-popup" ) && !$( hash ).is( "body" ) ){
38+
var pos = $( ".ui-page-active " + hash ).offset().top;
39+
setTimeout( function(){
40+
$.mobile.silentScroll( pos );
41+
}, 100 );
42+
}
43+
});
44+
});
45+
//h2 widget
46+
$( document ).on( "mobileinit", function(){
47+
$.widget( "mobile.h2linker", $.mobile.widget, {
48+
options:{
49+
initSelector: ":jqmData(quicklinks='true')"
50+
},
251

3-
$.widget( "mobile.h2linker", $.mobile.widget, {
4-
options:{
5-
initSelector: ":jqmData(quicklinks='true')"
6-
},
7-
8-
_create:function(){
9-
var self = this,
10-
bodyid = "ui-page-top",
11-
panel = "<div data-role='panel' class='jqm-nav-panel jqm-quicklink-panel' data-position='right' data-display='overlay' data-theme='c'><ul data-role='listview' data-inset='false' data-theme='d' data-divider-theme='d' class='jqm-list'><li class='jqm-list-header'>Jump to section</li></ul></div>",
12-
first = true,
13-
h2dictionary = new Object();
14-
if(typeof $("body").attr("id") === "undefined"){
15-
$("body").attr("id",bodyid);
16-
} else {
17-
bodyid = $("body").attr("id");
18-
}
19-
this.element.find("h2").each(function(){
20-
var id, text = $(this).text();
21-
22-
if(typeof $(this).attr("id") === "undefined"){
23-
id = text.replace(/[^\.a-z0-9:_-]+/i,"");
24-
$(this).attr( "id", id );
52+
_create:function(){
53+
var self = this,
54+
bodyid = "ui-page-top",
55+
panel = "<div data-role='panel' class='jqm-nav-panel jqm-quicklink-panel' data-position='right' data-display='overlay' data-theme='c'><ul data-role='listview' data-inset='false' data-theme='d' data-divider-theme='d' class='jqm-list'><li class='jqm-list-header'>Jump to section</li></ul></div>",
56+
first = true,
57+
h2dictionary = new Object();
58+
if(typeof $("body").attr("id") === "undefined"){
59+
$("body").attr("id",bodyid);
2560
} else {
26-
id = $(this).attr("id");
61+
bodyid = $("body").attr("id");
2762
}
63+
this.element.find("h2").each(function(){
64+
var id, text = $(this).text();
65+
66+
if(typeof $(this).attr("id") === "undefined"){
67+
id = text.replace(/[^\.a-z0-9:_-]+/i,"");
68+
$(this).attr( "id", id );
69+
} else {
70+
id = $(this).attr("id");
71+
}
2872

29-
h2dictionary[id] = text;
30-
if(!first){
31-
$(this).before("<a href='#"+bodyid+"' class='jqm-sections-link ui-link jqm-top-link'>Return to top<span class='ui-icon ui-icon-arrow-u'>&nbsp;</span></a>");
32-
} else {
33-
$(this).before("<a href='#'' data-ajax='false' class='jqm-sections-link ui-link jqm-top-link jqm-open-quicklink-panel'>Jump to section<span class='ui-icon ui-icon-bars'>&nbsp;</span></a>");
73+
h2dictionary[id] = text;
74+
if(!first){
75+
$(this).before("<a href='#"+bodyid+"' class='jqm-sections-link ui-link jqm-top-link'>Return to top<span class='ui-icon ui-icon-arrow-u'>&nbsp;</span></a>");
76+
} else {
77+
$(this).before("<a href='#'' data-ajax='false' class='jqm-sections-link ui-link jqm-top-link jqm-open-quicklink-panel'>Jump to section<span class='ui-icon ui-icon-bars'>&nbsp;</span></a>");
78+
}
79+
first = false;
80+
});
81+
this._on(".jqm-open-quicklink-panel", {
82+
"click": function(){
83+
$(".ui-page-active .jqm-quicklink-panel").panel("open");
84+
return false;
85+
}
86+
});
87+
this._on(".jqm-quicklink-panel", {
88+
"vclick": function(){
89+
this.element.find(".jqm-quicklink-panel").panel("close");
90+
}
91+
});
92+
if( $(h2dictionary).length > 0 ){
93+
this.element.prepend(panel)
94+
this.element.find(".jqm-quicklink-panel").panel().find("ul").listview();
3495
}
35-
first = false;
36-
});
37-
this._on(".jqm-open-quicklink-panel", {
38-
"click": function(){
39-
$(".ui-page-active .jqm-quicklink-panel").panel("open");
40-
return false;
41-
}
42-
});
96+
$.each(h2dictionary,function(id,text){
97+
self.element.find(".jqm-quicklink-panel ul").append("<li><a href='#"+id+"'>"+text+"</a></li>");
98+
});
99+
self.element.find(".jqm-quicklink-panel ul").listview("refresh");
43100

44-
if( $(h2dictionary).length > 0 ){
45-
this.element.prepend(panel)
46-
this.element.find(".jqm-quicklink-panel").panel().find("ul").listview();
47-
}
48-
$.each(h2dictionary,function(id,text){
49-
self.element.find(".jqm-quicklink-panel ul").append("<li><a href='#"+id+"'>"+text+"</a></li>");
50-
});
51-
self.element.find(".jqm-quicklink-panel ul").listview("refresh");
52101

53-
}
102+
}
103+
});
54104
});
55-
$.mobile.document.bind( "pagecreate create", function( e ) {
105+
$( document ).bind( "pagecreate create", function( e ) {
56106
var initselector = $.mobile.h2linker.prototype.options.initSelector;
57107
if($(e.target).data("quicklinks")){
58108
$(e.target).h2linker();

docs/demos/_assets/js/index.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
$files = array(
44
'jqm-demos.js',
55
'view-source.js',
6-
'deeplink_click_handler.js'
6+
'h2widget.js'
77
);
88

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

docs/demos/index.html

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@
1111
<script src="../../js/jquery.js"></script>
1212
<script src="_assets/js/"></script>
1313
<script src="../../js/"></script>
14-
<script src="_assets/js/h2widget.js"></script>
1514
</head>
1615
<body>
1716
<div data-role="page" class="jqm-demos jqm-demos-home">

docs/demos/widgets/accordions/index.html

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@
1111
<script src="../../../../js/jquery.js"></script>
1212
<script src="../../_assets/js/"></script>
1313
<script src="../../../../js/"></script>
14-
<script src="../../_assets/js/h2widget.js"></script>
1514
</head>
1615
<body>
1716
<div data-role="page" class="jqm-demos" data-quicklinks="true">

docs/demos/widgets/autocomplete/autocomplete-remote.html

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@
1111
<script src="../../../../js/jquery.js"></script>
1212
<script src="../../_assets/js/"></script>
1313
<script src="../../../../js/"></script>
14-
<script src="../../_assets/js/h2widget.js"></script>
1514
<script>
1615
$( document ).on( "pageinit", "#myPage", function() {
1716
$( "#autocomplete" ).on( "listviewbeforefilter", function ( e, data ) {

docs/demos/widgets/autocomplete/index.html

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@
1111
<script src="../../../../js/jquery.js"></script>
1212
<script src="../../_assets/js/"></script>
1313
<script src="../../../../js/"></script>
14-
<script src="../../_assets/js/h2widget.js"></script>
1514
</head>
1615
<body>
1716
<div data-role="page" class="jqm-demos" data-quicklinks="true">

docs/demos/widgets/buttons/buttons-grids.html

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@
1111
<script src="../../../../js/jquery.js"></script>
1212
<script src="../../_assets/js/"></script>
1313
<script src="../../../../js/"></script>
14-
<script src="../../_assets/js/h2widget.js"></script>
1514
<style>
1615
.mygrid > div {
1716
text-align: center;

docs/demos/widgets/buttons/index.html

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@
1111
<script src="../../../../js/jquery.js"></script>
1212
<script src="../../_assets/js/"></script>
1313
<script src="../../../../js/"></script>
14-
<script src="../../_assets/js/h2widget.js"></script>
1514
</head>
1615
<body>
1716
<div data-role="page" class="jqm-demos" data-quicklinks="true">

docs/demos/widgets/checkbox/index.html

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@
1111
<script src="../../../../js/jquery.js"></script>
1212
<script src="../../_assets/js/"></script>
1313
<script src="../../../../js/"></script>
14-
<script src="../../_assets/js/h2widget.js"></script>
1514
</head>
1615
<div data-role="page" class="jqm-demos" data-quicklinks="true">
1716

docs/demos/widgets/collapsibles/index.html

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@
1111
<script src="../../../../js/jquery.js"></script>
1212
<script src="../../_assets/js/"></script>
1313
<script src="../../../../js/"></script>
14-
<script src="../../_assets/js/h2widget.js"></script>
1514
<style>
1615
#demo-borders .ui-collapsible .ui-collapsible-heading .ui-btn { border-top-width: 1px !important; }
1716
</style>

0 commit comments

Comments
 (0)