Mauricio Cattafi / wrapper-demo

Download as
Browse Code »

Commit bb50dfbc3e636c07bced5455ab0b2e7066a34b71

Authored by Nicolás Guarnieri
2 parents fdaadca10e 92013acec5
Exists in master and in 1 other branch develop

Merge remote-tracking branch 'upstream/master'

Showing 14 changed files   Show diff stats

501 KB | W: | H:

520 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

1.62 KB

1.44 KB
... ... @@ -7,6 +7,8 @@
7 7 <!--CSS-->
8 8 <link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
9 9 <link href="./node_modules/font-awesome/css/font-awesome.min.css" rel="stylesheet"/>
  10 + <link rel="stylesheet" href="node_modules/angular-ui-swiper/dist/angular-ui-swiper.css">
  11 + <link href="./node_modules/ladda/dist/ladda-themeless.min.css" rel="stylesheet">
10 12 <link href="css/general.css" rel="stylesheet"/>
11 13  
12 14 <!--VENDOR JS-->
... ... @@ -19,6 +21,10 @@
19 21 <script src="./node_modules/angular-on-screen-keyboard/dist/angular-on-screen-keyboard.min.js"></script>
20 22 <script src="./node_modules/angular-sanitize/angular-sanitize.min.js"></script>
21 23 <script src="./node_modules/angular-i18n/angular-locale_es-ar.js"></script>
  24 + <script src="./node_modules/angular-ui-swiper/dist/angular-ui-swiper.js"></script>
  25 + <script src="./node_modules/ladda/dist/spin.min.js"></script>
  26 + <script src="./node_modules/ladda/dist/ladda.min.js"></script>
  27 + <script src="./node_modules/angular-ladda/dist/angular-ladda.min.js"></script>
22 28  
23 29 <script src="./node_modules/foca-directivas/dist/foca-directivas.min.js"></script>
24 30 <script src="./node_modules/foca-botonera-principal/dist/foca-botonera-principal.min.js"></script>
... ... @@ -30,6 +36,7 @@
30 36 <script src="./node_modules/foca-login/dist/foca-login.min.js"></script>
31 37 <script src="./node_modules/foca-modal/dist/foca-modal.min.js"></script>
32 38 <script src="./node_modules/foca-modal-busqueda-productos/dist/foca-busqueda-productos.min.js"></script>
  39 + <script src="./node_modules/foca-modal-cotizacion/dist/foca-modal-cotizacion.min.js"></script>
33 40 <script src="./node_modules/foca-modal-flete/dist/foca-modal-flete.min.js"></script>
34 41 <script src="./node_modules/foca-modal-moneda/dist/foca-modal-moneda.min.js"></script>
35 42 <script src="./node_modules/foca-modal-precio-condiciones/dist/foca-modal-precio-condiciones.min.js"></script>
... ... @@ -41,6 +48,7 @@
41 48  
42 49 <!-- BUILD -->
43 50 <script src="./src/js/app.js"></script>
  51 + <script src="./src/js/controller.js"></script>
44 52 <script src="./src/etc/develop.js"></script>
45 53 <!-- /BUILD -->
46 54  
... ... @@ -50,13 +58,27 @@
50 58 </style>
51 59 <botonera-horizontal></botonera-horizontal>
52 60 <div ng-view class="container contenedor"></div>
53   - <div class="container contenedor-teclado">
54   - <div class="btn-group-toggle" data-toggle="buttons" ng-click="mostrarTeclado = !mostrarTeclado">
55   - <label class="btn btn-secondary active" ng-class="{'teclado-activar': mostrarTeclado}">
56   - <input type="checkbox" autocomplete="off"><i class="fa fa-keyboard-o fa-3x" aria-hidden="true"></i>
  61 + <div ng-controller="appWrapperDemoController" class="container">
  62 + <div
  63 + class="btn-group-toggle"
  64 + data-toggle="buttons"
  65 + ng-click="mostrarTeclado = !mostrarTeclado">
  66 + <label
  67 + class="btn btn-secondary active boton-activar-teclado"
  68 + ng-class="{'teclado-activar': mostrarTeclado}">
  69 + <input
  70 + type="checkbox"
  71 + autocomplete="off"
  72 + >
  73 + <i class="fa fa-keyboard-o fa-3x" aria-hidden="true"></i>
