allow setting a time offset

package.json

@@ -70,6 +70,7 @@
     "react-hammerjs": "^0.5.0",
     "read-chunk": "^2.0.0",
     "strong-data-uri": "^1.0.4",
+    "sweetalert2": "^7.28.6",
     "trash": "^4.3.0",
     "which": "^1.2.11"
   }

src/menu.js

@@ -34,6 +34,12 @@ module.exports = (app, mainWindow, newVersion) => {
           mainWindow.webContents.send('html5ify', true);
         },
       },
+      {
+        label: 'Set custom start time offset',
+        click() {
+          mainWindow.webContents.send('set-start-offset', true);
+        },
+      },
       {
         label: 'Exit',
         click() {

src/renderer.jsx

@@ -7,6 +7,7 @@ const throttle = require('lodash/throttle');
 const Hammer = require('react-hammerjs');
 const path = require('path');
 const trash = require('trash');
+const swal = require('sweetalert2');
 
 const React = require('react');
 const ReactDOM = require('react-dom');
@@ -101,6 +102,7 @@ const localState = {
   fileFormat: undefined,
   rotation: 360,
   cutProgress: undefined,
+  startTimeOffset: 0,
 };
 
 const globalState = {
@@ -168,6 +170,41 @@ class App extends React.Component {
       }
     });
 
+    async function promptTimeOffset(inputValue) {
+      const { value } = await swal({
+        title: 'Set custom start time offset',
+        text: 'Instead of video apparently starting at 0, you can offset by a specified value (useful for timecodes)',
+        input: 'text',
+        inputValue: inputValue || '',
+        showCancelButton: true,
+        inputPlaceholder: '00:00:00.000',
+      });
+
+      if (value === undefined) {
+        return undefined;
+      }
+
+      const duration = util.parseDuration(value);
+      // Invalid, try again
+      if (duration === undefined) return promptTimeOffset(value);
+
+      return duration;
+    }
+
+    electron.ipcRenderer.on('set-start-offset', async () => {
+      const { startTimeOffset: startTimeOffsetOld } = this.state;
+      const startTimeOffset = await promptTimeOffset(
+        startTimeOffsetOld !== undefined ? util.formatDuration(startTimeOffsetOld) : undefined,
+      );
+
+      if (startTimeOffset === undefined) {
+        console.log('Cancelled');
+        return;
+      }
+
+      this.setState({ startTimeOffset });
+    });
+
     document.ondragover = ev => ev.preventDefault();
     document.ondragend = document.ondragover;
 
@@ -250,6 +287,10 @@ class App extends React.Component {
     return 0; // Haven't gotten duration yet
   }
 
+  getOffsetCurrentTime() {
+    return (this.state.currentTime || 0) + this.state.startTimeOffset;
+  }
+
 
   increaseRotation = () => {
     this.setState(({ rotation }) => ({ rotation: (rotation + 90) % 450 }));
@@ -413,9 +454,14 @@ class App extends React.Component {
         return;
       }
 
-      this.setState({ [cutTimeManualKey]: undefined, [type === 'start' ? 'cutStartTime' : 'cutEndTime']: time });
+      const cutTimeKey = type === 'start' ? 'cutStartTime' : 'cutEndTime';
+      this.setState(state => ({
+        [cutTimeManualKey]: undefined,
+        [cutTimeKey]: time - state.startTimeOffset,
+      }));
     };
 
+    const cutTime = type === 'start' ? this.state.cutStartTime : this.getApparentCutEndTime();
 
     return (
       <input
@@ -424,8 +470,8 @@ class App extends React.Component {
         onChange={e => handleCutTimeInput(e.target.value)}
         value={isCutTimeManualSet()
           ? this.state[cutTimeManualKey]
-          : util.formatDuration(type === 'start' ? this.state.cutStartTime : this.getApparentCutEndTime())
-      }
+          : util.formatDuration(cutTime + this.state.startTimeOffset)
+        }
       />
     );
   }
@@ -488,7 +534,7 @@ class App extends React.Component {
               )
             }
 
-              <div id="current-time-display">{util.formatDuration(this.state.currentTime)}</div>
+              <div id="current-time-display">{util.formatDuration(this.getOffsetCurrentTime())}</div>
             </div>
           </Hammer>
 

yarn.lock

@@ -4631,6 +4631,11 @@ svg2png@4.1.1:
     pn "^1.0.0"
     yargs "^6.5.0"
 
+sweetalert2@^7.28.6:
+  version "7.28.6"
+  resolved "https://registry.yarnpkg.com/sweetalert2/-/sweetalert2-7.28.6.tgz#6e20519eaf007dc3703c890c8db3797b6b08bc17"
+  integrity sha512-rkMfmOSkg7zWTCg/YOg1VuJDSf2fpniiYhYpBc0MNrOzJnx24bfDOCTj35RulgyDtKrwQIEVR2gVaG3eOnpCXQ==
+
 table@^4.0.3:
   version "4.0.3"
   resolved "https://registry.yarnpkg.com/table/-/table-4.0.3.tgz#00b5e2b602f1794b9acaf9ca908a76386a7813bc"