diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/client/views/Main.tsx | 1 | ||||
| -rw-r--r-- | src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx | 2 | ||||
| -rw-r--r-- | src/client/views/nodes/Timeline.scss | 40 | ||||
| -rw-r--r-- | src/client/views/nodes/Timeline.tsx | 35 | ||||
| -rw-r--r-- | src/fields/TimelineField.ts | 7 |
5 files changed, 85 insertions, 0 deletions
diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx index 32798631d..35d5e8a35 100644 --- a/src/client/views/Main.tsx +++ b/src/client/views/Main.tsx @@ -314,6 +314,7 @@ export class Main extends React.Component { ]; } + render() { let workspaceMenu: any = null; let workspaces = this.userDocument.GetT<ListField<Document>>(KeyStore.Workspaces, ListField); diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx index 1feb30db1..a77a28aa7 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx @@ -20,6 +20,7 @@ import React = require("react"); import v5 = require("uuid/v5"); import { CollectionFreeFormRemoteCursors } from "./CollectionFreeFormRemoteCursors"; import { PreviewCursor } from "./PreviewCursor"; +import { Timeline } from "../../nodes/Timeline" import { DocumentManager } from "../../../util/DocumentManager"; import { SelectionManager } from "../../../util/SelectionManager"; import { NumberField } from "../../../../fields/NumberField"; @@ -336,6 +337,7 @@ export class CollectionFreeFormView extends CollectionSubView { </div> {this.overlayView} </PreviewCursor> + <Timeline /> </MarqueeView> </div> </div>)} diff --git a/src/client/views/nodes/Timeline.scss b/src/client/views/nodes/Timeline.scss new file mode 100644 index 000000000..d2055c946 --- /dev/null +++ b/src/client/views/nodes/Timeline.scss @@ -0,0 +1,40 @@ +.timeline-container { + height: 100px; + width: 500px; + background-color: rgb(160, 226, 243); + position: absolute; + left: 15%; + top: 1%; + font-size: 75%; + + .timeline { + height: 60px; + width: 500px; + bottom: 0px; + background-color: grey; + position: absolute; + } + + .inner { + height: 44px; + width: 484px; + background-color: black; + position: absolute; + margin: 8px; + } + + button { + height: 30px; + width: 100px; + font-size: 1em; + position: relative; + margin: 5px; + } + + input { + height: 30px; + width: 100px; + font-size: 1em; + margin: 5px; + } +}
\ No newline at end of file diff --git a/src/client/views/nodes/Timeline.tsx b/src/client/views/nodes/Timeline.tsx new file mode 100644 index 000000000..7872649a0 --- /dev/null +++ b/src/client/views/nodes/Timeline.tsx @@ -0,0 +1,35 @@ +import * as React from "react" +import * as ReactDOM from "react-dom" +import { observer } from "mobx-react" +import { observable } from "mobx" +import { TimelineField } from "../../../fields/TimelineField"; +import "./Timeline.scss" + +@observer +export class Timeline extends React.Component<TimelineField>{ + + private _isRecording = false; + onRecord = (e: React.MouseEvent) => { + this._isRecording = true; + } + + onStop = (e: React.MouseEvent) => { + this._isRecording = false; + } + + render() { + return ( + <div> + <div className="timeline-container"> + <div className="timeline"> + <div className="inner"> + </div> + </div> + <button>Record</button> + <button> Stop </button> + <input placeholder="Time"></input> + </div> + </div> + ) + } +}
\ No newline at end of file diff --git a/src/fields/TimelineField.ts b/src/fields/TimelineField.ts new file mode 100644 index 000000000..4325647cb --- /dev/null +++ b/src/fields/TimelineField.ts @@ -0,0 +1,7 @@ +import { BasicField } from "./BasicField" +import { FieldId } from "./Field"; +import { Types } from "../server/Message"; + +export class TimelineField { + +}
\ No newline at end of file |