ASP.NET jQuery MessageBox

Written by Bruno Pires on Março 9th, 2010

4qjbsb5pxk1lp7f1pf66w3ls2a O ASP.NET MessageBox  é um Web User Control que integra a framework jQuery , é um controlo extensível que possibilita de várias formas diferentes de apresentar MessageBox’s ao utilizador, utilizando duas tecnologias que em conjunto permitem a construção de um controlo dinâmico, extensível e de agradável utilização.

Disponível em http://jquerymessagebox.codeplex.com

Nesta primeira versão o controlo permite dois tipos diferentes de messagebox, uma do tipo “bubble” e outra standard.

O controlo possibilita a criação automática de um botão para interagir com o controlo, no entanto este é apenas opcional e pode-se desligar esta funcionalidade facilmente.

O design do controlo assenta nos plugins de jquery jQueryUI e plugin BlockUI, apenas com alguma modificações para estes se integrarem melhor num Web User Control de ASP.NET.

Vou passar agora a exemplificar a utilização do ASP.NET jQuery MessageBox com um exemplo para a MessageBox do tipo buble:

 

Página de exemplo que vai utilizar o controlo (default.aspx)

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="jQueryMessageBox._Default" %>
<%@ Register src="WebUserControl/MessageBoxControl.ascx" tagname="MessageBoxControl" tagprefix="uc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <uc1:MessageBoxControl ID="MessageBoxControl1" runat="server" />
    </div>
    </form>
</body>
</html>

 

 

Code behind (default.aspx.cs)


using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Text;

namespace jQueryMessageBox
{
    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            MessageBoxControl1.Title = "Test jQueryMessageBox";
            MessageBoxControl1.NameBtn = "Open Message";
            MessageBoxControl1.NameBtnMessageBox = "Close";
            MessageBoxControl1.tipo =
                WebUserControl.MessageBoxControl.typeMessageBox.growlMessageBox;

            MessageBoxControl1.Text = "Login succeeded!";
        }

        protected void btn_Click(object sender, EventArgs e)
        {
            MessageBoxControl1.btn_Click(sender, e);
        }
    }
}

 

Ao carregar no botão visível na imagem, pode-se visualizar a mensagem dirigida ao utilizador.

bubble_message

 

Por outro lado se o tipo de mensagem que nos interessa mostrar ao utilizador contém muita informação e obriga a uma maior atenção por parte do utilizador, podemos utilizar este tipo de MessageBox, alterando o tipo de mensagem a apresentar e alterando o ficheiro default.aspx.cs:

using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Text;

namespace jQueryMessageBox
{
    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            MessageBoxControl1.Title = "Test jQueryMessageBox";
            MessageBoxControl1.NameBtn = "Open Message";
            MessageBoxControl1.NameBtnMessageBox = "Close";

            /*Alteração do tipo de MessageBox*/
            MessageBoxControl1.tipo =
                WebUserControl.MessageBoxControl.typeMessageBox.centerMessageBox;

            var dados = new StringBuilder();

            dados.Append("jQuery is a lightweight cross-browser JavaScript library that emphasizes interaction between JavaScript and HTML. It was released in ");
            dados.Append("January 2006 at BarCamp NYC by John Resig. Used by over 27% of the 10,000 most visited websites, jQuery is the most popular ");
            dados.Append("JavaScript library in use today.");
            dados.Append("jQuery is free, open source software, dual-licensed under the MIT License and the GNU General Public License, Version 2. jQuerys ");
            dados.Append("syntax is designed to make it easier to navigate a document, select DOM elements, create animations, handle events, and develop Ajax ");
            dados.Append("applications. jQuery also provides capabilities for developers to create plugins on top of the JavaScript library. Providing this option, ");
            dados.Append("developers are able to create abstractions for low-level interaction and animation, advanced effects and high-level, theme-able widgets. This");
            dados.Append("contributes to the creation of powerful and dynamic web pages.");
            dados.Append("Microsoft and Nokia have announced plans to bundle jQuery on their platforms, Microsoft adopting it initially within Visual Studio for use ");
            dados.Append("within Microsoft ASP.NET AJAX framework and ASP.NET MVC Framework whilst Nokia will integrate it into their Web Run-Time platform.");

