Documentation and reset Presentation at removal fixed

2 files changed, 79 insertions, 47 deletions

diff --git a/src/client/views/presentationview/PresentationElement.tsx b/src/client/views/presentationview/PresentationElement.tsx
index a84bbbf3c..b12dfd9d5 100644
--- a/src/client/views/presentationview/PresentationElement.tsx
+++ b/src/client/views/presentationview/PresentationElement.tsx
@@ -12,7 +12,6 @@ import { faFile as fileSolid, faLocationArrow, faArrowUp, faSearch } from '@fort
 import { faFile as fileRegular } from '@fortawesome/free-regular-svg-icons';
 import { List } from "../../../new_fields/List";
 import { listSpec } from "../../../new_fields/Schema";
-import { DocumentManager } from "../../util/DocumentManager";
 
 
 
@@ -72,11 +71,13 @@ export default class PresentationElement extends React.Component<PresentationEle
         return this.selectedButtons;
     }
 
+    //Lifecycle function that makes sure that button BackUp is received when mounted.
     async componentDidMount() {
         this.receiveButtonBackUp();
 
     }
 
+    //Lifecycle function that makes sure button BackUp is received when not re-mounted bu re-rendered.
     async componentDidUpdate() {
         this.receiveButtonBackUp();
     }
diff --git a/src/client/views/presentationview/PresentationView.tsx b/src/client/views/presentationview/PresentationView.tsx
index 2b3f5e199..474001523 100644
--- a/src/client/views/presentationview/PresentationView.tsx
+++ b/src/client/views/presentationview/PresentationView.tsx
@@ -123,14 +123,19 @@ export class PresentationView extends React.Component<PresViewProps>  {
     //back-up so that presentation stays the way it's when refreshed
     @observable presGroupBackUp: Doc = new Doc();
     @observable presButtonBackUp: Doc = new Doc();
+
+    //Keeping track of the doc for the current presentation
     @observable curPresentation: Doc = new Doc();
+    //Mapping of guids to presentations.
     @observable presentationsMapping: Map<String, Doc> = new Map();
+    //Mapping of presentations to guid, so that select option values can be given.
     @observable presentationsKeyMapping: Map<Doc, String> = new Map();
+    //Variable to keep track of guid of the current presentation
     @observable currentSelectedPresValue: string | undefined;
+    //A flag to keep track if title input is open, which is used in rendering.
     @observable PresTitleInputOpen: boolean = false;
+    //Variable that holds reference to title input, so that new presentations get titles assigned.
     @observable titleInputElement: HTMLInputElement | undefined;
-    //@observable presTitle: string =  "Presentation";
-
 
     //initilize class variables
     constructor(props: PresViewProps) {
@@ -138,13 +143,17 @@ export class PresentationView extends React.Component<PresViewProps>  {
         PresentationView.Instance = this;
     }
 
-
+    //The first lifecycle function that gets called to set up the current presentation.
     async componentWillMount() {
         this.props.Documents.forEach(async (doc, index: number) => {
+
+            //For each presentation received from mainContainer, a mapping is created.
             let curDoc: Doc = await doc;
             let newGuid = Utils.GenerateGuid();
             this.presentationsKeyMapping.set(curDoc, newGuid);
             this.presentationsMapping.set(newGuid, curDoc);
+
+            //The Presentation at first index gets set as default start presentation
             if (index === 0) {
                 runInAction(() => this.currentSelectedPresValue = newGuid);
                 runInAction(() => this.curPresentation = curDoc);
@@ -152,8 +161,9 @@ export class PresentationView extends React.Component<PresViewProps>  {
         });
     }
 
+    //Second lifecycle function that gets called when component mounts. It makes sure to
+    //get the back-up information from previous session for the current presentation.
     async componentDidMount() {
-
         let docAtZero = await this.props.Documents[0];
         runInAction(() => this.curPresentation = docAtZero);
 
@@ -162,6 +172,10 @@ export class PresentationView extends React.Component<PresViewProps>  {
     }
 
 
+    /**
+     * The function that retrieves the backUps for the current Presentation if present,
+     * otherwise initializes.
+     */
     setPresentationBackUps = async () => {
         //getting both backUp documents
 
@@ -195,7 +209,6 @@ export class PresentationView extends React.Component<PresViewProps>  {
 
         }
         //if instantiated before 
-
         if (castedButtonBackUp instanceof Promise) {
             castedButtonBackUp.then(doc => {
                 let toAssign = doc ? doc : new Doc();
@@ -304,12 +317,14 @@ export class PresentationView extends React.Component<PresViewProps>  {
 
         // if a group set that flag to zero or a single element
         //If so making sure to zoom out, which goes back to state before zooming action
-        if (zoomOut || this.presElementsMappings.get(docAtCurrent)!.selected[buttonIndex.Show]) {
-            let prevScale = NumCast(this.childrenDocs[prevSelected].viewScale, null);
-            let curScale = DocumentManager.Instance.getScaleOfDocView(this.childrenDocs[current]);
-            if (prevScale !== undefined) {
-                if (prevScale !== curScale) {
-                    DocumentManager.Instance.zoomIntoScale(docAtCurrent, prevScale);
+        if (current > 0) {
+            if (zoomOut || this.presElementsMappings.get(docAtCurrent)!.selected[buttonIndex.Show]) {
+                let prevScale = NumCast(this.childrenDocs[prevSelected].viewScale, null);
+                let curScale = DocumentManager.Instance.getScaleOfDocView(this.childrenDocs[current]);
+                if (prevScale !== undefined) {
+                    if (prevScale !== curScale) {
+                        DocumentManager.Instance.zoomIntoScale(docAtCurrent, prevScale);
+                    }
                 }
             }
         }
@@ -453,14 +468,22 @@ export class PresentationView extends React.Component<PresViewProps>  {
         return doc;
     }
 
+    /**
+     * The function that removes a doc from a presentation. It also makes sure to
+     * do necessary updates to backUps and mappings stored locally.
+     */
     @action
     public RemoveDoc = async (index: number) => {
         const value = FieldValue(Cast(this.curPresentation.data, listSpec(Doc)));
         if (value) {
             let removedDoc = await value.splice(index, 1)[0];
+
+            //removing the Presentation Element stored for it
             this.presElementsMappings.delete(removedDoc);
 
             let removedDocPresentId = StrCast(removedDoc.presentId);
+
+            //Removing it from local mapping of the groups
             if (this.groupMappings.has(removedDocPresentId)) {
                 let removedDocsGroup = this.groupMappings.get(removedDocPresentId);
                 if (removedDocsGroup) {
@@ -470,10 +493,14 @@ export class PresentationView extends React.Component<PresViewProps>  {
                     }
                 }
             }
+
+            //removing it from the backUp of selected Buttons
             let castedList = Cast(this.presButtonBackUp.selectedButtonDocs, listSpec(Doc));
             if (castedList) {
                 castedList.splice(index, 1);
             }
+
+            //removing it from the backup of groups
             let castedGroupDocs = await DocListCastAsync(this.presGroupBackUp.groupDocs);
             if (castedGroupDocs) {
                 castedGroupDocs.forEach(async (groupDoc: Doc, index: number) => {
@@ -495,6 +522,9 @@ export class PresentationView extends React.Component<PresViewProps>  {
 
         }
     }
+
+    //The function that is called when a document is clicked or reached through next or back.
+    //it'll also execute the necessary actions if presentation is playing.
     @action
     public gotoDocument = async (index: number, fromDoc: number) => {
         const list = FieldValue(Cast(this.curPresentation.data, listSpec(Doc)));
@@ -520,7 +550,8 @@ export class PresentationView extends React.Component<PresViewProps>  {
 
     }
 
-
+    //Function that is called to resetGroupIds, so that documents get new groupIds at
+    //first load, when presentation is changed.
     resetGroupIds = async () => {
         let castedGroupDocs = await DocListCastAsync(this.presGroupBackUp.groupDocs);
         if (castedGroupDocs !== undefined) {
@@ -531,29 +562,10 @@ export class PresentationView extends React.Component<PresViewProps>  {
                         doc.presentId = Utils.GenerateGuid();
                     });
                 }
-                // let castedKey = StrCast(groupDoc.presentIdStore, null);
-                // if (castedGrouping !== undefined && castedKey !== undefined) {
-                //     this.groupMappings.set(castedKey, castedGrouping);
-                // }
             });
         }
     }
 
-    // reloadGroupIds = async () => {
-    //     let castedGroupDocs = await DocListCastAsync(this.presGroupBackUp.groupDocs);
-    //     if (castedGroupDocs !== undefined) {
-    //         castedGroupDocs.forEach(async (groupDoc: Doc, index: number) => {
-    //             let castedGrouping = await DocListCastAsync(groupDoc.grouping);
-    //             let castedKey = StrCast(groupDoc.presentIdStore, null);
-    //             if (castedGrouping !== undefined && castedKey !== undefined) {
-    //                 this.groupMappings.set(castedKey, castedGrouping);
-    //             }
-    //         });
-    //     }
-    // }
-
-
-
     /**
      * Adds a document to the presentation view
      **/
@@ -570,11 +582,14 @@ export class PresentationView extends React.Component<PresViewProps>  {
         this.curPresentation.width = 400;
     }
 
+    //Function that sets the store of the children docs.
     @action
     setChildrenDocs = (docList: Doc[]) => {
         this.childrenDocs = docList;
     }
 
+    //The function that is called to render the play or pause button depending on
+    //if presentation is running or not.
     renderPlayPauseButton = () => {
         if (this.presStatus) {
             return <button title="Reset Presentation" className="presentation-button" onClick={this.startOrResetPres}><FontAwesomeIcon icon="stop" /></button>;
@@ -583,10 +598,10 @@ export class PresentationView extends React.Component<PresViewProps>  {
         }
     }
 
+    //The function that starts or resets presentaton functionally, depending on status flag.
     @action
     startOrResetPres = () => {
         if (this.presStatus) {
-            //this.presStatus = false;
             this.resetPresentation();
         } else {
             this.presStatus = true;
@@ -597,19 +612,10 @@ export class PresentationView extends React.Component<PresViewProps>  {
         this.curPresentation.presStatus = this.presStatus;
     }
 
+    //The function that resets the presentation by removing every action done by it. It also
+    //stops the presentaton.
     @action
     resetPresentation = () => {
-        //this.groupMappings = new Map();
-        //let selectedButtons: boolean[];
-        // this.presElementsMappings.forEach((component: PresentationElement, doc: Doc) => {
-        //     //selectedButtons = component.selected;
-        //     //selectedButtons.forEach((val: boolean, index: number) => selectedButtons[index] = false);
-        //     //doc.presentId = Utils.GenerateGuid();
-        //     doc.opacity = 1;
-        //     doc.viewScale = 1;
-        // });
-
-
         this.childrenDocs.forEach((doc: Doc) => {
             doc.opacity = 1;
             doc.viewScale = 1;
@@ -621,11 +627,11 @@ export class PresentationView extends React.Component<PresViewProps>  {
             return;
         }
         DocumentManager.Instance.zoomIntoScale(this.childrenDocs[0], 1);
-
-        // this.childrenDocs[0].viewScale = 1;
-
     }
 
+
+    //The function that starts the presentation, also checking if actions should be applied
+    //directly at start.
     startPresentation = (startIndex: number) => {
         let selectedButtons: boolean[];
         this.presElementsMappings.forEach((component: PresentationElement, doc: Doc) => {
@@ -651,6 +657,11 @@ export class PresentationView extends React.Component<PresViewProps>  {
 
     }
 
+    /**
+     * The function that is called to add a new presentation to the presentationView.
+     * It sets up te mappings and local copies of it. Resets the groupings and presentation.
+     * Makes the new presentation current selected, and retrieve the back-Ups if present.
+     */
     @action
     addNewPresentation = (presTitle: string) => {
         //let title = "Presentation " + (this.props.Documents.length + 1);
@@ -667,6 +678,11 @@ export class PresentationView extends React.Component<PresViewProps>  {
 
     }
 
+    /**
+     * The function that is called to change the current selected presentation.
+     * Changes the presentation, also resetting groupings and presentation in process.
+     * Plus retrieving the backUps for the newly selected presentation.
+     */
     @action
     getSelectedPresentation = (e: React.ChangeEvent<HTMLSelectElement>) => {
         let selectedGuid = e.target.value;
@@ -679,6 +695,9 @@ export class PresentationView extends React.Component<PresViewProps>  {
 
     }
 
+    /**
+     * The function that is called to render either select for presentations, or title inputting.
+     */
     renderSelectOrPresSelection = () => {
         let presentationList = DocListCast(this.props.Documents);
         if (this.PresTitleInputOpen) {
@@ -694,6 +713,10 @@ export class PresentationView extends React.Component<PresViewProps>  {
         }
     }
 
+    /**
+     * The function that is called on enter press of title input. It gives the
+     * new presentation the title user entered. If nothing is entered, gives a default title.
+     */
     @action
     submitPresentationTitle = (e: React.KeyboardEvent) => {
         if (e.keyCode === 13) {
@@ -707,6 +730,10 @@ export class PresentationView extends React.Component<PresViewProps>  {
         }
     }
 
+    /**
+     * The function that is called to remove a presentation from all its copies, and the main Container's
+     * list. Sets up the next presentation as current.
+     */
     @action
     removePresentation = () => {
         if (this.presentationsMapping.size !== 1) {
@@ -716,7 +743,11 @@ export class PresentationView extends React.Component<PresViewProps>  {
             this.presentationsMapping.delete(this.currentSelectedPresValue!);
             let remainingPresentations = this.presentationsMapping.values();
             let nextDoc = remainingPresentations.next().value;
+            this.curPresentation = nextDoc;
+            this.resetGroupIds();
+            this.resetPresentation();
             this.currentSelectedPresValue = this.presentationsKeyMapping.get(nextDoc)!.toString();
+            this.setPresentationBackUps();
             presentationList!.splice(presentationList!.indexOf(removedDoc!), 1);
         }
     }