Olás apesar de saber que este problema é bem específico, vou discutir a solução aqui assim mesmo, vai que alguém passa pelo mesmo … =)

é o seguinte, imagina uma div que precisa aumentar de tamanho quando passamos o mouse por cima, e reduzir quando saimos com o mouse de cima, pois bem isto seria bem facinho, bastava implementar algo no onmouseover, e o onmouseout e todo ficam felizes.

mas como nada é simples, tem dois labels dentro da div que são links, e quando o mouse vai sobre eles dispara o método onmouseout da  div que os contém … assim foi necessário implementar uma solução que pudesse ter labels como links dentro de uma div expansível.

O jeito foi tratar os clicks do mouse na div e delegar para o comportamento de cada label, e para evitar diversos ifs com os nomes das labels preferi usar uma regra de nomes, onde o metodo chamado eh o nome do componente seguido de _onclick().

Este techo de codigo eh o tratador de cliques da div

function div1_onclick() {

for( var n=0; n < div1.children.count; n++ ){

var child = div1.children(n);

if( child.y < event.y
&& child.y + child.height > event.y ){

 

 

eval(child.name+'_onclick();');
debug.trace(child.name);
}
}
}


Note que percorro a lista de filhos da div, e baseado no event.y comparo se o o mesmo esta entre o y e o y+ altura do componente filho e assim identifico o nome do mesmo e uso para montar o nome do método a ser chamado, e com o método eval() executo o referido método. simples não ? =)

segue em anexo o codigo do google gadget para fazer isto.

testoverarea

E o gadget pronto para ser instalado

testoverarea gadget

Acompanhando a lista de discussão do google gadget developer, vi um assunto bem interessante hoje, sobre a integração do sqlite com o google gadget, ou seja como colocar um mini banco de dados dentro do google gadget …

o codigo referenciado do blog de desenvolvimento do google, eh simples, mas foi necessario remexer nos comentarios do post para poder colocar as pecas juntas e funcionando. O que fiz basicamente eh um gadget que grava um valor no banco em memoria, e apos isto joga este valor numa label de forma a representar tanto a gravação quanto a leitura de dados.

vamos ver o codigo por partes

este trecho é o método que esta assinalado para ser executado quando da abertura do gadget

function view_onOpen() {

Aqui a dll do acesso banco é lida

var sqliteDLL = storage.extract(“sqlite3.dll”);

A DLL lida eh registrada manualmente

var wshShell = new ActiveXObject(“WScript.Shell”);
wshShell.run(“regsvr32 /s \”"+sqliteDLL+”\”", 0, true);

Cria o objeto baseado no activeX registrado

var sqlite = new ActiveXObject(“LiteX.LiteConnection”);

escreve uma linha no debug do google gadget

debug.trace(‘SQLite3 version: ‘ + sqlite.version(true) );

Abre em memória o banco de dados

sqlite.open(“:memory:”);

Cria a tabela e adiciona dados

sqlite.execute(“CREATE TABLE Test(a);”);
sqlite.execute(“INSERT INTO test VALUES (4);”);

Executa a consulta

var statement = sqlite.prepare( ‘SELECT * FROM test;’);

Varre o conjunto de resultados e adiciona o resultado na label1

while( ! statement.step() ){
label1.innerText = label1.innerText + statement.ColumnValue(0);
}

Limpeza final, fecha o statement e fecha a conexão

statement.close();
sqlite.close();
}

Nada complicado …

segue o codigo fonte do gadget sql_lite_sample

e as referências usadas

how to embed SQLite in a Google Gadget
http://googledesktopapis.blogspot.com/2008/07/tip-embed-sqlite3-database.html

Home of the activex wrapper
http://www.assembla.com/wiki/show/litex

documentation of the wrapper
http://www.assembla.com/spaces/litex/documents/c-5hiSb6ar3y3sab7jnrAJ/download/litex.pdf

home of the sqlite
http://www.sqlite.org/

API do google gadget
http://code.google.com/apis/desktop/docs/gadget_apiref.html

Agora recomeça a sessâo estou desenvolvendo google gadgets ! e como primeira lembrança : use o debug console ele é seu amigo … =)

este link detalha como usar : http://code.google.com/apis/desktop/docs/Tutorials/GadgetDesigner/index.html#5

mas em sintese basta chamar debug.info(‘mensagem’);

I’m there just waiting … =)

Here is the announce email

Hello,

The latest release of Google Desktop has been dubbed “the performance
release” by various members of our team. We hope you find Google
Desktop 5.8 to be faster, more stable, and more enjoyable.

To celebrate, we’re throwing a get-together at our Lively developer
lounge this Wednesday, September 17, at 10:30 a.m. Pacific time to
11:30 a.m.

Here’s the URL to the developer lounge:

http://www.lively.com/dr?rid=-6058992854362690611

And start times for other timezones:

http://www.timeanddate.com/worldclock/fixedtime.html?month=9&day=17&year=2008&hour=10&min=30&sec=0&p1=224

So get your avatars ready and stop by to say hello. We’d love to hear
your thoughts about 5.8 and the future of Google Desktop.

Now as far as the release goes, Joi’s post on the Google Blog goes
into detail about the planning and engineering behind the release:

http://googleblog.blogspot.com/2008/09/google-desktop-58-for-windows-increased.html

Oh well, here I am at the google gadgets developers room … nobody there that’s ok 6:4AM ET, everyone is supossed to be sleeping anyway heheheh,
visit there at http://www.lively.com/dr?rid=-6058992854362690611

Another gadget test ! on how to load an entire view from an xml file, and still having the <view> tag at the start, so we can still use the visual editor from the google gadget IDE.

Add to my gadget page

fragments of code …
this one is to open an url :

framework.openUrl( “http://www.athanazio.com” );

This is a experiment on google gadgets, based on 2 colors calculate the transition of colors to go from the first to the second, in order to create a nice color transition.

This is the link for the gadgets page : my-google-gadgets

And this is the piece of code that make the color calculations :