57 74 </label>
58 75 </div>
59   - <foca-teclado ng-show="mostrarTeclado" alfanumeric="true" numeric="true"></foca-teclado>
  76 + <foca-teclado
  77 + ng-show="mostrarTeclado && hasFocus"
  78 + alfanumeric="true"
  79 + numeric="true"
  80 + >
  81 + </foca-teclado>
60 82 </div>
61 83 </body>
62 84 </html>
... ... @@ -23,9 +23,11 @@
23 23 "angular": "^1.7.5",
24 24 "angular-cookies": "^1.7.5",
25 25 "angular-i18n": "^1.7.5",
  26 + "angular-ladda": "^0.4.3",
26 27 "angular-on-screen-keyboard": "git+https://github.com/ericf97/angular-on-screen-keyboard.git",
27 28 "angular-route": "^1.7.5",
28 29 "angular-sanitize": "^1.7.5",
  30 + "angular-ui-swiper": "^2.3.8",
29 31 "bootstrap": "^4.1.3",
30 32 "foca-abm-plazo-pago": "git+https://debo.suite.repo/modulos-npm/foca-abm-plazo-pago.git",
31 33 "foca-abm-precios-condiciones": "git+https://debo.suite.repo/modulos-npm/foca-abm-precios-condiciones.git",
... ... @@ -37,6 +39,7 @@
37 39 "foca-login": "git+https://debo.suite.repo/modulos-npm/foca-login.git",
38 40 "foca-modal": "git+https://debo.suite.repo/modulos-npm/foca-modal",
39 41 "foca-modal-busqueda-productos": "git+https://debo.suite.repo/modulos-npm/foca-modal-busqueda-productos",
  42 + "foca-modal-cotizacion": "git+https://debo.suite.repo/modulos-npm/foca-modal-cotizacion.git",
40 43 "foca-modal-domicilio": "git+https://debo.suite.repo/modulos-npm/foca-modal-domicilio.git",
41 44 "foca-modal-flete": "git+https://debo.suite.repo/modulos-npm/foca-modal-flete.git",
42 45 "foca-modal-moneda": "git+https://debo.suite.repo/modulos-npm/foca-modal-moneda.git",
... ... @@ -50,6 +53,7 @@
50 53 "gulp-htmlmin": "^5.0.1",
51 54 "gulp-uglify": "^3.0.1",
52 55 "jquery": "^3.3.1",
  56 + "ladda": "1.0.6",
