aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/views/presentationview/PresentationElement.tsx46
-rw-r--r--src/client/views/presentationview/PresentationView.tsx47
2 files changed, 91 insertions, 2 deletions
diff --git a/src/client/views/presentationview/PresentationElement.tsx b/src/client/views/presentationview/PresentationElement.tsx
index ee423c90a..dfe078a8e 100644
--- a/src/client/views/presentationview/PresentationElement.tsx
+++ b/src/client/views/presentationview/PresentationElement.tsx
@@ -31,6 +31,7 @@ interface PresentationElementProps {
}
+//enum for the all kinds of buttons a doc in presentation can have
export enum buttonIndex {
Show = 0,
Navigate = 1,
@@ -41,26 +42,41 @@ export enum buttonIndex {
}
+/**
+ * This class models the view a document added to presentation will have in the presentation.
+ * It involves some functionality for its buttons and options.
+ */
@observer
export default class PresentationElement extends React.Component<PresentationElementProps> {
@observable selectedButtons: boolean[] = new Array(6);
+ /**
+ * Getter to get the status of the buttons.
+ */
@computed
get selected() {
return this.selectedButtons;
}
+ /**
+ * The function that is called to group docs together. It tries to group a doc
+ * that turned grouping option with the above document. If that doc is grouped with
+ * other documents. Those other documents will be grouped with doc's above document as well.
+ */
@action
onGroupClick = (document: Doc, index: number, buttonStatus: boolean) => {
let p = this.props;
if (index >= 1) {
+ //checking if options was turned true
if (buttonStatus) {
- let newGuid = Utils.GenerateGuid();
+ //getting the id of the above-doc and the doc
let aboveGuid = StrCast(p.allListElements[index - 1].presentId, null);
let docGuid = StrCast(document.presentId, null);
+ //the case where above-doc is already in group
if (p.groupMappings.has(aboveGuid)) {
let aboveArray = p.groupMappings.get(aboveGuid)!;
+ //case where doc is already in group
if (p.groupMappings.has(docGuid)) {
let docsArray = p.groupMappings.get(docGuid)!;
docsArray.forEach((doc: Doc) => {
@@ -70,6 +86,7 @@ export default class PresentationElement extends React.Component<PresentationEle
doc.presentId = aboveGuid;
});
p.groupMappings.delete(docGuid);
+ //the case where doc was not in group
} else {
if (!aboveArray.includes(document)) {
aboveArray.push(document);
@@ -77,9 +94,12 @@ export default class PresentationElement extends React.Component<PresentationEle
}
}
+ //the case where above-doc was not in group
} else {
let newAboveArray: Doc[] = [];
newAboveArray.push(p.allListElements[index - 1]);
+
+ //the case where doc is in group
if (p.groupMappings.has(docGuid)) {
let docsArray = p.groupMappings.get(docGuid)!;
docsArray.forEach((doc: Doc) => {
@@ -87,6 +107,8 @@ export default class PresentationElement extends React.Component<PresentationEle
doc.presentId = aboveGuid;
});
p.groupMappings.delete(docGuid);
+
+ //the case where doc is not in a group
} else {
newAboveArray.push(document);
@@ -95,6 +117,8 @@ export default class PresentationElement extends React.Component<PresentationEle
}
document.presentId = aboveGuid;
+
+ //when grouping is turned off
} else {
let curArray = p.groupMappings.get(StrCast(document.presentId, Utils.GenerateGuid()))!;
let targetIndex = curArray.indexOf(document);
@@ -112,6 +136,9 @@ export default class PresentationElement extends React.Component<PresentationEle
}
+ /**
+ * Function that is called on click to change the group status of a docus, by turning the option on/off.
+ */
@action
changeGroupStatus = () => {
if (this.selectedButtons[buttonIndex.Group]) {
@@ -121,6 +148,10 @@ export default class PresentationElement extends React.Component<PresentationEle
}
}
+ /**
+ * The function that is called on click to turn Hiding document till press option on/off.
+ * It also sets the beginning and end opacitys.
+ */
@action
onHideDocumentUntilPressClick = (e: React.MouseEvent) => {
e.stopPropagation();
@@ -136,6 +167,11 @@ export default class PresentationElement extends React.Component<PresentationEle
}
}
+ /**
+ * The function that is called on click to turn Hiding document after presented option on/off.
+ * It also makes sure that the option swithches from fade-after to this one, since both
+ * can't coexist.
+ */
@action
onHideDocumentAfterPresentedClick = (e: React.MouseEvent) => {
e.stopPropagation();
@@ -149,6 +185,11 @@ export default class PresentationElement extends React.Component<PresentationEle
}
}
+ /**
+ * The function that is called on click to turn fading document after presented option on/off.
+ * It also makes sure that the option swithches from hide-after to this one, since both
+ * can't coexist.
+ */
@action
onFadeDocumentAfterPresentedClick = (e: React.MouseEvent) => {
e.stopPropagation();
@@ -162,6 +203,9 @@ export default class PresentationElement extends React.Component<PresentationEle
}
}
+ /**
+ * The function that is called on click to turn navigation option of docs on/off.
+ */
@action
onNavigateDocumentClick = (e: React.MouseEvent) => {
e.stopPropagation();
diff --git a/src/client/views/presentationview/PresentationView.tsx b/src/client/views/presentationview/PresentationView.tsx
index c7839a384..e987d12f6 100644
--- a/src/client/views/presentationview/PresentationView.tsx
+++ b/src/client/views/presentationview/PresentationView.tsx
@@ -37,10 +37,17 @@ interface PresListProps extends PresViewProps {
*/
class PresentationViewList extends React.Component<PresListProps> {
+ /**
+ * Method that initializes presentation ids for the
+ * docs that is in the presentation, when presentation list
+ * gets re-rendered. It makes sure to not assign ids to the
+ * docs that are in the group, so that mapping won't be disrupted.
+ */
@action
initializeGroupIds = (docList: Doc[]) => {
docList.forEach((doc: Doc, index: number) => {
let docGuid = StrCast(doc.presentId, null);
+ //checking if part of group
if (!this.props.groupMappings.has(docGuid)) {
doc.presentId = Utils.GenerateGuid();
}
@@ -65,9 +72,11 @@ class PresentationViewList extends React.Component<PresListProps> {
export class PresentationView extends React.Component<PresViewProps> {
public static Instance: PresentationView;
- @observable groupedMembers: Doc[][] = [];
+ //Mapping from presentation ids to a list of doc that represent a group
@observable groupMappings: Map<String, Doc[]> = new Map();
+ //mapping from docs to their rendered component
@observable presElementsMappings: Map<Doc, PresentationElement> = new Map();
+ //variable that holds all the docs in the presentation
@observable childrenDocs: Doc[] = [];
//observable means render is re-called every time variable is changed
@@ -76,16 +85,21 @@ export class PresentationView extends React.Component<PresViewProps> {
closePresentation = action(() => this.props.Document.width = 0);
next = async () => {
const current = NumCast(this.props.Document.selectedDoc);
+ //asking to get document at current index
let docAtCurrent = await this.getDocAtIndex(current);
if (docAtCurrent === undefined) {
return;
}
+ //asking for it's presentation id
let curPresId = StrCast(docAtCurrent.presentId);
let nextSelected = current + 1;
+ //if curDoc is in a group, selection slides until last one, if not it's next one
if (this.groupMappings.has(curPresId)) {
let currentsArray = this.groupMappings.get(StrCast(docAtCurrent.presentId))!;
nextSelected = current + currentsArray.length - currentsArray.indexOf(docAtCurrent) - 1;
+
+ //end of grup so go beyond
if (nextSelected === current) nextSelected = current + 1;
}
@@ -94,16 +108,21 @@ export class PresentationView extends React.Component<PresViewProps> {
}
back = async () => {
const current = NumCast(this.props.Document.selectedDoc);
+ //requesting for the doc at current index
let docAtCurrent = await this.getDocAtIndex(current);
if (docAtCurrent === undefined) {
return;
}
+
+ //asking for its presentation id.
let curPresId = StrCast(docAtCurrent.presentId);
let prevSelected = current - 1;
+ //checking if this presentation id is mapped to a group, if so chosing the first element in group
if (this.groupMappings.has(curPresId)) {
let currentsArray = this.groupMappings.get(StrCast(docAtCurrent.presentId))!;
prevSelected = current - currentsArray.length + (currentsArray.length - currentsArray.indexOf(docAtCurrent));
+ //end of grup so go beyond
if (prevSelected === current) prevSelected = current - 1;
@@ -113,9 +132,15 @@ export class PresentationView extends React.Component<PresViewProps> {
this.gotoDocument(prevSelected);
}
+ /**
+ * This is the method that checks for the actions that need to be performed
+ * after the document has been presented, which involves 3 button options:
+ * Hide Until Presented, Hide After Presented, Fade After Presented
+ */
showAfterPresented = (index: number) => {
this.presElementsMappings.forEach((presElem: PresentationElement, key: Doc) => {
let selectedButtons: boolean[] = presElem.selected;
+ //the order of cases is aligned based on priority
if (selectedButtons[buttonIndex.HideTillPressed]) {
if (this.childrenDocs.indexOf(key) <= index) {
key.opacity = 1;
@@ -134,9 +159,17 @@ export class PresentationView extends React.Component<PresViewProps> {
});
}
+ /**
+ * This is the method that checks for the actions that need to be performed
+ * before the document has been presented, which involves 3 button options:
+ * Hide Until Presented, Hide After Presented, Fade After Presented
+ */
hideIfNotPresented = (index: number) => {
this.presElementsMappings.forEach((presElem: PresentationElement, key: Doc) => {
let selectedButtons: boolean[] = presElem.selected;
+
+ //the order of cases is aligned based on priority
+
if (selectedButtons[buttonIndex.HideAfter]) {
if (this.childrenDocs.indexOf(key) >= index) {
key.opacity = 1;
@@ -155,10 +188,16 @@ export class PresentationView extends React.Component<PresViewProps> {
});
}
+ /**
+ * This method makes sure that cursor navigates to the element that
+ * has the option open and last in the group. If not in the group, and it has
+ * te option open, navigates to that element.
+ */
navigateToElement = (curDoc: Doc) => {
let docToJump: Doc = curDoc;
let curDocPresId = StrCast(curDoc.presentId, null);
+ //checking if in group
if (curDocPresId !== undefined) {
if (this.groupMappings.has(curDocPresId)) {
let currentDocGroup = this.groupMappings.get(curDocPresId)!;
@@ -171,7 +210,9 @@ export class PresentationView extends React.Component<PresViewProps> {
}
}
+ //docToJump stayed same meaning, it was not in the group or was the last element in the group
if (docToJump === curDoc) {
+ //checking if curDoc has navigation open
if (this.presElementsMappings.get(curDoc)!.selected[buttonIndex.Navigate]) {
DocumentManager.Instance.jumpToDocument(curDoc);
} else {
@@ -181,6 +222,9 @@ export class PresentationView extends React.Component<PresViewProps> {
DocumentManager.Instance.jumpToDocument(docToJump);
}
+ /**
+ * Async function that supposedly return the doc that is located at given index.
+ */
getDocAtIndex = async (index: number) => {
const list = FieldValue(Cast(this.props.Document.data, listSpec(Doc)));
if (!list) {
@@ -191,6 +235,7 @@ export class PresentationView extends React.Component<PresViewProps> {
}
this.props.Document.selectedDoc = index;
+ //awaiting async call to finish to get Doc instance
const doc = await list[index];
return doc;
}
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-11 21:18:08 +0000