jueves, 26 de julio de 2012

jQuery: mi primer Plugin 'resaltado de texto con jquery'

$.fn.resaltar= function(options){  

        var opts = $.extend({}, $.fn.resaltar.defaults, options);    
        
        this.each(function(){    
            
            //console.log(this);
            //$(this).css({'background':'rgba(255, 0, 0, .4)'});  //SI
                          
            (function(self){
               var t = 1; 
               var sube =true;
                                
              var timer = setInterval(function(){    
                     // console.log(self) 
                      
                    //$(self).css({'background':'rgba(255, 0, 0, .4)'});        //si
                          
                  //var color = 'rgba(255, 0, 0, .'+t+')'; //comun
                  var color = 'rgba('+opts.r+', '+opts.g+', '+opts.b+', .'+t+')'; 
                  
                  
                  
                 //$(this).css({'background': color}); // NO ANDA!!
                  $(self).css({'background': color}); //SIII
                    //console.log("asdsa", t, sube, color)
                        
                    if(sube) t++;
                       else t--;
                        
                    if(sube && t==9) sube = false;    
                  if(!sube && t==-1) clearInterval(timer)           
                   
                    
                },50);
                      
            })(this);
                  
                  
        });        
    };  
       
    $.fn.resaltar.defaults = {  
        // para el fondo un color por defecto  
        r: '255',
        g: '0',
        b  : '0'
    };  

/*----------------------------*/
//$("#test1").resaltar();  

$("#my").click(function(){
     $("#test1").resaltar();  
    $("#test2").resaltar({r:'0',g:'255',b:'0'});  
});

test rck:
http://jsfiddle.net/ric47121/sUnKf/6/

test Online:
http://ricardolevano.com.ar/test/test_resaltado_jquery_by_rck/test1.html

javascript: Closures y Scope en javaScript

for(i=0;i<3;i++){
    (function(i){
       var pos = i;
       var timer = setInterval(function(){    
                       console.log("toto",pos++)  
                       if(pos==5){
                           console.info("eliminando el timer", i)
                           clearInterval(timer)                                            
                       } 
                 },1000);
    
    })(i);
}

martes, 24 de julio de 2012

jQuery: Simple Loguer

function agregarEvento(){
    //var loguer = $("#loguer-rck");
    $("#loguer-rck").prepend("<li> <span>3:05 pm :</span>  un nuevo item.</li>");
    console.log("agregado")

     //   $("#loguer_conteiner").scrollTop(9999);
    $("#loguer_conteiner").animate({scrollTop:0}, 'slow');
}
        
​test rck:
http://jsfiddle.net/ric47121/98efR/7/

test rck 2 (con resaltado by rck)
http://jsfiddle.net/ric47121/98efR/8/

lunes, 23 de julio de 2012

javaScript: fechas (date.js)

//http://code.google.com/p/datejs/

var t1 = new Date().toString('d/M/yyyy')  
console.log(t1)

var fecha = Date.parse("1986-09-01", "Y-m-d H:i:s");
console.log(fecha.toString('d/M/yyyy'))


test rck:
http://jsfiddle.net/ric47121/pACDm/1/

martes, 17 de julio de 2012

PHP y MySQLi: conexion con mysqli y manejo de errores

<?php
include "db.php";
$conexion = new mysqli($MYSQL_HOST, $MYSQL_LOGIN, $MYSQL_PASS, $MYSQL_DB);

if (mysqli_connect_errno()) {
    printf("Connect failed: %s\n", mysqli_connect_error());
    exit();
}

$result = $conexion->query("select * from users");
echo "Num de filas al iniciar: ".$result->num_rows. "</br>";

while($row = $result->fetch_array(MYSQLI_ASSOC)){
    echo $row['name']." ";
}

echo "<hr>";

$conexion->autocommit(false);

try{

    $result = $conexion->query("INSERT INTO users (name, email) VALUES ('ambro', 'un email');");
        if(!$result) throw new Exception($conexion->error);
        
    echo "id usuario nuevo: ".$conexion->insert_id; //si
    echo "<hr>";

    $result = $conexion->query("INSERT INTO users_comments (id_user, TEXT) VALUES ({$conexion->insert_id}, 'un comentario del user {$conexion->insert_id}');");
        if(!$result) throw new Exception($conexion->error);

    echo "id comentario nuevo: ".$conexion->insert_id; //si
    echo "<hr>";

    $result = $conexion->query("INSERT INTO users_comments (id_user, TEXT) VALUES (85, 'un comentario del user asd');");
        if(!$result) throw new Exception($conexion->error);
            //throw new SqlException( mysqli_error( $connection ) );
        
    $conexion->commit();

}
catch(Exception $e){
    $conexion->rollback();
    die("error lo agarra el catch: <br>".$e->getMessage() );
}

?>

lunes, 16 de julio de 2012

javascript: armar array Asociativo a partir de un array de objetos

var coll = [ 
    {'codigo':1, 'nombre': 'DNI', 'descripcion':'blah..' },
    {'codigo':2, 'nombre': 'PASAPORTE', 'descripcion':'blah 5..' } ,   
    {'codigo':5, 'nombre': 'CEDULA', 'descripcion':'blah 2..' }
]

