Google Spreadsheetでチケット駆動生活をするはなし(タスク追加アプリ編)

どうも,まるさ@maruuusa83です.




Google Spreadsheetでチケット駆動生活をするはなし(スプレッドシート編)に引き続き,

スクリプトとアンケートフォームを使ってタスク追加アプリを実装していくぞ編です.







タスク追加アプリ?


スプレッドシートでタスク管理するってよくあることだとおもいます.

でもタスクの追加って面倒じゃないですか・・・?

ぼくはセルひとつひとつにいちいち打っていくのが面倒ですく投げ出してしまいます.

というかスマホからタスク追加したい



というわけで,今回はスマホから楽にタスク追加できるように前回のスプレッドシートを拡張していきます.







1. タスク登録ページをGoogleフォームで作る


Googleフォームを使えば,一発でクロスプラットフォームなタスク追加アプリが作れそうな気がします.

というわけでタスク管理スプレッドシートに関連付けてアンケートフォームを作ります.




1.1 新しいフォームの作成

まずはスプレッドシートから新しくフォームを追加します.

メニューバーから 挿入 > フォーム を選択してください.


f:id:maruuusa83:20160609095353p:plain

新しくフォームを追加


すると新しいフォームの編集画面が表示されるかと思います.


f:id:maruuusa83:20160609095549p:plain

新規フォームの編集画面




1.2 フォームの編集

必要な項目をガシガシ追加していきます.

今回は次の項目を用意します.

質問 必須 入力方法
タスク名 Yes 記述式
締切日 日付
タスクの詳細 記述式
メモ 記述式
タグ 記述式
親タスク 記述式
継続タスク 記述式


f:id:maruuusa83:20160609095933p:plain

まずはタスク名の登録フォーム


f:id:maruuusa83:20160609100045p:plain

質問の追加


f:id:maruuusa83:20160609100754p:plain

設定を進めていく


編集が完了したら右上の「送信」のボタンを押してURLのタブを開いて,フォームのURLを取得しておきましょう.




1.3 状況の整理

これでフォームの作成ができました.クラスプラットフォームなアプリの完成(!)


f:id:maruuusa83:20160609102942j:plain

スマホでも見られる(これは自分で実際に使っているタスク管理アプリ)


スプレッドシートには「フォームの回答1」という新しいシートが追加され,質問に回答するとここに反映されるようになっています.


f:id:maruuusa83:20160609101323p:plain

回答一覧のシート







2. スクリプトを使ったフォームの回答のコピー


先ほどのフォームの回答はタスク管理のシートに登録したいわけなので,「フォームの回答1」からタスク管理のために作ったスプレッドシートに自動的にコピーするようにしていきます.




2.1 下準備

スクリプトを書くときに設定しやすいように,シートの名前を統一しておきましょう.

フォームの回答が保存されるシートを「フォームの回答」タスク管理のために作ったシートを「タスク一覧」とすることにしました.


f:id:maruuusa83:20160609115356p:plain

シートの名前の変更




2.2 コピーするスクリプト

2.2.1 新しいスクリプトの作成

ここからはスクリプトを書いていくので,スクリプトエディタを開きます.


f:id:maruuusa83:20160609104959p:plain

スクリプトエディタを開く


f:id:maruuusa83:20160609105128p:plain

スクリプトエディタ


新しいスクリプトを作成します.


f:id:maruuusa83:20160609105927p:plain

新規スクリプト


名前はcopyFromFormとでもしておいてください.

最初から追加されているコード.gsは削除してしまって構いません.新しいスクリプトを作成するかわりにコード.gsをリネームするのでも構いません.



2.2.2 列をコピーするスクリプト

次に示すスクリプトは,せっせと列の内容をコピーするものです.


ところでスクリプトの最初のほうの<スプレッドシートのID>というのは,スプレッドシートを開いているときのURLの中に含まれているIDです.

入力する必要があるので,記録しておいてください.


https://docs.google.com/spreadsheets/d/<スプレッドシートのID>/edit#gid=<シートのID>

スプレッドシートのIDの位置


あ,あと,スクリプトを保存しようとするとプロジェクト名を決めろと言われるので,適当にtask_managerなど名前をつけておいてください.


