taiga
/
taiga-front
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Loading page effect

stable
Xavier Julián 2014-08-14 14:33:44 +02:00
parent 2c94ee0ce7
commit 1d0c127da9
5 changed files with 35 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
app/coffee/app.coffee
View File

@ -24,7 +24,7 @@
configure = ($routeProvider, $locationProvider, $httpProvider, $provide, tgLoaderProvider) -> configure = ($routeProvider, $locationProvider, $httpProvider, $provide, tgLoaderProvider) ->
$routeProvider.when("/", {templateUrl: "/partials/projects.html"}) $routeProvider.when("/", {templateUrl: "/partials/projects.html"})
$routeProvider.when("/project/:pslug/", {templateUrl: "/partials/project.html"}) $routeProvider.when("/project/:pslug/", {templateUrl: "/partials/project.html"})
$routeProvider.when("/project/:pslug/backlog", {templateUrl: "/partials/backlog.html"}) $routeProvider.when("/project/:pslug/backlog", {templateUrl: "/partials/backlog.html", resolve: {loader: tgLoaderProvider.add(true)}})
$routeProvider.when("/project/:pslug/taskboard/:id", {templateUrl: "/partials/taskboard.html"}) $routeProvider.when("/project/:pslug/taskboard/:id", {templateUrl: "/partials/taskboard.html"})
$routeProvider.when("/project/:pslug/search", {templateUrl: "/partials/search.html", reloadOnSearch: false}) $routeProvider.when("/project/:pslug/search", {templateUrl: "/partials/search.html", reloadOnSearch: false})
$routeProvider.when("/project/:pslug/kanban", {templateUrl: "/partials/kanban.html"}) $routeProvider.when("/project/:pslug/kanban", {templateUrl: "/partials/kanban.html"})
@ -45,7 +45,7 @@ configure = ($routeProvider, $locationProvider, $httpProvider, $provide, tgLoade
# Wiki # Wiki
$routeProvider.when("/project/:pslug/wiki", $routeProvider.when("/project/:pslug/wiki",
{redirectTo: (params) -> "/project/#{params.pslug}/wiki/home"}) {redirectTo: (params) -> "/project/#{params.pslug}/wiki/home"}, )
$routeProvider.when("/project/:pslug/wiki/:slug", $routeProvider.when("/project/:pslug/wiki/:slug",
{templateUrl: "/partials/wiki.html"}) {templateUrl: "/partials/wiki.html"})
@ -54,7 +54,7 @@ configure = ($routeProvider, $locationProvider, $httpProvider, $provide, tgLoade
{templateUrl: "/partials/wiki-edit.html"}) {templateUrl: "/partials/wiki-edit.html"})
# Issues # Issues
$routeProvider.when("/project/:pslug/issues", {templateUrl: "/partials/issues.html"}) $routeProvider.when("/project/:pslug/issues", {templateUrl: "/partials/issues.html", resolve: {loader: tgLoaderProvider.add(true)}})
$routeProvider.when("/project/:pslug/issues/:issueref", $routeProvider.when("/project/:pslug/issues/:issueref",
{templateUrl: "/partials/issues-detail.html"}) {templateUrl: "/partials/issues-detail.html"})

2
app/coffee/modules/common/loader.coffee
View File

@ -37,7 +37,7 @@ Loader = () ->
defaultConfig = { defaultConfig = {
enabled: false, enabled: false,
minTime: 500, minTime: 3000,
auto: false auto: false
} }

5
app/partials/views/modules/loader.jade
View File

@ -1,3 +1,4 @@
.loader(tg-loader) .loader(tg-loader)
.bg div.container
.info Loading ... include ../components/spinner
p Loading...

48
app/styles/components/loader.scss
View File

@ -1,34 +1,40 @@
.loader { .loader {
@include transition(opacity .5s linear);
background-color: $white;
bottom: 0; bottom: 0;
display: none; display: none;
height: 100%; height: 100%;
left: 0; left: 0;
opacity: 0;
position: fixed; position: fixed;
right: 0; right: 0;
top: 0; top: 0;
width: 100%; width: 100%;
.bg { z-index: 99900;
background-color: $black; .container {
bottom: 0; margin: 0 auto;
position: absolute; margin-top: 15%;
right: 0; position: relative;
top: 0; width: 150px;
width: 100%;
z-index: 20;
} }
.info { .spinner {
background-color: $black; background-color: $white;
color: $white; box-shadow: 1px 1px 10px rgba($whitish, .9);
padding: .5rem 3rem; .icon {
position: absolute; color: $gray-light;
right: 20px; text-shadow: 1px 1px 3px $whitish, 0 0 0 $grayer, 1px 1px 3px $whitish;
top: 20px;
z-index: 25;
}
&.active {
display: block;
.bg {
opacity: .7;
} }
} }
p {
@extend %large;
color: $gray-light;
padding-top: 20px;
text-align: center;
}
&.active {
@include transition(opacity .5s linear);
background-color: rgba($white, .9);
display: block;
opacity: 1;
}
} }

2
app/styles/components/spinner.scss
View File

@ -8,7 +8,7 @@
position: relative; position: relative;
width: 7rem; width: 7rem;
.icon { .icon {
@include animation(fadeIn infinite 6s ease-in-out); @include animation(fadeIn 6s linear);
@extend %xxlarge; @extend %xxlarge;
border-radius: 5%; border-radius: 5%;
color: darken($green-taiga, 15%); color: darken($green-taiga, 15%);