V3 (#657)

* refactor: cleanup routes

* style: smaller base font

* chore: upgrade dependencies

* chore: lock node version to electron

* refactor: pass HTTP to integration controller (#652)

* refactor: deprecate onair control

* refactor: remove playback router

* Several project files user folder (#617)

* chore: automated screenshots (#667)

* feat: app settings (#658)

* refactor: remove deprecated event data (#674)

* Studio clock (#663)

---------

Co-authored-by: Carlos Valente <carlosvalente@pm.me>

* Feat: reorder events with alt+ctrl + arrow up/down (#645)

* Warning and danger per event (#677)

---------

Co-authored-by: Fabian Posenau <fabian@fphome.de>

* refactor: stabilise actionHandler (#683)

Co-authored-by: Fabian Posenau <fabian@fphome.de>

* improvement: hide seconds (#675)

* wip: overview (#688)

* fix: focus cursor (#695)

* refactor: update lower third (#665)

* Refactor/time formatting (#696)

---------

Co-authored-by: Carlos Valente <34649812+cpvalente@users.noreply.github.com>
Co-authored-by: Carlos Valente <carlosvalente@pm.me>

* feat: multiple selection (#703)

---------

Co-authored-by: asharonbaltazar <asharonbaltazar@outlook.com>
Co-authored-by: Alex <ac@omnivox.dk>

* fix: test - go to `Edit mode` befor tying to click `Event options` button (#708)

* refactor: runtime service (#715)

* fix: issue with loosing cursor position on message (#719)

* remove info panel (#721)

* Event editor continue (#722)

* update API - part  (#709)

---------

Co-authored-by: Carlos Valente <34649812+cpvalente@users.noreply.github.com>
Co-authored-by: Carlos Valente <carlosvalente@pm.me>

* refactor: update timers (#729)

* feat: many timers (#706)

---------

Co-authored-by: arc-alex <ac@omnivox.dk>

* refactor: excel cleanup (#734)

* refactor: allow import of blocks and skip import (#735)

* Project manager (#697)

* refactor: UI for linking events (#763)

* upgraded pipeline actions (#777)

* Over under (#771)

* custom fields (#744)


---------

Co-authored-by: Carlos Valente <carlosvalente@pm.me>

* Sheets settings (#774)

---------

Co-authored-by: arc-alex <ac@omnivox.dk>

* style: tweaks to lower thirds (#785)

* refactor: delays account for gaps (#784)

* refactor: partial state updates (#780)

* feat: generate crash report (#787)

* Sheet use limited input device auth flow (#782)

---------

Co-authored-by: cv <34649812+cpvalente@users.noreply.github.com>
Co-authored-by: Carlos Valente <carlosvalente@pm.me>

* Custom fields views (#789)

* refactor: deprecate presenter and subtitle (#795)

* refactor: organise API around resources (#798)

---------

Co-authored-by: Bianca Procopio <biancahprocopio@gmail.com>

* Time to end (#804)

* Skip fixes (#805)

* fix: onair derives from playback

* Param nav (#822)

---------

Co-authored-by: Alex Christoffer Rasmussen <ac@omnivox.dk>

* refactor: download files from interface (#831)

* Quick options (#814)

* End pause (#832)

* chore: bump node version in docker (#834)

* refactor: follow in run mode (#840)

* fix: uncaught error in http integration (#837)

* Apply project (#843)

Co-authored-by: Matteo Gheza <matteo.gheza07@gmail.com>
Co-authored-by: Ary <arylmoraesn@gmail.com>
Co-authored-by: Alex Christoffer Rasmussen <ac@omnivox.dk>
Co-authored-by: Fabian Posenau <19673098+kellhogs@users.noreply.github.com>
Co-authored-by: Fabian Posenau <fabian@fphome.de>
Co-authored-by: Alex Rohleder <alexrohleder96@gmail.com>
Co-authored-by: asharonbaltazar <asharonbaltazar@outlook.com>
Co-authored-by: Bianca Procopio <biancahprocopio@gmail.com>
Co-authored-by: Fabian Posenau <fabianpos99+github@gmail.com>

packages/utils/src/date-utils/conversionUtils.test.ts

@@ -0,0 +1,114 @@
+import { millisToHours, millisToMinutes, millisToSeconds } from "./conversionUtils";
+
+describe('millisToSecond()', () => {
+  test('null values', () => {
+    const t = { val: null, result: 0 };
+    expect(millisToSeconds(t.val)).toBe(t.result);
+  });
+
+  test('valid millis', () => {
+    const t = { val: 3600000, result: 3600 };
+    expect(millisToSeconds(t.val)).toBe(t.result);
+  });
+
+  test('negative millis', () => {
+    const t = { val: -3600000, result: -3600 };
+    expect(millisToSeconds(t.val)).toBe(t.result);
+  });
+
+  test('0', () => {
+    const t = { val: 0, result: 0 };
+    expect(millisToSeconds(t.val)).toBe(t.result);
+  });
+
+  test('-0', () => {
+    const t = { val: -0, result: 0 };
+    expect(millisToSeconds(t.val)).toBe(t.result);
+  });
+
+  test('86401000 (24 hours and 1 second)', () => {
+    const t = { val: 86401000, result: 86401 };
+    expect(millisToSeconds(t.val)).toBe(t.result);
+  });
+
+  test('-86401000 (-24 hours and 1 second)', () => {
+    const t = { val: -86401000, result: -86401 };
+    expect(millisToSeconds(t.val)).toBe(t.result);
+  });
+});
+
+describe('millisToMinutes()', () => {
+  test('null values', () => {
+    const t = { val: null, result: 0 };
+    expect(millisToMinutes(t.val)).toBe(t.result);
+  });
+
+  test('valid millis', () => {
+    const t = { val: 3600000, result: 60 };
+    expect(millisToMinutes(t.val)).toBe(t.result);
+  });
+
+  test('negative millis', () => {
+    const t = { val: -3600000, result: -60 };
+    expect(millisToMinutes(t.val)).toBe(t.result);
+  });
+
+  test('0', () => {
+    const t = { val: 0, result: 0 };
+    expect(millisToMinutes(t.val)).toBe(t.result);
+  });
+
+  test('-0', () => {
+    const t = { val: -0, result: 0 };
+    expect(millisToMinutes(t.val)).toBe(t.result);
+  });
+
+  test('86401000 (24 hours and 1 second)', () => {
+    const t = { val: 86401000, result: 1440 };
+    expect(millisToMinutes(t.val)).toBe(t.result);
+  });
+
+  test('-86401000 (-24 hours and 1 second)', () => {
+    // negative numbers are rounded up
+    const t = { val: -86401000, result: -1441 };
+    expect(millisToMinutes(t.val)).toBe(t.result);
+  });
+});
+
+describe('millisToHours()', () => {
+  test('null values', () => {
+    const t = { val: null, result: 0 };
+    expect(millisToHours(t.val)).toBe(t.result);
+  });
+
+  test('valid millis', () => {
+    const t = { val: 3600000, result: 1 };
+    expect(millisToHours(t.val)).toBe(t.result);
+  });
+
+  test('negative millis', () => {
+    const t = { val: -3600000, result: -1 };
+    expect(millisToHours(t.val)).toBe(t.result);
+  });
+
+  test('0', () => {
+    const t = { val: 0, result: 0 };
+    expect(millisToHours(t.val)).toBe(t.result);
+  });
+
+  test('-0', () => {
+    const t = { val: -0, result: 0 };
+    expect(millisToHours(t.val)).toBe(t.result);
+  });
+
+  test('86401000 (24 hours and 1 second)', () => {
+    const t = { val: 86401000, result: 24 };
+    expect(millisToHours(t.val)).toBe(t.result);
+  });
+
+  test('-86401000 (-24 hours and 1 second)', () => {
+    // negative numbers are rounded up
+    const t = { val: -86401000, result: -25 };
+    expect(millisToHours(t.val)).toBe(t.result);
+  });
+});

packages/utils/src/date-utils/conversionUtils.ts

@@ -0,0 +1,29 @@
+type MaybeNumber = number | null;
+
+export const MILLIS_PER_SECOND = 1000;
+export const MILLIS_PER_MINUTE = 1000 * 60;
+export const MILLIS_PER_HOUR = 1000 * 60 * 60;
+
+function convertMillis(millis: MaybeNumber, conversion: number) {
+  if (millis == null || millis === 0) {
+    return 0;
+  }
+
+  // for negative times, we want to round up
+  if (millis < 0) {
+    Math.ceil(millis / conversion);
+  }
+  return Math.floor(millis / conversion);
+}
+
+export function millisToSeconds(millis: MaybeNumber) {
+  return convertMillis(millis, MILLIS_PER_SECOND);
+}
+
+export function millisToMinutes(millis: MaybeNumber) {
+  return convertMillis(millis, MILLIS_PER_MINUTE);
+}
+
+export function millisToHours(millis: MaybeNumber) {
+  return convertMillis(millis, MILLIS_PER_HOUR);
+}

packages/utils/src/date-utils/formatDisplay.test.ts

@@ -1,91 +0,0 @@
-import { formatDisplay } from './formatDisplay';
-
-describe('test string from formatDisplay function', () => {
-  it('test with null values', () => {
-    const t = { val: null, result: '00:00:00' };
-    expect(formatDisplay(t.val, false)).toBe(t.result);
-  });
-
-  it('test with not numbers', () => {
-    const t = { val: 'test', result: '00:00:00' };
-    // @ts-expect-error -- indulge me for the test
-    expect(formatDisplay(t.val, false)).toBe(t.result);
-  });
-
-  it('test with valid millis', () => {
-    const t = { val: 3600000, result: '01:00:00' };
-    expect(formatDisplay(t.val, false)).toBe(t.result);
-  });
-
-  it('test with negative millis', () => {
-    const t = { val: -3600000, result: '01:00:00' };
-    expect(formatDisplay(t.val, false)).toBe(t.result);
-  });
-
-  it('test with 0', () => {
-    const t = { val: 0, result: '00:00:00' };
-    expect(formatDisplay(t.val, false)).toBe(t.result);
-  });
-
-  it('test with -0', () => {
-    const t = { val: -0, result: '00:00:00' };
-    expect(formatDisplay(t.val, false)).toBe(t.result);
-  });
-
-  it('test with 86400 (24 hours)', () => {
-    const t = { val: 86400000, result: '00:00:00' };
-    expect(formatDisplay(t.val, false)).toBe(t.result);
-  });
-
-  it('test with 86401 (24 hours and 1 second)', () => {
-    const t = { val: 86401000, result: '00:00:01' };
-    expect(formatDisplay(t.val, false)).toBe(t.result);
-  });
-
-  it('test with -86401 (-24 hours and 1 second)', () => {
-    const t = { val: -86401000, result: '00:00:01' };
-    expect(formatDisplay(t.val, false)).toBe(t.result);
-  });
-});
-
-describe('test string from formatDisplay function with hidezero', () => {
-  it('test with null values', () => {
-    const t = { val: null, result: '00:00' };
-    expect(formatDisplay(t.val, true)).toBe(t.result);
-  });
-
-  it('test with valid millis', () => {
-    const t = { val: 3600000, result: '01:00:00' };
-    expect(formatDisplay(t.val, true)).toBe(t.result);
-  });
-
-  it('test with negative millis', () => {
-    const t = { val: -3600000, result: '01:00:00' };
-    expect(formatDisplay(t.val, true)).toBe(t.result);
-  });
-
-  it('test with 0', () => {
-    const t = { val: 0, result: '00:00' };
-    expect(formatDisplay(t.val, true)).toBe(t.result);
-  });
-
-  it('test with -0', () => {
-    const t = { val: -0, result: '00:00' };
-    expect(formatDisplay(t.val, true)).toBe(t.result);
-  });
-
-  it('test with 86400 (24 hours)', () => {
-    const t = { val: 86400000, result: '00:00' };
-    expect(formatDisplay(t.val, true)).toBe(t.result);
-  });
-
-  it('test with 86401 (24 hours and 1 second)', () => {
-    const t = { val: 86401000, result: '00:01' };
-    expect(formatDisplay(t.val, true)).toBe(t.result);
-  });
-
-  it('test with -86401 (-24 hours and 1 second)', () => {
-    const t = { val: -86401000, result: '00:01' };
-    expect(formatDisplay(t.val, true)).toBe(t.result);
-  });
-});

packages/utils/src/date-utils/formatDisplay.ts

@@ -1,31 +0,0 @@
-import { mts } from '../timeConstants.js';
-
-/**
- * another go at simpler string formatting (counters) -- Copied from client code
- * @description Converts seconds to string representing time
- * @param {number | null} milliseconds - time in seconds
- * @param {boolean} [hideZero] - whether to show hours in case its 00
- * @returns {string} String representing absolute time 00:12:02
- */
-export function formatDisplay(milliseconds: number | null, hideZero = false): string {
-  if (typeof milliseconds !== 'number') {
-    return hideZero ? '00:00' : '00:00:00';
-  }
-
-  // add an extra 0 if necessary
-  const format = (val: number) => `0${Math.floor(val)}`.slice(-2);
-
-  const s = Math.abs(millisToSeconds(milliseconds));
-  const hours = Math.floor((s / 3600) % 24);
-  const minutes = Math.floor((s % 3600) / 60);
-
-  if (hideZero && hours < 1) return [minutes, s % 60].map(format).join(':');
-  return [hours, minutes, s % 60].map(format).join(':');
-}
-
-export const millisToSeconds = (millis: number | null): number => {
-  if (millis === null) {
-    return 0;
-  }
-  return millis < 0 ? Math.ceil(millis / mts) : Math.floor(millis / mts);
-};

packages/utils/src/date-utils/formatFromMillis.ts

@@ -1,11 +0,0 @@
-import { DateTime } from 'luxon';
-
-/**
- * @description utility function to format a date in milliseconds using luxon
- * @param {number} millis
- * @param {string} format
- * @return {string}
- */
-export function formatFromMillis(millis: number, format: string) {
-  return DateTime.fromMillis(millis).toUTC().toFormat(format);
-}

packages/utils/src/date-utils/isTimeString.test.ts

@@ -24,3 +24,12 @@ describe('test isTimeString() function handle different separators', () => {
     });
   }
 });
+
+describe('test isTimeString() function handle AM/PM', () => {
+  const ts = ['2:10AM', '2:10PM', '2:10'];
+  for (const s of ts) {
+    it(`it handles ${s}`, () => {
+      expect(isTimeString(s)).toBe(true);
+    });
+  }
+});

packages/utils/src/date-utils/isTimeString.ts

@@ -4,16 +4,6 @@
  * @returns {boolean} string represents time
  */
 export const isTimeString = (text: string): boolean => {
-  // ^                   # Start of string
-  // (?:                 # Try to match...
-  //  (?:                #  Try to match...
-  //   ([01]?\d|2[0-3]): #   HH:
-  //  )?                 #  (optionally).
-  //  ([0-5]?\d):        #  MM: (required)
-  // )?                  # (entire group optional, so either HH:MM:, MM: or nothing)
-  // ([0-5]?\d)          # SS (required)
-  // $                   # End of string
-
-  const regex = /^(?:(?:([01]?\d|2[0-3])[:,.])?([0-5]?\d)[:,.])?([0-5]?\d)$/;
+  const regex = /^(?:(?:([01]?\d|2[0-3])[:,.])?([0-5]?\d)[:,.])?([0-5]?\d)?(\s)?([APap][Mm])?$/;
   return regex.test(text);
 };

packages/utils/src/date-utils/millisToString.ts

@@ -1,19 +0,0 @@
-import { DateTime } from 'luxon';
-
-/**
- * @description Converts milliseconds to string representing time
- * @param {number | null} millis - time in milliseconds
- * @param {boolean} showSeconds - weather to show the seconds
- * @param {string} fallback - what to return if value is null
- * @returns {string} String representing time 00:12:02
- */
-export function millisToString(millis: number | null, showSeconds = true, fallback = '...') {
-  if (millis == null) {
-    return fallback;
-  }
-
-  const isNegative = millis < 0;
-
-  const format = `HH:mm${showSeconds ? ':ss' : ''}`;
-  return `${isNegative ? '-' : ''}${DateTime.fromMillis(Math.abs(millis)).toUTC().toFormat(format)}`;
-}

packages/utils/src/date-utils/timeFormatting.test.ts

@@ -1,11 +1,11 @@
-import { expect } from 'vitest';
-
-import { millisToString } from './millisToString';
+import { dayInMs } from '../timeConstants';
+import { MILLIS_PER_HOUR } from './conversionUtils';
+import { millisToString, removeLeadingZero } from './timeFormatting';
 
 describe('millisToString()', () => {
   it('returns fallback if millis is null', () => {
     const fallback = 'testFallback';
-    expect(millisToString(null, true, fallback)).toBe(fallback);
+    expect(millisToString(null, { fallback })).toBe(fallback);
   });
 
   it('returns 00:00:00 if 0 is passed', () => {
@@ -22,8 +22,8 @@ describe('millisToString()', () => {
       { millis: -3600000, expected: '-01:00:00' },
       { millis: -36000000, expected: '-10:00:00' },
       { millis: -86399000, expected: '-23:59:59' },
-      { millis: -86400000, expected: '-00:00:00' },
-      { millis: -86401000, expected: '-00:00:01' },
+      { millis: -86400000, expected: '-24:00:00' },
+      { millis: -86401000, expected: '-24:00:01' },
     ];
 
     testScenarios.forEach((scenario) => {
@@ -31,6 +31,10 @@ describe('millisToString()', () => {
     });
   });
 
+  it('handles times over 24 hours', () => {
+    expect(millisToString(dayInMs + MILLIS_PER_HOUR)).toBe('25:00:00');
+  });
+
   test('random properties', () => {
     const testScenarios = [
       { millis: 300, expected: '00:00:00' },
@@ -41,31 +45,19 @@ describe('millisToString()', () => {
       { millis: 3600000, expected: '01:00:00' },
       { millis: 36000000, expected: '10:00:00' },
       { millis: 86399000, expected: '23:59:59' },
-      { millis: 86400000, expected: '00:00:00' },
-      { millis: 86401000, expected: '00:00:01' },
+      { millis: 86400000, expected: '24:00:00' },
+      { millis: 86401000, expected: '24:00:01' },
     ];
 
     testScenarios.forEach((scenario) => {
       expect(millisToString(scenario.millis)).toBe(scenario.expected);
     });
   });
+});
 
-  test('random properties without seconds', () => {
-    const testScenarios = [
-      { millis: 300, expected: '00:00' },
-      { millis: 1000, expected: '00:00' },
-      { millis: 1500, expected: '00:00' },
-      { millis: 60000, expected: '00:01' },
-      { millis: 600000, expected: '00:10' },
-      { millis: 3600000, expected: '01:00' },
-      { millis: 36000000, expected: '10:00' },
-      { millis: 86399000, expected: '23:59' },
-      { millis: 86400000, expected: '00:00' },
-      { millis: 86401000, expected: '00:00' },
-    ];
-
-    testScenarios.forEach((scenario) => {
-      expect(millisToString(scenario.millis, false)).toBe(scenario.expected);
-    });
+describe('removeLeadingZero()', () => {
+  test('removes leading zero from timer', () => {
+    expect(removeLeadingZero('00:00:00')).toBe('0:00');
+    expect(removeLeadingZero('-00:08:47')).toBe('-8:47');
   });
 });

packages/utils/src/date-utils/timeFormatting.ts

@@ -0,0 +1,81 @@
+import { DateTime } from 'luxon';
+import type { MaybeNumber } from 'ontime-types';
+
+import { millisToHours, millisToMinutes, millisToSeconds } from './conversionUtils.js';
+
+function pad(val: number): string {
+  return String(val).padStart(2, '0');
+}
+
+type FormatOptions = {
+  fallback?: string;
+};
+
+/**
+ * Converts a value in milliseconds to its time tag
+ * @param millis time to convert
+ * @param options optional overloads for format
+ * @returns formatted time such as 12:00:00
+ */
+export function millisToString(millis?: MaybeNumber, options?: FormatOptions): string {
+  if (millis == null) {
+    return options?.fallback ?? '...';
+  }
+
+  const absoluteMillis = Math.abs(millis);
+  const seconds = millisToSeconds(absoluteMillis) % 60;
+  const minutes = millisToMinutes(absoluteMillis) % 60;
+  const hours = millisToHours(absoluteMillis);
+  const isNegative = millis < 0;
+
+  return `${isNegative ? '-' : ''}${[hours, minutes, seconds].map(pad).join(':')}`;
+}
+
+/**
+ * Receives a string such as 00:10:10 and removes the hours field if it is 00
+ * @param timer
+ */
+export function removeLeadingZero(timer: string): string {
+  if (timer.startsWith('00:0')) {
+    return timer.slice(4);
+  }
+  if (timer.startsWith('00:')) {
+    return timer.slice(3);
+  }
+  if (timer.startsWith('-00:0')) {
+    return `-${timer.slice(5)}`;
+  }
+  if (timer.startsWith('-00:')) {
+    return `-${timer.slice(4)}`;
+  }
+  return timer;
+}
+
+/**
+ * Receives a string such as 00:10:10 and removes the seconds field if it is 00
+ * @param timer
+ */
+export function removeTrailingZero(timer: string): string {
+  if (timer.endsWith(':00')) {
+    return timer.slice(0, -3);
+  }
+  return timer;
+}
+
+/**
+ * Receives a string such as 00:10:10 and removes the seconds field
+ * @param timer
+ */
+export function removeSeconds(timer: string): string {
+  return timer.slice(0, -3);
+}
+
+/**
+ * @description utility function to format a date in milliseconds using luxon
+ * @param {number} millis
+ * @param {string} format
+ * @return {string}
+ */
+export function formatFromMillis(millis: number, format: string): string {
+  return DateTime.fromMillis(millis).toUTC().toFormat(format);
+}