edit slide by url
authorcavaliet
Fri, 03 Oct 2014 16:15:50 +0200
changeset 4 28208a0ad8b9
parent 3 18a4c598ddee
child 5 c6ff29914983
edit slide by url
client/app/app.js
client/app/gallery/gallery.css
client/app/gallery/gallery.html
client/app/search/search.css
client/app/search/search.html
client/app/slideshow/dataEditor.html
client/app/slideshow/slideshow_controller.js
--- a/client/app/app.js	Fri Oct 03 12:41:56 2014 +0200
+++ b/client/app/app.js	Fri Oct 03 16:15:50 2014 +0200
@@ -16,10 +16,14 @@
           controller: 'slideshowCtrl',
           templateUrl: 'slideshow/slideshow.html'
       }).
-      /*when('/slideshow/:iSlide', {
+      when('/slideshow/:iSlide', {
           controller: 'slideshowCtrl',
           templateUrl: 'slideshow/slideshow.html'
-      }).*/
+      }).
+      when('/slideshow/edit/:iSlide', {
+          controller: 'slideshowCtrl',
+          templateUrl: 'slideshow/slideshow.html'
+      }).
       when('/slideshow/add/:searched', {
         controller: 'slideshowCtrl',
         templateUrl: 'slideshow/slideshow.html'
--- a/client/app/gallery/gallery.css	Fri Oct 03 12:41:56 2014 +0200
+++ b/client/app/gallery/gallery.css	Fri Oct 03 16:15:50 2014 +0200
@@ -11,14 +11,15 @@
 }
 
 .img-ctn p {
-    display: none;
-    position: absolute;
+    background-color: #ddd;
     bottom: -5px;
-    background-color: #DDD;
-    width: 100%;
+    display: none;
+    padding: 2px 5px;
+    position: absolute;
+    width: calc(100% - 22px);
 }
 
-.img-ctn:hover p {
+.img-ctn:hover p, .img-ctn:hover .gallery-buttons {
     display: block;
 }
 
@@ -26,6 +27,13 @@
     margin: 0 auto;
 }
 
+.gallery-buttons{
+	display: none;
+    position: absolute;
+    right: 10px;
+    top: 10px;
+}
+
 .subtitle {
     border-top: 1px solid #000;
     border-bottom: 1px dotted #000;
--- a/client/app/gallery/gallery.html	Fri Oct 03 12:41:56 2014 +0200
+++ b/client/app/gallery/gallery.html	Fri Oct 03 16:15:50 2014 +0200
@@ -6,6 +6,8 @@
     <div class="img-ctn">
         <img class="img img-responsive image" src="{{ i.url }}" />
         <p>{{ i.title }}</p>
+        <div class="gallery-buttons"><a class="btn btn-default" href="#/slideshow/edit/{{ $index }}"><span class="glyphicon glyphicon-pencil"></span></a>
+          <a class="btn btn-default" href="#/slideshow/{{ $index }}"><span class="glyphicon glyphicon-eye-open"></span></a></div>
     </div>
   </li>
 </ul>
--- a/client/app/search/search.css	Fri Oct 03 12:41:56 2014 +0200
+++ b/client/app/search/search.css	Fri Oct 03 16:15:50 2014 +0200
@@ -1,14 +1,14 @@
-.item {
+.search-item {
   min-height: 250px;
   border-bottom: 1px solid #000;
 }
-.item:not(:first-child){
+.search-item:not(:first-child){
   padding-top: 10px;
 }
-.item img {
+.search-item img {
   max-height: 230px;
 }
-.item p, .item a.btn {
+.search-item p, .search-item a.btn {
     margin: 0 0 5px;
 }
 
--- a/client/app/search/search.html	Fri Oct 03 12:41:56 2014 +0200
+++ b/client/app/search/search.html	Fri Oct 03 16:15:50 2014 +0200
@@ -1,7 +1,7 @@
 <h1>Recherche <span ng-if="q !='' "> : {{ q }}</span></h1>
 <h4 class="subtitle" ng-if="results.nhits>0">{{ results.nhits }} résultat(s)</h4>
 <div ng-if="results.nhits>0">
-  <div class="row item" ng-repeat="h in results.hits">
+  <div class="row search-item" ng-repeat="h in results.hits">
       <img class="col-md-3" src="{{ h.url }}"/>
       <div class="col-md-7">
 	      <p><strong>Nom&nbsp;:</strong> {{ h.metas|meta:"name" }}</p>
--- a/client/app/slideshow/dataEditor.html	Fri Oct 03 12:41:56 2014 +0200
+++ b/client/app/slideshow/dataEditor.html	Fri Oct 03 16:15:50 2014 +0200
@@ -1,11 +1,11 @@
 <div>
-<div ng-hide="editMode">
+<div ng-hide="slide.editMode">
   <h4>{{slide.user_title}}</h4>
   <p>{{slide.user_description}}</p>
   <p><em>{{slide.tags.join(', ')}}</em></p>
-  <p class="text-right"><button id="btn-search-annotations" class="btn" ng-click="editMode=true"><span class="glyphicon glyphicon-pencil"></span></button></p>
+  <p class="text-right"><button id="btn-search-annotations" class="btn" ng-click="slide.editMode=true"><span class="glyphicon glyphicon-pencil"></span></button></p>
 </div>
-<div ng-show="editMode">
+<div ng-show="slide.editMode">
   <input type="text" class="form-control" ng-model='slide.user_title'></input>
   <textarea class="form-control editor-textarea" ng-model='slide.user_description'></textarea>
   <input type="text" class="form-control" ng-model='slide.tags'></input>
--- a/client/app/slideshow/slideshow_controller.js	Fri Oct 03 12:41:56 2014 +0200
+++ b/client/app/slideshow/slideshow_controller.js	Fri Oct 03 16:15:50 2014 +0200
@@ -13,21 +13,15 @@
       console.log('slideshow 5',this);
       this.slideshow = $resource(context.urls.slideshowUrl);
     })
-    .service('slideshowModel', function(slideshowApi, context) {
+    .service('slideshowModel', function(slideshowApi) {
       console.log('slideshow 6',this);
-      if(typeof context.slideshow === 'undefined') {
-          console.log('slideshow 6-1');
-          this.slideshow = slideshowApi.slideshow.get();
-      }
-      else {
-          console.log('slideshow 6-2');
-          this.slideshow = new slideshowApi.slideshow(context.slideshow);
-      }
+      this.slideshow = slideshowApi.slideshow.get();
     })
     .controller('slideshowCtrl', function($scope, $filter, $location, $routeParams, $timeout, searchApi, slideshowModel){
-      console.log('slideshow 7', $filter, $routeParams, searchApi, slideshowModel);
+      console.log('slideshow 7', $location, $routeParams, searchApi, slideshowModel);
       $scope.slideshow = slideshowModel.slideshow;
       $scope.iSlide = parseInt($routeParams.iSlide) || 0;
+      console.log('$routeParams',$routeParams);
       if(typeof $routeParams.searched !== 'undefined'){
           var a = $routeParams.searched.split(',');
           var q = a[0], i = parseInt(a[1]);
@@ -49,6 +43,15 @@
               );
           }
       }
+      $timeout(function(){
+          if($scope.iSlide>=0 && $scope.iSlide<$scope.slideshow.images.length){
+              $scope.slideshow.images[$scope.iSlide].active = true;
+              var l = $location.path();
+              if(l.substr(0,16)==='/slideshow/edit/'){
+                  $scope.slideshow.images[$scope.iSlide].editMode = true;
+              }
+          }
+      }, 200);
 
       $scope.save = function(){
           console.log('8 call save POST',$scope.slideshow);
@@ -79,7 +82,17 @@
                   for (var i = $scope.slide.tags.length - 1; i >= 0; i--) {
                       $scope.slide.tags[i] = $scope.slide.tags[i].trim();
                   }
-                  $scope.editMode = false;
+                  $scope.slide.editMode = false;
+                  $scope.save();
+              };
+              $scope.editSlidesave = function(){
+                  if(typeof $scope.slide.tags === 'string'){
+                      $scope.slide.tags = $scope.slide.tags.split(',');
+                  }
+                  for (var i = $scope.slide.tags.length - 1; i >= 0; i--) {
+                      $scope.slide.tags[i] = $scope.slide.tags[i].trim();
+                  }
+                  $scope.slide.editMode = false;
                   $scope.save();
               };
           }