波のしずく

画像
  dreamstime.comからの画像 




既にご存じのとおり、おそらくGoogle Waveプロジェクトの利点の1つはそのオープン性です。 そして、ソースコードのアクセス可能性と文書化されたプロトコルの観点だけではありません。 しかし、Googleのwaveサーバーだけでなく(つまり、Googleの「クライアント」を介してだけでなく)「waves」を使用できるという事実もあります。 あなたはあなたのウェブサイト上で波を操作することができます!



はい、はい、私は知っています-今、あなたは私に砂場に入れないで腐ったパイナップルを投げます。 »開発者向け。

また、9月30日から、wave.google.comのWaveで既に10万のアカウントを配布します。 ことわざにあるように、「私たちは皆そこにいる」。 :)

それで、私は何について話しているのですか? そうそう。 私たち全員が波の中にあり、波はどこにでもあること。



例としてCMS Drupalを使用して、Google Waveの「ウェーブ」を埋め込む可能性についてお話します。 この特定のCMSであろうと他のCMSであろうと、実際には関係ありません。 これがコンテンツ管理システムを使用しているサイトであるかどうかは関係ありません。 Googleは、HTMLページに「波」を埋め込むためのオープンAPIを提供しています。 APIは非常に単純ですが、この全体がさらに発展することを期待しましょう。



そして、開始する前に、サンドボックスにアクセスできる場合にのみ、埋め込まれたWaveを表示できることを正直に警告します。 残酷です

しかし、これは一時的なものであり、Googleのスタッフは既に知識を持っているため、embed waveへの匿名アクセスに一生懸命取り組んでいます。



では、2009年8月には何がありますか?

開始するには、2つの公式リンクがあります。

マニュアル-code.google.com/intl/en-RU/apis/wave/embed/guide.html

ヘルプ-code.google.com/intl/en-US/apis/wave/embed/reference.html



1.公式ガイドを再度語らないようにするため、埋め込みの例を見てみましょう。



  <!DOCTYPE html PUBLIC "-// W3C // DTD XHTML 1.0 Strict // EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html xmlns = "http://www.w3.org/1999/xhtml" xmlns:v = "urn:schemas-microsoft-com:vml">
   <head>
     <meta http-equiv = "content-type" content = "text / html; charset = utf-8" />
     <title> Google Wave Embed APIの例:Simple Wave </ title>
 // Embed Wave APIでJavaScriptを追加します。 
     <script src = "http://wave-api.appspot.com/public/embed.js" type = "text / javascript"> </ script>

     <script type = "text / javascript">
 //ページの読み込み後に呼び出されるWave初期化関数。
    関数初期化(){
       // WavePanelクラスの新しいインスタンスを作成し、Waveサーバーアドレスを示します。
       //開発者のアドレス「サンドボックス」を使用中。 
       //他のWaveサーバーが表示されたら、ここで指定できます。 
       //アドレスの最後にスラッシュを含めることを忘れないでください。
       var wavePanel = new WavePanel( 'http://wave.google.com/a/wavesandbox.com/');
	   //特定のウェーブをロードします。 
           //これは、waveIDによって決定されます(「2Bi7arMxYM%25A」のように見えます)。
       wavePanel.loadWave( 'wavesandbox.com!w + waveID');
	   //最後に、waveを識別子「waveframe」でdivに挿入します
       wavePanel.init(document.getElementById( 'waveframe'));
     }
     </ script>
   </ head>
  
   <body onload = "initialize()">
 //このdivは、Waveでiframeをホストします。
 // divに十分な幅を設定することをお勧めします。 
 // Waveのすべての参加者のアバターに合わせて、
 //したがって、通常はすぐに幅を設定することをお勧めします:100%;
     <div id = "waveframe" style = "width:500px; height:100%"> </ div>
   </ body>
 </ html>




