github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2024-11-07 20:31:06 -05:00
Code Issues Projects Releases Packages Wiki Activity

More fine-grained loading spinners

Browse source
This commit is contained in:
Shane Kilkelly 2018-05-16 11:49:10 +01:00
parent e3bc6cac9e
commit 7292602167
2 changed files with 23 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
services/web/app/views/project/editor/file-tree.pug
View file

@ -349,17 +349,20 @@ script(type='text/ng-template', id='projectLinkedFileModalTemplate')
.modal-body .modal-body
div div
div.alert.alert-danger(ng-if="state.error") Error div.alert.alert-danger(ng-if="state.error") Error, something went wrong!
div div
form form
.form-controls .form-controls
label(for="project-select") Select a Project label(for="project-select") Select a Project
span(ng-show="state.inFlight.projects")
|  
i.fa.fa-spinner.fa-spin
select.form-control( select.form-control(
name="project-select" name="project-select"
ng-model="data.selectedProject" ng-model="data.selectedProject"
ng-disabled="!shouldEnableProjectSelect()" ng-disabled="!shouldEnableProjectSelect()"
) )
option(value="") No Project Selected option(value="") - No Project Selected
option( option(
ng-repeat="project in data.projects" ng-repeat="project in data.projects"
value="{{ project._id }}" value="{{ project._id }}"
@ -368,12 +371,15 @@ script(type='text/ng-template', id='projectLinkedFileModalTemplate')
br br
.form-controls .form-controls
label(for="project-entity-select") Select a File label(for="project-entity-select") Select a File
span(ng-show="state.inFlight.entities")
|  
i.fa.fa-spinner.fa-spin
select.form-control( select.form-control(
name="project-entity-select" name="project-entity-select"
ng-model="data.selectedProjectEntity" ng-model="data.selectedProjectEntity"
ng-disabled="!shouldEnableProjectEntitySelect()" ng-disabled="!shouldEnableProjectEntitySelect()"
) )
option(value="") No File Selected option(value="") - No File Selected
option( option(
ng-repeat="projectEntity in data.projectEntities" ng-repeat="projectEntity in data.projectEntities"
value="{{ projectEntity.path }}" value="{{ projectEntity.path }}"
@ -392,7 +398,7 @@ script(type='text/ng-template', id='projectLinkedFileModalTemplate')
br br
.modal-footer .modal-footer
span(ng-show="state.inFlight") span(ng-show="state.inFlight.create")
i.fa.fa-spinner.fa-spin i.fa.fa-spinner.fa-spin
|   |  
button.btn.btn-default( button.btn.btn-default(

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

@ -224,7 +224,10 @@ define [
selectedProjectEntity: null selectedProjectEntity: null
name: null name: null
$scope.state = $scope.state =
inFlight: false inFlight:
projects: false
entities: false
create: false
error: false error: false
$scope.$watch 'data.selectedProject', (newVal, oldVal) -> $scope.$watch 'data.selectedProject', (newVal, oldVal) ->
@ -241,23 +244,25 @@ define [
$scope._resetAfterResponse = (opts) -> $scope._resetAfterResponse = (opts) ->
isError = opts.err == true isError = opts.err == true
$scope.state.inFlight = false inFlight = $scope.state.inFlight
inFlight.projects = inFlight.entities = inFlight.create = false
$scope.state.error = isError $scope.state.error = isError
$scope.shouldEnableProjectSelect = () -> $scope.shouldEnableProjectSelect = () ->
state = $scope.state state = $scope.state
data = $scope.data data = $scope.data
return !state.inFlight && data.projects return !state.inFlight.projects && data.projects
$scope.shouldEnableProjectEntitySelect = () -> $scope.shouldEnableProjectEntitySelect = () ->
state = $scope.state state = $scope.state
data = $scope.data data = $scope.data
return !state.inFlight && data.projects && data.selectedProject return !state.inFlight.projects && !state.inFlight.entities && data.projects && data.selectedProject
$scope.shouldEnableCreateButton = () -> $scope.shouldEnableCreateButton = () ->
state = $scope.state state = $scope.state
data = $scope.data data = $scope.data
return !state.inFlight && return !state.inFlight.projects &&
!state.inFlight.entities &&
data.projects && data.projects &&
data.selectedProject && data.selectedProject &&
data.projectEntities && data.projectEntities &&
@ -265,7 +270,7 @@ define [
data.name data.name
$scope.getUserProjects = () -> $scope.getUserProjects = () ->
$scope.state.inFlight = true $scope.state.inFlight.projects = true
ide.$http.get("/user/projects", { ide.$http.get("/user/projects", {
_csrf: window.csrfToken _csrf: window.csrfToken
}) })
@ -278,7 +283,7 @@ define [
$scope._resetAfterResponse(err: true) $scope._resetAfterResponse(err: true)
$scope.getProjectEntities = (project_id) => $scope.getProjectEntities = (project_id) =>
$scope.state.inFlight = true $scope.state.inFlight.entities = true
ide.$http.get("/project/#{project_id}/entities", { ide.$http.get("/project/#{project_id}/entities", {
_csrf: window.csrfToken _csrf: window.csrfToken
}) })
@ -300,7 +305,7 @@ define [
project = $scope.data.selectedProject project = $scope.data.selectedProject
path = $scope.data.selectedProjectEntity path = $scope.data.selectedProjectEntity
name = $scope.data.name name = $scope.data.name
$scope.state.inFlight = true $scope.state.inFlight.create = true
ide.fileTreeManager ide.fileTreeManager
.createLinkedFile(name, parent_folder, 'project_file', { .createLinkedFile(name, parent_folder, 'project_file', {
source_project_id: project, source_project_id: project,