diff options
| author | Geireann Lindfield Roberts <60007097+geireann@users.noreply.github.com> | 2020-08-06 20:38:31 +0800 |
|---|---|---|
| committer | Geireann Lindfield Roberts <60007097+geireann@users.noreply.github.com> | 2020-08-06 20:38:31 +0800 |
| commit | 142011ffd5c9ca5aeed85ed8a74e5919e0e5a6dd (patch) | |
| tree | ddcd6db1712cb14f0948f880c46f7736de4df65f /src/client/views/collections | |
| parent | 557bcff59aaec470b045a01600b0c2a6e785c730 (diff) | |
audio auto play bug fix && some more commenting
Diffstat (limited to 'src/client/views/collections')
| -rw-r--r-- | src/client/views/collections/CollectionDockingView.scss | 15 | ||||
| -rw-r--r-- | src/client/views/collections/CollectionDockingView.tsx | 30 |
2 files changed, 33 insertions, 12 deletions
diff --git a/src/client/views/collections/CollectionDockingView.scss b/src/client/views/collections/CollectionDockingView.scss index 98babc3d2..4204ef5bb 100644 --- a/src/client/views/collections/CollectionDockingView.scss +++ b/src/client/views/collections/CollectionDockingView.scss @@ -54,6 +54,21 @@ transition: all 0.3s; } + .miniPres-button-frame { + justify-self: center; + align-self: center; + align-items: center; + display: grid; + grid-template-columns: auto auto auto; + justify-content: space-around; + font-size: 11; + margin-left: 7; + width: 30; + height: 85%; + background-color: rgba(91, 157, 221, 0.4); + border-radius: 5px; + } + .miniPres-divider { width: 0.5px; height: 80%; 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={{ |