Intel XDK New

É recompensador quando a tecnologia cumpre a sua função e nos mostra resultados no tempo esperado.

“The Intel® XDK NEW development system is designed for developers who want to use their HTML5 expertise to build hybrid HTML5 apps for mobile devices (e.g., phones and tablets) and other platforms that host HTML5 web apps (such as a Google Chrome* extension or a mobile web site).”

No caso deste Intel XDK New demorou mais uns minutos: embora a interface de instalação (install_GUI.sh) diga que apenas o Ubuntu 12.04 é suportado, no arquivo vem um rpm.

O download pode ser feito no site oficial. Depois de descomprimir o arquivo, encontrarão o rpm no directório “rpm” (será qualquer coisa como intel-xdk-0154-2.0-0.x86_64.rpm, sendo que o nome do arquivo depende da versão)

A instalação decorrerá sem problemas: basta executar na linha de comandos

$ sudo yum install intel-xdk-0154-2.0-0.x86_64.rpm

Depois disto são precisos mais dois pequenos truques:

  1. corrigir permissões:
    $ sudo chmod 0755 /opt/intel/XDK/
  2. corrigir o symlink libudev.so.0: no meu caso a correcção passou por
    $ sudo unlink libudev.so.0; sudo ln -s /usr/lib64/libudev.so.1 /opt/intel/XDK/libudev.so.0

Depois disto, a oferta da Intel cumpriu.
Arrancou
interface principal do Intel(R) XDK Newe em poucos minutos deu frutos (Sapo A5)

Screenshot da aplicação a correr num Sapo A5

Safari Web developer tools

Apesar do post onde relato a excelente experiência com Opera Unite, enquanto developer contínuo a lidar com os vários browsers: Firefox, Safari e agora Opera.

O  Firebug é um add-on para Firefox imprescindível para qualquer developer que permite a edição, debug e monitorização de CSS, HTML e JavaScript em tempo real e em qualquer página.

Usando o Firefox como referência no desenvolvimento, o Firebug é a ferramenta perfeita (ou muito perto disso) particularmente para debug de JavaScript.

No entanto quando lidamos com implementações particulares de JavaScript, como é o caso do objecto XMLHttpRequest, surge a necessidade de analisar o comportamento do nosso código nos vários browsers. Portanto pretendemos algo semelhante ao Firebug para Safaria e Opera.

Para o primeiro, Safari, o caso é simples: o pessoal da Apple deixou um mimo “escondido”. Para o activar basta abrir um terminal e executar o seguinte comando (todas as instâncias do Safari devem ser fechadas):
defaults write com.apple.Safari IncludeDebugMenu 1
A partir daqui ficará disponível um novo menu: “Develop”, com um vasto leque de opções incluindo o debugger de JavaScript.

No caso do Opera Unite não é necessário qualquer tipo de mágica: basta aceder aos menus Tools > Advanced > Developer Tools.

Safari Developer Tools

Safari Developer Tools

Opera Developer Tool

Opera Developer Tool

XForms 1.1

A 20 de Outubro último foram publicadas as recomendações do consórcio web relativamente às XForms 1.1 (anúncio aqui).
Noutra altura fiz uma pequena introdução ao uso das XForms que podem consultar aqui.

“Forms are an important part of the Web, and they continue to be the primary means for enabling interactive Web applications. Web applications and electronic commerce solutions have sparked the demand for better Web forms with richer interactions. XForms is the response to this demand, and provides a new platform-independent markup language for online interaction between a person (through an XForms Processor) and another, usually remote, agent.”

in http://www.w3.org/News/2009#entry-8633

Sinceramente acho o conceito/filosofia adequado às necessidades das aplicações de hoje.
O princípio de nunca confiar no input do utilizador conduz a um processamento/validação de dados cada vez mais minucioso. Pessoalmente não restrinjo esta validação ao lado do cliente. Preciso garantir que caso esta seja contornada, ainda assim os dados serão alvo de validação do lado do servidor, o que pode parecer redundante e desnecessário mas, na minha opinião, é uma preocupação válida.

Com as XForms esta tarefa fica muito simplificada/facilitada.
Resta aguardar pela sua implementação nos browsers modernos, sem que haja necessidade de pulgins ou addons.

W3C com casa nova

W3C.org

W3C.org

