Add in test loading spinner

This commit is contained in:
James Allen 2014-06-17 16:36:08 +01:00
parent dac4f09943
commit 525581bada
5 changed files with 75 additions and 7 deletions

View file

@ -37,11 +37,14 @@ html(itemscope, itemtype='http://schema.org/Product')
script(src=jsPath+'libs/underscore-1.3.3.js')
block scripts
- if (typeof(bodyClasses) == "undefined")
- var bodyClasses = []
body(class=bodyClasses)
body
#ng-app(style="display: none;")
include layout/navbar
block content
include layout/footer
#ng-app-loading
i.fa.fa-spin.fa-refresh
- if (typeof(lookingForScribtex) != "undefined" && lookingForScribtex)
.modal.hide#scribtexModal
.modal-header
@ -53,7 +56,6 @@ html(itemscope, itemtype='http://schema.org/Product')
a(href="https://scribtex.sharelatex.com#{scribtexPath}", style="font-size: 16px") https://scribtex.sharelatex.com#{scribtexPath}
.modal-footer
button(data-dismiss="modal").btn OK
include layout/footer
script(type='text/javascript').
window.requirejs = {

View file

@ -0,0 +1,57 @@
define [
"base"
], (App) ->
App.directive "asyncForm", ($http) ->
return {
link: (scope, element, attrs) ->
formName = attrs.asyncForm
element.on "submit", (e) ->
e.preventDefault()
formData = {}
for data in element.serializeArray()
formData[data.name] = data.value
$http
.post(element.attr('action'), formData)
.success (data, status, headers, config) ->
scope.success = true
scope.error = false
if data.redir?
ga('send', 'event', formName, 'success')
window.location = data.redir
else if data.message?
scope.message = data.message
if data.message.type == "error"
scope.success = false
scope.error = true
ga('send', 'event', formName, 'failure', data.message)
else
ga('send', 'event', formName, 'success')
.error (data, status, headers, config) ->
scope.success = false
scope.error = true
ga('send', 'event', formName, 'failure', data.message)
scope.message =
text: data.message or "Something went wrong talking to the server :(. Please try again."
type: 'error'
}
App.directive "formMessages", () ->
return {
restrict: "E"
template: """
<div class="alert" ng-class="{
'alert-danger': message.type == 'error',
'alert-success': message.type != 'error'
}" ng-show="!!message">
{{message.text}}
</div>
<div ng-transclude></div>
"""
transclude: true
}

View file

@ -3,4 +3,6 @@ define [
"user-details"
"directives/asyncForm"
], () ->
angular.bootstrap(document.body, ["SharelatexApp"])
angular.bootstrap(document.getElementById("ng-app"), ["SharelatexApp"])
$("#ng-app").show()
$("#ng-app-loading").hide()

View file

@ -0,0 +1,6 @@
#ng-app-loading {
position: absolute;
top: 45%;
width: 100%;
text-align: center;
}

View file

@ -52,5 +52,6 @@
@import "core/responsive-utilities.less";
// ShareLaTeX app classes
@import "app/base.less";
@import "app/project-list.less";
@import "app/editor.less";