Ajaxman

[Javascript] JavaScript HTML Parser: Mejorando nuestros HTML’S

Muchos quizas creyeron que ya no postearia, pero se equivacaron, he estado un poco atorado(como siempre), pero poco a poco mostrare mejores cosas.

Hoy leyendo el blog de Jhon Resig, me entero de que el, ha lanzado un proyecto llamado: Pure JavaScript HTML Parser.

Este proyecto , por lo poco que lo probe, se trata de un corrector de codigo html, aunque talvez, muchos digan, que son expertos en HTML, no olvidemos que al estar programando en algun otro lenguaje se nos puede pasar algo de HTML, como cerrar alguna tag.

Esta funcionalidad posee 4 metodos/opciones diferentes de uso.

  • Compone Tags no cerradas:
    HTMLtoXML("<p><b>Hello") == '<p><b>Hello</b></p>'
  • Elementos Vacios:
    HTMLtoXML("<img src=test.jpg>") == '<img src="test.jpg"/>'
  • Bloques vs. Elementos:
    HTMLtoXML("<b>Hello <p>John") == '<b>Hello </b><p>John</p>'
  • Cierre de Elementos padre:
    HTMLtoXML("<p>Hello<p>World") == '<p>Hello</p><p>World</p>'
  • Atributos deshabilitados.:
    HTMLtoXML("<input disabled>") == '<input disabled="disabled"/>'

Talvez a muchos no nos sea de gran ayuda pero quiza usando este codigo podamos mejorar nuestros codigos HTML, asi como tambien usarlo para algo mas.

Pueden ver el demo de su uso en el siguiente enlace.

Demo | JavaScript HTML Parser

0 comentarios » por: Ajaxman Miércoles, 07 May 2008 a las 12:32 am Pertenece a : Ajax, Javascript, Librerias, Programacion Comparte

[Ajax-Php] mooHP: Mootools y Php

Buscando un script que me facilitara poner unas tabs para el próximo theme de el blog, el cual por cierto al parecer usara Mootools para unas tabs, las cuales luego verán, Me tope con este Framework.

Se llama mooHP, el cual como su nombre lo indica es una mezcla entre Mootools y Php.

La ventaja reside en que su sintaxis es muy similar a la de Mootools , por lo cual si estas acostumbrado a usar esta librería la implementación sera fácil y las ventajas muchas mas, como gestionar la gran mayoría de código vía Php.

A continuación les pongo un ejemplo de código y posteriormente un link para que vean el demo.

