GiphyのGIF画像を貼り付けるTextwellアクションを作ってみた

T.closelets()の基本形。


Giphy.com

GIPHY | Search Animated GIFs on the Web
CATEGORIESSTICKERSARTISTSGIPHY TVFAVORITES...

拡張キーボードを調べていたら「Giphy専用キーボード」というのがあって「アメリカじゃあ、そんな遊びが流行ってるのかな」ということで調査。ネット上にあるGIFアニメが集まってくるサイトみたいですね。GIFアニメとは、パラパラマンガみたいに画像を動かす技術。アニメのことじゃないです。でもアニメもパラパラマンガの応用だからアニメです。


Textwellアクション

Textwell 1.5.1
分類: 仕事効率化,ユーティリティ
価格: \360 (Sociomedia)

内蔵ブラウザを閉じればimgタグが貼りつくタイプ。Textwellらしさはこれじゃないかと想う。書き換えれば、他のサイトにも応用できるアクションです。

T.closelets([
  {title: "Paste",
  fn: function(){
    url=location.href;
    id=url.replace(/(.+)-(.+?)$/,"$2");
    link="<a href='"+url+"' target=_blank><img src='https://media.giphy.com/media/"+id+"/giphy.gif' width=400></a&>\n";
    T("replaceCurrent",{text:link});
  }}
],function(){
  location="http://giphy.com/search/"+T.stdin.currentText;
})

Import Textwell ActionGiphy


使い方

キーワードを書いてカーソル行で実行するとGiphyの検索結果が出ます。日本語は使えないので、英語で検索してください。結構ヒットする。


対象のGIF画像を開いて、内蔵ブラウザを閉じる。「Paste」でimgタグが貼り付きます。画像をタップすると、元のサイトが開くようにしました。


ブログ上では上記のようになります。


まとめ

通常はHTMLソースを開きDOMの解析をするのですが、GiphyはURLアドレスにIDが埋め込まれているので、GIF画像の取得がしやすかったです。GIFは昔からある技術だけど、こんなに繁盛してなかったよな。よく見ると、アプリの使い方を説明するのにGIFが使われてますね。百聞は一見に如かず。言葉を並べるより、動きを見せるほうが早い。ネットの転送速度が上がったことと、非英語圏の人でも操作を理解しやすいことが要因だろうか。思考に言語が介在しなくなり、より直接的に情報の伝達がされるようになったのかもしれません。