O World Wide Web Consortium (W3C) mudou recentemente o seu velhinho site.
Ainda não chegou à era HTML5, mas com a simplicidade que lhe é característica julgo que conseguiram um resultado muito bom e visualmente apelativo.
Ainda digno de destaque a existência de uma versão mobile.

Para que não restem dúvidas que estes senhores não andam a pregar aos peixes atentem nos resultados da validação html e css.

AntiSpamMath

A propósito de uma necessidade específica que sentimos em forum.semmais.com escrevi este pequeno módulo em JavaScript, tendo como objectivo diferenciar entre computadores e humanos.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
/*
Script Name: 	AntiSpamMath
Script Version:	1.1
Script Date:	28/March/2009
Author Name: 	Paulo A. Silva
Author Email:	pauloasilva[at]gmail[dot]com
Author Website: http://www.pauloasilva.com
*/
 
function ASMath(ApplyTo)
{
	this.FormID = ApplyTo;
 
	this.operand1 = null;
	this.operand2 = null;
 
	this.answer = null;
 
 
	this.SetOperands();
	this.SetAnswer();
	this.SetForm();
}
 
ASMath.prototype.SetOperands = function()
{
	this.operand1 = Math.floor(Math.random() * 11);
	this.operand2 = Math.floor(Math.random() * 11);
 
	this.answer = this.operand1 + this.operand2;
}
 
ASMath.prototype.SetAnswer = function()
{
	var bits = [];
	var dividend = parseInt(this.answer);
	var remainder = 0;
 
	while (dividend >= 2) {
		remainder = dividend % 2;
		bits.push(remainder);
		dividend = (dividend - remainder) / 2;
	}
	bits.push(dividend);
	bits.reverse();
 
	this.answer = bits.join("");
	document.getElementById("ASMathA").value = this.answer;
}
 
ASMath.prototype.VerifyAnswer = function()
{
	var Answer = document.getElementById("ASMathQ");
 
	return Answer.value == this.operand1 + this.operand2;
}
 
ASMath.prototype.SetForm = function()
{
	var Form = document.getElementById(this.FormID);
	var Field = document.getElementById("ASMathQ");
 
	var Me = this;
 
	Field.value = Me.operand1 +' + '+ Me.operand2 +' = ?';
 
 
	Form.onsubmit = function()
	{
		if (!Me.VerifyAnswer())
		{
			alert("Are you sure you're human?\nDon't be shy, use your fingers!");
			return false;
		}
 
		return true;
	}
 
	Field.onfocus = function()
	{
		this.value = "";	
	}
 
	Field.onblur = function()
	{
		if(this.value == "")
		{
			Me.SetOperands();
			Me.SetAnswer();
			Field.value = Me.operand1 +' + '+ Me.operand2 +' = ?';
		}
	}
}

A integração num form HTML é bastante simples, merecendo mesmo assim um exemplo:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<html>
	<head>
		<title>Demo</title>
 
		<script language="JavaSript" type="text/javascript" src="AntiSpamMath_V2.js">
		</script>
	</head>
	<body>
 
		<form id="ASMathF" name="demo" action="demo" method="post">
			<input id="ASMathQ" type="text" name="ASMathQ" />
			<input id="ASMathA" type="hidden" name="ASMathA" />
			<input id="ASMathB" type="submit" name="Submit" value="Ok" />
		</form>
		<script type="text/javascript">
			var ASMath = new ASMath('ASMathF');
		</script>
	</body>
</html>

O código está disponível ao abrigo da licença Creative Commons by-nc-sa 2.5 Portugal podendo fazer o download a partir daqui: AntiSpamMath

Nota: Embora funcional, o campo “ASMathA” não estava a ser preenchido pelo que o código fonte foi actualizado.

XForms

Este ano (que vai no fim) celebram-se os 10 anos da publicação do formato XML (10 de Janeiro de 2008) que o World Wide Web Consortium está a celebrar.

“There is essentially no computer in the world, desktop, handheld, or backroom, that doesn’t process XML sometimes…”
Tim Bray

Este lançamento mexeu com a forma de “fazer a web“: o HTML deu lugar ao XHTML (passou a recomendação do W3C em 26 de Janeiro de 2000), sendo este:

  • mais rigoroso e limpo que o HTML
  • e na sua essência, não mais do que HTML definido como XML application

A partir daqui outras tecnologias/formatos se seguiram, entre elas:

  • XML DOM
  • XSLT
  • XSL-FO
  • XPath
  • XQuery
  • XLink
  • XPointer
  • Schema
  • XForms

Continue reading