Proyectos de Subversion Moodle

{"version":3,"file":"usermenu.min.js","sources":["../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"}