PHP:
  1. <?php
  2. include(“mooHP2/dom.class.php”);
  3. include(“mooHP2/element.class.php”);
  4. include(“mooHP2/css.class.php”);
  5. include(“mooHP2/utility.class.php”);
  6.  
  7. //New instance of the dom class
  8. $t = new dom();
  9.  
  10. //Loads a template from file
  11. $t->loadFile(“base.html”);
  12.  
  13. //Gets element by css selector  and sets it’s HTML content.
  14. $t->SE(“body”)->setHTML(“”);
  15.  
  16. //Selected ellement: body adopts  new element
  17. $t->SE(“body”)->adopt( $t->element(“div”, array(“id”=>“header”) ,“Hello world!”) );
  18.  
  19. //Body adopts  <br />
  20. $t->SE(“body”)->newLine();
  21.  
  22.  
  23. $picked = “”;
  24. if (isset( $_GET[“cd”] )) {
  25.  $picked = ” you have selected #”.$_GET[“cd”];
  26. }
  27.  
  28. //Body adopts new element div: with assigned properties as second argument and text as content;
  29. $t->SE(“body”)->adopt( $t->element(“div”, array(“style”=>“margin:10px; padding:10px; border:1px solid #444;”), “Counting down:”.$picked) );
  30.  
  31. // $select  = new Element()
  32. $select = $t->element(“select”, array(“name”=>“cd”), “”);
  33.  
  34. //Body adopts new element of type form
  35. $t->SE(“body”)->adopt( $t->element(“form”, array(“id”=>“newForm”,“method”=>“get”) ) );
  36. //Selects new element by ID and adopts previously defined element $select
  37. $t->S(“newForm”)->adopt( $select );
  38. // #newForm adopts new Element input
  39. $t->S(“newForm”)->adopt( $t->element(“input”, array(“type”=>“submit”, “value”=>“CLICK!”) ) );
  40.  
  41.  
  42. for ($i=1; $i<=20; $i++) {
  43.     //$newOption is new option element
  44.     $newOption = $t->element(“option”, array(“value”=>$i), “Count down: “ . $i );
  45.     //$select adopt as it’s first child the $newOption element
  46.     $select->adoptTop( $newOption );
  47.     if ( isset($_GET[“cd”]) && $_GET[“cd”] == $i ) {
  48.         //Setting an attribute to an element
  49.         $newOption->setProperty(“selected”,“selected”);
  50.     }
  51. }
  52.  
  53. //Body accepts  new style rules
  54. $t->SE(“body”)->setStyle(“margin”,“10px”);
  55.  
  56. //Body adopts <br />
  57. $t->SE(“body”)->newLine();
  58.  
  59. //Appending text to the body
  60. $t->SE(“body”)->appendText(“and here comes the appended text”);
  61.  
  62. //Body is adopting the inc.html contents
  63. $t->SE(“body”)->adopt( $t->includeFile(“inc.html”) );
  64.  
  65. if (!isset( $_GET[“cd”] )) {
  66.     //Make simple alert with javascript
  67.     $t->alert(“Hello and welcome to mooHP”);
  68. }
  69.  
  70. //Setting the <title> tah innerHTML
  71. $t->setPageTitle(“..:: Hello and welcome to mooHP ::..”);
  72.  
  73.  
  74. //Creating new instance of the css class
  75. $newCss = new css();
  76. //Setting rule in css
  77. $newCss->setStyle(“color”,“#ff9900″);
  78. //Setting rules in css
  79. $newCss->setStyles(array(“font-weight”=>“bold”,“font-size”=>“24px” ));
  80. //Writing the defined css to element
  81. $newCss->writeToElement( $t->S(“header”) );
  82.  
  83.  
  84. //Creating new instance of the css class
  85. $newCss2 = new css();
  86. //Setting rule in css
  87. $newCss2->setStyle(“border”,“10px solid #DDD”);
  88. //Setting rule in css
  89. $newCss2->setStyle(“padding”,“10px”);
  90. //Writing the defined css as #newForm selector in $t dom instance
  91. $newCss2->writeToDom(“#newForm”, $t);
  92.  
  93. //Writing the page   if true is passed as argument the page will be compresed
  94. $t->writePage(true);
  95.  
  96. ?>

El resultado de esto seria lo siguiente.
http://www.devpartment.com/testdrive/mooHP/

Creo que Mootools, me esta ganando, y eso se debe a una gran ventaja que ofrece ante otras Frameworks, como JQuery o Prototype, y eso es su peso, que es extremadamente pequeño, bueno aun sigo defendiendo a Jquery, pero si no se compacta un poco mas quiza tenga que darle un vistazo a Mootools.

Por cierto fui la Flisol, no participe casi en nada y es por que no me dio tuve mucho tiempo, eso si me compre una nueva playera muy chida de Debian Linux, tome unas fotos y me queria traer la de Php, pero pues no habia mas Varo($), asi que sera para la próxima, en cunato baje las fotos les platicare como estuvo la cosa.

Via | mootools + PHP = mooHP
Descarga | Descargar MooHP
Mas información en | http://www.devpartment.com/posts/mootools-php-moohp/

0 comentarios » por: Ajaxman Lunes, 28 Abr 2008 a las 10:29 am Pertenece a : Ajax, Javascript, Librerias, Mootools, Programacion, Recursos Comparte

[Noticia] asQuery, portando jQuery a action script

Apenas me entero de que Jquery a lierado su nueva version, la 1.2.2 de parte de Seraphinux, y me entero de esta noticia.

Resulta que “nitoyon”, ha portado Jquery a action script y ha creado asQuery, con lo cual podemos hacer, cosas como.

Creacion de instancias y monitoreo de eventos
Interpolaciones
Selectores de CSS

y con esto

Podemos crear cosas como esta:

asquery

Vemos como con jQuery podremos hacer lo que uno quiera, mmm en algun lado, vi como agregar funciones PHP a Javascript paar que funcionen igual, dejenme lo checo y les aviso.

Por cierto estoy enfermo, saludos.

Via | asQuey: Port to Action Script.
Ejemplos y mas | asQuery alpha version

1 comentario» por: Ajaxman Martes, 15 Ene 2008 a las 5:07 pm Pertenece a : Ajax, Jquery, Librerias, Noticias Comparte

[Ajax] dojo.moj.oe ¿? el script.aculo.us de dojo!!

Como todos sabemos existe una libreria que se llama script.aculo.us, la cual va de la mano con prototype(otra popular libreria), si embargo a los creadores de “dojo” se el ocurrio simular a la pagina de script.aculo.us, con un buen nombre, dojo.moj.oe.

Si antes teniamos esto:
script.aculo.us

Ahora tenemos tambien esto:

dojo.moj.oe

[corregido]Actualizacion de correccion, gracias a seraphinux[/corregido]

Via | dojo.moj.oe! - parodia de script.aculo.us pero con dojo!
Link de la imitacion
dojo.moj.oe

0 comentarios » por: Ajaxman Lunes, 14 Ene 2008 a las 11:53 am Pertenece a : Ajax, Ajaxman, Javascript, Librerias Comparte
  

Buscar

¿No esta el articulo en portada? Utiliza nuestro buscador.

Realiza una donación a este blog

Agrega a Ajaxman a tus favoritos

Add to Technorati Favorites

Mis recompensas

0 / 2Mis recompensas
    Para conseguir recompensas tienes que dejar comentarios
-
Te faltan 20 comentarios para ganar una recompensa
20 comentarios por recompensa

Categorias

Archivo