Help us understand the problem. What is going on with this article?

GASでGoogleスライド上にタイマーを設置する

More than 1 year has passed since last update.

はじめに

共同作業などでGoogleスライドを利用することがあるかと思いますが、GoogleAppsScriptを使ってスライド上にカウントダウンタイマーを設置することができます。
GoogleスライドはGoogleスプレッドシートとは違って使い勝手がわかりにくかったので、設置方法を詳しく書きました。
使用例としては、スライドの提出締め切りやプレゼンの発表日をスライド上でカウントダウンしてチームの士気を高める、といった場面を想定しています。
チームメンバーの誕生日を祝ったりしてもいいかもしれませんね!

スライドの作成

GoogleドライブからGoogleスライドを作成してください。
今回はこのようなテストスライドを用意しました。

スクリーンショット 2018-08-11 23.32.54.png

メインタイトルの「ここにタイマーを表示」というところに、2019年1月1日0時0分までのカウントダウンを表示したいと思います。

スクリプトの作成

次に、「ツール」→「スクリプトエディタ」から、新規スクリプトを作成します。
ここにJavaScriptでスライドを編集する命令を書いて、定期的に実行させます。

オブジェクトIDを調べる

タイマーを表示するテキストボックスのオブジェクトIDが必要になるので、まずは下のリンクからオブジェクトIDを調べましょう。
Method: presentations.get  |  Slides API  |  Google Developers
画面右の「Try this API」というところでpresentationId」(スライドのURLの"docs.google.com/presentation/d/ここがpresentationId/edit")を入力し、「EXECUTE」を押してください。
すると、このようなjsonデータが返ってきます(長いので適宜省略しました)。

{
  "presentationId": "PresentationID",
  "pageSize": {},
  "slides": [
    {
      "objectId": "p",
      "pageElements": [
        {
          "objectId": "i0",
          "size": {},
          "transform": {},
          "shape": {
            "shapeType": "TEXT_BOX",
            "text": {
              "textElements": [
                {},
                {
                  "endIndex": 11,
                  "textRun": {
                    "content": "ここにタイマーを表示\n",
                    "style": {}
                  }
                }
              ]
            }
          }
        }
      ]
    }
  ]
}

オブジェクトIDが"i0"であることがわかりました。

スクリプトを書く

次のようなスクリプトを書いてください。

// 当該テキストボックスの取得
var presentationID = "presentationID";
var presentation = SlidesApp.openById(presentationID);
var slide = presentation.getSlides()[0]; //スライド1枚目
var pageElements = slide.getPageElements();
var textBox = pageElements.filter(function(e){return e.getObjectId() == "objectID"})[0]; // ページ要素の配列からobjectIDで検索する
var text = textBox.asShape().getText();
Logger.log(text.asString());

var xday = new Date(2019, 1-1, 1, 0, 0, 0); // 月は0オリジン

// 当該テキストボックスの中身をクリアしてからタイマーを追加
function main() {  
  text.clear();
  var msg = TimeToGo();
  text.appendText(msg);
}

// タイマー (テキストボックスに渡す文字列)
function TimeToGo() {
  var now = new Date();
  var diff = xday.getTime() - now.getTime();
  // 新年になったら"Happy New Year"
  if (diff<0) {
    delTrigger(); // トリガー削除(後述)
    return "Happy New Year!";
  }
  // 日、時間を計算
  var day = Math.floor(diff/(24*60*60*1000));
  diff = diff%(24*60*60*1000);
  var hour = Math.floor(diff/(60*60*1000));
  var msg = day + " Days " + hour + " Hours";
  return msg;
}

// トリガー削除(後述)
function delTrigger() {
  var triggers = ScriptApp.getProjectTriggers();
  for(var i=0; i < triggers.length; i++) {
    ScriptApp.deleteTrigger(triggers[i]);
  }
}

トリガーを設定する

次に、スクリプトを定期的に実行するためのトリガーを設定します。
スクリプトのメニューバーにある時計マークをクリックすると、このような画面が出てきます。

スクリーンショット 2018-08-12 0.09.12.png

main関数を1時間ごとに実行する設定にして、保存します。
そのときに許可を求められた場合は、「詳細」→「(安全ではないページ)に移動」で許可を与えます。

スクリーンショット 2018-08-11 23.44.23.png

実行結果

トリガーが実行されるとスライドにタイマーが表示されます!

スクリーンショット 2018-08-12 10.18.38.png

これを応用すると、日替わりで背景画像を変えたり、いろいろできそうですね。

このトリガーは1時間ごとに永久に実行されてしまうので、適当なタイミングで必ずトリガー削除の関数を実行しましょう。
スプレッドシートだとOnOpen関数などでファイルを開いたときのみ実行することができるらしいのですが、スライドではうまくできませんでした。
コメントでご助言をいただければ幸いです。

参考文献

「Google Apps Script」の記事一覧 | いつも隣にITのお仕事
このシリーズにお世話になりました。

Why do not you register as a user and use Qiita more conveniently?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away