Presentations Listed, Option to Change Added, and

2 files changed, 85 insertions, 12 deletions

diff --git a/src/client/views/presentationview/PresentationElement.tsx b/src/client/views/presentationview/PresentationElement.tsx
index 00dc07921..8ec6348f2 100644
--- a/src/client/views/presentationview/PresentationElement.tsx
+++ b/src/client/views/presentationview/PresentationElement.tsx
@@ -56,7 +56,13 @@ export enum buttonIndex {
 @observer
 export default class PresentationElement extends React.Component<PresentationElementProps> {
 
-    @observable selectedButtons: boolean[] = new Array(6);
+    @observable selectedButtons: boolean[];
+
+
+    constructor(props: PresentationElementProps) {
+        super(props);
+        this.selectedButtons = new Array(6);
+    }
 
     /**
      * Getter to get the status of the buttons.
@@ -67,6 +73,16 @@ export default class PresentationElement extends React.Component<PresentationEle
     }
 
     async componentDidMount() {
+        this.receiveButtonBackUp();
+
+    }
+
+    async componentDidUpdate() {
+        this.receiveButtonBackUp();
+    }
+
+    receiveButtonBackUp = async () => {
+
         //get the list that stores docs that keep track of buttons
         let castedList = Cast(this.props.presButtonBackUp.selectedButtonDocs, listSpec(Doc));
         if (!castedList) {
@@ -74,17 +90,21 @@ export default class PresentationElement extends React.Component<PresentationEle
         }
         //if this is the first time this doc mounts, push a doc for it to store
         if (castedList.length <= this.props.index) {
-            castedList.push(new Doc());
+            let newDoc = new Doc();
+            let defaultBooleanArray: boolean[] = new Array(6);
+            newDoc.selectedButtons = new List(defaultBooleanArray);
+            castedList.push(newDoc);
             //otherwise update the selected buttons depending on storage.
         } else {
             let curDoc: Doc = await castedList[this.props.index];
             let selectedButtonOfDoc = Cast(curDoc.selectedButtons, listSpec("boolean"), null);
+            console.log("Debug Selected Buttons: ", this.selectedButtons, " and the selectedButtonOfDoc: ", selectedButtonOfDoc);
             if (selectedButtonOfDoc !== undefined) {
                 runInAction(() => this.selectedButtons = selectedButtonOfDoc);
+                console.log("New Selected Buttons: ", this.selectedButtons);
             }
         }
 
-
     }
 
     /**
@@ -337,6 +357,8 @@ export default class PresentationElement extends React.Component<PresentationEle
         let p = this.props;
         let title = p.document.title;
 
+        console.log("Re-rendered");
+
         //to get currently selected presentation doc
         let selected = NumCast(p.mainDocument.selectedDoc, 0);
 
diff --git a/src/client/views/presentationview/PresentationView.tsx b/src/client/views/presentationview/PresentationView.tsx
index ff5c6df9c..01cddbc45 100644
--- a/src/client/views/presentationview/PresentationView.tsx
+++ b/src/client/views/presentationview/PresentationView.tsx
@@ -96,6 +96,7 @@ class PresentationViewList extends React.Component<PresListProps> {
         this.initializeGroupIds(children);
         this.initializeScaleViews(children);
         this.props.setChildrenDocs(children);
+        console.log(this.props.mainDocument, " re-rendering");
         return (
 
             <div className="presentationView-listCont">
@@ -123,7 +124,9 @@ export class PresentationView extends React.Component<PresViewProps>  {
     @observable presButtonBackUp: Doc = new Doc();
     @observable curPresentation: Doc = new Doc();
     @observable presentationsMapping: Map<String, Doc> = new Map();
-    @observable selectedPresentation: HTMLSelectElement = new HTMLSelectElement();
+    @observable presentationsKeyMapping: Map<Doc, String> = new Map();
+    @observable selectedPresentation: HTMLSelectElement | undefined;
+    @observable currentSelectedPresValue: string | undefined;
 
 
     //initilize class variables
@@ -134,12 +137,32 @@ export class PresentationView extends React.Component<PresViewProps>  {
 
 
     async componentWillMount() {
+        this.props.Documents.forEach(async (doc, index: number) => {
+            let curDoc: Doc = await doc;
+            let newGuid = Utils.GenerateGuid();
+            this.presentationsKeyMapping.set(curDoc, newGuid);
+            this.presentationsMapping.set(newGuid, curDoc);
+            if (index === 0) {
+                runInAction(() => this.currentSelectedPresValue = newGuid);
+                runInAction(() => this.curPresentation = curDoc);
+            }
+        });
+    }
+
+    async componentDidMount() {
+
         let docAtZero = await this.props.Documents[0];
         runInAction(() => this.curPresentation = docAtZero);
+
+        this.setPresentationBackUps();
+
+
     }
 
-    componentDidMount() {
+
+    setPresentationBackUps = async () => {
         //getting both backUp documents
+
         let castedGroupBackUp = Cast(this.curPresentation.presGroupBackUp, Doc);
         let castedButtonBackUp = Cast(this.curPresentation.presButtonBackUp, Doc);
         //if instantiated before 
@@ -154,7 +177,12 @@ export class PresentationView extends React.Component<PresViewProps>  {
                     }
                 }
             });
+
             //if never instantiated a store doc yet
+        } else if (castedGroupBackUp instanceof Doc) {
+            let castedDoc: Doc = await castedGroupBackUp;
+            runInAction(() => this.presGroupBackUp = castedDoc);
+            this.retrieveGroupMappings();
         } else {
             runInAction(() => {
                 let toAssign = new Doc();
@@ -170,10 +198,16 @@ export class PresentationView extends React.Component<PresViewProps>  {
             castedButtonBackUp.then(doc => {
                 let toAssign = doc ? doc : new Doc();
                 this.curPresentation.presButtonBackUp = toAssign;
+                console.log("Called the promise one!!");
                 runInAction(() => this.presButtonBackUp = toAssign);
             });
 
             //if never instantiated a store doc yet
+        } else if (castedButtonBackUp instanceof Doc) {
+            let castedDoc: Doc = await castedButtonBackUp;
+            runInAction(() => this.presButtonBackUp = castedDoc);
+            console.log("Called the important action");
+
         } else {
             runInAction(() => {
                 let toAssign = new Doc();
@@ -541,11 +575,30 @@ export class PresentationView extends React.Component<PresViewProps>  {
         let newPresentationDoc = Docs.TreeDocument([], { title: title });
         this.props.Documents.push(newPresentationDoc);
         this.curPresentation = newPresentationDoc;
+        let newGuid = Utils.GenerateGuid();
+        this.presentationsMapping.set(newGuid, newPresentationDoc);
+        this.presentationsKeyMapping.set(newPresentationDoc, newGuid);
+        this.currentSelectedPresValue = newGuid;
+        this.setPresentationBackUps();
+
+        // if (this.selectedPresentation) {
+        //     this.selectedPresentation.selectedIndex = 1;
+        //     console.log("Selected Pres: ", this.selectedPresentation);
+        //     console.log("New value: ", this.selectedPresentation.value);
+        //     console.log("New Index: ", this.selectedPresentation.selectedIndex);
+
+
+        // }
+
     }
 
     @action
     getSelectedPresentation = (e: React.ChangeEvent<HTMLSelectElement>) => {
-        this.curPresentation = this.presentationsMapping.get(e.target.value)!;
+        let selectedGuid = e.target.value;
+        this.curPresentation = this.presentationsMapping.get(selectedGuid)!;
+        this.currentSelectedPresValue = selectedGuid;
+        this.setPresentationBackUps();
+
     }
 
 
@@ -555,19 +608,17 @@ export class PresentationView extends React.Component<PresViewProps>  {
         let presentationList = DocListCast(this.props.Documents);
 
 
-        console.log("width: ", width);
-        console.log("title : ", titleStr);
 
         //TODO: next and back should be icons
         return (
             <div className="presentationView-cont" style={{ width: width, overflow: "hidden" }}>
                 <div className="presentationView-heading">
                     {/* <div className="presentationView-title">{titleStr}</div> */}
-                    <select className="presentationView-title" onChange={this.getSelectedPresentation} ref={(e) => this.selectedPresentation = e!}>
+                    <select value={this.currentSelectedPresValue} id="pres_selector" className="presentationView-title" onChange={this.getSelectedPresentation} ref={(e: HTMLSelectElement) => this.selectedPresentation = e}>
                         {presentationList.map((doc: Doc, index: number) => {
-                            let newGuid = Utils.GenerateGuid();
-                            this.presentationsMapping.set(newGuid, doc);
-                            return <option key={index} value={newGuid}>{StrCast(doc.title)}</option>;
+                            let mappedGuid = this.presentationsKeyMapping.get(doc);
+                            let docGuid: string = mappedGuid ? mappedGuid.toString() : "";
+                            return <option key={index} value={docGuid}>{StrCast(doc.title)}</option>;
                         })}
                     </select>
                     <button title="Close Presentation" className='presentation-icon' onClick={this.closePresentation}><FontAwesomeIcon icon={"times"} /></button>