読者です 読者をやめる 読者になる 読者になる

読み書きプログラミング

日常のプログラミングで気づいたことを綴っています

スマートフォンやタブレットで便利な辞書ブックマークレット

JavaScript

iPadiPhoneで英語のウェブサイトを見るとき、辞書が連携してくれなくて辛いです。
辞書用ブックマークレットがたくさんありますが、みんな、辞書サイトを別のページで開くか、辞書アプリを開きます。戻るのが大変で不便です。
別のアプローチでは、POPjisyoずるっこなど素晴らしいサービスがありますが、iPad/iPhone用にレイアウトを維持するのは難しいようです。

そこで、選択した単語の意味をポップアップウィンドウで表示するブックマークレットを作成しました。

ありそうで中々ないです。もし既にありましたら教えてください。


以下のスクリプトブックマークレットとして追加してください。(iPad/iPhoneの場合、適当なサイトをブックマークして、ブックマークの編集でアドレスを以下の内容に入れ替えてください。)

javascript:{var d=document;var w=d.getSelection().toString();if(w.length==0){w=prompt('単語を入力');}var s=d.createElement('script');var c1=function(j){if(j.value.items.length>0){var s=d.createElement('script');s.src='http://pipes.yahoo.com/pipes/pipe.run?Item='+j.value.items[0].content+'&_id=31a195ccfe98d487cda0d86542b4aa18&_render=json&_callback=c2';d.body.appendChild(s)}else{alert(w+'は見つかりませんでした')}};var c2=function(j){alert(w+':'+j.value.items[0].Body.div.div)};s.type='text/javascript';s.src='http://pipes.yahoo.com/pipes/pipe.run?Word='+w+'&_id=8a97f755ae12e854dac4140a27eb38ea&_render=json&_callback=c1';d.body.appendChild(s);}
Yahoo! Pipes


ホールドで単語を選択して、ブックマークレットをタップすると、3〜5秒程度で意味がポップアップします。選択せずにタップすると単語入力プロンプトが出るので調べたい単語を入力してください。(入力をキャンセルすると、nullの意味がわかります…)

問題点

  1. ときどき、何も反応しない時があり、しばらくすると思い出したように反応します…Yahoo!Pipesが重いようです。

追記
先人がおられました。2度Pipeを呼び出すことなく実現されています。

参考にさせていただいて、2度Pipeを読み出さないバージョンを作りました。

javascript:{var d=document;var w=d.getSelection().toString();var s=d.createElement('script');function cb(j){d.body.removeChild(s);alert(w+':'+((j.value.items.length==0)?'は見つかりませんでした':j.value.items[0]['loop:fetchdata'].Body.div.div))}if(w.length==0){w=prompt('単語を入力');if(w==null)return}s.type='text/javascript';s.src='http://pipes.yahoo.com/pipes/pipe.run?Word='+w+'&_id=4b6e4969ccbc8a66fd9a319f6b9f1839&_render=json&_callback=cb';d.body.appendChild(s)}

備忘録

  • 辞書サービスには「イースト辞書Webサービス」を活用しました。
    • イースト辞書Webサービスは、2011/07/08現在、レスオポンスヘッダーにAccess-Control-Allow-Originがなく、クロスドメイン対応ではないです。
    • 大勢のアプリケーション開発者が利用しているGoolge Language API, Google Translate APIは乱用?(abuse)が問題で、2011年12月で終了とのことです。Google Translate Elementを推奨とのこと。
  • XMLJSONPに変換するために"Yahoo!Pipes"を活用しました。
  • 本当にJSONPが必要だったかよくわかってません。ブックマークレットってアクティブなdocumentに帰属するのでしょうか?
    • アドレスバーはアクティブなdocumentに帰属していました。結論として、アクティブなページでポップアップウィンドウで表示させるには、辞書サービスがクロスドメイン対応でない限り、JSONPが必要ということになります。
  • Yahoo!Pipesの内部で属性に割り当てられた値が取り出せないばかりに、2度Pipeを呼び出してます。どうしたらPipes内で値(文字列)が取り出せるのでしょうか?ここが直せたら、レスポンスもずいぶん早くなるはずです。
  • 調べるたびにサイトのbodyにscript要素を21個ずつ追加します。ガーベッジコレクトしなくてもいいですよね…
  • Google Chromeで使うと、なぜか「このページでこれ以上ダイアログボックスを生成しない」が表示されるようになった。
  • alertは味気ないですが、好みのポップアップメニューが設計できます。