aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/ScreenshotBox.tsx
diff options
context:
space:
mode:
authorbobzel <zzzman@gmail.com>2024-01-02 13:26:53 -0500
committerbobzel <zzzman@gmail.com>2024-01-02 13:26:53 -0500
commitfdc0bf7c54af252178f587709630d36726484b91 (patch)
tree9633a76e9bb386254f40894a13553dcba867cb37 /src/client/views/nodes/ScreenshotBox.tsx
parent9b9f54a43793ca6ffb26c56f962d11ba8325abd2 (diff)
fixing more .props => ._props refernces.
Diffstat (limited to 'src/client/views/nodes/ScreenshotBox.tsx')
-rw-r--r--src/client/views/nodes/ScreenshotBox.tsx50
1 files changed, 25 insertions, 25 deletions
diff --git a/src/client/views/nodes/ScreenshotBox.tsx b/src/client/views/nodes/ScreenshotBox.tsx
index 79ed69cdd..36527c311 100644
--- a/src/client/views/nodes/ScreenshotBox.tsx
+++ b/src/client/views/nodes/ScreenshotBox.tsx
@@ -47,8 +47,8 @@ declare class MediaRecorder {
// _mesh: any = undefined;
// render() {
-// const topLeft = [this.props.x, this.props.y];
-// const raised = this.props.raised;
+// const topLeft = [this._props.x, this._props.y];
+// const raised = this._props.raised;
// const find = (raised: { coord: Vector2, off: Vector3 }[], what: Vector2) => raised.find(r => r.coord.x === what.x && r.coord.y === what.y);
// const tl1 = find(raised, new Vector2(topLeft[0], topLeft[1] + 1));
// const tl2 = find(raised, new Vector2(topLeft[0] + 1, topLeft[1] + 1));
@@ -69,11 +69,11 @@ declare class MediaRecorder {
// const normals = new Float32Array(quad_normals);
// const uvs = new Float32Array(quad_uvs); // Each vertex has one uv coordinate for texture mapping
// const indices = new Uint32Array(quad_indices); // Use the four vertices to draw the two triangles that make up the square.
-// const popOut = () => NumCast(this.props.Document.popOut);
-// const popOff = () => NumCast(this.props.Document.popOff);
+// const popOut = () => NumCast(this.Document.popOut);
+// const popOff = () => NumCast(this.Document.popOff);
// return (
// <mesh key={`mesh${topLeft[0]}${topLeft[1]}`} onClick={action(async e => {
-// this.props.setRaised([
+// this._props.setRaised([
// { coord: new Vector2(topLeft[0], topLeft[1]), off: new Vector3(-popOff(), -popOff(), popOut()) },
// { coord: new Vector2(topLeft[0] + 1, topLeft[1]), off: new Vector3(popOff(), -popOff(), popOut()) },
// { coord: new Vector2(topLeft[0], topLeft[1] + 1), off: new Vector3(-popOff(), popOff(), popOut()) },
@@ -99,7 +99,7 @@ declare class MediaRecorder {
// r?.setAttribute('uv', new BufferAttribute(uvs, 2));
// r?.setIndex(new BufferAttribute(indices, 1));
// }} />
-// {!this._videoRef ? <meshStandardMaterial color={this.props.color} /> :
+// {!this._videoRef ? <meshStandardMaterial color={this._props.color} /> :
// <meshBasicMaterial >
// <videoTexture attach="map" args={[this._videoRef]} />
// </meshBasicMaterial>}
@@ -118,7 +118,7 @@ export class ScreenshotBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatabl
@observable private _videoRef: HTMLVideoElement | null = null;
@observable _screenCapture = false;
@computed get recordingStart() {
- return Cast(this.dataDoc[this.props.fieldKey + '_recordingStart'], DateField)?.date.getTime();
+ return Cast(this.dataDoc[this._props.fieldKey + '_recordingStart'], DateField)?.date.getTime();
}
constructor(props: any) {
@@ -144,8 +144,8 @@ export class ScreenshotBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatabl
componentDidMount() {
this.dataDoc.nativeWidth = this.dataDoc.nativeHeight = 0;
- this.props.setContentView?.(this); // this tells the DocumentView that this ScreenshotBox is the "content" of the document. this allows the DocumentView to indirectly call getAnchor() on the AudioBox when making a link.
- // this.layoutDoc.videoWall && reaction(() => ({ width: this.props.PanelWidth(), height: this.props.PanelHeight() }),
+ this._props.setContentView?.(this); // this tells the DocumentView that this ScreenshotBox is the "content" of the document. this allows the DocumentView to indirectly call getAnchor() on the AudioBox when making a link.
+ // this.layoutDoc.videoWall && reaction(() => ({ width: this._props.PanelWidth(), height: this._props.PanelHeight() }),
// ({ width, height }) => {
// if (this._camera) {
// const angle = -Math.abs(1 - width / height);
@@ -201,7 +201,7 @@ export class ScreenshotBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatabl
// let count = 0;
// numberRange(this._numScreens).forEach(x => numberRange(this._numScreens).forEach(y => screens.push(
// <VideoTile doc={this.layoutDoc} color={colors[count++ % colors.length]} x={x} y={y} raised={this._raised} setRaised={this.setRaised} />)));
- // return <Canvas key="canvas" id="CANCAN" style={{ width: this.props.PanelWidth(), height: this.props.PanelHeight() }} gl={{ antialias: false }} colorManagement={false} onCreated={props => {
+ // return <Canvas key="canvas" id="CANCAN" style={{ width: this._props.PanelWidth(), height: this._props.PanelHeight() }} gl={{ antialias: false }} colorManagement={false} onCreated={props => {
// this._camera = props.camera;
// props.camera.position.set(this._numScreens / 2, this._numScreens / 2, this._numScreens - 2);
// props.camera.lookAt(this._numScreens / 2, this._numScreens / 2, 0);
@@ -224,15 +224,15 @@ export class ScreenshotBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatabl
this._audioRec.onstop = async (e: any) => {
const [{ result }] = await Networking.UploadFilesToServer(aud_chunks.map((file: any) => ({ file })));
if (!(result instanceof Error)) {
- this.dataDoc[this.props.fieldKey + '_audio'] = new AudioField(result.accessPaths.agnostic.client);
+ this.dataDoc[this._props.fieldKey + '_audio'] = new AudioField(result.accessPaths.agnostic.client);
}
};
this._videoRef!.srcObject = await (navigator.mediaDevices as any).getDisplayMedia({ video: true });
this._videoRec = new MediaRecorder(this._videoRef!.srcObject);
const vid_chunks: any = [];
this._videoRec.onstart = () => {
- if (this.dataDoc[this.props.fieldKey + '_trackScreen']) TrackMovements.Instance.start();
- this.dataDoc[this.props.fieldKey + '_recordingStart'] = new DateField(new Date());
+ if (this.dataDoc[this._props.fieldKey + '_trackScreen']) TrackMovements.Instance.start();
+ this.dataDoc[this._props.fieldKey + '_recordingStart'] = new DateField(new Date());
};
this._videoRec.ondataavailable = (e: any) => vid_chunks.push(e.data);
this._videoRec.onstop = async (e: any) => {
@@ -252,7 +252,7 @@ export class ScreenshotBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatabl
this.layoutDoc.layout = VideoBox.LayoutString(this.fieldKey);
this.dataDoc.nativeWidth = this.dataDoc.nativeHeight = undefined;
this.layoutDoc._layout_fitWidth = undefined;
- this.dataDoc[this.props.fieldKey] = new VideoField(result.accessPaths.agnostic.client);
+ this.dataDoc[this._props.fieldKey] = new VideoField(result.accessPaths.agnostic.client);
} else alert('video conversion failed');
};
this._audioRec.start();
@@ -287,8 +287,8 @@ export class ScreenshotBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatabl
dictationTextProto.mediaState = ComputedField.MakeFunction(`this.${textField}_recordingSource.mediaState`);
this.dataDoc[this.fieldKey + '_dictation'] = dictationText;
};
- videoPanelHeight = () => (NumCast(this.dataDoc[this.fieldKey + '_nativeHeight'], NumCast(this.layoutDoc._height)) / NumCast(this.dataDoc[this.fieldKey + '_nativeWidth'], NumCast(this.layoutDoc._width))) * this.props.PanelWidth();
- formattedPanelHeight = () => Math.max(0, this.props.PanelHeight() - this.videoPanelHeight());
+ videoPanelHeight = () => (NumCast(this.dataDoc[this.fieldKey + '_nativeHeight'], NumCast(this.layoutDoc._height)) / NumCast(this.dataDoc[this.fieldKey + '_nativeWidth'], NumCast(this.layoutDoc._width))) * this._props.PanelWidth();
+ formattedPanelHeight = () => Math.max(0, this._props.PanelHeight() - this.videoPanelHeight());
render() {
TraceMobx();
return (
@@ -296,14 +296,14 @@ export class ScreenshotBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatabl
<div className="videoBox-viewer">
<div style={{ position: 'relative', height: this.videoPanelHeight() }}>
<CollectionFreeFormView
- {...this.props}
+ {...this._props}
setContentView={emptyFunction}
NativeWidth={returnZero}
NativeHeight={returnZero}
PanelHeight={this.videoPanelHeight}
- PanelWidth={this.props.PanelWidth}
- focus={this.props.focus}
- isSelected={this.props.isSelected}
+ PanelWidth={this._props.PanelWidth}
+ focus={this._props.focus}
+ isSelected={this._props.isSelected}
isAnnotationOverlay={true}
select={emptyFunction}
isContentActive={returnFalse}
@@ -313,8 +313,8 @@ export class ScreenshotBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatabl
removeDocument={returnFalse}
moveDocument={returnFalse}
addDocument={returnFalse}
- ScreenToLocalTransform={this.props.ScreenToLocalTransform}
- renderDepth={this.props.renderDepth + 1}>
+ ScreenToLocalTransform={this._props.ScreenToLocalTransform}
+ renderDepth={this._props.renderDepth + 1}>
<>
{this.threed}
{this.content}
@@ -324,7 +324,7 @@ export class ScreenshotBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatabl
<div style={{ background: SettingsManager.userColor, position: 'relative', height: this.formattedPanelHeight() }}>
{!(this.dataDoc[this.fieldKey + '_dictation'] instanceof Doc) ? null : (
<FormattedTextBox
- {...this.props}
+ {...this._props}
Document={DocCast(this.dataDoc[this.fieldKey + '_dictation'])}
fieldKey={'text'}
PanelHeight={this.formattedPanelHeight}
@@ -337,12 +337,12 @@ export class ScreenshotBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatabl
removeDocument={returnFalse}
moveDocument={returnFalse}
addDocument={returnFalse}
- renderDepth={this.props.renderDepth + 1}
+ renderDepth={this._props.renderDepth + 1}
/>
)}
</div>
</div>
- {!this.props.isSelected() ? null : (
+ {!this._props.isSelected() ? null : (
<div className="screenshotBox-uiButtons" style={{ background: SettingsManager.userColor }}>
<div className="screenshotBox-recorder" style={{ color: SettingsManager.userBackgroundColor, background: SettingsManager.userVariantColor }} key="snap" onPointerDown={this.toggleRecording}>
<FontAwesomeIcon icon="file" size="lg" />