橋本商会

js2-modeのインデントに気が狂いそうだったので調べてたら、espresso-modeの方が良いらしかった

emacs23.2からjs-modeという名前でバンドルされているらしいので

brew install emacs

して /usr/local/bin/emacs の方を使うようにしたらjs-modeが使えるようになった

インデントにも満足している

jQuery.editableというプラグインを作った。

デモページ

触ってみればわかるが、edit in place(その場編集)ができる。クリックやマウス長押しでテキストを編集開始して、Enterキーを押すか入力フォーム外をクリックすると編集が終了する。編集完了時にあらかじめ登録しておいたcallback関数が呼ばれて入力値が渡される。
似たようなのが他にもいくつかあるけど、callback指定できて簡単に使えるものが無かったので作った。

 

■使い方

読み込んで

<script src='jquery.editable.js' type='text/javascript'></script>

jQueryのセレクタからeditable関数に編集方法（click, dblclick, clickhold, mouseoverなど）とコールバック関数を登録する。

$('span#edit').editable('click', function(e){ alert(e.value); });

e.valueで編集後の値が取れる。e.old_valueで編集前の値が取れるので、e.valueが気に入らなかったら元に戻したりできる。
githubのREADMEを見るとわかりやすい。テキストそのものをクリックだけではなく、横のボタンを押したら編集モードに入るのも作れるようにしてある。

 

■jQuery pluginの作り方

初めてjQuery pluginを作った。

(function($){

  $.fn.editable = function(/* 適当な引数 */){

    /* 適当に処理 */

    return this;

  };

})(jQuery)

と書くと、 $.editable に関数が登録できる。
登録した関数内のthisはjQueryのセレクタで取ったDOM要素が入る。
最後にreturn thisしておくとjQueryのmethod chainが使える。

webブラウザでファイルをアップロードしたり、URLをHTTP-POSTしたら印刷できる奴を作った。研究室のwebサーバーに設置したらわりとウケてた。

出力デバイスとしてプリンタがより手軽に使えるようになる。
例えばメッセージをプリンターから出したりとか、Ethernetにつながったハードウェアから印刷したりとか、いろいろなARマーカーをどんどん吐き出すとかできるのできっと便利。


SinatraからMac/Linuxのlprコマンドを呼び出して印刷する感じの実装をした。
URLをpostされたら、content_typeをチェックしてから、html以外ならダウンロードして印刷、htmlの場合はxvfbとwebkitを起動してキャプチャしてPDFを作って印刷するとかがんばった実装をした。


https://github.com/shokai/print-server




■セットアップ
Sinatraなのでローカルですぐ起動させられる。

git clone git@github.com:shokai/print-server.git

cd print-server

brew install qt imagemagick

gem install bundler

bundle install

cp sample.config.yaml config.yaml

config.yamlにデフォルトプリンタの指定などが書いてある。
Linuxの人はREADME.mdを見ろ。


■起動

ruby development.rb

http://localhost:8080で起動する


■印刷
HTTP POSTで印刷できる

curl -d 'url=http://shokai.org/blog/' http://localhost:8080/url

multipart/form-dataでデータ入稿もできる。


■その他memo
このへんの事をするツールをhelperディレクトリにまとめてある


lprとlpstatで印刷している
ターミナルから印刷する – 橋本詳解


xvfbとwebkit起動してスクリーンショットを撮る
capybara-webkitでwebページのスクリーンショットを撮る – 橋本詳解


ImageMagickをmini_magickから使って、縦長のスクリーンショットを分割した
mini_magickとImageMagickで画像を切り取る – 橋本詳解


Prawnで画像を1つのPDFにまとめる
画像をpdfファイルにまとめる – 橋本詳解

元ネタ：いかにしておっぱい画像をダウンロードするか〜2012 – ゆーすけべー日記


昔、yusukebeさんとは大学で同じ研究室だった。
俺がまともにプログラムを書けるようになったのは、研究室に入った時に新入生向けのyusukebeサブゼミに入って、Flashで実装されたRSSリーダーのソースコードを見せてもらったあたりがきっかけだった気がする。

