¿Cómo utilizar confirm() de javascript? Alerta de confirmación

La función confirm() de javascript nos permite abrir una alerta en la cual tenemos la opción de confirmar o rechazar alguna pregunta, y dependiendo de la respuesta podemos hacer una acción u otra.

Se utiliza de la siguiente manera:


//la función confirm nos regresa true si es seleccionado si, sino nos regresa false.
if(confirm("¿Eres un pato?")){
alert("cua cua")
}else{
alert("no eres pato")
}

Crear un archivo de Excel en C# .Net sin utilizar las librerías de Office #SpreadsheetLight

Para crear un Excel sin utilizar los dlls de office podemos hacer uso de una librería OpenSource de nombre SpreadsheetLight que creó el MIT.

Primero podemos descargar la librería de la su página: http://spreadsheetlight.com/download/

O podemos descargarla mediante Nuget poniendo su nombre (SpreadsheetLight).

Esta librería tiene una dependencia y es importante agregar la librería DocumentFormat.OpenXml pero tiene que ser la versión 2.0 ya que la más nueva 2.5 no me corrió. Para eso pueden dar clic en este enlace http://www.microsoft.com/en-us/download/details.aspx?id=5124 y pueden descargar la versión 2.0. Ya instalado ese paquete ya solo van a la ruta donde se instaló que casi siempre es c:/Program Files/Open Xml SDK/V2.0/ y ya de ahí solo la agregan a sus referencias al proyecto.

A continuación pongo la siguiente clase como ejemplo con sus comentarios paso por paso.

using SpreadsheetLight;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;

namespace CreacionDeExcelSinOffice
{
    class CreadorExcel
    {

        private string rutaArchivoCompleta = "";

        public CreadorExcel(string nombreArchivo)
        {
            //obtenemos la ruta de nuestro programa y concatenamos el nombre del archivo a crear
            rutaArchivoCompleta = AppDomain.CurrentDomain.BaseDirectory + "/" + nombreArchivo;

        }

        public void CrearExcel()
        {
            try
            {
                //creamos el objeto SLDocument el cual creara el excel
                SLDocument sl = new SLDocument();

                //creamos las celdas en diagonal
                //utilizando la función setcellvalue pueden navegar sobre el documento
                //primer parametro es la fila el segundo la columna y el tercero el dato de la celda
                for (int i = 1; i <= 10; ++i) sl.SetCellValue(i, i, "patito "+i);

                //Guardar como, y aqui ponemos la ruta de nuestro archivo
                sl.SaveAs(rutaArchivoCompleta);

            }catch(Exception ex){
                Console.WriteLine("Ocurrio una Excepción: "+ex.Message);
            }

        }

    }
}

Y de esta manera hacemos uso de la anterior clase.


using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;

namespace CreacionDeExcelSinOffice
{
    class Program
    {
        static void Main(string[] args)
        {
            //creamos la clase enviandole el nombre del archivo que deseemos
            CreadorExcel oCreadorExcel = new CreadorExcel("patito.xlsx");
            //ejecutamos el metodo que crea el excel
            oCreadorExcel.CrearExcel();

            //Esto ultimo solo para verificar que todo fue bien.
            Console.WriteLine("Se creo el archivo, presiona una tecla para terminar");
            Console.ReadKey();
        }
    }
}

Con esta librería pueden hacer miles de cosas como poner imágenes, gráficos, colores etc. Pero para eso pueden ir directo a este enlace y ver los ejemplos que el mismo MIT da de ayuda.

¿Cómo obtener los datos de una conexión de base de datos guardada en app.config o web.config? c# csharp #visualstudio

Para obtener los datos de conexión a una base de datos que tenemos guardados en nuestro archivo app.config o web.config (dependiendo el tipo de proyecto), haremos uso de la clase ConnectionStringSettingsCollection y ConfigurationManager.

En nuestro archivo de configuración (app.config o web.config), se encuentra una sección en la cual estan guardadas las cadenas de conexión, por ejemplo:

<configuration>
  <configSections>
  </configSections>
  <connectionStrings>
     <add name="conexionPatito" connectionString="Data 
     Source=localhost;Initial Catalog=basededatosPatito;User 
     ID=pato;Password=patofeo" providerName="System.Data.SqlClient" />
   </connectionStrings>
