{"version":3,"file":"usermenu.min.js","sources":["https:\/\/inclusivemediatraining.eu\/lib\/amd\/src\/usermenu.js"],"sourcesContent":["\/\/ This file is part of Moodle - http:\/\/moodle.org\/\n\/\/\n\/\/ Moodle 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\/\/ Moodle 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 Moodle.  If not, see <http:\/\/www.gnu.org\/licenses\/>.\n\n\/**\n * Initializes and handles events in the user menu.\n *\n * @module     core\/usermenu\n * @copyright  2021 Moodle\n * @author     Mihail Geshoski <mihail@moodle.com>\n * @license    http:\/\/www.gnu.org\/copyleft\/gpl.html GNU GPL v3 or later\n *\/\n\nimport $ from 'jquery';\nimport {space, enter} from 'core\/key_codes';\n\n\/**\n * User menu constants.\n *\/\nconst selectors = {\n    userMenu: '.usermenu',\n    userMenuCarousel: '.usermenu #usermenu-carousel',\n    userMenuCarouselItem: '.usermenu #usermenu-carousel .carousel-item',\n    userMenuCarouselItemActive: '.usermenu #usermenu-carousel .carousel-item.active',\n    userMenuCarouselNavigationLink: '.usermenu #usermenu-carousel .carousel-navigation-link',\n};\n\n\/**\n * Register event listeners.\n *\/\nconst registerEventListeners = () => {\n    const userMenu = document.querySelector(selectors.userMenu);\n\n    \/\/ Handle the 'shown.bs.dropdown' event (Fired when the dropdown menu is fully displayed).\n    $(selectors.userMenu).on('shown.bs.dropdown', () => {\n        const activeCarouselItem = document.querySelector(selectors.userMenuCarouselItemActive);\n        \/\/ Set the focus on the active carousel item.\n        activeCarouselItem.focus();\n\n        userMenu.querySelectorAll(selectors.userMenuCarouselItem).forEach(element => {\n            \/\/ Resize all non-active carousel items to match the height and width of the current active (main)\n            \/\/ carousel item to avoid sizing inconsistencies. This has to be done once the dropdown menu is fully\n            \/\/ displayed ('shown.bs.dropdown') as the offsetWidth and offsetHeight cannot be obtained when the\n            \/\/ element is hidden.\n            if (!element.classList.contains('active')) {\n                element.style.width = activeCarouselItem.offsetWidth + 'px';\n                element.style.height = activeCarouselItem.offsetHeight + 'px';\n            }\n        });\n    });\n\n    \/\/ Handle click events in the user menu.\n    userMenu.addEventListener('click', (e) => {\n\n        \/\/ Handle click event on the carousel navigation (control) links in the user menu.\n        if (e.target.matches(selectors.userMenuCarouselNavigationLink)) {\n            carouselManagement(e);\n        }\n    });\n\n    userMenu.addEventListener('keydown', e => {\n        \/\/ Handle keydown event on the carousel navigation (control) links in the user menu.\n        if ((e.keyCode === space ||\n            e.keyCode === enter) &&\n            e.target.matches(selectors.userMenuCarouselNavigationLink)) {\n            e.preventDefault();\n            carouselManagement(e);\n        }\n    });\n\n    \/**\n     * We do the same actions here even if the caller was a click or button press.\n     *\n     * @param {Event} e The triggering element and key presses etc.\n     *\/\n    const carouselManagement = e => {\n        \/\/ By default the user menu dropdown element closes on a click event. This behaviour is not desirable\n        \/\/ as we need to be able to navigate through the carousel items (submenus of the user menu) within the\n        \/\/ user menu. Therefore, we need to prevent the propagation of this event and then manually call the\n        \/\/ carousel transition.\n        e.stopPropagation();\n        \/\/ The id of the targeted carousel item.\n        const targetedCarouselItemId = e.target.dataset.carouselTargetId;\n        const targetedCarouselItem = userMenu.querySelector('#' + targetedCarouselItemId);\n        \/\/ Get the position (index) of the targeted carousel item within the parent container element.\n        const index = Array.from(targetedCarouselItem.parentNode.children).indexOf(targetedCarouselItem);\n        \/\/ Navigate to the targeted carousel item.\n        $(selectors.userMenuCarousel).carousel(index);\n\n    };\n\n    \/\/ Handle the 'hide.bs.dropdown' event (Fired when the dropdown menu is being closed).\n    $(selectors.userMenu).on('hide.bs.dropdown', () => {\n        \/\/ Reset the state once the user menu dropdown is closed and return back to the first (main) carousel item\n        \/\/ if necessary.\n        $(selectors.userMenuCarousel).carousel(0);\n    });\n\n    \/\/ Handle the 'slid.bs.carousel' event (Fired when the carousel has completed its slide transition).\n    $(selectors.userMenuCarousel).on('slid.bs.carousel', () => {\n        const activeCarouselItem = userMenu.querySelector(selectors.userMenuCarouselItemActive);\n        \/\/ Set the focus on the newly activated carousel item.\n        activeCarouselItem.focus();\n    });\n};\n\n\/**\n * Initialize the user menu.\n *\/\nconst init = () => {\n    registerEventListeners();\n};\n\nexport default {\n    init: init,\n};\n"],"names":["selectors","init","userMenu","document","querySelector","on","activeCarouselItem","focus","querySelectorAll","forEach","element","classList","contains","style","width","offsetWidth","height","offsetHeight","addEventListener","e","target","matches","carouselManagement","keyCode","space","enter","preventDefault","stopPropagation","targetedCarouselItemId","dataset","carouselTargetId","targetedCarouselItem","index","Array","from","parentNode","children","indexOf","carousel","registerEventListeners"],"mappings":";;;;;;;;mJA8BMA,mBACQ,YADRA,2BAEgB,+BAFhBA,+BAGoB,8CAHpBA,qCAI0B,qDAJ1BA,yCAK8B,sEAyFrB,CACXC,KALS,KA\/EkB,YACrBC,SAAWC,SAASC,cAAcJ,wCAGtCA,oBAAoBK,GAAG,qBAAqB,WACpCC,mBAAqBH,SAASC,cAAcJ,sCAElDM,mBAAmBC,QAEnBL,SAASM,iBAAiBR,gCAAgCS,SAAQC,UAKzDA,QAAQC,UAAUC,SAAS,YAC5BF,QAAQG,MAAMC,MAAQR,mBAAmBS,YAAc,KACvDL,QAAQG,MAAMG,OAASV,mBAAmBW,aAAe,YAMrEf,SAASgB,iBAAiB,SAAUC,IAG5BA,EAAEC,OAAOC,QAAQrB,2CACjBsB,mBAAmBH,MAI3BjB,SAASgB,iBAAiB,WAAWC,IAE5BA,EAAEI,UAAYC,kBACfL,EAAEI,UAAYE,mBACdN,EAAEC,OAAOC,QAAQrB,4CACjBmB,EAAEO,iBACFJ,mBAAmBH,aASrBG,mBAAqBH,IAKvBA,EAAEQ,wBAEIC,uBAAyBT,EAAEC,OAAOS,QAAQC,iBAC1CC,qBAAuB7B,SAASE,cAAc,IAAMwB,wBAEpDI,MAAQC,MAAMC,KAAKH,qBAAqBI,WAAWC,UAAUC,QAAQN,0CAEzE\/B,4BAA4BsC,SAASN,4BAKzChC,oBAAoBK,GAAG,oBAAoB,yBAGvCL,4BAA4BsC,SAAS,0BAIzCtC,4BAA4BK,GAAG,oBAAoB,KACtBH,SAASE,cAAcJ,sCAE\/BO,YAQvBgC"}