Para os que ja sabiam, nenhuma novidade. Para os que estão migrando de forms para web somente agora, um espanto!
Como todos nós sabemos, é completamente impossível criarmos um grande web project com lógica apenas do lado do servidor. Sempre vai ter aquele javascript besta pras tarefas mais pentelhas do mundo e não incluo apenas validações mais também JSON (JavaScript Object Notation). Para os mestres do php como o grande idealizador do nosso site, Jackson Caset, “frameworks” como JQuery são triviais devido as funções de Ajax/DOM, compatibilidade entre navegadores e melhor implementação de css’s1/2/3. O php é direto, rápido e produtivo e o jquery combina com tudo isso, apesar deste último possuir uma learning curve um pouco maior que a do php.
Porém, para os javeiros e programadores .Net, que entraram no ciclo interminável de criação de milhares de classes, cada uma com suas responsabilizações, o uso do JQuery e em si do próprio Javascript, tem se tornado difícil e despadronizado, afinal não é uma linguagem orientada a objeto, sem recursos de herança(classes, interfaces, eventos, delegates).
Para resolver este problema, a Microsoft criou o Microsoft Ajax Library, uma biblioteca javascript que permite que seus aspx contenham arquivos javascript embutidos orientados a objeto e que possuem total compatibilidade com user controls.
O arquivo javascript é todo baseado em namespaces (packages do java), e cada necessita registro via classe type, ou seja até para as tarefas mais triviais o conceito de métodos e referência ja deixa qualquer desenvolvedor OO com carinha de bobo.
Demonstraremos agora, um exemplo simples de um componente que realiza a verificação da segurança da senha do usuário baseada na quantidade de caracteres. Claro, via ICallbackEventHandler podemos obter este comportamento, mas lembrando que esta interface nos permite que apenas uma string seja setada (não vale serializar em XML haha!!!)
[code lang=”js”]
Type.registerNamespace("AjaxOrientadoObjeto");
//cria constructor de um componente
AjaxOrientadoObjeto.ComponenteDeSenha = function() {
AjaxOrientadoObjeto.ComponenteDeSenha .initializeBase(this);
}
[/code]
Aqui registramos o nosso namespace e criamos uma definição de construtor de um componente. Ali dentro, chamamos o construtor da classe pai do componente a qual estamos herdando.
[code lang=”js”]
//define a classe e suas propriedades
AjaxOrientadoObjeto.ComponenteDeSenha .prototype = {
initialize: function() {
//inicialização
AjaxOrientadoObjeto.ComponenteDeSenha .callBaseMethod(this, ‘initialize’);
},
returnPasswordStrength: function(password) {
var strPass = new String(password.toString());
if (strPass.length < 5 ) {
return "Senha fraca";
}
else {
if (strPass.length < 8 ) {
return "Senha média";
}
else {
return "Forte";
}
}
},
dispose: function() {
//adiciona código para liberação de recursos
AjaxOrientadoObjeto.ComponenteDeSenha .callBaseMethod(this, ‘dispose’);
}
}
[/code]
WoW! Temos um dispose, um initialize, propriedades e método implementado.
O ultimo passo agora é registrarmos no namespace Sys.Component (que diz a respeito do Control que iremos atribuir funcionalidade).
[code lang=”js”]
AjaxOrientadoObjeto.ComponenteDeSenha .registerClass(
‘AjaxOrientadoObjeto.ComponenteDeSenha ‘, Sys.Component);
//este bloco é necessário para notificar que o script foi realmente carregado
if (typeof(Sys) !== ‘undefined’) Sys.Application.notifyScriptLoaded();
[/code]
Feito isso, crie seu aspx e adicione o ScriptManager (dentro do form, é claro) a qual referenciará seu javascript.
Feito isso, vamos a marcação aspx!
<div style="font-size: large; font-weight: bold">User Login</div>
<hr />
<br />
User Name:
<br />
<asp:TextBox ID="TextBoxUserName" runat="server" Width="200"></asp:TextBox>
<br />
Password:
<br />
<asp:TextBox ID="TextBoxPassword" runat="server"
TextMode="Password" onkeyup=”_OnKeypress()” Width="200"></asp:TextBox>
<asp:Label runat="server" Text=""></asp:Label>
<br />
<input id="Button1" value="Submit" />
Repare que a TextBoxPassword, apesar de estar marcada como controle do servidor, usa um evento onkeyup, pois sua
renderização html será um input type=”text”.
E agora, chegou a hora. O grande momento em que o programador asp.net pode criar tags script usando código orientado a objeto.
[code lang=”js”]
function _OnKeypress() {
var checker = new AjaxEnabled.PasswordStrengthComponent();
var pass = document.getElementById("TextBoxPassword").value;
var strength = checker.returnPasswordStrength(pass);
document.getElementById("LabelStrength").innerText = strength;
}
[/code]
É eu sei. Não é muito diferente do que você esperava. O grande poder desta library só é visto quando a complexidade do ambiente é alta, mas de qualquer forma, criamos classes, métodos, propriedades, variáveis, disposes, initializations, e overrides.
Espero que tenham gostado. E como diz o grande Macoratti :
Eu sei, é so asp.net. Mas eu gosto 😉
Fortíssimo abraço.
