aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/util/CurrentUserUtils.ts4
-rw-r--r--src/client/views/nodes/FontIconBox/FontIconBox.tsx15
-rw-r--r--src/client/views/nodes/RecordingBox/RecordingBox.tsx44
-rw-r--r--src/client/views/nodes/ScreenshotBox.tsx13
4 files changed, 55 insertions, 21 deletions
diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index 539c62833..9f83f105e 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -773,8 +773,8 @@ export class CurrentUserUtils {
CurrentUserUtils.createToolButton(opts), scripts, funcs);
const btnDescs = [// setup reactions to change the highlights on the undo/redo buttons -- would be better to encode this in the undo/redo buttons, but the undo/redo stacks are not wired up that way yet
- { opts: { title: "Replicate",icon:"camera",toolTip: "Copy dashboard layout",btnType: ButtonType.ClickButton, expertMode: true}, scripts: { onClick: `snapshotDashboard()`}},
- { opts: { title: "Recordings", toolTip: "Workspace Recordings", btnType: ButtonType.DropdownList,expertMode: false, ignoreClick: true, width: 100}, funcs: {hidden: `false`, btnList:`getWorkspaceRecordings()`}, scripts: { script: `{ return replayWorkspace(value, _readOnly_); }`}},
+ { opts: { title: "Replicate",icon:"camera",toolTip: "Copy dashboard layout",btnType: ButtonType.ClickButton, expertMode: true}, scripts: { onClick: `snapshotDashboard()`}},
+ { opts: { title: "Recordings", toolTip: "Workspace Recordings", btnType: ButtonType.DropdownList,expertMode: false, ignoreClick: true, width: 100}, funcs: {hidden: `false`, btnList:`getWorkspaceRecordings()`}, scripts: { script: `{ return replayWorkspace(value, _readOnly_); }`, onDragScript: `{ return startRecordingDrag(value); }`}},
{ opts: { title: "Stop Rec",icon: "stop", toolTip: "Stop recording", btnType: ButtonType.ClickButton, expertMode: false}, funcs: {hidden: `!isWorkspaceRecording()`}, scripts: { onClick: `stopWorkspaceRecording()`}},
{ opts: { title: "Play", icon: "play", toolTip: "Play recording", btnType: ButtonType.ClickButton, expertMode: false}, funcs: {hidden: `isWorkspaceReplaying() !== "${media_state.Paused}"`}, scripts: { onClick: `resumeWorkspaceReplaying(getCurrentRecording())`}},
{ opts: { title: "Pause", icon: "pause",toolTip: "Pause playback", btnType: ButtonType.ClickButton, expertMode: false}, funcs: {hidden: `isWorkspaceReplaying() !== "${media_state.Playing}"`}, scripts: { onClick: `pauseWorkspaceReplaying(getCurrentRecording())`}},
diff --git a/src/client/views/nodes/FontIconBox/FontIconBox.tsx b/src/client/views/nodes/FontIconBox/FontIconBox.tsx
index 9bc9f2b52..ea7c2de82 100644
--- a/src/client/views/nodes/FontIconBox/FontIconBox.tsx
+++ b/src/client/views/nodes/FontIconBox/FontIconBox.tsx
@@ -7,7 +7,7 @@ import * as React from 'react';
import { Doc, DocListCast, StrListCast } from '../../../../fields/Doc';
import { ScriptField } from '../../../../fields/ScriptField';
import { BoolCast, Cast, DocCast, NumCast, ScriptCast, StrCast } from '../../../../fields/Types';
-import { Utils } from '../../../../Utils';
+import { emptyFunction, setupMoveUpEvents, Utils } from '../../../../Utils';
import { CollectionViewType, DocumentType } from '../../../documents/DocumentTypes';
import { SelectionManager } from '../../../util/SelectionManager';
import { SettingsManager } from '../../../util/SettingsManager';
@@ -176,6 +176,18 @@ export class FontIconBox extends DocComponent<ButtonProps>() {
);
}
+ dropdownItemDown = (e: React.PointerEvent, value: string | number) => {
+ setupMoveUpEvents(
+ this,
+ e,
+ (e: PointerEvent) => {
+ return ScriptCast(this.rootDoc.onDragScript)?.script.run({ this: this.layoutDoc, self: this.rootDoc, value: { doc: value, e } }).result;
+ },
+ emptyFunction,
+ emptyFunction
+ );
+ };
+
/**
* Dropdown list
*/
@@ -240,6 +252,7 @@ export class FontIconBox extends DocComponent<ButtonProps>() {
background={SettingsManager.userVariantColor}
type={Type.TERT}
dropdownType={DropdownType.SELECT}
+ onItemDown={this.dropdownItemDown}
items={list}
tooltip={this.label}
fillWidth
diff --git a/src/client/views/nodes/RecordingBox/RecordingBox.tsx b/src/client/views/nodes/RecordingBox/RecordingBox.tsx
index 3412b2dd2..1f113110b 100644
--- a/src/client/views/nodes/RecordingBox/RecordingBox.tsx
+++ b/src/client/views/nodes/RecordingBox/RecordingBox.tsx
@@ -1,10 +1,11 @@
import { action, observable } from 'mobx';
import { observer } from 'mobx-react';
import * as React from 'react';
+import { DateField } from '../../../../fields/DateField';
import { Doc, DocListCast } from '../../../../fields/Doc';
import { Id } from '../../../../fields/FieldSymbols';
-import { listSpec } from '../../../../fields/Schema';
-import { BoolCast, Cast, DocCast, StrCast } from '../../../../fields/Types';
+import { List } from '../../../../fields/List';
+import { BoolCast, DocCast } from '../../../../fields/Types';
import { VideoField } from '../../../../fields/URLField';
import { Upload } from '../../../../server/SharedMediaTypes';
import { Docs } from '../../../documents/Documents';
@@ -17,12 +18,10 @@ import { Presentation } from '../../../util/TrackMovements';
import { undoBatch } from '../../../util/UndoManager';
import { CollectionFreeFormView } from '../../collections/collectionFreeForm/CollectionFreeFormView';
import { ViewBoxBaseComponent } from '../../DocComponent';
+import { media_state } from '../AudioBox';
import { FieldView, FieldViewProps } from '../FieldView';
import { VideoBox } from '../VideoBox';
import { RecordingView } from './RecordingView';
-import { DateField } from '../../../../fields/DateField';
-import { media_state } from '../AudioBox';
-import { List } from '../../../../fields/List';
@observer
export class RecordingBox extends ViewBoxBaseComponent<FieldViewProps>() {
@@ -87,15 +86,22 @@ export class RecordingBox extends ViewBoxBaseComponent<FieldViewProps>() {
*/
@undoBatch
@action
- public static WorkspaceStartRecording() {
- const screengrabber = Docs.Create.ScreenshotDocument({
- title: `${new DateField()}-${Doc.ActiveDashboard?.title ?? ''}`,
- _width: 205,
- _height: 115,
- });
+ public static WorkspaceStartRecording(value: string) {
+ const screengrabber =
+ value === 'Record Workspace'
+ ? Docs.Create.ScreenshotDocument({
+ title: `${new DateField()}-${Doc.ActiveDashboard?.title ?? ''}`,
+ _width: 205,
+ _height: 115,
+ })
+ : Docs.Create.WebCamDocument(`${new DateField()}-${Doc.ActiveDashboard?.title ?? ''}`, {
+ title: `${new DateField()}-${Doc.ActiveDashboard?.title ?? ''}`,
+ _width: 205,
+ _height: 115,
+ });
screengrabber.overlayX = 70; //was -400
screengrabber.overlayY = 590; //was 0
- screengrabber[Doc.LayoutFieldKey(screengrabber) + '_trackScreen'] = true;
+ Doc.GetProto(screengrabber)[Doc.LayoutFieldKey(screengrabber) + '_trackScreen'] = true;
Doc.AddToMyOverlay(screengrabber); //just adds doc to overlay
DocumentManager.Instance.AddViewRenderedCb(screengrabber, docView => {
RecordingBox.screengrabber = docView.ComponentView as RecordingBox;
@@ -204,9 +210,6 @@ export class RecordingBox extends ViewBoxBaseComponent<FieldViewProps>() {
static screengrabber: RecordingBox | undefined;
}
-ScriptingGlobals.add(function startWorkspaceRecording() {
- RecordingBox.WorkspaceStartRecording();
-});
ScriptingGlobals.add(function stopWorkspaceRecording() {
RecordingBox.WorkspaceStopRecording();
});
@@ -222,7 +225,7 @@ ScriptingGlobals.add(function getCurrentRecording() {
return Doc.UserDoc().currentRecording;
});
ScriptingGlobals.add(function getWorkspaceRecordings() {
- return new List<any>(['Record Workspace', ...DocListCast(Doc.UserDoc().workspaceRecordings)]);
+ return new List<any>(['Record Workspace', `Record Webcam`, ...DocListCast(Doc.UserDoc().workspaceRecordings)]);
});
ScriptingGlobals.add(function isWorkspaceRecording() {
return Doc.UserDoc().workspaceRecordingState === media_state.Recording;
@@ -232,7 +235,7 @@ ScriptingGlobals.add(function isWorkspaceReplaying() {
});
ScriptingGlobals.add(function replayWorkspace(value: Doc | string, _readOnly_: boolean) {
if (_readOnly_) return DocCast(Doc.UserDoc().currentRecording) ?? 'Record Workspace';
- if (typeof value === 'string') RecordingBox.WorkspaceStartRecording();
+ if (typeof value === 'string') RecordingBox.WorkspaceStartRecording(value);
else RecordingBox.replayWorkspace(value);
});
ScriptingGlobals.add(function pauseWorkspaceReplaying(value: Doc, _readOnly_: boolean) {
@@ -242,6 +245,13 @@ ScriptingGlobals.add(function resumeWorkspaceReplaying(value: Doc, _readOnly_: b
RecordingBox.resumeWorkspaceReplaying(value);
});
+ScriptingGlobals.add(function startRecordingDrag(value: { doc: Doc | string; e: React.PointerEvent }) {
+ if (DocCast(value.doc)) {
+ DragManager.StartDocumentDrag([value.e.target as HTMLElement], new DragManager.DocumentDragData([DocCast(value.doc)], 'embed'), value.e.clientX, value.e.clientY);
+ value.e.preventDefault();
+ return true;
+ }
+});
ScriptingGlobals.add(function renderDropdown() {
if (!Doc.UserDoc().workspaceRecordings || DocListCast(Doc.UserDoc().workspaceRecordings).length === 0) {
return true;
diff --git a/src/client/views/nodes/ScreenshotBox.tsx b/src/client/views/nodes/ScreenshotBox.tsx
index 4ebc93165..26ad8b7bb 100644
--- a/src/client/views/nodes/ScreenshotBox.tsx
+++ b/src/client/views/nodes/ScreenshotBox.tsx
@@ -26,6 +26,7 @@ import { FieldView, FieldViewProps } from './FieldView';
import { FormattedTextBox } from './formattedText/FormattedTextBox';
import './ScreenshotBox.scss';
import { VideoBox } from './VideoBox';
+import { TrackMovements } from '../../util/TrackMovements';
declare class MediaRecorder {
constructor(e: any, options?: any); // whatever MediaRecorder has
@@ -236,9 +237,19 @@ export class ScreenshotBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatabl
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 = () => (this.dataDoc[this.props.fieldKey + '_recordingStart'] = new DateField(new Date()));
+ this._videoRec.onstart = () => {
+ 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) => {
+ const presentation = TrackMovements.Instance.yieldPresentation();
+ if (presentation?.movements) {
+ const presCopy = { ...presentation };
+ presCopy.movements = presentation.movements.map(movement => ({ ...movement, doc: movement.doc[Id] })) as any;
+ this.dataDoc[this.fieldKey + '_presentation'] = JSON.stringify(presCopy);
+ }
+ TrackMovements.Instance.finish();
const file = new File(vid_chunks, `${this.rootDoc[Id]}.mkv`, { type: vid_chunks[0].type, lastModified: Date.now() });
const [{ result }] = await Networking.UploadFilesToServer({ file });
this.dataDoc[this.fieldKey + '_duration'] = (new Date().getTime() - this.recordingStart!) / 1000;
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-10 03:27:03 +0000