Retomando CSSing

He vuelto a retomar CSSing. el proyecto es demasiado grande y me es imposible cumplir mis expectativas, CSSing consiste en generar CSS y Javascript solamente escribiendo código CSS.

Como últimamente esta de moda Javascript estoy adaptando el proyecto, Iván me ayudo en aclarar algunas partes (para que complicarse la vida creando un semilenguaje cuando puedes usar la sintaxis de CSS) y ahora en vez de generar CSS solo se podrá usar para crear Javascript.

Estoy usando Mootools para generar la salida, pero se podrán usar otras librerías (jQuery, Prototype):

//selector:pseudoclass
a#form:mouseover {
    color: #000;
    background-color: effect(#fff);
}

//macro del selector, para no repetir
$:click {    
    send: #form_option;
}

//código generado por el parser
$$('a#form').each(function(el) {
    el.addEvent('mouseover', function(e){
        e.setStyles('color: #000;');
        e.effect('background-color').start(#fff);
    });
    el.addEvent('click', function(e){
        $$('#form_option').send();
    });
});

Obviamente esto es solo un boceto, así que estoy abierto a sugerencias :P.


postEditor 2.0

Después de un largo testeo (bugs tontos que no te das cuenta) saco a la luz la nueva versión de postEditor2.0, una versión muy mejorada ya que todo el código esta escrito desde 0. Se acerca mas a lo que debería ser una textarea de edición de código (ojo que no un WYSIWYG que de esos ya tenemos).

Novedades que puedes encontrar en esta versión:

  • Auto-Indent en snippets, selecciones y enter, mas que nada para no perder el autotab
  • Snippets con tabposition para poder tabular sobre un snippet
  • Snippets con autocompletado, la joya de la casa, en un tabposition tienes la opción de tabular hasta el infinito buscando la opción que más te convenga.
  • Snippets dinámicos, quien dijo miedo?.
  • Auto-pair para comillas, corchetes y todo lo que quieras.
  • Sistema de scope
  • Aplicar funciones a una selección, o poder elegir que rango seleccionar (útil si quieres buscar una frase o la ultimposicionón de un tag)

Y lo mejor de todo configurable 100% ya que tu defines el lenguaje y las variables.


Window.Growl con jQuery

Agregar a favoritos

5 Comentarios

Posteado hace 534 días en:

Para aquellos amantes de jQuery Alex Sancho se ha currado la adaptación de mi script para esta librería. Le ha quedado fenomenal.

Muchas gracias por la aportación a la comunidad :).


postEditor

postEditor es una versión light que hice para escribir código en los textarea, ahora puedes tabular, mantener los saltos de lineas y usar snippets simples. Los tooltips y autocompletados no están disponibles.

Puedes probar una demo.

Aunque bueno, también tengo un plugin para wordpress (solo para plantillas y plugins).

Update: Ahora postEditor incluye un sistema para hacer pares de caracteres automáticos, como {}, si escribes el corchete de apertura te lo cierra automáticamente. También un sistema de scope, que mas o menos es como decir donde puedes usar o no los snippets, valido si quieres tener dos lenguajes en un mismo textarea (html+css).

Nota: Gracias Diego por traducirme la página.


Window.Growl

Primer script de la saga 1.9, el sistema growl para enviar mensajes después de los eventos AJAX. Es necesaria la librería mootools, una librería javascript con una estructura preciosa, me encanta.

Para usar los mensajes tienes que llamar a la función Window.Growl.

//Si se ha enviado el comentario
Window.Growl('Mensaje guardado<br />correctamente.');

El script tiene un sistema de cola para ejecutar varios mensajes uno detrás de otro.

Descargar Growl.

Update: He puesto una demo para que os sea más fácil ver el efecto.