/*
arma un array asociativo a partir de un array de objetos    
*/
var TIPOS_DOC = transformToArrayAsociativo(coll, k='codigo', v='nombre');

console.log(TIPOS_DOC , TIPOS_DOC[1], TIPOS_DOC['3'])

function transformToArrayAsociativo(coll, key, value){    
    var arr= {};    
    for(var i=0;i<coll.length;i++){
        //console.log(coll[i].codigo)
        var obj = coll[i];
        var k = obj[key];
        var v = coll[i][value];
         
        arr[k] = v;                 
     }
return arr;             
}

test rck:
http://jsfiddle.net/ric47121/93AWd/7/

jQuery: filtrar tabla inline

var todos =[];

$("#table_defensorias tbody tr").each(function(index) {
       //todos.push($(this).text());
        //$(this).find("td").eq(0).css("color","red")
        //colum_1.push($(this).find("td").eq(0).text());
        todos.push({
            colum_0: $(this).find("td").eq(0).text(),
            colum_1: $(this).find("td").eq(1).text()
        }); 
    });

//console.log(todos) //ok

$("#filter_def").keyup(function(){
    //console.log($(this).val());
    
    $("#table_defensorias tbody").html("");
   var srtSearch = $(this).val(); 
   //var filtrados = filtrar(todos, srtSearch);
   
    //var filtrados = _.filter(todos, function(txt){ return /+'srtSearch '+/gi.test(txt); });
    
    var filtrados = _.filter(todos, function(obj){ 
        return (
            (new RegExp(srtSearch,'gi')).test(obj.colum_0) ||
            (new RegExp(srtSearch,'gi')).test(obj.colum_1)
)            
            ; });
    
    //console.log(filtrados)
        
    for(var i=0;i<filtrados.length;i++){
        $('#table_defensorias tbody')
        .append('<tr>'+
        '<td>'+filtrados[i].colum_0+'</td>'+
        '<td>'+filtrados[i].colum_1+'</td>'+
        '<td>'+'</td>'+
        '<td>'+'</td>'+
        '</tr>');
    }

});

test rck:
http://jsfiddle.net/ric47121/49s6W/3/

jQuery: filter ul usando underscore.js

var todos = [];

$("ul li").each(function(index) {
   todos.push($(this).text());
});

$("#filter_def").keyup(function(){
    
    $("ul").html("");
   var srtSearch = $(this).val(); 

    var filtrados = _.filter(todos, function(txt){ return (new RegExp(srtSearch,'gi')).test(txt); });
    
    for(var i=0;i<filtrados.length;i++){
        $('ul').append('<li>'+filtrados[i]+'</li>');
    }

});

test rck:
http://jsfiddle.net/ric47121/Cvq4e/4/

jueves, 12 de julio de 2012

jQuery: Autocomplete con resaltdo, tpl y subserach

$(function() {
            
                var projects = [
                    {
                        value: "jquery",
                        label: "jQuery",
                        desc: "the write less, do more, JavaScript library",
                        icon: "jquery_32x32.png"
                    },
                    {
                        value: "jquery-ui",
                        label: "jQuery UI",
                        desc: "the official user interface library for jQuery",
                        icon: "jqueryui_32x32.png"
                    },
                    {
                        value: "sizzlejs",
                        label: "Sizzle JS",
                        desc: "a pure-JavaScript CSS selector engine",
                        icon: "sizzlejs_32x32.png"
                    }
                ];

                function custom_source(request, response) {
                    var matcher = new RegExp($.ui.autocomplete.escapeRegex(request.term), "i");
                    response($.grep(projects, function(value) {
                        return matcher.test(value.label)
                            || matcher.test(value.desc);
                    }));
                }

                var auto = $( "#project" ).autocomplete({
                    minLength: 0,
                    source: custom_source, //projects o  "algo.php",
                    //                    search: "desc",
                    focus: function( event, ui ) {
                        $( "#project" ).val( ui.item.label );
                        return false;
                    },
                    select: function( event, ui ) {
                        $( "#project" ).val( ui.item.label );
                        $( "#project-id" ).val( ui.item.value );
                        $( "#project-description" ).html( ui.item.desc );
                        $( "#project-icon" ).attr( "src", "images/" + ui.item.icon );

                        return false;
                    }
                })
                .data( "autocomplete" )._renderItem = function( ul, item ) {                    
  //                  console.log(item);                    
//console.log($(this).val());
//console.log($("#project").val());

                    var mostrar = "<a>" + item.label + "<br>" + item.desc + "</a>";

                    if($("#project").val())
                        mostrar = __highlight(mostrar, $("#project").val());
                    
                    return $( "<li></li>" )
                    .data( "item.autocomplete", item )
                    .append( mostrar )
                    .appendTo( ul );
                };
                
//                console.info(auto);
                function __highlight(s, t) {
                  var matcher = new RegExp("("+$.ui.autocomplete.escapeRegex(t)+")", "ig" );
                  return s.replace(matcher, '<b style="color:blue">$1</b>');
                }

            });

Documentacion Oficial

Test Online: