Thunderbirdアドオン開発方法（ちょっとしたメモ）追記2

#Thunderbird 本体とは別のウィンドウを調査する方法
と題して、Lightningを改造した話も含めました（末尾に記載）。


**私の願い**
・LightningのTODOの内容をHTML（WYSIWYG）で書きたい。
　太字、文字色、リンクが使えればそれでいい。いえ、 **リンクだけ** で良いんです。
・アドオン開発記事が少ないので、開発者増を願って。（だれかの参考になれば、という程度ですが）

## 言葉の定義
Thunderbird **本体** と私が表記したのは、メール一覧が見えているあのウィンドウのことです。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184636/aae00eb0-e884-57ab-a8f0-02fef5f42fbf.png" width="250" title="wikipediaの画像を拝借">

**別のウィンドウ** と私が表記したのは、例えば、この記事では、LightningのTODO編集画面のことです。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184636/776589d5-f954-16e8-683f-ab8a3f042941.png" width="250">


##ここを調査したい時のため の記事です　と　末尾に改造した話も記載
TODO編集画面の赤点線枠で表示された部分です。（ここをテキストではなく、WYSIWYGで編集したい。リンクしたいだけ）
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184636/b0cc2c43-8676-e4a3-6561-485de1c726f1.png" width="400">

本当は、なんという名称なんでしょうね。

##■調べ方

###▼調べてる場所が違うから
普通に調べようとしても、そこに赤点線枠が表示されないんですね。（普通知って・・る？私は知らなかった）
下記③のように調べてる場所が違うからですね。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184636/388fc6e8-03a9-b9d8-9eca-22ee183ce1c1.png" width="80%">

###▼調べる場所を変更しましょう
開発ツールで調べる場所は、下図のように変更しましょう。
今回はcalendar-event-dialog.xulが対象です。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184636/619f4315-8985-7b50-55de-e0d1be471929.png" width="65%">

###▼対象を調べてみましょう
対象を変更したら、いつも通りに要素を調べられます。
今回は、TODOの内容を入力するtextareaを選びました。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184636/5e617292-4cfa-75ab-be3d-8c86bb53ad32.png" width="80%">

###▼変更してみます
背景色を赤にするための、cssを追加したところです。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184636/6f7a609e-befd-03ed-fe2b-1605e095367a.png" width="80%">

**こんな感じで、開発していきます**


##■途中までやったこと
下図は、開発途中（開発諦めた）の画面で、文字列を選択して「Link」ボタンを押したところです。
Linkが貼られて、太字になります。（そこまでしか作らなかった）

1. 通常のテキストエリアの横に、ボタンを２つ追加した
2. その横に、WYSIWYGできるようにeditor要素を追加した

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184636/899fc856-0d17-f61a-e24f-db6b9d8bb165.png" width="80%">


##■本当にやりたいこと
私が本当にやりたいことは、TODOの内容にメールへのリンクを貼って、
クリックしたら、該当のメールが開くことです。

もしくは、「関連リンク」などでメールへのリンクが設定でき、選ぶとメールが開くことです。
※下図には関連リンクというメニューがありますが、私の環境では動作せず。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184636/a3b95953-2325-e421-6adc-b7121e956d3e.png)

**後述**しますが、「添付」ボタンで似たようなことができました（＾＾；


