Juanfran 2014-08-21 14:41:54 +02:00
parent e2b887c04a
commit 3711366c12
5 changed files with 109 additions and 84 deletions

View File

@ -176,87 +176,13 @@ ProjectsNavigationDirective = ($rootscope, animationFrame, $timeout, tgLoader, $
target = angular.element(event.currentTarget)
$ctrl.filterProjects(target.val())
$scope.$on "projects:filtered", ->
renderProjects($el, $scope.filteredProjects)
$el.trigger("regenerate:pagination")
$scope.$watch "projects", (projects) ->
render($el, $scope.projects) if projects?
bindOnce $scope, "projects", (projects) ->
prevBtn = $el.find(".v-pagination-previous")
nextBtn = $el.find(".v-pagination-next")
container = $el.find("ul")
pageSize = 0
containerSize = 0
renderNextAndPrev = ->
#wait digest end
$timeout () ->
if $scope.filteredProjects
pageSize = $el.find(".v-pagination-list").height()
containerSize = container.height()
if containerSize > pageSize
visible(nextBtn)
else
remove()
else
remove()
nextPage = (element, pageSize, callback) ->
top = parseInt(element.css('top'), 10)
newTop = top - pageSize
element.animate({"top": newTop}, callback);
return newTop
prevPage = (element, pageSize, callback) ->
top = parseInt(element.css('top'), 10)
newTop = top + pageSize
element.animate({"top": newTop}, callback);
return newTop
visible = (element) ->
element.css('visibility', 'visible')
hide = (element) ->
element.css('visibility', 'hidden')
remove = () ->
container.css('top', 0)
hide(prevBtn)
hide(nextBtn)
$el.on "click", ".v-pagination-previous", (event) ->
event.preventDefault()
if container.is(':animated')
return
visible(nextBtn)
newTop = prevPage(container, pageSize)
if newTop == 0
hide(prevBtn)
$el.on "click", ".v-pagination-next", (event) ->
event.preventDefault()
if container.is(':animated')
return
visible(prevBtn)
newTop = nextPage(container, pageSize)
if -newTop + pageSize > containerSize
hide(nextBtn)
renderNextAndPrev()
$scope.$on "projects:filtered", ->
renderProjects($el, $scope.filteredProjects)
renderNextAndPrev()
return {link: link}
module.directive("tgProjectsNav", ["$rootScope", "animationFrame", "$timeout", "tgLoader", "$location",

View File

@ -1,6 +1,6 @@
taiga = @.taiga
module = angular.module("taigaProject")
bindOnce = @.taiga.bindOnce
class ProjectsController extends taiga.Controller
@.$inject = ["$scope", "$tgResources", "$rootScope", "$tgNavUrls", "$tgAuth", "$location", "$appTitle", "$projectUrl"]
@ -19,6 +19,7 @@ class ProjectsController extends taiga.Controller
loadInitialData: ->
return @rs.projects.list().then (projects) =>
@.projects = {'recents': projects.slice(0, 8), 'all': projects.slice(8)}
for project in projects
project.url = @projectUrl.get(project)
@ -62,3 +63,96 @@ class ProjectController extends taiga.Controller
module.controller("ProjectController", ProjectController)
ProjectsPaginationDirective = ($timeout) ->
link = ($scope, $el, $attrs) ->
bindOnce $scope, "projects", (projects) ->
container = nextBtn = prevBtn = null
pageSize = 0
containerSize = 0
renderNextAndPrev = ->
if projects.length
pageSize = $el.find(".v-pagination-list").height()
containerSize = container.height()
if containerSize > pageSize
visible(nextBtn)
else
remove()
else
remove()
nextPage = (element, pageSize, callback) ->
top = parseInt(element.css('top'), 10)
newTop = top - pageSize
element.animate({"top": newTop}, callback);
return newTop
prevPage = (element, pageSize, callback) ->
top = parseInt(element.css('top'), 10)
newTop = top + pageSize
element.animate({"top": newTop}, callback);
return newTop
visible = (element) ->
element.css('visibility', 'visible')
hide = (element) ->
element.css('visibility', 'hidden')
remove = () ->
container.css('top', 0)
hide(prevBtn)
hide(nextBtn)
$el.on "click", ".v-pagination-previous", (event) ->
event.preventDefault()
if container.is(':animated')
return
visible(nextBtn)
newTop = prevPage(container, pageSize)
if newTop == 0
hide(prevBtn)
$el.on "click", ".v-pagination-next", (event) ->
event.preventDefault()
if container.is(':animated')
return
visible(prevBtn)
newTop = nextPage(container, pageSize)
if -newTop + pageSize > containerSize
hide(nextBtn)
$el.on "regenerate:pagination", () =>
renderNextAndPrev()
#wait digest end
$timeout () =>
prevBtn = $el.find(".v-pagination-previous")
nextBtn = $el.find(".v-pagination-next")
container = $el.find("ul")
renderNextAndPrev()
return {
link: link,
scope: {
projects: "="
}
}
module.directive("tgProjectsPagination", ['$timeout', ProjectsPaginationDirective])

View File

@ -17,10 +17,14 @@ block content
div.all-projects
h1 Projects
div(tg-projects-pagination, active="ctrl.projects.all.length")
ul
li(ng-repeat="project in ctrl.projects.all")
a.button(tg-bo-bind="project.name", href="{{ project.url }}")
div(tg-projects-pagination, projects="ctrl.projects.all", active="ctrl.projects.all.length")
.projects-pagination
a.v-pagination-previous.icon.icon-arrow-up(href="")
.v-pagination-list
ul.projects-list
li(ng-repeat="project in ctrl.projects.all")
a.button(tg-bo-bind="project.name", href="{{ project.url }}")
a.v-pagination-next.icon.icon-arrow-bottom(href="")
.create-project-button-wrapper
a.button.button-green(href="", ng-click="ctrl.newProject()") Create project

View File

@ -6,4 +6,4 @@
div.lightbox.lightbox_create-project.hidden(tg-lb-create-project)
include lightbox_create-project
nav.projects-nav(ng-controller="ProjectsNavigationController", tg-projects-nav)
nav.projects-nav(ng-controller="ProjectsNavigationController", tg-projects-nav, tg-projects-pagination, projects="projects")

View File

@ -43,6 +43,7 @@
margin-top: 1rem;
}
.create-project-button {
flex-shrink: 0;
margin-top: 1rem;
a {
text-align: center;