Skip to content

yotta / pictogram

Go to a project
Commit 7a78c9d1 by Sebastián Collado Montañez
Options

methods interface done

parent feff5acb
Expand all
Inline Side-by-side
Showing with 128 additions and 86 deletions
sails/src/assets/app/i18n/en-gb.json
......@@ -164,7 +164,9 @@
"input_selection": "How to place a pictogram",
"instruction": "Instruction",
"instruction_begin": "Begin instruction",
"instruction_objetive": "Instruction objetive description",
"instruction_end": "End instruction",
"instruction_name": "Instruction name",
"instructions": "Instructions",
"instructions_sent": "Instructions have been sent to your email address. Please, check your inbox.",
"invalid_fields": "Invalid values. Please, check fields introduced.",
......@@ -214,6 +216,8 @@
"max_expression": "Expression must be a maximun of 11-12 characters.",
"max_licenses_reached": "Maximum number of licenses reached by the office",
"May": "May",
"method_description": "Method description",
"method_name": "Method name",
"method_name_duplicated": "Template '{{method_name}}' already exists",
"method_saved": "'{{method_name}}' saved as a new template",
"methods": "Methods",
......@@ -353,6 +357,8 @@
"setup": "Setup",
"sexo": "Sex",
"show": "Show",
"show_all": "Show all",
"show_less": "Show less details",
"size": "Size",
"small": "Small",
"small_picto": "Small pictograms",
......
sails/src/assets/app/i18n/es-es.json
......@@ -164,7 +164,9 @@
"input_selection": "Cómo colocar un pictograma",
"instruction": "Instrucción",
"instruction_begin": "Primer intento",
"instruction_objetive": "Descripción del objetivo de la instrucción",
"instruction_end": "Último intento",
"instruction_name": "Nombre de la instrucción",
"instructions": "Instrucciones",
"instructions_sent": "Se le han enviado instrucciones a su dirección de correo electrónico. Por favor, compruebe su buzón.",
"invalid_fields": "Valores inválidos. Compruebe los datos introducidos.",
......@@ -214,6 +216,8 @@
"max_expression": "La expresión debe tener un máximo de 11-12 caracteres.",
"max_licenses_reached": "Número de licencias máximo alcanzado por la oficina",
"May": "Mayo",
"method_description": "Descripción del método",
"method_name": "Nombre del método",
"method_name_duplicated": "La plantilla '{{method_name}}' ya existe",
"method_saved": "'{{method_name}}' guardado como nueva plantilla",
"methods": "Métodos",
......@@ -353,6 +357,8 @@
"setup": "Configuración",
"sexo": "Sexo",
"show": "Mostrar",
"show_all": "Ver todo",
"show_less": "Ver menos detalles",
"size": "Tamaño",
"small": "Pequeño",
"small_picto": "Pictogramas pequeños",
......
sails/src/assets/scripts/modules/student/controllers/instructions.js
......@@ -318,4 +318,13 @@ dashboardControllers.controller('StudentInstructionsCtrl', function StudentInstr
};
// End Modal window to view instruction details
//Display method
$scope.minimalMode = false;
$scope.enable_minimal = function(){
$scope.minimalMode = !$scope.minimalMode;
};
});
sails/src/assets/scripts/modules/student/views/instructiondetail.html
......@@ -25,15 +25,15 @@
<div class="form-group">
<label for="ins_begin" class="col-sm-2 control-label" translate>instruction_begin</label>
<div class="col-sm-10 padding8">
<span class="color_blue">{{ instruction.begin | date:"dd-MM-yyyy" }}</span>
<span class="color_blue">{{ instruction.begin | date:"dd-MM-yyyy" }}</span>
{{ instruction.begin | date:"HH:mm:ss" }}
</div>
</div>
<div class="form-group">
<label for="ins_end" class="col-sm-2 control-label" translate>instruction_end Último intento</label>
<label for="ins_end" class="col-sm-2 control-label" translate>instruction_end</label>
<div class="col-sm-10 padding8">
<span class="color_blue">{{ instruction.end | date:"dd-MM-yyyy" }}</span>
<span class="color_blue">{{ instruction.end | date:"dd-MM-yyyy" }}</span>
{{ instruction.end | date:"HH:mm:ss" }}
</div>
</div>
......@@ -41,22 +41,22 @@
<div class="form-group">
<label for="ins_status" class="col-sm-2 control-label" translate>state</label>
<div class="col-sm-10 padding8">
<span id="ins_status" class="pointer text_medium glyphicon" ng-class="{
'color_green': instruction.status == 'finished',
'glyphicon-check': instruction.status == 'finished',
'color_blue': instruction.status == 'started',
'glyphicon-edit': instruction.status == 'started',
'glyphicon-minus': instruction.status == null
<span id="ins_status" class="pointer text_medium glyphicon" ng-class="{
'color_green': instruction.status == 'finished',
'glyphicon-check': instruction.status == 'finished',
'color_blue': instruction.status == 'started',
'glyphicon-edit': instruction.status == 'started',
'glyphicon-minus': instruction.status == null
}" aria-hidden="true" popover="{{(instruction.status || 'nobegin') | translate}}" popover-trigger="mouseenter"></span>
</div>
</div>
</form>
</div>
<!-- End modal-body -->
<div class="modal-footer">
<button class="btn btn-primary" ng-click="close()" translate>close</button>
</div>
</div>
\ No newline at end of file
</div>
sails/src/assets/scripts/modules/supervisor/controllers/instructions.js
......@@ -158,4 +158,11 @@ dashboardControllers.controller('InstructionsCtrl', function InstructionsCtrl($s
});
};
//Display method
$scope.minimalMode = false;
$scope.enable_minimal = function(){
$scope.minimalMode = !$scope.minimalMode;
};
});
sails/src/assets/scripts/modules/supervisor/views/instructions.html
......@@ -4,55 +4,92 @@
<div class="panel-heading"><h3 class="panel-title" translate>own_instructions</h3></div>
<div class="panel-body">
<!-- Select to add new method -->
<div class="form-group">
<!-- Botón añadir método -->
<button ng-click="add_method()" class="btn btn-success btn-sm" popover="{{ 'add' | translate}}" popover-trigger="mouseenter">
<span class="glyphicon glyphicon-plus" aria-hidden="true"></span> <span translate>new_method</span>
</button>
<div class="row">
<div class="col-sm-6">
<!-- Select to add new method -->
<div class="form-group">
<!-- Botón añadir método -->
<button ng-click="add_method()" class="btn btn-success btn-sm" popover="{{ 'add' | translate }}" popover-trigger="mouseenter">
<span class="glyphicon glyphicon-plus" aria-hidden="true"></span> <span translate>new_method</span>
</button>
</div>
</div>
</div>
<!-- END select to add new method -->
<div class="col-sm-6 text-right" ng-if="!minimalMode">
<button class="btn btn-primary" ng-click="enable_minimal()"><i class="fa fa-eye-slash" aria-hidden="true"></i> Ver menos detalles</button>
</div>
<div class="col-sm-6 text-right" ng-if="minimalMode">
<button class="btn btn-primary" ng-click="enable_minimal()"><i class="fa fa-eye" aria-hidden="true"></i> Ver todo</button>
</div>
</div>
<!-- Method instructions -->
<div class="method" ng-repeat="m in methods">
<!-- Method header -->
<div class="method-header">
<div class="col-sm-6">
<input type="text" class="editable title" ng-model="m.name " ng-blur="update_method(m)"/>
<input type="text" class="editable lead" ng-model="m.name " ng-blur="update_method(m)"/>
</div>
<div class="col-sm-1 col-sm-offset-5 text-center">
<div class="options">
<a ng-click="delete_method(m)" popover="{{ 'delete' | translate }}" popover-trigger="mouseenter" style="text-decoration:none">
<span class="text_medium color_red glyphicon glyphicon-remove-circle options-button" aria-hidden="true"></span>
</a>
</div>
</div>
<div class="col-sm-6 text-right">
<a ng-click="delete_method(m)" popover="{{ 'delete' | translate}}" popover-trigger="mouseenter"><span class="text_medium delete color_red glyphicon glyphicon-remove-circle options-button" aria-hidden="true"></span></a>
</div>
</div>
<!--END Method header -->
<textarea class="editable" ng-model="m.description " placeholder="{{'description' | translate}}" ng-blur="update_method(m)"></textarea>
<!-- Tabla método -->
<table class="table_instructions table">
<tr>
<th translate>instruction</th>
<th translate>objetive</th>
<th></th>
</tr>
<tr ng-repeat="i in m.metainstructions">
<td><input class="editable" type="text" ng-model="i.name" ng-blur="update_instruction(i)" /></td>
<td><input class="elipsis editable" type="text" ng-model="i.objective" ng-blur="update_instruction(i)" /></td>
<td><a confirmed-click="delete_instruction(i);" ng-confirm-click="{{ 'confirmation' | translate}}" class="delete_instruction"><span class="text_medium delete color_red glyphicon glyphicon-remove-circle options-button" aria-hidden="true"></span></a></td>
</tr>
<!-- Method description -->
<div class="container-fluid" ng-if="!minimalMode">
<div class="instruction-data">
<textarea class="editable" ng-model="m.description " placeholder="{{'description' | translate }}" ng-blur="update_method(m)"></textarea>
</div>
</div>
<!--END Method description -->
<br ng-if="!minimalMode">
<!-- Instructions table -->
<table class="table">
<thead class="thead-default">
<tr>
<th class="text-center" translate>instructions</th>
<th></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="i in m.metainstructions">
<td>
<dl>
<dt translate>instruction</dt>
<dd><div class="instruction-data"><input class="editable" type="text" ng-model="i.name" ng-blur="update_instruction(i)" placeholder="{{ 'instruction_name' | translate }}"></div></dd>
<dt ng-if="!minimalMode" translate>objetive</dt>
<dd ng-if="!minimalMode"><div class="instruction-data"><textarea class="elipsis editable" type="text" ng-model="i.objective" ng-blur="update_instruction(i)" rows="3" placeholder="{{ 'instruction_objetive' | translate }}"></textarea></div></dd>
</dl>
</td>
<td>
<a confirmed-click="delete_instruction(i);" ng-confirm-click="{{ 'confirmation' | translate}}" class="delete_instruction" popover="{{ 'delete' | translate }}" popover-trigger="mouseenter" style="text-decoration:none">
<span class="text_medium color_red glyphicon glyphicon-remove-circle options-button" aria-hidden="true"></span>
</a>
</td>
</tr>
</tbody>
</table>
<!-- Añadir instrucción al método -->
<p class="text-right">
<a ng-click="add_instruction(m)" class="add_instruction btn btn-success btn-sm" role="button">
<span class="glyphicon glyphicon-plus" aria-hidden="true"></span> {{ 'add_instruction' | translate }}
</a>
</p>
<div class="container-fluid text-right" ng-if="!minimalMode">
<p>
<a ng-click="add_instruction(m)" class="add_instruction btn btn-success btn-sm" role="button">
<span class="glyphicon glyphicon-plus" aria-hidden="true"></span> {{ 'add_instruction' | translate }}
</a>
</p>
</div>
</div>
<!-- Fin de .method -->
</div>
<!-- END .panel-body -->
</div>
......
sails/src/assets/styles/main.css
......@@ -257,14 +257,20 @@ tr:hover .ops a{
/* Panel Instrucciones */
#method_select{
max-width: 300px;
display: inline-block;
padding-top: 2px;
}
.method-header {
background-color: #F5F5F3;
padding: 5px;
min-height: 45px;
height: 52px;
margin-bottom: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
border-bottom: 1px solid #DDDDDD;
border-bottom: 3px solid #DDDDDD;
}
.method {
......@@ -273,14 +279,16 @@ tr:hover .ops a{
border: 1px solid #DDDDDD;
}
#method_select{
max-width: 300px;
display: inline-block;
padding-top: 2px;
.thead-default {
background-color: #f5f5f3;
}
.instruction-data {
width: 700px;
}
.options {
padding-top: 7px;
padding-top: 10px;
}
.options-button{
......@@ -294,10 +302,6 @@ tr:hover .ops a{
font-size: 20px;
}
.editable_status{
text-align: center;
}
.date_span{
display: inline-block;
width: 40px;
......@@ -306,57 +310,31 @@ tr:hover .ops a{
}
/* Celdas con input para editar */
td.editable{
padding: 0px !important;
height: 40px;
}
td.editable input{
width: 100%;
height: 100%;
border: none;
background: none;
padding: 0 6px;
}
.elipsis{
overflow: hidden;
text-overflow: ellipsis;
}
input.editable{
/*min-width: 400px;*/
.editable{
border: 1px solid #f5f5f3;
border-radius: 5px;
background: transparent;
width: 100%;
border: none;
background: none;
padding: 6px;
}
.editable:focus {
border-width: 0px;
border-style: solid;
border-radius: 5px;
outline: none;
border-color: #9ecaed;
box-shadow: 0 0 10px #9ecaed;
}
.editable:hover {
border-width: 0px;
border-style: solid;
border-radius: 5px;
outline: none;
border-color: #9ecaed;
box-shadow: 0 0 10px #9ecaed;
}
textarea.editable{
display: block;
min-width: 600px;
border:none;
background: none;
padding: 6px;
margin-bottom: 8px;
max-width: 100%;
}
/* Panel Colecciones */
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment