×

[PR]この広告は3ヶ月以上更新がないため表示されています。
ホームページを更新後24時間以内に表示されなくなります。


Googleを追いかけろ!

.

チュートリアル 中級者 2-8 Google Sites に Google DocList を埋め込む

  • ファイルキャビネットとリストページを利用してGoogle Site内にフォルダーを作成する方法です。
    ”DocsList”と”SitesApp”の利用法についても解説します。
    前以てファイルを含む”Google Docs フォルダー”とファイルキャビネット、リストページを準備してください。およそ20分の作業です。

§1 ファイルキャビネットにフォルダーを設置する

§2 フォルダー表示のためのリストページの使用

チュートリアル 中級者/目次 参照ページ(Goolge)


WWW を検索 Googleを追いかけろ! を検索


概略

このセクションではスクリプトの開発用に”Google Site”内のスクリプト・エディターを利用します。 最終的には”time-driven trigger”を利用してこのスクリプトを自動的に実行させます。

§1 ファイルキャビネットにフォルダーを設置する

”Google Docs Folders”と ”Sites File Cabinet”をリンクさせる
  1. 自分のサイトの”スクリプト・エディター”を開きます。
  2. More Actions > Manage Siteと進みます。
  3. ”Launch Editor”をクリックします。
  4. 確認コードを入力します。
  5. 下のコードをコピーしてエディターに貼り付けます。
function showFolderInSite() {
  var files = DocsList.getFolderById("PASTE_FOLDER_ID_HERE").getFiles();
  var page = SitesApp.getPageByUrl("PASTE_PAGE_URL_HERE");
  for(i in files){
     page.addWebAttachment(files[i].getName(), '', files[i].getUrl());
  }
}
  1. ”Google Docs”内のフォルダーを開いて、URL(ブラウザーのアドレスバー内)から”フォルダーID”をコピーします。 ”フォルダーID”はURLの ” folder.#. ”以下すべての部分のことです。
    たとえばhttps://docs.google.com/?tab=mo&authuser=0#folders/folder.0.0B3xR7WfXrj7aOGY4Y2M3OWItZjAyYy00ZTM5LTg3MTgtNjNkYWZhZTZmYmU3 であれば0B3xR7WfXrj7aOGY4Y2M3OWItZjAyYy00ZTM5LTg3MTgtNjNkYWZhZTZmYmU3. がフォルダーIDとなります。
    下のイメージも参考にして下さい。
    フォルダーID
  2. 上のサンプルコード内の”PASTE_FOLDER_ID_HERE”部分にコピーしたフォルダーIDを貼り付けます。

    (注);”Apps Script”を利用してフォルダーを開く方法としては、フォルダーIDの代わりにパスを利用しても構いません。 パスを利用する場合はgetFolderByID()の代わりにgetFolder()を使います。
    このメソッドは”Document List”に表れるフォルダー階層からパスを拾ってきます。”Document List”の階層からパスを生成するにはフォルダー間にスラッシュを挿入します。
    たとえば、”Accounts folder”のサブフォルダーである”folder 2009”へのパスであれば下のようにしてください。
    var files = DocsList.getFolder("Accounts/2009").getFiles();

    (注);Folderクラスの”getFiles()”メソッドはフォルダー内のすべてのファイルの配列を返します。 この配列はループによって一度にひとつずつ確認することができます。一般に結果の配列を返す”Apps Script”のメソッドではJavaScriptの”forループ構文”が役立ちます。
    このループではFileクラスのgetFiles()からのメソッドを利用してそれぞれのFile名やファイルのURLなどの必要な情報にアクセスできます。

  1. 上記のコード中のメソッド”getPageByUrl()”のPASTE_PAGE_URL_HERE部分を自分のファイルキャビネットURLに変えます。

    (注);”addWebAttachement()”メソッドにはタイトル、説明、URLの3つのパラメータが必要です。
    このサンプルでは説明部分は空白のまま残しています。

  1. ”Save”(保存)をクリックします。
  2. スクリプト名を付けます。
  3. ”Run”(実行)すると”Google Docs list”および”Google Sites services”へのアクセス権の設定を促すポップアップが開きます。
  4. 権限を設定してボタンを押します。
  5. 再度”Run”(実行)します。
これでファイルキャビネット内の”Google Docs files”へのリンクが確認できるはずです。
更新リストを得るためにトリガーを利用する

