diff options
| -rw-r--r-- | src/client/views/Main.tsx | 4 | ||||
| -rw-r--r-- | src/client/views/PresentationView.scss | 29 | ||||
| -rw-r--r-- | src/client/views/PresentationView.tsx | 11 |
3 files changed, 38 insertions, 6 deletions
diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx index 91d9909bb..3b03899d6 100644 --- a/src/client/views/Main.tsx +++ b/src/client/views/Main.tsx @@ -69,7 +69,8 @@ Documents.initProtos(() => { mainContainer = Documents.DockDocument(JSON.stringify({ content: [{ type: 'row', content: [] }] }), { title: "main container" }, mainDocId); Utils.Emit(Server.Socket, MessageStore.AddDocument, new DocumentTransfer(mainContainer.ToJson())) - mainContainer.Set(KeyStore.PresentationView, Documents.FreeformDocument([], { title: "Presentation" })); + //save a document for the presentation view in Key Store - this is where title is set + mainContainer.Set(KeyStore.PresentationView, Documents.FreeformDocument([], { title: "Presentation Mode" })); setTimeout(() => { mainfreeform = Documents.FreeformDocument([], { x: 0, y: 400, title: "mini collection" }); @@ -130,6 +131,7 @@ Documents.initProtos(() => { </div>), document.getElementById('root')); } + //call render async passing in the doc saved in PresentationView key mainContainer.GetAsync(KeyStore.PresentationView, render); }) }); diff --git a/src/client/views/PresentationView.scss b/src/client/views/PresentationView.scss new file mode 100644 index 000000000..c635f51ea --- /dev/null +++ b/src/client/views/PresentationView.scss @@ -0,0 +1,29 @@ +.presentationView-cont { + position: absolute; + background: blue; + z-index: 1; + box-shadow: #AAAAAA .2vw .2vw .4vw; + right: 0; + top:0; + bottom:0; +} + +.presentationView-item { + width: 10vw; + height: 6vh; + background: #DDDDDD; + flex-direction: column; + + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + transition: all .1s; +} + +.presentationView-item:hover { + transition: all .1s; + background: #AAAAAA +}
\ No newline at end of file diff --git a/src/client/views/PresentationView.tsx b/src/client/views/PresentationView.tsx index 081f8533c..045a5acc7 100644 --- a/src/client/views/PresentationView.tsx +++ b/src/client/views/PresentationView.tsx @@ -7,6 +7,7 @@ import { TextField } from "../../fields/TextField"; import { observable, action } from "mobx"; import { Field } from "../../fields/Field"; import { Documents } from '../documents/Documents'; +import "./PresentationView.scss" export interface PresViewProps { Document: Document; @@ -28,11 +29,11 @@ class PresentationViewItem extends React.Component<PresViewProps> { // if the title hasn't loaded, immediately return the div if (!title || title === "<Waiting>") { - return <div key={document.Id}></div>; + return <div className="presentationView-item" key={document.Id}></div>; } // finally, if it's a normal document, then render it as such. else { - return <li key={document.Id}>{title.Data}</li>; + return <li className="presentationView-item" key={document.Id}>{title.Data}</li>; } } @@ -116,9 +117,9 @@ export class PresentationView extends React.Component<PresViewProps> { } let width = this.collapsed ? 100 : 300; return ( - <div background-color="lightblue" max-width={width}> - <h3>{titleStr}</h3> - <ul className="no-indent"> + <div className="presentationView-cont" max-width={width}> + <h2>{titleStr}</h2> + <ul> <PresentationViewItem Document={this.props.Document} /> |