Deploy preview for PR 1718 🛫

pr-preview/pr-1718/assets/.sprockets-manifest-f9a68a847c117a0d273a8771a48e8426.json

@@ -0,0 +1 @@
+{"files":{"js/site_constants-e1ac483f8cbbb2d44940348129b4f096317606c1e27aa57fe14734259e395fe6.js":{"logical_path":"js/site_constants.js","mtime":"2023-02-07T20:20:21+00:00","size":98,"digest":"e1ac483f8cbbb2d44940348129b4f096317606c1e27aa57fe14734259e395fe6","integrity":"sha256-4axIP4y7stRJQDSBKbTwljF2BsHieqV/4Uc0JZ45X+Y="}},"assets":{"js/site_constants.js":"js/site_constants-e1ac483f8cbbb2d44940348129b4f096317606c1e27aa57fe14734259e395fe6.js"}}

pr-preview/pr-1718/assets/images/search.svg

@@ -0,0 +1 @@
+<svg width="28" height="28" viewBox="0 0 28 28" xmlns="http://www.w3.org/2000/svg"><title>Search</title><g fill-rule="nonzero" fill="#959396"><path d="M17.332 20.735c-5.537 0-10-4.6-10-10.247 0-5.646 4.463-10.247 10-10.247 5.536 0 10 4.601 10 10.247s-4.464 10.247-10 10.247zm0-4c3.3 0 6-2.783 6-6.247 0-3.463-2.7-6.247-6-6.247s-6 2.784-6 6.247c0 3.464 2.7 6.247 6 6.247z"/><path d="M11.672 13.791L.192 25.271 3.02 28.1 14.5 16.62z"/></g></svg>

pr-preview/pr-1718/assets/js/color_scheme.js

@@ -0,0 +1,63 @@
+function setTheme(theme) {
+    if (theme === "dark") {
+        jtd.setTheme('dark');
+        document.documentElement.setAttribute('data-theme', 'dark');
+        window.localStorage.setItem('theme', 'dark');
+    } else {
+        jtd.setTheme('light');
+        document.documentElement.setAttribute('data-theme', 'light');
+        window.localStorage.setItem('theme', 'light');
+    }
+}
+
+if (window.matchMedia) {
+    window.matchMedia('(prefers-color-scheme: dark)')
+        .addEventListener('change', event => {
+            if (event.matches) {
+                setTheme('dark');
+            } else {
+                setTheme('light');
+            }
+        });
+}
+
+function getUserThemePreference() {
+  return localStorage.getItem('theme') || getComputedStyle(document.documentElement).getPropertyValue('content') || 'system';
+}
+
+function saveUserThemePreference(preference) {
+  localStorage.setItem('theme', preference);
+}
+
+function getAppliedMode(preference) {
+  if (preference === 'dark') {
+    return 'dark';
+  }
+  if (preference === 'light') {
+    return 'light';
+  }
+  // system
+  if (matchMedia('(prefers-color-scheme: dark)').matches) {
+    return 'dark';
+  }
+  return 'light';
+}
+
+const colorScheme = document.querySelector('meta[name="color-scheme"]');
+function setAppliedMode(mode) {
+  setTheme(mode);
+}
+
+function modeSwitcher() {
+    let currentMode = document.documentElement.getAttribute('data-theme');
+    if (currentMode === "dark") {
+        setAppliedMode('light');
+        document.getElementById("theme-toggle").innerHTML = "Dark Mode";
+      } else {
+        setAppliedMode('dark');
+        document.getElementById("theme-toggle").innerHTML = "Light Mode";
+    }
+}
+
+let theme = getUserThemePreference();
+setAppliedMode(getAppliedMode(theme));

pr-preview/pr-1718/assets/js/just-the-docs.js