俺も高校生が（Rubyで）プログラミングをはじめるきっかけになりたいので、Ruby版を作ってみました。
Rubyもこういうwebクローラーを作るのに向いている言語だし、最近のMacなんかには最初からインストールされているので試してみると良いよ。


まずjson gemをインストールする。

sudo gem install json

oppai.rb

#!/usr/bin/env ruby

require 'rubygems'

require 'open-uri'

require 'json'

require 'digest/md5'

require 'uri'

require 'kconv'



APP_ID = '' ## https://ssl.bing.com/webmaster/developers/appids.aspx から取得

API_URI = 'http://api.bing.net/json.aspx'



out_dir = './data'

Dir.mkdir out_dir unless File.exists? out_dir



page_count = 0

dl_count = 0



loop do

  params = {

    :AppId => APP_ID,

    :Version => 2.2,

    :Market => 'ja-JP',

    :Sources => 'Image',

    'Image.Count' => 50,

    'Image.Offset' => page_count * 50,

    :Adult => 'off',

    :Query => 'おっぱい'

  }

  

  url = API_URI + '?' + params.map{|k,v| "#{URI.encode k.to_s}=#{URI.encode v.to_s}"}.join('&')

  data = JSON.parse open(url).read.toutf8

  

  data['SearchResponse']['Image']['Results'].each do |entry|

    next unless entry['MediaUrl'] =~ /\.jpe?g$/i

    dl_count += 1

    fname = Digest::MD5.hexdigest(entry['MediaUrl'])+'.jpg'

    fpath = "#{out_dir}/#{fname}"

    next if File.exists? fpath



    puts "#{dl_count} : Download... #{entry['MediaUrl']}"

    img = open(URI.encode entry['MediaUrl']) rescue next

    img.close

    next unless img.content_type =~ /^image\/.+/i

    next if img.path.to_s.size < 1

    File.rename(img.path, fpath)

  end

  page_count += 1

end

並列ダウンロード版。parallelを使って10並列ダウンロードする。

gem install parallel

oppai_paralle.rb

#!/usr/bin/env ruby

require 'rubygems'

require 'open-uri'

require 'json'

require 'digest/md5'

require 'uri'

require 'kconv'

require 'parallel'



APP_ID = '' ## https://ssl.bing.com/webmaster/developers/appids.aspx から取得

API_URI = 'http://api.bing.net/json.aspx'



out_dir = './data'

Dir.mkdir out_dir unless File.exists? out_dir



page_count = 0

dl_count = 0



loop do

  params = {

    :AppId => APP_ID,

    :Version => 2.2,

    :Market => 'ja-JP',

    :Sources => 'Image',

    'Image.Count' => 50,

    'Image.Offset' => page_count * 50,

    :Adult => 'off',

    :Query => 'おっぱい'

  }

  

  url = API_URI + '?' + params.map{|k,v| "#{URI.encode k.to_s}=#{URI.encode v.to_s}"}.join('&')

  data = JSON.parse open(url).read.toutf8



  Parallel.each(data['SearchResponse']['Image']['Results'], :in_threads => 10) do |entry|

    next unless entry['MediaUrl'] =~ /\.jpe?g$/i

    dl_count += 1

    fname = Digest::MD5.hexdigest(entry['MediaUrl'])+'.jpg'

    fpath = "#{out_dir}/#{fname}"

    next if File.exists? fpath



    puts "#{dl_count} : Download... #{entry['MediaUrl']}"

    img = open(URI.encode entry['MediaUrl']) rescue next

    img.close

    next unless img.content_type =~ /^image\/.+/i

    next if img.path.to_s.size < 1

    File.rename(img.path, fpath)

  end

  page_count += 1

end



		

今売っている4月号がNFC特集でした

2012年4月号　目次｜Interface

Android携帯でNFCタグを読み取る「GoldFish」の概要と応用事例
NFC技術とWebサーバや加速度センサを組み合わせて，実世界GUIを作ろう!
というのを増井先生と書いた。

関連：橋本商会 » ORF2011で実世界コピペ、実世界ユーザインタフェース等を展示した

これ↓