- Posted by brunofig on July 31, 2006
Há muito que procurava um editor bom para Javascript. Foi me recomendado o
Aptana. Após a instalação, e algum uso, fiquei "maravilhado".
" Aptana is a robust, JavaScript-focused IDE for building dynamic web applications."
Algumas das caracteristicas:
- Code Assist on JavaScript, HTML, and CSS languages, including your own JavaScript functions
- Outliner that gives a snapshot view of your JavaScript, HTML, and CSS code structure
- Error and warning notification for your code
- Support for Aptana UI customization and extensions
- Cross-platform support
- Free and open source. (Source available soon)
- Posted by brunofig on July 26, 2006
O meu "pet project" do momento é o desenvolvimento de pequenos widgets [
?] para quem tem blogs e/ou sites.
Em calha já tenho os seguintes widgets:
- Tempo
- possibilidade de mostrar o tempo para uma determinada cidade de Portugal
- "Também leio..."
- listagem dos últimos posts dos blogs preferidos
- ...
Bem, de momento é o que tenho, mas aceito sugestões. :)
Noticias e site em breve.
(Geek info: Desenvolvidos em Javascript, JSON e C# HTTPHandlers)
- Posted by brunofig on July 24, 2006
Para quem gosta de dance music, a MOS tem agora online uma rádio com um som groovy:
Link:
http://origin-community.ministryofsound.com/asx/radio/mosradio.asx
HomePage:
http://www.ministryofsound.com/radio/?osadcampaign=homeflashbox2
- Posted by brunofig on July 23, 2006
A Yahoo! permite efectuar pedidos aos seus webservices, com a possibilidade de estes retornarem
JavaScript Object Notation ao invés do tradicional XML.
Ora, isto para a nova vibe
do "web 2.0" é excelentes noticias.
Background: Para quem não sabe,
JavaScript Object Notation é um subset do Javascript que permite a troca de dados entre aplicações de uma forma leve e simples. É um formato simple de
perceber e de escrever, quer para o programador, quer para a "máquina". Para mais informações sobre
JavaScript Object Notation visitem http://www.json.org/.
Mas como qualquer casamento, nem tudo são rosas. Os browsers mais recentes não permitem efectuar cross-domain requests, o que impossibilita ao utilização de "Ajax".
Este problema é cortornável, mas como tudo, tem o seu custo.
Antes de avançar para o código, aconselho uma visita ao site da Yahoo! Developer Network (http://developer.yahoo.com/) para conhecer melhor as APIs que a
Yahoo! disponibiliza.
Depois da visita, vamos então ao código.
A ideia é simples: O utilizador digita o que pretende procurar, clica no botão, e uma parte da página é actualizada com o resultado.
A Yahoo! disponibiliza um webservice que permite efectuar pesquisas através da submissão de pedidos
REST.
A url para aceder a este serviço é
http://api.search.yahoo.com/WebSearchService/V1/webSearch.
A esta url tem de ser adicionado o argumento
appid, que define qual a aplicação que esta a efectuar o pedido, e o argumento
query, que define qual a
pesquisa.
(Para mais informações sobre quais os argumentos disponiveis, visitem
o website da Yahoo!)
Para o nosso exemplo, e visto que queremos obter resultados em formato
JavaScript Object Notation, temos também de adicionar o argumento
output=json. Para efectuarmos uma pesquisa
sobre
JavaScript Object Notation, a url a utilizar é
http://api.search.yahoo.com/WebSearchService/V1/webSearch?appid=YahooDemo&query=json&output=json.
Para o nosso exemplo, vamos utilizar as seguintes frameworks de javascript:
Para efectuar o pedido via Ajax, vamos utilizar o Prototype:
/* For Browsers that support HTTPRequest cross-domains */
ajaxSearch: function(e)
{
var myAjax = new Ajax.Request(
this.url,
{
method: 'get',
parameters: this.getSearchParameters() + "&query=" + $F("p"),
onComplete: YahooSearch.proccessAjaxResponse
});
}
/* Returns Search Parameters */
getSearchParameters: function()
{
returnthis.pars + "&results=" + this.numResults + "&start=" + this.page;
}
Para os browsers que não suportam cross-domain requests, o processo é ligeiramente mais complicado. É necessário adicionar à página uma tag de script que
aponte directamente para a url. No final desta, é adicionado um novo parametro - callback - que permite executar uma função no final do pedido:
/* For High Security Browsers */
scriptSearch: function(e)
{
var evt = (window.event || e);
Event.stop(evt);
Element.show("systemWorking");
var newsearch = document.createElement( 'script' );
newsearch.src = this.url + "?" + this.getSearchParameters() + "&query=" + $F("p") + "&callback=YahooSearch.showResults";
document.getElementsByTagName( 'head' )[0].appendChild( newsearch );
}
Quando finalmente obtemos o resultado, vamos o então processar e adicionar à pagina:
showResults: function(search)
{
var totalResults = search.ResultSet.totalResultsAvailable;
var startResults = search.ResultSet.firstResultPosition;
var endResults = (this.page + this.numResults);
if (endResults > totalResults)
{
endResults == totalResults;
}
if (totalResults == 0 && this.page == 1)
{
divHeader = Builder.node('div',{className:"Header", id:"resultsHeader"},
[
Builder.node('div',{className:"PagerHeader"}, "não foram encontrados resultados...")
]);
}
else
{
divHeader = Builder.node('div',{className:"Header", id:"resultsHeader"},
[
Builder.node('div',{className:"PagerHeader"}, "Resultados ainda disponiveis: " + totalResults)
]);
}
$("results").appendChild(divHeader);
$("btnPrev").disabled = (this.page == 1);
$("btnNext").disabled = (totalResults <= this.numResults) || (endResults >= totalResults);
search.ResultSet.Result.each( function(result,index){
divResult = Builder.node('div',{className:"Result", style: 'display:none;', id:"resx_" + index},
[
Builder.node('div',{className:"Title"}, result.Title),
Builder.node('div',{className:"Summary"}, result.Summary),
Builder.node('div',{className:"Url"},
[
Builder.node('a',{href:result.Url},result.Url)
])
]);
$("results").appendChild(divResult);
Effect.Appear(divResult.id,{ duration: 1 });
});
Element.hide("systemWorking");
}
Para facilitar o trabalho, criei uma "piquena" class de javascript para todo o processo.
Podem fazer o download
aqui.
Para ver então o nosso exemplo a funcionar, cliquem
aqui.
Todo o exemplo foi montado sobre o conceito de unobstructive javascript, de forma a garantir que mesmo que o browser não suporte javascript, a pesquisa é
sempre efectuada (o Form faz o postback directo para o site da Yahoo!).
