mirror of
https://github.com/Sped0n/bridget.git
synced 2026-04-17 03:29:31 -07:00
feat(container.ts): create container module to handle scrollable behavior and add/remove disableScroll class fix(customCursor.ts): update append target for cursor element to use container instead of main fix(stage.ts): update append target for stage element to use container instead of main fix(stageNav.ts): update append target for navOverlay element to use container instead of main feat(main.ts): initialize container module and conditionally initialize stage and stageNav modules based on device type fix(nav.ts): update references to state module functions to use state.get() instead of getState()
48 lines
1012 B
TypeScript
48 lines
1012 B
TypeScript
import { active } from './stage'
|
|
import { container } from '../container'
|
|
|
|
/**
|
|
* variables
|
|
*/
|
|
|
|
const cursor = document.createElement('div')
|
|
const cursorInner = document.createElement('div')
|
|
|
|
/**
|
|
* main functions
|
|
*/
|
|
|
|
function onMouse(e: MouseEvent) {
|
|
const x = e.clientX
|
|
const y = e.clientY
|
|
cursor.style.transform = `translate3d(${x}px, ${y}px, 0)`
|
|
}
|
|
|
|
export function setCustomCursor(text: string): void {
|
|
cursorInner.innerText = text
|
|
}
|
|
|
|
/**
|
|
* init
|
|
*/
|
|
export function initCustomCursor(): void {
|
|
// cursor class name
|
|
cursor.className = 'cursor'
|
|
// cursor inner class name
|
|
cursorInner.className = 'cursorInner'
|
|
// append cursor inner to cursor
|
|
cursor.append(cursorInner)
|
|
// append cursor to main
|
|
container.append(cursor)
|
|
// bind mousemove event to window
|
|
window.addEventListener('mousemove', onMouse)
|
|
// add active callback
|
|
active.addWatcher(() => {
|
|
if (active.get()) {
|
|
cursor.classList.add('active')
|
|
} else {
|
|
cursor.classList.remove('active')
|
|
}
|
|
})
|
|
}
|