La clase tWebPage es el contenedor de toda la página, en ella se procesa todo el código necesario para crear los controles que contiene y generar el HTML final que enviaremos al navegador como respuesta a la llamada a nuestro CGI.
Es el único control que que retorna una cadena en el método Create(), la cadena contiene todo el código HTML, JS y JQuery necesario para que el navegador visualice la página.
A la estructura básica de HTML;
<html> <head> . . </head> <body> . . </body> </html>
Materialize añade header, main y footer, todas dentro de <body>.
Como Néfele se creo basándonos en Materialize mantiene esta estructura, por lo que tenemos propiedades para incluir contenido en cualquiera de las secciones.
Néfele añade en el <head> script para agrupar todos los códigos JS y JQuery que tienen que estar necesariamente en el <head> y style para agrupar los stilos CSS que hemos añadido directamente a tWebPage.
También añadimos script al final del <body> para los códigos JS y JQuery que no necesitan estar en el <head>.
<html> <head> <script> /* Códigos JS y JQuery que necesitan cargarse al principio de la página */ . . </script> <style> /* Estilos CSS que hemos añadido a tWebPage */ . . </style> </head> <body> <header> . . </header> <main> . . </main> <footer> . . </footer> <script> /* Códigos JS y JQuery del resto de la página */ . . </script> </body> </html>
De esta manera todo el contenido de la página esta dentro de <body> pero estructurado en tres areas para facilitar el tratamiento con las librerías JS de Materialize.
Nombre | Init | Descripción | Versión |
---|---|---|---|
cClassId | “wpg” | 0.1 | |
Contenido de la Página | |||
cInHead | Contenido a Añadir en el <Head> de la página | 0.1 | |
cCSS | Contenido de Estilo CSS para incluir en el <Head> de la página | 0.1 | |
aHeadScript | {} | Array de Script para incluir en el <Head> | 0.1 |
aHeadLinks | {} | Array de Links para incluir en el <Head> | 0.1 |
aHeadMetas | {} | Array de Meta para incluir en el <Head> | 0.5 |
cHeadMeta | Método rápido de añadir un elemento a aHeadMetas | 0.5 | |
cInHeader | Contenido para incluir en el <Header> de la página | 0.1 | |
cInMain | Contenido para incluir en el <Main> de la página | 0.1 | |
cInFooter | Contenido a Añadir en el <Footer>, si contiene algo NO se utiliza el Footer estándar de Materialize | 0.1 | |
aScript | {} | Array de Script para incluir en la sección <Script> del <Body> | 0.1 |
cScript | Método rapido de añadir un elemento a aScript | 0.3 | |
Control de Versiones | |||
cVersionMaterialize | Versión del MaterializeCSS a utilizar “1.0.0” | 0.1 | |
cVersionJquery | Versión del JQuery que vamos a utilizar “3.4.1.min” | 0.1 | |
cVersionCoreFiles | Versión a usar de nefelecorecss.css y nefelecorejs.js | 0.1 | |
Automatizaciones de la Página | |||
aOnReady | {} | Código a Ejecutar cuando este lista la página | 0.1 |
cOnReady | Método rapido de añadir un elemento a aOnReady | 0.3 | |
cAutoJS | Función del proyecto a llamar en la cabecera para cargar funciones JS | 0.1 | |
lAutoReloaded | .t. | Obliga a que la página se recargue al ir atrás en el navegador | 0.1 |
nTimeOut | 0 | Segundos que se puede mantener la página quieta | 0.1 |
cMainPage | Página a la que ir cuando se esta nTimeOut tiempo quieta | 0.1 | |
aParamsAuto | {} | Parámetros a incluir en la llamada del TimeOut | 0.1 |
nDelay | 0 | Tiempo de espera para servir la página | 0.1 |
Aspecto de la Página | |||
lValign | .f. | Fuerza el centrado Vertical del contenido del <main> | 0.1 |
lContainer | .t. | Se habilita el modo Contenedor o No en la página | 0.1 |
cTitle | Titulo de la página | 0.1 | |
cClrText | “black” | Color del texto de la Página | 0.1 |
cClrPane | “white” | Color del fondo de la Página | 0.1 |
cIcon | Favicon de la página | 0.1 | |
cLanguage | “es-ES” | Idioma de la página | 0.4 |
lFullScreen | .f. | Muestra la página a pantalla completa | 0.1 |
lNoBackButton | .f. | Anula el botón back del navegador | 0.1 |
cMeasureType | xc_Pixel | Unidad de medida base para los controles | 0.1 |
Parametros del Footer estandar de Materialize | |||
lFooter | .t. | Incluir Footer estandar de Materialize | 0.1 |
aLinks | {} | Lista de Links en el Footer Estandar, es un array de arays {cURL,cText} | 0.1 |
cTitleFooter | Titulo en el Footer | 0.1 | |
cClrFootText | “white” | Color del Titulo del Footer | 0.1 |
cClrFootPane | “pink” | Color del fondo del Footer | 0.1 |
cSubTitle | Subtitulo del Footer | 0.1 | |
cClrSubText | “grey” | Color del texto del Subtitulo del Footer | 0.1 |
cCopyright | Texto del Copyright en el Footer | 0.1 | |
cClrCrText | “white” | Color del Texto del Copyright | 0.1 |
cClrCrPane | Color del fondo del Copyright | 0.1 | |
aBreadCrumbs | Array de path para un BreadCrumbs en el footer | 0.3 | |
ShadowSheet - Bloqueo temporal de la página mientras se realizan procesos | |||
lShadowSheet | .t. | Si queremos activar el Shadowsheet | 0.1 |
cShadowSheetTitle | Titulo a presentar en el ShadowSheet | 0.1 | |
cShadowSheetSubTitle | Subtitulo a presentar ne el ShadowSheet | 0.1 | |
Banner de información de cookies | |||
cCookieBannerText | Texto principal que aparece en el banner | 0.1 | |
cCookieBannerClose | Texto del botón cerrar | 0.1 | |
cCookieBannerMore | Texto del enlace saber más | 0.1 | |
cCookieBannerLink | Link al pulsar el texto anterior | 0.1 | |
Extras | |||
lFaIcons | .f. | Carga Font Awesome | 0.1 |
lAlerts | .f. | Carga js de SweetAlert | 0.1 |
lGoogleChart | .F. | Inicializa la página para que pueda contener Google Chart | 0.1 |
lTourShow | .t. | Si se mostrará o no el Tour | 0.1 |
aTour | {} | Array con todos cId de los elementos del tour, si esta vació no se tomara en cuenta lTourShow | 0.1 |
cAnalytics | ApiKey de Google Analitics | 0.1 | |
cGpsField | Nombre del control que guardará la información GPS | 0.1 | |
One Signal | |||
cOneSignalKey | App key de onesignal | 0.1 | |
cOneSignalKeySafari | App key onesignal para navegadores safari | 0.1 | |
Ventanas Modal | |||
cModalMinTop | “4%” | Mínimo Top para ventana modal | 0.1 |
cModalMaxTop | “10%” | Máximo Top para ventana modal | 0.1 |
Progressive Web App | |||
oManifest | Objeto de la clase wManifest para la configuración del archivo .webmanifest y los metas necesarios para utilizar nuestra web como PWA | 0.5 | |
lManifest | .f. | Vamos a utilizar webManifest | 0.5 |
Nombre | Descripción | Versión |
---|---|---|
New() | Instancia la clase para irle añadiendo los controles | 0.1 |
Create() | Monta todo el código necesario para que el navegador pueda visualizar la página y lo retorna como una cadena | 0.1 |
AddHTML(cText) | Nos Añade en el HTML el texto | 0.1 |
ProccessPhp(cPhpFile, aParams, cId) | Añade al código HTML una llamada por Ajax a un modulo PHP, esto nos permite añadir a nuestro proyecto Néfele funcionalidades que ya tengamos operativas en PHP y que aun no hemos pasado a Néfele | 0.1 |
Solo operativas en Modo Debugger | ||
LogDebug(cText,lComillas) | Nos Envía cText a la Consola del navegador y a Néfele Console, si lComillas == .F. podemos pasarle una instrucción que se ejecuta en la página | 0.1 |
LogError(cText) | Nos Añade un Mensaje de Error en la Consola del Navegador y en Néfele Console | 0.1 |
Assert(cText) | Nos Añade un Comentario al HTML | 0.1 |
AddTimer() | Añade un timer JS a la página | 0.3 |
Comentario tWebPage