Issue #939, added directive to change popover placement

sails/src/assets/scripts/directives/directives.js

@@ -4,7 +4,7 @@ var dashboardDirectives = angular.module('dashboardDirectives', ['dashboardConfi
 
 /*-------------------------------------------------------------------------------
   Pictogram follows a Hierarchical MVC pattern (the old PAC pattern)
-  We have a main controller (see main.js) and then others that are associated to 
+  We have a main controller (see main.js) and then others that are associated to
   different headers (by means of AngularJS directives)
   Here we are just defining those directives
 */
@@ -70,9 +70,9 @@ dashboardDirectives.directive('draggable', function() {
   return function(scope, element) {
     // this gives us the native JS object
     var el = element[0];
-    
+
     el.draggable = true;
-    
+
     el.addEventListener(
       'dragstart',
       function(e) {
@@ -83,7 +83,7 @@ dashboardDirectives.directive('draggable', function() {
       },
       false
     );
-    
+
     el.addEventListener(
       'dragend',
       function(e) {
@@ -104,7 +104,7 @@ dashboardDirectives.directive('droppable', function() {
     link: function(scope, element) {
       // again we need the native object
       var el = element[0];
-      
+
       el.addEventListener(
         'dragover',
         function(e) {
@@ -116,7 +116,7 @@ dashboardDirectives.directive('droppable', function() {
         },
         false
       );
-      
+
       el.addEventListener(
         'dragenter',
         function(e) {
@@ -125,7 +125,7 @@ dashboardDirectives.directive('droppable', function() {
         },
         false
       );
-      
+
       el.addEventListener(
         'dragleave',
         function(e) {
@@ -134,20 +134,20 @@ dashboardDirectives.directive('droppable', function() {
         },
         false
       );
-      
+
       el.addEventListener(
         'drop',
         function(e) {
           e.preventDefault(); // Added to avoid openning the picto image
           // Stops some browsers from redirecting.
           if (e.stopPropagation) e.stopPropagation();
-          
+
           this.classList.remove('over');
-          
+
           var destination = this.id;
           var origin = e.dataTransfer.getData('Text');
 
-          // ERASE this 2 lines and move in other directive 
+          // ERASE this 2 lines and move in other directive
           // One for drop in general view and other to drop in add pictos view
           //var item = document.getElementById(origin);
           //this.appendChild(item);
@@ -155,11 +155,11 @@ dashboardDirectives.directive('droppable', function() {
           // call the passed drop function
           scope.$apply(function(scope) {
             var fn = scope.drop();
-            if ('undefined' !== typeof fn) {            
+            if ('undefined' !== typeof fn) {
               fn(origin, destination);
             }
           });
-          
+
           return false;
         },
         false
@@ -178,7 +178,7 @@ dashboardDirectives.directive('droppableadd', function() {
     link: function(scope, element) {
       // again we need the native object
       var el = element[0];
-      
+
       el.addEventListener(
         'dragover',
         function(e) {
@@ -190,7 +190,7 @@ dashboardDirectives.directive('droppableadd', function() {
         },
         false
       );
-      
+
       el.addEventListener(
         'dragenter',
         function(e) {
@@ -199,7 +199,7 @@ dashboardDirectives.directive('droppableadd', function() {
         },
         false
       );
-      
+
       el.addEventListener(
         'dragleave',
         function(e) {
@@ -208,31 +208,46 @@ dashboardDirectives.directive('droppableadd', function() {
         },
         false
       );
-      
+
       el.addEventListener(
         'drop',
         function(e) {
           e.preventDefault(); // Added to avoid openning the picto image
           // Stops some browsers from redirecting.
           if (e.stopPropagation) e.stopPropagation();
-          
+
           this.classList.remove('over');
-          
+
           var destination = this.id;
           var origin = e.dataTransfer.getData('Text');
-         
+
           // call the passed drop function
           scope.$apply(function(scope) {
             var fn = scope.drop();
-            if ('undefined' !== typeof fn) {            
+            if ('undefined' !== typeof fn) {
               fn(origin, destination);
             }
           });
-          
+
           return false;
         },
         false
       );
     }
   }
-});
\ No newline at end of file
+});
+dashboardDirectives.directive('popoveraddpicto', function() {
+  var y=99999;
+  return {
+    restrict: 'A',
+    link: function (scope, element, attrs) {
+
+      if(element[0].y <= y){
+        y=element[0].y;
+        attrs.popoverPlacement="bottom";
+      }
+      console.log(element[0].y);
+      console.log(angular.element( document.querySelector( '#collections' ) ));
+      }
+    }
+});

sails/src/assets/scripts/modules/student/views/addpicto.html

@@ -82,7 +82,7 @@
         <div id="clearfix-infiniteScroll-parent" infinite-scroll="scroll()" infinite-scroll-container="'#collections'">
 
           <div class="picto_peq pull-left" ng-repeat="p in pictos" >
-            <img ng-src="{{p.uri}}" popover="{{p.expressions[0].text}}" popover-trigger="mouseenter" style="z-index:9000"/>
+            <img ng-src="{{p.uri}}" popover="{{p.expressions[0].text}}" popover-trigger="mouseenter" popover-placement="top" style="z-index:9000" popoveraddpicto/>
             <!-- Options to remove picto (Only for own pictos) -->
             <div class="picto_options">
               <a ng-click="remove_own_picto(p.id)" class="picto_remove" title="{{ 'delete' | translate }}" ng-show="source == 'ownpictos'">