Construyendo un Addon Elastix: Avanzado
1 recomendación651 vistas
Este documento describe la estructura de directorios y archivos de un módulo de Elastix. Incluye información sobre los archivos de configuración, ayuda, imágenes, traducciones, clases, plantillas, JavaScript y CSS. También explica el uso de JavaScript, jQuery, Ajax y JSON para enviar e recibir información del servidor y base de datos, y mejorar la interfaz de usuario. El código fuente de los ejemplos se encuentra disponible en un repositorio de GitHub.
Construyendo un Addon Elastix: Avanzado
- 4. • • sqlite3 /var/www/db/menu.db • sqlite> select * from menu; • sqlite> .mode column sqlite> .header on sqlite> .width 20 20 20 20 20
- 5. • • • Directorio Contenido configs/ Archivo de configuración. help/ Archivo para mostrar ayuda. images/ Imágenes (gif, jpg, png) utilizadas por la interfaz. lang/ Archivos con la traducción de las etiquetas. libs/ Clases y librerías utilizadas por el módulo. themes/ Plantillas (.tpl) con HTML, librerías adicionales de CSS y JS.
- 6. • • • <script type='text/javascript' src='modules/producto_ingreso_2/themes/default/js/javascript.js'></script> <link rel='stylesheet' href='modules/producto_ingreso_2/themes/default/css/style.css' /> Directorio Contenido themes/default/js/ Librerías de javascript. themes/default/css/ Librerías de css.
- 7. •El formulario que realizamos en el primer webinar hereda el estilo del tema utilizado por Elastix, en el ejemplo: Elastixneo.
- 8. •Este formulario tiene su propio estilo, para lo cual se requiere usar un CSS para el módulo. •Sugerencia: bajar ejemplos del internet, modificar y ver cambios.
- 9. <div class="form-style"> <h1>Ingreso de productos</h1> <form> </form> <div class=“section”> <div class=“inner_wrap”> <div class=“section”> <div class=“inner_wrap”> <div class=“section”> <div class=“mensaje”>
- 10. •Javascript es un lenguaje mayormente usado para enriquecer la interfaz de usuario. •En el ejemplo veremos, el uso de Jquery para obtener información de elementos de formularios. •Usaremos Ajax para enviar información al servidor. •Desde el servidor enviaremos una respuesta codificada en Json.
- 11. Cliente Servidor index.php Producto.class.php form.tpl MySQL Browser HTML CSS JS
- 12. •Para bajar el código fuente de los ejemplos, puedes ir a https://github.com/jprb79/webinar_addons/ •Si eres usuario de github podrías clonar el repositorio, caso contrario podrás bajar el código fuente como archivo .zip.