StarFly

Introducción 🚀

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.

Introduction 🚀

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.

¿Qué es StarFly?

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.

What is StarFly?

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.

Características 🎁

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

Features 🎁

Fast and reliable
Does not need jQuery
Work with pure JavaScript code (supported by most current browsers)
Customizable to your liking

Requerimientos 📋

Soporte para CSS y JavaScript

Requirements 📋

Support for CSS and JavaScript

Instalación 🔧

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.html o index.php), usted deberá tener anexado el archivo de su main.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>

Instalation

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>

Cómo usar StarFly

Tipos de notificaciones

Es fácil, hay tres tipos de notificaciones:

Notificación que desaparece al presionar Ok

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
	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');

Iconos de notificaciones

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

Dándole otro estilo a StarFly

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 StarFly

Si 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.

How to use StarFly

It's easy, there are three types of notifications:

1. 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
```

1. 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).
1. 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.

Documentación

Por los momentos no contamos con documentación en línea, ¡pero trabajamos en ello!

Documentation

At the moment we do not have online documentation, but we work on it!

Donaciones

Si usted quiere ayudarnos financieramente nosotros aceptamos sus donaciones usando Paypal y realizando los siguientes pasos:

1. Acceda desde su navegador a la siguiente URL: PayPal - CPW Online
1. Déjese llevar ;)

Donations

If you want to help us financially we accept your donations using Paypal and performing the following steps:

1. Access the following URL from your browser: PayPal - CPW Online
1. Let yourself go ;)

Contacto

Si usted desea ponerse en contacto con nosotros es sencillo:

GitHub: @cpwonline
Web: CPW Online
Email: CPW Online
Facebook: @CPWOnline
Instagram: @cpwonline

Contact

If you wish to contact us, it is simple:

GitHub: @cpwonline
Web: CPW Online
Email: CPW Online
Facebook: @CPWOnline
Instagram: @cpwonline

Licencia 📄

Este proyecto está bajo la Licencia Apache License 2.0 - mira el archivo LICENSE para más detalles

Licence 📄

This project is under licence Apache License 2.0 - see file LICENSE for more details

cpwonline/cpw-starfly

StarFly

Introducción 🚀

Introduction 🚀

¿Qué es StarFly?

What is StarFly?

Características 🎁

Features 🎁

Requerimientos 📋

Requirements 📋

Instalación 🔧

Instalation

Cómo usar StarFly

Tipos de notificaciones

Iconos de notificaciones

Dándole otro estilo a StarFly

How to use StarFly

Documentación

Documentation

Donaciones

Donations

Contacto

Contact

Licencia 📄

Licence 📄