Luigi / wrapper-demo

Commit eb444b14fdc99b402c6e159c64ae4a767d578168

Authored by Pablo Marco del Pont 2018-10-30 17:31:36 -0300

Exists in master

- Agregué el componente swiper.

- Agregué imágenes izquierda, derecha y logo.
- Actualicé imagen de botonera.
- Modifiqué estilos de la botonera principal.

Showing 10 changed files with 42 additions and 13 deletions Show diff stats

img/botonera.png

Diff comments View file @ eb444b1

img/derecha.png

Diff comments View file @ eb444b1

1.62 KB

img/izquierda.png

Diff comments View file @ eb444b1

1.44 KB

img/logo.png

Diff comments View file @ eb444b1

143 KB

index.html

Diff comments View file @ eb444b1

 <html ng-app="appWrapperDemo">
     <head>
         <meta charset="UTF-8"/>
         <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
         <base href="./">
         <!--CSS-->
         <link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
         <link href="./node_modules/font-awesome/css/font-awesome.min.css" rel="stylesheet"/>
+        <link rel="stylesheet" href="node_modules/angular-ui-swiper/dist/angular-ui-swiper.css">
         <link href="css/general.css" rel="stylesheet"/>
         <!--VENDOR JS-->
         <script src="./node_modules/jquery/dist/jquery.min.js"></script>
         <script src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
         <script src="./node_modules/angular/angular.min.js"></script>
         <script src="./node_modules/angular-route/angular-route.min.js"></script>
         <script src="./node_modules/angular-cookies/angular-cookies.min.js"></script>
         <script src="./node_modules/ui-bootstrap4/dist/ui-bootstrap-tpls.js"></script>
         <script src="./node_modules/angular-on-screen-keyboard/dist/angular-on-screen-keyboard.min.js"></script>
         <script src="./node_modules/angular-sanitize/angular-sanitize.min.js"></script>
         <script src="./node_modules/angular-i18n/angular-locale_es-ar.js"></script>
+        <script src="./node_modules/angular-ui-swiper/dist/angular-ui-swiper.js"></script>
         <script src="./node_modules/foca-directivas/dist/foca-directivas.min.js"></script>
         <script src="./node_modules/foca-botonera-principal/dist/foca-botonera-principal.min.js"></script>
         <script src="./node_modules/foca-turno-apertura/dist/foca-turno-apertura.min.js"></script>
         <script src="./node_modules/foca-abm-plazo-pago/dist/foca-abm-plazo-pago.min.js"></script>
         <script src="./node_modules/foca-abm-precios-condiciones/dist/foca-abm-precios-condiciones.min.js"></script>
         <script src="./node_modules/foca-abm-sectores/dist/foca-abm-sectores.min.js"></script>
         <script src="./node_modules/foca-crear-nota-pedido/dist/foca-crear-nota-pedido.min.js"></script>
         <script src="./node_modules/foca-login/dist/foca-login.min.js"></script>
         <script src="./node_modules/foca-modal/dist/foca-modal.min.js"></script>
         <script src="./node_modules/foca-modal-busqueda-productos/dist/foca-busqueda-productos.min.js"></script>
         <script src="./node_modules/foca-modal-flete/dist/foca-modal-flete.min.js"></script>
         <script src="./node_modules/foca-modal-moneda/dist/foca-modal-moneda.min.js"></script>
         <script src="./node_modules/foca-modal-precio-condiciones/dist/foca-modal-precio-condiciones.min.js"></script>
         <script src="./node_modules/foca-modal-proveedor/dist/foca-modal-proveedor.min.js"></script>
         <script src="./node_modules/foca-modal-vendedores/dist/foca-modal-vendedores.min.js"></script>
         <script src="./node_modules/foca-busqueda-cliente/dist/foca-busqueda-cliente.min.js"></script>
         <script src="./node_modules/foca-teclado/dist/foca-teclado.min.js"></script>
         <script src="./node_modules/foca-modal-domicilio/dist/foca-modal-domicilios.min.js"></script>
         <!-- BUILD -->
         <script src="./src/js/app.js"></script>
         <script src="./src/etc/develop.js"></script>
         <!-- /BUILD -->
     </head>
     <body>
         <style>
         </style>
         <botonera-horizontal></botonera-horizontal>
         <div ng-view class="container contenedor"></div>
         <div class="container contenedor-teclado">
             <div class="btn-group-toggle" data-toggle="buttons" ng-click="mostrarTeclado = !mostrarTeclado">
                 <label class="btn btn-secondary active" ng-class="{'teclado-activar': mostrarTeclado}">
                     <input type="checkbox" autocomplete="off"><i class="fa fa-keyboard-o fa-3x" aria-hidden="true"></i>
                 </label>
             </div>
             <foca-teclado ng-show="mostrarTeclado" alfanumeric="true" numeric="true"></foca-teclado>
         </div>
     </body>
 </html>

