2018年2月27日火曜日

キーボードで Google 検索する拡張機能を作りました

Google 検索ですが、いつも j k / Enter を超多用して検索しています。
で、このショートカットキーは元々ある機能だったのですが、あるとき無くなりました。

Google 検索から Google+ が外されたタイミング? だったな、、
それと一緒に消え失せました。

なので、自分で作りました。Chrome の拡張機能です。
もし無くなって未だに不便を感じている方はどうぞ。
キーボード使ってなかった、という方は今すぐ使ってください。効率がダンチです。

Google Search with Keyboard






こんな感じで ▶ が表示されます。

以下だけのシンプル機能です。
  • j : 下を選択
  • k : 上を選択
  • / : 入力ボックスへ移動

ブラウザ標準のショートカットと合わせるのが常套手段です。
  • Enter : 選択中のリンクへ遷移
  • Ctrl + Enter : 選択中のリンクを新規タブで開く

Google Search with Keyboard
https://chrome.google.com/webstore/detail/google-search-with-keyboa/ickgeahkgnomlmmmpmhllbfmbncjcnel?hl=ja

どうぞ!

コードはこちら
https://github.com/jtanaka/GoogleSearchWithKB

2018年2月26日月曜日

Steam に OpenID で接続する

Steam Web API の続きです。

自分のアカウントで Sign in する機能を忘れていたので実装してみました。
↓こういうやつ
Steam には OpenID で接続します。
https://steamcommunity.com/dev

接続には、ここで紹介されていた LightOpenID を使います。

以前に作成した対戦履歴を表示するコードを、以下のように変更しました。

  • Steam ID をセッションから取得する
    • 無ければ Sign in させる
  • API Key を環境変数から取得する

session_start();
if (!isset($_SESSION['steam_id'])) {
 // Require sign in.
 echo "
 <div style='text-align:center'>
  <p><a href='/auth.php'><img src='http://steamcommunity-a.akamaihd.net/public/images/signinthroughsteam/sits_02.png' width='109' height='66' border='0'></a></p>
  <p>Please sign in.</p>
 </div>
 ";
} else {

 // https://gist.github.com/almirsarajcic/4664387
 function convert_steamid_64bit_to_32bit($id)
 {
  $result = substr($id, 3) - 61197960265728;
  return (string) $result;
 }
 function convert_steamid_32bit_to_64bit($id)
 {
  $result = '765'.($id + 61197960265728);
  return (string) $result;
 }

 $key = getenv("STEAM_API_KEY"); // Set API key from environment variable.
 $steamid = $_SESSION['steam_id']; // Set target's steam id here.
 echo "<h2>SteamID : {$steamid}</h2>";
 $accountid = convert_steamid_64bit_to_32bit($steamid);
 echo "<h2>accountid : {$accountid}</h2>";

 $curl = curl_init();
 
 // ヒーローリストを取得する
 curl_setopt($curl, CURLOPT_URL, "https://api.steampowered.com/IEconDOTA2_570/GetHeroes/v1?key={$key}");
 curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
 $json = curl_exec($curl);
 $response = json_decode($json);
 $heroes = [];
 foreach ($response->result->heroes as $hero) {
  $heroes[$hero->id] = str_replace("npc_dota_hero_", "", $hero->name);
 }

 // 対戦履歴を取得する
 curl_setopt($curl, CURLOPT_URL, "https://api.steampowered.com/IDOTA2Match_570/GetMatchHistory/v1?key={$key}&account_id={$accountid}");
 curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
 $json = curl_exec($curl);
 $response = json_decode($json);

 curl_close($curl);

 // 対戦履歴一覧を表示する
 foreach ($response->result->matches as $match) {
  $start_time = new DateTime('@' . $match->start_time);
  foreach ($match->players as $player) {
   if ($player->account_id == $accountid) {
    $hero_name = $heroes[$player->hero_id];
    $img = "<img src='http://cdn.dota2.com/apps/dota2/images/heroes/{$hero_name}_sb.png'>";
   }
  }

  echo "
  <div>
  {$start_time->format('Y/m/d H:i:s')}
  {$img}
  </div>
  ";
 }

}
index.php

Sign in は別のファイルで実装しました。
<?php
include_once("../vendor/autoload.php");

$openid = new LightOpenID("https://test-steam-web-api.azurewebsites.net");
$openid->identity = "http://steamcommunity.com/openid";
$openid->returnUrl = "https://test-steam-web-api.azurewebsites.net/auth.php";

