aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
authorEleanor Eng <eleanor_eng@brown.edu>2019-04-16 17:21:52 -0400
committerEleanor Eng <eleanor_eng@brown.edu>2019-04-16 17:21:52 -0400
commitfe562f1b6d61b02f5bdb073199af69cca56ef6cb (patch)
treee35344544defe258f52302f418a138cbf74d5d2b /src
parent466ed4b7abb1ddf9a101d573c2ab720f1c47b527 (diff)
yellow line
Diffstat (limited to 'src')
-rw-r--r--src/client/views/nodes/Timeline.tsx21
1 files changed, 16 insertions, 5 deletions
diff --git a/src/client/views/nodes/Timeline.tsx b/src/client/views/nodes/Timeline.tsx
index 7881bf7fd..a5d8e9657 100644
--- a/src/client/views/nodes/Timeline.tsx
+++ b/src/client/views/nodes/Timeline.tsx
@@ -12,16 +12,28 @@ export class Timeline extends React.Component {
@observable private _inner = React.createRef<HTMLDivElement>();
@observable private _isRecording: Boolean = false;
@observable private _currentBar: any = null;
+ @observable private _newBar: any = null;
@action
onRecord = (e: React.MouseEvent) => {
this._isRecording = true;
- console.log("hello");
+ // console.log("hello");
}
@action
onStop = (e: React.MouseEvent) => {
this._isRecording = false;
+ if (this._inner.current) {
+ this._newBar = document.createElement("div");
+ this._newBar.style.height = "100%";
+ this._newBar.style.width = "5px";
+ this._newBar.style.left = this._currentBar.style.left;
+ this._newBar.style.backgroundColor = "yellow";
+ this._newBar.style.transform = this._currentBar.style.transform;
+ this._inner.current.appendChild(this._newBar);
+ }
+ this._currentBar.remove();
+ this._currentBar = null;
}
@action
@@ -41,9 +53,8 @@ export class Timeline extends React.Component {
} else {
this._currentBar.remove();
this._currentBar = null;
- this.onInnerPointerDown(e);
+ this.onInnerPointerDown(e);
}
-
}
}
}
@@ -73,8 +84,8 @@ export class Timeline extends React.Component {
<div className="inner" ref={this._inner} onPointerDown={this.onInnerPointerDown}>
</div>
</div>
- <button onClick = {this.onRecord}>Record</button>
- <button onClick = {this.onStop}> Stop </button>
+ <button onClick={this.onRecord}>Record</button>
+ <button onClick={this.onStop}>Stop</button>
<input placeholder="Time"></input>
</div>
</div>