Mouse dictionary helper

Mouse Dictionary で引いた結果をAnkiwebのdeckに登録する君
当前为 2021-07-08 提交的版本，查看最新版本。
换行
// ==UserScript==
// @name         Mouse dictionary helper
// @namespace    http://tampermonkey.net/
// @version      0.3.1
// @description  Mouse Dictionary で引いた結果をAnkiwebのdeckに登録する君
// @author       @ozero
// @match        *://*/*
// @grant       GM.setValue
// @grant       GM.getValue
// ==/UserScript==

'use strict';

/*
# Mouse Dictionary で引いた結果をAnkiwebのdeckに登録する君

1. Mouse dictinaryで単語の意味を表示するやん
2. クリックするやん
3. Ankiwebの単語登録画面が開いて、入力欄にさっき調べてた単語＆意味が自動入力されるねん
4. あとは自動入力の内容を確かめて、Saveクリックして閉じるだけー

あ。↑の 2. で Ctrl + クリック したら、自動入力に加えて「自動保存＆Ankiwebのタブ自動クローズ」までやります。

## セットアップ

1. 拡張 Mouse Dictionary のオプションを開く
2. 設定を開く
3. 上級設定を開く
4. 項目「HTMLテンプレート」をみる
5. テンプレート「Mouse Dictionaryウィンドウ全体」のdivタグに、クラス名 `mouse_dictonary_helper` を足す

足した結果はこうなる

```
<div class="notranslate mouse_dictonary_helper"
     style="all:initial;
            {{systemStyles}}
            width: {{width}}px;
            height: {{height}}px;
            position: fixed;
            overflow-x: hidden;
            overflow-y: {{scroll}};
            top: 5px;
            background-color: {{backgroundColor}};
            z-index: 2147483646;
            padding: 2px 4px 2px 4px;
            border: 1px solid #A0A0A0;"
>
</div>
```

んで、設定を保存してセットアップ終わり。


## 実際の動作（手動追加）

1. Ankiweb にログインする
2. ページを開いて、Mouse Dictionary 拡張を実行
3. 単語をダブルクリックで選択固定
4. Mouse Dictionary ウィンドウをクリック
5. Ankiweb のデッキ追加ページが開いて、Mouse Dictinary で表示されていた内容がAutofillされる


## 実際の動作（自動追加＆Ankiwebウィンドウ自動クローズ）

1. Ankiweb にログインする
2. ページを開いて、Mouse Dictionary 拡張を実行
3. 単語をダブルクリックで選択固定
4. Mouse Dictionary ウィンドウを Ctrl + クリック
5. Ankiweb のデッキ追加ページが開いて、Mouse Dictinary で表示されていた内容がAutofillされる
6. 自動でAnkiweb のデッキ追加ページのSaveボタンがクリックされる
7. 自動でAnkiweb のデッキ追加ページがクローズされる


## え、なんでコンテンツがドメインまたいでるの

`GM.setValue`, `GM.getValue` で、userscript実行環境側のストレージを経由して受け渡ししております。

- https://wiki.greasespot.net/GM.setValue
- https://wiki.greasespot.net/GM.getValue


*/

( () => {
  let mouse_dictonary_helper = {};

  //Mouse dictionaryウィンドウの内容をGM.setValueでGMストレージに保存
  mouse_dictonary_helper.gsetval = (event) => {
    let mdh_element = document.getElementsByClassName('mouse_dictonary_helper')
    if(!mdh_element[0]){
      return false;
    }
    let content = mdh_element[0].innerText;
    GM.setValue( "mdhtmp", content );
    //console.log("set mdh", content);

    //Ctrlキー押下有無(→AnkiwebでAutofill後自動save&close)も持っとく
    if(event.ctrlKey ){
      GM.setValue( "mdhAutosave", "yes" );//set autosave flag
    }else{
      GM.setValue( "mdhAutosave", "no" );
    }

    //ついでにAnkiwebのデッキ追加ウィンドウを開く
    window.open('https://ankiuser.net/edit/', '_blank');

    return;
  };

  //Mouse dictionaryウィンドウの有無をpolling(200ms毎)してクリックイベントを追加
  const mdh_window_poll = () => {
    let mdh_element = document.getElementsByClassName('mouse_dictonary_helper')
    if(mdh_element[0]){
      mdh_element[0].addEventListener('click', mouse_dictonary_helper.gsetval, false);
      console.log("mdh addEventListener");
      return true;
    }else{
      setTimeout(()=>{
        mdh_window_poll();
      }, 200);
      //console.log("mdh polling");
      return false;
    }
  }
  mdh_window_poll();//Pollingの起動

} )();

//Ankiwebのデッキ追加URLを開いた際の入力欄autofill
(async function(){

  if(window.location.href !== "https://ankiuser.net/edit/"){
    return;
  }

  const mdhtmp = await GM.getValue( "mdhtmp", "" );
  if(mdhtmp === ""){
    return;
  }
  //console.log("get mdh", mdhtmp);

  //Autofill
  const mdhtmp_2 = mdhtmp.split("\n\n");
  const mdhtmp_3 = mdhtmp_2.shift().split("\n");
  const head = mdhtmp_3.shift();
  const body = mdhtmp_3.join("\n");

  let el_front = document.getElementById("f0");
  el_front.innerText = head;

  let el_back = document.getElementById("f1");
  el_back.innerText = body;

  //Clear
  GM.setValue( "mdhtmp", "" );

  //Autosave & close
  const mdhAutosave = await GM.getValue( "mdhAutosave", "no" );
  if(mdhAutosave !== "yes"){
    return;
  }
  GM.setValue( "mdhAutosave", "" );//clear autosave flag

  //Tell Autosave&close to user
  document.getElementById("msg").innerText="Auto Save & Auto Close ENABLED.";
  document.getElementById("msg").style.display = "block";

  //Util
  const sleep = (msec) => {
    return new Promise(resolve => setTimeout(resolve, msec))
  };

  await sleep(500);
  let el_btn = document.querySelector("body > main > p > button");
  el_btn.click();

  await sleep(1000);
  window.close();

})();

//console.log("mdh loaded");
欢迎访问Greasy Fork镜像