            MessageBoxControl1.Text = dados.ToString();
        }

        protected void btn_Click(object sender, EventArgs e)
        {
            MessageBoxControl1.btn_Click(sender, e);
        }
    }
}

 

E o resultado ao executar o click no mesmo botão é apresentado em baixo:

center_meaage

 

O projecto de teste e o código fonte do controlo está disponível em http://jquerymessagebox.codeplex.com

 

Fontes de informação úteis:

http://weblogs.asp.net/scottgu/archive/2008/11/21/jquery-intellisense-in-vs-2008.aspx

http://jquery.com/

http://jqueryui.com/

 

IE8 e o modo de compatibilidade

Written by Bruno Pires on Março 5th, 2010

internet-explorer Já foi anunciada a morte do Internet Explorer 6, a versão 7 do mesmo browser parece ter passado de moda muito depressa porque agora existe o IE8.

No passado mês de Fevereiro de 2010, no top 5 dos browsers mais utilizados na web estão as três últimas versões do Internet Explorer (IE6, IE7, IE8).

Esta situação provoca uma grande dor de cabeça nos developers de aplicações web, pois é necessário garantir a compatibilidade das aplicações com os browsers que detêm maior quota de mercado e ao mesmo tempo é necessário conseguir implementar nas aplicações novas funcionalidades disponíveis apenas nos browsers mais recentes.

O Internet Explorer 8 é a versão mais  recente disponibilizada pela Microsoft e a mais próxima aos standards do W3C, houve por isso mesmo alguma mudanças importantes. No entanto este browser apresenta algumas funcionalidades que garantem aos developers e às empresas a compatibilidade de este browser com as suas aplicações desenvolvidas para versões anteriores.

Está situação pode acontecer  em empresas que estejam a executar processos de migração para o Windows 7, e no qual não é possível instalar versões do browser anteriores à versão 8.

Existem várias formas de garantir a compatibilidade das aplicações com o IE8, como por exemplo, configurar no servidor web o modo de compatibilidade em cada uma das aplicações (mais info sobre como garantir a compatibilidade no IIS aqui, e no Apache aqui), no entanto neste artigo vou falar apenas nas funcionalidades que o IE8 disponibiliza para garantir este processo.

O Internet Explorer 8 tem 3 modos de funcionamento, estes são:

  • IE 8 Standards Mode – Este modo garante que as páginas vão ser processadas pelo browser utilizando os últimos  standards utilizados pela Microsost para esta versão de browser.

 

  • IE 7 Compatibility Mode – Com este modo o browser interpreta as páginas recorrendo ao DOCTYPE do IE7, contudo continua a ser utilizado o motor do IE8 para processar as páginas.

 

  • IE7 Mode – Com este modo as páginas vão ser executadas de acordo os standards do IE7 e o DOCTYPE do IE7.
Agora vou propor a análise de outro problema. Vamos supor  estamos a desenvolver uma aplicação web para uma máquina de windows 7 com IE8 com compatibility mode activo, não temos acesso ao servidor web nem podemos alterar a configuração do IE8.
 
Como desenvolver uma aplicação que utiliza todas vantagens que o IE8 disponibiliza e garantir que vai funcionar correctamente nesta situação?
 
Podemos garantir isso com uma alteração, incluindo  “meta tag” no cabeçalho da aplicação web que vai forçar o browser a sair do modo em que está a operar e processar as páginas da aplicação em causa com o motor e DOCTYPE do IE8 nativo.
 
Para isso basta inserir esta “meta tag” no cabeçalho das páginas:
<meta http-equiv="X-UA-Compatible" content="IE=8"/>
 
Veja as diferenças da utilização dos vários modos que o IE8 suporta em acção:
 