package.json

Diff comments View file @ eb444b1

 {
     "name": "wrapper-demo",
     "version": "0.0.1",
     "description": "",
     "main": "main.js",
     "scripts": {
         "initdev": "npm install gulp --global && npm install && npm install -g jshint",
         "gulp-pre-commit": "gulp pre-commit",
         "compile": "gulp uglify && gulp sass",
         "electron": "electron .",
         "electron-build": "gulp uglify && gulp html && gulp sass && electron ."
     },
     "pre-commit": [
         "gulp-pre-commit"
     ],
     "repository": {
         "type": "git",
         "url": "https://debo.suite.repo/Wrappers/wrapper-demo.git"
     },
     "author": "Foca Software",
     "license": "ISC",
     "dependencies": {
         "angular": "^1.7.5",
         "angular-cookies": "^1.7.5",
         "angular-i18n": "^1.7.5",
         "angular-on-screen-keyboard": "git+https://github.com/ericf97/angular-on-screen-keyboard.git",
         "angular-route": "^1.7.5",
         "angular-sanitize": "^1.7.5",
+        "angular-ui-swiper": "^2.3.8",
         "bootstrap": "^4.1.3",
         "foca-abm-plazo-pago": "git+https://debo.suite.repo/modulos-npm/foca-abm-plazo-pago.git",
         "foca-abm-precios-condiciones": "git+https://debo.suite.repo/modulos-npm/foca-abm-precios-condiciones.git",
         "foca-abm-sectores": "git+https://debo.suite.repo/modulos-npm/foca-abm-sectores",
         "foca-botonera-principal": "git+https://debo.suite.repo/modulos-npm/foca-botonera-principal.git",
         "foca-busqueda-cliente": "git+https://debo.suite.repo/modulos-npm/foca-busqueda-cliente.git",
         "foca-crear-nota-pedido": "git+https://debo.suite.repo/modulos-npm/foca-crear-nota-pedido.git",
         "foca-directivas": "git+https://debo.suite.repo/modulos-npm/foca-directivas.git",
         "foca-login": "git+https://debo.suite.repo/modulos-npm/foca-login.git",
         "foca-modal": "git+https://debo.suite.repo/modulos-npm/foca-modal",
         "foca-modal-busqueda-productos": "git+https://debo.suite.repo/modulos-npm/foca-modal-busqueda-productos",
         "foca-modal-domicilio": "git+https://debo.suite.repo/modulos-npm/foca-modal-domicilio.git",
         "foca-modal-flete": "git+https://debo.suite.repo/modulos-npm/foca-modal-flete.git",
         "foca-modal-moneda": "git+https://debo.suite.repo/modulos-npm/foca-modal-moneda.git",
         "foca-modal-precio-condiciones": "git+https://debo.suite.repo/modulos-npm/foca-modal-precio-condiciones.git",
         "foca-modal-proveedor": "git+https://debo.suite.repo/modulos-npm/foca-modal-proveedor.git",
         "foca-modal-vendedores": "git+https://debo.suite.repo/modulos-npm/foca-modal-vendedores.git",
         "foca-teclado": "git+https://debo.suite.repo/modulos-npm/foca-teclado.git",
         "foca-turno-apertura": "git+https://debo.suite.repo/modulos-npm/foca-turno-apertura.git",
         "font-awesome": "^4.7.0",
         "gulp-angular-templatecache": "^2.2.1",
         "gulp-htmlmin": "^5.0.1",
         "gulp-uglify": "^3.0.1",
         "jquery": "^3.3.1",
         "node-sass": "^4.9.4",
         "uglify": "^0.1.5",
         "ui-bootstrap4": "^3.0.5"
     },
     "devDependencies": {
         "electron": "^3.0.2",
         "gulp": "^3.9.1",
         "gulp-clean": "^0.4.0",
         "gulp-concat": "^2.6.1",
         "gulp-connect": "^5.6.1",
         "gulp-jshint": "^2.1.0",
         "gulp-rename": "^1.4.0",
         "gulp-replace": "^1.0.0",
         "gulp-sass": "^4.0.1",
         "gulp-uglify-es": "^1.0.4",
         "gulp-watch": "^5.0.1",
         "jasmine-core": "^3.2.1",
         "jshint": "^2.9.6",
         "pre-commit": "^1.2.2",
         "pump": "^3.0.0"
     }
 }

