mirror of
https://github.com/moodle/moodle.git
synced 2025-01-19 14:27:22 +01:00
1 line
7.3 KiB
Plaintext
1 line
7.3 KiB
Plaintext
{"version":3,"file":"scroll_manager.min.js","sources":["../src/scroll_manager.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 * Scroll manager is a class that help with saving the scroll positing when you\n * click on an action icon, and then when the page is reloaded after processing\n * the action, it scrolls you to exactly where you were. This is much nicer for\n * the user.\n *\n * To use this in your code, you need to ensure that:\n * 1. The button that triggers the action has to have a click event handler that\n * calls saveScrollPos()\n * 2. After doing the processing, the redirect() function will add 'mdlscrollto'\n * parameter into the redirect url automatically.\n * 3. Finally, on the page that is reloaded (which should be the same as the one\n * the user started on) you need to call scrollToSavedPosition()\n * on page load.\n *\n * @module core/scroll_manager\n * @copyright 2021 The Open University\n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\n\n/** @property {HTMLElement} scrollingElement the current scrolling element. */\nlet scrollingElement = null;\n\n/**\n * Is the element scrollable?\n *\n * @param {HTMLElement} element Element.\n * @returns {boolean}\n */\nconst isScrollable = (element) => {\n // Check if the element has scrollable content.\n const hasScrollableContent = element.scrollHeight > element.clientHeight;\n\n // If 'overflow-y' is set to hidden, the scroll bar is't show.\n const elementOverflow = window.getComputedStyle(element).overflowY;\n const isOverflowHidden = elementOverflow.indexOf('hidden') !== -1;\n\n return hasScrollableContent && !isOverflowHidden;\n};\n\n/**\n * Get the scrolling element.\n *\n * @returns {HTMLElement}\n */\nconst getScrollingElement = () => {\n if (scrollingElement === null) {\n const page = document.getElementById('page');\n if (isScrollable(page)) {\n scrollingElement = page;\n } else {\n scrollingElement = document.scrollingElement;\n }\n }\n\n return scrollingElement;\n};\n\n/**\n * Get current scroll position.\n *\n * @returns {Number} Scroll position.\n */\nconst getScrollPos = () => {\n const scrollingElement = getScrollingElement();\n\n return scrollingElement.scrollTop;\n};\n\n/**\n * Get the scroll position for this form.\n *\n * @param {HTMLFormElement} form\n * @returns {HTMLInputElement}\n */\nconst getScrollPositionElement = (form) => {\n const element = form.querySelector('input[name=mdlscrollto]');\n if (element) {\n return element;\n }\n\n const scrollPos = document.createElement('input');\n scrollPos.type = 'hidden';\n scrollPos.name = 'mdlscrollto';\n form.appendChild(scrollPos);\n\n return scrollPos;\n};\n\n/**\n * In the form that contains the element, set the value of the form field with\n * name mdlscrollto to the current scroll position. If there is no element with\n * that name, it creates a hidden form field with that name within the form.\n *\n * @param {string} elementId The element in the form.\n */\nexport const saveScrollPos = (elementId) => {\n const element = document.getElementById(elementId);\n const form = element.closest('form');\n if (!form) {\n return;\n }\n\n saveScrollPositionToForm(form);\n};\n\n/**\n * Init event handlers for all links with data-savescrollposition=true.\n * Set the value to the closest form.\n */\nexport const watchScrollButtonSaves = () => {\n document.addEventListener('click', (e) => {\n const button = e.target.closest('[data-savescrollposition=\"true\"]');\n if (button) {\n saveScrollPositionToForm(button.form);\n }\n });\n};\n\n/**\n * Save the position to form.\n *\n * @param {Object} form The form is saved scroll position.\n */\nexport const saveScrollPositionToForm = (form) => {\n getScrollPositionElement(form).value = getScrollPos();\n};\n\n/**\n * Init event handlers for all links with data-save-scroll=true.\n * Handle to add mdlscrollto parameter to link using js when we click on the link.\n *\n */\nexport const initLinksScrollPos = () => {\n document.addEventListener('click', (e) => {\n const link = e.target.closest('a[data-save-scroll=true]');\n if (!link) {\n return;\n }\n\n e.preventDefault();\n const url = new URL(e.target.href);\n url.searchParams.set('mdlscrollto', getScrollPos());\n window.location = url;\n });\n};\n\n/**\n * If there is a parameter like mdlscrollto=123 in the URL, scroll to that saved position.\n */\nexport const scrollToSavedPosition = () => {\n const url = new URL(window.location.href);\n if (!url.searchParams.has('mdlscrollto')) {\n return;\n }\n\n const scrollPosition = url.searchParams.get('mdlscrollto');\n\n // Event onDOMReady is the effective one here. I am leaving the immediate call to\n // window.scrollTo in case it reduces flicker.\n const scrollingElement = getScrollingElement();\n scrollingElement.scrollTo(0, scrollPosition);\n document.addEventListener('DOMContentLoaded', () => {\n scrollingElement.scrollTo(0, scrollPosition);\n });\n};\n"],"names":["scrollingElement","getScrollingElement","page","document","getElementById","element","hasScrollableContent","scrollHeight","clientHeight","isOverflowHidden","window","getComputedStyle","overflowY","indexOf","isScrollable","getScrollPos","scrollTop","elementId","form","closest","saveScrollPositionToForm","addEventListener","e","button","target","querySelector","scrollPos","createElement","type","name","appendChild","getScrollPositionElement","value","preventDefault","url","URL","href","searchParams","set","location","has","scrollPosition","get","scrollTo"],"mappings":";;;;;;;;;;;;;;;;;;;;IAoCIA,iBAAmB,WAwBjBC,oBAAsB,QACC,OAArBD,iBAA2B,OACrBE,KAAOC,SAASC,eAAe,QAEjCJ,iBApBUK,CAAAA,gBAEZC,qBAAuBD,QAAQE,aAAeF,QAAQG,aAItDC,kBAA0D,IADxCC,OAAOC,iBAAiBN,SAASO,UAChBC,QAAQ,iBAE1CP,uBAAyBG,kBAWxBK,CAAaZ,MACMA,KAEAC,SAASH,wBAI7BA,kBAQLe,aAAe,IACQd,sBAEDe,iCA8BEC,kBAEpBC,KADUf,SAASC,eAAea,WACnBE,QAAQ,QACxBD,MAILE,yBAAyBF,uCAOS,KAClCf,SAASkB,iBAAiB,SAAUC,UAC1BC,OAASD,EAAEE,OAAOL,QAAQ,oCAC5BI,QACAH,yBAAyBG,OAAOL,gBAU/BE,yBAA4BF,OAjDPA,CAAAA,aACxBb,QAAUa,KAAKO,cAAc,8BAC/BpB,eACOA,cAGLqB,UAAYvB,SAASwB,cAAc,gBACzCD,UAAUE,KAAO,SACjBF,UAAUG,KAAO,cACjBX,KAAKY,YAAYJ,WAEVA,WAuCPK,CAAyBb,MAAMc,MAAQjB,uGAQT,KAC9BZ,SAASkB,iBAAiB,SAAUC,QACnBA,EAAEE,OAAOL,QAAQ,mCAK9BG,EAAEW,uBACIC,IAAM,IAAIC,IAAIb,EAAEE,OAAOY,MAC7BF,IAAIG,aAAaC,IAAI,cAAevB,gBACpCL,OAAO6B,SAAWL,uCAOW,WAC3BA,IAAM,IAAIC,IAAIzB,OAAO6B,SAASH,UAC/BF,IAAIG,aAAaG,IAAI,4BAIpBC,eAAiBP,IAAIG,aAAaK,IAAI,eAItC1C,iBAAmBC,sBACzBD,iBAAiB2C,SAAS,EAAGF,gBAC7BtC,SAASkB,iBAAiB,oBAAoB,KAC1CrB,iBAAiB2C,SAAS,EAAGF"} |