Nesta imagem podemos ver que o browser está configurado para correr em modo de compatibilidade, no entanto a ”meta tag” que está no cabeçalho obriga-o a comporta-se como o IE8 nativo, ou seja, a utilizar o motor de processamento do IE8 e o DOCTYPE do IE8.
 
IE8-mode
 

Nesta imagem podemos ver que o browser está configurado para correr em modo de compatibilidade, podemos verificar esta situação recorrendo ao Developer Tools, ferramenta incluída no IE8, que este está a utilizar o motor de IE8 em modo de compatibilidade e a utilizar o DOCTYPE do IE7.EmulateIE7-mode

 

Aqui podemos verificar que ao utilizar na “meta tag” o “IE=7”, o browser utiliza o modo e o DOCTYPE do IE7, embora nas preferências do browser esteja activo o modo de compatibilidade.

IE7-mode

 

Mais informação sobre o IE8 e os seus modos de funcionamento em:

http://msdn.microsoft.com/en-us/library/cc288325(VS.85).aspx#DCModes

 

7ª Reunião Presencial da Comunidade NetPonto

Written by Bruno Pires on Fevereiro 23rd, 2010

No dia 27/02/2010 será realizada a 7ª reunião presencial da comunidade NetPonto, em Lisboa. Para participar, efectue o registo de acordo com as instruções abaixo.

Agenda

09:30

Recepção dos participantes

10:00

Como Utilizar o Visual Studio Team System para Melhorar a Qualidade do SoftwarePedro Rosa

Nesta sessão o Pedro vai abordar temas como Unit Testing, Stress Testing, Load Testing, e Web Testing, utilzando as ferramentas que o Visual Studio Team System trás de base, e vai ser possivel perceber como automatizar os testes de forma a garantir critérios de qualidade. Será uma sessão prática, vocacionada para permitir perceber e discutir o que pode ser utilizado para melhorar o nosso processo de desenvolvimento.

11:15

Coffee-break

11:30

FluentNHibernate: Mapeamento Fluente e Automático para o NHibernateBruno Lopes

Nesta apresentação, o Bruno irá mostrar as potencialidades do FluentNHibernate, uma biblioteca open-sourceque permite efectuar o mapeamento entre classes e tabelas de bases de dados (ORM) com NHibernate, de umaforma fluente, utilizando convenções, e principalmente sem precisar criar os ficheiros XML (.HBM) doNHibernate.

12:45

Painel de Discussão

Nota: Ao final da reunião, normalmente escolhemos um restaurante próximo e fazemos um almoço em grupo para continuar o convívio e aproximar as pessoas. A participação é opcional.


Registo / Inscrição

Para participar, basta efectuar a inscrição através do site http://netponto-fevereiro-2010.eventbrite.com/.
A entrada é gratuita.
Qualquer dúvida / esclarecimento, entre em contacto connosco.


Local

Novabase (Lisboa)
Av. D. João II, Lote 1.03.2.3, Parque das Nações
1998-031 Lisboa

Clique para ampliar o mapa.

 

Tech Days 2010

Written by Bruno Pires on Fevereiro 9th, 2010

techdays2010_logo

Nos dias 20 a 22 de Abril de 2010, a Microsoft vai realizar no Lagoas Park o Tech Days 2010.

O evento vai contar com a presença de cerca de 40 oradores portugueses e estrangeiros para assegurar as mais de 90 sessões e 40 laboratórios técnicos sobre XNA, Visual Studio 2010, Expression Studio, Sharepoint, Silverlight, WPF, Office, Exchange, SQL Server, Windows 7, Windows server 2008 e Windows Azure.

Também vão existir sessões direccionadas à arquitectura de software, Best Practices no desenvolvimento de software e User Exprerience (UX).

Este é o maior evento em Portugal na área das TI, um evento a não perder neste ano de 2010.

Como não podia deixar de ser, a comunidade NetPonto vai estar representada no evento.

Até dia 5 de Março existe um desconto de 75€ na inscrição.   

