Uploaded on

evalbook

evalbook

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
417
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
0
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. 電大 つ電 組る く子 子矢 情研 報究 工室 学 版ク籍 書 ラ 科 五 シウを 年 スド矢 のテ口裕 開ム也 発
  • 2. 概要•日本語用縦書き電子書籍システムを開発した
  • 3. 既存技術への不満
  • 4. Amazon Kindle•日本語組版→☓• 多デバイス対応→○
  • 5. TeaTime, XMDF(国産ビューア・フォーマット)•日本語組版→○• 多デバイス対応→☓
  • 6. evalbook (本研究で開発)•日本語組版→◎• 多デバイス対応→◎
  • 7. <html> <title>こころ</title>HTML <author>夏目漱石</author> <h2>上 先生と私</h2> <rb>私</rb><rt>わたくし</ rt>はその人を常に先生と呼 んでいた。<br />evalbook ...... PDF
  • 8. 従来 evalbookの方式端末 端末 PDF / image viewer 電子書籍 アプリ サーバ evalbook
  • 9. 従来 evalbook 1つのサーバ上端末毎にアプリ で動作するプロの開発が必要 グラムだけで済 む
  • 10. evalbook Web UI pLaTeX code generator HTML parser pLaTeX
  • 11. Web UI•Ruby• Sinatra• 簡単なWebアプリ
  • 12. pLaTeX code generator•テンプレート• 生成されるpLaTeXコードの外枠
  • 13. <%= %>の部分に動的に値/ 文字列が埋め込まれる 1 documentclass[a4j,<%=t.column%>]{tarticle} 2 usepackage[dvipdfm]{graphicx} 3 usepackage[deluxe, burasage]{otf} 4 usepackage[dvipdfm]{color} 5 usepackage[dvipdfm,% 6 bookmarks=true,% 7 bookmarksnumbered=true,% 8 colorlinks=true]{hyperref} 9 usepackage{fancyvrb}10 usepackage{fancyhdr}
  • 14. <%= %>の部分に動的に値/ 文字列が埋め込まれる1 documentclass[a4j,<%=t.column%>]{tarticle} ・onecolumn ・twocolumn
  • 15. normalsize, largeなどを再定義する. フォントの大きさは対象デバイス・ ユーザの指定により毎回変化する12 makeatletter13 DeclareFontShape{JT1}{hmc}{m}{n}{<-> s *[0.9375] brsgnmlminr-v}{}14 renewcommand{normalsize}{@setfontsizenormalsize{<%=t.normalsize%>pt}{<%=t.lineskip(t.normalsize)%>}}15 renewcommand{tiny}{@setfontsizetiny{<%=t.tiny%>pt}{<%=t.lineskip(t.tiny)%>}}........19 renewcommand{huge}{@setfontsizehuge{<%=t.huge%>pt}{<%=t.lineskip(t.huge)%>}}
  • 16. normalsize, largeなどを再定義する. フォントの大きさは対象デバイス・ ユーザの指定により毎回変化する フォントサイズ 13pt14 renewcommand{normalsize}{@setfontsizenormalsize{<%=t.normalsize%>pt}{<%=t.lineskip(t.normalsize)%>}} 行送り 19.5pt = 13pt × 1.5
  • 17. 本の作者・タイトルの情報があ れば各ページのヘッダに挿入21 defps@myhead{letps@jpl@inps@headnombre22 let@oddfoot@emptylet@evenfoot@empty23 def@evenhead{{tiny <%= t.title || %> <%= t.author || %>hfill thepage{}}}%24 def@oddhead{{tiny <%= t.title || %> <%= t.author || %>hfill thepage{}}}%25 let@mkbothmarkboth26 }27 pagestyle{myhead}28 makeatother
  • 18. 本の作者・タイトルの情報があ れば各ページのヘッダに挿入 タイトル 奇数ページ こころ23 def@evenhead{{tiny <%= t.title || %> <%= t.author || %>hfill thepage{}}}%24 def@oddhead{{tiny <%= t.title || %> <%= t.author || %>hfill thepage{}}}% 偶数ページ 著者 夏目漱石
  • 19. HTML Parser•HTMLをpLaTeXのコード片に変換・Ruby ・Nokogiri・内部DSL(自作)
  • 20. Ruby内部DSLによる再帰的なHTMLパー サ・pLaTeXコードジェネレータ使用例 93 tag(:rb) {"kana{#{recur}}"} 94 tag(:rt) {"{#{recur}}"} 95 tag(:rp) {""} 96 97 tag(:br) {par{}} 98 tag :hr do 99 "100 vspace{1zw plus .1zw minus .4zw}nn101 nnnoindent102 hfil103 rule{#{@t.textwidth_consider_column *0.7}pt}{.01zw}104 hfillnn"
  • 21. Ruby内部DSLによる再帰的なHTMLパー サ・pLaTeXコードジェネレータ使用例93 tag(:rb) {"kana{#{recur}}"}94 tag(:rt) {"{#{recur}}"} <rb>檸檬</rb><rt>れもん</rt> → kana{檸檬}{れもん}
  • 22. pLaTeX等の実行24 open("#{$dir_tmp}/#{filename}.tex", w){|fp|fp.write(Erubis::Eruby.new(template).result(binding))}25 open("#{$dir_tmp}/#{filename}.sh", w){|fp|fp.write(<<-"EOF")}26 ebb *.pdf27 platex -interaction=nonstopmode #{$dir_tmp}/#{filename}.tex28 dvipdfmx -f #{$dir_sty}/notembed.map -p#{t.width}pt,#{t.height}pt #{$dir_tmp}/#{filename}.dvi29 mv #{filename}.pdf #{$dir_public_tmp}30 rm #{filename}.tex #{filename}.dvi31 EOF32 do_command($dir_tmp, "sh #{filename}.sh")
  • 23. 組版•基本的な箇所は既存パッケージを利用•カバーできない箇所はpLaTeXコード生成時に自力対応(Ruby側で)
  • 24. 利用したパッケージ•ふりがな •furiganaパッケージ•正方形フォントメトリック・ぶら下げ組•OTF beta
  • 25. 自力対応した箇所•版面のパラメタの値• 画像の貼り付け
  • 26. 版面のパラメタの値•版面(画面)の大きさはデバイス毎に異なる•Ruby側でWebUIからの入力(画面サイズ・アスペクト比など)をもとに計算する
  • 27. 各パラメタの計算66 def textheight67 ((width * 0.925 / lineskip(@fontsize)).to_i - 1) *lineskip(@fontsize) + @fontsize68 end6970 def oddsidemargin71 (width - textheight - tiny / 2) / 272 end7374 def column75 if textwidth / @fontsize > 4076 "twocolumn"77 else78 "onecolumn"79 end80 end
  • 28. 版面のパラメタの値(出力例)paperwidth=143.90825102604714ptpaperheight=206.86811084994275pttextwidth=177.1875pttextheight=119.25pttopmargin=4.5ptoddsidemargin=11.20412551302357ptcolumnsep=16.875ptheadheight=4.5ptheadsep=13.480610849942753pttopskip=0pt
  • 29. 画像•pLaTeX, ghostscriptに画像を扱わせない戦略
  • 30. 画像•Ruby側で画像の情報を取得,全ての画像をPDFに変換しgsを不要に→ImageMagickを利用
  • 31. 画像のハイパーリンク•pLaTeX及びgraphicxパッケージの命令では対応できない→dvipdfmxにspecial命令を送る
  • 32. 171 def a_img width, height172 "173 begingroup174 catcode`_=11175 catcode`%=11176 catcode`#=11177 catcode`$=11178 catcode`&=11179 special{pdf:ann width #{width}pt height#{height}pt 180 << /Subtype /Link /A << /S /URI /URI(#{@a_url}) >> >>}endgroup 181 "182 end
  • 33. URLに使う記号(_%#...) をTeXで通常の文字列174 catcode`_=11 として扱うように175 catcode`%=11176 catcode`#=11177 catcode`$=11178 catcode`&=11
  • 34. special命令(TeXでは解釈され ずdviwareにそのまま届く命 令)で画像の上に同じ大きさの 480 ハイパーリンクを重ねる179 special{pdf:ann width #{width}pt height#{height}pt 180 << /Subtype /Link /A << /S /URI /URI(#{@a_url}) >> >>} 640 http://example.com/hoge_fuga.php?a=b&c=d
  • 35. 1行の長さは40∼45文字を超えると読みづらい →40文字を超えると自動的に2段組に
  • 36. 幅を5.5cmに指定したとき →長さが足りないと自動的に収まるサイズに
  • 37. 幅をページいっぱいに指定したとき
  • 38. その他細かい調整•和欧間文字比• kanjiskip, xkanjiskip• 禁則(行頭の「っ」を許すなど)• dvipdfmxのfontMap
  • 39. 1 bop [8] ParseDVI 2 down 3113.3460235595703125 3 down -3164.9630889892578125 4 right -52.047943115234375 5 xxx color push gray 0 6 xxx pdf:dest (page.8) [@thispage /XYZ @xpos @ypos] 7 right 442.75 8 xxx color pop 9 down 319.687510 right -52.04794311523437511 down -319.687512 dir tate13 down -437.5937514 fnt brsgnmlminr-v 10.312515 set ち16 w -0.006240844726562517 set な18 w0 -0.006240844726562519 set み
  • 40. 今ある/今後でる ほぼ全てのデバイスに対応 PC Kindle DX Kindle 2 PSP iPad iPhoneevalbook Android WindowsPhone7 Galapagos 携帯電話(au) 携帯電話(docomo) 携帯電話(softbank)
  • 41. が 人 分 い い う 感 つ ひ か に か の じ も ど ら は し だ も と ま そ い 悪 、 ら か の こし の 思 く 言 、 ら に そ 攻 い 言 い と 、 い違 、 撃 違 わ 争 思 も な 謂 を い れ い い は い わ ば 両立 黙 を る も 込 や 、し し と 自 ん 人 自 万 て 、 己 で 間 分 一世 い い 弁 し と に 系 る か 解 ま 一 は のよ に も う 緒 そ 人 も 出 の に の 間 、 来 で 住 真 の も な し め 理 ﹁っ い た な を 真
  • 42. まとめ•美しい組版• 多くのデバイスに対応• HTMLのURLで入力
  • 43. 利用したプログラム・コ ンテンツ•Ruby, 各種gemライブラリ•pLaTeX, 各種マクロファイル• Google Search API• 青空文庫
  • 44. 画像などの引用• http://www.apple.com/jp/iphone/gallery/• http://www.au.kddi.com/seihin/ichiran/ smartphone/is12t/index.html• http://jp.samsungmobile.com/galaxys/• http://www.android.com/• http://www.microsoft.com/ja-jp/windowsphone/ design/7/phones.aspx• http://itunes.apple.com/jp/app/id369061574? mt=8
  • 45. 今後の展開•evalbookのさらなる開発• pure javascriptな evalbookの開発
  • 46. http://j.mp/evalbookdemo