rooty/fab-manager
1
0
Fork 0
mirror of https://github.com/LaCasemate/fab-manager.git synced 2025-01-29 18:52:22 +01:00
Code Issues Releases Activity

projects search params are saved in url query params and remain in browser history

Browse Source
This commit is contained in:
Nicolas Florentin 2016-04-25 12:46:30 +02:00
parent 4cfcbb47aa
commit 960f312dc9
5 changed files with 50 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
app/assets/javascripts/controllers/projects.coffee.erb
View File

@ -144,8 +144,8 @@ class ProjectsController
##
# Controller used on projects listing page
##
Application.Controllers.controller "ProjectsController", ["$scope", "$state", 'Project', 'machinesPromise', 'themesPromise', 'componentsPromise', 'paginationService', 'OpenlabProject', '$window', 'growl', '_t'
, ($scope, $state, Project, machinesPromise, themesPromise, componentsPromise, paginationService, OpenlabProject, $window, growl, _t) ->
Application.Controllers.controller "ProjectsController", ["$scope", "$state", 'Project', 'machinesPromise', 'themesPromise', 'componentsPromise', 'paginationService', 'OpenlabProject', '$window', 'growl', '_t', '$location', '$timeout'
, ($scope, $state, Project, machinesPromise, themesPromise, componentsPromise, paginationService, OpenlabProject, $window, growl, _t, $location, $timeout) ->
### PRIVATE STATIC CONSTANTS ###
@ -153,7 +153,7 @@ Application.Controllers.controller "ProjectsController", ["$scope", "$state", 'P
PROJECTS_PER_PAGE = 12
### PUBLIC SCOPE ###
$scope.search = { q: "", from: undefined, machine_id: undefined, component_id: undefined, theme_id: undefined }
$scope.search = { q: ($location.$$search.q || ""), from: ($location.$$search.from || undefined), machine_id: ($location.$$search.machine_id || undefined), component_id: ($location.$$search.component_id || undefined), theme_id: ($location.$$search.theme_id || undefined) }
## list of projects to display
$scope.projects = []
@ -169,7 +169,11 @@ Application.Controllers.controller "ProjectsController", ["$scope", "$state", 'P
$scope.openlab = {}
$scope.openlab.projectsActive = Fablab.openlabProjectsActive
$scope.openlab.searchOverWholeNetwork = $scope.openlab.projectsActive || false
if $location.$$search.whole_network is 'f'
$scope.openlab.searchOverWholeNetwork = false
else
$scope.openlab.searchOverWholeNetwork = $scope.openlab.projectsActive || false
normalizeProjectsAttrs = (projects)->
projects.map((project)->
@ -179,15 +183,16 @@ Application.Controllers.controller "ProjectsController", ["$scope", "$state", 'P
$scope.searchOverWholeNetworkChanged = ->
setTimeout ->
$scope.triggerSearch()
$scope.resetFiltersAndTriggerSearch()
, 150
loadMoreCallback = (projectsPromise)->
$scope.projects = $scope.projects.concat(projectsPromise.projects)
updateUrlParam('page', $scope.projectsPagination.currentPage)
loadMoreOpenlabCallback = (projectsPromise)->
$scope.projects = $scope.projects.concat(normalizeProjectsAttrs(projectsPromise.projects))
updateUrlParam('page', $scope.projectsPagination.currentPage)
$scope.loadMore = ->
if $scope.openlab.searchOverWholeNetwork is true
@ -196,18 +201,20 @@ Application.Controllers.controller "ProjectsController", ["$scope", "$state", 'P
$scope.projectsPagination.loadMore(search: $scope.search)
$scope.resetFilters = ->
$scope.resetFiltersAndTriggerSearch = ->
$scope.search.q = ""
$scope.search.from = undefined
$scope.search.machine_id = undefined
$scope.search.component_id = undefined
$scope.search.theme_id = undefined
$scope.setUrlQueryParams($scope.search)
$scope.triggerSearch()
$scope.triggerSearch = ->
currentPage = parseInt($location.$$search.page) || 1
if $scope.openlab.searchOverWholeNetwork is true
$scope.projectsPagination = new paginationService.Instance(OpenlabProject, 1, PROJECTS_PER_PAGE, null, { }, loadMoreOpenlabCallback)
OpenlabProject.query { q: $scope.search.q, page: 1, per_page: PROJECTS_PER_PAGE }, (projectsPromise)->
$scope.projectsPagination = new paginationService.Instance(OpenlabProject, currentPage, PROJECTS_PER_PAGE, null, { }, loadMoreOpenlabCallback)
OpenlabProject.query { q: $scope.search.q, page: currentPage, per_page: PROJECTS_PER_PAGE }, (projectsPromise)->
if projectsPromise.errors?
growl.error(_t('openlab_search_not_available_at_the_moment'))
$scope.openlab.searchOverWholeNetwork = false
@ -217,8 +224,9 @@ Application.Controllers.controller "ProjectsController", ["$scope", "$state", 'P
$scope.projects = normalizeProjectsAttrs(projectsPromise.projects)
else
$scope.projectsPagination = new paginationService.Instance(Project, 1, PROJECTS_PER_PAGE, null, { }, loadMoreCallback, 'search')
Project.search { search: $scope.search, page: 1, per_page: PROJECTS_PER_PAGE }, (projectsPromise)->
updateUrlParam('whole_network', 'f')
$scope.projectsPagination = new paginationService.Instance(Project, currentPage, PROJECTS_PER_PAGE, null, { }, loadMoreCallback, 'search')
Project.search { search: $scope.search, page: currentPage, per_page: PROJECTS_PER_PAGE }, (projectsPromise)->
$scope.projectsPagination.totalCount = projectsPromise.meta.total
$scope.projects = projectsPromise.projects
@ -234,6 +242,26 @@ Application.Controllers.controller "ProjectsController", ["$scope", "$state", 'P
else
$state.go('app.public.projects_show', {id: project.slug})
##
# function to set all url query search parameters from search object
##
$scope.setUrlQueryParams = (search)->
updateUrlParam('page', 1)
updateUrlParam('q', search.q)
updateUrlParam('from', search.from)
updateUrlParam('theme_id', search.theme_id)
updateUrlParam('component_id', search.component_id)
updateUrlParam('machine_id', search.machine_id)
##
# function to update url query param, little hack to turn off reloadOnSearch and re-enable it after setting the params
# params example: 'q' , 'presse-purée'
##
updateUrlParam = (name, value) ->
$state.current.reloadOnSearch = false
$location.search(name, value)
$timeout ->
$state.current.reloadOnSearch = undefined
## initialization
$scope.triggerSearch()

2
app/assets/javascripts/router.coffee.erb
View File

@ -219,7 +219,7 @@ angular.module('application.router', ['ui.router']).
# projects
.state 'app.public.projects_list',
url: '/projects'
url: '/projects?q&page&theme_id&component_id&machine_id&from&whole_network'
views:
'main@':
templateUrl: '<%= asset_path "projects/index.html" %>'

16
app/assets/templates/projects/index.html.erb
View File

@ -23,7 +23,7 @@
<section class="m-lg">
<div class="row m-b-md">
<div class="col-md-12"><h3 class="m-t-xs">{{ 'filter_projects' | translate }}
<a href="javascript:void(0);" class="text-sm pull-right" name="button" ng-click="resetFilters()" ng-show="!openlab.searchOverWholeNetwork"><i class="fa fa-refresh"></i> {{ 'reset_all_filters' | translate }}</a></h3>
<a href="javascript:void(0);" class="text-sm pull-right" name="button" ng-click="resetFiltersAndTriggerSearch()" ng-show="!openlab.searchOverWholeNetwork"><i class="fa fa-refresh"></i> {{ 'reset_all_filters' | translate }}</a></h3>
</div>
<div class="col-md-12 m-b">
<span ng-if="openlab.projectsActive">
@ -39,22 +39,21 @@
/>
{{ searchOverWholeNetwork }}
</span>
<form class="form-inline">
<form class="form-inline" role="form" ng-submit="setUrlQueryParams(search) && triggerSearch()">
<div class="form-group">
<div class="input-group">
<div class="input-group-addon"><i class="fa fa-search"></i></div>
<input type="search" class="form-control" placeholder="Mots-clés" ng-model="search.q"/>
<div class="input-group-btn">
<button ng-click="triggerSearch()" type="button" class="btn btn-warning" translate>{{ 'search' }}</button>
<button type="submit" class="btn btn-warning" translate>{{ 'search' }}</button>
</div>
</div>
</div>
</form>
</div>
<span ng-if="!openlab.searchOverWholeNetwork">
<div class="col-md-3 m-b" ng-show="isAuthenticated()">
<select ng-model="search.from" ng-change="triggerSearch()" class="form-control">
<select ng-model="search.from" ng-change="setUrlQueryParams(search) && triggerSearch()" class="form-control">
<option value="" translate>{{ 'all_projects' }}</option>
<option value="mine" translate>{{ 'my_projects' }}</option>
<option value="collaboration" translate>{{ 'projects_to_whom_i_take_part_in' }}</option>
@ -62,19 +61,19 @@
</div>
<div class="col-md-3 m-b">
<select ng-model="search.machine_id" ng-change="triggerSearch()" class="form-control" ng-options="m.id as m.name for m in machines">
<select ng-model="search.machine_id" ng-change="setUrlQueryParams(search) && triggerSearch()" class="form-control" ng-options="m.id as m.name for m in machines">
<option value="" translate>{{ 'all_machines' }}</option>
</select>
</div>
<div class="col-md-3 m-b">
<select ng-model="search.theme_id" ng-change="triggerSearch()" class="form-control" ng-options="t.id as t.name for t in themes">
<select ng-model="search.theme_id" ng-change="setUrlQueryParams(search) && triggerSearch()" class="form-control" ng-options="t.id as t.name for t in themes">
<option value="" translate>{{ 'all_themes' }}</option>
</select>
</div>
<div class="col-md-3 m-b">
<select ng-model="search.component_id" ng-change="triggerSearch()" class="form-control" ng-options="t.id as t.name for t in components">
<select ng-model="search.component_id" ng-change="setUrlQueryParams(search) && triggerSearch()" class="form-control" ng-options="t.id as t.name for t in components">
<option value="" translate>{{ 'all_materials' }}</option>
</select>
</div>
@ -83,6 +82,7 @@
<div class="row">
<span class="col-md-12" ng-show="projects && (projects.length == 0)"> {{ 'project_search_result_is_empty' | translate }} </span>
<div class="col-xs-12 col-sm-6 col-md-4" ng-repeat="project in projects" ng-click="showProject(project)">
<div class="box-thumb box-thumb-project" style="background-image: url({{project.project_image}});">

1
config/locales/app.public.en.yml
View File

@ -120,6 +120,7 @@ en:
the_fablab_projects: "The Fab Lab projects"
search_over_the_whole_network: "Search over the whole network"
openlab_search_not_available_at_the_moment: "Search over the whole network is not available at the moment. You still can search over the projects of this platform."
project_search_result_is_empty: "Sorry, we found no results matching your search criteria."
add_a_project: "Add a project"
filter_projects: "Filter projects:"
reset_all_filters: "Reset all filters"

1
config/locales/app.public.fr.yml
View File

@ -120,6 +120,7 @@ fr:
the_fablab_projects: "Les projets du FabLab"
search_over_the_whole_network: "Chercher sur tout le réseau"
openlab_search_not_available_at_the_moment: "La recherche sur tout le réseau n'est pas disponible pour le moment. Vous ne pouvez cependant effectuer une recherche parmis les projets de cette plateforme."
project_search_result_is_empty: "Il n'y a pas de projets correspondant à vos critères de recherche."
add_a_project: "Ajouter un projet"
filter_projects: "Filtrer les projets :"
reset_all_filters: "Réinitialiser tous les filtres"