cpvalente/ontime
1
0
Fork 0
mirror of https://github.com/cpvalente/ontime.git synced 2026-08-10 18:03:47 +00:00
Code Issues Packages Projects Releases 10 Wiki Activity

Merge pull request #17 from cpvalente/fix/roll

Browse Source 
Fix/roll
This commit is contained in:
Carlos Valente
2021-10-29 13:44:19 +02:00
committed by GitHub
parent 1305fad6b5 3a85a483c1
commit 1c327cde1f
7 changed files with 71 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/features/control/PlaybackButtons.jsx
+11 -3
View File
@@ -30,17 +30,24 @@ const Playback = ({ playback, selectedId, playbackControl }) => {
/>
<RollIconBtn
active={playback === 'roll'}
disabled={playback === 'roll'}
clickhandler={() => playbackControl('roll')}
/>
</div>
);
};
const Transport = ({ selectedId, playbackControl }) => {
const Transport = ({ playback, selectedId, playbackControl }) => {
return (
<div className={style.playbackContainer}>
<PrevIconBtn clickhandler={() => playbackControl('previous')} />
<NextIconBtn clickhandler={() => playbackControl('next')} />
<PrevIconBtn
clickhandler={() => playbackControl('previous')}
disabled={playback === 'roll'}
/>
<NextIconBtn
clickhandler={() => playbackControl('next')}
disabled={playback === 'roll'}
/>
<ReloadIconButton
clickhandler={() => playbackControl('reload')}
disabled={!selectedId}
@@ -60,6 +67,7 @@ const PlaybackButtons = (props) => {
playbackControl={props.playbackControl}
/>
<Transport
playback={playback}
selectedId={selectedId}
playbackControl={props.playbackControl}
/>
client/src/features/control/PlaybackControl.jsx
+2
View File
@@ -12,6 +12,7 @@ export default function PlaybackControl() {
running: null,
startedAt: null,
expectedFinish: null,
secondary: null,
});
const [selectedId, setSelectedId] = useState(null);
@@ -20,6 +21,7 @@ export default function PlaybackControl() {
running: null,
startedAt: null,
expectedFinish: null,
secondary: null,
});
};
client/src/features/control/PlaybackControl.module.css
+5
View File
@@ -105,6 +105,11 @@
font-size: 0.9em;
}
.rolltag {
color: #2b6cb0;
font-size: 0.9em;
}
.playbackContainer {
display: flex;
justify-content: space-evenly;
client/src/features/control/PlaybackTimer.jsx
+29 -11
View File
@@ -1,6 +1,7 @@
import style from './PlaybackControl.module.css';
import Countdown from 'common/components/countdown/Countdown';
import { stringFromMillis } from 'common/dateConfig';
import { Tooltip } from '@chakra-ui/react';
import { Button } from '@chakra-ui/button';
import { memo } from 'react';
@@ -9,7 +10,8 @@ const areEqual = (prevProps, nextProps) => {
prevProps.timer.running === nextProps.timer.running &&
prevProps.timer.expectedFinish === nextProps.timer.expectedFinish &&
prevProps.timer.startedAt === nextProps.timer.startedAt &&
prevProps.playback === nextProps.playback
prevProps.playback === nextProps.playback &&
prevProps.timer.secondary === nextProps.timer.secondary
);
};
@@ -19,6 +21,7 @@ const PlaybackTimer = (props) => {
const finish = stringFromMillis(timer.expectedFinish, true);
const isNegative = timer.running < 0;
const isRolling = playback === 'roll';
const isWaiting = timer.secondary > 0 && timer.running == null;
const incrementProps = {
size: 'sm',
@@ -32,23 +35,38 @@ const PlaybackTimer = (props) => {
<>
<div className={style.timeContainer}>
<div className={style.indicators}>
<div className={isRolling ? style.indRollActive : style.indRoll} />
<Tooltip label='Roll mode active'>
<div className={isRolling ? style.indRollActive : style.indRoll} />
</Tooltip>
<div
className={isNegative ? style.indNegativeActive : style.indNegative}
/>
<div className={style.indDelay} />
</div>
<div className={style.timer}>
<Countdown time={timer?.running} small negative={isNegative} />
</div>
<div className={style.start}>
<span className={style.tag}>Started at </span>
<span className={style.time}>{started}</span>
</div>
<div className={style.finish}>
<span className={style.tag}>Finish at </span>
<span className={style.time}>{finish}</span>
<Countdown
time={isWaiting ? timer.secondary : timer.running}
small
negative={isNegative}
/>
</div>
{isWaiting ? (
<div className={style.start}>
<span className={style.rolltag}>Roll: Countdown to start</span>
<span className={style.time}>{''}</span>
</div>
) : (
<>
<div className={style.start}>
<span className={style.tag}>Started at </span>
<span className={style.time}>{started}</span>
</div>
<div className={style.finish}>
<span className={style.tag}>Finish at </span>
<span className={style.time}>{finish}</span>
</div>
</>
)}
<div className={style.btn}>
<Button
{...incrementProps}
client/src/features/info/Info.jsx
+2
View File
@@ -20,6 +20,8 @@ export default function Info() {
const [selected, setSelected] = useState('No events');
const logData = [];
console.log(`titles`, titles);
// handle incoming messages
useEffect(() => {
if (socket == null) return;
server/src/classes/EventTimer.js
+14 -10
View File
@@ -242,10 +242,6 @@ export class EventTimer extends Timer {
} else {
// look for event if none is loaded
if (this.current <= 0 || this.secondaryTimer <= 0) this.rollLoad();
// count to next event
// TODO: replace with proper counter
if (this.secondaryTimer != null) this.secondaryTimer -= 1000;
}
}
@@ -946,8 +942,12 @@ export class EventTimer extends Timer {
rollLoad() {
const now = this._getCurrentTime();
this._resetTimers(true);
this._resetSelection();
// maybe roll has already been loaded
if (this.secondaryTimer == null) {
this._resetTimers(true);
this._resetSelection();
}
let foundNow = null;
let nextIndex = null;
@@ -988,16 +988,20 @@ export class EventTimer extends Timer {
}
// nothing to play next, unload
if (!foundNow && !nextIndex) {
if (foundNow == null && nextIndex == null) {
this.unload();
console.log('Roll: no events found');
return;
}
if (nextIndex) {
if (nextIndex != null) {
// load titles
this._loadThisTitles(nextIndex, 'next');
const e = this._eventlist[nextIndex];
this._loadThisTitles(e, 'next');
if (!foundNow) {
if (foundNow == null) {
if (this.secondaryTimer == null)
console.log('Roll: waiting for event start');
// timer counts to nextStart
this.secondaryTimer = nextStart;
}
server/src/controllers/playbackController.js
+8 -2
View File
@@ -7,6 +7,7 @@ export const pbGet = async (req, res) => {
// Create controller for GET request to '/playback/start'
// Starts timer object
export const pbStart = async (req, res) => {
console.log('Calling start');
global.timer.start();
res.sendStatus(200);
};
@@ -14,6 +15,7 @@ export const pbStart = async (req, res) => {
// Create controller for GET request to '/playback/pause'
// Pauses timer object
export const pbPause = async (req, res) => {
console.log('Calling pause');
global.timer.pause();
res.sendStatus(200);
};
@@ -21,6 +23,7 @@ export const pbPause = async (req, res) => {
// Create controller for GET request to '/playback/stop'
// Stops timer object
export const pbStop = async (req, res) => {
console.log('Calling stop');
global.timer.stop();
res.sendStatus(200);
};
@@ -28,6 +31,7 @@ export const pbStop = async (req, res) => {
// Create controller for GET request to '/playback/roll'
// Sets timer object to roll mode
export const pbRoll = async (req, res) => {
console.log('Calling roll');
global.timer.roll();
res.sendStatus(501);
};
@@ -35,6 +39,7 @@ export const pbRoll = async (req, res) => {
// Create controller for GET request to '/playback/previous'
// Sets timer object to roll mode
export const pbPrevious = async (req, res) => {
console.log('Calling previous');
global.timer.previous();
res.sendStatus(200);
};
@@ -42,6 +47,7 @@ export const pbPrevious = async (req, res) => {
// Create controller for GET request to '/playback/next'
// Sets timer object to roll mode
export const pbNext = async (req, res) => {
console.log('Calling next');
global.timer.next();
res.sendStatus(200);
};
@@ -49,8 +55,8 @@ export const pbNext = async (req, res) => {
// Create controller for GET request to '/playback/unload'
// Unloads any events
export const pbUnload = async (req, res) => {
console.log('Calling unload');
global.timer.unload();
console.log('debug: unload called');
res.sendStatus(200);
};
@@ -58,7 +64,7 @@ export const pbUnload = async (req, res) => {
// Create controller for GET request to '/playback/reload'
// Reloads current event
export const pbReload = async (req, res) => {
console.log('Calling reload');
global.timer.reload();
console.log('debug: reload called');
res.sendStatus(200);
};