53 57 "node-sass": "^4.9.4",
54 58 "uglify": "^0.1.5",
55 59 "ui-bootstrap4": "^3.0.5"
1 1 angular.module('appWrapperDemo', [
  2 + 'angular-ladda',
2 3 'ngCookies',
3 4 'ngRoute',
4 5 'ui.bootstrap',
  6 + 'ui.swiper',
5 7 'focaAbmPlazoPago',
6 8 'focaAbmPreciosCondiciones',
7 9 'focaAbmSectores',
... ... @@ -12,6 +14,7 @@ angular.module(&#39;appWrapperDemo&#39;, [
12 14 'focaDirectivas',
13 15 'focaLogin',
14 16 'focaModal',
  17 + 'focaModalCotizacion',
15 18 'focaModalFlete',
16 19 'focaModalMoneda',
17 20 'focaModalPrecioCondicion',
src/js/controller.js
Diff comments   View file @ bb50dfb
... ... @@ -0,0 +1,22 @@
  1 +angular.module('appWrapperDemo')
  2 + .controller('appWrapperDemoController', [
  3 + '$scope',
  4 + '$rootScope',
  5 + '$timeout',
  6 + function($scope, $rootScope, $timeout) {
  7 + $scope.hasFocus = false;
  8 + var estado;
  9 + $rootScope.$on('focus', function(event, data) {
  10 + estado = data;
  11 + if(!data) {
  12 + $timeout(function() {
  13 + if(!estado) {
  14 + $scope.hasFocus = data;
  15 + }
  16 + },200)
  17 + } else {
  18 + $scope.hasFocus = data;
  19 + }
  20 + });
  21 + }
  22 + ]);
src/sass/_botonera-principal.scss
Diff comments   View file @ bb50dfb
1 1 .botonera-principal {
2   - margin: 0;
3   - padding-left: 30px;
4   - padding-top: 30px;
5   - & menuitem {
  2 + menuitem {
6 3 display: inline-block;
7 4 height: 130px;
8 5 text-align: center;
9 6 width: 180px;
10 7 }
11   - & button {
  8 + button {
12 9 background-image: url('../img/botonera.png');
13 10 border-radius: 12px;
14 11 border-width: 0;
15 12 height: 90px;
16 13 position: relative;
17 14 width: 90px;
  15 + span {
  16 + left: 0;
  17 + position: absolute;
  18 + text-align: center;
  19 + top: 90px;
  20 + width: 100%;
  21 + font-size: 12px;
  22 + color: #777777;
  23 + }
18 24 }
19   - & span {
20   - left: 0;
21   - position: absolute;
22   - text-align: center;
23   - top: 90px;
24   - width: 100%;
25   - font-size: 12px;
26   - color: #777777;
  25 + &-menu {
  26 + padding-left: 90px;
  27 + }
  28 + &-logo {
  29 + width: 80%;
  30 + opacity: .8;
  31 + }
  32 + &-vacio {
  33 + & button {
  34 + background-position: -4380px 0;
  35 + &:hover {
  36 + background-position: -4380px -90px;
  37 + }
  38 + }
27 39 }
28 40 &-abrir-turno {
29 41 & button {
src/sass/_contenedor.scss
Diff comments   View file @ bb50dfb
... ... @@ -8,21 +8,7 @@ body {
8 8 min-width: 800px;
9 9 }
10 10  
11   -.contenedor-teclado {
12   - background-image: radial-gradient(circle at 50% 50%, #ebecf1, #abaec3);
13   - height: 300px;
14   -}
15   -
16 11 .grilla-articulo {
17 12 background-color: rgba(0, 0, 0, 0.8);
18 13 height: 430px;
19 14 }
20   -
21   -.crear-nota-pedido {
22   - form {
23   - margin-bottom: 0;
24   - }
25   - table {
26   - margin-bottom: 0;
27   - }
28   -}
src/sass/_crear-nota-pedido.scss
Diff comments   View file @ bb50dfb
... ... @@ -0,0 +1,7 @@
  1 +.crear-nota-pedido {
  2 + &-fecha {
  3 + input[type="date"]::-webkit-clear-button {
  4 + display: none;
  5 + }
  6 + }
  7 +}
src/sass/_swiper.scss
Diff comments   View file @ bb50dfb
... ... @@ -0,0 +1,12 @@
  1 +.swiper {
  2 + &-container {
  3 + height: 400px;
  4 + }
  5 + &-slide {
  6 + background: transparent;
  7 + height: 400px;
  8 + text-align: unset;
  9 + -webkit-align-items: unset;
  10 + align-items: unset;
  11 + }
  12 +}
src/sass/_teclado.scss
Diff comments   View file @ bb50dfb
... ... @@ -6,10 +6,11 @@
6 6 -moz-user-select: none;
7 7 -ms-user-select: none;
8 8 user-select: none;
9   - width: 70%;
  9 + width: 62%;
10 10 height: 60%;
11   - margin: auto;
12   - margin-top: -6%;
  11 + margin-left: 13%;
  12 + margin-top: -19%;
  13 + position: absolute;
13 14 table {
14 15 border-spacing: 10px;
15 16 border-collapse: separate;
... ... @@ -66,3 +67,8 @@
66 67 .teclado-activar {
67 68 background-color: #17d236;
68 69 }
  70 +.boton-activar-teclado {
  71 + margin-top: -10%;
  72 + position: absolute;
  73 + z-index: 100000;
  74 +}
src/sass/general.scss
Diff comments   View file @ bb50dfb
... ... @@ -10,3 +10,5 @@
10 10 @import 'tabla';
11 11 @import 'teclado';
12 12 @import 'tabla-articulos';
  13 +@import 'swiper';
  14 +@import 'crear-nota-pedido';