diff options
| -rw-r--r-- | src/client/views/Main.tsx | 2 | ||||
| -rw-r--r-- | src/client/views/nodes/PDFBox.tsx | 1 | ||||
| -rw-r--r-- | src/client/views/nodes/Timeline.tsx | 40 |
3 files changed, 28 insertions, 15 deletions
diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx index d8e97fe72..0181e98e9 100644 --- a/src/client/views/Main.tsx +++ b/src/client/views/Main.tsx @@ -385,7 +385,7 @@ export class Main extends React.Component { let cat = Gateway.Instance.ClearCatalog(); cat.then(async () => { this.AddToNorthstarCatalog(await Gateway.Instance.GetCatalog()); - if (!CurrentUserUtils.GetNorthstarSchema("Book1")){ + if (!CurrentUserUtils.GetNorthstarSchema("Book1")) { this.AddToNorthstarCatalog(await Gateway.Instance.GetSchema("http://www.cs.brown.edu/~bcz/Book1.csv")); } }); diff --git a/src/client/views/nodes/PDFBox.tsx b/src/client/views/nodes/PDFBox.tsx index 81ceb37f6..c73ee4f21 100644 --- a/src/client/views/nodes/PDFBox.tsx +++ b/src/client/views/nodes/PDFBox.tsx @@ -108,6 +108,7 @@ export class PDFBox extends React.Component<FieldViewProps> { componentWillUnmount() { if (this._reactionDisposer) { this._reactionDisposer(); + this._reactionDisposer = undefined; } } diff --git a/src/client/views/nodes/Timeline.tsx b/src/client/views/nodes/Timeline.tsx index c6aa0b146..711b6c3bc 100644 --- a/src/client/views/nodes/Timeline.tsx +++ b/src/client/views/nodes/Timeline.tsx @@ -1,11 +1,12 @@ import * as React from "react"; import * as ReactDOM from "react-dom"; import { observer } from "mobx-react"; -import { observable, reaction, action } from "mobx"; +import { observable, reaction, action, IReactionDisposer } from "mobx"; import "./Timeline.scss"; import { KeyStore } from "../../../fields/KeyStore"; import { Document } from "../../../fields/Document"; import { KeyFrame } from "./KeyFrame"; +import { Opt } from '../../../fields/Field'; @observer export class Timeline extends React.Component { @@ -13,6 +14,7 @@ export class Timeline extends React.Component { @observable private _isRecording: Boolean = false; @observable private _currentBar: any = null; @observable private _newBar: any = null; + private _reactionDisposer: Opt<IReactionDisposer>; @action onRecord = (e: React.MouseEvent) => { @@ -22,11 +24,10 @@ export class Timeline extends React.Component { @action onStop = (e: React.MouseEvent) => { this._isRecording = false; - if (this._inner.current) { + if (this._inner.current) { //if you comment this section out it works as before... 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); @@ -45,6 +46,9 @@ export class Timeline extends React.Component { } } + createMark = (width: number) => { + + } private _keyFrames: KeyFrame[] = []; @@ -60,19 +64,27 @@ export class Timeline extends React.Component { } } + componentDidMount() { this.createBar(5); - // let doc: Document; - // let keyFrame = new KeyFrame(); - // this._keyFrames.push(keyFrame); - // let keys = [KeyStore.X, KeyStore.Y]; - // reaction(() => { - // return keys.map(key => doc.GetNumber(key, 0)); - // }, data => { - // keys.forEach((key, index) => { - // keyFrame.document().SetNumber(key, data[index]); - // }); - // }); + let doc: Document; + let keyFrame = new KeyFrame(); + this._keyFrames.push(keyFrame); + let keys = [KeyStore.X, KeyStore.Y]; + this._reactionDisposer = reaction(() => { + return keys.map(key => doc.GetNumber(key, 0)); + }, data => { + keys.forEach((key, index) => { + keyFrame.document().SetNumber(key, data[index]); + }); + }); + } + + componentWillUnmount() { + if (this._reactionDisposer) { + this._reactionDisposer(); + this._reactionDisposer = undefined; + } } render() { |