segunda-feira, maio 19, 2008

GOOGLE GADGET, GWT, ORKUT, OPENSOCIAL

Postado por às
Vou colocar aqui algumas das minhas experiências com o GOOGLE GADGET, incluindo experiências para adiciona-los como aplicações opensocial do ORKUT.

Lembre-se de alterar as URLs para que as mesmas sejam direcionadas para as suas aplicações.

IGOOGLE

Exemplo1: Código XML para uma aplicação GWT no iGoogle.

<?xml version="1.0" encoding="UTF-8"?>
<Module>
  <ModulePrefs title="DMS Google Gadget Test" description="Teste do Google Gadget.">
  </ModulePrefs>
  <Content type="html">
    <![CDATA[
  <html>
    <head>
      <title>DMS Google Gadget !!</title>
    </head> 
   <body>
      <script src="http://www.neoage.com.br/gwt/web/org.dms.Main/org.dms.Main-xs.nocache.js"></script>
   </body>
  </html>
      ]]>
  </Content>
</Module>
Exemplo2: Código XML para uma aplicação FLEX no iGoogle.

<?xml version="1.0" encoding="UTF-8" ?> 
<Module> 
<ModulePrefs title="Flex Teste" height="300" scrolling="true">
  <Require feature="flash" />
  </ModulePrefs>
<Content type="html">
<![CDATA[
<div id="flashcontainer" style="text-align: center;"></div> 
<script type="text/javascript">
    // The URL for the .swf file that shows the specified trick.
    var url = "http://www.neoage.com.br/gwt/flex/FlickrRIA.swf";
    // Play .swf file.
    _IG_EmbedFlash(url, "flashcontainer", {
      swf_version: 6,
      id: "flashid",
      width: 250,
      height: 250
    })
  </script>
  <br />
  ]]>
</Content>
</Module>

ORKUT / OPENSOCIAL

Para que os gadgets funcionem no orkut / opensocial, no XML você deve fazer o seguinte:

1 - Adicionar o texto: <Require feature="opensocial-0.7"/>

2 - O local de hospedagem do xml deve ser o mesmo local onde você hospedou o seu javascript criado pelo GWT. Caso seu XML esteja hospedado dentro do Google Gmodules. Você deve utilizar um proxy. Para isto coloque em suas urls externas o seguinte comando: http://gmodules.com/ig/proxy?url=<SUA URL>
No caso de você alterar sua aplicação, você deve alterar o proxy, pois o gmodules não consegue perceber isto de forma automática. Para isto você deve adicionar &x=1, &x=2...
http://gmodules.com/ig/proxy?url=<SUA URL>&x=1

OBS: Ainda não consegui fazer com que o GWT consiga interagir com a API de dados do Opensocial.


Exemplo3: Código XML para uma aplicação GWT no ORKUT.

<?xml version="1.0" encoding="UTF-8"?>
<Module>
  <ModulePrefs title="DMS ORKUT Gadget Test PROXY" 
  description="Teste do ORKUT Gadget PROXY."  
author="DS"   
author_email="xxx@google.com"
author_location="GYN,GO,BR"
  width="300" 
  height="250" 
  thumbnail=""
       >
 <Require feature="opensocial-0.7"/>
  </ModulePrefs>
  <Content type="html">
    <![CDATA[
  <html>
    <head>
      <title>DMS ORKUT Gadget !!</title>
    </head>
     <body>
      <script src="http://gmodules.com/ig/proxy?url=http://www.neoage.com.br/gwt/web/org.dms.Main/org.dms.Main-xs.nocache.js"></script>
   </body>
  </html>
      ]]>
  </Content>
</Module>
Exemplo4: Código XML para uma aplicação FLEX no ORKUT

<?xml version="1.0" encoding="UTF-8"?>
<Module>
<ModulePrefs title="Open Social App FLEX"
author_email="">
<Require feature="opensocial-0.7" />
<Require feature="flash" />
</ModulePrefs>
<Content type="html">
<![CDATA[
<script type="text/javascript">
_IG_RegisterOnloadHandler(init);
var flexAppId = "OpenSocial";
function init() {
loadFlash();
}
function loadFlash()
{
var swfUrl = "http://www.neoage.com.br/gwt/flex/FlickrRIA.swf";
gadgets.flash.embedCachedFlash(swfUrl, "flashcontainer", {id: flexAppId, width: 500, height: 500 });
}
function getFlexApp(appName)
{
if (navigator.appName.indexOf ("Microsoft") !=-1) {
return window[appName];
} else {
return document[appName];
}
}
</script>
<div id="flashcontainer" style="text-align: center;" width="500" height="500″></div>
]]>
</Content>
</Module>

Exemplo5: Código XML para exibir seus amigos no orkut
<?xml version="1.0" encoding="UTF-8"?>
<Module>
  <ModulePrefs title="Gifts part 1 - Friends">
    <Require feature="opensocial-0.7"/>
  </ModulePrefs>
  <Content type="html">
    <![CDATA[
      <script src="http://opensocial-resources.googlecode.com/svn/samples/tutorial/tags/api-0.7/gifts_1_friends.js"></script>
      <script>
        gadgets.util.registerOnLoadHandler(init);
      </script>
      <div id='main'>
        Your friends:
        <div id='friends'></div>
      </div>
    ]]>
  </Content>
</Module>

Marcadores:

Nenhum comentário:

Postar um comentário

Assinar: Postar comentários (Atom)



Busca do Google

Custom Search