/demos/_assets/js/h2widget.js

https://github.com/gabrielschulhof/jquery-mobile · JavaScript · 169 lines · 155 code · 10 blank · 4 comment · 18 complexity · 3d16913ca1be654a1f0058cef9215fa8 MD5 · raw file

  1. (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() {
  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. hashEl, hashElInPage;
  21. try {
  22. hashEl = $( hash );
  23. } catch( err ) {
  24. hashEl = $();
  25. }
  26. try {
  27. hashElInPage = $( ".ui-page-active " + hash );
  28. } catch( err ) {
  29. hashElInPage = $();
  30. }
  31. if( typeof hash !== "undefined" &&
  32. hash.search( "/" ) === -1 &&
  33. hash !== "" &&
  34. hashEl.length > 0 &&
  35. !hashEl.hasClass( "ui-page" ) &&
  36. !hashEl.hasClass( "ui-popup" ) &&
  37. hashEl.data( "role" ) !== "page" &&
  38. !hashElInPage.hasClass( "ui-panel" ) &&
  39. !hashElInPage.hasClass( "ui-popup" ) ) {
  40. //scroll to the id
  41. var pos = hashEl.offset().top;
  42. $.mobile.silentScroll( pos );
  43. $.mobile.navigate( hash, "", true );
  44. } else if( typeof f.toPage !== "object" &&
  45. hash !== "" &&
  46. $.mobile.path.parseUrl( href ).hash !== "" &&
  47. !hashEl.hasClass( "ui-page" ) && hashEl.attr( "data-role" ) !== "page" &&
  48. !hashElInPage.hasClass( "ui-panel" ) &&
  49. !hashElInPage.hasClass( "ui-popup" ) ) {
  50. $( ele ).attr( "href", href );
  51. $.mobile.document.one( "pagechange", function() {
  52. if( typeof hash !== "undefined" &&
  53. hash.search( "/" ) === -1 &&
  54. hash !== "" &&
  55. hashEl.length > 0 &&
  56. hashElInPage.length > 0 &&
  57. !hashEl.hasClass( "ui-page" ) &&
  58. hashEl.data( "role" ) !== "page" &&
  59. !hashElInPage.hasClass( "ui-panel" ) &&
  60. !hashElInPage.hasClass( "ui-popup" ) ) {
  61. hash = $.mobile.path.parseUrl( href ).hash;
  62. var pos = hashElInPage.offset().top;
  63. $.mobile.silentScroll( pos );
  64. }
  65. } );
  66. }
  67. });
  68. $( document ).on( "mobileinit", function(){
  69. var hash = window.location.hash;
  70. $.mobile.document.one( "pageshow", function(){
  71. var hashEl, hashElInPage;
  72. try {
  73. hashEl = $( hash );
  74. } catch( e ) {
  75. hashEl = $();
  76. }
  77. try {
  78. hashElInPage = $( ".ui-page-active " + hash );
  79. } catch( e ) {
  80. hashElInPage = $();
  81. }
  82. if( hash !== "" &&
  83. hashEl.length > 0 &&
  84. hashElInPage.length > 0 &&
  85. hashEl.attr( "data-role" ) !== "page" &&
  86. !hashEl.hasClass( "ui-page" ) &&
  87. !hashElInPage.hasClass( "ui-panel" ) &&
  88. !hashElInPage.hasClass( "ui-popup" ) &&
  89. !hashEl.is( "body" ) ){
  90. var pos = hashElInPage.offset().top;
  91. setTimeout( function(){
  92. $.mobile.silentScroll( pos );
  93. }, 100 );
  94. }
  95. });
  96. });
  97. //h2 widget
  98. $( document ).on( "mobileinit", function(){
  99. $.widget( "mobile.h2linker", {
  100. options:{
  101. initSelector: ":jqmData(quicklinks='true')"
  102. },
  103. _create:function(){
  104. var self = this,
  105. bodyid = "ui-page-top",
  106. panel = "<div data-role='panel' class='jqm-quicklink-panel' data-position='left' data-display='overlay' data-theme='a'><ul data-role='listview' data-inset='false' data-theme='a' data-divider-theme='a' data-icon='false'><li data-role='list-divider'>Table of Contents</li></ul></div>",
  107. first = true,
  108. h2dictionary = {};
  109. if(typeof $("body").attr("id") === "undefined"){
  110. $("body").attr("id",bodyid);
  111. } else {
  112. bodyid = $("body").attr("id");
  113. }
  114. this.element.find("div.jqm-content>h2").each(function(){
  115. var id, text = $(this).text();
  116. if(typeof $(this).attr("id") === "undefined"){
  117. id = text.replace(/[^\.a-z0-9:_-]+/gi,"");
  118. $(this).attr( "id", id );
  119. } else {
  120. id = $(this).attr("id");
  121. }
  122. h2dictionary[id] = text;
  123. if(!first){
  124. $(this).before( "<div class='jqm-top-link-container'><span><a href='#" + bodyid + "' class='jqm-top-link ui-nodisc-icon ui-alt-icon'>Top <span class='ui-icon ui-icon-arrow-u'></span></a></span></div>");
  125. } else {
  126. $(this).before("<a href='#' data-ajax='false' class='jqm-toc-link jqm-open-quicklink-panel ui-nodisc-icon ui-alt-icon'><span class='ui-icon ui-icon-caret-r'></span> Table of Contents</a>");
  127. }
  128. first = false;
  129. });
  130. this._on(".jqm-open-quicklink-panel", {
  131. "click": function(){
  132. $(".ui-page-active .jqm-quicklink-panel").panel("open");
  133. $(".ui-page-active").addClass("jqm-demos-quicklink-panel-open");
  134. return false;
  135. }
  136. });
  137. this._on( document, {
  138. "pagebeforechange": function(){
  139. this.element.find(".jqm-quicklink-panel").panel("close");
  140. this.element.find(".jqm-quicklink-panel .ui-button-active").removeClass("ui-button-active");
  141. }
  142. });
  143. if( $(h2dictionary).length > 0 ){
  144. this.element.append(panel);
  145. this.element.find(".jqm-quicklink-panel").panel().find("ul").listview();
  146. }
  147. $.each(h2dictionary,function(id,text){
  148. self.element.find(".jqm-quicklink-panel ul").append("<li><a href='#"+id+"'>"+text+"</a></li>");
  149. });
  150. self.element.find(".jqm-quicklink-panel ul").listview("refresh");
  151. }
  152. });
  153. });
  154. $( document ).bind( "pagecreate create", function( e ) {
  155. if($(e.target).data("quicklinks")){
  156. $(e.target).h2linker();
  157. }
  158. });
  159. })( jQuery );