@@ -0,0 +1,445 @@
+(function (jtd, undefined) {
+
+// Event handling
+
+jtd.addEvent = function(el, type, handler) {
+  if (el.attachEvent) el.attachEvent('on'+type, handler); else el.addEventListener(type, handler);
+}
+jtd.removeEvent = function(el, type, handler) {
+  if (el.detachEvent) el.detachEvent('on'+type, handler); else el.removeEventListener(type, handler);
+}
+jtd.onReady = function(ready) {
+  // in case the document is already rendered
+  if (document.readyState!='loading') ready();
+  // modern browsers
+  else if (document.addEventListener) document.addEventListener('DOMContentLoaded', ready);
+  // IE <= 8
+  else document.attachEvent('onreadystatechange', function(){
+      if (document.readyState=='complete') ready();
+  });
+}
+
+// Show/hide mobile menu
+
+function initNav() {
+  jtd.addEvent(document, 'click', function(e){
+    var target = e.target;
+    while (target && !(target.classList && target.classList.contains('nav-list-expander'))) {
+      target = target.parentNode;
+    }
+    if (target) {
+      e.preventDefault();
+      target.parentNode.classList.toggle('active');
+    }
+  });
+
+  const siteNav = document.getElementById('site-nav');
+  const mainHeader = document.getElementById('main-header');
+  const menuButton = document.getElementById('menu-button');
+
+  jtd.addEvent(menuButton, 'click', function(e){
+    e.preventDefault();
+
+    if (menuButton.classList.toggle('nav-open')) {
+      siteNav.classList.add('nav-open');
+      mainHeader.classList.add('nav-open');
+    } else {
+      siteNav.classList.remove('nav-open');
+      mainHeader.classList.remove('nav-open');
+    }
+  });
+}
+// Site search
+
+function initSearch() {
+  var request = new XMLHttpRequest();
+  request.open('GET', 'https://vagrant-libvirt.github.io/vagrant-libvirt/pr-preview/pr-1718/assets/js/search-data.json', true);
+
+  request.onload = function(){
+    if (request.status >= 200 && request.status < 400) {
+      var docs = JSON.parse(request.responseText);
+      
+      lunr.tokenizer.separator = /[\s\-/]+/
+
+      var index = lunr(function(){
+        this.ref('id');
+        this.field('title', { boost: 200 });
+        this.field('content', { boost: 2 });
+        this.field('relUrl');
+        this.metadataWhitelist = ['position']
+
+        for (var i in docs) {
+          this.add({
+            id: i,
+            title: docs[i].title,
+            content: docs[i].content,
+            relUrl: docs[i].relUrl
+          });
+        }
+      });
+
+      searchLoaded(index, docs);
+    } else {
+      console.log('Error loading ajax request. Request status:' + request.status);
+    }
+  };
+
+  request.onerror = function(){
+    console.log('There was a connection error');
+  };
+
+  request.send();
+}
+
+function searchLoaded(index, docs) {
+  var index = index;
+  var docs = docs;
+  var searchInput = document.getElementById('search-input');
+  var searchResults = document.getElementById('search-results');
+  var mainHeader = document.getElementById('main-header');
+  var currentInput;
+  var currentSearchIndex = 0;
+
+  function showSearch() {
+    document.documentElement.classList.add('search-active');
+  }
+
+  function hideSearch() {
+    document.documentElement.classList.remove('search-active');
+  }
+
+  function update() {
+    currentSearchIndex++;
+
+    var input = searchInput.value;
+    if (input === '') {
+      hideSearch();
+    } else {
+      showSearch();
+      // scroll search input into view, workaround for iOS Safari
+      window.scroll(0, -1);
+      setTimeout(function(){ window.scroll(0, 0); }, 0);
+    }
+    if (input === currentInput) {
+      return;
+    }
+    currentInput = input;
+    searchResults.innerHTML = '';
+    if (input === '') {
+      return;
+    }
+
+    var results = index.query(function (query) {
+      var tokens = lunr.tokenizer(input)
+      query.term(tokens, {
+        boost: 10
+      });
+      query.term(tokens, {
+        wildcard: lunr.Query.wildcard.TRAILING
+      });
+    });
+
+    if ((results.length == 0) && (input.length > 2)) {
+      var tokens = lunr.tokenizer(input).filter(function(token, i) {
+        return token.str.length < 20;
+      })
+      if (tokens.length > 0) {
+        results = index.query(function (query) {
+          query.term(tokens, {
+            editDistance: Math.round(Math.sqrt(input.length / 2 - 1))
+          });
+        });
+      }
+    }
+
+    if (results.length == 0) {
+      var noResultsDiv = document.createElement('div');
+      noResultsDiv.classList.add('search-no-result');
+      noResultsDiv.innerText = 'No results found';
+      searchResults.appendChild(noResultsDiv);
+
+    } else {
+      var resultsList = document.createElement('ul');
+      resultsList.classList.add('search-results-list');
+      searchResults.appendChild(resultsList);
+
+      addResults(resultsList, results, 0, 10, 100, currentSearchIndex);
+    }
+
+    function addResults(resultsList, results, start, batchSize, batchMillis, searchIndex) {
+      if (searchIndex != currentSearchIndex) {
+        return;
+      }
+      for (var i = start; i < (start + batchSize); i++) {
+        if (i == results.length) {
+          return;
+        }
+        addResult(resultsList, results[i]);
+      }
+      setTimeout(function() {
+        addResults(resultsList, results, start + batchSize, batchSize, batchMillis, searchIndex);
+      }, batchMillis);
+    }
+
+    function addResult(resultsList, result) {
+      var doc = docs[result.ref];
+
+      var resultsListItem = document.createElement('li');
+      resultsListItem.classList.add('search-results-list-item');
+      resultsList.appendChild(resultsListItem);
+
+      var resultLink = document.createElement('a');
+      resultLink.classList.add('search-result');
+      resultLink.setAttribute('href', doc.url);
+      resultsListItem.appendChild(resultLink);
+
+      var resultTitle = document.createElement('div');
+      resultTitle.classList.add('search-result-title');
+      resultLink.appendChild(resultTitle);
+
+      var resultDoc = document.createElement('div');
+      resultDoc.classList.add('search-result-doc');
+      resultDoc.innerHTML = '<svg viewBox="0 0 24 24" class="search-result-icon"><use xlink:href="#svg-doc"></use></svg>';
+      resultTitle.appendChild(resultDoc);
+
+      var resultDocTitle = document.createElement('div');
+      resultDocTitle.classList.add('search-result-doc-title');
+      resultDocTitle.innerHTML = doc.doc;
+      resultDoc.appendChild(resultDocTitle);
+      var resultDocOrSection = resultDocTitle;
+
+      if (doc.doc != doc.title) {
+        resultDoc.classList.add('search-result-doc-parent');
+        var resultSection = document.createElement('div');
+        resultSection.classList.add('search-result-section');
+        resultSection.innerHTML = doc.title;
+        resultTitle.appendChild(resultSection);
+        resultDocOrSection = resultSection;
+      }
+
+      var metadata = result.matchData.metadata;
+      var titlePositions = [];
+      var contentPositions = [];
+      for (var j in metadata) {
+        var meta = metadata[j];
+        if (meta.title) {
+          var positions = meta.title.position;
+          for (var k in positions) {
+            titlePositions.push(positions[k]);
+          }
+        }
+        if (meta.content) {
+          var positions = meta.content.position;
+          for (var k in positions) {
+            var position = positions[k];
+            var previewStart = position[0];
+            var previewEnd = position[0] + position[1];
+            var ellipsesBefore = true;
+            var ellipsesAfter = true;
+            for (var k = 0; k < 5; k++) {
+              var nextSpace = doc.content.lastIndexOf(' ', previewStart - 2);
+              var nextDot = doc.content.lastIndexOf('. ', previewStart - 2);
+              if ((nextDot >= 0) && (nextDot > nextSpace)) {
+                previewStart = nextDot + 1;
+                ellipsesBefore = false;
+                break;
+              }
+              if (nextSpace < 0) {
+                previewStart = 0;
+                ellipsesBefore = false;
+                break;
+              }
+              previewStart = nextSpace + 1;
+            }
+            for (var k = 0; k < 10; k++) {
+              var nextSpace = doc.content.indexOf(' ', previewEnd + 1);
+              var nextDot = doc.content.indexOf('. ', previewEnd + 1);
+              if ((nextDot >= 0) && (nextDot < nextSpace)) {
+                previewEnd = nextDot;
+                ellipsesAfter = false;
+                break;
+              }
+              if (nextSpace < 0) {
+                previewEnd = doc.content.length;
+                ellipsesAfter = false;
+                break;
+              }
+              previewEnd = nextSpace;
+            }
+            contentPositions.push({
+              highlight: position,
+              previewStart: previewStart, previewEnd: previewEnd,
+              ellipsesBefore: ellipsesBefore, ellipsesAfter: ellipsesAfter
+            });
+          }
+        }
+      }
+
+      if (titlePositions.length > 0) {
+        titlePositions.sort(function(p1, p2){ return p1[0] - p2[0] });
+        resultDocOrSection.innerHTML = '';
+        addHighlightedText(resultDocOrSection, doc.title, 0, doc.title.length, titlePositions);
+      }
+
+      if (contentPositions.length > 0) {
+        contentPositions.sort(function(p1, p2){ return p1.highlight[0] - p2.highlight[0] });
+        var contentPosition = contentPositions[0];
+        var previewPosition = {
+          highlight: [contentPosition.highlight],
+          previewStart: contentPosition.previewStart, previewEnd: contentPosition.previewEnd,
+          ellipsesBefore: contentPosition.ellipsesBefore, ellipsesAfter: contentPosition.ellipsesAfter
+        };
+        var previewPositions = [previewPosition];
+        for (var j = 1; j < contentPositions.length; j++) {
+          contentPosition = contentPositions[j];
+          if (previewPosition.previewEnd < contentPosition.previewStart) {
+            previewPosition = {
+              highlight: [contentPosition.highlight],
+              previewStart: contentPosition.previewStart, previewEnd: contentPosition.previewEnd,
+              ellipsesBefore: contentPosition.ellipsesBefore, ellipsesAfter: contentPosition.ellipsesAfter
+            }
+            previewPositions.push(previewPosition);
+          } else {
+            previewPosition.highlight.push(contentPosition.highlight);
+            previewPosition.previewEnd = contentPosition.previewEnd;
+            previewPosition.ellipsesAfter = contentPosition.ellipsesAfter;
+          }
+        }
+
+        var resultPreviews = document.createElement('div');
+        resultPreviews.classList.add('search-result-previews');
+        resultLink.appendChild(resultPreviews);
+
+        var content = doc.content;
+        for (var j = 0; j < Math.min(previewPositions.length, 3); j++) {
+          var position = previewPositions[j];
+
+          var resultPreview = document.createElement('div');
+          resultPreview.classList.add('search-result-preview');
+          resultPreviews.appendChild(resultPreview);
+
+          if (position.ellipsesBefore) {
+            resultPreview.appendChild(document.createTextNode('... '));
+          }
+          addHighlightedText(resultPreview, content, position.previewStart, position.previewEnd, position.highlight);
+          if (position.ellipsesAfter) {
+            resultPreview.appendChild(document.createTextNode(' ...'));
+          }
+        }
+      }
+      var resultRelUrl = document.createElement('span');
+      resultRelUrl.classList.add('search-result-rel-url');
+      resultRelUrl.innerText = doc.relUrl;
+      resultTitle.appendChild(resultRelUrl);
+    }
+
+    function addHighlightedText(parent, text, start, end, positions) {
+      var index = start;
+      for (var i in positions) {
+        var position = positions[i];
+        var span = document.createElement('span');
+        span.innerHTML = text.substring(index, position[0]);
+        parent.appendChild(span);
+        index = position[0] + position[1];
+        var highlight = document.createElement('span');
+        highlight.classList.add('search-result-highlight');
+        highlight.innerHTML = text.substring(position[0], index);
+        parent.appendChild(highlight);
+      }
+      var span = document.createElement('span');
+      span.innerHTML = text.substring(index, end);
+      parent.appendChild(span);
+    }
+  }
+
+  jtd.addEvent(searchInput, 'focus', function(){
+    setTimeout(update, 0);
+  });
+
+  jtd.addEvent(searchInput, 'keyup', function(e){
+    switch (e.keyCode) {
+      case 27: // When esc key is pressed, hide the results and clear the field
+        searchInput.value = '';
+        break;
+      case 38: // arrow up
+      case 40: // arrow down
+      case 13: // enter
+        e.preventDefault();
+        return;
+    }
+    update();
+  });
+
+  jtd.addEvent(searchInput, 'keydown', function(e){
+    switch (e.keyCode) {
+      case 38: // arrow up
+        e.preventDefault();
+        var active = document.querySelector('.search-result.active');
+        if (active) {
+          active.classList.remove('active');
+          if (active.parentElement.previousSibling) {
+            var previous = active.parentElement.previousSibling.querySelector('.search-result');
+            previous.classList.add('active');
+          }
+        }
+        return;
+      case 40: // arrow down
+        e.preventDefault();
+        var active = document.querySelector('.search-result.active');
+        if (active) {
+          if (active.parentElement.nextSibling) {
+            var next = active.parentElement.nextSibling.querySelector('.search-result');
+            active.classList.remove('active');
+            next.classList.add('active');
+          }
+        } else {
+          var next = document.querySelector('.search-result');
+          if (next) {
+            next.classList.add('active');
+          }
+        }
+        return;
+      case 13: // enter
+        e.preventDefault();
+        var active = document.querySelector('.search-result.active');
+        if (active) {
+          active.click();
+        } else {
+          var first = document.querySelector('.search-result');
+          if (first) {
+            first.click();
+          }
+        }
+        return;
+    }
+  });
+
+  jtd.addEvent(document, 'click', function(e){
+    if (e.target != searchInput) {
+      hideSearch();
+    }
+  });
+}
+
+// Switch theme
+
+jtd.getTheme = function() {
+  var cssFileHref = document.querySelector('[rel="stylesheet"]').getAttribute('href');
+  return cssFileHref.substring(cssFileHref.lastIndexOf('-') + 1, cssFileHref.length - 4);
+}
+
+jtd.setTheme = function(theme) {
+  var cssFile = document.querySelector('[rel="stylesheet"]');
+  cssFile.setAttribute('href', 'https://vagrant-libvirt.github.io/vagrant-libvirt/pr-preview/pr-1718/assets/css/just-the-docs-' + theme + '.css');
+}
+
+// Document ready
+
+jtd.onReady(function(){
+  initNav();
+  initSearch();
+});
+
+})(window.jtd = window.jtd || {});
+
+

