Luigi / foca-botonera-lateral

Download as
Browse Code ยป

Commit 26c496d71a93f16190b88f91f1a44d421bbcbfe7

Authored by Jose Pinto
1 parent b155399b40
Exists in master

boton pausar funcionando

Showing 3 changed files with 25 additions and 6 deletions   Show diff stats
src/js/controller.js
Diff comments   View file @ 26c496d
1 angular.module('focaBotoneraLateral') 1 angular.module('focaBotoneraLateral')
2 .controller('focaBotoneraLateralController', [ 2 .controller('focaBotoneraLateralController', [
3 '$scope', 3 '$scope',
4 '$location', 4 '$location',
5 '$window', 5 '$window',
6 'focaBotoneraLateralService', 6 'focaBotoneraLateralService',
7 function($scope, $location, $window, focaBotoneraLateralService) { 7 function($scope, $location, $window, focaBotoneraLateralService) {
8 8
9 $scope.botones = focaBotoneraLateralService.botones; 9 $scope.botones = focaBotoneraLateralService.botones;
10 10
11 $scope.pausar = function() {
12 focaBotoneraLateralService.setLSItem();
13 $location.path('/');
14 };
15
11 $scope.cambioUsoTeclado = function() { 16 $scope.cambioUsoTeclado = function() {
12 $scope.$parent.cambioUsoTeclado(); 17 $scope.$parent.cambioUsoTeclado();
13 }; 18 };
14 19
15 $scope.salir = function() { 20 $scope.salir = function() {
16 $location.path('/'); 21 $location.path('/');
17 }; 22 };
18 23
19 $scope.cancelar = function() { 24 $scope.cancelar = function() {
20 if($scope.botones.pathCancelar) { 25 if ($scope.botones.pathCancelar) {
21 $location.path($scope.botones.pathCancelar); 26 $location.path($scope.botones.pathCancelar);
22 }else { 27 } else {
23 $window.history.back(); 28 $window.history.back();
24 } 29 }
25 }; 30 };
26 }]); 31 }]);
27 32
1 angular.module('focaBotoneraLateral') 1 angular.module('focaBotoneraLateral')
2 .service('focaBotoneraLateralService', function() { 2 .service('focaBotoneraLateralService', ['$localStorage',
3 function($localStorage) {
3 4
4 this.botones = { 5 this.botones = {
5 teclado: true, 6 teclado: true,
6 salir: false, 7 salir: false,
7 cancelar: false, 8 cancelar: false,
8 pausar: false, 9 pausar: false,
9 guardar: false, 10 guardar: false,
10 guardando: false, 11 guardando: false,
11 funcionGuardar: undefined, 12 funcionGuardar: undefined,
12 pathCancelar: undefined, 13 pathCancelar: undefined,
13 custom: [] 14 custom: []
14 }; 15 };
15 16
17 this.pausarData = {
18 label: '',
19 val: ''
20 };
21
16 this.showTeclado = function(value) { 22 this.showTeclado = function(value) {
17 this.botones.teclado = value; 23 this.botones.teclado = value;
18 }; 24 };
19 this.showSalir = function(value) { 25 this.showSalir = function(value) {
20 this.botones.custom = []; 26 this.botones.custom = [];
21 this.botones.salir = value; 27 this.botones.salir = value;
22 }; 28 };
23 this.showPausar = function(value) { 29 this.showPausar = function(value) {
24 this.botones.custom = []; 30 this.botones.custom = [];
25 this.botones.pausar = value; 31 this.botones.pausar = value;
26 }; 32 };
33 this.setPausarData = function(obj) {
34 this.pausarData = obj;
35 };
27 this.showCancelar = function(value, path) { 36 this.showCancelar = function(value, path) {
28 this.botones.custom = []; 37 this.botones.custom = [];
29 this.botones.cancelar = value; 38 this.botones.cancelar = value;
30 this.botones.pathCancelar = (path) ? path : undefined; 39 this.botones.pathCancelar = (path) ? path : undefined;
31 }; 40 };
32 this.showGuardar = function(value, funcion) { 41 this.showGuardar = function(value, funcion) {
33 angular.element('#guardar').removeClass('guardado'); 42 angular.element('#guardar').removeClass('guardado');
34 this.botones.custom = []; 43 this.botones.custom = [];
35 this.botones.guardar = value; 44 this.botones.guardar = value;
36 if(value) this.botones.funcionGuardar = funcion; 45 if (value) this.botones.funcionGuardar = funcion;
37 }; 46 };
38 this.addCustomButton = function(title, funcion) { 47 this.addCustomButton = function(title, funcion) {
39 this.botones.custom.push({ 48 this.botones.custom.push({
40 title: title, 49 title: title,
41 funcion: funcion 50 funcion: funcion
42 }); 51 });
43 }; 52 };
44 this.startGuardar = function() { 53 this.startGuardar = function() {
45 this.botones.guardando = true; 54 this.botones.guardando = true;
46 }; 55 };
47 this.endGuardar = function(guardado) { 56 this.endGuardar = function(guardado) {
48 this.botones.guardando = false; 57 this.botones.guardando = false;
49 if(guardado) angular.element('#guardar').addClass('guardado'); 58 if (guardado) angular.element('#guardar').addClass('guardado');
59 };
60
61 this.setLSItem = function() {
62 $localStorage[this.pausarData.label] = JSON.stringify(this.pausarData.val);
50 }; 63 };
51 }); 64 }]);
52 65
src/views/botonera-lateral.html
Diff comments   View file @ 26c496d
1 <div class="container botonera-lateral"> 1 <div class="container botonera-lateral">
2 <div class="row"> 2 <div class="row">
3 <div class="col-auto my-2 col-2 offset-10 d-none d-md-flex" style="min-height: 176px"> 3 <div class="col-auto my-2 col-2 offset-10 d-none d-md-flex" style="min-height: 176px">
4 <div class="px-2 mt-auto"> 4 <div class="px-2 mt-auto">
5 <div class="container"> 5 <div class="container">
6 <div class="row"> 6 <div class="row">
7 <div 7 <div
8 ladda="botones.guardando" 8 ladda="botones.guardando"
9 data-spinner-size="30" 9 data-spinner-size="30"
10 data-spinner-color="#000000" 10 data-spinner-color="#000000"
11 class="mb-2 border border-dark rounded" 11 class="mb-2 border border-dark rounded"
12 > 12 >
13 <button 13 <button
14 id="guardar" 14 id="guardar"
15 ng-click="botones.funcionGuardar()" 15 ng-click="botones.funcionGuardar()"
16 ng-show="botones.guardar" 16 ng-show="botones.guardar"
17 ng-disabled="botones.guardando" 17 ng-disabled="botones.guardando"
18 type="button" 18 type="button"
19 title="Guardar" 19 title="Guardar"
20 class="btn btn-block"> 20 class="btn btn-block">
21 <strong>GUARDAR</strong> 21 <strong>GUARDAR</strong>
22 </button> 22 </button>
23 </div> 23 </div>
24 <button 24 <button
25 ng-click="pausar()"
25 ng-show="botones.pausar" 26 ng-show="botones.pausar"
26 type="button" 27 type="button"
27 title="Pausar" 28 title="Pausar"
28 class="btn btn-block border border-dark"> 29 class="btn btn-block border border-dark">
29 <strong>PAUSAR</strong> 30 <strong>PAUSAR</strong>
30 </button> 31 </button>
31 <button 32 <button
32 ng-click="cancelar()" 33 ng-click="cancelar()"
33 ng-show="botones.cancelar" 34 ng-show="botones.cancelar"
34 type="button" 35 type="button"
35 title="Cancelar" 36 title="Cancelar"
36 class="btn btn-block border border-dark"> 37 class="btn btn-block border border-dark">
37 <strong>CANCELAR</strong> 38 <strong>CANCELAR</strong>
38 </button> 39 </button>
39 <button 40 <button
40 ng-click="salir()" 41 ng-click="salir()"
41 ng-show="botones.salir" 42 ng-show="botones.salir"
42 type="button" 43 type="button"
43 title="Salir" 44 title="Salir"
44 class="btn btn-block border border-dark"> 45 class="btn btn-block border border-dark">
45 <strong>SALIR</strong> 46 <strong>SALIR</strong>
46 </button> 47 </button>
47 <button 48 <button
48 ng-repeat="boton in botones.custom" 49 ng-repeat="boton in botones.custom"
49 ng-click="boton.funcion()" 50 ng-click="boton.funcion()"
50 type="button" 51 type="button"
51 title="{{boton.title}}" 52 title="{{boton.title}}"
52 class="btn btn-block border border-dark"> 53 class="btn btn-block border border-dark">
53 <strong 54 <strong
54 class="text-uppercase" 55 class="text-uppercase"
55 ng-bind="boton.title"> 56 ng-bind="boton.title">
56 </strong> 57 </strong>
57 </button> 58 </button>
58 </div> 59 </div>
59 </div> 60 </div>
60 </div> 61 </div>
61 </div> 62 </div>
62 </div> 63 </div>
63 </div> 64 </div>
64 <div class="container botonera-lateral teclado" ng-show="botones.teclado"> 65 <div class="container botonera-lateral teclado" ng-show="botones.teclado">
65 <div class="row"> 66 <div class="row">
66 <div class="col-auto my-2 col-2 offset-10 d-none d-md-flex" style="min-height: 176px"> 67 <div class="col-auto my-2 col-2 offset-10 d-none d-md-flex" style="min-height: 176px">
67 <div class="px-2 mt-auto"> 68 <div class="px-2 mt-auto">
68 <div class="container"> 69 <div class="container">
69 <div class="row"> 70 <div class="row">
70 <div 71 <div
71 class="btn-group-toggle btn btn-block btn-default border border-dark" 72 class="btn-group-toggle btn btn-block btn-default border border-dark"
72 data-toggle="buttons" 73 data-toggle="buttons"
73 ng-click="cambioUsoTeclado()" 74 ng-click="cambioUsoTeclado()"
74 title="Activar/desactivar teclado"> 75 title="Activar/desactivar teclado">
75 <label 76 <label
76 class=" active boton-activar-teclado mb-0" 77 class=" active boton-activar-teclado mb-0"
77 ng-class="{'teclado-activar': usarTeclado}"> 78 ng-class="{'teclado-activar': usarTeclado}">
78 <input 79 <input
79 type="checkbox" 80 type="checkbox"
80 autocomplete="off" 81 autocomplete="off"
81 > 82 >
82 <strong>TECLADO</strong> 83 <strong>TECLADO</strong>
83 </label> 84 </label>
84 </div> 85 </div>
85 </div> 86 </div>
86 </div> 87 </div>
87 </div> 88 </div>
88 </div> 89 </div>
89 </div> 90 </div>
90 </div> 91 </div>
91 92