| 226 | |
| 227 | |
| 228 | private constructor() { |
| 229 | d = document |
| 230 | w = window |
| 231 | this.wH = w.innerHeight |
| 232 | this.wW = w.innerWidth |
| 233 | this.sEnDesktop = new StringScrollSmooth(d) |
| 234 | this.sEnMobile = new StringScrollDefault(d) |
| 235 | this.sEnDisable = new StringScrollDisable(d) |
| 236 | this.sEn = this.sEnDesktop |
| 237 | w.addEventListener('resize', () => { this.onResize() }) |
| 238 | this.wheelBindFunc = this.onWheel.bind(this) |
| 239 | this.scrollBindFunc = this.onScroll.bind(this) |
| 240 | document.body.addEventListener('wheel', this.wheelBindFunc, { passive: false }) |
| 241 | w.addEventListener('scroll', this.scrollBindFunc, { passive: false }) |
| 242 | |
| 243 | document.documentElement.classList.add("string-scroll") |
| 244 | |
| 245 | const style = document.createElement('style'); |
| 246 | style.id = 'hide-scrollbar-style'; |
| 247 | document.documentElement.style.setProperty("--string-lerp", `0`) |
| 248 | style.textContent = ` |
| 249 | .-without-scrollbar::-webkit-scrollbar { |
| 250 | display: none; |
| 251 | } |
| 252 | .-without-scrollbar { |
| 253 | -ms-overflow-style: none; /* IE and Edge */ |
| 254 | scrollbar-width: none; /* Firefox */ |
| 255 | } |
| 256 | `; |
| 257 | document.head.appendChild(style); |
| 258 | |
| 259 | document.addEventListener('keydown', (event) => { |
| 260 | const activeElement = document.activeElement as HTMLElement; |
| 261 | if (activeElement.tagName === 'INPUT' || activeElement.tagName === 'TEXTAREA') { |
| 262 | return; |
| 263 | } |
| 264 | switch (event.key) { |
| 265 | case 'ArrowUp': |
| 266 | this.sEn.data.t -= this.wH / 3 |
| 267 | break; |
| 268 | case 'ArrowDown': |
| 269 | this.sEn.data.t += this.wH / 3 |
| 270 | |
| 271 | break; |
| 272 | } |
| 273 | }); |
| 274 | |
| 275 | } |
| 276 | |
| 277 | public static getInstance(): StringScroll { |
| 278 | if (!StringScroll.i) { |