PDA

View Full Version : Google Wave embedded in ExtJS window



Luc
19 Oct 2009, 10:39 AM
Hi,

For those of you interested in Google Wave, I thought I'ld share this simple example of how to embed a Wave in an ExtJS Window. Based on the sample from the Google Wave API tutorial. Works in Chrome and FF 3.5+



<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Wave Embedded in Ext Window</title>
<link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.0.0/resources/css/ext-all.css" />
<script type="text/javascript" src="http://extjs.cachefly.net/ext-3.0.0/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="http://extjs.cachefly.net/ext-3.0.0/ext-all-debug.js"></script>

<script src="http://wave-api.appspot.com/public/embed.js" type="text/javascript"></script>
<script type="text/javascript">

Ext.onReady(function() {

var wave = new WavePanel('https://wave.google.com/wave/');
var waveId= .... your WaveId here...... ;

wave.loadWave(waveId);
wave.setUIConfig('white', 'black', 'Arial', '13px');

var win = new Ext.Window({
title: 'Google Wave embedded in Ext Window',
height:500,
width:700
}).show();

wave.init(win.getLayoutTarget().dom);


})

</script>
</head>
<body>

</body>
</html>


To get the waveId you want to embed, just include blog-bot@appspot.com as participant and it will provide you with the Id.

Embedding the Wave in an Ext window preserves all the editing capabilities of the Wave (multi-user collaborative editing, drag&drop files (requires Gears), ...).

See screenshot for the end result.

Are there more Ext'ers interested in Google Wave (e.g. creating ExtJs based gadgets)?

teddyjas
19 Oct 2009, 6:05 PM
I'm very very interested!
Havent got time to look into the api yet, but i have my google wave account and the sandbox as well.
What u think for cool apps to be built for the wave?

edwardsanchez
20 Oct 2009, 4:03 AM
This is pretty damn cool! Sounds like something we could add to Kohive.com :)

mitchellsimoens
23 Oct 2009, 7:23 PM
I'm very very interested!
Havent got time to look into the api yet, but i have my google wave account and the sandbox as well.
What u think for cool apps to be built for the wave?

I have gotten a few people from these forums going on Wave so we have a small Ext Community going. If you want to join you can add me... ms.simoens@googlewave.com

You have the dev preview? me to... mitch@wavesandbox.com

I have a private wave server running and about to see if I can get my public server to start one up.

mitchellsimoens
25 Oct 2009, 6:28 PM
I wouldn't make a wave public yet. I made one public and people were adding themselves and tons of replies to it because when a wave is public, anyone can edit or reply or do as they please.

Also when I searched for public waves, I am having a hard time getting back to my waves.

Update: I had to restart the browser to get back to my waves listed. Not gonna make another wave public again!

crp_spaeth
28 Oct 2009, 1:14 AM
Can any of you invite me?

If so it would be nice if you could send me a PM!

teddyjas
29 Oct 2009, 4:30 AM
PM me ur google mail I will send u the invite

mitchellsimoens
29 Oct 2009, 6:08 AM
PM me ur google mail I will send u the invite

Teddyjas,

Do we have you on our Ext community yet? If not, wave me and I'll add you! ms.simoens@googlewave.com

Foggy
2 Nov 2009, 6:58 AM
Is there anyone who can invite me to google wave?
Is there a gmail account needed or does it the email of my google account?

Thanks in advance

teddyjas
2 Nov 2009, 6:16 PM
mizzory,
I waved you already a week ago still not yet got your reply?

foggy send me ur gmail address I invite u.... I still have 4 more invites

mitchellsimoens
2 Nov 2009, 8:36 PM
I'm sorry but I don't see a wave from you. Try me again... ms.simoens@googlewave.com

pwuk
3 Nov 2009, 10:21 AM
any one got any more invites they feel like giving away?:D

mitchellsimoens
4 Nov 2009, 6:21 AM
please stop spamming this post. I have set up another post to handle requests here (http://www.extjs.com/forum/showthread.php?t=84515)

cutout33
18 Jan 2010, 2:27 AM
Hi,

For those of you interested in Google Wave, I thought I'ld share this simple example of how to embed a Wave in an ExtJS Window. Based on the sample from the Google Wave API tutorial. Works in Chrome and FF 3.5+



<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Wave Embedded in Ext Window</title>
<link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.0.0/resources/css/ext-all.css" />
<script type="text/javascript" src="http://extjs.cachefly.net/ext-3.0.0/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="http://extjs.cachefly.net/ext-3.0.0/ext-all-debug.js"></script>

<script src="http://wave-api.appspot.com/public/embed.js" type="text/javascript"></script>
<script type="text/javascript">

Ext.onReady(function() {

var wave = new WavePanel('https://wave.google.com/wave/');
var waveId= .... your WaveId here...... ;

wave.loadWave(waveId);
wave.setUIConfig('white', 'black', 'Arial', '13px');

var win = new Ext.Window({
title: 'Google Wave embedded in Ext Window',
height:500,
width:700
}).show();

wave.init(win.getLayoutTarget().dom);


})

</script>
</head>
<body>

</body>
</html>


To get the waveId you want to embed, just include blog-bot@appspot.com as participant and it will provide you with the Id.

Embedding the Wave in an Ext window preserves all the editing capabilities of the Wave (multi-user collaborative editing, drag&drop files (requires Gears), ...).

See screenshot for the end result.

Are there more Ext'ers interested in Google Wave (e.g. creating ExtJs based gadgets)?

The application crashes when adding the embd.js line! have any idea? am using GXT 2.0/GWT 1.7