{"ast":null,"code":"var _jsxFileName = \"C:\\\\Users\\\\user\\\\Desktop\\\\000newport\\\\src\\\\components\\\\crea5.js\";\nimport React from \"react\";\nimport { gsap, Sine } from \"gsap\";\nimport { useEffect } from \"react\";\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\nimport { Fragment as _Fragment } from \"react/jsx-dev-runtime\";\nconst Crea5 = () => {\n $(document).ready(function () {\n const items = [];\n for (let i = 0; i <= 55; i++) {\n items.push( /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"scroll-list__item js-scroll-list-item\"\n }, i, false, {\n fileName: _jsxFileName,\n lineNumber: 12,\n columnNumber: 13\n }, this));\n }\n var Scrollbar = window.Scrollbar;\n Scrollbar.use(window.OverscrollPlugin);\n var customScroll = Scrollbar.init(document.querySelector('.js-scroll-list'), {\n plugins: {\n overscroll: true\n }\n });\n var listItem = $('.js-scroll-list-item');\n listItem.eq(0).addClass('item-focus');\n listItem.eq(1).addClass('item-next');\n customScroll.addListener(function (status) {\n var $content = $('.js-scroll-content');\n var viewportScrollDistance = 0;\n viewportScrollDistance = status.offset.y;\n var viewportHeight = $content.height();\n var listHeight = 0;\n var $listItems = $content.find('.js-scroll-list-item');\n for (var i = 0; i < $listItems.length; i++) {\n listHeight += $($listItems[i]).height();\n }\n var top = status.offset.y;\n // console.log(top);\n var visibleCenterVertical = 0;\n visibleCenterVertical = top;\n var parentTop = 1;\n var $lis = $('.js-scroll-list-item');\n var $focusLi;\n for (var i = 0; i < $lis.length; i++) {\n var $li = $($lis[i]);\n var liTop = $li.position().top;\n var liRelTop = liTop - parentTop;\n var distance = 0;\n var distance = Math.abs(top - liRelTop);\n var maxDistance = $('.js-scroll-content').height() / 2;\n var distancePercent = distance / (maxDistance / 100);\n if (liRelTop + $li.parent().scrollTop() > top) {\n if (!$li.hasClass('item-focus')) {\n $li.prev().addClass('item-hide');\n $lis.removeClass('item-focus');\n $lis.removeClass('item-next');\n }\n $li.removeClass('item-hide');\n $li.addClass('item-focus');\n $li.next().addClass('item-next');\n break;\n }\n }\n });\n });\n return /*#__PURE__*/_jsxDEV(_Fragment, {\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"wrapper\",\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"scroll-list\",\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"scroll-list__wrp js-scroll-content js-scroll-list\",\n children: items\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 89,\n columnNumber: 9\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 88,\n columnNumber: 7\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 87,\n columnNumber: 1\n }, this)\n }, void 0, false);\n};\n_c = Crea5;\nexport default Crea5;\nvar _c;\n$RefreshReg$(_c, \"Crea5\");","map":{"version":3,"names":["React","gsap","Sine","useEffect","jsxDEV","_jsxDEV","Fragment","_Fragment","Crea5","$","document","ready","items","i","push","className","fileName","_jsxFileName","lineNumber","columnNumber","Scrollbar","window","use","OverscrollPlugin","customScroll","init","querySelector","plugins","overscroll","listItem","eq","addClass","addListener","status","$content","viewportScrollDistance","offset","y","viewportHeight","height","listHeight","$listItems","find","length","top","visibleCenterVertical","parentTop","$lis","$focusLi","$li","liTop","position","liRelTop","distance","Math","abs","maxDistance","distancePercent","parent","scrollTop","hasClass","prev","removeClass","next","children","_c","$RefreshReg$"],"sources":["C:/Users/user/Desktop/000newport/src/components/crea5.js"],"sourcesContent":["import React from \"react\";\r\nimport { gsap, Sine } from \"gsap\";\r\nimport { useEffect } from \"react\";\r\n\r\nconst Crea5 = () => {\r\n \r\n $(document).ready(function () {\r\n const items = [];\r\n\r\n for (let i = 0; i <= 55; i++) {\r\n items.push(\r\n \r\n {/* Contenu de l'élément */}\r\n
\r\n );\r\n }\r\n var Scrollbar = window.Scrollbar;\r\n \r\n Scrollbar.use(window.OverscrollPlugin);\r\n \r\n var customScroll = Scrollbar.init(document.querySelector('.js-scroll-list'), {\r\n plugins: {\r\n overscroll: true\r\n }\r\n });\r\n \r\n var listItem = $('.js-scroll-list-item');\r\n \r\n listItem.eq(0).addClass('item-focus');\r\n listItem.eq(1).addClass('item-next');\r\n \r\n customScroll.addListener(function (status) {\r\n \r\n var $content = $('.js-scroll-content');\r\n \r\n var viewportScrollDistance = 0;\r\n \r\n \r\n viewportScrollDistance = status.offset.y;\r\n var viewportHeight = $content.height();\r\n var listHeight = 0;\r\n var $listItems = $content.find('.js-scroll-list-item');\r\n for (var i = 0; i < $listItems.length; i++) {\r\n listHeight += $($listItems[i]).height();\r\n }\r\n \r\n var top = status.offset.y;\r\n // console.log(top);\r\n var visibleCenterVertical = 0;\r\n visibleCenterVertical = top;\r\n \r\n var parentTop = 1;\r\n var $lis = $('.js-scroll-list-item');\r\n var $focusLi;\r\n for (var i = 0; i < $lis.length; i++) {\r\n var $li = $($lis[i]);\r\n var liTop = $li.position().top;\r\n var liRelTop = liTop - parentTop;\r\n \r\n var distance = 0;\r\n var distance = Math.abs(top - liRelTop);\r\n var maxDistance = $('.js-scroll-content').height() / 2;\r\n var distancePercent = distance / (maxDistance / 100);\r\n \r\n \r\n if (liRelTop + $li.parent().scrollTop() > top) {\r\n if (!$li.hasClass('item-focus')) {\r\n $li.prev().addClass('item-hide');\r\n $lis.removeClass('item-focus');\r\n $lis.removeClass('item-next');\r\n }\r\n $li.removeClass('item-hide');\r\n $li.addClass('item-focus');\r\n $li.next().addClass('item-next');\r\n break;\r\n }\r\n }\r\n });\r\n \r\n });\r\n\r\n \r\n \r\n return (\r\n <>\r\n\r\n\r\n
\r\n
\r\n {items}\r\n
\r\n
\r\n