Mais informações em: http://www.techdays2010.com/

 

Data Validator v1.0

Written by Bruno Pires on Janeiro 26th, 2010

A primeira versão do Data Validator foi lançada à quase três meses, hoje foi lançada a primeira versão estável desta biblioteca de funções.

Esta versão, além de algumas correcções e melhoramentos de código, contém uma nova funcionalidade, a validação de números de cartão de crédito dos sistemas AMEX, VISA e Mastercard, permitindo assim fazer uma despistagem de erros de introdução de dados antes de a validação final ser executada junto de uma instituição bancária, obtendo-se assim uma melhor performance, principalmente quando este tipo de validações são necessárias em aplicações web.

Além do binário, está disponível a solução com o código fonte em C# e Visual Studio 2008, e além do projecto DataValidator, está disponível na solução um projecto de testes unitários que permite testar as funções que a biblioteca disponibiliza.

using System;
using System.Text;
using System.Collections.Generic;
using System.Linq;
using Microsoft.VisualStudio.TestTools.UnitTesting;

namespace DataValidatorTests
{
    /// <summary>
    /// Summary description for CartaoCreditoTests
    /// </summary>
    [TestClass]
    public class CartaoCreditoTests
    {
        public CartaoCreditoTests()
        {
            //
            // TODO: Add constructor logic here
            //
        }

        [TestMethod]
        public void ValidaVisa()
        {
            string nrVisa = "4552 7204 1234 5677";
            var valida = new DataValidator.CartaoCredito();

            Assert.IsTrue(valida.IsValid(nrVisa,
                DataValidator.TipoCartao.visa));
        }

        [TestMethod]
        public void ValidaMasterCard()
        {
            string nrVisa = "5490 1234 5678 9128";
            var valida = new DataValidator.CartaoCredito();

            Assert.IsTrue(valida.IsValid(nrVisa,
                DataValidator.TipoCartao.mastercard));
        }

        [TestMethod]
        public void ValidaAmex()
        {
            string nrVisa = "378282246310005";
            var valida = new DataValidator.CartaoCredito();

            Assert.IsTrue(valida.IsValid(nrVisa,
                DataValidator.TipoCartao.amex));
        }
    }
}

 

Mais informações em:

http://datavalidator.codeplex.com/

 

6ª Reunião Presencial da Comunidade NetPonto

Written by Bruno Pires on Janeiro 18th, 2010

No próximo dia 23 de Janeiro de 2010 acontece a 6ª Reunião Presencial da Comunidade NetPonto em Lisboa, um evento presencial (e gratuito) que acontece todos os meses, normalmente composto por duas apresentações relacionadas com arquitectura e desenvolvimento de software na plataforma Microsoft .NET.

http://www.caioproiete.com/blogs/pontonet/image.axd?picture=netponto-header.png

A reunião começa a partir das 09:30 da manhã e termina por volta das 13:30. Abaixo está a agenda:

09:30 – Recepção dos participantes
10:00 – Geração de Código com o MyGenerationPaulo Correia
11:15 – Coffee-break
11:30 – Introdução ao Windows Presentation Foundation (WPF)Sara Silva
12:45 – Painel de Discussão

A entrada é gratuíta e para participar basta efectuar a inscrição de acordo com as instruções no site:
http://www.netponto.org

 

Novo ano, novo website!

Written by Bruno Pires on Janeiro 16th, 2010

website Há quem diga ano novo, vida nova. Eu decidi fazer o mesmo, mas desta vez ao meu website pessoal, o BlasterSystems.com tem cara lavada e roupa nova, ao estilo Web 2.0, coisa que está na moda nos dias que passam.

A tecnologia utilizada é quase a mesma de à 10 anos atrás, quando fiz o meu primeiro website pessoal, HTML, não à que complicar quando não é necessário,  só que desta vez acompanhei com CSS, umas horas bem passadas no Photoshop para desenhar o layout da moda, acrescentei a minha informação pessoal, os meus links, os meus projectos pessoais e académicos, um widget com o meu twitter actualizado em tempo real e finalmente, aqui está ele!

