1. まとめトップ

PSO2ショップ検索補助Webアプリ

Yahoo!Pipesの練習用に作ってみました。「PSO2マイショップ検索用補助ツールβ」さんが再開するまでの間の繋ぎに使っていただければ幸いです。

更新日: 2013年02月20日

3 お気に入り 6224 view
お気に入り追加

この記事は私がまとめました

ykfmfst2012さん

オリジナル

代用品

対象ブラウザ

動作確認したのは以下のブラウザだけです
・Google Chrome(2/19時点での最新版)
・Firefox(2/19時点での最新版)
・IE8

使い方

検索の対象となるアイテムカテゴリを選択します。選択されているカテゴリのボタンが赤(salmon)色になります。
なお、初期状態では「全アイテム」が選択されています。

検索したい言葉を入力する場所です。
入力してEnterを押せば部分一致検索が実行されます。

・AND検索について
 半角スペース区切りで複数の単語を入力すると
 AND検索になります
・「正規化」について
 入力違いを統一して検索しやすくするための
 おまじないです。
 初期状態では有効になっています。
・「正規化」の統一ルール
 平仮名→カタカナ
 半角カナ→全角カナ
 全角英数→半角英数
 小文字→大文字
 ローマ数字→アラビア(算用)数字
 記号→切り捨て
・「正規化」の例
 下記4入力は全て同じとみなされます
  ラッピー
  らっぴー
  ラッピー
  (ラ/っ/ピ/ー)

検索条件を満たしたアイテムが一覧表示されます。

アイテム名をクリックすると、wiki(http://pso2wiki.net/)の対応するページが開きます。

「コピー」ボタンを押すと、コピーエリアフレームにテキストが転記されるので「CTRL+C」でコピーしてください。
なお、IEだけはクリップボードに直接コピーします。(クリップボードへの書き込みを許可した場合のみ)

検索結果フレームで「コピー」ボタンを押した場合に、アイテム名が書き込まれる場所です。ボタンを押すとフォーカスが移動するので「CTRL+C」でコピーしてください。

構成、処理の流れについて

★アイテム名データの管理

アイテム名はwiki(http://pso2wiki.net/)から取得して来ています。
集合知に勝るものなし。

1.wikiをRSSとして取得する
 「Yahoo! Pipes」にてwikiをRSSとして出力できるようなpipeを作成
  ・URL:http://pipes.yahoo.com/pipes/
  ・武器やユニットはカテゴリごとに1pipe
  ・ルームグッズなどは全体で1pipe
  ・wikiの構成が入り組んでいるディスク系はtableごとに1pipe
  ・総pipe数は31
2.使いやすいようRSSを成形して「csv形式」で出力
 JavaScript(jQuery)にてローカルツールを作成
  ・フィードの取得は「jquery.jfeed.js」を利用
   URL:https://github.com/jfhovinne/jFeed
   「Google Ajax Feed API」は更新頻度が低すぎるので途中で載せ替えた
  ・アイテム名の正規化は成形のついでに行う
   オリジナルとは別カラムに正規化済みテキストを持っておく
  ・csv出力は"Google Chrome"で「File System API」を利用
   ブラウザからローカルファイル出力するのは意外と大変
  ・「Google Drive」へのアップは今のところ手動
   (検索アプリのコードとデータは「Google Drive」に置き
    最近追加された"Webホスティング機能"で公開している)
   将来的には(GAEとかで)自動化して、1日1回自動で更新されるようにしたいよね。
3.検索アプリでアイテム名データcsvを読み込んで展開
  ・「jquery.csv.js」を利用
  ・検索カテゴリごとにコンテナを作って放り込むだけ

★検索処理

何の工夫もなく、対象となる検索カテゴリのアイテム名コンテナを馬鹿正直に全部調べている
1カテゴリせいぜい1000件なので

★コピー処理

イマドキはクリップボードを使うのは流行りじゃないというか、セキュリティ的にありえないことだそうなので残念ながら一手間多い。IEは初回の警告を無視すればクリップボードを使えます(動作確認したのはIE8のみ)

1