function copyFromForm() {
  var spreadsheet = SpreadsheetApp.openById("<スプレッドシートのID>")
  var sheets = spreadsheet.getSheets();
  for (var i in sheets){
    if (sheets[i].getSheetName() == "フォームの回答") {
      formans = sheets[i];
    }
    if (sheets[i].getSheetName() == "タスク一覧") {
     tasks = sheets[i];
    }
  }
  
  var newtaskrow = formans.getLastRow();
  var taskslastrow = tasks.getLastRow();
  
  // タスクID
  tasks.getRange(taskslastrow + 1, 1).setValue(tasks.getRange(3, 2).getValue() + 1);
  
  // 状態
  tasks.getRange(taskslastrow + 1, 2).setValue("未着手");
  
  // タスク名
  tasks.getRange(taskslastrow + 1, 4).setValue(formans.getRange(newtaskrow , 2).getValue());
  
  // 締切
  tasks.getRange(taskslastrow + 1, 3).setValue(formans.getRange(newtaskrow, 3).getValue());
  
  // タスク詳細
  tasks.getRange(taskslastrow + 1, 5).setValue(formans.getRange(newtaskrow, 4).getValue());
  
  // メモ
  tasks.getRange(taskslastrow + 1, 6).setValue(formans.getRange(newtaskrow, 5).getValue());
  
  // タグ
  tasks.getRange(taskslastrow + 1, 7).setValue(formans.getRange(newtaskrow, 6).getValue());
  
  // 親タスク
  tasks.getRange(taskslastrow + 1, 8).setValue(formans.getRange(newtaskrow, 7).getValue());
  
  // 継続タスク
  tasks.getRange(taskslastrow + 1, 9).setValue(formans.getRange(newtaskrow, 8).getValue());
  
  // 最終更新
  tasks.getRange(taskslastrow + 1, 10).setValue(formans.getRange(newtaskrow, 1).getValue());
}

フォームの回答をコピーするスクリプト


<スプレッドシートのID>で指定したスプレッドシートからフォームの回答シートとタスク一覧シートを探し出し,フォームの回答の最終行をタスク一覧の最終行へ追加する.という処理をおこなっています.

sheet.getRange(row, col)は,シートの左上:A1を(1, 1)とした位置で指定します.


タスクIDは,スプレッドシート上でカウントしているタスク数に1を加えたものを設定するようにしています.



2.2.3 スクリプトのデバグ実行

きちんと動作するか確認するために,デバグ実行してみます.

デバグボタンを押してスプレッドシートを確認してみてください.


f:id:maruuusa83:20160609123251p:plain

デバグ実行


f:id:maruuusa83:20160609123435p:plain

テストタスクが自動的にコピーされた!


もし正しく動作しなければ,エラーメッセージなど見ながらデバグしてみてください.




2.3 トリガの設定

先ほどのスクリプトをフォームが入力された時点で動作するように設定します.



2.3.1 トリガの設定 ツールバーからトリガ設定を開いて,[copyFromForm」に対して「スプレッドシートから」「フォーム送信時」を設定してください.


f:id:maruuusa83:20160609124328p:plain

トリガ設定を開く


f:id:maruuusa83:20160609111658p:plain

トリガの設定


トリガを設定すると許可を求める画面が表示されるので,許可してください.



2.3.1 トリガのテスト

これでタスクの自動登録ができるようになったハズなので,フォームに入力してタスク一覧のシートを見ながら送信してみます.


f:id:maruuusa83:20160609143329p:plain

フォームを記入して送信すると


f:id:maruuusa83:20160609143355p:plain

自動的にコピーされた!







3. 最終更新日時の自動更新(おまけ)


せっかくスクリプトを作っているのでおまけスクリプトを追加します.

最終更新日時を自分の手でアップデートするのはなんだかあほらしいので自動更新するように設定します.


function insertLastUpdated() {
   var spreadsheet = SpreadsheetApp.getActiveSheet();
   var currentrow = spreadsheet.getActiveCell().getRow();
  
   if (spreadsheet.getSheetName() == "タスク一覧" && currentrow >= 6){
       spreadsheet.getRange(currentrow, 10).setValue(new Date());
   }
}

最終更新日時を更新するスクリプト


トリガを更新時にしたとき,getActiveSheetやgetActiveCellを用いて更新されたセルを特定することができます.

更新されたタスクの最終更新のセル(J行)に現在の日にちを自動的に書き込みます.

(自動更新されたセルをクリックするとわかりますが,更新時間まで記録されています.)

シートやタスクを書き込む範囲をきちんと設定しておかないとややこしいことになるので条件分岐しています.







これでタスク追加アプリを作成することができました!!!!やったね!!!

これでタスク一覧の操作のしやすさと登録のしやすさが両立できるようになりました.




では

今回はこの辺で! ノ


まるさ