フィル名の変更や削除など、”Google Docs folder”内の内容は時間とともに変更されます。そこで キャビネット内を常に最新の状態に保つために”time-driven trigger”を利用します。 ”showFolderInSite”機能は毎日、毎分での自動実行が可能です。

セキュリティへの考慮; 他の挿入可能な”Event Handlers”同様に”time-driven trigger”はあなたのIDとして実行されます。(つまりトリガーを挿入した人)

トリガーの挿入

  1. エディター内のトリガーメニューを開き”Current script's triggers”をクリックします。”Current script's triggers”のダイアログが開きます。
  2. ”No triggers set up”→”Click here to add one now”と進みます。トリガーの設定を促すダイアログが開きます。
  3. ”showFolderInSite”ファンクションと”イベントで”Time-driven”が選択されていることを確認します。
  4. 必要とする時間を選択します。スクリプトはトリガーによって毎分、毎時、毎日。。実行させることが可能です。
  5. ”Save”(保存)します。
トリガーの設定
設定時間毎にトリガーによって実行される”showFolderInSite”ファンクションはすべてのファイル(すでに追加されているかどうかにかかわらず)を追加します。 重複を避けたい時は下のコードスニペットをfor(i in files)の前に置きます。
var attachments = page.getAttachements();
for(i in attachements){
 attachements[i].deleteAttachment();
}

§2 フォルダー表示のためのリストページの使用

いろいろな理由によってファイルキャビネットよりもリストページを利用したい場合もあります。とくに フォルダー内にたくさんのファイルがあってこれをソートしたり、各ファイルのもっとたくさんの情報(ファイルタイプ、サイズ、最終更新日時など)を 得たいときなどはページを利用したいと思うでしょう。
  1. list pageの作成をクリックして”Create a custom list”ボタンをクリックします。
  2. 最初のカラム(列)に”Title”と入力してURLタイプを選びます。
ページリストの設定
  1. 最初のカラム(列)に”Title”と入力してURLタイプを選びます。
  2. 列に”Type”,”Size”,”Owner”を付け加えてデフォルトのタイプ”Text”を選びます。
  3. ”Last Updated”には”Date”タイプを使います。
  4. ”スクリプトエディター”でメニューから新規作成を実行して、下のコードを貼り付けます。
function showFolderInSite() {
  var files = DocsList.getFolderById("PASTE_FOLDER_ID_HERE").getFiles();
  var page = SitesApp.getPageByUrl("PASTE_PAGE_URL_HERE");
  var listItems = page.getListItems();
  for(i in listItems){
     listItems[i].deleteListItem();
  }
  for(i in files){
     var title = "<a href=\""+files[i].getUrl()+"\">"+ files[i].getName() +"</a>";
     // Add data according to the order of columns in your list
     page.addListItem([title, files[i].getType(), files[i].getSize(), files[i].getOwner(), files[i].getLastUpdated()]);
 }
}
  1. ”PASTE_FOLDER_ID_HERE””PASTE_PAGE_URL_HERE”を自分の該当するフォルダーIDとURLに書き換えます。
  2. Save(保存)して実行します。

    (注);”Pageクラス”の”addListItem()”はパラメーターとして” [ ] 配列 ”が必要です。 配列のはじめの値はリストのはじめのカラムに追加されたものです。(ここではファイルへのリンクが”Title”カラムに与えられています。) 2番目の値はカラム2番目の”Type”へという具合に以下同様に与えられています。

    (注);つぎのコードはリストページで”URL”タイプを利用するために、HTMLアンカーを再度生成したのもです。
    var title = "<a href=\""+files[i].getUrl()+"\">"+ files[i].getName() +"</a>";

    結果は下のようになります。

実行後のlist page
ここではまだ改善の余地があります。はじめのカラムである”Title”にはリンクが表示されますが、2番目のカラム”Type”では ”blob_item”という表示になっていることがあります。これは標準的な”Google Docsファイル(Spreadsheet, Document, Presentation)”では無い場合 です。この識別を正しく表示させるために、このテキストを”pdf, ppt”などの拡張子に入れ替えます。

標準的な”Google Docsファイル”ならば3番目の”Size”フィールドに”0”が表示され、これでは使い物にならないので削除します。
また、サイズ表示を”28099”は”28kb”のようにフォーマットを変換してやります。