Só me resta dizer para me fazerem uma visita ao meu site e espero pelas vossas críticas no meu e-mail :)

 

ASP.NET Social Bookmarks

Written by Bruno Pires on Janeiro 13th, 2010

SocialBookmarksO ASP.NET Social Bookmarks é um Web User Control que    permite partilhar informação com as mais variadas redes sociais.

Os utilizadores conseguem interagir de forma simples com o controlo, e para os programadores é um componente reutilizável, flexível e escalável.

O componente é implementado como qualquer outro controlo de ASP.NET, contém CSS, ícones, possui também de um método para executar a compressão de Url, bem como a utilização das API’s das redes sociais implementadas para permitir ao programador um processo simples e eficiente de  publicação de informação nas principais redes sociais.

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title></title>
    <link href="Stylesheet.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <form id="SocialBookmarks" runat="server">
    <aspbook:Bookmarks ID="Bookmarks" runat="server"
        EnableViewState="False"
        ShowEmail="true" ShowTwitter="true" ShowFacebook="true"
        ShowFlickr="true" ShowPicasa="true"
        ShowGoogleBookmarks="true" ShowLinkedin="true"
        ShowMap="true" ShowFeeds="true"
        MyTitle="ASP.NET Social Bookmarks" ShowTitle="true"  />
    </form>
</body>
</html>

Além de ser simples e flexível, pode ser altamente customizado, possibilitando ao programador adicionar facilmente o acesso a novas redes sociais ou até novas funcionalidades.

As funcionalidades implementadas permitem publicar facilmente informação sem a necessidade de conhecer as API’s das redes sociais.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace AspNetSocialBookmarks
{
    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            Example();
        }

        public void Example()
        {
            Bookmarks.TweetToShare =
                    "Testing the new user control, ASP.NET Social Bookmarks";
            Bookmarks.TwitterUrlToShare = "http://www.blastersystems.com/blog";
            Bookmarks.TwitterUser = "brunoacpires";
            Bookmarks.TwitterTooltip = "Share on Twitter";
        }
    }
}

twitter

O ASP.NET Social Bookmarks Web User Control e o código fonte está disponível em http://socialbookmarks.codeplex.com/ sobre a licença LGPL.

 

Eventos e Delegates em .NET

Written by Bruno Pires on Novembro 24th, 2009

Este artigo tem como objectivo esclarecer o que é um delegate e um evento, bem como exemplificar a implementação e a sua utilização numa aplicação.

Delegates

Um delegate é um tipo de referência utilizado para encapsular um método com uma determinada assinatura.

Exemplo:


public delegate string DevolveStringDelegate();

Esta declaração de um delegate pode encapsular qualquer método que não tenha parâmetros de  entrada e devolva um objecto do tipo String.

 

Em exemplo de utilização de delegates

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

namespace Delegates
{
    public class Program
    {
        //Declaração de um delegate que tem como assinatura 
        //uma variável do tipo String 
        delegate void testeDelegate(string s);

        static void Main(string[] args)
        {
            //texto que vai ser escrito na consola  
            string texto= "estou a ver um delegate a funcionar!";
            //Cria-se uma instância do delegate e no construtor passa-se 
            //como parâmetro o nome do método que se quer utilizar, neste  
            //caso o método é o metodoComAssinaturaString porque contém 
            //a mesma assinatura que o delegate, tem como parâmetro  
            //uma variável do tipo String e devolve void
            testeDelegate t = new testeDelegate(metodoComAssinaturaString);

            //invocação do método que o delegate está a referênciar 
            //caso esse método tenha parâmetros, estes são inseridos 
            //ao utilizar o método invoke do delegate 
            t.Invoke(texto);
        }

        public static void metodoComAssinaturaString(string texto)
        {
            Console.WriteLine(texto);
        }
    }
}

E ao executar o programa…

testeDelegate

 

Eventos

