+{"version":3,"names":[],"mappings":"","sources":["main.js"],"sourcesContent":["/*!\n * This file is part of help.eyeo.com.\n * Copyright (C) 2017-present eyeo GmbH\n *\n * help.eyeo.com is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * help.eyeo.com is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with help.eyeo.com. If not, see <http://www.gnu.org/licenses/>.\n */\n(function()\n{\n document.addEventListener(\"DOMContentLoaded\", function()\n {\n\n /**************************************************************************\n * General\n **************************************************************************/\n\n // Change html class name from \"no-js\" to \"js\"\n document.documentElement.className = \"js\";\n\n /**************************************************************************\n * Navbar\n **************************************************************************/\n\n function toggleNavbarCollapse()\n {\n var navbarCollapseEls = this.parentElement.getElementsByClassName(\"navbar-collapse\");\n for (var i = 0; i < navbarCollapseEls.length; i++)\n {\n navbarCollapseEls[i]\n .classList.toggle(\"open\")\n }\n }\n\n var toggleNavbarCollapseEls = document.getElementsByClassName(\"toggle-navbar-collapse\");\n for (var i = 0; i < toggleNavbarCollapseEls.length; i++)\n {\n toggleNavbarCollapseEls[i]\n .addEventListener(\"click\", toggleNavbarCollapse, false);\n }\n\n /**************************************************************************\n * CustomSelect\n **************************************************************************/\n\n function CustomSelect(select)\n {\n this.select = select;\n this.close();\n this.select\n .addEventListener(\"click\", this._onClick.bind(this), false);\n this.select\n .addEventListener(\"focusout\", this._onFocusOut.bind(this), false);\n }\n\n CustomSelect.prototype._onFocusOut = function()\n {\n // setTimeout to allow document.activeElement \n // to move to newly focused element\n setTimeout(function()\n {\n var newFocus = document.activeElement;\n \n if (newFocus\n .classList.contains(\"custom-select-selected\") ||\n newFocus\n .classList.contains(\"custom-select-option\") ||\n newFocus\n .parentElement\n .classList.contains(\"custom-select-option\"))\n {\n return;\n }\n\n this.close();\n \n }.bind(this), 1);\n }\n\n CustomSelect.prototype._onClick = function(event)\n {\n if (event.target.classList.contains(\"custom-select-selected\"))\n {\n var options = this.select.querySelector(\".custom-select-options\");\n if (options.getAttribute(\"aria-hidden\") == \"true\")\n {\n this.open();\n }\n else\n {\n this.close();\n }\n }\n }\n\n CustomSelect.prototype.open = function()\n {\n this.select\n .querySelector(\".custom-select-selected\")\n .setAttribute(\"aria-expanded\", \"true\");\n\n this.select\n .querySelector(\".custom-select-options\")\n .removeAttribute(\"aria-hidden\");\n }\n\n CustomSelect.prototype.close = function()\n {\n this.select\n .querySelector(\".custom-select-selected\")\n .setAttribute(\"aria-expanded\", \"false\");\n\n this.select\n .querySelector(\".custom-select-options\")\n .setAttribute(\"aria-hidden\", \"true\");\n }\n \n new CustomSelect(document.getElementById(\"language-select\"));\n\n /**************************************************************************\n * Accordion\n **************************************************************************/\n\n function Accordion(accordion)\n {\n this.accordion = accordion;\n \n var accordionButtons = this.accordion.getElementsByClassName('accordion-toggle-button');\n for (var i = 0; i < accordionButtons.length; i++)\n {\n // Close all sections except the first\n if (i !== 0)\n {\n accordionButtons[i].setAttribute(\"aria-expanded\", \"false\");\n document\n .getElementById( accordionButtons[i].getAttribute(\"aria-controls\") )\n .setAttribute(\"hidden\", \"true\");\n }\n }\n\n this.accordion\n .addEventListener(\"click\", this._onClick.bind(this), false);\n this.accordion\n .addEventListener(\"keydown\", this._onKeyDown.bind(this), false);\n }\n\n Accordion.prototype.toggleSection = function(clickedButton)\n {\n // Hide currently expanded section\n var expandedButton = this.accordion.querySelector(\"button[aria-expanded='true']\");\n if (expandedButton)\n {\n expandedButton.setAttribute(\"aria-expanded\", \"false\");\n document\n .getElementById( expandedButton.getAttribute(\"aria-controls\") )\n .setAttribute(\"hidden\", \"true\");\n }\n\n // If currently expanded section is clicked\n if (expandedButton === clickedButton) return;\n\n // Expand new section\n clickedButton.setAttribute(\"aria-expanded\", \"true\");\n document\n .getElementById( clickedButton.getAttribute(\"aria-controls\") )\n .removeAttribute(\"hidden\");\n }\n\n Accordion.prototype.focusNextSection = function()\n {\n var currentFocus = document.activeElement;\n var nextheading = currentFocus.parentElement.nextElementSibling.nextElementSibling;\n\n if (nextheading)\n {\n nextheading // .accordion-heading\n .firstElementChild // .accordion-toggle-button\n .focus();\n }\n else\n {\n this.accordion\n .firstElementChild // .accordion-heading\n .firstElementChild // .accordion-toggle-button\n .focus();\n }\n }\n\n Accordion.prototype.focusPrevSection = function()\n {\n var currentFocus = document.activeElement;\n var prevAccordionBody = currentFocus.parentElement.previousElementSibling;\n\n if (prevAccordionBody)\n {\n prevAccordionBody // .accordion-body\n .previousElementSibling // .accordion-heading\n .firstElementChild // .accordion-toggle-button\n .focus();\n }\n else\n {\n this.accordion\n .lastElementChild // .accordion-body\n .previousElementSibling // .accordion-heading\n .firstElementChild // .accordion-toggle-button\n .focus();\n }\n }\n\n Accordion.prototype._onKeyDown = function(event)\n {\n if (!event.target.classList.contains(\"accordion-toggle-button\")) return;\n\n if (event.key == \"ArrowUp\" || event.keyCode == 38)\n {\n this.focusPrevSection();\n }\n else if (event.key == \"ArrowDown\" || event.keyCode == 40)\n {\n this.focusNextSection();\n }\n }\n\n Accordion.prototype._onClick = function(event)\n {\n if (!event.target.classList.contains(\"accordion-toggle-button\")) return;\n \n this.toggleSection(event.target);\n }\n\n var productTopicsAccordion = document.getElementById('product-topics-accordion');\n if (productTopicsAccordion)\n {\n new Accordion(productTopicsAccordion);\n }\n\n /**************************************************************************\n * BrowserSelect\n **************************************************************************/\n\n function BrowserSelect(select)\n {\n this.select = select;\n CustomSelect.apply(this, [this.select]);\n \n this.BROWSER_STORAGE_KEY = \"BROWSER\";\n this.BROWSER_AUTODETECTED_STORAGE_KEY = \"BROWSER_AUTODETECTED\";\n this.SUPPORTED_BROWSERS = [\"chrome\", \"opera\", \"samsungBrowser\", \n \"yandexbrowser\", \"maxthon\", \"msie\", \n \"msedge\", \"firefox\", \"ios\", \"safari\"];\n this.DEFAULT_BROWSER = \"chrome\";\n \n this.select\n .addEventListener(\"click\", this._onClickOrKeyDown.bind(this), false);\n \n this.select\n .addEventListener(\"keydown\", this._onClickOrKeyDown.bind(this), false);\n\n var storedBrowser = localStorage.getItem(this.BROWSER_STORAGE_KEY);\n if (storedBrowser) this.selectOption(storedBrowser);\n else this.detectBrowser();\n }\n\n BrowserSelect.prototype = Object.create(CustomSelect.prototype);\n BrowserSelect.prototype.constructor = BrowserSelect;\n\n BrowserSelect.prototype.detectBrowser = function()\n {\n for (var i = 0; i < this.SUPPORTED_BROWSERS.length; i++)\n {\n var supportedBrowser = this.SUPPORTED_BROWSERS[i];\n if (bowser[supportedBrowser])\n {\n localStorage.setItem(this.BROWSER_AUTODETECTED_STORAGE_KEY, \"true\");\n return this.selectOption(supportedBrowser);\n }\n }\n\n this.selectOption(this.DEFAULT_BROWSER); \n };\n\n BrowserSelect.prototype.selectOption = function(browser)\n {\n localStorage.setItem(this.BROWSER_STORAGE_KEY, browser);\n\n // Change body class\n var bodyClassList = Array.prototype.slice.call(document.body.classList);\n for (var i = 0; i < bodyClassList.length; i++)\n {\n if (bodyClassList[i].indexOf(\"ua-\") > -1)\n {\n document.body.classList.remove(bodyClassList[i]);\n }\n }\n document.body.classList.add(\"ua-\" + browser);\n\n // Check selected option\n var selectedItem = this.select\n .querySelector(\"[data-value='\" + browser + \"']\");\n selectedItem.setAttribute(\"aria-checked\", \"true\");\n\n // Set selected option\n var selectedOption = selectedItem.innerHTML;\n\n if (localStorage.getItem(this.BROWSER_AUTODETECTED_STORAGE_KEY))\n {\n var autodetected = document\n .getElementById(\"browser-select-autodetected\")\n .innerHTML;\n selectedOption += \"<span class='muted'>(\" + autodetected + \")</span>\";\n }\n\n this.select\n .querySelector(\".custom-select-selected\")\n .innerHTML = selectedOption;\n \n if (!document.querySelector(\".platform-\" + browser))\n {\n this.handleNoContentForBrowser(browser);\n }\n };\n\n BrowserSelect.prototype.handleNoContentForBrowser = function(browser)\n {\n var section = document.createElement(\"section\");\n section.classList.add(\"platform-\" + browser);\n section.innerHTML = document\n .getElementById(\"no-content-for-platform-message\")\n .innerHTML;\n\n document\n .querySelector(\".article-body\")\n .insertAdjacentElement(\"afterbegin\", section);\n }\n\n BrowserSelect.prototype._onClickOrKeyDown = function(event)\n {\n var option = event.target.closest(\".custom-select-option\");\n if (!option) return;\n\n var IS_ENTER_KEY = event.key == \"Enter\" || event.keyCode == 13;\n if (event.keyCode && !IS_ENTER_KEY) return;\n\n localStorage.removeItem(this.BROWSER_AUTODETECTED_STORAGE_KEY);\n\n // Uncheck previously checked option\n this.select\n .querySelector(\"[aria-checked='true']\")\n .setAttribute(\"aria-checked\", \"false\");\n\n this.selectOption(option.getAttribute(\"data-value\"));\n\n this.close();\n };\n\n var browserSelect = document.getElementById(\"browser-select\");\n if (browserSelect)\n {\n new BrowserSelect(browserSelect);\n }\n\n }, false);\n}());\n//# sourceMappingURL=main.js.map\n\n//# sourceMappingURL=main-debug.js.map\n\n//# sourceMappingURL=main.js.map\n"],"file":"main.js"}
|