次に”Ownerフィールド”です。”romain.vialard@gmail.com”などのメールアドレスで表示されている部分を”Romain Vialard”とします。

最後に最初と最後のフィールドの問題です。カラムに対して標準的なTextタイプを使うなら特定の形式を利用する必要があります。 最初のカラムでは、特定の最新日付形式を使用するためにHTMLアンカーを利用します。 これで終わりです。改良後は以下のようになります。
改良後の画面

重要部分に説明を施した最終コードです。必要に応じてカスタマイズできる部分もあります。

(注)”Apps Script documentation”には”substring()”と”lastIndexOf()”のふたつのメソッドはありません。 これは”JavaScript”の”String Object”の標準的なメソッドです。参考;”lastIndexOf()” , ”substring()
function showFolderInSite() {
 var done = false;
 while(!done){
 // The while loop and try - catch statement are used to
              automatically retry if there's an issue during the execution (common issue: SitesApp: Internal error).
  try{
    var files = DocsList.getFolderById("PASTE_FOLDER_ID_HERE").getFiles();
     var page = SitesApp.getPageByUrl("PASTE_PAGE_URL_HERE");
     var listItems = page.getListItems();
     for(i in listItems){
       listItems[i].deleteListItem();
     }
     for(i in files){
     /*** Title field ***/
       var title = "<a href=\""+files[i].getUrl()+"\">"+ files[i].getName() +"</a>";
     /*** Type field ***/
       var type = files[i].getType();
     // condition: if the type is "blob_item" replace it by the filename extension
       if(type == "blob_item"){
         type = files[i].getName().substring(files[i].getName().lastIndexOf('.'));
       }
     /*** Size field ***/
     // To indicate the size properly, we need multiple conditions:
     // - If size > 0, we show the size, else (if size = 0) it's a Google Docs file and we can hide this zero.
     // - Calculate the length of the number (28099 is five digits, 2158080 is seven digits):
     // If length < 7 digits then size is < 1mb. Indicate "kb" and remove the last digits (the bytes).
     // Else, indicate "mb" and remove the last digits (kilobytes and bytes).
       var size = files[i].getSize();
       if(size > 0){
         var length = size.toString().length;
         if(length < 7){
           size = size.toString().substring(0,length - 3) + "kb";
         }
         else{
           size = size.toString().substring(0,length - 6) + "mb";
       }
     }
     else{
        size = '';
     }
     /*** Owner field ***/
    // Take the email address and remove everything after the @.
      var owner = files[i].getOwner().toString().substring(0,files[i].getOwner().toString().indexOf('@'));
     /*** Last Updated field ***/
     // .formatDate() is a method from the Utilities Services
            var lastUpdated = Utilities.formatDate(files[i].getLastUpdated(), "GMT", "yyyy-MM-dd");
     /******/
      // Add data according to the order of columns in your list
      page.addListItem([title, type, size, owner, lastUpdated]);
     }
    done = true;
    }
     catch(e){
     }
 }
}

まとめ

”Google Site”で”Google Docs folder”を挿入する方法はこれで終わりです。 ”Spreadsheet Gallery”の”Embed Google Docs Folders in a Google Site”も参考にして下さい。




    * チュートリアル 中級者/目次
    1. スプレッドシートの読み取り - JavaScript オブジェクトを利用してシート内のデータ構造を読み取る
    2. スプレッドシートへの書き込み - シートに構築されたデータを読み取り他のシートへ移植
    3. トーナメント表の作成 - バスケットのトーナメント表をスプレッドシートで作成
    4. Google Site の作成 - Gmail や Calendar からデータを収集してサッカーチーム用のサイトを作成
    5. Docs Listとの連携を図る - Docs List上のファイル検索やCSVファイルのインポート(エクスポート)
    6. Google Sites にApps Script を埋め込む - Google SitesにGoogle Apps Scriptを実装する
    7. デバッガーの利用 - YouTubeのVideoによる Tutorial
    8. Google Sites に Google DocList を埋め込む - ファイルキャビネットとリストページを利用してフォルダーを作成する
    9. 読書リストからスプレッドシートを作成する - 未読URLリストからタスクアイテムを作成するための同期関数を作成するGoogle APIの統合
    10. Gmail受信トレイの統計レポート - Gmail内の毎月の送受信とそのトップ5の統計情報
    --チュートリアル 中級者 2-8. Google Sites にDocList を埋め込む : end -- 2011/10/30