Enable switching between source and output files

services/web/app/views/project/editor/new-file-modal.pug

@@ -126,6 +126,13 @@ script(type='text/ng-template', id='newFileModalTemplate')
 											ng-repeat="outputFile in data.projectOutputFiles"
 											value="{{ outputFile.path }}"
 										) {{ outputFile.path }}
+								div
+									a(
+										href="#"
+										ng-click="toggleOutputFilesMode()"
+									)
+										span(ng-show="state.isOutputFilesMode") Switch to source files
+										span(ng-show="!state.isOutputFilesMode") Switch to output files
 
 								.form-controls.row-spaced-small
 									label(for="name") File Name In This Project

services/web/public/coffee/ide/file-tree/controllers/FileTreeController.coffee

@@ -229,11 +229,20 @@ define [
 			$scope.$watch 'data.selectedProjectId', (newVal, oldVal) ->
 				return if !newVal
 				$scope.data.selectedProjectEntity = null
+				$scope.data.selectedProjectOutputFile = null
 				if $scope.state.isOutputFilesMode
 					$scope.compileProjectAndGetOutputFiles($scope.data.selectedProjectId)
 				else
 					$scope.getProjectEntities($scope.data.selectedProjectId)
 
+			$scope.$watch 'state.isOutputFilesMode', (newVal, oldVal) ->
+				return if !newVal and !oldVal
+				$scope.data.selectedProjectOutputFile = null
+				if newVal == true
+					$scope.compileProjectAndGetOutputFiles($scope.data.selectedProjectId)
+				else
+					$scope.getProjectEntities($scope.data.selectedProjectId)
+
 			# auto-set filename based on selected file
 			$scope.$watch 'data.selectedProjectEntity', (newVal, oldVal) ->
 				return if !newVal
@@ -258,6 +267,10 @@ define [
 				$scope.state.inflight = false
 				$scope.state.error = isError
 
+			$scope.toggleOutputFilesMode = () ->
+				return if !$scope.data.selectedProjectId
+				$scope.state.isOutputFilesMode = !$scope.state.isOutputFilesMode
+
 			$scope.shouldEnableProjectSelect = () ->
 				{ state, data } = $scope
 				return !state.inFlight.projects && data.projects