diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/client/apis/recording/RecordingApi.ts (renamed from src/client/apis/recording/recordingApi.tsx) | 57 | ||||
| -rw-r--r-- | src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx | 31 | ||||
| -rw-r--r-- | src/client/views/nodes/RecordingBox/RecordingView.tsx | 7 |
3 files changed, 45 insertions, 50 deletions
diff --git a/src/client/apis/recording/recordingApi.tsx b/src/client/apis/recording/RecordingApi.ts index 55714f03b..e19635b9c 100644 --- a/src/client/apis/recording/recordingApi.tsx +++ b/src/client/apis/recording/RecordingApi.ts @@ -1,7 +1,13 @@ import { CollectionFreeFormView } from "../../views/collections/collectionFreeForm"; import React, { useState } from "react"; +import { IReactionDisposer, observe, reaction, observable } from "mobx"; +import { SelectionManager } from "../../util/SelectionManager"; +export class RecordingApi { + + @observable static _instance: LinkManager; -export function RecordingApi() { + constructor() { + } type Movement = { time: number, @@ -9,7 +15,7 @@ export function RecordingApi() { panY: number, } - type Presentation = { + export type Presentation = { movements: Array<Movement> meta: Object, startDate: Date | null, @@ -25,7 +31,7 @@ export function RecordingApi() { const [isRecording, setIsRecording] = useState(false) const [absoluteStart, setAbsoluteStart] = useState<number>(-1) - const initAndStart = (view: CollectionFreeFormView, meta?: Object): Error | undefined => { + export const initAndStart = (meta?: Object): Error | undefined => { // check if already init a presentation if (currentPresentation.startDate !== null) { console.error('[recordingApi.ts] start() failed: current presentation data exists. please call clear() first.') @@ -46,7 +52,7 @@ export function RecordingApi() { setIsRecording(true) } - const clear = (): Error | undefined => { + export const clear = (): Error | undefined => { // TODO: maybe archive the data? if (isRecording) { console.error('[recordingApi.ts] clear() failed: currently recording presentation. call pause() or finish() first') @@ -55,17 +61,17 @@ export function RecordingApi() { // clear presenation data setCurrentPresenation(NULL_PRESENTATION) - // clear isRecording + // set isRecording false setIsRecording(false) - // clear absoluteStart + // default absoluteStart setAbsoluteStart(-1) } - const pause = (): Error | undefined => { + export const pause = (): Error | undefined => { if (currentPresentation.startDate === null) { console.error('[recordingApi.ts] pause() failed: no presentation started. try calling init() first') - return new Error('[recordingApi.ts] pause(): no presenation') + return new Error('[recordingApi.ts] pause()') } // don't allow track movments setIsRecording(false) @@ -75,7 +81,7 @@ export function RecordingApi() { setAbsoluteStart(timestamp) } - const resume = () => { + export const resume = () => { if (currentPresentation.startDate === null) { console.error('[recordingApi.ts] resume() failed: no presentation started. try calling init() first') return new Error('[recordingApi.ts] resume()') @@ -97,24 +103,26 @@ export function RecordingApi() { }) } - const finish = (): Error | Presentation => { + export const finish = (): Error | Presentation => { if (currentPresentation.movements === null) { console.error('[recordingApi.ts] finish() failed: no presentation data. try calling init() first') return new Error('[recordingApi.ts] finish()') } // make copy and clear this class's data - const returnCopy = { ...currentPresentation } - clear() + // const returnCopy = { ...currentPresentation } + // clear() + + // // return the copy + // return returnCopy - // return the copy - return returnCopy + return currentPresentation } - const trackMovements = (panX: number, panY: number): Error | undefined => { + export const trackMovements = (panX: number, panY: number): Error | undefined => { // ensure we are recording if (!isRecording) { - console.error('[recordingApi.ts] pause() failed: recording is paused()') + console.error('[recordingApi.ts] pause() failed: recording is paused()') return new Error('[recordingApi.ts] pause()') } @@ -134,7 +142,7 @@ export function RecordingApi() { // TOOD: need to pause all intervals if possible lol // TODO: extract this into different class with pause and resume recording - const followMovements = (presentation: Presentation, docView: CollectionFreeFormView): void => { + export const followMovements = (presentation: Presentation, docView: CollectionFreeFormView): void => { const document = docView.Document const { movements } = presentation @@ -148,4 +156,19 @@ export function RecordingApi() { }) } + // export let pres: Map<CollectionFreeFormView, IReactionDisposer> = new Map() + + // export function AddRecordingFFView(ffView: CollectionFreeFormView): void { + // pres.set(ffView, + // reaction(() => ({ x: ffView.panX, y: ffView.panY }), + // (pt) => RecordingApi.trackMovements(ffView, pt.x, pt.y))) + // ) + // } + + // export function RemoveRecordingFFView(ffView: CollectionFreeFormView): void { + // const disposer = pres.get(ffView); + // disposer?.(); + // pres.delete(ffView) + // } + }
\ No newline at end of file diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx index edc872a40..ec2fa8d63 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx @@ -54,6 +54,7 @@ import "./CollectionFreeFormView.scss"; import { MarqueeView } from "./MarqueeView"; import React = require("react"); import e = require("connect-flash"); +import { RecordingApi } from "../../../apis/recording/RecordingApi"; export const panZoomSchema = createSchema({ _panX: "number", @@ -964,38 +965,8 @@ export class CollectionFreeFormView extends CollectionSubView<Partial<collection } } - - followMovements = (): void => { - // need the first for subtraction - let first = null; - - this.storedMovements.forEach(movement => { - if (first === null) first = movement.time; - - // set the pan to what was stored - setTimeout(() => { - this.Document._panX = movement.panX; - this.Document._panY = movement.panY; - }, movement.time - first) - }) - - // for now, clear the movements - this.storedMovements = [] - } - @action setPan(panX: number, panY: number, panTime: number = 0, clamp: boolean = false) { - // if not presenting, just retrace the movements - if (Doc.UserDoc()?.presentationMode === 'watching') { - this.followMovements() - return; - } - - if (Doc.UserDoc()?.presentationMode === 'recording') { - // store as many movments as possible - this.storedMovements.push({time: new Date().getTime(), panX, panY}) - } - if (!this.isAnnotationOverlay && clamp) { // this section wraps the pan position, horizontally and/or vertically whenever the content is panned out of the viewing bounds const docs = this.childLayoutPairs.map(pair => pair.layout).filter(doc => doc instanceof Doc); diff --git a/src/client/views/nodes/RecordingBox/RecordingView.tsx b/src/client/views/nodes/RecordingBox/RecordingView.tsx index 6aed07c60..d2adff95a 100644 --- a/src/client/views/nodes/RecordingBox/RecordingView.tsx +++ b/src/client/views/nodes/RecordingBox/RecordingView.tsx @@ -8,6 +8,8 @@ import { IconContext } from "react-icons"; import { Networking } from '../../../Network'; import { Upload } from '../../../../server/SharedMediaTypes'; +import { RecordingApi } from '../../../apis/recording/RecordingApi'; + enum RecordingStatus { Recording, @@ -43,7 +45,7 @@ export function RecordingView(props: IRecordingViewProps) { const audioRecorder = useRef<MediaRecorder | null>(null); const videoElementRef = useRef<HTMLVideoElement | null>(null); - const [finished, setFinished] = useState<Boolean>(false) + const [finished, setFinished] = useState<Boolean>(false) @@ -341,8 +343,7 @@ export function RecordingView(props: IRecordingViewProps) { <i className="bx bxs-volume-mute"></i> )} </button> */} - </div> - + </div> </div> </div>) }
\ No newline at end of file |