@xrift/world-components 0.9.0 → 0.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/ScreenShareDisplay/hooks.d.ts +10 -0
- package/dist/components/ScreenShareDisplay/hooks.d.ts.map +1 -0
- package/dist/components/ScreenShareDisplay/hooks.js +57 -0
- package/dist/components/ScreenShareDisplay/hooks.js.map +1 -0
- package/dist/components/ScreenShareDisplay/index.d.ts +8 -0
- package/dist/components/ScreenShareDisplay/index.d.ts.map +1 -0
- package/dist/components/ScreenShareDisplay/index.js +30 -0
- package/dist/components/ScreenShareDisplay/index.js.map +1 -0
- package/dist/components/ScreenShareDisplay/types.d.ts +11 -0
- package/dist/components/ScreenShareDisplay/types.d.ts.map +1 -0
- package/dist/components/ScreenShareDisplay/types.js +2 -0
- package/dist/components/ScreenShareDisplay/types.js.map +1 -0
- package/dist/contexts/ScreenShareContext.d.ts +31 -0
- package/dist/contexts/ScreenShareContext.d.ts.map +1 -0
- package/dist/contexts/ScreenShareContext.js +25 -0
- package/dist/contexts/ScreenShareContext.js.map +1 -0
- package/dist/contexts/XRiftContext.d.ts +6 -1
- package/dist/contexts/XRiftContext.d.ts.map +1 -1
- package/dist/contexts/XRiftContext.js +3 -2
- package/dist/contexts/XRiftContext.js.map +1 -1
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -0
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import * as THREE from 'three';
|
|
2
|
+
/**
|
|
3
|
+
* VideoElement から VideoTexture を作成し管理するフック
|
|
4
|
+
*/
|
|
5
|
+
export declare const useVideoTexture: (videoElement: HTMLVideoElement | null) => {
|
|
6
|
+
texture: THREE.VideoTexture<HTMLVideoElement> | null;
|
|
7
|
+
hasVideo: boolean;
|
|
8
|
+
materialRef: import("react").RefObject<THREE.MeshBasicMaterial>;
|
|
9
|
+
};
|
|
10
|
+
//# sourceMappingURL=hooks.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["../../../src/components/ScreenShareDisplay/hooks.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B;;GAEG;AACH,eAAO,MAAM,eAAe,GAAI,cAAc,gBAAgB,GAAG,IAAI;;;;CAwDpE,CAAA"}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import { useFrame } from '@react-three/fiber';
|
|
2
|
+
import { useEffect, useRef, useState } from 'react';
|
|
3
|
+
import * as THREE from 'three';
|
|
4
|
+
/**
|
|
5
|
+
* VideoElement から VideoTexture を作成し管理するフック
|
|
6
|
+
*/
|
|
7
|
+
export const useVideoTexture = (videoElement) => {
|
|
8
|
+
const materialRef = useRef(null);
|
|
9
|
+
const [texture, setTexture] = useState(null);
|
|
10
|
+
const hasVideo = texture !== null;
|
|
11
|
+
// VideoTextureの作成と更新
|
|
12
|
+
useEffect(() => {
|
|
13
|
+
if (!videoElement) {
|
|
14
|
+
setTexture(null);
|
|
15
|
+
return;
|
|
16
|
+
}
|
|
17
|
+
const videoTexture = new THREE.VideoTexture(videoElement);
|
|
18
|
+
videoTexture.minFilter = THREE.LinearFilter;
|
|
19
|
+
videoTexture.magFilter = THREE.LinearFilter;
|
|
20
|
+
videoTexture.colorSpace = THREE.SRGBColorSpace;
|
|
21
|
+
videoTexture.needsUpdate = true;
|
|
22
|
+
setTexture(videoTexture);
|
|
23
|
+
return () => {
|
|
24
|
+
videoTexture.dispose();
|
|
25
|
+
};
|
|
26
|
+
}, [videoElement]);
|
|
27
|
+
// マテリアルにテクスチャをセット
|
|
28
|
+
useEffect(() => {
|
|
29
|
+
if (!materialRef.current || !texture)
|
|
30
|
+
return;
|
|
31
|
+
materialRef.current.map = texture;
|
|
32
|
+
materialRef.current.needsUpdate = true;
|
|
33
|
+
}, [texture]);
|
|
34
|
+
// テクスチャ更新(毎フレーム)
|
|
35
|
+
useFrame(() => {
|
|
36
|
+
if (!texture)
|
|
37
|
+
return;
|
|
38
|
+
texture.needsUpdate = true;
|
|
39
|
+
});
|
|
40
|
+
// video要素が一時停止していたら再生を試みる
|
|
41
|
+
useEffect(() => {
|
|
42
|
+
if (!videoElement)
|
|
43
|
+
return;
|
|
44
|
+
const checkAndPlay = () => {
|
|
45
|
+
if (videoElement.paused) {
|
|
46
|
+
videoElement.play().catch(() => {
|
|
47
|
+
// 再生失敗は無視
|
|
48
|
+
});
|
|
49
|
+
}
|
|
50
|
+
};
|
|
51
|
+
checkAndPlay();
|
|
52
|
+
const interval = setInterval(checkAndPlay, 1000);
|
|
53
|
+
return () => clearInterval(interval);
|
|
54
|
+
}, [videoElement]);
|
|
55
|
+
return { texture, hasVideo, materialRef };
|
|
56
|
+
};
|
|
57
|
+
//# sourceMappingURL=hooks.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hooks.js","sourceRoot":"","sources":["../../../src/components/ScreenShareDisplay/hooks.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACnD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,YAAqC,EAAE,EAAE;IACvE,MAAM,WAAW,GAAG,MAAM,CAA0B,IAAI,CAAC,CAAA;IACzD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAA4B,IAAI,CAAC,CAAA;IACvE,MAAM,QAAQ,GAAG,OAAO,KAAK,IAAI,CAAA;IAEjC,qBAAqB;IACrB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,YAAY,EAAE,CAAC;YAClB,UAAU,CAAC,IAAI,CAAC,CAAA;YAChB,OAAM;QACR,CAAC;QAED,MAAM,YAAY,GAAG,IAAI,KAAK,CAAC,YAAY,CAAC,YAAY,CAAC,CAAA;QACzD,YAAY,CAAC,SAAS,GAAG,KAAK,CAAC,YAAY,CAAA;QAC3C,YAAY,CAAC,SAAS,GAAG,KAAK,CAAC,YAAY,CAAA;QAC3C,YAAY,CAAC,UAAU,GAAG,KAAK,CAAC,cAAc,CAAA;QAC9C,YAAY,CAAC,WAAW,GAAG,IAAI,CAAA;QAC/B,UAAU,CAAC,YAAY,CAAC,CAAA;QAExB,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,OAAO,EAAE,CAAA;QACxB,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAA;IAElB,kBAAkB;IAClB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,WAAW,CAAC,OAAO,IAAI,CAAC,OAAO;YAAE,OAAM;QAC5C,WAAW,CAAC,OAAO,CAAC,GAAG,GAAG,OAAO,CAAA;QACjC,WAAW,CAAC,OAAO,CAAC,WAAW,GAAG,IAAI,CAAA;IACxC,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAA;IAEb,iBAAiB;IACjB,QAAQ,CAAC,GAAG,EAAE;QACZ,IAAI,CAAC,OAAO;YAAE,OAAM;QACpB,OAAO,CAAC,WAAW,GAAG,IAAI,CAAA;IAC5B,CAAC,CAAC,CAAA;IAEF,0BAA0B;IAC1B,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,YAAY;YAAE,OAAM;QAEzB,MAAM,YAAY,GAAG,GAAG,EAAE;YACxB,IAAI,YAAY,CAAC,MAAM,EAAE,CAAC;gBACxB,YAAY,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,GAAG,EAAE;oBAC7B,UAAU;gBACZ,CAAC,CAAC,CAAA;YACJ,CAAC;QACH,CAAC,CAAA;QAED,YAAY,EAAE,CAAA;QACd,MAAM,QAAQ,GAAG,WAAW,CAAC,YAAY,EAAE,IAAI,CAAC,CAAA;QAEhD,OAAO,GAAG,EAAE,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAA;IACtC,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAA;IAElB,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,CAAA;AAC3C,CAAC,CAAA"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { Props } from './types';
|
|
2
|
+
export type { Props as ScreenShareDisplayProps } from './types';
|
|
3
|
+
/**
|
|
4
|
+
* 映像を3D空間内にスクリーンとして表示するコンポーネント
|
|
5
|
+
* 画面共有やカメラ映像などの表示に使用可能
|
|
6
|
+
*/
|
|
7
|
+
export declare const ScreenShareDisplay: import("react").MemoExoticComponent<({ id, position, rotation, scale, }: Props) => import("react/jsx-runtime").JSX.Element>;
|
|
8
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ScreenShareDisplay/index.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAEpC,YAAY,EAAE,KAAK,IAAI,uBAAuB,EAAE,MAAM,SAAS,CAAA;AAO/D;;;GAGG;AACH,eAAO,MAAM,kBAAkB,2EAK5B,KAAK,6CA8CN,CAAA"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Text } from '@react-three/drei';
|
|
3
|
+
import { memo, useCallback } from 'react';
|
|
4
|
+
import * as THREE from 'three';
|
|
5
|
+
import { useScreenShareContext } from '../../contexts/ScreenShareContext';
|
|
6
|
+
import { Interactable } from '../Interactable';
|
|
7
|
+
import { useVideoTexture } from './hooks';
|
|
8
|
+
// デフォルト値
|
|
9
|
+
const DEFAULT_SCALE = [4, 4 * (9 / 16)];
|
|
10
|
+
const DEFAULT_POSITION = [0, 2, -5];
|
|
11
|
+
const DEFAULT_ROTATION = [0, 0, 0];
|
|
12
|
+
/**
|
|
13
|
+
* 映像を3D空間内にスクリーンとして表示するコンポーネント
|
|
14
|
+
* 画面共有やカメラ映像などの表示に使用可能
|
|
15
|
+
*/
|
|
16
|
+
export const ScreenShareDisplay = memo(({ id, position = DEFAULT_POSITION, rotation = DEFAULT_ROTATION, scale = DEFAULT_SCALE, }) => {
|
|
17
|
+
const { videoElement, isSharing, startScreenShare, stopScreenShare } = useScreenShareContext();
|
|
18
|
+
const interactionText = isSharing ? '画面共有を停止' : '画面共有を開始';
|
|
19
|
+
const { texture, hasVideo, materialRef } = useVideoTexture(videoElement);
|
|
20
|
+
const handleInteract = useCallback(() => {
|
|
21
|
+
if (isSharing) {
|
|
22
|
+
stopScreenShare();
|
|
23
|
+
}
|
|
24
|
+
else {
|
|
25
|
+
startScreenShare();
|
|
26
|
+
}
|
|
27
|
+
}, [isSharing, startScreenShare, stopScreenShare]);
|
|
28
|
+
return (_jsxs("group", { position: position, rotation: rotation, children: [_jsx(Interactable, { id: id, onInteract: handleInteract, interactionText: interactionText, children: _jsxs("mesh", { children: [_jsx("planeGeometry", { args: [scale[0], scale[1]] }), _jsx("meshBasicMaterial", { ref: materialRef, map: texture, side: THREE.FrontSide, toneMapped: false, color: hasVideo ? 'white' : '#1a1a2a' })] }) }), !hasVideo && (_jsx(Text, { position: [0, 0, 0.01], fontSize: scale[0] * 0.05, color: "#666666", anchorX: "center", anchorY: "middle", children: "\u30AF\u30EA\u30C3\u30AF\u3057\u3066\u753B\u9762\u5171\u6709" }))] }));
|
|
29
|
+
});
|
|
30
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ScreenShareDisplay/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAA;AACxC,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,qBAAqB,EAAE,MAAM,mCAAmC,CAAA;AACzE,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAC9C,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAKzC,SAAS;AACT,MAAM,aAAa,GAAqB,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC,CAAA;AACzD,MAAM,gBAAgB,GAA6B,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,CAAA;AAC7D,MAAM,gBAAgB,GAA6B,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAA;AAE5D;;;GAGG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG,IAAI,CAAC,CAAC,EACtC,EAAE,EACF,QAAQ,GAAG,gBAAgB,EAC3B,QAAQ,GAAG,gBAAgB,EAC3B,KAAK,GAAG,aAAa,GACf,EAAE,EAAE;IACV,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,gBAAgB,EAAE,eAAe,EAAE,GAAG,qBAAqB,EAAE,CAAA;IAC9F,MAAM,eAAe,GAAG,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAA;IACzD,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,GAAG,eAAe,CAAC,YAAY,CAAC,CAAA;IAExE,MAAM,cAAc,GAAG,WAAW,CAAC,GAAG,EAAE;QACtC,IAAI,SAAS,EAAE,CAAC;YACd,eAAe,EAAE,CAAA;QACnB,CAAC;aAAM,CAAC;YACN,gBAAgB,EAAE,CAAA;QACpB,CAAC;IACH,CAAC,EAAE,CAAC,SAAS,EAAE,gBAAgB,EAAE,eAAe,CAAC,CAAC,CAAA;IAElD,OAAO,CACL,iBAAO,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,aAC3C,KAAC,YAAY,IACX,EAAE,EAAE,EAAE,EACN,UAAU,EAAE,cAAc,EAC1B,eAAe,EAAE,eAAe,YAEhC,2BACE,wBAAe,IAAI,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,GAAI,EAC7C,4BACE,GAAG,EAAE,WAAW,EAChB,GAAG,EAAE,OAAO,EACZ,IAAI,EAAE,KAAK,CAAC,SAAS,EACrB,UAAU,EAAE,KAAK,EACjB,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,GACrC,IACG,GACM,EAGd,CAAC,QAAQ,IAAI,CACZ,KAAC,IAAI,IACH,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,EACtB,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,IAAI,EACzB,KAAK,EAAC,SAAS,EACf,OAAO,EAAC,QAAQ,EAChB,OAAO,EAAC,QAAQ,6EAGX,CACR,IACK,CACT,CAAA;AACH,CAAC,CAAC,CAAA"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export interface Props {
|
|
2
|
+
/** スクリーンの一意なID */
|
|
3
|
+
id: string;
|
|
4
|
+
/** スクリーンの位置 */
|
|
5
|
+
position?: [number, number, number];
|
|
6
|
+
/** スクリーンの回転 */
|
|
7
|
+
rotation?: [number, number, number];
|
|
8
|
+
/** スクリーンのサイズ [幅, 高さ] */
|
|
9
|
+
scale?: [number, number];
|
|
10
|
+
}
|
|
11
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/ScreenShareDisplay/types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,KAAK;IACpB,kBAAkB;IAClB,EAAE,EAAE,MAAM,CAAA;IACV,eAAe;IACf,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;IACnC,eAAe;IACf,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;IACnC,wBAAwB;IACxB,KAAK,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;CACzB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/ScreenShareDisplay/types.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { type ReactNode } from 'react';
|
|
2
|
+
export interface ScreenShareContextValue {
|
|
3
|
+
/** 表示する映像のvideo要素 */
|
|
4
|
+
videoElement: HTMLVideoElement | null;
|
|
5
|
+
/** 自分が共有中か */
|
|
6
|
+
isSharing: boolean;
|
|
7
|
+
/** 共有開始 */
|
|
8
|
+
startScreenShare: () => void;
|
|
9
|
+
/** 共有停止 */
|
|
10
|
+
stopScreenShare: () => void;
|
|
11
|
+
}
|
|
12
|
+
/**
|
|
13
|
+
* 画面共有の状態を提供するContext
|
|
14
|
+
* xrift-frontend側で値を注入し、ワールド側で参照できる
|
|
15
|
+
*/
|
|
16
|
+
export declare const ScreenShareContext: import("react").Context<ScreenShareContextValue | null>;
|
|
17
|
+
interface Props {
|
|
18
|
+
value: ScreenShareContextValue;
|
|
19
|
+
children: ReactNode;
|
|
20
|
+
}
|
|
21
|
+
/**
|
|
22
|
+
* 画面共有の状態を提供するContextProvider
|
|
23
|
+
*/
|
|
24
|
+
export declare const ScreenShareProvider: ({ value, children }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
25
|
+
/**
|
|
26
|
+
* 画面共有の状態を取得するhook
|
|
27
|
+
* @throws {Error} ScreenShareProvider の外で呼び出された場合
|
|
28
|
+
*/
|
|
29
|
+
export declare const useScreenShareContext: () => ScreenShareContextValue;
|
|
30
|
+
export {};
|
|
31
|
+
//# sourceMappingURL=ScreenShareContext.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ScreenShareContext.d.ts","sourceRoot":"","sources":["../../src/contexts/ScreenShareContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,SAAS,EAAc,MAAM,OAAO,CAAA;AAEjE,MAAM,WAAW,uBAAuB;IACtC,qBAAqB;IACrB,YAAY,EAAE,gBAAgB,GAAG,IAAI,CAAA;IACrC,cAAc;IACd,SAAS,EAAE,OAAO,CAAA;IAClB,WAAW;IACX,gBAAgB,EAAE,MAAM,IAAI,CAAA;IAC5B,WAAW;IACX,eAAe,EAAE,MAAM,IAAI,CAAA;CAC5B;AAED;;;GAGG;AACH,eAAO,MAAM,kBAAkB,yDAAsD,CAAA;AAErF,UAAU,KAAK;IACb,KAAK,EAAE,uBAAuB,CAAA;IAC9B,QAAQ,EAAE,SAAS,CAAA;CACpB;AAED;;GAEG;AACH,eAAO,MAAM,mBAAmB,GAAI,qBAAqB,KAAK,4CAE7D,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,qBAAqB,QAAO,uBAMxC,CAAA"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { createContext, useContext } from 'react';
|
|
3
|
+
/**
|
|
4
|
+
* 画面共有の状態を提供するContext
|
|
5
|
+
* xrift-frontend側で値を注入し、ワールド側で参照できる
|
|
6
|
+
*/
|
|
7
|
+
export const ScreenShareContext = createContext(null);
|
|
8
|
+
/**
|
|
9
|
+
* 画面共有の状態を提供するContextProvider
|
|
10
|
+
*/
|
|
11
|
+
export const ScreenShareProvider = ({ value, children }) => {
|
|
12
|
+
return _jsx(ScreenShareContext.Provider, { value: value, children: children });
|
|
13
|
+
};
|
|
14
|
+
/**
|
|
15
|
+
* 画面共有の状態を取得するhook
|
|
16
|
+
* @throws {Error} ScreenShareProvider の外で呼び出された場合
|
|
17
|
+
*/
|
|
18
|
+
export const useScreenShareContext = () => {
|
|
19
|
+
const context = useContext(ScreenShareContext);
|
|
20
|
+
if (!context) {
|
|
21
|
+
throw new Error('useScreenShareContext must be used within ScreenShareProvider');
|
|
22
|
+
}
|
|
23
|
+
return context;
|
|
24
|
+
};
|
|
25
|
+
//# sourceMappingURL=ScreenShareContext.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ScreenShareContext.js","sourceRoot":"","sources":["../../src/contexts/ScreenShareContext.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAkB,UAAU,EAAE,MAAM,OAAO,CAAA;AAajE;;;GAGG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG,aAAa,CAAiC,IAAI,CAAC,CAAA;AAOrF;;GAEG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAS,EAAE,EAAE;IAChE,OAAO,KAAC,kBAAkB,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,YAAG,QAAQ,GAA+B,CAAA;AAC5F,CAAC,CAAA;AAED;;;GAGG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG,GAA4B,EAAE;IACjE,MAAM,OAAO,GAAG,UAAU,CAAC,kBAAkB,CAAC,CAAA;IAC9C,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,MAAM,IAAI,KAAK,CAAC,+DAA+D,CAAC,CAAA;IAClF,CAAC;IACD,OAAO,OAAO,CAAA;AAChB,CAAC,CAAA"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { type ReactNode } from 'react';
|
|
2
2
|
import type { Object3D } from 'three';
|
|
3
3
|
import { type InstanceStateContextValue } from './InstanceStateContext';
|
|
4
|
+
import { type ScreenShareContextValue } from './ScreenShareContext';
|
|
4
5
|
export interface XRiftContextValue {
|
|
5
6
|
/**
|
|
6
7
|
* ワールドのベースURL(CDNのディレクトリパス)
|
|
@@ -39,6 +40,10 @@ interface Props {
|
|
|
39
40
|
* 指定しない場合はデフォルト実装(ローカルstate)が使用される
|
|
40
41
|
*/
|
|
41
42
|
instanceStateImplementation?: InstanceStateContextValue;
|
|
43
|
+
/**
|
|
44
|
+
* 画面共有の実装
|
|
45
|
+
*/
|
|
46
|
+
screenShareImplementation: ScreenShareContextValue;
|
|
42
47
|
children: ReactNode;
|
|
43
48
|
}
|
|
44
49
|
/**
|
|
@@ -46,7 +51,7 @@ interface Props {
|
|
|
46
51
|
* Module Federationで動的にロードされたワールドコンポーネントに
|
|
47
52
|
* 必要な情報を注入するために使用
|
|
48
53
|
*/
|
|
49
|
-
export declare const XRiftProvider: ({ baseUrl, currentTarget, instanceStateImplementation, children }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
54
|
+
export declare const XRiftProvider: ({ baseUrl, currentTarget, instanceStateImplementation, screenShareImplementation, children, }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
50
55
|
/**
|
|
51
56
|
* XRift ワールドの情報を取得するhook
|
|
52
57
|
* ワールドプロジェクト側でアセットの相対パスを絶対パスに変換する際に使用
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"XRiftContext.d.ts","sourceRoot":"","sources":["../../src/contexts/XRiftContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,SAAS,EAAqC,MAAM,OAAO,CAAA;AACxF,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACrC,OAAO,EAAyB,KAAK,yBAAyB,EAAE,MAAM,wBAAwB,CAAA;
|
|
1
|
+
{"version":3,"file":"XRiftContext.d.ts","sourceRoot":"","sources":["../../src/contexts/XRiftContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,SAAS,EAAqC,MAAM,OAAO,CAAA;AACxF,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACrC,OAAO,EAAyB,KAAK,yBAAyB,EAAE,MAAM,wBAAwB,CAAA;AAC9F,OAAO,EAAuB,KAAK,uBAAuB,EAAE,MAAM,sBAAsB,CAAA;AAExF,MAAM,WAAW,iBAAiB;IAChC;;;OAGG;IACH,OAAO,EAAE,MAAM,CAAA;IACf;;;OAGG;IACH,aAAa,EAAE,QAAQ,GAAG,IAAI,CAAA;IAC9B;;;OAGG;IACH,mBAAmB,EAAE,GAAG,CAAC,QAAQ,CAAC,CAAA;IAClC;;OAEG;IACH,oBAAoB,EAAE,CAAC,MAAM,EAAE,QAAQ,KAAK,IAAI,CAAA;IAChD;;OAEG;IACH,sBAAsB,EAAE,CAAC,MAAM,EAAE,QAAQ,KAAK,IAAI,CAAA;CAKnD;AAED;;;GAGG;AACH,eAAO,MAAM,YAAY,mDAAgD,CAAA;AAEzE,UAAU,KAAK;IACb,OAAO,EAAE,MAAM,CAAA;IACf,aAAa,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAA;IAC/B;;;OAGG;IACH,2BAA2B,CAAC,EAAE,yBAAyB,CAAA;IACvD;;OAEG;IACH,yBAAyB,EAAE,uBAAuB,CAAA;IAClD,QAAQ,EAAE,SAAS,CAAA;CACpB;AAED;;;;GAIG;AACH,eAAO,MAAM,aAAa,GAAI,+FAM3B,KAAK,4CA+BP,CAAA;AAED;;;;;;;;;GASG;AACH,eAAO,MAAM,QAAQ,QAAO,iBAQ3B,CAAA"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { createContext, useCallback, useContext, useState } from 'react';
|
|
3
3
|
import { InstanceStateProvider } from './InstanceStateContext';
|
|
4
|
+
import { ScreenShareProvider } from './ScreenShareContext';
|
|
4
5
|
/**
|
|
5
6
|
* XRift ワールドの情報を提供するContext
|
|
6
7
|
* ワールド側でこのContextを直接参照して情報を取得できる
|
|
@@ -11,7 +12,7 @@ export const XRiftContext = createContext(null);
|
|
|
11
12
|
* Module Federationで動的にロードされたワールドコンポーネントに
|
|
12
13
|
* 必要な情報を注入するために使用
|
|
13
14
|
*/
|
|
14
|
-
export const XRiftProvider = ({ baseUrl, currentTarget = null, instanceStateImplementation, children }) => {
|
|
15
|
+
export const XRiftProvider = ({ baseUrl, currentTarget = null, instanceStateImplementation, screenShareImplementation, children, }) => {
|
|
15
16
|
// インタラクト可能なオブジェクトの管理
|
|
16
17
|
const [interactableObjects] = useState(() => new Set());
|
|
17
18
|
// オブジェクトの登録
|
|
@@ -28,7 +29,7 @@ export const XRiftProvider = ({ baseUrl, currentTarget = null, instanceStateImpl
|
|
|
28
29
|
interactableObjects,
|
|
29
30
|
registerInteractable,
|
|
30
31
|
unregisterInteractable,
|
|
31
|
-
}, children: _jsx(InstanceStateProvider, { implementation: instanceStateImplementation, children: children }) }));
|
|
32
|
+
}, children: _jsx(ScreenShareProvider, { value: screenShareImplementation, children: _jsx(InstanceStateProvider, { implementation: instanceStateImplementation, children: children }) }) }));
|
|
32
33
|
};
|
|
33
34
|
/**
|
|
34
35
|
* XRift ワールドの情報を取得するhook
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"XRiftContext.js","sourceRoot":"","sources":["../../src/contexts/XRiftContext.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAkB,WAAW,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAExF,OAAO,EAAE,qBAAqB,EAAkC,MAAM,wBAAwB,CAAA;
|
|
1
|
+
{"version":3,"file":"XRiftContext.js","sourceRoot":"","sources":["../../src/contexts/XRiftContext.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAkB,WAAW,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAExF,OAAO,EAAE,qBAAqB,EAAkC,MAAM,wBAAwB,CAAA;AAC9F,OAAO,EAAE,mBAAmB,EAAgC,MAAM,sBAAsB,CAAA;AAgCxF;;;GAGG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,aAAa,CAA2B,IAAI,CAAC,CAAA;AAiBzE;;;;GAIG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAC5B,OAAO,EACP,aAAa,GAAG,IAAI,EACpB,2BAA2B,EAC3B,yBAAyB,EACzB,QAAQ,GACF,EAAE,EAAE;IACV,qBAAqB;IACrB,MAAM,CAAC,mBAAmB,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,IAAI,GAAG,EAAY,CAAC,CAAA;IAEjE,YAAY;IACZ,MAAM,oBAAoB,GAAG,WAAW,CAAC,CAAC,MAAgB,EAAE,EAAE;QAC5D,mBAAmB,CAAC,GAAG,CAAC,MAAM,CAAC,CAAA;IACjC,CAAC,EAAE,CAAC,mBAAmB,CAAC,CAAC,CAAA;IAEzB,cAAc;IACd,MAAM,sBAAsB,GAAG,WAAW,CAAC,CAAC,MAAgB,EAAE,EAAE;QAC9D,mBAAmB,CAAC,MAAM,CAAC,MAAM,CAAC,CAAA;IACpC,CAAC,EAAE,CAAC,mBAAmB,CAAC,CAAC,CAAA;IAEzB,OAAO,CACL,KAAC,YAAY,CAAC,QAAQ,IACpB,KAAK,EAAE;YACL,OAAO;YACP,aAAa;YACb,mBAAmB;YACnB,oBAAoB;YACpB,sBAAsB;SACvB,YAED,KAAC,mBAAmB,IAAC,KAAK,EAAE,yBAAyB,YACnD,KAAC,qBAAqB,IAAC,cAAc,EAAE,2BAA2B,YAC/D,QAAQ,GACa,GACJ,GACA,CACzB,CAAA;AACH,CAAC,CAAA;AAED;;;;;;;;;GASG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAsB,EAAE;IAC9C,MAAM,OAAO,GAAG,UAAU,CAAC,YAAY,CAAC,CAAA;IAExC,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,MAAM,IAAI,KAAK,CAAC,4CAA4C,CAAC,CAAA;IAC/D,CAAC;IAED,OAAO,OAAO,CAAA;AAChB,CAAC,CAAA"}
|
package/dist/index.d.ts
CHANGED
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
export { XRiftContext, XRiftProvider, useXRift, type XRiftContextValue, } from './contexts/XRiftContext';
|
|
2
2
|
export { InstanceStateContext, useInstanceStateContext, type InstanceStateContextValue, } from './contexts/InstanceStateContext';
|
|
3
|
+
export { ScreenShareContext, ScreenShareProvider, useScreenShareContext, type ScreenShareContextValue, } from './contexts/ScreenShareContext';
|
|
3
4
|
export { Interactable, type InteractableProps, } from './components/Interactable';
|
|
4
5
|
export { Mirror, type MirrorProps } from './components/Mirror';
|
|
5
6
|
export { Skybox, type SkyboxProps } from './components/Skybox';
|
|
6
7
|
export { VideoScreen, type VideoScreenProps, type VideoState, } from './components/VideoScreen';
|
|
8
|
+
export { ScreenShareDisplay, type ScreenShareDisplayProps, } from './components/ScreenShareDisplay';
|
|
7
9
|
export { useInstanceState } from './hooks/useInstanceState';
|
|
8
10
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EACL,YAAY,EACZ,aAAa,EACb,QAAQ,EACR,KAAK,iBAAiB,GACvB,MAAM,yBAAyB,CAAA;AAEhC,OAAO,EACL,oBAAoB,EACpB,uBAAuB,EACvB,KAAK,yBAAyB,GAC/B,MAAM,iCAAiC,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EACL,YAAY,EACZ,aAAa,EACb,QAAQ,EACR,KAAK,iBAAiB,GACvB,MAAM,yBAAyB,CAAA;AAEhC,OAAO,EACL,oBAAoB,EACpB,uBAAuB,EACvB,KAAK,yBAAyB,GAC/B,MAAM,iCAAiC,CAAA;AAExC,OAAO,EACL,kBAAkB,EAClB,mBAAmB,EACnB,qBAAqB,EACrB,KAAK,uBAAuB,GAC7B,MAAM,+BAA+B,CAAA;AAGtC,OAAO,EACL,YAAY,EACZ,KAAK,iBAAiB,GACvB,MAAM,2BAA2B,CAAA;AAElC,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAA;AAE9D,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAA;AAE9D,OAAO,EACL,WAAW,EACX,KAAK,gBAAgB,EACrB,KAAK,UAAU,GAChB,MAAM,0BAA0B,CAAA;AAEjC,OAAO,EACL,kBAAkB,EAClB,KAAK,uBAAuB,GAC7B,MAAM,iCAAiC,CAAA;AAGxC,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAA"}
|
package/dist/index.js
CHANGED
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
// Contexts
|
|
2
2
|
export { XRiftContext, XRiftProvider, useXRift, } from './contexts/XRiftContext';
|
|
3
3
|
export { InstanceStateContext, useInstanceStateContext, } from './contexts/InstanceStateContext';
|
|
4
|
+
export { ScreenShareContext, ScreenShareProvider, useScreenShareContext, } from './contexts/ScreenShareContext';
|
|
4
5
|
// Components
|
|
5
6
|
export { Interactable, } from './components/Interactable';
|
|
6
7
|
export { Mirror } from './components/Mirror';
|
|
7
8
|
export { Skybox } from './components/Skybox';
|
|
8
9
|
export { VideoScreen, } from './components/VideoScreen';
|
|
10
|
+
export { ScreenShareDisplay, } from './components/ScreenShareDisplay';
|
|
9
11
|
// Hooks
|
|
10
12
|
export { useInstanceState } from './hooks/useInstanceState';
|
|
11
13
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,WAAW;AACX,OAAO,EACL,YAAY,EACZ,aAAa,EACb,QAAQ,GAET,MAAM,yBAAyB,CAAA;AAEhC,OAAO,EACL,oBAAoB,EACpB,uBAAuB,GAExB,MAAM,iCAAiC,CAAA;AAExC,aAAa;AACb,OAAO,EACL,YAAY,GAEb,MAAM,2BAA2B,CAAA;AAElC,OAAO,EAAE,MAAM,EAAoB,MAAM,qBAAqB,CAAA;AAE9D,OAAO,EAAE,MAAM,EAAoB,MAAM,qBAAqB,CAAA;AAE9D,OAAO,EACL,WAAW,GAGZ,MAAM,0BAA0B,CAAA;AAEjC,QAAQ;AACR,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAA"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,WAAW;AACX,OAAO,EACL,YAAY,EACZ,aAAa,EACb,QAAQ,GAET,MAAM,yBAAyB,CAAA;AAEhC,OAAO,EACL,oBAAoB,EACpB,uBAAuB,GAExB,MAAM,iCAAiC,CAAA;AAExC,OAAO,EACL,kBAAkB,EAClB,mBAAmB,EACnB,qBAAqB,GAEtB,MAAM,+BAA+B,CAAA;AAEtC,aAAa;AACb,OAAO,EACL,YAAY,GAEb,MAAM,2BAA2B,CAAA;AAElC,OAAO,EAAE,MAAM,EAAoB,MAAM,qBAAqB,CAAA;AAE9D,OAAO,EAAE,MAAM,EAAoB,MAAM,qBAAqB,CAAA;AAE9D,OAAO,EACL,WAAW,GAGZ,MAAM,0BAA0B,CAAA;AAEjC,OAAO,EACL,kBAAkB,GAEnB,MAAM,iCAAiC,CAAA;AAExC,QAAQ;AACR,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAA"}
|