if (!$openid->mode) {
 header('Location: ' . $openid->authUrl());
} elseif ($openid->mode == 'cancel') {
 header('Location: /');
} else {
 if ($openid->validate()) {
  session_start();

  $claimed = explode("http://steamcommunity.com/openid/id/", $openid->identity);
  $steam_id = $claimed[1];
  $_SESSION['steam_id'] = $steam_id;
 }

 header('Location: /');
}

exit;
auth.php

実際に動かせるサイトを準備しました。
コードはこちら

参考

https://steamcommunity.com/dev
https://github.com/iignatov/LightOpenID/blob/master/examples/example.php

2018年2月25日日曜日

Steam Web API で Dota2 の対戦履歴を表示する

Steam Web API の続きです。
自分の Dota2 の対戦履歴を取得するところまでやってみました。

使う API は以下の2つ。
あと、画像を取得するのに CDN を利用します。
  • http://cdn.dota2.com/apps/dota2/images/heroes/<name>_<suffix>
CDN の使い方はこちらに書いてありますが、1例を。
http://cdn.dota2.com/apps/dota2/images/heroes/pangolier_lg.png

これらを組み合わせて、対戦履歴を表示してみました。
コードはこんな感じに。


 // https://gist.github.com/almirsarajcic/4664387
 function convert_steamid_64bit_to_32bit($id)
 {
  $result = substr($id, 3) - 61197960265728;
  return (string) $result;
 }
 function convert_steamid_32bit_to_64bit($id)
 {
  $result = '765'.($id + 61197960265728);
  return (string) $result;
 }

 $key = "YOUR_API_KEY"; // Set Your API key here.
 $steamid = 76561197961028586; // Set target's steam id here.
 echo "<h2>SteamID : {$steamid}</h2>";
 $accountid = convert_steamid_64bit_to_32bit($steamid);
 echo "<h2>accountid : {$accountid}</h2>";

 $curl = curl_init();
 
 // ヒーローリストを取得する
 curl_setopt($curl, CURLOPT_URL, "https://api.steampowered.com/IEconDOTA2_570/GetHeroes/v1?key={$key}");
 curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
 $json = curl_exec($curl);
 $response = json_decode($json);
 $heroes = [];
 foreach ($response->result->heroes as $hero) {
  $heroes[$hero->id] = str_replace("npc_dota_hero_", "", $hero->name);
 }

 // 対戦履歴を取得する
 curl_setopt($curl, CURLOPT_URL, "https://api.steampowered.com/IDOTA2Match_570/GetMatchHistory/v1?key={$key}&account_id={$accountid}");
 curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
 $json = curl_exec($curl);
 $response = json_decode($json);

 curl_close($curl);

 // 対戦履歴一覧を表示する
 foreach ($response->result->matches as $match) {
  $start_time = new DateTime('@' . $match->start_time);
  foreach ($match->players as $player) {
   if ($player->account_id == $accountid) {
    $hero_name = $heroes[$player->hero_id];
    $img = "<img src='http://cdn.dota2.com/apps/dota2/images/heroes/{$hero_name}_sb.png'>";
   }
  }

  echo "
  <div>
  {$start_time->format('Y/m/d H:i:s')}
  {$img}
  </div>
  ";
 }
https://github.com/jtanaka/test_steam_web_api

実行するとこんな感じに。



無事表示することができました。
ここまで確認できればサービス作れますね。

参考

https://wiki.teamfortress.com/wiki/WebAPI#Dota_2

2018年2月24日土曜日

Windows で高速に Git clone する方法

Windows 環境で開発しているとき、 どうやって Git clone していますか。

実はコマンドは、エクスプローラーのアドレスバーに直接打ち込めます。








Powershell を開くときなども、ここに "powershell" と打ち込むとディレクトリを移動しなくて良いので楽です。

2018年2月20日火曜日

Steam Web API で求められる account_id とは

Steam Web API の一覧をみていると、必須 paramter に account_id というのが結構でてきます。



これは Steam ID でも API KEY でもないのですが、パッと探しても情報がでてきずらいのでメモしておきます。

account_id とは

「32-bit account ID」 とか 「STEAMID32」とか呼ばれていますが、要するに
  • STEAM ID が 64-bit の ID
  • STEAM ID の 32-bit 版 が account_id
ということです。

生成方法

で、その STEAMID64 と STEAM32 を相互変換する式があって、その方法がこちら。
  • STEAMID64 - 76561197960265728 = STEAMID32
  • STEAMID32 + 76561197960265728 = STEAMID64
  • OR
  • STEAMID32 = The right-most 32-bits of STEAMID64
  • STEAMID64 = concatenate("00000001000100000000000000000001", STEAMID32);
