[Summary view] [Print] [Text view]

   1  (self["webpackChunkWordPress"] = self["webpackChunkWordPress"] || []).push([[908],{
   2  
   3  /***/ 908:
   4  /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
   5  
   6  __webpack_require__.r(__webpack_exports__);
   7  /* harmony export */ __webpack_require__.d(__webpack_exports__, {
   8  /* harmony export */   actions: function() { return /* binding */ actions; },
   9  /* harmony export */   state: function() { return /* binding */ state; }
  10  /* harmony export */ });
  11  /* harmony import */ var _wordpress_interactivity__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(998);
  12  /**
  13   * WordPress dependencies
  14   */
  15  
  16  
  17  // The cache of visited and prefetched pages.
  18  const pages = new Map();
  19  
  20  // Helper to remove domain and hash from the URL. We are only interesting in
  21  // caching the path and the query.
  22  const cleanUrl = url => {
  23    const u = new URL(url, window.location);
  24    return u.pathname + u.search;
  25  };
  26  
  27  // Fetch a new page and convert it to a static virtual DOM.
  28  const fetchPage = async (url, {
  29    html
  30  }) => {
  31    try {
  32      if (!html) {
  33        const res = await window.fetch(url);
  34        if (res.status !== 200) return false;
  35        html = await res.text();
  36      }
  37      const dom = new window.DOMParser().parseFromString(html, 'text/html');
  38      return regionsToVdom(dom);
  39    } catch (e) {
  40      return false;
  41    }
  42  };
  43  
  44  // Return an object with VDOM trees of those HTML regions marked with a
  45  // `router-region` directive.
  46  const regionsToVdom = dom => {
  47    const regions = {};
  48    const attrName = `data-$_wordpress_interactivity__WEBPACK_IMPORTED_MODULE_0__.directivePrefix}-router-region`;
  49    dom.querySelectorAll(`[$attrName}]`).forEach(region => {
  50      const id = region.getAttribute(attrName);
  51      regions[id] = (0,_wordpress_interactivity__WEBPACK_IMPORTED_MODULE_0__.toVdom)(region);
  52    });
  53    const title = dom.querySelector('title')?.innerText;
  54    return {
  55      regions,
  56      title
  57    };
  58  };
  59  
  60  // Render all interactive regions contained in the given page.
  61  const renderRegions = page => {
  62    const attrName = `data-$_wordpress_interactivity__WEBPACK_IMPORTED_MODULE_0__.directivePrefix}-router-region`;
  63    document.querySelectorAll(`[$attrName}]`).forEach(region => {
  64      const id = region.getAttribute(attrName);
  65      const fragment = (0,_wordpress_interactivity__WEBPACK_IMPORTED_MODULE_0__.getRegionRootFragment)(region);
  66      (0,_wordpress_interactivity__WEBPACK_IMPORTED_MODULE_0__.render)(page.regions[id], fragment);
  67    });
  68    if (page.title) {
  69      document.title = page.title;
  70    }
  71  };
  72  
  73  // Variable to store the current navigation.
  74  let navigatingTo = '';
  75  
  76  // Listen to the back and forward buttons and restore the page if it's in the
  77  // cache.
  78  window.addEventListener('popstate', async () => {
  79    const url = cleanUrl(window.location); // Remove hash.
  80    const page = pages.has(url) && (await pages.get(url));
  81    if (page) {
  82      renderRegions(page);
  83    } else {
  84      window.location.reload();
  85    }
  86  });
  87  
  88  // Cache the current regions.
  89  pages.set(cleanUrl(window.location), Promise.resolve(regionsToVdom(document)));
  90  const {
  91    state,
  92    actions
  93  } = (0,_wordpress_interactivity__WEBPACK_IMPORTED_MODULE_0__.store)('core/router', {
  94    actions: {
  95      /**
  96       * Navigates to the specified page.
  97       *
  98       * This function normalizes the passed href, fetchs the page HTML if
  99       * needed, and updates any interactive regions whose contents have
 100       * changed. It also creates a new entry in the browser session history.
 101       *
 102       * @param {string}  href              The page href.
 103       * @param {Object}  [options]         Options object.
 104       * @param {boolean} [options.force]   If true, it forces re-fetching the
 105       *                                    URL.
 106       * @param {string}  [options.html]    HTML string to be used instead of
 107       *                                    fetching the requested URL.
 108       * @param {boolean} [options.replace] If true, it replaces the current
 109       *                                    entry in the browser session
 110       *                                    history.
 111       * @param {number}  [options.timeout] Time until the navigation is
 112       *                                    aborted, in milliseconds. Default
 113       *                                    is 10000.
 114       *
 115       * @return {Promise} Promise that resolves once the navigation is
 116       *                   completed or aborted.
 117       */
 118      *navigate(href, options = {}) {
 119        const url = cleanUrl(href);
 120        navigatingTo = href;
 121        actions.prefetch(url, options);
 122  
 123        // Create a promise that resolves when the specified timeout ends.
 124        // The timeout value is 10 seconds by default.
 125        const timeoutPromise = new Promise(resolve => {
 126          var _options$timeout;
 127          return setTimeout(resolve, (_options$timeout = options.timeout) !== null && _options$timeout !== void 0 ? _options$timeout : 10000);
 128        });
 129        const page = yield Promise.race([pages.get(url), timeoutPromise]);
 130  
 131        // Once the page is fetched, the destination URL could have changed
 132        // (e.g., by clicking another link in the meantime). If so, bail
 133        // out, and let the newer execution to update the HTML.
 134        if (navigatingTo !== href) return;
 135        if (page) {
 136          renderRegions(page);
 137          window.history[options.replace ? 'replaceState' : 'pushState']({}, '', href);
 138        } else {
 139          window.location.assign(href);
 140          yield new Promise(() => {});
 141        }
 142      },
 143      /**
 144       * Prefetchs the page with the passed URL.
 145       *
 146       * The function normalizes the URL and stores internally the fetch
 147       * promise, to avoid triggering a second fetch for an ongoing request.
 148       *
 149       * @param {string}  url             The page URL.
 150       * @param {Object}  [options]       Options object.
 151       * @param {boolean} [options.force] Force fetching the URL again.
 152       * @param {string}  [options.html]  HTML string to be used instead of
 153       *                                  fetching the requested URL.
 154       */
 155      prefetch(url, options = {}) {
 156        url = cleanUrl(url);
 157        if (options.force || !pages.has(url)) {
 158          pages.set(url, fetchPage(url, options));
 159        }
 160      }
 161    }
 162  });
 163  
 164  /***/ })
 165  
 166  }])