src/js/app.js

Diff comments View file @ eb444b1

 angular.module('appWrapperDemo', [
     'ngCookies',
     'ngRoute',
     'ui.bootstrap',
+    'ui.swiper',
     'focaAbmPlazoPago',
     'focaAbmPreciosCondiciones',
     'focaAbmSectores',
     'focaBotoneraPrincipal',
     'focaBusquedaCliente',
     'focaBusquedaProductos',
     'focaCrearNotaPedido',
     'focaDirectivas',
     'focaLogin',
     'focaModal',
     'focaModalFlete',
     'focaModalMoneda',
     'focaModalPrecioCondicion',
     'focaModalProveedor',
     'focaModalVendedores',
     'focaTeclado',
     'focaTurnoApertura',
     'ngSanitize',
     'onScreenKeyboard',
     'focaModalDomicilio'
 ]);

src/sass/_botonera-principal.scss

Diff comments View file @ eb444b1

 .botonera-principal {
-    margin: 0;
+    menuitem {
-    padding-left: 30px;
-    padding-top: 30px;
-    & menuitem {
         display: inline-block;
         height: 130px;
         text-align: center;
         width: 180px;
     }
-    & button {
+    button {
         background-image: url('../img/botonera.png');
         border-radius: 12px;
         border-width: 0;
         height: 90px;
         position: relative;
         width: 90px;
+        span {
+            left: 0;
+            position: absolute;
+            text-align: center;
+            top: 90px;
+            width: 100%;
+            font-size: 12px;
+            color: #777777;
+        }
     }
-    & span {
+    &-menu {
-        left: 0;
+        padding-left: 90px;
-        position: absolute;
+    }
-        text-align: center;
+    &-logo {
-        top: 90px;
+        width: 80%;
-        width: 100%;
+        opacity: .8;
-        font-size: 12px;
+    }
-        color: #777777;
+    &-vacio {
+        & button {
+            background-position: -4380px 0;
+            &:hover {
+                background-position: -4380px -90px;
+            }
+        }
     }
     &-abrir-turno {
         & button {
             background-position: 0 0;
             &:hover {
                 background-position: 0 -90px;
             }
         }
     }
     &-cerrar-turno {
         & button {
             background-position: -90px 0;
             &:hover {
                 background-position: -90px -90px;
             }
         }
     }
     &-caja {
         & button {
             background-position: -180px 0;
             &:hover {
                 background-position: -180px -90px;
             }
         }
     }
     &-facturador {
         & button {
             background-position: -270px 0px;
             &:hover {
                 background-position: -270px -90px;
             }
         }
     }
     &-nota-pedido {
         & button {
             background-position: -1250px 0px;
             &:hover {
                 background-position: -1250px -90px;
             }
         }

src/sass/_swiper.scss

Diff comments View file @ eb444b1

File was created	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	}
	13

src/sass/general.scss

Diff comments View file @ eb444b1

 @import 'bootstrap';
 @import 'botonera';
 @import 'botonera-lateral';
 @import 'botonera-principal';
 @import 'botonera-secundaria';
 @import 'contenedor';
 @import 'lista';
 @import 'login';
 @import 'panel-informativo';
 @import 'tabla';
 @import 'teclado';
 @import 'tabla-articulos';
+@import 'swiper';