21 lines
4.2 KiB
JavaScript
21 lines
4.2 KiB
JavaScript
|
/*
|
||
|
|
* ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
|
||
|
|
* This devtool is neither made for production nor for readable output files.
|
||
|
|
* It uses "eval()" calls to create a separate source file in the browser devtools.
|
||
|
|
* If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
|
||
|
|
* or disable the default devtool with "devtool: false".
|
||
|
|
* If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
|
||
|
|
*/
|
||
|
|
(self["webpackChunkmy_webpack_project"] = self["webpackChunkmy_webpack_project"] || []).push([["src_wde_scrollbar_scrollbar_js"],{
|
||
|
|
|
||
|
|
/***/ "./src/wde/scrollbar/scrollbar.js":
|
||
|
|
/*!****************************************!*\
|
||
|
|
!*** ./src/wde/scrollbar/scrollbar.js ***!
|
||
|
|
\****************************************/
|
||
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
||
|
|
|
||
|
|
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (/* binding */ WdeScrollBar)\n/* harmony export */ });\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nvar WdeScrollBar = /*#__PURE__*/_createClass(\n/**\n* @param {HTMLElement} scrollBarContainer\n* @param {HTMLElement} content\n*/\nfunction WdeScrollBar(scrollBarContainer, content) {\n var _this = this;\n _classCallCheck(this, WdeScrollBar);\n var nonNativeScroll = false;\n // console.log(scrollBarContainer, content)\n // let handler = scrollBarContainer.children[0]\n //TODO On scroll move focus on window?\n var handler = scrollBarContainer.querySelector(\".ScrollBarScrollElement\"); //TODO Refactor classes\n // console.log(handler)\n\n handler.style.height = content.clientHeight / content.scrollHeight * handler.parentElement.clientHeight + 'px';\n var max = handler.parentElement.clientHeight - handler.clientHeight;\n var yPosInit = 0;\n handler.addEventListener('mousedown', function (event) {\n nonNativeScroll = true;\n yPosInit = event.clientY - Number(handler.style.top.replace('px', ''));\n document.addEventListener('mousemove', drag);\n document.addEventListener('mouseup', stop);\n });\n content.addEventListener('scroll', function (event) {\n if (!_this.nonNativeScroll) {\n var handlerPathLength = handler.parentElement.clientHeight - handler.clientHeight; //TODO recalculate only on resize event\n var coefficient = (content.scrollHeight - content.clientHeight) / handlerPathLength;\n handler.style.top = content.scrollTop / coefficient + 'px';\n }\n });\n function drag() {\n // console.log(event.clientY - yPosInit, Number(handler.style.top.replace('px','' )))\n var pos = event.clientY - yPosInit;\n var clampPos = Math.min(Math.max(pos, 0), max);\n handler.style.top = clampPos + \"px\";\n var handlerPathLength = handler.parentElement.clientHeight - handler.clientHeight; //TODO recalculate only on resize event\n var coefficient = (content.scrollHeight - content.clientHeight) / handlerPathLength;\n // console.log(clampPos, coefficient, content.clientHeight, clampPos* coefficient)\n\n content.scrollTop = clampPos * coefficient;\n }\n function stop() {\n // console.log(\"stop\")\n document.removeEventListener('mousemove', drag);\n document.removeEventListener('mouseup', stop);\n nonNativeScroll = false;\n }\n});\n\n\n//# sourceURL=webpack://my-webpack-project/./src/wde/scrollbar/scrollbar.js?");
|
||
|
|
|
||
|
|
/***/ })
|
||
|
|
|
||
|
|
}])
|