1
0
mirror of https://github.com/LaCasemate/fab-manager.git synced 2024-12-01 12:24:28 +01:00

ui projects list

This commit is contained in:
cyril 2016-05-02 16:10:48 +02:00
parent 79b69f21ba
commit 7288834417
6 changed files with 100 additions and 24 deletions

View File

@ -150,7 +150,9 @@ Application.Controllers.controller "ProjectsController", ["$scope", "$state", 'P
### PRIVATE STATIC CONSTANTS ###
# Number of projects added to the page when the user clicks on 'load more projects'
PROJECTS_PER_PAGE = 12
PROJECTS_PER_PAGE = 16
$scope.openlabAppId = Fablab.openlabAppId
### PUBLIC SCOPE ###
$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) }
@ -230,7 +232,6 @@ Application.Controllers.controller "ProjectsController", ["$scope", "$state", 'P
$scope.projectsPagination.totalCount = projectsPromise.meta.total
$scope.projects = projectsPromise.projects
##
# Callback to switch the user's view to the detailled project page
# @param project {{slug:string}} The project to display

View File

@ -65,6 +65,76 @@
height: 100%;
}
.card {
position: relative;
display: block;
margin-bottom: .75rem;
background-color: #fff;
border: 1px solid #e5e5e5;
border-radius: .25rem;
height: 325px;
overflow: hidden;
margin-bottom: 3rem;
cursor: pointer;
.card-overlay {
margin: 1.25rem;
position: absolute;
cursor: pointer;
z-index: 2;
top: 0;
left: 0;
right: 0;
background-color: rgba(43,46,56,0.8);
text-align: center;
opacity: 0;
-webkit-transition: all 0.1s ease-out;
transition: all 0.1s ease-out;
height: 180px;
cursor: pointer;
.btn-group { margin-top: 70px;}
.btn {
background: rgba(255,255,255,0.1);
border: 1px solid #fff;
color: #fff;
}
}
&:hover {
.card-overlay {
opacity: 1;
}
}
.card-header {
width: 100%;
display: block;
padding: 1.25rem;
.card-header-bg {
background-size: cover;
background-repeat: no-repeat;
height: 180px;
}
}
.card-block {
padding: 1.25rem;
.card-title {
font-size: 1.6rem;
line-height: 2rem;
margin: 0;
text-align: center;
}
.card-meta {
font-size: 1.2rem;
margin: 0;
text-align: center
}
}
}
.box-thumb {
opacity: 0.9;
&:hover { opacity: 1;}

View File

@ -22,12 +22,11 @@
<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="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">
<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>
<span ng-if="openlab.projectsActive" uib-tooltip="{{ 'tooltip_openlab_projects_switch' | translate }}" tooltip-trigger="mouseenter">
<label for="searchOverWholeNetwork" class="control-label m-r" translate>{{ 'search_over_the_whole_network' }}</label>
<label for="searchOverWholeNetwork" class="control-label m-r text-sm" translate>{{ 'search_over_the_whole_network' }}</label>
<input bs-switch
ng-model="openlab.searchOverWholeNetwork"
type="checkbox"
@ -39,7 +38,7 @@
/>
{{ searchOverWholeNetwork }}
</span>
<form class="form-inline" role="form" ng-submit="setUrlQueryParams(search) && triggerSearch()">
<form class="form-inline m-t" 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>
@ -84,24 +83,32 @@
<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}});">
<img src="data:image/png;base64," data-src="holder.js/100%x100%/text:&#xf03e;/font:FontAwesome/icon" bs-holder ng-if="!project.project_image">
<div class="card card-project">
<div class="box-content project-caption">
<h1>{{project.name}}</h1>
<h3>{{ project.app_name }}</h3>
<div class="card-header">
<div class="card-header-bg" style="background-image: url({{project.project_image}});">
<img src="data:image/png;base64," data-src="holder.js/100%x100%/text:&#xf03e;/font:FontAwesome/icon" bs-holder ng-if="!project.project_image">
</div>
</div>
<div class="box-footer">
<div class="card-block">
<h3 class="card-meta" ng-if="openlab.searchOverWholeNetwork && project.app_id == openlabAppId"><i class="fa fa-tag"></i> {{ project.app_name }}</h3>
<h1 class="card-title">{{project.name}}</h1>
</div>
<div class="card-overlay">
<div class="btn-group">
<div class="btn btn-default" ui-sref="app.logged.projects_edit({id:project.id})" ng-if="isAuthorized('admin') && !openlab.searchOverWholeNetwork">
<i class="fa fa-edit"></i> {{ 'edit' | translate }}
</div>
<div class="btn btn-default" ng-click="showProject(project)">
<i class="fa fa-eye"></i> {{ 'consult' | translate }}
<i ng-class="{'fa fa-external-link' : (openlab.searchOverWholeNetwork && project.app_id != openlabAppId) }"></i> {{ 'consult' | translate }}
</div>
<div class="btn btn-default" ui-sref="app.logged.projects_edit({id:project.id})" ng-if="isAuthorized('admin') && !openlab.searchOverWholeNetwork">
<i class="fa fa-edit"></i>
</div>
</div>
</div>
</div>
</div>
</div>

View File

@ -50,4 +50,4 @@ UIB_DATE_FORMAT: 'dd/MM/yyyy'
OPENLAB_APP_SECRET:
OPENLAB_APP_ID:
OPENLAB_BASE_URI: 'https://openlab-projects.com'
OPENLAB_BASE_URI: 'https://openprojects.fab-manager.com'

View File

@ -118,12 +118,11 @@ en:
projects_list:
# projects gallery
the_fablab_projects: "The Fab Lab projects"
search_over_the_whole_network: "Search over the whole network"
search_over_the_whole_network: "Search over the whole Fab Manager network"
tooltip_openlab_projects_switch: "The search over the whole network lets you search over the projects of every Fab-manager using this feature !"
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"
search: "Search"
all_projects: "All projects"
@ -132,7 +131,7 @@ en:
all_machines: "All machines"
all_themes: "All themes"
all_materials: "All materials"
load_next_projects: "Load next projects..."
load_next_projects: "Load next projects"
projects_show:
# details of a projet

View File

@ -118,12 +118,11 @@ fr:
projects_list:
# galerie des projets
the_fablab_projects: "Les projets du FabLab"
search_over_the_whole_network: "Chercher sur tout le réseau"
search_over_the_whole_network: "Chercher sur tout le réseau Fab Manager"
tooltip_openlab_projects_switch: "La recherche sur tout le réseau vous permet de rechercher parmis les projets de tous les Fab-managers utilisant cette fonctionnalité !"
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"
search: "Rechercher"
all_projects: "Tous les projets"
@ -132,7 +131,7 @@ fr:
all_machines: "Toutes les machines"
all_themes: "Toutes les thématiques"
all_materials: "Tous les matériaux"
load_next_projects: "Charger les projets suivants ..."
load_next_projects: "Charger les projets suivants"
projects_show:
# détails d'un projet