これがマニュアルのサンプルコードです(説明を追加しました)。 コピーして、Drupalマテリアル(ノード)に貼り付けてください。 waveIDの代わりに実際のwaveの識別子を置くだけです。 また、「フルHTML」入力フィルターを有効にすることを忘れないでください(これにより、誰も知らない場合にDrupalの不要なhtmlタグのフィルタリングが削除されます)。



すべてが機能します。 ウェーブはページのiframeに表示されます。「ブリップ」(つまり、ウェーブ内の個々のメッセージ)を安全に追加、削除、編集できます。 また、娘の波を作成することもできます(ウェーブレット、「サブウェーブ」、「ウェーブレット」-ロシア語の用語はまだ確立されています)。



2.実際、埋め込みにはこのようなコードでも十分です(DOCTYPE定義とhtmlタグを削除できます)。



  <script src = "http://wave-api.appspot.com/public/embed.js" type = "text / javascript"> </ script>
     <script type = "text / javascript">
    関数初期化(){
       var wavePanel = new WavePanel( 'http://wave.google.com/a/wavesandbox.com/');
       wavePanel.loadWave( 'wavesandbox.com!w + 2Bi7arMxYM%25A');
       wavePanel.init(document.getElementById( 'waveframe'));
     }
     </ script>
   <body onload = "initialize()">
     <div id = "waveframe" style = "width:100%; height:100%"> </ div>
   </ body> 




3.先に進みます。 どういうわけか、ページのソースコードに2つのbodyタグを含めたくありません。 そのため、Wave Embed APIのいくつかの機能を追加して、コードをやり直します。ボタンを挿入して、waveに色を付けます。



  <script src = "http://wave-api.appspot.com/public/embed.js" type = "text / javascript"> </ script>
 <div id = "waveframe" style = "width:100%; height:100%"> </ div>
 //「このウェーブに接続」ボタンと「返信」ボタンを追加します 
 //(「この波に従う」と「返信」)
 <フォームID = "comment_form"> 
     <button type = "button" onclick = "wavePanel.addReply()">ここで話す</ button> 
     <button type = "button" onclick = "wavePanel.addParticipant()">ウサギに従う</ button> 
 </ form> 

 <スクリプト> 
 var wavePanel = new WavePanel( 'https://wave.google.com/a/wavesandbox.com/');
 //サイトのデザインに合わせてデザインをカスタマイズします(背景、テキスト、フォント、サイズ/サイズ)。 
 //フォントサイズはptまたはpxでのみ指定できます。
 wavePanel.setUIConfig( '#446666'、 '#cceedd'、 'verdana'、 '9pt');

 wavePanel.loadWave( 'wavesandbox.com!w + i7arMxYM%A');
 wavePanel.init(document.getElementById( 'waveframe')); 
 </ script> 




ボタンが押されると、関数wavePanel.addReply()およびwavePanel.addParticipant()が実行されます。 最初のボタンはWaveに新しい「ブリップ」を追加し、2番目のボタンはこのWaveの参加者に現在のユーザーを追加します。 ただし、新しい「ブリップ」を先に追加することもできます。 はい。ただし、このボタンは最初のwaveメッセージへの応答として追加します。

また、2番目のボタンに関する重要な注意事項は、Drupalユーザー(WaveはDrupalについて何も知らない)ではなく、現在のWaveユーザーにWave参加者を追加します。 したがって、この機能を使用するには、Google Waveにログインする必要があります。



注:お気付きのとおり、最初のバージョンでは、wavePanel.init()がonloadイベントで呼び出されました。 これは、waveが挿入される前に、ページ全体がレンダリングされ、DOMが構築され、すべての外部スクリプトと画像が挿入されるために必要でした。 おそらく、このチェックを削除した2番目のオプションは最善の解決策ではなく、場合によっては結果が生じる可能性があります。

「今のところ、すべてが機能している」とチェルノブイリ原子力発電所のオペレーターはスイッチをはじいて言った。



