Desarrollado, diseñado y creado por el Equipo de Desarrolladores Web de CPW Online | CPW Online
¡Hola! Gracias por utilizar este software, desarrollado con mucho esfuerzo y cariño para la comunidad del Software libre.
Developed, designed and made by the Web Developers Team of CPW Online | CPW Online
Hello! Thank you for using this software, developed with a lot of effort and affection for the Free Software community.
Es un administrador de notificaciones que funciona como complemento (o plugin) en un sitio web. No es necesario añadir algún plugin de jQuery, este software no lo utiliza.
Este funciona como complemento de su sitio ya que le permitiría ocuparse en otros aspectos de la web y no de estar ocupado programando anuncios que indican las notificaciones que usted quiere mostrar, y que, en ocasiones el usuario nunca llega a ver.
It is a notification manager that works as a complement (or plugin) in a website. It is not necessary to add any jQuery plugin, this software does not use it.
This works as a complement to your site because it would allow you to deal with other aspects of the web and not to be busy scheduling ads that indicate the notifications you want show, and that, sometimes the user never gets to see.
- Rápido y confiable
- No necesita jQuery
- Trabaja con puro código JavaScript (soportado por la mayoría de navegadores actuales)
- Personalizable a su gusto
- Fast and reliable
- Does not need jQuery
- Work with pure JavaScript code (supported by most current browsers)
- Customizable to your liking
- Soporte para CSS y JavaScript
- Support for CSS and JavaScript
Pasos para instalar StarFly:
-
Descargar o clonar el repositorio de StarFly
-
Ahora debe copiar el directorio (si lo descargó debe descomprimirlo primero) en el directorio donde se encuentra su sitio web local (o remoto)
-
En el archivo principal de su sitio web (sea
index,index.htmloindex.php), usted deberá tener anexado el archivo de sumain.js(o algún otro archivo que contenga sus funciones de Javascript) y los archivos de la carpeta starfly, agregue las siguientes líneas de código en el<head>de su archivo HTML:
<link rel="stylesheet" href="starfly/css/estilo-gen.css"/>
<script src="starfly/js/func-gen.js"/></script>Steps to install StarFly:
-
Download or clone the repository of CPW Online
-
Now you must copy the directory (if you downloaded it you must unzip it first) in the directory where is your local website (or remote)
-
In the main file of your website (be it index, index.html or index.php), you must have attached the file of your main.js and the files of the folder starfly, add the following lines of code in your HTML head:
<link rel="stylesheet" href="starfly/css/estilo-gen.css"/>
<script src="starfly/js/func-gen.js"/></script>Es fácil, hay tres tipos de notificaciones:
-
Notificación que desaparece al presionar
OkPara mostrar esta notificación, añada las siguientes líneas de código a su main.js:
//Datos
var titulo = "Alerta"
var mensaje = "Usted ha ingresado una clave incorrecta."
//Notificación
starFly(titulo, mensaje, 0, 0, "question");-
Not. que desaparece automáticamente en determinados segundos
Para mostrar esta notificación, añada las siguientes líneas de código a su main.js:
//Datos
var titulo = "Alerta"
var mensaje = "Usted ha ingresado una clave incorrecta."
//Notificación
sstarFly(titulo, mensaje, 1, 5000, "security"); Nota: En este código la notificación desaparecerá al cumplirse 5 segundos (5000 milisegundos).
-
Not. que desaparece sólo con código
Para mostrar esta notificación, añada las siguientes líneas de código a su main.js:
//Datos
var titulo = "Alerta"
var mensaje = "Usted ha ingresado una clave incorrecta."
//Notificación
//Se crea
ob_sF = starFly(titulo, mensaje, 2, 0, "question");
// Se realiza alguna operación
/*Alguna operación que tarde algún tiempo*/
//Se borra
borrarElemento_starFly(ob_sF, 1, 'xT');Cabe destacar que esta notificación es exclusiva para cuando se esté realizando un proceso (la carga de un archivo, o la consulta de lagunos datos a un servidor), cuando este termine, se elimina manualmente con la función borrarElemento_starFly()
-
Extra. Editar el mensaje (Solo para la notificación que desaparece con código)
Para mostrar esta notificación, añada las siguientes líneas de código a su main.js:
//Datos var titulo = "Alerta" var mensaje = "Usted ha ingresado una clave incorrecta." //Notificación //Se crea ob_sF = starFly(titulo, mensaje, 2, 5000, "question"); // Se realiza un proceso /*Proceso en ejecución*/ //¿Terminó el proceso? Editamos el mensaje nuevoMsj_starFly('Usted ha sido bloqueado', ob_sF); //Se borra borrarElemento_starFly(ob_sF, 1, 'xT');
Algunos iconos disponibles para su notificación:
-
good: Icono que indica una afirmación o que algo se realizó correctamente.
-
settings: Icono que indica que se ha realizado un ajuste
-
question: Icono que indica que ha sucedido un error desconocido
-
delete: Icono que indica que se ha eliminado algo
-
cancel: Icono que indica que ha sucedido un error en específico
-
information: Icono que indica que lo que se muestra es informativo
-
security: Icono que indica que lo que se muestra es privado, información importante o restringida
Si usted tiene un archivo *.js (código fuente de JavaScript) usted puede editar ese archivo y agregar las siguientes líneas de código (Desde "Inicio copiado" hasta "Fin copiado", nada más) para cambiar el diseño de StarFly:
//Variables generales de StarFly
//De estilo
estiloContenedor = "background:hsla(0, 0%, 30%, .9);padding:.2cm;margin-bottom:.1cm;overflow:hidden;text-align:right;border-radius:.1cm;-webkit-border-radius:.1cm;-moz-border-radius:.1cm;-o-border-radius:.1cm;transition:.3s all;-webkit-transition:.3s all;-moz-transition:.3s all;-o-transition:.3s all;";
estiloIcono = "width:16px;height:16px;display:inline-block;";
estiloTitulo = "display:inline-block;font-size:12pt;color:#CCC;margin-bottom:.1cm;padding:.25cm;";
estiloCerrar = "cursor:pointer;display:inline-block;float:right;padding:.4cm;color:#fff;text-align:center;width:10%;";
estiloMensaje = "font-size:10pt;color:#FFF;";
estiloBoton = "tu_estilo_de_boton";//Debes elegir una clase de estilo
//De personalización
textoBotonGen = "Ok";
//Fin variables generales de StarFlySi usted no tiene algún archivo .js, deberá crear un archivo llamado main.js (Puede ser el nombre que usted desee) y agregar las líneas de código anteriores.
It's easy, there are three types of notifications:
-
- Not. that disappears when pressing 'Ok'
To display this notification, add the following lines of code to your main.js:
```Js
//Start code
//Data
var title = "Alert"
var message = "You have entered an incorrect password."
//Notification
starFly(title, message, 0, 0, "security");
//End code
```
-
- Not. that disappears automatically in certain seconds
To display this notification, add the following lines of code to your main.js:
```Js
//Start code
//Data
var title = "Alert"
var message = "You have entered an incorrect password."
//Notification
starFly(title, message, 1, 5000, "security");
//End code
```
-
Note: In the previous code the notification will disappear after 5 seconds (5000 milliseconds).
-
- Not. that disappears only with code
To display this notification, add the following lines of code to your main.js:
```Js
//Start code
//Data
var title = "Alert"
var message = "You have entered an incorrect password."
//Notification
//It's created
ob_sF = starFly(title, message, 2, 0, "question");
//It's erased
borrarElemento_starFly(ob_sF, 1, 'xT');
//End code
```
- Extra. You can also edit the message (Only for notification that disappears with code)
To display this notification, add the following lines of code to your main.js:
```Js
//Start code
//Data
var title = "Alert"
var message = "You have entered an incorrect password."
//Notification
//It's created
ob_sF = starFly(title, message, 2, 5000, "question");
//We edit the message
nuevoMsj_starFly('You have been blocked', ob_sF);
//It's erased
borrarElemento_starFly(ob_sF, 1, 'xT');
//End code
```
- Extra. Some icons available for notification:
-
good: Icon that indicates an affirmation or that something was done correctly.
-
settings: Icon that indicates that an adjustment has been made
-
question: Icon indicating that an unknown error has occurred
-
delete: Icon that indicates that something has been deleted
-
cancel: Icon indicating that a specific error has occurred
-
information: Icon that indicates that what is shown is informative
-
security: Icon that indicates that what is shown is private, important or restricted information
-
Extra. If you have a .js file (JavaScript source code) you can edit that file and add the following lines of code (From "Start copied" to "End copied", nothing else) to change the StarFly design:
```Js // Start copied // StarFly general variables // Of style estiloContenedor = "background:hsla(0, 0%, 30%, .9);padding:.2cm;margin-bottom:.1cm;overflow:hidden;text-align:right;border-radius:.1cm;-webkit-border-radius:.1cm;-moz-border-radius:.1cm;-o-border-radius:.1cm;transition:.3s all;-webkit-transition:.3s all;-moz-transition:.3s all;-o-transition:.3s all;"; estiloIcono = "width:16px;height:16px;display:inline-block;"; estiloTitulo = "display:inline-block;font-size:12pt;color:#CCC;margin-bottom:.1cm;padding:.25cm;"; estiloCerrar = "cursor:pointer;display:inline-block;float:right;padding:.4cm;color:#fff;text-align:center;width:10%;"; estiloMensaje = "font-size:10pt;color:#FFF;"; estiloBoton = "Your-style";//You must choose a style class //Of personalization textoBotonGen = "Ok"; // End StarFly general variables // End copied ```
If you do not have any .js file, you should create a file called "main.js" (It can be the name you want) and add the previous lines of code.
Por los momentos no contamos con documentación en línea, ¡pero trabajamos en ello!
At the moment we do not have online documentation, but we work on it!
Si usted quiere ayudarnos financieramente nosotros aceptamos sus donaciones usando Paypal y realizando los siguientes pasos:
-
- Acceda desde su navegador a la siguiente URL: PayPal - CPW Online
-
- Déjese llevar ;)
If you want to help us financially we accept your donations using Paypal and performing the following steps:
-
- Access the following URL from your browser: PayPal - CPW Online
-
- Let yourself go ;)
Si usted desea ponerse en contacto con nosotros es sencillo:
- GitHub: @cpwonline
- Web: CPW Online
- Email: CPW Online
- Facebook: @CPWOnline
- Instagram: @cpwonline
If you wish to contact us, it is simple:
- GitHub: @cpwonline
- Web: CPW Online
- Email: CPW Online
- Facebook: @CPWOnline
- Instagram: @cpwonline
Este proyecto está bajo la Licencia Apache License 2.0 - mira el archivo LICENSE para más detalles
This project is under licence Apache License 2.0 - see file LICENSE for more details