Lecto-escritura en dashboard

sails/src/api/models/StuPicto.js

@@ -90,8 +90,7 @@ module.exports = {
       highlight: false,
       color: null,
       expression: null,
-      legend: null,
-      legend_size: 'small'
+      legend: 'none'
     };
 
     if (typeof attributes === 'object') {
@@ -125,11 +124,13 @@ module.exports = {
       if (typeof validAttributes.expression !== 'string') {
         delete validAttributes.expression;
       }
-      if (typeof validAttributes.legend !== 'boolean') {
+      if (typeof validAttributes.legend !== 'string') {
         delete validAttributes.legend;
       }
-      if (!((/^(small|large)$/).test(validAttributes.legend_size))) {
-        delete validAttributes.legend_size;
+      if( validAttributes.legend !== 'none' &&
+          validAttributes.legend !== 'normal' &&
+          validAttributes.legend !== 'full'){
+        delete validAttributes.legend;
       }
       if (typeof validAttributes.highlight !== 'boolean') {
         delete validAttributes.highlight;

sails/src/assets/scripts/modules/student/controllers/pictoconfig.js

@@ -62,8 +62,10 @@ dashboardControllers.controller('PictoConfigCtrl', function ($scope, $modalInsta
     console.log("Atributos: " + JSON.stringify($scope.studentPicto.attributes));
 
     $http
-      .put(config.backend+'/stu/'+ $scope.stu.id + '/picto/' +
-        $scope.studentPicto.id, { 'attributes': $scope.studentPicto.attributes })
+      .put(config.backend+'/stu/'+ $scope.stu.id + '/picto/' + $scope.studentPicto.id,
+        {
+          'attributes': $scope.studentPicto.attributes
+        })
       .success(function(data, status, headers, config) {
         console.log("Properties updated");
 

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

@@ -37,7 +37,19 @@
             popover-trigger="mouseenter"
             ng-init="colIndex = $index"
             ng-repeat="studentPicto in studentPictoRow track by $index">
-            <div class="picto-description"> {{ studentData.attributes.legend?studentPicto.expression.text:'' }} </div>
+            <!-- picto-legend -->
+            <div
+              class="picto-legend-normal"
+              ng-if="studentPicto.attributes.legend == 'normal'">
+              {{ studentPicto.attributes.expression==null ? studentPicto.expression.text : studentPicto.attributes.expression }}
+
+            </div>
+            <div
+              class="picto-legend-full"
+              ng-if="studentPicto.attributes.legend == 'full'">
+              {{ studentPicto.attributes.expression==null ? studentPicto.expression.text : studentPicto.attributes.expression }}
+            </div>
+            <!-- /.picto-legend  -->
             <img
               src="/app/img/redcross.png"
               class="disabled"
@@ -111,7 +123,19 @@
             ng-init="colIndex = $index"
             popover="{{studentPicto.attributes.expression==null ? studentPicto.expression.text : studentPicto.attributes.expression}}"
             popover-trigger="mouseenter">
-            <div class="picto-description"> {{ studentData.attributes.legend?studentPicto.expression.text:'' }} </div>
+            <!-- picto-legend -->
+            <div
+              class="picto-legend-normal"
+              ng-if="studentPicto.attributes.legend == 'normal'">
+              {{ studentPicto.attributes.expression==null ? studentPicto.expression.text : studentPicto.attributes.expression }}
+
+            </div>
+            <div
+              class="picto-legend-full"
+              ng-if="studentPicto.attributes.legend == 'full'">
+              {{ studentPicto.attributes.expression==null ? studentPicto.expression.text : studentPicto.attributes.expression }}
+            </div>
+            <!-- /.picto-legend  -->
             <img
               src="/app/img/redcross.png"
               class="disabled"
@@ -171,7 +195,19 @@
             popover-trigger="mouseenter"
             ng-repeat="studentPicto in studentPictoRow track by $index"
             ng-init="colIndex = $index">
-            <div class="picto-description"> {{ studentData.attributes.legend?studentPicto.expression.text:'' }} </div>
+            <!-- picto-legend -->
+            <div
+              class="picto-legend-normal"
+              ng-if="studentPicto.attributes.legend == 'normal'">
+              {{ studentPicto.attributes.expression==null ? studentPicto.expression.text : studentPicto.attributes.expression }}
+
+            </div>
+            <div
+              class="picto-legend-full"
+              ng-if="studentPicto.attributes.legend == 'full'">
+              {{ studentPicto.attributes.expression==null ? studentPicto.expression.text : studentPicto.attributes.expression }}
+            </div>
+            <!-- /.picto-legend  -->
             <img
               src="/app/img/redcross.png"
               class="disabled"

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

@@ -6,10 +6,10 @@
         <h4 class="modal-title" id="myModalLabel" translate>pictogram_setup</h4>
     </div>
     <div class="modal-body">
-
       <ul class="list-group">
+
         <li class="list-group-item">
-          <p translate>expression</p>
+          <label translate>expression</label>
           <!-- Modificable sólo si es el propietario del picto -->
           <form ng-submit="isOwner ? change() : update_properties()">
             <div id="add_label" class="input-group">
@@ -22,6 +22,7 @@
             </div>
           </form>
         </li>
+
         <!--
         <li class="list-group-item">
           <div class="checkbox">
@@ -29,16 +30,25 @@
           </div>
         </li>
         -->
+
         <!-- <li class="list-group-item">
           <div class="checkbox">
             <label><input data-toggle="toggle" type="checkbox" ng-model="studentPicto.attributes.highlight" ng-change="update_properties()" translate> highlighted</label>
           </div>
         </li>
-      -->
-      <li class="list-group-item">
-        <div class="checkbox">
-          <input data-toggle="toggle" type="checkbox" ng-model="studentPicto.attributes.legend" ng-change="update_properties()"><label translate>legend</label> 
-        </div>
+        -->
+
+        <li class="list-group-item">
+          <label translate>legend</label>
+          <div class="checkbox">
+            <select class="form-control" data-toggle="toggle" ng-model="studentPicto.attributes.legend" ng-change="update_properties()">
+               <option value="none" selected>Sin leyenda</option>
+               <option value="normal">Leyenda normal</option>
+               <option value="full">Solo leyenda</option>
+            </select>
+          </div>
+        </li>
+
       </ul>
     </div>
     <!-- End modal-body -->

sails/src/assets/styles/main.css

@@ -456,8 +456,8 @@ textarea.editable{
 
 .picto .picto_options .picto_minus{ position: absolute; top: 2px; right: 2px; }
 
-/* Text above picto */
-.picto-description {
+/* Picto legend */
+.picto-legend-normal {
     position: absolute;
     bottom: 0px;
     text-align: center;
@@ -470,6 +470,22 @@ textarea.editable{
     font-size: 12px;
     word-wrap: break-word;
 }
+.picto-legend-full {
+	position: absolute;
+	bottom: 0px;
+	width: 100%;
+	height: 100%;
+	background-color: rgba(1, 1, 1, 0.5);
+	color: white;
+	margin-left: -2px;
+	font-weight: 600;
+	text-transform: uppercase;
+	font-size: 12px;
+	word-wrap: break-word;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
 
 /* In addpicto */
 #collections{