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

Allow filtering by folder

Browse source
This commit is contained in:
James Allen 2014-06-12 16:21:12 +01:00
parent 6305ac16f4
commit 5fbbf6c452
3 changed files with 87 additions and 56 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
services/web/app/views/project/list.jade
View file

@ -44,19 +44,19 @@ block content
li
a.menu-indent(href="/templates") View All »
.row-spaced
ul.list-unstyled.folders-menu.js-folders-menu
li
a.menu-indent(href="#") All projects
li
a.menu-indent(href="#") Your projects
li
a.menu-indent(href="#") Shared with you
ul.list-unstyled.folders-menu.js-folders-menu(ng-controller="TagListController")
li(ng-class="{active: (view == 'all')}")
a.menu-indent(href="#", ng-click="selectAllProjects()") All projects
//- li
//- a.menu-indent(href="#") Your projects
//- li
//- a.menu-indent(href="#") Shared with you
li
h2 Folders
li(ng-repeat="tag in tags", ng-controller="TagController")
a.menu-indent(href="#")
i.icon.fa.fa-folder-o
| {{tag.name}}
li(ng-repeat="tag in tags", ng-controller="TagListItemController", ng-class="{active: tag.selected}")
a.menu-indent(href="#", ng-click="selectTag()")
i.icon.fa(ng-class="{'fa-folder-open-o': tag.selected, 'fa-folder-o': !tag.selected}")
| {{tag.name}}
span.small ({{tag.project_ids.length}})
.row-spaced-small
@ -70,7 +70,7 @@ block content
.row-spaced
a(href="/user/bonus").btn.btn-info Upgrade Account
.col-md-10(ng-controller="ProjectListController")
.col-md-10
.container-fluid
.row
.col-md-12
@ -95,7 +95,7 @@ block content
span.caret
ul.dropdown-menu.dropdown-menu-right(role="menu")
li.dropdown-header Add to folder
li(ng-repeat="tag in tags", ng-controller="TagDropdownController")
li(ng-repeat="tag in tags", ng-controller="TagDropdownItemController")
a.menu-indent(href="#", ng-click="addOrRemoveProjectsFromTag()")
i.fa.fa-check(ng-if="areSelectedProjectsInTag")
| {{tag.name}}
@ -126,7 +126,7 @@ block content
span.owner OWNER
.col-md-4
span.last-modified LAST MODIFIED
li.project_entry.container-fluid(ng-repeat="project in visibleProjects", ng-controller="ProjectController")
li.project_entry.container-fluid(ng-repeat="project in visibleProjects", ng-controller="ProjectListItemController")
.row
.col-md-6
input.select-item(type="checkbox", ng-model="project.selected", ng-change="onSelectedChange()")

71
services/web/public/coffee/project-list.coffee
View file

@ -6,11 +6,9 @@ ProjectPageApp.filter "formatDate", () ->
ProjectPageApp.controller "ProjectPageController", ($scope) ->
$scope.projects = window.data.projects
$scope.tags = window.data.tags
ProjectPageApp.controller "ProjectListController", ($scope) ->
$scope.allSelected = false
$scope.visibleProjects = $scope.projects
$scope.tags = window.data.tags
$scope.allSelected = false
# Any individual changes to the selection buttons invalidates
# our 'select all'
@ -24,39 +22,70 @@ ProjectPageApp.controller "ProjectListController", ($scope) ->
project.selected = $scope.allSelected
$scope.$broadcast "selection:change"
$scope.clearSelections = () ->
$scope.$watch "searchText", (value) ->
$scope.updateVisibleProjects()
$scope.clearProjectSelections = () ->
for project in $scope.projects
project.selected = false
$scope.allSelected = false
$scope.$broadcast "selection:change"
$scope.updateVisibleProjects = () ->
$scope.visibleProjects = []
selectedTag = $scope.getSelectedTag()
for project in $scope.projects
visible = true
# Only show if it matches any search text
if $scope.searchText? and $scope.searchText != ""
if !project.name.toLowerCase().match($scope.searchText.toLowerCase())
visible = false
# Only show if it matches the selected tag
if selectedTag? and project._id not in selectedTag.project_ids
visible = false
if visible
$scope.visibleProjects.push project
console.log "visible", $scope.visibleProjects
$scope.clearProjectSelections()
$scope.getSelectedProjects = () ->
$scope.projects.filter (project) -> project.selected
$scope.getSelectedProjectIds = () ->
$scope.getSelectedProjects().map (project) -> project._id
$scope.$watch "searchText", (value) ->
$scope.updateVisibleProjects()
$scope.getSelectedTag = () ->
for tag in $scope.tags
return tag if tag.selected
return null
$scope.updateVisibleProjects = () ->
$scope.visibleProjects = []
for project in $scope.projects
visible = true
if $scope.searchText? and $scope.searchText != ""
if !project.name.toLowerCase().match($scope.searchText.toLowerCase())
visible = false
if visible
$scope.visibleProjects.push project
$scope.clearSelections()
ProjectPageApp.controller "ProjectController", ($scope) ->
ProjectPageApp.controller "ProjectListItemController", ($scope) ->
$scope.onSelectedChange = () ->
$scope.$emit "selected:on-change"
ProjectPageApp.controller "TagController", ($scope) ->
ProjectPageApp.controller "TagListController", ($scope) ->
$scope.view = "all"
ProjectPageApp.controller "TagDropdownController", ($scope) ->
$scope.selectAllProjects = () ->
$scope._clearTags()
$scope.setActiveItem("all")
$scope.updateVisibleProjects()
$scope._clearTags = () ->
for tag in $scope.tags
tag.selected = false
$scope.setActiveItem = (view) ->
$scope.view = view
ProjectPageApp.controller "TagListItemController", ($scope) ->
$scope.selectTag = () ->
$scope._clearTags()
$scope.tag.selected = true
$scope.setActiveItem("tag")
$scope.updateVisibleProjects()
ProjectPageApp.controller "TagDropdownItemController", ($scope) ->
$scope.$on "selection:change", (e, newValue, oldValue) ->
console.log "selected watch listen"
$scope.recalculateProjectsInTag()

44
services/web/public/stylesheets/app/project-list.less
View file

@ -14,29 +14,31 @@
}
ul.folders-menu {
margin: 0;
font-weight: 700;
a {
font-size: 0.8rem;
padding: 3px;
}
.active {
background-color: @red;
color: white;
padding-left: 6px;
a {
color: white;
}
}
margin: 0;
li {
line-height: 1;
padding: (@line-height-computed / 4) 0;
a {
font-size: 0.8rem;
color: #333;
padding-left: (@line-height-computed / 4);
}
.small {
font-size: 0.8rem;
color: @gray-light;
}
}
li.active {
border-right: 4px solid @red;
a {
font-weight: 700;
color: @link-color;
}
}
h2 {
margin-top: @line-height-computed / 2;
margin-bottom: @line-height-computed / 4;
margin-top: @line-height-computed / 4;
margin-bottom: 0;
font-size: @font-size-base;
margin-left: 3px;
}
.small {
font-size: 0.8rem;
color: @gray-light;
}
}