location.js 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157
  1. /**
  2. * Reads and writes the URL based on reveal.js' current state.
  3. */
  4. export default class Location {
  5. constructor( Reveal ) {
  6. this.Reveal = Reveal;
  7. // Delays updates to the URL due to a Chrome thumbnailer bug
  8. this.writeURLTimeout = 0;
  9. }
  10. /**
  11. * Reads the current URL (hash) and navigates accordingly.
  12. */
  13. readURL() {
  14. let config = this.Reveal.getConfig();
  15. let indices = this.Reveal.getIndices();
  16. let currentSlide = this.Reveal.getCurrentSlide();
  17. let hash = window.location.hash;
  18. // Attempt to parse the hash as either an index or name
  19. let bits = hash.slice( 2 ).split( '/' ),
  20. name = hash.replace( /#|\//gi, '' );
  21. // If the first bit is not fully numeric and there is a name we
  22. // can assume that this is a named link
  23. if( !/^[0-9]*$/.test( bits[0] ) && name.length ) {
  24. let element;
  25. // Ensure the named link is a valid HTML ID attribute
  26. try {
  27. element = document.getElementById( decodeURIComponent( name ) );
  28. }
  29. catch ( error ) { }
  30. // Ensure that we're not already on a slide with the same name
  31. let isSameNameAsCurrentSlide = currentSlide ? currentSlide.getAttribute( 'id' ) === name : false;
  32. if( element ) {
  33. // If the slide exists and is not the current slide...
  34. if ( !isSameNameAsCurrentSlide ) {
  35. // ...find the position of the named slide and navigate to it
  36. let elementIndex = this.Reveal.getIndices(element);
  37. this.Reveal.slide(elementIndex.h, elementIndex.v);
  38. }
  39. }
  40. // If the slide doesn't exist, navigate to the current slide
  41. else {
  42. this.Reveal.slide( indices.h || 0, indices.v || 0 );
  43. }
  44. }
  45. else {
  46. let hashIndexBase = config.hashOneBasedIndex ? 1 : 0;
  47. // Read the index components of the hash
  48. let h = ( parseInt( bits[0], 10 ) - hashIndexBase ) || 0,
  49. v = ( parseInt( bits[1], 10 ) - hashIndexBase ) || 0,
  50. f;
  51. if( config.fragmentInURL ) {
  52. f = parseInt( bits[2], 10 );
  53. if( isNaN( f ) ) {
  54. f = undefined;
  55. }
  56. }
  57. if( h !== indices.h || v !== indices.v || f !== undefined ) {
  58. this.Reveal.slide( h, v, f );
  59. }
  60. }
  61. }
  62. /**
  63. * Updates the page URL (hash) to reflect the current
  64. * state.
  65. *
  66. * @param {number} delay The time in ms to wait before
  67. * writing the hash
  68. */
  69. writeURL( delay ) {
  70. let config = this.Reveal.getConfig();
  71. let currentSlide = this.Reveal.getCurrentSlide();
  72. // Make sure there's never more than one timeout running
  73. clearTimeout( this.writeURLTimeout );
  74. // If a delay is specified, timeout this call
  75. if( typeof delay === 'number' ) {
  76. this.writeURLTimeout = setTimeout( this.writeURL, delay );
  77. }
  78. else if( currentSlide ) {
  79. // If we're configured to push to history OR the history
  80. // API is not avaialble.
  81. if( config.history || !window.history ) {
  82. window.location.hash = this.getHash();
  83. }
  84. // If we're configured to reflect the current slide in the
  85. // URL without pushing to history.
  86. else if( config.hash ) {
  87. window.history.replaceState( null, null, '#' + this.getHash() );
  88. }
  89. // If history and hash are both disabled, a hash may still
  90. // be added to the URL by clicking on a href with a hash
  91. // target. Counter this by always removing the hash.
  92. else {
  93. window.history.replaceState( null, null, window.location.pathname + window.location.search );
  94. }
  95. }
  96. }
  97. /**
  98. * Return a hash URL that will resolve to the given slide location.
  99. *
  100. * @param {HTMLElement} [slide=currentSlide] The slide to link to
  101. */
  102. getHash( slide ) {
  103. let url = '/';
  104. // Attempt to create a named link based on the slide's ID
  105. let s = slide || this.Reveal.getCurrentSlide();
  106. let id = s ? s.getAttribute( 'id' ) : null;
  107. if( id ) {
  108. id = encodeURIComponent( id );
  109. }
  110. let index = this.Reveal.getIndices( slide );
  111. if( !this.Reveal.getConfig().fragmentInURL ) {
  112. index.f = undefined;
  113. }
  114. // If the current slide has an ID, use that as a named link,
  115. // but we don't support named links with a fragment index
  116. if( typeof id === 'string' && id.length && index.f === undefined ) {
  117. url = '/' + id;
  118. }
  119. // Otherwise use the /h/v index
  120. else {
  121. let hashIndexBase = this.Reveal.getConfig().hashOneBasedIndex ? 1 : 0;
  122. if( index.h > 0 || index.v > 0 || index.f !== undefined ) url += index.h + hashIndexBase;
  123. if( index.v > 0 || index.f !== undefined ) url += '/' + (index.v + hashIndexBase );
  124. if( index.f !== undefined ) url += '/' + index.f;
  125. }
  126. return url;
  127. }
  128. }