Skip to content
This repository has been archived by the owner on Feb 20, 2024. It is now read-only.
/ cpw-starfly Public archive

A notification manager of websites. Un Administrador de notificaciones de sitios web.

License

Notifications You must be signed in to change notification settings

cpwonline/cpw-starfly

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

41 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

StarFly

StarFly logo

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.

Using StarFly

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:

  1. Descargar o clonar el repositorio de StarFly

  2. Ahora debe copiar el directorio (si lo descargó debe descomprimirlo primero) en el directorio donde se encuentra su sitio web local (o remoto)

  3. 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:

  1. Download or clone the repository of CPW Online

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

  3. 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:

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

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

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

  1. good: Icono que indica una afirmación o que algo se realizó correctamente.

  2. settings: Icono que indica que se ha realizado un ajuste

  3. question: Icono que indica que ha sucedido un error desconocido

  4. delete: Icono que indica que se ha eliminado algo

  5. cancel: Icono que indica que ha sucedido un error en específico

  6. information: Icono que indica que lo que se muestra es informativo

  7. 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:
  1. good: Icon that indicates an affirmation or that something was done correctly.

  2. settings: Icon that indicates that an adjustment has been made

  3. question: Icon indicating that an unknown error has occurred

  4. delete: Icon that indicates that something has been deleted

  5. cancel: Icon indicating that a specific error has occurred

  6. information: Icon that indicates that what is shown is informative

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

Donations

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

Contacto

Si usted desea ponerse en contacto con nosotros es sencillo:

Contact

If you wish to contact us, it is simple:

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

About

A notification manager of websites. Un Administrador de notificaciones de sitios web.

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published