##■参考：個別メールへのリンクの方法
[thunderlink](https://addons.thunderbird.net/ja/thunderbird/addon/thunderlink/ "thunderlink")というアドオンで可能です。
68.8ですが、ギリギリ動きます（アドオンの設定画面がおかしいですが）
ここの[サポートページ](https://github.com/mikehardy/thunderlink "サポートページ")にインストール方法が書いてあります。

アドオン入れてから、
1. レジストリをいじって個別メールをを起動できるようにするか、
　　英語よくわからないけど64bit TBはできないとかサポートページに？
　　サポートページの1番のレジストリファイルでも起動できますね。（パスへ自分の環境に合わせてください）
2. 下記の私が用意したスクリプトのような、スクリプトを既定のプログラムで指定して、起動できるようにするか、
です。


***私が用意したスクリプト***

```thuderlink.vbs

Option Explicit

Dim objWshShell
Set objWshShell = WScript.CreateObject("WScript.Shell")

objWshShell.Run "C:\Thunderbird\thunderbird.exe -thunderlink " & Wscript.Arguments(0)

Set objWshShell = Nothing
```


##仕様を変えて、開発を続ける気になった。ありがとうQiita
記事を書いていたら、仕様を変えればすぐに実装できそうなことに気づいた。
1. 私は、編集画面の「場所」欄を使っていないので、「場所」にメールへのリンクを記入する。
2. ボタンを追加して、そのボタンを押したら、「場所」に記載されているメールを開く（スクリプトを呼び出す）。
　　ただし、「場所」欄が空だったら入力ダイアログを表示して、メールリンクを入力する（「場所」欄に保存する）

###完成しました
「場所」欄にthunderlinkを記入して保存しておけば、右下の「Link」ボタンを押すと、該当メールが開きます。
下図では「プログラム起動」確認ダイアログが表示されていますが、下図のように下部のチェックを入れて
一度「リンクを開く」ボタンを押せば、この確認ダイアログは次回以降表示されません。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184636/2eea6116-7708-644b-7f35-189fd0fedb6f.png" width="80%">


###変更したのはこのファイル

\lightning-68.5.0-tb\chrome\lightning\content\lightning\lightning-item-iframe.xulです。
下記の<button>タグです（buttonタグ前後は追加する場所がわかるように記載しました）

```lightning-item-iframe.xul

        <tabpanels id="event-grid-tabpanels"
                   flex="1">
          <tabpanel id="event-grid-tabpanel-description">
            <html:textarea id="item-description"
                           disable-on-readonly="true"/>
<button label="Link"
        oncommand="if(document.getElementById('item-location').value == ''){
  document.getElementById('item-location').value = window.prompt('thunderlinkを入力してください', '');
}else{
window.location.href = document.getElementById('item-location').value;
}" />
          </tabpanel>
          <tabpanel id="event-grid-tabpanel-attachments">
            <vbox flex="1">
              <richlistbox id="attachment-link"
                           seltype="single"
                           context="attachment-popup"
                           rows="3"
                           flex="1"
                           disable-on-readonly="true"
                           onkeypress="attachmentLinkKeyPress(event)"
                           ondblclick="attachmentDblClick(event);"/>
            </vbox>
          </tabpanel>

```


##ちなみに「添付」機能について

「添付」機能でも似たようなことができました。
以下解説です。

ツールバーの添付ボタンを押すとURL入力画面が表示された
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184636/2c6d6ef1-15cb-2850-5eb8-9cb7333c70ea.png" width="70%">

ここでthunderlinkを入力し、OKボタンを押すと下図のように、添付として保存される。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184636/ef8753c6-5c15-324e-c6e9-0e930deecfe0.png" width="70%">

添付ファイル欄をダブルクリックすると、該当メールが開かれた。

**でも面倒くさい**
いちいち、添付タブを開いて、添付ファイル欄をダブルクリックして・・・
私の改造した方が手数が少なくらくちんです。



##追記：2020-05-21　関連リンクについて

わがままなので、
1. わざわざメールを右クリック、メニューからthunderlinkを選んで、クリップボードを汚したくないなぁ
2. 作ったボタンすら押したくないなぁ
ということで、引き続きLightningアドオンのソースを見ていました。

「関連リンク」は非表示になっているだけで、実は存在するようです。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184636/f58f7f2c-40c4-d841-b192-8afce30612c2.png" width="65%">
開発ツールで無理やり表示して、「aaa」と設定したら、リンクっぽくなりました。
クリックできそうなマウスカーソルになりますが、~~クリックしても何も起きない・・・~~
追記２　href="http://google.com" value="ggl"としたら、クリックしたらブラウザが開いてgoogleが開きました。

A. 新規ToDoや予定の場合はリンクなし
B. メールから変換した場合は、予定／ToDo画面が表示されたとき選択されているメールのthunderlinkを自動取得して、
　関連リンクに設定してくれたらいいなぁ
と思っていますが、まだできていません。

追記２　メニューから関連リンクをON/OFFできるようにしたり、
　　　　関連リンクを設定できるようにしたいな、と色々確認していますが、
　　　　難しい・・・諦め感満載