<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>橋本商会 &#187; Ruby</title>
	<atom:link href="http://shokai.org/blog/archives/tag/ruby/feed" rel="self" type="application/rss+xml" />
	<link>http://shokai.org/blog</link>
	<description>なんか作ったりした記録を忘れないうちに書くblog</description>
	<lastBuildDate>Mon, 06 Feb 2012 13:32:44 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
<atom:link rel="hub" href="http://pubsubhubbub.appspot.com/" />
			<item>
		<title>地震のデータを取得する</title>
		<link>http://shokai.org/blog/archives/5751</link>
		<comments>http://shokai.org/blog/archives/5751#comments</comments>
		<pubDate>Mon, 06 Feb 2012 13:31:42 +0000</pubDate>
		<dc:creator>shokai</dc:creator>
				<category><![CDATA[未分類]]></category>
		<category><![CDATA[Ruby]]></category>
		<category><![CDATA[Tech]]></category>
		<category><![CDATA[地震]]></category>

		<guid isPermaLink="false">http://shokai.org/blog/?p=5751</guid>
		<description><![CDATA[最近地震の悪夢を見たので地震のデータを取ってみることにした。 気象庁のページで日付をURLで指定してデータが取れるので、Rubyの配列で震源地名、緯度経度、時刻、震源の深さ、マグニチュードを返すやつを作った quake. [...]]]></description>
			<content:encoded><![CDATA[<p>
最近地震の悪夢を見たので地震のデータを取ってみることにした。<br />
<br />
気象庁のページで<a href="http://www.seisvol.kishou.go.jp/eq/daily_map/japan/20120101_list.shtml">日付をURLで指定してデータが取れる</a>ので、Rubyの配列で震源地名、緯度経度、時刻、震源の深さ、マグニチュードを返すやつを作った<br />
<br />
<br />
quake.rb<br />
<pre class="prettyprint">
require 'rubygems'<br />
require 'open-uri'<br />
require 'kconv'<br />
require 'date'<br />
<br />
class Quake<br />
  def self.get(date=Date.today-1)<br />
    url = "http://www.seisvol.kishou.go.jp/eq/daily_map/japan/#{date.to_s.gsub('-','')}_list.shtml"<br />
    page = open(url).read.toutf8<br />
    page.scan(/&lt;pre&gt;(.+)&lt;\/pre&gt;/im).first.first.split(/[\r\n]/).map{|i|<br />
      i.strip<br />
    }.delete_if{|i|!(i =~ /^\d+/)}.map{|i|<br />
      tmp = i.split(/[^\d\.]+/)<br />
      {<br />
        :place =&gt; i.split(/\s+/).last,<br />
        :time =&gt; Time.mktime(tmp.shift.to_i, tmp.shift.to_i, tmp.shift.to_i, tmp.shift.to_i, tmp.shift.to_i, tmp.shift.to_i),<br />
        :lat =&gt; tmp.shift.to_i+tmp.shift.to_f/60,<br />
        :lon =&gt; tmp.shift.to_i+tmp.shift.to_f/60,<br />
        :depth =&gt; tmp.shift.to_i,<br />
        :magnitude =&gt; tmp.shift.to_f<br />
      }<br />
    }<br />
  end<br />
end<br />
<br />
if $0 == __FILE__<br />
  ##  ruby -Ku quake.rb<br />
  ##  ruby -Ku quake.rb 20120102<br />
<br />
  date = ARGV.empty? ? Date.today-1 : Date.parse(ARGV.shift)<br />
  p Quake.get(date)<br />
end<br />
</pre>
<br />
<br />
結果<br />
<img src="http://gyazo.com/27928c970585e60cefbe16e35139ec43.png">
<br />
<br />
とりあえず毎日、地震データを蓄積してみよう。そのうち解析する。</p>
]]></content:encoded>
			<wfw:commentRss>http://shokai.org/blog/archives/5751/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>githubのリポジトリ数が100超えた</title>
		<link>http://shokai.org/blog/archives/5733</link>
		<comments>http://shokai.org/blog/archives/5733#comments</comments>
		<pubDate>Sat, 24 Dec 2011 11:58:05 +0000</pubDate>
		<dc:creator>shokai</dc:creator>
				<category><![CDATA[未分類]]></category>
		<category><![CDATA[github]]></category>
		<category><![CDATA[Ruby]]></category>
		<category><![CDATA[serial-http-gateway]]></category>
		<category><![CDATA[skype-chat-gateway]]></category>
		<category><![CDATA[SkypeAPI]]></category>
		<category><![CDATA[Tech]]></category>

		<guid isPermaLink="false">http://shokai.org/blog/?p=5733</guid>
		<description><![CDATA[去年のゴールデンウィークの増井研合宿でgithubの使い方を山プルギス氏に教えてもらってから18ヶ月、ついに公開リポジトリ数が100個に達した。 https://github.com/shokai ぜんぜんgithub上 [...]]]></description>
			<content:encoded><![CDATA[<p>
去年のゴールデンウィークの増井研合宿でgithubの使い方を山プルギス氏に教えてもらってから18ヶ月、ついに公開リポジトリ数が100個に達した。<br />
<img src="http://gyazo.com/e444a071de9b8e8dd3eee802b25befe4.png">
<ul><li><a href="https://github.com/shokai">https://github.com/shokai</a></li></ul>
<br />
ぜんぜんgithub上で他人のプロジェクトに首を突っ込んだりしていなかったので、100個のうちほぼ全てが自分で開始したプロジェクトという事になる。だいたい週1つのペースでリポジトリが増えていったわけか<br />
<br />
<br />
100個目のプロジェクトは、<a href="https://github.com/shokai/notify-light">notify-light</a>だった。<br />
これは家の電灯が点いているかどうかを明るさのセンサーで監視して、Skypeのshokai_botというアカウントが俺に通知してくれるシステム。便利である。防犯的な意味で。<br />
<a href="https://github.com/shokai/notify-light/blob/master/notify-light.rb">60行ぐらいのRubyスクリプト1ファイルだけ</a>で実装されている。<br />
<br />
<br />
botからSkypeのグループチャットでこういうのが来る。<br />
<img src="http://gyazo.com/35cdd02b4e994ad9cdf39f510b886b5b.png">
<br />
<br />
センサーを使うのもSkypeへの通知も、すでに便利なツールが作ってあって全部HTTPでできる。<br />
<pre>
ruby notify-light.rb -light http://localhost:8783/ -skype http://localhost:8787/<br />
</pre>
という風に実行すればセンサーを定期的に監視してSkypeに送信できる。<br />
<br />
<br />
■しくみ<br />
CdSという明るさが検出できるセンサーをArduino等に適当に接続し、シリアル通信してMacやLinuxに送る。<br />
serial-http-gatewayというプロジェクトを以前作ってあるので、これを使うとシリアルポートから受信したデータを溜めてjson形式で吐き出すHTTPサーバーが作れる。<br />
<br />
<br />
読んだjsonにはタイムスタンプとセンサーの値（明るさが）入っているので、一定時間内の平均値を計算してノイズを消し、Skypeに通知する。<br />
<br />
Skypeへの通知は先日作ったskype-chat-gatewayというのを使っている。<br />
1年ぐらい前にskype-socket-gatewayというのを作ったけどwindows用だったのでもう使わなくなったし、socketよりもhttpから使えたほうが便利なのと、chat_idという概念がわかりにくいので1チャット1プロセス1portが対応するように作りなおした。<br />
また、MacとLinuxでSkype APIを使う仕組みが違うので、それぞれ別々に実装した。<br />
<br />
Linux版はまだちょっと微妙なんだけど、Mac版は出来がよくてWebブラウザからSkype Chatができるサーバーとかも付いているので便利です。<br />
<br />
<ul>
  <li><a href="http://shokai.org/blog/archives/5439">橋本商会 » serial-http-gateway作った</a></li>
  <li><a href="https://github.com/shokai/serial-http-gateway">serial-http-gateway</a></li>
  <li><a href="https://github.com/shokai/skype-chat-gateway-mac">skype-chat-gateway-mac</a></li>
  <li><a href="https://github.com/shokai/skype-chat-gateway-linux">skype-chat-gatewa-linux</a></li>
</ul>
</p>
]]></content:encoded>
			<wfw:commentRss>http://shokai.org/blog/archives/5733/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Rubyでcometサーバー作る</title>
		<link>http://shokai.org/blog/archives/5712</link>
		<comments>http://shokai.org/blog/archives/5712#comments</comments>
		<pubDate>Mon, 21 Nov 2011 18:18:20 +0000</pubDate>
		<dc:creator>shokai</dc:creator>
				<category><![CDATA[未分類]]></category>
		<category><![CDATA[Comet]]></category>
		<category><![CDATA[EventMachine]]></category>
		<category><![CDATA[HTTP]]></category>
		<category><![CDATA[Ruby]]></category>
		<category><![CDATA[Tech]]></category>

		<guid isPermaLink="false">http://shokai.org/blog/?p=5712</guid>
		<description><![CDATA[最近cometとかいう最新技術が流行っているらしいので、eventmachine_httpserverで作ってみた。 ここにサーバーとクライアントの例がある。どっちも50行ぐらいで実装できた。 comet at mast [...]]]></description>
			<content:encoded><![CDATA[<p>
最近cometとかいう最新技術が流行っているらしいので、eventmachine_httpserverで作ってみた。<br />
<br />
<br />
ここにサーバーとクライアントの例がある。どっちも50行ぐらいで実装できた。<br />
<a href="https://github.com/shokai/eventmachine-study/tree/master/comet">comet at master from shokai/eventmachine-study &#8211; GitHub</a><br />
<br />
サーバー起動して、タイムアウトを10秒に指定。<br />
このサーバーは、POSTされた値を保持して、GETされたら返す。GETに対してはレスポンスを遅らせて返す。<br />
<pre class="prettyprint">
ruby server.rb 8080 10<br />
</pre>
<br />
<br />
クライアントを起動。GETしてから25秒後にPOST<br />
<pre class="prettyprint">
ruby client.rb 25<br />
</pre>
<pre>
GET(comet) -> wait 25 sec -> POST<br />
* GET<br />
sleep 25 sec<br />
404  ## 10秒経過、切断された<br />
<br />
* GET  ## 再接続<br />
404<br />
<br />
* GET  ## 3回目<br />
* POST kazusuke<br />
POST success<br />
200<br />
kazusuke<br />
200  ## 5秒待ってようやく値が返ってきた<br />
kazusuke<br />
* GET<br />
</pre>
<br />
サーバー側のログはこんなんなってた<br />
<pre>
http server start, port:8080, comet_timeout:10(sec)<br />
load: 2.20  cmd: ruby 11481 waiting 0.45u 0.32s<br />
request_method : GET<br />
path_info : /message<br />
query_str :<br />
post_content :<br />
request_method : GET<br />
path_info : /message<br />
query_str :<br />
post_content :<br />
request_method : POST<br />
path_info : /message<br />
query_str :<br />
post_content : kazusuke<br />
kazusuke<br />
request_method : GET<br />
path_info : /message<br />
query_str :<br />
post_content :<br />
</pre>
<br />
cometサーバー、接続が不安定なクライアントにpush通知するのに便利。<br />
</p>
]]></content:encoded>
			<wfw:commentRss>http://shokai.org/blog/archives/5712/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>赤外線学習リモコンKURO-RSのWebコントロールパネル作った</title>
		<link>http://shokai.org/blog/archives/5691</link>
		<comments>http://shokai.org/blog/archives/5691#comments</comments>
		<pubDate>Mon, 07 Nov 2011 23:45:41 +0000</pubDate>
		<dc:creator>shokai</dc:creator>
				<category><![CDATA[未分類]]></category>
		<category><![CDATA[KURO-RS]]></category>
		<category><![CDATA[MongoDB]]></category>
		<category><![CDATA[Ruby]]></category>
		<category><![CDATA[Sinatra]]></category>
		<category><![CDATA[Tech]]></category>

		<guid isPermaLink="false">http://shokai.org/blog/?p=5691</guid>
		<description><![CDATA[赤外線学習リモコンをWebブラウザから使えるようにした。SinatraとMongoDBで、RubyでBuffalo/玄人志向の赤外線学習リモコンを操作するで作ったkuro-rs-serverを操作する。 shokai/k [...]]]></description>
			<content:encoded><![CDATA[<p>
赤外線学習リモコンをWebブラウザから使えるようにした。SinatraとMongoDBで、<a href="http://shokai.org/blog/archives/5681">RubyでBuffalo/玄人志向の赤外線学習リモコンを操作する</a>で作ったkuro-rs-serverを操作する。<br />
<br />
<br />
<a href="https://github.com/shokai/kuro-rs-control-panel">shokai/kuro-rs-control-panel &#8211; GitHub</a><br />
<br />
<br />
これでアプリから様々な機器を操作できる。家に帰る前に暖房つけたりとかNFCでテレビ動かしたりとか。<br />
<br />
<br />
機能はこれだけ。全部GUIとJSON APIがある。<br />
<ol>
  <li>赤外線を読む</li>
  <li>赤外線データに名前をつけて保存する</li>
  <li>名前を指定して赤外線を発射させる</li>
  <li>データ内容を指定して赤外線を発射させる</li>
</ol>
<br />
<br />
■画面<br />
保存した赤外線データの一覧と、新規データの保存ボタンがある<br />
<a href="http://www.flickr.com/photos/shokai/6323596647/" title="KURO-RS Control Panel by shokai, on Flickr"><img src="http://farm7.static.flickr.com/6034/6323596647_d0b1d2ff13_o.png" width="420" height="438" alt="KURO-RS Control Panel"></a><br />
<br />
<br />
赤外線データのpermalink。 /ir/(名前) にある。<br />
学習ボタンを押してすぐKURO-RSに赤外線を当てると<br />
<a href="http://www.flickr.com/photos/shokai/6324124688/" title="KURO-RS Control Panel by shokai, on Flickr"><img src="http://farm7.static.flickr.com/6230/6324124688_b797674382_o.png" width="420" height="310" alt="KURO-RS Control Panel"></a><br />
<br />
<br />
読み取られる。保存したりその場で試し撃ちしたりできる。<br />
<a href="http://www.flickr.com/photos/shokai/6324124758/" title="KURO-RS Control Panel by shokai, on Flickr"><img src="http://farm7.static.flickr.com/6115/6324124758_858599249d_o.png" width="430" height="677" alt="KURO-RS Control Panel"></a><br />
画面下にAPIのヘルプがあって、<br />
<pre class="prettyprint">
curl -d 'name=tv/ch2' http://localhost:8787/kuro-rs.json<br />
</pre>
のようにHTTP-POSTで名前を指定して赤外線発射、などの方法が書いてある。<br />
<br />
<br />
<br />
■使ってみよう<br />
Sinatraの他にMongoDBと、<a href="http://www.amazon.co.jp/exec/obidos/ASIN/B000I0RDJI/shokai-22">KURO-RS</a>が必要。<br />
このコントロールパネルはkuro-rs-serverと通信するので、サーバーとは別プロセスでkuro-rs-serverも起動して使う。<br />
<br />
<pre class="prettyprint">
git clone git://github.com/shokai/kuro-rs-control-panel.git<br />
cd kuro-rs-control-panel<br />
bundle install<br />
cp sample.config.yaml config.yaml<br />
</pre>
config.yamlを編集する。kuro-rs-serverのアドレスぐらいしか編集する必要ない。<br />
<br />
<br />
kuro-rs-serverを起動する<br />
<pre class="prettyprint">
kuro-rs-server /dev/tty.usbserial-00012a34b5 --port 8786<br />
</pre>
<br />
<br />
コントロールパネルも起動する<br />
<pre class="prettyprint">
ruby development.rb<br />
</pre>
もしくはpassenger使うとよい。<br />
<br />
</p>
]]></content:encoded>
			<wfw:commentRss>http://shokai.org/blog/archives/5691/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>IO-DATAのNFCタグリーダーをHTTP、WebSocket、Socketから使えるようにした</title>
		<link>http://shokai.org/blog/archives/5687</link>
		<comments>http://shokai.org/blog/archives/5687#comments</comments>
		<pubDate>Sun, 06 Nov 2011 20:59:07 +0000</pubDate>
		<dc:creator>shokai</dc:creator>
				<category><![CDATA[未分類]]></category>
		<category><![CDATA[EventMachine]]></category>
		<category><![CDATA[NFC]]></category>
		<category><![CDATA[Ruby]]></category>
		<category><![CDATA[Tech]]></category>
		<category><![CDATA[WebSocket]]></category>

		<guid isPermaLink="false">http://shokai.org/blog/?p=5687</guid>
		<description><![CDATA[NFCタグリーダーをサーバーにした。 shokai/nfctag-server &#8211; GitHub 特殊なデバイスはみんなサーバーにしてHTMLとJSから使えるようにすればいい。 1つのハードウェアにいくつもア [...]]]></description>
			<content:encoded><![CDATA[<p>
NFCタグリーダーをサーバーにした。<br />
<a href="https://github.com/shokai/nfctag-server">shokai/nfctag-server &#8211; GitHub</a><br />
<br />
<br />
特殊なデバイスはみんなサーバーにしてHTMLとJSから使えるようにすればいい。<br />
1つのハードウェアにいくつもアプリをぶら下げれるし、アプリはハードウェアと別のマシンで動かせるし、JavaScript書けるし、とにかく楽だ。<br />
<br />
<br />
下は以前作った<a href="http://dev.shokai.org/js/websocket-client/">WebSocket client</a>でnfc-tag-serverに接続してtagを読んでいるところ。<br />
タグがある時はhex dumpされた文字列が、無い時はfalseが送信されてくる。同じ値がHTTPや普通のTCP Socketでも取れるようになっている。<br />
<a href="http://www.flickr.com/photos/shokai/6318644155/" title="NFC Tag Server by shokai, on Flickr"><img src="http://farm7.static.flickr.com/6102/6318644155_9b190ce3d7_z.jpg" width="634" height="618" alt="NFC Tag Server"></a><br />
<br />
<br />
<br />
■NFCタグリーダー<br />
<br />
これ使ってる。USB接続で、けっこうどこででも売ってる。これじゃなくても<a href="http://www.libnfc.org">libnfc</a>で動くデバイスならいけるはず。<br />
ただしlibnfcでFeliCaが読めなかった。MIFAREタグなら読めた。<br />
<div class="amazlet-box" style="margin-bottom:0px;"><div class="amazlet-image" style="float:left;margin:0px 12px 1px 0px;"><a href="http://www.amazon.co.jp/exec/obidos/ASIN/B001992ZS6/shokai-22/ref=nosim/" name="amazletlink" target="_blank"><img src="http://ecx.images-amazon.com/images/I/41d-NhddAcL._SL160_.jpg" alt="I-O DATA FeliCa&#038;MIFAREカード対応 NFCリーダー・ライター「ぴタッチ」 USB2-NFC" style="border: none;" /></a></div><div class="amazlet-info" style="line-height:120%; margin-bottom: 10px"><div class="amazlet-name" style="margin-bottom:10px;line-height:120%"><a href="http://www.amazon.co.jp/exec/obidos/ASIN/B001992ZS6/shokai-22/ref=nosim/" name="amazletlink" target="_blank">I-O DATA FeliCa&#038;MIFAREカード対応 NFCリーダー・ライター「ぴタッチ」 USB2-NFC</a><div class="amazlet-powered-date" style="font-size:80%;margin-top:5px;line-height:120%">posted with <a href="http://www.amazlet.com/browse/ASIN/B001992ZS6/shokai-22/ref=nosim/" title="I-O DATA FeliCa&#038;MIFAREカード対応 NFCリーダー・ライター「ぴタッチ」 USB2-NFC" target="_blank">amazlet</a> at 11.11.07</div></div><div class="amazlet-detail">アイ・オー・データ (2008-05-30)<br />売り上げランキング: 12161<br /></div><div class="amazlet-sub-info" style="float: left;"><div class="amazlet-link" style="margin-top: 5px"><a href="http://www.amazon.co.jp/exec/obidos/ASIN/B001992ZS6/shokai-22/ref=nosim/" name="amazletlink" target="_blank">Amazon.co.jp で詳細を見る</a></div></div></div><div class="amazlet-footer" style="clear: left"></div></div>
<br />
<br />
<br />
■インストール<br />
<pre class="prettyprint">
git clone git://github.com/shokai/nfctag-server.git<br />
cd nfctag-server<br />
</pre>
<br />
<br />
Macの場合<br />
<pre class="prettyprint">
brew install libnfc<br />
gem install nfc eventmachine eventmachine_httpserver em-websocket ArgsParser<br />
</pre>
これで必要なライブラリがインストールされる。<br />
<br />
Mac以外は<a href="http://www.libnfc.org">libnfc</a>を自分でインストールすればたぶんok。Ubuntuは意外にもaptにlibnfc無かった。<br />
<br />
<br />
<br />
■起動<br />
<pre class="prettyprint">
./nfc-tag-server --http_port 8080 --websocket_port 8081 --socket_port 8082<br />
</pre>
<br />
これでHTTPとWebSocketと普通のTCP Socketのサーバーが同時に起動する。<br />
<br />
<br />
それぞれ<br />
<br />
<br />
HTTP-GET<br />
<pre class="prettyprint">
curl 'http://localhost:8080'<br />
</pre>
<br />
<br />
WebSocket<br />
<pre class="prettyprint">
## JavaScript<br />
var ws = new WebSocket("ws://localhost:8081");<br />
ws.onmessage = function(e){<br />
  Console.log(e.data);<br />
};<br />
</pre>
<a href="http://dev.shokai.org/js/websocket-client/">websocket client</a>を使えばすぐ試せる<br />
<br />
<br />
<br />
Socket<br />
<pre class="prettyprint">
telnet localhost 8082<br />
</pre>
<br />
のような感じに接続して、tagのIDが読める。<br />
</p>
]]></content:encoded>
			<wfw:commentRss>http://shokai.org/blog/archives/5687/feed</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>RubyでBuffalo/玄人志向の赤外線学習リモコンを操作する</title>
		<link>http://shokai.org/blog/archives/5681</link>
		<comments>http://shokai.org/blog/archives/5681#comments</comments>
		<pubDate>Mon, 31 Oct 2011 16:37:46 +0000</pubDate>
		<dc:creator>shokai</dc:creator>
				<category><![CDATA[未分類]]></category>
		<category><![CDATA[gem]]></category>
		<category><![CDATA[KURO-RS]]></category>
		<category><![CDATA[Ruby]]></category>
		<category><![CDATA[Tech]]></category>

		<guid isPermaLink="false">http://shokai.org/blog/?p=5681</guid>
		<description><![CDATA[11月22-23日にSFC ORFというSFCの研究室の発表会があって、そこでデモするブツに使う部品としてBuffaloの赤外線学習リモコンのRubyラッパーを書きました。これで家に帰る前に暖房つけたりできてうれしいです [...]]]></description>
			<content:encoded><![CDATA[<p>
11月22-23日に<a href="http://orf.sfc.keio.ac.jp/">SFC ORF</a>というSFCの研究室の発表会があって、そこでデモするブツに使う部品としてBuffaloの赤外線学習リモコンのRubyラッパーを書きました。これで家に帰る前に暖房つけたりできてうれしいですね。<br />
<br />
玄人志向の<a href="http://www.kuroutoshikou.com/modules/display/?iid=928">KURO-RS</a>とBuffaloの<a href="http://buffalo.jp/products/catalog/item/p/pc-op-rs1">PC-OP-RS</a>を操作できます。<br />
<br />
MacとLinuxと、試してないけどたぶんWindowsでも動く気がする。コードは<a href="https://github.com/shokai/ruby-kuro-rs">githubに置いてる</a>。<br />
<br />
<a href="http://f61.aaa.livedoor.jp/~oriheus/index.php?%B3%D8%BD%AC%A5%EA%A5%E2%A5%B3%A5%F3%2FKURO-RS%2F(1)%BB%C8%A4%C3%A4%C6%A4%DF%A4%EB">学習リモコン/KURO-RS/(1)使ってみる &#8211; 脳みそ沸騰中！</a>のPerlのコードを参考にしました。<br />
<br />
■PC-OP-RSを買う<br />
気がついたらKURO-RSがどこにも売ってないんだけど、PC-OP-RSがKURO-RSと同じハードウェアで箱と付属ソフトが違うだけなのでどちらでも動かせます。<br />
<div class="amazlet-box" style="margin-bottom:0px;"><div class="amazlet-image" style="float:left;margin:0px 12px 1px 0px;"><a href="http://www.amazon.co.jp/exec/obidos/ASIN/B000I0RDJI/shokai-22/ref=nosim/" name="amazletlink" target="_blank"><img src="http://ecx.images-amazon.com/images/I/41D58M0CK9L._SL160_.jpg" alt="BUFFALO PCastTV2対応 PC用学習リモコンキット PC-OP-RS1" style="border: none;" /></a></div><div class="amazlet-info" style="line-height:120%; margin-bottom: 10px"><div class="amazlet-name" style="margin-bottom:10px;line-height:120%"><a href="http://www.amazon.co.jp/exec/obidos/ASIN/B000I0RDJI/shokai-22/ref=nosim/" name="amazletlink" target="_blank">BUFFALO PCastTV2対応 PC用学習リモコンキット PC-OP-RS1</a><div class="amazlet-powered-date" style="font-size:80%;margin-top:5px;line-height:120%">posted with <a href="http://www.amazlet.com/browse/ASIN/B000I0RDJI/shokai-22/ref=nosim/" title="BUFFALO PCastTV2対応 PC用学習リモコンキット PC-OP-RS1" target="_blank">amazlet</a> at 11.11.01</div></div><div class="amazlet-detail">バッファロー (2006-09-10)<br />売り上げランキング: 4538<br /></div><div class="amazlet-sub-info" style="float: left;"><div class="amazlet-link" style="margin-top: 5px"><a href="http://www.amazon.co.jp/exec/obidos/ASIN/B000I0RDJI/shokai-22/ref=nosim/" name="amazletlink" target="_blank">Amazon.co.jp で詳細を見る</a></div></div></div><div class="amazlet-footer" style="clear: left"></div></div>
<br />
<br />
<br />
■インストール<br />
<pre class="prettyprint">
gem install kuro-rs<br />
</pre>
<br />
<br />
そしてKURO-RSをMacやLinuxに刺す。<br />
Windowsの人はドライバを入れてBuffaloアプリが動くことを確かめてからUSBポートに刺す。<br />
KURO-RSはUSBポートに接続するとシリアルデバイスとして認識されます。MacやLinuxなら/dev/tty.usb****という名前になる。WindowsならドライバをインストールしていればCOM1とかCOM2とか名前がつく。<br />
<br />
<br />
■赤外線リモコンを学習する<br />
kuro-rsというコマンドがgemと一緒にインストールされています。<br />
<br />
terminalで実行する<br />
<pre class="prettyprint">
% kuro-rs /dev/tty.usbserial-0012a3b4<br />
</pre>
そして15秒以内に赤外線をKURO-RSの本体に当てると、termialに16進数で赤外線データが出力されます。<br />
<br />
<br />
学習した赤外線を発射しましょう<br />
<pre class="prettyprint">
% kuro-rs /dev/tty.usbserial-0012a3b4 ffffffff0300f0e0018083...<br />
</pre>
のように第二引数に16進数でデータを与えます。<br />
<br />
これでテレビのチャンネルが切り替わるはず。<br />
<br />
<br />
■自分のプログラムから使う<br />
こんな感じでIOっぽく使えます。くわしくは<a href="https://github.com/shokai/ruby-kuro-rs/tree/master/examples">examplesディレクトリ</a>を見るといい。<br />
<pre class="prettyprint">
require 'rubygems'<br />
require 'kuro-rs'<br />
<br />
# open KURO-RS<br />
kr = KuroRs.open('/dev/tty.usbserial-0012a3b4')<br />
<br />
# read<br />
puts kr.read <br />
## =&gt; hex dump (ffffffff0300f0e0018083...)<br />
<br />
# write<br />
kr.write 'ffffffff0300f0e0018083'<br />
<br />
# close<br />
kr.close<br />
<br />
# block<br />
KuroRs.open('/dev/tty.usbserial-0012a3b4'){|k|<br />
  k.verbose = true<br />
  puts k.read<br />
  ## =&gt; hex dump (ffffffff0300f0e0018083...)<br />
}<br />
</pre>
<br />
<br />
■Webアプリから使う<br />
シリアルポートは複数プロセスで共有できないし、また複数スレッドから同時に書き込んだりもできないのでRailsやSinatraアプリにkuro-rs gemをそのまま組み込むのはオススメできません。<br />
<br />
そういう時はkuro-rs-serverを使いましょう。<br />
<br />
<br />
こうすると8080番portでhttpサーバーが起動します<br />
<pre class="prettyprint">
% kuro-rs-server /dev/tty.usbserial-0012a3b4 --port 8080<br />
</pre>
<br />
<br />
curlから赤外線読み書きしてみる<br />
<pre class="prettyprint">
# read<br />
% curl 'http://localhost:8080'<br />
# =&gt; hex dump (ffffffff0300f0e0018083...)<br />
<br />
<br />
# write<br />
% curl -d 'ffffffff0300f0e0018083...' 'http://localhost:8080'<br />
</pre>
readもwriteも正常に行われるとstatus 200が返ります。失敗すると200以外。<br />
<br />
kuro-rs-serverを内部APIとしてRailsやSinatraから、あるいはAjaxから使うのが良いと思います。<br />
</p>
]]></content:encoded>
			<wfw:commentRss>http://shokai.org/blog/archives/5681/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>canvasとwebsocketでお絵かき共有</title>
		<link>http://shokai.org/blog/archives/5660</link>
		<comments>http://shokai.org/blog/archives/5660#comments</comments>
		<pubDate>Sun, 31 Jul 2011 18:36:43 +0000</pubDate>
		<dc:creator>shokai</dc:creator>
				<category><![CDATA[未分類]]></category>
		<category><![CDATA[canvas]]></category>
		<category><![CDATA[EventMachine]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[Ruby]]></category>
		<category><![CDATA[Tech]]></category>
		<category><![CDATA[WebSocket]]></category>

		<guid isPermaLink="false">http://shokai.org/blog/?p=5660</guid>
		<description><![CDATA[http://canvas.shokai.org HTML5のcanvasを使ってみたかったので作った。 websocketも使っているので、chromeかsafariで動く。ブラウザ2つ開いてみると、同期しているのがわ [...]]]></description>
			<content:encoded><![CDATA[<p>
<a href="http://canvas.shokai.org/">http://canvas.shokai.org</a><br />
<br />
HTML5のcanvasを使ってみたかったので作った。<br />
websocketも使っているので、chromeかsafariで動く。ブラウザ2つ開いてみると、同期しているのがわかりやすい。<br />
<br />
画像のURLを末尾につけるとその画像が読み込めて、マウスで線を引くとみんなでリアルタイムに描ける。<a href="http://gyazo.com">Gyazo</a>と合わせて使うと便利。<br />
<a href="http://canvas.shokai.org/http://gyazo.com/365d02afdf4953d40ec904df5019aa13.png">http://canvas.shokai.org/http://gyazo.com/365d02afdf4953d40ec904df5019aa13.png</a><br />
<br />
<br />
ソースはgithubに置いた <a href="https://github.com/shokai/shared-canvas">https://github.com/shokai/shared-canvas</a><br />
<br />
<br />
こんな風に、オンラインゲームのマップを置いて、友達と「ここ攻めろ」みたいな指示を共有したいなと思って作ってみた。<br />
<a href="http://canvas.shokai.org/http://gyazo.com/1b2f1f6b0df60aa2d0dfe3da79106a4e.png">http://canvas.shokai.org/http://gyazo.com/1b2f1f6b0df60aa2d0dfe3da79106a4e.png</a><br />
<br />
<br />
<br />
canvasのプラグインは色々あるけど、canvasのAPIの操作感が変わりすぎる物ばかりだったので、とりあえず何も使わないで操作してみた → <a href="https://github.com/shokai/shared-canvas/blob/master/public/js/draw.js">draw.js</a><br />
<br />
Imageオブジェクトで画像を読み込んで、onloadイベント発生時にcanvasのサイズを変更するとぴったりのサイズになる。かならずdrawImage前にサイズ変更をすること。<br />
（<a href="https://github.com/shokai/shared-canvas/blob/master/public/js/draw.js#L92">92行目あたり</a>）<br />
<pre class="prettyprint">
var draw_img = function(img_url, onload){<br />
    var img_tag = $('canvas#img');<br />
    ctx = img_tag[0].getContext('2d');<br />
    var img = new Image();<br />
    img.onload = function(){<br />
        img_tag.attr('width', img.width).attr('height', img.height);<br />
        ctx.drawImage(img, 0, 0, img.width, img.height);<br />
        if(onload &#038;&#038; typeof onload == 'function') onload();<br />
    };<br />
    img.src = img_url; // 読み込み開始<br />
};<br />
</pre>
<br />
<br />
<a href="https://github.com/shokai/shared-canvas/blob/master/websocket.rb">rubyとem-websocketで作ったwebsocketサーバー</a>は、daemontoolsで自動起動・復活するようにしてある。DBは無くて、最近10万本のlineの色と太さと座標データを保存している。<br />
また線にはどの画像URLの線か、というデータも付いているので、これで画像URL毎に部屋分けを行っている。<br />
</p>
]]></content:encoded>
			<wfw:commentRss>http://shokai.org/blog/archives/5660/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Sinatra+Haml+jQuery入門</title>
		<link>http://shokai.org/blog/archives/5610</link>
		<comments>http://shokai.org/blog/archives/5610#comments</comments>
		<pubDate>Fri, 15 Jul 2011 15:46:54 +0000</pubDate>
		<dc:creator>shokai</dc:creator>
				<category><![CDATA[未分類]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[jQuery]]></category>
		<category><![CDATA[Ruby]]></category>
		<category><![CDATA[Sinatra]]></category>
		<category><![CDATA[Tech]]></category>

		<guid isPermaLink="false">http://shokai.org/blog/?p=5610</guid>
		<description><![CDATA[研究室の後輩にSinatraとhamlとjQueryを教えるために作ったテンプレートについて、ここにも書いておく ソースコード https://github.com/shokai/sinatra-template 実際動 [...]]]></description>
			<content:encoded><![CDATA[<p>
研究室の後輩にSinatraとhamlとjQueryを教えるために作ったテンプレートについて、ここにも書いておく<br />
<br />
ソースコード <a href="https://github.com/shokai/sinatra-template">https://github.com/shokai/sinatra-template</a><br />
実際動いているもの <a href="http://masui.sfc.keio.ac.jp/sinatra-template/">http://masui.sfc.keio.ac.jp/sinatra-template/</a><br />
<br />
<br />
<pre class="prettyprint">
git clone git://github.com/shokai/sinatra-template.git<br />
</pre>
<br />
<br />
■Sinatraを何に使うか<br />
Sinatra+haml+jQueryが便利。<br />
Railsと似てるけど、ちょっと違う。<br />
<br />
個人的には<br />
Rails → HTMLのページをいっぱい作るのに便利<br />
Sinatra → 画面遷移あまりしなくて、同じURLのままjsonのAPIをjQueryのajaxで取得して動的に表示を変えるwebページを作るのには便利<br />
<br />
に感じる。<br />
でもSinatra自由すぎるので、ある程度実装パターンを知らないとメチャクチャになるのでこのテンプレートを参考にすると良いよ<br />
<br />
個人的には<a href="https://github.com/shokai/serial-http-gateway">serial-http-gateway</a>と一緒に使ってデバイスと連動したwebページを作る、とかが手軽にできてよく使う。<br />
<br />
<br />
<br />
■動かし方<br />
gemでsinatra入れて、ruby development.ru<br />
詳しくはREADME嫁<br />
<br />
<br />
■テンプレートの解説<br />
最低限の動作するおみくじアプリです<br />
おみくじ結果をJSONで返すAPIがある<br />
jQueryでajaxでJSON読んで表示する<br />
hamlでhtmlを作る<br />
開発用とデプロイ用の2種類のRackUp(*.ru)ファイル付き<br />
<br />
<br />
■ファイルの説明<br />
・README.md<br />
　まず読め<br />
・development.ru<br />
　開発サーバーを起動し、main.rbとhelper.rbを読み込んでSinatraアプリを実行するスクリプト<br />
・config.ru<br />
　本番サーバーのapacheやnginxでsinatraアプリを実行するためのPassenger用スクリプト<br />
・config.yaml<br />
　&#8221;やむる&#8221;形式の設定ファイルです。アプリのタイトルしか書いてない。<br />
　ここに設定値を書くようにするとアプリを配布するのに便利<br />
　（必要になったら）DBの接続設定などを書くと良い。<br />
・Gemfile<br />
　アプリで使うgemを書いておく<br />
　bundlerでgemを管理する時に使う<br />
・helper.rb<br />
　起動時に一回だけ読み込まれる<br />
　必要なライブラリをロードするコードはここに書く<br />
　（必要になったら）データベースへの接続などをここで行うと良い。<br />
　app_rootという関数が定義されている（重要）<br />
　これにより、開発サーバー・サブドメインでの運用・サブディレクトリでの運用でも内部のURLがズレない<br />
　jsからサーバーのAPIにアクセスする時、hamlでcssを読み込む時などに便利<br />
・main.rb<br />
　Sinatraアプリ本体<br />
　HTTPでアクセスしてきた時のresponseを書く<br />
　app_root/omikuji.json でアクセスしてきた時に、ランダムなおみくじを返す<br />
・views/<br />
　hamlを置くディレクトリ<br />
・views/index.haml<br />
　http://(app_root)/ にアクセスした時に表示されるhamlファイル<br />
　index.hamlをどのURLの時に表示するかは、main.rbで指定している<br />
　main.js, main.cssを読み込んでいる<br />
　rubyの変数のapp_rootをjsの変数app_rootに渡している（重要）<br />
・public/<br />
　画像やjavascriptなどの静的ファイルを置くディレクトリ<br />
・public/js/jquery.js<br />
　最新版のjquery<br />
・public/js/main.js<br />
　index.hamlから読み込まれるJavaScript<br />
・public/css/main.css<br />
　index.hamlから読み込まれるcss<br />
<br />
SinatraやjQueryの基本的な使い方についてはググる。ライブラリの入門サイトとかを頭から読むよりも既に動いているアプリのソースを読んでわからない所を調べるのが一番速い。<br />
<br />
<br />
■工夫しているところ<br />
そんなに多いわけでもないけど、<br />
・config.ruとdevelopment.ruを分ける。developmentから起動した時だけsinatra/reloaderを使ってアプリを毎回リロードさせている<br />
・helper.rbの中身は1プロセス毎に1回しか呼ばれないので、DBとの接続や設定ファイルの読み込みはmain.rbと分けてここに書いておくといい<br />
・app_rootという関数を定義してあって、開発環境や本番環境でAPIのURLがずれないようにしている<br />
・<a href="http://d.hatena.ne.jp/shokai/20101212/1292158170">haml内に書かれたRubyコードの動作についてはここにまとめた</a><br />
<br />
<br />
■アプリの動作<br />
ruby development.ruする→helper.rb読む→helperがyamlの設定ファイルを読む、app_rootという関数を作る→port8080でサーバーがthinに設定される→Sinatraアプリ(main.rb)を起動→main.rbは&#8221;/&#8221;へのアクセスにindex.hamlを返す、&#8221;/omikuji.json&#8221;にはランダムなおみくじと時刻を返す<br />
<br />
ブラウザで&#8221;/&#8221;にアクセスする→cssとjsを読む、ajaxでおみくじを取得する関数がボタンに関連付けられる→ボタン押す毎におみくじ表示される<br />
<br />
<br />
<br />
こんな感じで、ajaxでデータ取ってきてhtmlを書き換えるアプリの最低限のテンプレートを用意しました。<br />
意外とDB無くても<a href="http://glitchtweet.com/">glitchtweet</a>や<a href="http://tweet.shokai.org/">TweetButton</a>や<a href="http://masui.sfc.keio.ac.jp/audio/">増井研オーディオAPI</a>のようなものは作れるので、まずはDBなしでSinatra+Haml+jQueryで何か作ってみるのが良い。<br />
<br />
<br />
DB使うときは、SQL系ならActiveRecordsかSequelかDataMapperあたりがメジャーなのかな？多分。そのへんをまず単体で使ってみて、適当にtwitterのクローラーとか作ってみると良い。<br />
それからSinatraの中に混ぜて使ってみる。いきなりjsで画面が書き換えて、Sinatraもいじって、DBも使うとかやると確実に破滅するので一つずつやるのオススメします<br />
<br />
</p>
]]></content:encoded>
			<wfw:commentRss>http://shokai.org/blog/archives/5610/feed</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
		<item>
		<title>Google Latitudeから自分の位置情報を取得する</title>
		<link>http://shokai.org/blog/archives/5600</link>
		<comments>http://shokai.org/blog/archives/5600#comments</comments>
		<pubDate>Tue, 12 Jul 2011 10:47:37 +0000</pubDate>
		<dc:creator>shokai</dc:creator>
				<category><![CDATA[未分類]]></category>
		<category><![CDATA[GIS]]></category>
		<category><![CDATA[GoogleLatitude]]></category>
		<category><![CDATA[MongoDB]]></category>
		<category><![CDATA[Ruby]]></category>
		<category><![CDATA[Tech]]></category>

		<guid isPermaLink="false">http://shokai.org/blog/?p=5600</guid>
		<description><![CDATA[以前自分でAndroid用のGPSロガーアプリを作っていたんだけど、収集した位置情報をAndroid内に持っていても特に面白いことが出来なくて悩んでた。 Android版のgoogle latitudeはもちろんサーバー [...]]]></description>
			<content:encoded><![CDATA[<p>
以前自分でAndroid用のGPSロガーアプリを作っていたんだけど、収集した位置情報をAndroid内に持っていても特に面白いことが出来なくて悩んでた。<br />
Android版のgoogle latitudeはもちろんサーバーに位置情報が溜まっているので、これを別の自分のサーバーから取得したほうが使い勝手がよい。<br />
<br />
<br />
作ったもの <a href="https://github.com/shokai/google-latitude-logger">https://github.com/shokai/google-latitude-logger</a><br />
<br />
<br />
■google latitudeから位置情報を取る方法<br />
<a href="http://code.google.com/intl/ja/apis/latitude/">GData APIからGoogle Latitude APIが使える</a>が、なんかわけがわからなかったので<a href="http://breakthebit.org/post/6482987550/get-your-location-from-google-latitude-api-simple-with">google latitude badgeからデータを取る</a>ことにした。<br />
<br />
<br />
<a href="https://www.google.com/latitude/b/0/apps">Google Latitude公開ロケーションバッジ</a>のページにgoogleアカウントにログインした状態で行き、「有効にして最新の現在地情報を表示する」にチェックを入れる。<br />
webサイト用のembedコードから api?user=1234567890 の部分をメモする。<br />
<br />
<br />
で、 http://www.google.com/latitude/apps/badge/api?user=1234567890&#038;type=json を見ると自分の位置情報が書かれている。<br />
<br />
位置情報を取得してMongoDBに保存するコードを<a href="https://github.com/shokai/google-latitude-logger/blob/master/latitude-logger.rb">latitude-logger.rb</a>に置いておいた。さくらVPSのサーバーで数分おきに動かして位置情報を保存している。<br />
<br />
<br />
<br />
■保存した位置情報を使う<br />
<br />
移動の方角と速度を計算してtwitterに投げるようにしてみた。<br />
<a href="http://www.flickr.com/photos/shokai/5929265461/" title="移動方向 by shokai, on Flickr"><img src="http://farm7.static.flickr.com/6146/5929265461_ff08a77af2.jpg" width="449" height="166" alt="移動方向"></a><br />
俺が元気に活動している様子がわかる。例えば、時速200km以上で西に移動するのが連続していたら新幹線に乗ってるのかなとか、そういう想像ができる。<br />
位置情報をそのまま公開するのは気持ち悪いし危険だし誰も得しないので、何か加工して表示する必要があるのでちょっと抽象的な表現にしてみた。<br />
<br />
地理的な知識があれば速度と方角だけでも結構何をしているかわかる。時速20〜40kmで東西に移動しているなら神奈川中央交通のバスに乗っているし、時速80kmぐらいだったら電車で東京に向かっている事が多い。けっこうわかる。<br />
<br />
<br />
<br />
KMLで出力してGoogle Earthに表示してみた。これは先週木曜に学校に行こうとしてバスを乗り過ごして迷子になった時の移動のログ。<br />
<a href="http://www.flickr.com/photos/shokai/5929270579/" title="迷子になった by shokai, on Flickr"><img src="http://farm7.static.flickr.com/6146/5929270579_a48d3f34fa_o.png" width="938" height="666" alt="迷子になった"></a><br />
KMLファイルはAndroidで開いてもMapに描画されるので、サーバーで定期的に生成されてるようにしてあるからほぼ以前作ったAndroid用GPSロガーと同じ事ができている。<br />
<br />
<br />
今後は俺が近くに来たら通知するアプリを作って配布しようかと思ったけどあまりうれしくないのでやめた。<br />
<br />
</p>
]]></content:encoded>
			<wfw:commentRss>http://shokai.org/blog/archives/5600/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>iPhone JavaScript Console作った</title>
		<link>http://shokai.org/blog/archives/5523</link>
		<comments>http://shokai.org/blog/archives/5523#comments</comments>
		<pubDate>Tue, 31 May 2011 09:24:46 +0000</pubDate>
		<dc:creator>shokai</dc:creator>
				<category><![CDATA[未分類]]></category>
		<category><![CDATA[EventMachine]]></category>
		<category><![CDATA[iPhone]]></category>
		<category><![CDATA[iPhone-JS-Console]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[Ruby]]></category>
		<category><![CDATA[Tech]]></category>
		<category><![CDATA[WebSocket]]></category>

		<guid isPermaLink="false">http://shokai.org/blog/?p=5523</guid>
		<description><![CDATA[作った → https://github.com/shokai/iphone-js-console iPhone用のJavaScript shellのようなもの。FirebugやChromeの開発パネルみたいな感じで使う [...]]]></description>
			<content:encoded><![CDATA[<p>
作った → <a href="https://github.com/shokai/iphone-js-console">https://github.com/shokai/iphone-js-console</a><br />
<br />
iPhone用のJavaScript shellのようなもの。FirebugやChromeの開発パネルみたいな感じで使う。<br />
<br />
chrome拡張やiPhoneシミュレータでiPhone用のwebページの動作は確認できるが、加速度センサやGeo Location APIなんかは実機で動かさないとデバッグできない。<br />
しかしデバッグをしようにも、iPhone上で大量のalertを出すと気が狂ってしまう。iPhoneで実行中のwebページ上の任意のオブジェクトの中身を、Macから覗いたり値を書き換えたり関数を実行したりするツールが必要だったので作った。<br />
<br />
なお、Androidのブラウザにはwebsocketが無いのでこのツールは動かない。Androidではlogcatで<br />
<pre class="prettyprint">
adb logcat | grep "^./browser" --color=auto<br />
</pre>
すればconsole.log、console.errorの出力は見れるので、それで何とか我慢している。<br />
<br />
<br />
<br />
■セットアップ<br />
MacとiPhoneを用意する。MacとiPhoneは同じ無線LANの下に接続して、互いに通信できるようにしておく。<br />
<br />
<a href="https://github.com/shokai/iphone-js-console">github.com/shokai/iphone-js-console</a>からcloneしてくる。<br />
<br />
iphone-js-console.jsをhtmlに読み込ませる。JsConsole.startで自分のMacに接続させるようにする。<br />
<pre class="prettyprint">
&lt;script src='iphone-js-console.js' type='text/javascript' /&gt;<br />
&lt;script type='text/javascript'&gt;<br />
    JsConsole.start('ws://192.168.1.38:8088'); // Addr of Console Server<br />
&lt;/script&gt;<br />
</pre>
（あらかじめconsoleを起動するMacのIPアドレスは調べておこう）<br />
<br />
<br />
Macで、iphone-js-consoleを起動する<br />
<pre>
./iphone-js-console<br />
</pre>
<br />
iphone-js-consoleの起動時に、rubygemsが足りないという警告がでたら足りないgemをインストールする。<br />
<pre>
gem install eventmachine em-websocket<br />
</pre>
多分これで足りる。<br />
あとreadlineを使っているけど、Macの最初から入っているreadlineは腐ってた気がするので、brewかportsで入れるといい。（わからなかったら飛ばしても多分良い）<br />
<br />
<br />
<br />
■使う<br />
Macのiphone-js-consoleで<br />
<pre class="prettyprint">
alert(document.title)<br />
</pre>
と打つと、<br />
<a href="http://www.flickr.com/photos/shokai/5779918365/" title="Untitled by shokai, on Flickr"><img src="http://farm4.static.flickr.com/3410/5779918365_58d0f513cf.jpg" width="333" height="500" alt=""></a><br />
<br />
このようにiPhoneのSafari上でJavaScriptが実行される。<br />
<br />
<br />
また、iPhoneのSafariの変数を参照することもできる。<br />
<pre>
&gt; window.navigator.appVersion<br />
&lt;1&gt; "5.0 (iPod; U; CPU iPhone OS 4_3_3 like Mac OS X; ja-jp) AppleWebKit/533.17.9 (KHTML, like Gecko) Version/5.0.2 Mobile/8J2 Safari/6533.18.5"<br />
</pre>
<br />
<br />
中身が複雑なオブジェクトは整形されて表示される。<br />
<pre>
&gt; location<br />
&lt;1&gt; <br />
{"href"=&gt;"http://192.168.1.38:8080/debug-sample.html",<br />
 "hash"=&gt;"",<br />
 "port"=&gt;"8080",<br />
 "protocol"=&gt;"http:",<br />
 "origin"=&gt;"http://192.168.1.38:8080",<br />
 "pathname"=&gt;"/debug-sample.html",<br />
 "hostname"=&gt;"192.168.1.38",<br />
 "host"=&gt;"192.168.1.38:8080",<br />
 "search"=&gt;""}<br />
</pre>
<br />
<br />
もちろん、エラーも出力される。<br />
<pre>
&gt; homu<br />
&lt;1&gt; "error : Can't find variable: homu"<br />
&gt; 1+2<br />
&lt;1&gt; 3<br />
&gt; 1+<br />
&lt;1&gt; "error : Parse error"<br />
</pre>
<br />
<br />
iPhoneのJSで、あらかじめ<br />
<pre class="prettyprint">
console.log(foo);<br />
</pre>
とか書いておけばもちろんMacのiphone-js-consoleにfooの値が表示される。<br />
<br />
<br />
一度入力したコマンドは、キーボード上下で履歴を呼び出したりできる。<br />
大変便利ですね。<br />
<br />
<br />
<br />
<br />
■技術的なこと<br />
iPhoneとiphone-js-consoleの接続にはWebSocketを使っている。EventMachine::WebSocketが便利だった。<br />
<br />
iphone-js-consoleからiphoneへ送信された文字列は、そのままiPhone上でevalで実行させている。<br />
iphoneからiphone-js-consoleへのオブジェクトの送信は、iPhone上でJSON.stringifyでシリアライズして送信して、iphone-js-consoleでparseして適当に整形して表示している。<br />
<br />
別に難しいことはしていない。<br />
<br />
</p>
]]></content:encoded>
			<wfw:commentRss>http://shokai.org/blog/archives/5523/feed</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
	</channel>
</rss>