4. Wave Embed APIを調べると、wavePanel.loadWave()およびwavePanel.init()にはコールバック関数を呼び出す機能があることがわかります。 なぜこれが国民経済に必要なのかはまだはっきりしていません。 ただし、たとえば、waveの読み込み時にサイトのユーザー名を使用してウェルカムメッセージを送信するなどのオプションを提供できます。



  <script src = "http://wave-api.appspot.com/public/embed.js" type = "text / javascript"> </ script>
 <div id = "waveframe" style = "width:100%; height:100%"> </ div>
 // Drupalサイトのユーザー名など、何らかの値を表示する要素を追加します。 
 //または、あなたのサイトに登録するときに彼が彼のプロファイルでそれを示した場合、彼のウェーブアドレス。 または何か他のもの。
 //これをすべてここに表示する必要はありません。ページ上の任意の要素を使用できます。
 <span id = "waveuser"> <?php global $ user;  print $ user-> name;?> </ span>
 
 <フォームID = "comment_form"> 
     <button type = "button" onclick = "wavePanel.addReply()">すべてに返信</ button> 
     <button type = "button" onclick = "wavePanel.addParticipantant()">よろしく、市民</ button> 
 </ form> 
 <スクリプト> 
 var wavePanel = new WavePanel( 'https://wave.google.com/a/wavesandbox.com/');
 wavePanel.setUIConfig( '#446666'、 '#cceedd'、 'verdana'、 '9pt');
 //たとえば、ユーザーに名前付きのあいさつ付きの関数呼び出しを追加します。 同様に、wavePanel.init()にコールバックを追加できます
 wavePanel.loadWave( 'wavesandbox.com!w + i7arMxYM%A'、welcomeMsg(「Welcome to World Wide Wave」));
 wavePanel.init(document.getElementById( 'waveframe'));
 
 //実際にコールバック関数、この例ではウェルカムメッセージを生成します
関数welcomeMsg(テキスト){
   var item = document.getElementById( "waveuser");
   if(アイテム){
     item.innerHTML =テキスト+ item.innerHTML + "!";
   }
 }
 </ script>




その結果、Waveをロードすると、ユーザーは「Welcome to World Wide Wave、Neo!」などのメッセージを受け取ります。 概して、これは新しい現実に対応しています。



注:グリーティングメッセージのユーザー名は他の方法で取得できます。 ただし、これはほんの一例です。独自の方法で実行できます。



5.私の意見では、もう1つの便利なコールバックアプリケーションは次のとおりです。 先ほど言ったように、今、あなたがサイトページにwaveを埋め込むと、サンドボックスのアカウントの所有者だけがそれを見ることができます。 通常の訪問者は、wavesandbox.comにログインする必要があるというメッセージとともに「スタブ」を見つけます。 この悲惨な不平等で単なる人間を当惑させないために、このトリックを使うことができます:



a。 最初に波が表示されるdivを非表示にします。

  <div id = "waveframe" style = "width:100%; height:100%; visibility:hidden;"> </ div> 


b。 そして、ウェーブが初期化されると、このdivを「表示」するコールバック関数を呼び出します。

  window.wavePanel.init(document.getElementById( 'waveframe')、initCallback); 
関数initCallback(){ 
   document.getElementById( "waveframe")。style.visibility = "visible"; 
 } 




したがって、サンドボックスにログインしていない場合、ページに波の痕跡は表示されません。



この人道的で楽観的なメモで、今日は許容されるスピーチを終えさせてください。 次回、Drupalのモジュールについてお話します。これにより、埋め込みプロセスがより便利で柔軟になります。



ps作成されたiframeの識別子を取得できるEmbed APIのgetFrameId()関数を使用していません。 しかし、私はそれがどのように賢明に処分されるかをまだ理解していません。



DrupalおよびGoogle Waveトピックへのより便利なリンク:

-Google Wave Russiaグループでの議論

- サイトDrupal.ruに関する議論

-Drupal.orgオフサイトディスカッショングループ



Upd。:スクリーンショットを要求しました 。 今のところ、次のように保管してください。

画像







All Articles