move autoCompile option to compile-tab && move runCompiler timeout to compile-tab

src/app.js

@@ -601,6 +601,9 @@ function run () {
     },
     loadCompiler: (usingWorker, url) => {
       compiler.loadVersion(usingWorker, url)
+    },
+    runCompiler: () => {
+      runCompiler()
     }
   }
   var rhpEvents = {
@@ -858,18 +861,6 @@ function run () {
     startdebugging(hash)
   })
 
-  // ----------------- autoCompile -----------------
-  var autoCompile = document.querySelector('#autoCompile').checked
-  if (config.exists('autoCompile')) {
-    autoCompile = config.get('autoCompile')
-    $('#autoCompile').checked = autoCompile
-  }
-
-  document.querySelector('#autoCompile').addEventListener('change', function () {
-    autoCompile = document.querySelector('#autoCompile').checked
-    config.set('autoCompile', autoCompile)
-  })
-
   function runCompiler () {
     if (transactionDebugger.isActive) return
 
@@ -908,7 +899,6 @@ function run () {
   }
 
   var previousInput = ''
-  var compileTimeout = null
   var saveTimeout = null
 
   function editorOnChange () {
@@ -930,30 +920,12 @@ function run () {
       window.clearTimeout(saveTimeout)
     }
     saveTimeout = window.setTimeout(editorSyncFile, 5000)
-
-    // special case: there's nothing else to do
-    if (input === '') {
-      return
-    }
-
-    if (!autoCompile) {
-      return
-    }
-
-    if (compileTimeout) {
-      window.clearTimeout(compileTimeout)
-    }
-    compileTimeout = window.setTimeout(runCompiler, 300)
   }
 
   editor.event.register('contentChanged', editorOnChange)
   // in order to save the file when switching
   editor.event.register('sessionSwitched', editorOnChange)
 
-  $('#compile').click(function () {
-    runCompiler()
-  })
-
   executionContext.event.register('contextChanged', this, function (context) {
     runCompiler()
   })

src/app/tabs/compile-tab.js

@@ -155,6 +155,45 @@ function compileTab (container, appAPI, appEvents, opts) {
       </div>
   `
 
+  compileContainer.querySelector('#compile').addEventListener('click', () => {
+    appAPI.runCompiler()
+  })
+
+  var compileTimeout = null
+  function scheduleCompilation () {
+    if (!appAPI.config.get('autoCompile')) {
+      return
+    }
+
+    if (compileTimeout) {
+      window.clearTimeout(compileTimeout)
+    }
+    compileTimeout = window.setTimeout(() => {
+      appAPI.runCompiler()
+    }, 300)
+  }
+
+  appEvents.editor.register('contentChanged', () => {
+    scheduleCompilation()
+  })
+
+  appEvents.editor.register('sessionSwitched', () => {
+    scheduleCompilation()
+  })
+
+  // ----------------- autoCompile -----------------
+  var autoCompileInput = compileContainer.querySelector('#autoCompile')
+  if (appAPI.config.exists('autoCompile')) {
+    var autoCompile = appAPI.config.get('autoCompile')
+    if (autoCompile) {
+      autoCompileInput.setAttribute('checked', autoCompile)
+    }
+  }
+
+  autoCompileInput.addEventListener('change', function () {
+    appAPI.config.set('autoCompile', autoCompileInput.checked)
+  })
+
   // REGISTER EVENTS
 
   // compilationDuration