出典: https://dev.dota2.com/showthread.php?t=58317
上記は、64-bit の数値を扱える場合。
そうでない場合は、もうちょっと頑張る必要があるとのこと(試していません)。
define("STEAM_ID_UPPER_32_BITS", "00000001000100000000000000000001");
    // gets the lower 32-bits of a 64-bit steam id
    function GET_32_BIT ($ID_64) {
        $upper = gmp_mul( bindec(STEAM_ID_UPPER_32_BITS) , "4294967296" );
        return gmp_strval(gmp_sub($ID_64,$upper));
    }

    // creates a 64-bit steam id from the lower 32-bits
    function MAKE_64_BIT ( $ID_32, $hi = false ) {
        if ($hi === false) {
            $hi = bindec(STEAM_ID_UPPER_32_BITS);
        }

        // workaround signed/unsigned braindamage on x32
        $hi = sprintf ( "%u", $hi );
        $ID_32 = sprintf ( "%u", $ID_32 );

        return gmp_strval ( gmp_add ( gmp_mul ( $hi, "4294967296" ), $ID_32 ) );      
    }  
※出典: https://dev.dota2.com/showthread.php?t=47115&page=27&p=312817&viewfull=1#post312817

GitHub に相互変換のソースもありました。
https://gist.github.com/almirsarajcic/4664387

以上。

2018年2月19日月曜日

Steam に Web API があったので試してみた

Dota 2 をやっていると、何か自分の対戦履歴が自動で反映されている Web サイトがあったりするわけです(超便利)。
https://www.dotabuff.com

気になったので調べてみたら、やはり Web API があるようで。
https://wiki.teamfortress.com/wiki/WebAPI#Dota_2

試してみました。

API Key を取得する

ここで、API Key を取得します。

取得するとキーの所にキーが表示されます。
ドメイン名は、公開予定も無いのでとりあえず適当で大丈夫でした。

自分のプロフィールを取得してみる

手始めに、プロフィールを取得してみます。

        $key = "YOUR_KEY";
        $steamid = "76561197961028586";

        $curl = curl_init("http://api.steampowered.com/ISteamUser/GetPlayerSummaries/v2/?key={$key}&steamids={$steamid}");
        curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
        $response = curl_exec($curl);

        var_dump($response);
        curl_close($curl);
こんな感じに出力されます。

{
  "response": {
    "players": [
      {
        "steamid": "76561197961028586",
        "communityvisibilitystate": 3,
        "profilestate": 1,
        "personaname": "TANAKA",
        "lastlogoff": 1518968667,
        "profileurl": "http://steamcommunity.com/id/jumtana/",
        "avatar": "https://steamcdn-a.akamaihd.net/steamcommunity/public/images/avatars/bd/bd0af6bb099845e0c93d3bba467cdd96e743ce51.jpg",
        "avatarmedium": "https://steamcdn-a.akamaihd.net/steamcommunity/public/images/avatars/bd/bd0af6bb099845e0c93d3bba467cdd96e743ce51_medium.jpg",
        "avatarfull": "https://steamcdn-a.akamaihd.net/steamcommunity/public/images/avatars/bd/bd0af6bb099845e0c93d3bba467cdd96e743ce51_full.jpg",
        "personastate": 1,
        "realname": "Jumpei Tanaka",
        "primaryclanid": "103582791429548415",
        "timecreated": 1063939457,
        "personastateflags": 0,
        "loccountrycode": "JP",
        "locstatecode": "40",
        "loccityid": 26138
      }
    ]
  }
}
取れてる取れてる。
単純に上記だけであれば、GET なのでブラウザでも見れます。

次は対戦履歴でも取得してみます。

2014年12月17日水曜日

Surface Pro 2 でマルチディスプレイを試してみました

自宅のデスクトップ PC が絶賛死亡中なので、Surface Pro 2 を自宅でも使っていたのですが流石に家では大きいディスプレイで見たくなってきました。

Surface Pro 2 は Mini Display Port、自宅のディスプレイは HDMI ということでこちらのケーブル ¥750 を購入。

その他もっと安いケーブルからお高いケーブルまで色々とありますが、レビューコメントから察するにあまりに安いものは初期不良&故障率が高そうだったので、ちゃんと動きそうでお値段控えめのこちらを選択しました。

早速接続。
心配だった初期不良もなく、快適に動いています。
ただ、画面が大きいと Clear Type Font に対応しているか否かによるテキストの鮮明さが露骨です。ケーブルは関係ありませんが。

スクリーンショット (50)


あと地味に Windows 8 だとディスプレイ切り替えの UI が便利なのがいいですね。

スクリーンショット (50)

マシンパワーも申し分ないので、リアルにデスクトップ PC 不要の時代を感じました…