Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

#244 add use pointer lock #254

Merged
merged 3 commits into from
Nov 12, 2024
Merged

#244 add use pointer lock #254

merged 3 commits into from
Nov 12, 2024

Conversation

VLADISLAW9
Copy link
Collaborator

No description provided.

Comment on lines 45 to 68
useEventListener(document, 'pointerlockchange', () => {
if (!isSupported) return;

const currentElement = document!.pointerLockElement ?? element;

if (targetElement && currentElement === targetElement.current) {
setElement(document.pointerLockElement as MaybeHTMLElement);
if (!element) {
targetElement.current = triggerElement.current = null;
}
}
});

useEventListener(document, 'pointerlockerror', () => {
if (!isSupported) return;

const currentElement = document!.pointerLockElement ?? element;

if (currentElement === (target?.current || triggerElement.current)) {
const action = document!.pointerLockElement ? 'release' : 'acquire';

throw new Error(`Failed to ${action} pointer lock.`);
}
});
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

в хуке лучше не использовать другие хуки особенно. лучше сделать обычный useEffect

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • не бери прям все из vueuse, смотри на другие хуки из нашей либы

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • данную логику все можно легко описать в одном useEffect

Comment on lines 9 to 11
interface UsePointerLockOptions {
document?: Document;
}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

опции пока удаляем

}

interface UsePointerLockReturn {
isSupported: boolean;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

supported везде без is

Comment on lines 15 to 16
triggerElement: MutableRefObject<MaybeHTMLElement>;
element: MaybeHTMLElement;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

MaybeHTMLElement это опять же своровано из vueuse, не надо тащить все оттуда

Comment on lines 42 to 43
const triggerElement = useRef<MaybeHTMLElement>();
const targetElement = useRef<MaybeHTMLElement>();
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

это пока тоже удаляем, я думаю самое важно просто lock и unlock на сегодня

});

const lock = (event: MouseEvent<HTMLDivElement> | Event) => {
if (!isSupported) throw new Error('Pointer Lock API is not supported by your browser.');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

не надо ошибки, просто return

…ерез useEffect, убрал лишние targetElement & triggerElement, поменял типы
setElement(document.pointerLockElement as Element);
}
};
const handlePointerLockError = () => {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

хендлер нужно делать внутри useEffect, а то removeEventListener работать не будет, нужна таже ссылка


/**
* @name usePointerLock
* @description - Reactive pointer lock
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Посмотри, как другие оформляются desc

* @description - Reactive pointer lock
* @category Sensors
*
* @param {RefObject<Element>} target
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

аналогично тут

const lock = (event: MouseEvent<Element> | Event) => {
if (!supported) return;

const targetElement = event instanceof Event ? target?.current : event.currentTarget;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

тут просто element

@debabin debabin merged commit f4ae93d into siberiacancode:main Nov 12, 2024
@debabin debabin linked an issue Nov 12, 2024 that may be closed by this pull request
@debabin debabin linked an issue Nov 12, 2024 that may be closed by this pull request
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[feat]: Create hook usePointerLock
2 participants