pr-preview/pr-1718/assets/js/plugin_versions_menu.js

@@ -0,0 +1,229 @@
+// Look at webpack to replace the dependency loading
+// also would allow use yarn + jest to support unit testing code below
+
+const dependencies = [
+    {
+        src: 'https://cdnjs.cloudflare.com/ajax/libs/axios/0.27.2/axios.min.js',
+        integrity: 'sha512-odNmoc1XJy5x1TMVMdC7EMs3IVdItLPlCeL5vSUPN2llYKMJ2eByTTAIiiuqLg+GdNr9hF6z81p27DArRFKT7A==',
+        crossOrigin: 'anonymous',
+    },
+    {
+        src: 'https://cdn.jsdelivr.net/npm/axios-cache-interceptor@0.10.6/dist/index.bundle.js',
+        integrity: 'sha256-yJbSlTxKmgU+sjlMx48OSjoiUsboy18gXTxUBniEEO0=',
+        crossOrigin: 'anonymous',
+    },
+]
+
+const loaded = [];
+
+dependencies.forEach( (dep, i) => {
+    loaded[i] = false;
+    loadScript(dep, function() {
+        loaded[i] = true;
+        if (loaded.every(value => value === true)) {
+            // arguments come from a site constants file
+            handleVersionedDocs(repository_nwo, basePath);
+        }
+    });
+})
+
+// helper taken from https://stackoverflow.com/a/950146 under CC BY-SA 4.0, added support
+// for additional attributes to be set on the script tag.
+function loadScript(url, callback)
+{
+    // Adding the script tag to the head as suggested before
+    var head = document.head;
+    var script = document.createElement('script');
+    script.type = 'text/javascript';
+    script.src = url.src;
+    delete url.src;
+    for (var attribute in url) {
+        script[attribute] = url[attribute];
+    }
+
+    // Then bind the event to the callback function.
+    // There are several events for cross browser compatibility.
+    script.onreadystatechange = callback;
+    script.onload = callback;
+
+    // Fire the loading
+    head.appendChild(script);
+}
+
+// main function, must wait until dependencies are loaded before calling
+function handleVersionedDocs(repository_nwo, basePath) {
+    const { buildWebStorage, setupCache } = window.AxiosCacheInterceptor;
+    const storage = buildWebStorage(sessionStorage, 'axios-cache:');
+    const axiosCached = setupCache(axios.create(), { storage });
+
+    menuBackgroundImageClosed = "url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='15 6 9 12 15 18'%3E%3C/polyline%3E%3C/svg%3E\")";
+    menuBackgroundImageOpen = "url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E\")";
+
+    async function loadOptions(menu, dropdown) {
+        const defaultBranchPromise = axiosCached.get(
+            `https://api.github.com/repos/${repository_nwo}`,
+        ).then(res => {
+            return res.data.default_branch;
+        });
+
+        const statusPredicate = (status) => status === 404 || status >= 200 && status < 400
+        const versionDir = await axiosCached.get(
+            `https://api.github.com/repos/${repository_nwo}/git/trees/gh-pages`, {
+                cache: {
+                    cachePredicate: {
+                        statusCheck: statusPredicate
+                    }
+                },
+                validateStatus: statusPredicate
+            }
+        ).then(res => {
+            if (res.status === 404) {
+                return null;
+            }
+
+            return res.data.tree.find(t => {
+                return t.path.toLowerCase() === 'version';
+            });
+        });
+
+        if (versionDir === undefined || versionDir === null) {
+            var options = [];
+        } else {
+            res = await axios.get(versionDir.url);
+            var options = res.data.tree.map(t => {
+                return {value: t.path, text: t.path};
+            });
+        };
+
+        options = options.sort( (a, b) => b.value.localeCompare(a.value, undefined, { numeric:true }) );
+
+        const defaultBranch = await defaultBranchPromise;
+        options.unshift({ value: 'latest', text: defaultBranch });
+
+        var currentVersion = "";
+        const versionPath = `${basePath}/version/`;
+        const path = window.location.pathname.toLowerCase();
+        if (path.startsWith(versionPath)) {
+            const start = versionPath.length;
+            const end = path.indexOf('/', start+1);
+            currentVersion = path.substring(start, end < 0 ? path.length : end);
+            currentPage = path.substring(end < 0 ? path.length : end);
+        } else {
+            currentVersion = defaultBranch;
+            currentPage = path.substring(basePath.length);
+        }
+        menu.innerHTML = `Plugin Version: ${currentVersion}`;
+        menu.appendChild(dropdown);
+
+        options.forEach( item => {
+            var link = document.createElement('a');
+            var wrapper = document.createElement('div');
+            link.href = (item.value === 'latest' ? basePath : versionPath + item.value) + currentPage;
+            link.innerHTML = item.text;
+            link.className = 'plugin-version-menu-option';
+            link.style.cssText = `
+            width: 100%;
+            padding: 0.5rem 2rem 0.5rem 1rem;
+            display: block;
+            `;
+            wrapper.style.cssText = `
+            width: 100%;
+            height: 100%;
+            display: block;
+            backdrop-filter: brightness(0.85);
+            `;
+
+            wrapper.addEventListener('mouseover', function(e) { brightenMenuOption(e.target); });
+            wrapper.addEventListener('mouseout', function(e) { restoreMenuOption(e.target); });
+
+            if (item.text === currentVersion) {
+                link.style.fontWeight = 'bold';
+            }
+
+            wrapper.appendChild(link);
+            dropdown.appendChild(wrapper);
+        });
+    };
+
+    function brightenMenuOption(option) {
+        option.style.backdropFilter = 'brightness(1.1)';
+        // possible alternatives
+        //option.style.boxShadow = 'inset 0 0 0 10em rgba(255, 255, 255, 0.6)';
+        //option.style.backgroundColor = 'rgba(255,255,255,0.5)';
+    }
+
+    function restoreMenuOption(option) {
+        option.style.backdropFilter = 'brightness(0.9)';
+        //option.style.boxShadow = 'none';
+        //option.style.backgroundColor = 'transparent';
+    }
+
+    // get main menu element and style as needed
+    menuElement = document.getElementById("plugin-version-menu");
+    menuElement.style.backgroundImage = menuBackgroundImageOpen; // preload open image so no delay in rendering
+    menuElement.className = 'plugin-version-menu-background-fonts-style';
+    menuElement.style.cssText = `
+      position: relative;
+      width: 180px;
+      border: 1px solit transparent;
+      padding: 1rem 1rem;
+      background-image: ${menuBackgroundImageClosed};
+      background-repeat: no-repeat;
+      background-position: 90% 40%;
+      cursor: pointer;
+    `;
+
+    dropdown = document.createElement('div');
+    dropdown.id = "plugin-version-dropdown";
+    dropdown.className = 'plugin-version-menu-background-fonts-style';
+    dropdown.style.cssText = `
+      position: relative;
+      top: 0.25rem;
+      left: -0.25rem;
+      min-width: 150px;
+      box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.4);
+      padding: 0;
+      z-index: 1;
+    `;
+
+    function showMenu() {
+        dropdown.style.display = 'block';
+        menuElement.style.backgroundImage = menuBackgroundImageOpen;
+    }
+
+    function hideMenu() {
+        dropdown.style.display = 'none';
+        menuElement.style.backgroundImage = menuBackgroundImageClosed;
+    }
+
+    function toggleMenu() {
+        if (dropdown.style.display == 'none') {
+            showMenu();
+        } else {
+            hideMenu();
+        }
+    }
+
+    function toggleMenuDisplay(e) {
+        if (dropdown.contains(e.target)) {
+            return;
+        }
+
+        if (menuElement.contains(e.target)) {
+            toggleMenu();
+        }
+    }
+
+    // ensure initial style of drop down menu is set
+    toggleMenu();
+
+    // populate menu with available options and current version
+    loadOptions(menuElement, dropdown);
+    menuElement.addEventListener('click', toggleMenuDisplay)
+    window.addEventListener('click', function(e){
+        if (!menuElement.contains(e.target)){
+            // Clicked outside the drop down menu
+            hideMenu();
+        }
+    });
+}

pr-preview/pr-1718/assets/js/site_constants-e1ac483f8cbbb2d44940348129b4f096317606c1e27aa57fe14734259e395fe6.js

@@ -0,0 +1,5 @@
+
+const basePath = '/vagrant-libvirt';
+const repository_nwo = 'vagrant-libvirt/vagrant-libvirt';
+
+

pr-preview/pr-1718/feed.xml

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="utf-8"?><feed xmlns="http://www.w3.org/2005/Atom" ><generator uri="https://jekyllrb.com/" version="3.9.3">Jekyll</generator><link href="https://vagrant-libvirt.github.io/vagrant-libvirt/pr-preview/pr-1718/feed.xml" rel="self" type="application/atom+xml" /><link href="https://vagrant-libvirt.github.io/vagrant-libvirt/pr-preview/pr-1718/" rel="alternate" type="text/html" /><updated>2023-02-07T20:21:02+00:00</updated><id>https://vagrant-libvirt.github.io/vagrant-libvirt/pr-preview/pr-1718/feed.xml</id><title type="html">Vagrant Libvirt Documentation</title><subtitle>Create and manage Vagrant machines using Libvirt/QEMU</subtitle></feed>