Agora que está esclarecido o que é um delegate e como se implementa, vamos utilizar esse conceito e avançar para a implementação de um evento.

Um evento é uma acção que é despoletada quando uma condição que está  estabelecida se torna verdadeira.

Diagrama_Eventos_e_Delegates

Seguindo o diagrama acima apresentado, vou dar um exemplo de um evento. Temos um calendário, como o google calendar (quem publica os eventos) por exemplo, que permite a inserção de uma reunião, depois configuramos o google calendar para nos enviar um e-mail a avisar da reunião (subscrever o evento), no entanto podemos não ter acesso ao e-mail na hora que está marcada a reunião, assim, configuramos o google calendar para nos enviar uma SMS para além do e-mail (subscrever o evento).

Assim, quando chega a hora da reunião recebemos o aviso por dois canais diferentes, email e SMS, e que contém a mesma informação (EventArgs) no entanto a fonte da informação é a mesma, o google calendar!

Vamos então demonstrar um exemplo prático

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

namespace DelegatesAndEvents
{
    //classe que descreve a informação a ser publicada
    public class ProcessarInformacaoEventArgs : EventArgs
    {
        private int _progresso;

        public int progresso
        {
            get { return _progresso; }
            set { _progresso = value; }
        }

    }
}
using System;
using System.Collections.Generic;
using System.Text;

namespace DelegatesAndEvents
{
    //declaração do delegate que tem como parametro a 
    //classe ProcessarInformacaoEventArgs
    //que é onde vai ser guardada a informação que é 
    //enviada quando é disparado o evento
    public delegate void TickHandler(object sender,
        ProcessarInformacaoEventArgs p);

    //classe que publica o evento
    public class ProcessarInformacao
    {
        //declaração do evento que utiliza o 
        //delegate TickHandler
        public event TickHandler tick; 

        //Este método serve apenas de exemplo 
        //de processamento de informação
        public void ProcessarInfo()
        {
            long time = 100000000000;

            TimeSpan t = new TimeSpan(time);

            while (t.Ticks > 0)
            {
                t = t.Subtract(new TimeSpan(1000));
                long aux = time - t.Ticks;
                long res = (aux * 100) / time;

                //sempre que executa um ciclo, vai 
                //ser disparado um evento
                //que vai ser recebido por todas as 
                //classes que o subscreveram
                //e envia a informação processada 
                //por cada ciclo da estrutura
                //de decisão while
                OnTick((int)res);
            }
        }

        protected void OnTick(int p)
        {
            //chama o construtor com parametros da 
            //classe ProcessarInformacaoEventArgs
            //e invoca o evento com a informação que foi recebida
            ProcessarInformacaoEventArgs args = new ProcessarInformacaoEventArgs(p);
            tick(this,args);
        }
    }
}

 

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

namespace DelegatesAndEvents
{
    //programa que subscreve o evento da classe ProcessarInformacao
    public class Program
    {
        static void Main(string[] args)
        {
            ProcessarInformacao p = new ProcessarInformacao();

            //Subscreve o evento
            p.tick += new TickHandler(p_tick);

            //Executar o processo que vai disparar o evento
            p.ProcessarInfo();
            Console.Read();
        }

        //Aqui é processada a informação enviada quando o evento é disparado
        static void p_tick(ProcessarInformacaoEventArgs p)
        {
            Console.WriteLine(p.progresso);
            Console.Clear();
        }
    }
}

 

Resultado da aplicação – Apresenta a percentagem de informação já processada.

testeEventos

Pode descarregar todos os projectos de este post aqui.

Demos desenvolvidas em VS2005.

 

Data Validator RC2

Written by Bruno Pires on Novembro 23rd, 2009

Está disponível para download a versão RC2 do Data Validator.

Lista de bugs corrigidos na versão RC2:

-Verificações das strings de input nos métodos caso sejam do tipo null
-Corrigido bug na função WebServiceRequestUri
-Bug de encoding no processamento do ficheiro XML corrigido