From 142011ffd5c9ca5aeed85ed8a74e5919e0e5a6dd Mon Sep 17 00:00:00 2001
From: Geireann Lindfield Roberts <60007097+geireann@users.noreply.github.com>
Date: Thu, 6 Aug 2020 20:38:31 +0800
Subject: audio auto play bug fix && some more commenting

---
 .../views/collections/CollectionDockingView.tsx    | 30 +++++++++++++---------
 1 file changed, 18 insertions(+), 12 deletions(-)

(limited to 'src/client/views/collections/CollectionDockingView.tsx')

diff --git a/src/client/views/collections/CollectionDockingView.tsx b/src/client/views/collections/CollectionDockingView.tsx
index af701bfdd..7bd79b2ef 100644
--- a/src/client/views/collections/CollectionDockingView.tsx
+++ b/src/client/views/collections/CollectionDockingView.tsx
@@ -870,19 +870,25 @@ export class DockedFrameRenderer extends React.Component<DockedFrameProps> {
         return currentFrame;
     }
     renderMiniPres() {
-        return <div className="miniPres" style={{
-            width: 250, height: 30, background: '#323232'
-        }}>
-            <div className="miniPresOverlay" onClick={() => document.addEventListener("keydown", PresBox.Instance.minimizeEvents, false)}>
-                <div className="miniPres-button" onClick={PresBox.Instance.back}><FontAwesomeIcon icon={"arrow-left"} /></div>
-                <div className="miniPres-button" onClick={() => PresBox.Instance.startOrResetPres(PresBox.Instance.itemIndex)}><FontAwesomeIcon icon={PresBox.Instance.layoutDoc.presStatus === "auto" ? "pause" : "play"} /></div>
-                <div className="miniPres-button" onClick={PresBox.Instance.next}><FontAwesomeIcon icon={"arrow-right"} /></div>
-                <div className="miniPres-divider"></div>
-                <div className="miniPres-button-text">Slide {PresBox.Instance.itemIndex + 1} / {PresBox.Instance.childDocs.length}</div>
-                <div className="miniPres-divider"></div>
-                <div className="miniPres-button-text" onClick={PresBox.Instance.updateMinimize}>EXIT</div>
+        return (
+            <div className="miniPres"
+                style={{ width: 250, height: 30, background: '#323232' }}
+                onClick={() => document.addEventListener("keydown", PresBox.Instance.minimizeEvents, false)}
+            >
+                {<div className="miniPresOverlay" onClick={() => document.addEventListener("keydown", PresBox.Instance.minimizeEvents, false)}>
+                    <div className="miniPres-button" onClick={PresBox.Instance.back}><FontAwesomeIcon icon={"arrow-left"} /></div>
+                    <div className="miniPres-button" onClick={() => PresBox.Instance.startAutoPres(PresBox.Instance.itemIndex)}><FontAwesomeIcon icon={PresBox.Instance.layoutDoc.presStatus === "auto" ? "pause" : "play"} /></div>
+                    <div className="miniPres-button" onClick={PresBox.Instance.next}><FontAwesomeIcon icon={"arrow-right"} /></div>
+                    <div className="miniPres-divider"></div>
+                    <div className="miniPres-button-text">
+                        Slide {PresBox.Instance.itemIndex + 1} / {PresBox.Instance.childDocs.length}
+                        {PresBox.Instance.playButtonFrames}
+                    </div>
+                    <div className="miniPres-divider"></div>
+                    <div className="miniPres-button-text" onClick={PresBox.Instance.updateMinimize}>EXIT</div>
+                </div>}
             </div>
-        </div>;
+        );
     }
     renderMiniMap() {
         return <div className="miniMap" style={{
-- 
cgit v1.2.3-70-g09d2

