Skip to content

yotta / pictogram

Go to a project
Commit 57e77a10 by Jose Antonio
Options

Merge remote-tracking branch 'origin/develop' into develop

parents 72a00b47 9514118c
Inline Side-by-side
Showing with 106 additions and 84 deletions
sails/src/assets/scripts/modules/student/views/instructions.html
......@@ -2,17 +2,18 @@
<!-- Instrucction tab-->
<div class="panel panel-default student_tab_panel">
<div class="panel-body">
<!-- Select to add new method -->
<!-- Select to add new method -->
<div class="form-group">
<select class="form-control" name="method_select" id="method_select" ng-model="method_selected">
<option value="" translate>select_method</option>
<option ng-repeat="ma in methods_available track by $index"
ng-value="ma.id"
label="{{ ma.name }}"
ng-if="ma.lang == user.lang">
{{ ma.name }}
</option>
<option value="0" translate>new_method</option>
<option value="" translate>select_method</option>
<option ng-repeat="ma in methods_available track by $index"
ng-value="ma.id"
label="{{ ma.name }}"
ng-if="ma.lang == user.lang">
{{ ma.name }}
</option>
<option value="0" translate>new_method</option>
</select>
<!-- Botón añadir método -->
......@@ -25,75 +26,74 @@
<span class="glyphicon glyphicon-minus" aria-hidden="true"></span>
</button>
</div>
<!-- END select to add new method -->
<!-- Method instructions -->
<div class="method_details" ng-repeat="m in methods">
<input type="text" class="editable title" ng-model="m.name " ng-blur="update_method(m)"/>
<!-- END select to add new method -->
<div class="options">
<!-- Method instructions -->
<div class="method_details" ng-repeat="m in methods">
<a ng-click="save_as_template(m)" popover="{{ 'save_as_template' | translate}}" popover-trigger="mouseenter"><span class="text_medium color_black glyphicon glyphicon-floppy-disk" aria-hidden="true"></span></a>
<a ng-click="delete_method(m)" popover="{{ 'delete' | translate}}" popover-trigger="mouseenter"><span class="text_medium delete color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span></a>
</div>
<div class="method-header">
<input type="text" class="editable title" ng-model="m.name " ng-blur="update_method(m)"/>
<div class="method-header-options">
<a ng-click="save_as_template(m)" popover="{{ 'save_as_template' | translate}}" popover-trigger="mouseenter"><span class="text_medium color_black glyphicon glyphicon-floppy-disk options-button" aria-hidden="true"></span></a>
<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>
<textarea class="editable" ng-model="m.description " placeholder="{{'description' | translate}}" ng-blur="update_method(m)"></textarea>
<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></th>
<th translate>instruction</th>
<th translate>objetive</th>
<th class="text-center" translate>instruction_begin</th>
<th class="text-center" translate>instruction_end</th>
<th class="text-center" translate>state</th>
<th></th>
</tr>
<tr ng-repeat="i in m.instructions">
<td>
<a ng-click="open_instruction(i)"><span class="glyphicon glyphicon-file text_medium" aria-hidden="true"></span></a>
</td>
<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 class="editable">
<div class="text-center">
<span class="color_blue">{{ i.begin | date:"dd-MM-yyyy" }}</span>
<br />
{{ i.begin | date:"HH:mm:ss" }}
</div>
</td>
<td class="editable">
<div class="text-center" ng-class="{ color_green : i.id == m.last_ins }">
<span ng-class="{ color_green : i.id == m.last_ins, color_blue : i.id != m.last_ins }">{{ i.end | date:"dd-MM-yyyy" }}</span>
<br/>
{{ i.end | date:"HH:mm:ss" }}
</div>
</td>
<td class="editable_status">
<span class="pointer text_medium glyphicon" ng-class="{
'color_green': i.status == 'finished',
'glyphicon-check': i.status == 'finished',
'color_blue': i.status == 'started',
'glyphicon-edit': i.status == 'started',
'glyphicon-minus': i.status == null
}" aria-hidden="true" popover="{{(i.status || 'nobegin') | translate}}" popover-trigger="mouseenter" ng-click="change_status(i)"></span>
</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" aria-hidden="true"></span></a></td>
</tr>
</table>
<!-- Tabla método -->
<table class="table_instructions table">
<tr>
<th></th>
<th translate>instruction</th>
<th translate>objetive</th>
<th class="text-center" translate>instruction_begin</th>
<th class="text-center" translate>instruction_end</th>
<th class="text-center" translate>state</th>
<th></th>
</tr>
<tr ng-repeat="i in m.instructions">
<td>
<a ng-click="open_instruction(i)"><span class="glyphicon glyphicon-file text_medium" aria-hidden="true"></span></a>
</td>
<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 class="editable">
<div class="text-center">
<span class="color_blue">{{ i.begin | date:"dd-MM-yyyy" }}</span>
<br />
{{ i.begin | date:"HH:mm:ss" }}
</div>
</td>
<td class="editable">
<div class="text-center" ng-class="{ color_green : i.id == m.last_ins }">
<span ng-class="{ color_green : i.id == m.last_ins, color_blue : i.id != m.last_ins }">{{ i.end | date:"dd-MM-yyyy" }}</span>
<br/>
{{ i.end | date:"HH:mm:ss" }}
</div>
</td>
<td class="editable_status">
<span class="pointer text_medium glyphicon" ng-class="{
'color_green': i.status == 'finished',
'glyphicon-check': i.status == 'finished',
'color_blue': i.status == 'started',
'glyphicon-edit': i.status == 'started',
'glyphicon-minus': i.status == null
}" aria-hidden="true" popover="{{(i.status || 'nobegin') | translate}}" popover-trigger="mouseenter" ng-click="change_status(i)"></span>
</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>
</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>
<!-- Fin de .method_details -->
<!-- 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>
<!-- Fin de .method_details -->
</div>
......
sails/src/assets/styles/main.css
......@@ -256,20 +256,34 @@ tr:hover .ops a{
}
/* Panel Instrucciones */
.method-header {
background-color: #F5F5F3;
padding: 5px;
margin-bottom: 5px;
border: 1px solid #DDDDDD;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
.method_details {
margin-bottom: 30px;
}
#method_select{
max-width: 300px;
display: inline-block;
padding-top: 2px;
}
.table_instructions .delete,
.method_details .options{
visibility: hidden;
.method-header-options{
float: right;
}
.table_instructions tr:hover .delete,
.method_details:hover .options{
visibility: visible;
.options-button{
opacity: .2;
}
.options-button:hover{
opacity: 1;
}
.method_details input.title{
......@@ -302,25 +316,33 @@ td.editable input{
}
.elipsis{
overflow: hidden;
overflow: hidden;
text-overflow: ellipsis;
}
input.editable{
min-width: 400px;
border: 1px solid #fff;
border: none;
background: none;
padding: 6px;
}
.editable:focus {
border-width: 1px;
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;
border-color: #9ecaed;
box-shadow: 0 0 10px #9ecaed;
}
textarea.editable{
......
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