redid autoupdate flow

app.js

@@ -16,6 +16,7 @@ const autoUpdater = electron.autoUpdater
 const os = require("os");
 var platform = os.platform() + '_' + os.arch();
 var version = app.getVersion();
+var updateResponse
 app.setName("PNT")
 //icon credit: http://www.flaticon.com/authors/madebyoliver
 // Keep a global reference of the window object, if you don't, the window will
@@ -116,41 +117,28 @@ autoUpdater.on('checking-for-update', function(){
 })
 autoUpdater.on('update-available', function(){
   console.log('update available, downloading now')
-  const availableNotification = notifier.notify('', {
-    message: "Update available. Downloading in the background now",
-    buttons: ['Ok'],
-    duration: 4000,
-    icon: path.join(__dirname, 'icon.png')
-  })
-  availableNotification.on('buttonClicked', (text) => {
-    console.log(text)
-    availableNotification.close()
-  })
-  availableNotification.on('clicked', () => {
-    availableNotification.close()
+  var dialogOptions = {
+    type: "question",
+    buttons: ["Cancel", "Install"],
+    defaultId: 1,
+    title: "Install Update",
+    message: "Would you like to install the latest version now? If so, the app will download the new version and update itself. It will take a few minutes, depending on your network connection.",
+    cancelId: 0
+  }
+  dialog.showMessageBox(mainWindow, dialogOptions , function (response) {
+    updateResponse = response
+    if (response == 1) {
+
+    }
   })
 })
 autoUpdater.on('update-not-available', function(){
   console.log('update not available')
 })
 autoUpdater.on('update-downloaded', function(){
-  console.log('update downloaded')
-  const updateNotification = notifier.notify('', {
-    message: "Update downloaded!",
-    buttons: ['Install', 'Cancel'],
-    duration: 20000,
-    icon: path.join(__dirname, 'icon.png')
-  })
-  updateNotification.on('buttonClicked', (text) => {
-    console.log(text)
-    if (text === 'Install') {
-      autoUpdater.quitAndInstall()
-    }
-    updateNotification.close()
-  })
-  updateNotification.on('clicked', () => {
-    updateNotification.close()
-  })
+  if (updateResponse == 1) {
+    autoUpdater.quitAndInstall()
+  }
 })
 
 // In this file you can include the rest of your app's specific main process

core.js

@@ -19,7 +19,10 @@ var sys = {
   modelID: 'unknown',
   isMacBook: false // need to detect if macbook for ffmpeg recording framerate value
 }
-var instructions = "I'm going to ask you to name some pictures. Each picture will appear on the computer screen. Your job is to name the picture using only one word. We'll practice several pictures before we begin"
+var instructions = ["<h1>I'm going to ask you to name some pictures. <br>" +
+                    "Each picture will appear on the computer screen. <br>" +
+                    "Your job is to name the picture using only one word. <br>" +
+                    "We'll practice several pictures before we begin </h1>"]
 var beepSound = path.join(__dirname, 'assets', 'beep.wav')
 var exp = new experiment('pnt')
 // construct a new ffmpeg recording object
@@ -205,7 +208,7 @@ function ff() {
       ' -preset ultrafast' +
       ' -filter_complex ' + this.filter +
       ' -r ' + this.getFramerate().toString() +
-      ' ' + '"' + this.outputFilename() + '"'
+      ' -movflags +faststart ' + '"' + this.outputFilename() + '"'
     ]
     console.log('ffmpeg cmd: ')
     console.log(cmd)
@@ -285,14 +288,16 @@ function showInstructions(txt) {
   var textDiv = document.createElement("div")
   textDiv.style.textAlign = 'center'
   var p = document.createElement("p")
-  var txtNode = document.createTextNode(txt)
-  p.appendChild(txtNode)
+  // var txtNode = document.createTextNode(txt)
+  // p.appendChild(txtNode)
+  p.innerHTML = txt
   textDiv.appendChild(p)
   var lineBreak = document.createElement("br")
   var btnDiv = document.createElement("div")
   var startBtn = document.createElement("button")
   var startBtnTxt = document.createTextNode("Start")
   startBtn.appendChild(startBtnTxt)
+  startBtn.className = 'startBtn'
   startBtn.onclick = showNextTrial
   btnDiv.appendChild(startBtn)
   content.appendChild(textDiv)

css/app.css

@@ -10,6 +10,19 @@ body {
   min-width: 400px;
 }
 
+.startBtn {
+    width: 150px;
+    background-color: #4CAF50;
+    color: white;
+    padding: 14px 20px;
+    margin: 3% 5%;
+    border: none;
+    border-radius: 4px;
+    cursor: pointer;
+    outline: none;
+    box-shadow: 2px 2px 3px #ccc;
+}
+
 .nav {
   position: fixed;
   flex: initial;