</configuration>

Para acceder a esos datos y saber cual es el servidor o el nombre de la base de datos, a continuación escribo una clase comentada paso por paso:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Configuration;

namespace Pato {
    /// <summary>
    /// Clase encargada de la capa de datos del modulo de configuracion de conexion
    /// Héctor de León
    /// 07/01/2013
    /// </summary>
    class Conexion {
        //atributos
        public string servidor = "";
        public string usuario = "";
        public string password = "";
        public string baseDeDatos = "";

        //nombre de la conexión a modificar
        private string nombreConexion = "conexionPatito";

        /// <summary>
        /// obtiene los datos de la conexión para ser utilizados en el formulario
        /// </summary>
        /// <returns></returns>
        public bool getData() {
            bool exito = false;
            // se obtienen las conexiones
            System.Configuration.ConnectionStringSettingsCollection connections = ConfigurationManager.ConnectionStrings;

            //si existe por lo menos una conexión continuamos
            if (connections.Count != 0) {

                //Recorremos las conexiones existentes
                foreach(ConnectionStringSettings connection in connections) {
                    //asignamos el nombre
                    string name = connection.Name;
                    //obtenemos el proveedor, solo por demostración, no lo utilizaremos ni nada.
                    string provider = connection.ProviderName;
                    //obtenemos la cadena
                    string connectionString = connection.ConnectionString;

                    //comparamos el nombre al de nuestro atributo de la clase para verificar si es la cadena
                    //de conexión que modificaremos
                    if (name.Equals(nombreConexion)) {

                        //separamos la conexión en un arreglo tomando ; como separador
                        string[] sC = connectionString.Split(';');
                        foreach(String s in sC) {

                            //separamos por el simbolo = para obtener el campo y el valor
                            string[] spliter = s.Split('=');
                            //comparamos los valores
                            switch (spliter[0].ToUpper()) {

                                case "DATA SOURCE":
                                    servidor = spliter[1];
                                    break;
                                case "USER ID":
                                    usuario = spliter[1];
                                    break;
                                case "PASSWORD":
                                    password = spliter[1];
                                    break;
                                case "INITIAL CATALOG":
                                    baseDeDatos = spliter[1];
                                    break;

                            }
                        }

                    }
                }
            } else {
                Console.WriteLine("No existe la conexión");

            }

            return exito;
        }
    }
    

Ahora de esta manera la podemos utilizar:


//creamos nuestro objeto
Conexion oConexion = new Conexion();

//ejecutamos el metodo
oConexion.getData();

//imprimimos el resultado
Console.WriteLine("servidor " + oConexion.servidor + " base de datos: " + oConexion.baseDeDatos + " usuario: " + oConexion.usuario + " password: " + oConexion.password);

Nota: Recuerden agregar arriba: using System.Configuration;

Si tienen alguna duda en comentarios pueden preguntar.

Y como siempre el código es para explicar no es la manera formal de hacerlo (por los atributos públicos :().

Realizar una conexión al correo para ver los mails con C# .Net. #gmail #pop3 #OpenPop.Net

En esta entrada tratare el tema de realizar una conexión por el protocolo Pop3 para poder leer nuestro correo electrónico, en este caso utilizare una cuenta de Gmail y obtendré los correos de la bandeja de entrada de la misma.

Para poder conectarnos haremos uso de una librería llamada OpenPop.Net que ya realiza la conexión de una manera rápida. La podemos descargar desde su página, o directamente de Nuget en visual studio buscándola por su nombre.

Es importante que realicemos en nuestra cuenta de Gmail los siguientes cambios, ya que Gmail cuenta con restricciones a clientes externos para leer los mails.

Primero(con sesión creada en gmail para hacer estos cambios claro) debemos activar la opción de permitir conexiones de aplicaciones externas en la siguiente liga:

https://www.google.com/settings/security/lesssecureapps

Seleccionamos Activar y Guardar.

La segunda configuración es opcional y es para que Gmail nos permita descargar varias veces los mensajes aunque sea ya leído o ya descargado, basta con que vallamos a la configuración de Gmail y seleccionemos la siguiente opción y demos guardar.

gmail configuracion

Una vez tengamos la librería y la configuración en Gmail podemos hacer uso de la siguiente clase que he escrito y comentado pasó por paso:


using OpenPop.Mime;
using OpenPop.Pop3;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.Remoting.Messaging;
using System.Text;

namespace Sincronizador_SMTP.Business.Connect
{
 /// <summary>
    /// clase que se conecta por smtp
    /// </summary>
    class ConnectPop3
    {
        //usuario/mail de gmail
        private string username = "[email protected]";
        //password
        private string password = "tupassword";
        //el puerto para pop de gmail es el 995
        private int port = 995;
        //el host de pop de gmail es pop.gmail.com
        private string hostname = "pop.gmail.com";
        //esta opción debe ir en true
        private bool useSsl = true;

        public List<Message> getMensajes()
        {
            try
            {

                // El cliente se desconecta al terminar el using
                using (Pop3Client client = new Pop3Client())
                {
                    // conectamos al servidor
                    client.Connect(hostname, port, useSsl);

                    // Autentificación
                    client.Authenticate(username, password);

                    // Obtenemos los Uids mensajes
                    List<string> uids = client.GetMessageUids();

                    // creamos instancia de mensajes
                    List<Message> lstMessages = new List<Message>();

                    // Recorremos para comparar
                    for (int i = 0; i < uids.Count; i++)
                    {
                           //obtenemos el uid actual, es él id del mensaje
                           string currentUidOnServer = uids[i];

                            //por medio del uid obtenemos el mensaje con el siguiente metodo
                            Message oMessage = client.GetMessage(i + 1);

                            //agregamos el mensaje a la lista que regresa el metodo
                            lstMessages.Add(oMessage);

                    }

                    // regresamos la lista
                    return lstMessages;
                }
            }

            catch(Exception ex){
               //si ocurre una excepción regresamos null, es importante que cachen las excepciones, yo
               //lo hice general por modo de ejemplo
                return null;
            }
        }
}

Y de esta manera utilizamos la clase y recorremos los mensajes, y a su vez mostramos el asunto para probar que si corresponde a lo que tenemos en nuestra cuenta de Gmail.


//creamos el objeto
ConnectPop3 oCP3 = new ConnectPop3();

//invocamos el metodo para obtener mensajes
List<OpenPop.Mime.Message> lstMensajes = oCP3.getMensajes();

//recorremos y mostramos el asunto
foreach(OpenPop.Mime.Message oMensaje in lstMensajes){
                Console.WriteLine(oMensaje.Headers.Subject);
}

Nota: Pop3 al igual que IMAP es un protocolo para leer mails, si deseamos enviar mails debemos conectarnos con el protocolo SMTP.

¿Cómo obtener un hijo por su posición con jquery? #nth-child

Para obtener un hijo por su posición con jquery haremos uso de la pseudo-clase de css nth-child, esta pseudo-clase sirve para seleccionar un elemento hijo por su posición la cual tiene la siguiente sintaxis: grupoElementos:nth-child(posición).

A continuación un ejemplo de cómo se utiliza:

Html

  <div id="muchosDivs">
    	<div>1</div>
        <div>2</div>
        <div>3</div>
        <div>4</div>
        <div>5</div>
        <div>6</div>
        <div>7</div>
        <div>8</div>
        <div>9</div>
        <div>10</div>
  </div>

Jquery

$(function(){

        //seleccionamos del conjunto de divs hijos de #muchosDivs el tercer div
	$divTres=$("#muchosDivs div:nth-child(3)");

        //mostramos el div seleccionado
	alert($divTres.html())

})

La función alert() nos mostrara el número 3.

Realizar una búsqueda en una columna en específico de una tabla con #jquery.

Para realizar una búsqueda en una columna en específico de una tabla podemos hacer uso del filtro eq que nos sirve para seleccionar el número de la columna de elementos, de esta manera podemos realizar la búsqueda solo por una columna en particular.

En el siguiente ejemplo muestro como se puede buscar un valor en la primera columna, y después obtener la fila entera (por medio de la función parent() de jquery) para mostrar su resultado (o lo que deseen hacer ustedes con esos datos).

En seguida muestro el ejemplo en el cual pueden ver el resultado, y debajo el código que hace posible esta funcionalidad:

Ejemplo:

Html


<label>Captura un código</label>
	<input type="text" id="busqueda"/>
    <input onclick="jsBuscar();" type="button" value="Buscar" /><br /><br />

    <table id="miTabla">
    	<tr>
        	<th>Codigo</th>
            <th>Nombre</th>
            <th>Edad</th>
        </tr>
        <tr>
        	<td>1</td>
            <td>Pedro</td>
            <td>34 años</td>
        </tr>
    	<tr>
        	<td>2</td>
            <td>Luis</td>
            <td>34 años</td>
        </tr>
        	<tr>
        	<td>3</td>
            <td>Juan</td>
            <td>15 años</td>
        </tr>
        	<tr>
        	<td>4</td>
            <td>Jesus</td>
            <td>20 años</td>
        </tr>
        	<tr>
        	<td>5</td>
            <td>Pablo</td>
            <td>23 años</td>
        </tr>
    </table>

    <div id="mostrarResultado">

    </div>

Jquery


//función que realiza la busqueda
function jsBuscar(){

		//obtenemos el valor insertado a buscar
		buscar=$("#busqueda").prop("value")

		//utilizamos esta variable solo de ayuda y mostrar que se encontro
		encontradoResultado=false;

		//realizamos el recorrido solo por las celdas que contienen el código, que es la primera
		$("#miTabla tr").find('td:eq(0)').each(function () {

			 //obtenemos el codigo de la celda
			  codigo = $(this).html();

			   //comparamos para ver si el código es igual a la busqueda
			   if(codigo==buscar){

					//aqui ya que tenemos el td que contiene el codigo utilizaremos parent para obtener el tr.
					trDelResultado=$(this).parent();

					//ya que tenemos el tr seleccionado ahora podemos navegar a las otras celdas con find
					nombre=trDelResultado.find("td:eq(1)").html();
					edad=trDelResultado.find("td:eq(2)").html();

					//mostramos el resultado en el div
					$("#mostrarResultado").html("El nombre es: "+nombre+", la edad es: "+edad)

					encontradoResultado=true;

			   }

		})

		//si no se encontro resultado mostramos que no existe.
		if(!encontradoResultado)
		$("#mostrarResultado").html("No existe el código: "+buscar)
}

Nota: eq sirve para seleccionar un indice de los elementos seleccionados, como en un arreglo los corchetes []

Detectar el control inalámbrico de Xbox en C# .Net sin utilizar XNA

Esta entrada está dedicada para enseñar cómo se puede detectar los controles de XBOX inalámbricos conectados a un receptor inalámbrico (PC Wireless  Gaming  Receiver) con C# .Net sin utilizar XNA.

controll xbox y receptor

Para poder detectar los controles haremos uso de una librería externa de nombre SlimDX, esta librería la podemos bajar por medio de Nuget o de su pagina http://slimdx.org/. SlimDX es una librería Open Source que nos permite construir programas usando DirectX, y una de sus funciones es detectar los Joystick.

También utilizaremos la clase GamepadState que ha hecho Renaud Bédard y podemos descargarla de su sitio, él ya nos facilita lo necesario para detectar los botones del control, palancas etc. Igual anexo la clase en esta liga, solo tienen que copiar y pegar el código en una clase del proyecto de Visual Studio.

Ahora que ya tenemos la librería SlimDX y la clase GamepadState solo nos queda comenzar a utilizar y detectar el control de la siguiente manera:

using SlimDX.XInput;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;

namespace ControlXBox
{
    class Program
    {
        static void Main(string[] args)
        {
            //creamos una instancia GamepadState y le enviamos la constante de control numero 1
             GamepadState control = new GamepadState(UserIndex.One);

             //ahora detectamos si el controll esta conectado
             if (control.Connected)
             {
                 Console.WriteLine("El control esta conectado");

                 //creamos un ciclo infinito solo para detectar el control cada que presionemos un boton

                 while(true){

                     //detectamos si se realizo una modificación, se presiono un botón o se movio una palanca etc.
                     control.Update();

                     //imprimimos el boton presionado en consola
                     Console.WriteLine(control.Controller.GetState().Gamepad.Buttons.ToString());

                 }

             }
             else
             {
                 //Si el control no esta conectado mostramos mensaje de que no esta conectado :(
                 Console.WriteLine("El control NO esta conectado");
                 Console.ReadLine();

             }

        }

    }
}

Cree un proyecto de consola de Visual Studio y aquí plasmo el resultado en video para que puedan ver que funciona bien:

Cualquier duda en los comentarios pueden preguntar.

Clonar una imagen a un conjunto de divs utilizando #jquery, #javascript y #canvas.

Esta entrada veremos cómo podemos clonar una imagen (jpg, png) a código html, es decir, pintar por medio de divs una imagen deseada.

Recalco que no es muy útil hacer esto, la utilidad de esta entrada es que vean como por medio de canvas, se puede recorrer una imagen y a su vez obtener pixel a pixel de esta.

A continuación pongo el ejemplo corriendo, solo den clic en el botón “dibuja en HTML” y esperen ya que tarda algunos segundos en realizar la acción.

Y podemos ver en esta imagen que son divs sin duda:

div clonados con canvas

Ahora lo interesante, el código que nos ayuda a crear la magia, y como siempre con sus respectivos comentarios:

CSS

 
.pixel{			
float:left;			
width:1px;			
height:1px;		  
}

HTML

 <img id="imagen" width="200" height="200"  src="../img/images/galaxia.jpg" />
    <br />

<input type="button" value="dibuja en HTML" onclick="dibuja()" />
<div id="mensaje" style="font-weight:bold"></div>

<div id="imagenHTML"></div>

Javascript

//función que ejecuta el botón
function dibuja(){
	$("#mensaje").html("Espere un momentos, se esta dibujando la imagen!");

	//comienza a dibujar despues de 1 segundo, para mostrar el mensaje anterior.
	setTimeout(dibujar,1000)

}

//Esta es la función que realiza la acción principal
//funcion que realiza la clonacion de la imagen a divs
function dibujar(){
	//guardamos la imagen en una variable
	var img = $('#imagen')[0];

	//creamos un canvas y le definimos el mismo tamaño a la imagen
	var canvas = $('<canvas/>')[0];
	canvas.width = img.width;
	canvas.height = img.height;
	//Le asignamos la imagen al canvas, ya que nos ayudara el canvas para poder obtener los pixeles de la imagen real
	canvas.getContext('2d').drawImage(img, 0, 0, img.width, img.height);

	//definimos el tamaño del div para que sea el mismo ancho de la imagen
	//de esta manera al pintar los divs hijos que representaran los pixeles
	//formen la imagen y den el salto automatico cuando corresponda
	$("#imagenHTML").html("")
	$("#imagenHTML").css({"width":canvas.width+"px"})

	//realizamos el recorrido de los pixeles del canvas tomando el ALTO como maximo valor a recorrer
	for(y=0;y<canvas.height;y++){

		//realizamos el recorrido de los pixeles del canvas tomando el ANCHO como maximo valor a recorrer
		for(x=0;x<canvas.width;x++){
			//obtenemos el color en rgb del pixel actual
			var rgb = canvas.getContext('2d').getImageData(x,y,x+1,y+1).data;
			//obtenemos el rojo verde y azul del rgb anterior
			 var red = quitaCero(rgb[0].toString(16), 2);
             var green = quitaCero(rgb[1].toString(16), 2);
             var blue = quitaCero(rgb[2].toString(16), 2);

			 //obtenemos el hexadecimal con lso colores anteriores
             var hex = red + green + blue;

			 //y por ultimo creamos un div con la clase pixel que tiene el color hexadecimal
			$("#imagenHTML").append("<div class='pixel' style='background:#"+hex+"'></div>");
		}

	}

	//se termino de pintar y borramos el mensaje de texto que se puso al inicio
	$("#mensaje").html("");
}

//Función que nos ayuda a agregar al arreglo un 0 a una cadena cuando la longitud recibida no se cumple
var quitaCero = function(num, longitud) {
    return Array(longitud + 1 - (num + '').length).join('0') + num;
}

Quizá no sirva de mucho hacer esto ya que es lento, pero les servirá para algo el saber que pueden recorrer una imagen por sus pixeles por medio de javascript y el grandioso elemento agregado en html5 de nombre canvas.
Igual les anexo la liga directa al script para que puedan ver el código directamente: clic aquí.