--- a/client/app/app.css Fri May 29 13:38:24 2015 +0200
+++ b/client/app/app.css Tue Jun 02 09:46:30 2015 +0200
@@ -3,11 +3,12 @@
}
.ammico-content {
- min-height: 500px;
+ max-width: 1170px;
+ min-width: 970px;
}
-/*
-.ng-scope{
- border: red 1px solid;
-}
-*/
+@media(max-width:991px){
+ .navbar > .container{
+ width: 100%;
+ }
+}
\ No newline at end of file
--- a/client/app/books/book.css Fri May 29 13:38:24 2015 +0200
+++ b/client/app/books/book.css Tue Jun 02 09:46:30 2015 +0200
@@ -1,9 +1,13 @@
+.gallery{
+ padding:0;
+}
+
.gallery .item {
position:relative;
- height: 206px;
- width: 19%;
+ height: 200px;
+ width: 18%;
padding: 0;
- margin: 5px;
+ margin: 1%;
border: 1px solid #cdcdcd;
overflow: hidden;
}
--- a/client/app/books/book.html Fri May 29 13:38:24 2015 +0200
+++ b/client/app/books/book.html Tue Jun 02 09:46:30 2015 +0200
@@ -9,7 +9,7 @@
<p class="nbrObjects">{{book.slides.length}} objets</p>
- <ul ui-sortable="sortableOptions" ng-model="book.slides" class="list-unstyled list-inline container-fluid gallery ">
+ <ul ui-sortable="sortableOptions" ng-model="book.slides" class="list-inline container-fluid gallery ">
<li class="item" ng-class="{'no-img': !slide.details.images[0]}" ng-repeat="slide in book.slides">
<ng-include src="'books/galleryItem.html'"></ng-include>
--- a/client/app/books/books.html Fri May 29 13:38:24 2015 +0200
+++ b/client/app/books/books.html Tue Jun 02 09:46:30 2015 +0200
@@ -20,7 +20,7 @@
<a class="pull-right" ng-click="deleteItem(childBook)"><span class="glyphicon glyphicon-minus"></span></a>
</div>
- <ul ng:model="slides" class="list-unstyled list-inline gallery container-fluid">
+ <ul ng:model="slides" class="list-inline gallery container-fluid">
<li class="item" ng-class="{'no-img': !slide.details.images[0]}" ng-repeat="slide in book.slides">
<ng-include src="'books/galleryItem.html'"></ng-include>
</li>
--- a/client/app/components/app_service.js Fri May 29 13:38:24 2015 +0200
+++ b/client/app/components/app_service.js Tue Jun 02 09:46:30 2015 +0200
@@ -44,7 +44,6 @@
data.details.video = $sce.trustAsResourceUrl(data.details.video);
data.audio = $sce.trustAsResourceUrl(data.audio);
data.video = $sce.trustAsResourceUrl(data.video);
- console.log(data);
return data;
};
})
--- a/client/app/index.html Fri May 29 13:38:24 2015 +0200
+++ b/client/app/index.html Tue Jun 02 09:46:30 2015 +0200
@@ -16,14 +16,14 @@
<body ng-controller="homeCtrl" ng-app="ammico" ng-cloak>
<div class="navbar navbar-inverse" role="navigation">
<div class="container">
- <div class="navbar-header">
+ <div class="navbar-header row">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
- <a class="navbar-brand" id="logo" href="#/">
+ <a class="navbar-brand row" id="logo" href="#/">
<!-- build:imgLogo -->
<img src="img/ammico_logo_small.png">
<!-- endbuild -->
@@ -41,26 +41,26 @@
<li ng-show="globals.userLogged"><a href="#/auth/logout">Logout</a></li>
</ul>
<form class="navbar-form navbar-right" role="search" ng-submit="searchSubmit()">
- <div class="form-group">
+ <div class="form-group has-feedback">
<input class="form-control" type="text" ng-model="q" placeholder="Chercher" />
- <button class="btn btn-default" type="submit"><span class="glyphicon glyphicon-search"></span></button>
+ <span class="glyphicon glyphicon-search form-control-feedback" aria-hidden="true"></span>
</div>
</form>
</div>
</div>
</div>
- <div class="container ammico-content">
+ <div class="container-fluid ammico-content">
<div ng-view></div>
<footer>
<div class="row">
- <div class="footer-img col-md-6">
+ <div class="footer-img col-sm-6">
<a href="http://www.iri.centrepompidou.fr" target="_blank">
<!-- build:imgFooter -->
<img src="img/logo_IRI_footer.png" alt="Logo IRI" />
<!-- endbuild -->
</a>
</div>
- <div class="col-md-6 text-right">
+ <div class="col-sm-6 text-right">
ammico vBeta - ©2014
</div>
</div>
--- a/client/app/slides/slides.css Fri May 29 13:38:24 2015 +0200
+++ b/client/app/slides/slides.css Tue Jun 02 09:46:30 2015 +0200
@@ -11,7 +11,7 @@
.slide-nav{
padding:10px 0;
display: inline-block;
- width: 100%;
+ width: 101%;
}
.slide-content{
@@ -40,7 +40,7 @@
box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.60);
}
-.caption {
+.slide .caption {
color: #000;
position: static;
text-shadow: none;
@@ -57,6 +57,10 @@
font-style: italic;
}
+.caption .details{
+ background-color: #F2F2F2;
+}
+
.user-details textarea.form-control {
height: 140px;
margin: 10px 0;
@@ -79,14 +83,14 @@
float:right;
margin: 0 10px;
}
-.user-details p,
-.user-details h4{
+.slide .user-details p,
+.slide .user-details h4{
border: 1px solid #ededed;
min-height: 21px;
padding: 6px 12px;
border-radius: 4px;
}
-.user-details p.description{
+.slide .user-details p.description{
min-height: 140px;
}
\ No newline at end of file
--- a/client/app/slides/slides.html Fri May 29 13:38:24 2015 +0200
+++ b/client/app/slides/slides.html Tue Jun 02 09:46:30 2015 +0200
@@ -8,7 +8,7 @@
<a id="previous" href="#">«Precedents</a>
</div>
<div class="container slide-content">
- <div class="col-md-7 media">
+ <div class="col-md-8 media">
<figure ng-if="slide.details.images && !slide.details.video" ng-repeat="image in slide.details.images">
<img ng-src="{{image}}" style="margin: auto;">
<figcaption>{{slide.details.captions[$index]}}</figcaption>
@@ -16,7 +16,7 @@
<audio ng-if="slide.details.audio" ng-src="{{ slide.details.audio }}" style="margin: auto; controls loop"></audio>
<video ng-if="slide.details.video" ng-src="{{ slide.details.video }}" style="margin: auto;" controls></video>
</div>
- <div class="col-md-5 caption">
+ <div class="col-md-4 caption">
<slide-editor index="{{$index}}"></slide-editor>
<hr />
<div class="details">
--- a/client/app/slideshow/slideshow.css Fri May 29 13:38:24 2015 +0200
+++ b/client/app/slideshow/slideshow.css Tue Jun 02 09:46:30 2015 +0200
@@ -1,6 +1,50 @@
.slideshow{
margin-top:-20px;
}
+
+/* .slide-title{ */
+/* display: block; */
+
+/* } */
+.slideshow-content{
+ margin-bottom : 15px;
+ height: 465px;
+}
+
+.slideshow-content .media{
+ border: 1px solid #a8a8a8;
+}
+
+.slideshow-content .caption{
+ border-top: 1px solid #a8a8a8;
+ color: #000;
+ position: static;
+ text-shadow: none;
+ text-align: left;
+ overflow: scroll;
+ height: 100%
+}
+}
+.slideshow-title .book{
+ font-size: 15px;
+}
+.slideshow-title h1 {
+ display: inline-block;
+ padding:0 15px;
+}
+.slideshow-title p{
+ display: inline-block;
+ margin-top: 20px;
+ margin-bottom: 10px;
+ text-align: right;
+}
+.slideshow-title .author{
+ font-size: 15px;
+}
+.slideshow-title .count{
+ font-size: 15px;
+}
+
.carousel-caption {
color: #000;
position: static;
@@ -13,38 +57,42 @@
}
.carousel-control {
- width: 3%;
-}
-
-.carousel-control .icon-next, .carousel-control .glyphicon-chevron-right {
- right: 2%;
+ width: 0;
+ cursor: pointer;
+ color:#6e6e6e;
+ opacity:1;
}
-.carousel-holder img{
- max-height: 500px;
- max-width: 100%;
-}
-
-.original-text {
- font-style: italic;
+.insight{
+ overflow-x: auto;
+ white-space: nowrap;
+ height: 125px;
+ margin: 0 15px;
}
-textarea.form-control {
- height: 140px;
+.insight .item {
+ cursor: pointer;
+ display: inline-block;
+ position:relative;
+ height: 115px;
+ width: 13%;
+ padding: 0;
+ margin: 0 5px;
+ border: 1px solid #cdcdcd;
+ overflow: hidden;
}
-
-ul.insight{
- overflow-x: hidden;
- overflow-y: scroll;
- height: 170px;
+.insight .item img {
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ width: 101%;
+ height: auto;
+ -webkit-transform: translate(-50%,-50%);
+ -ms-transform: translate(-50%,-50%);
+ transform: translate(-50%,-50%);
}
-ul.insight li {
- display: block;
+.insight .item .img-landscape {
height: 100%;
-}
-
-ul.insight li img{
- height: 100%;
- width: 100%;
+ width: auto;
}
\ No newline at end of file
--- a/client/app/slideshow/slideshow.html Fri May 29 13:38:24 2015 +0200
+++ b/client/app/slideshow/slideshow.html Tue Jun 02 09:46:30 2015 +0200
@@ -1,45 +1,44 @@
-<div class="slideshow">
- <div class="slide-title">
- <h1>Diaporama - {{book.title}}</h1>
+<div class="slideshow container-fluid">
+ <div class="row slideshow-title">
+ <h1 class="book">
+ {{book.title}}
+ <small>par Jonathan Linvingston</small>
+ </h1>
+ <h1 class="pull-right poi"><small>{{book.count}} points d'intérêts</small></h1>
</div>
<div class="carousel-holder row">
<carousel>
- <slide ng-repeat="slide in slideshow" active="slide.active">
- <div class="container slide-content">
- <div class="col-md-7 media">
+ <slide ng-repeat="slide in slides" active="slide.active">
+ <div class="container-fluid slideshow-content">
+ <div class="col-sm-8 media">
<img ng-if="slide.details.images[0]" ng-src="{{ slide.details.images[0] }}" style="margin: auto;">
<audio ng-if="slide.details.audio" ng-src="{{ slide.details.audio }}" style="margin: auto; controls loop"></audio>
<video ng-if="slide.details.video" ng-src="{{ slide.details.video }}" style="margin: auto;" controls></video>
</div>
- <div class="col-md-5 caption">
+ <div class="col-sm-4 caption">
<div class="user-details">
- <h4>{{slide.title}}</h4>
+ <h1>{{slide.title}}</h1>
<p>{{slide.description}}</p>
- <p>{{slide.comment}}</p>
<p>
<em>{{slide.tags.join(', ')}}</em>
</p>
</div>
- <hr />
<div class="details">
<p>
<strong>Titre : </strong><small>{{slide.details.title}}</small>
</p>
<p>
- <strong>Description : </strong><small>{{slide.details.captionImg}}</small>
+ <strong>Description : </strong><small>{{slide.details.description}}</small>
</p>
</div>
</div>
</div>
</slide>
</carousel>
- <ul class="list-unstyled list-inline row insight" >
- <li class="col-md-2 item" ng-repeat="slide in slideshow">
- <div class="img-ctn" ng-click="showSlide($index)">
- <img class="img img-responsive image" ng-src="{{ slide.details.images[0] }}" />
- <p>{{ slide.details.title }}</p>
- </div>
- </li>
- </ul>
+ <div class="insight" >
+ <div class="item" ng-repeat="slide in slides" data-ng-click="slide.active = true">
+ <img ng-src="{{ slide.details.images[0] }}" my-customer />
+ </div>
+ </div>
</div>
</div>
--- a/client/app/slideshow/slideshow_controller.js Fri May 29 13:38:24 2015 +0200
+++ b/client/app/slideshow/slideshow_controller.js Tue Jun 02 09:46:30 2015 +0200
@@ -1,9 +1,9 @@
(function(){
'use strict';
- angular.module('ammicoSlideshow',['ngResource', 'ngRoute', 'ui.bootstrap'])
+ angular.module('ammicoSlideshow',['ngResource', 'ngRoute', 'ui.bootstrap', 'ngTouch'])
.controller('slideshowCtrl', function($scope, $routeParams, Slide, Book, Utils){
- $scope.slideshow = Slide.query({idBook:$routeParams.iSlide, format:'json'}, function(data){
+ $scope.slides = Slide.query({idBook:$routeParams.iSlide, format:'json'}, function(data){
data.forEach(function(slide){
slide = Utils.sanitizeUrls(slide);
});
--- a/client/bower.json Fri May 29 13:38:24 2015 +0200
+++ b/client/bower.json Tue Jun 02 09:46:30 2015 +0200
@@ -20,6 +20,7 @@
"angular-resource": "~1.3",
"angular-bootstrap": "~0.11.0",
"angular-ui-sortable": "~0.13.3",
- "bootstrap": "~ 3.3.4"
+ "bootstrap": "~ 3.3.4",
+ "angular-touch": "~1.4.0"
}
}