必要な機能として、タイトル、著者名、綴じ方向、解像度、目次、画像ファイルの読み込み、ZIP画像を考えていた。タイトルや著者名をサイト上から入力する。綴じ方向をrtlにかためておく。解像度を入力するようにするか、自動取得する。
今やったところは、タイトルや著者名を入力するところと、画像ファイルの読み込み機能をつけた。つぎは取り込んだ画像ファイルをリネームして、imagesフォルダーにまとめようと思う。その後XHTML、CSS、OPFなどのテンプレートを作って追加する方法を考える。
見開きなどの指定をUIでどのようにするかを決め兼ねている。
BootstrapとJsZipを組み合わせて固定レイアウトのEPUB３を作ってみようとしています。とりあえずココまでやったのをレポジトリにしてまとめた。
epubを作るときに、どの規格に沿って作るか。自分の中での優先を考えるとidpf のEPUB validationをする。とりあえずキンドル向けに作ろうかと。
kobo用のページもあるが電書協とデジタルコミック協議会に丸投げしている感じがある。kobo writing life自体の制限は厳し目。
Samples | EPUB 3 Samples Project
この中のharuko-html-jpegをベースに作るよ。
はじめの階層のフォルダ構成は上のようにmimetypeは拡張子なしのファイル。META-INFはフォルダーの中にcontainer.xmlが入っている。そういうもんだと思っておこう。
OPSのフォルダー内がこれから。
package.opfはほかではcontents.opfの場合もあるし名前を変えてもいいが、名前を変えるとcontainer.xmlの中身も変える必要がある。全体の中で一番編集しなければならないのがこのファイルだろう。本のIDとか編集した日付。言語、タイトル、含まれているファイル。などを列挙する必要がある。特に漫画の場合は、ページ自体を見開きにしたときに右にするか左にするかという設定もある。
CSSフォルダーはそのまま利用する、imagesには画像を入れてファイル名などを変更するか。
xhmlフォルダーには画像ページのxhtmlとtoc.ncx、toc.xhtmlがある。画像ページのhtmlではタイトルを入れたり、画像の説明を入れることがある。
toc.ncxは互換性のためにあるが、キンドルではこの目次が優先されることがある。xmlで書かれているため。
toc.xhtmlはほかではnav.xhtmlという名前の場合もある。キンドルではcover.xhtmlで表紙が必要になる。
余談として、haruko-html-jpegをkindlegenで変換しようとすると失敗するよ。
IDPF
EPUB 仕様書（EPUB 3.0, EPUB 3.0.1, EPUB 3.1）および関連文書の日本語訳
https://kindlegen.s3.amazonaws.com/AmazonKindlePublishingGuidelines_JP.pdf
電書協
電書協 EPUB 3 制作ガイド | 日本電子書籍出版社協会
kadokawa-epub.bookwalker.co.jp
クライアントサイドJavaScriptで画像ファイルをzip圧縮はできるようなのでEPUBもできるんじゃないかなと思って調べてみることに。
サーバサイドでEPUBを作れるサービスはよくあるが、漫画の場合はアップロード時間がかかる。ならばローカルで出来れば時間短縮になるが、他のOSでは動かないと対象は狭そう。別にjavascriptではなくてもjavaでも良さそうだが、MacだとかWindowsやスマホなどを考えるとブラウザで動ければ、大抵の端末で動くだろう。コマンドラインで操作しないだけでとっつきやすいと思う。さて、javascriptでEPUB作成は可能なのだろうか。
ググったら、EPUBを作るjavascriptを見つけたがどうも規格が古そうだ。
気になる問題点
調べているとJSZipでできそうかなと思った。試しに下のようなコードをJSZipのサイトのサンプルに入れるとepubみたいなファイルになる。当然中身は作っていないがファイル構造だけはできる。
var zip = new JSZip();
zip.file("mimetype", "application/epub+zip");
var meta = zip.folder("META-INF");
var container = zip.folder("OPS");
var img = zip.folder("OPS/images");
img.file("smile.gif", imgData, {base64: true});
zip.generateAsync({type:"blob"})
.then(function(content) {
// see FileSaver.js
saveAs(content, "example.epub");
});
ローカルファイルをいったんブラウザに読み込んで、jszipを使ってアーカイブする方法を考えると。FileAPIを使って読み込ませるとそれらしくなる。こういう方向性で作ってみようと思う。
小説家になろう、カクヨム、Pixiv、青空文庫、でんでんコンバーターの相互変換ツールを作ったのでgithubにおいておく。
リンク：小説投稿サイト相互変換
これを作ろうとしたきっかけは、投稿小説サイトでは読む側の変換ツールはあるが投稿する側のツールが少ないと思ったから。一度作ったものをいろいろな形式に変換できれば、変換にかかる時間が減って執筆に時間を充てられるだろう。
まだできていないのが傍点の処理部分で取りあえず動くようにしておいた。それぞれの形式では表現できない注記がありかつ種類が多いので、一旦青空文庫形式に変換してからそれぞれの形式に出力するようになっている。そのほうが作業量が減らせそうだから。
２回変換することになるのでミスがあると、ぐちゃぐちゃになる可能性がある。挿絵とリンクの変換はまだやっていない。小説家になろうのルビの変換は怪しい所がある。
「小説家になろう/小説を読もう！」(＋関連サイト)「NEWVEL-LIBRARY」「FC2小説」「HAMELN」「Arcadia」「novelist.jp」「dNoVeLs」「暁」「カクヨム」「ノベルアップ＋」から取得が可能です。
まえにさ、小説投稿サイトの形式を見たけどその変換できるサイトを作ってみようかなと思ったので、要件を整理してみることにした。ついでにEPUBにも変換できるように青空文庫の注記やでんでんマークダウン形式にも変換できるようにしてみようかなと思っている。
基本的にはjavascriptでやるつもりなので、githubで公開しちまえばいいか。でんでんコンバーターはどこで儲けるつもりなのかがわからないので、どこまで機能をつけていいのかがわからない。初期状態のままではでんでんコンバーターに傍点機能がついていない。なので、CSSを弄くって傍点をつけることになるがそういうことやっていいんだろうか。
書いた文章の漢字の部分にふりがなを打ってくれるツール。全部の漢字にルビを振ったり、小学生や中学生や一般向けなどの水準ごとにルビをふるかどうかを決めることができる。ただ間違うこともあるので注意が必要。手作業で入力するよりは楽。
書いた文章の漢字の部分にふりがなを打ってくれるツールだよ。
<ruby>書<rp>(</rp><rt>か</rt><rp>)</rp></ruby>いた<ruby>文章<rp>(</rp><rt>ぶんしょう</rt><rp>)</rp></ruby>の<ruby>漢字<rp>(</rp><rt>かんじ</rt><rp>)</rp></ruby>の<ruby>部分<rp>(</rp><rt>ぶぶん</rt><rp>)</rp></ruby>にふりがなを<ruby>打<rp>(</rp><rt>う</rt><rp>)</rp></ruby>ってくれるツールだよ。
HTMLでルビを直接書くとこうなって、コード部分での可読性や編集性が悪すぎる。互換性の保持のために長くなっている部分もある。
{書}(か)いた{文章}(ぶんしょう)の{漢字}(かんじ)の{部分}(ぶぶん)にふりがなを{打}(う)ってくれるツールだよ。
でんでんマークダウン
{書|か}いた{文章|ぶんしょう}の{漢字|かんじ}の{部分|ぶぶん}にふりがなを{打|う}ってくれるツールだよ。
ラノベのルビで、例えば
暗黒剣
のような中二病読みというのかラノベルビというのかよくわからないのをやろうとすると手動になる。
BCCKSから青空文庫やなろう、カクヨムのルビを変換するには正規表現をONにして置換する
\{(.+?)\}\((.+?)\)
｜ $1《 $2》
\{(.+?)\|(.+?)\}
｜ $1《 $2》
この形式の変換で問題になるのが基本は｜漢字《ルビ》の形式だが｜を省略するパターンが有る。他に漢字(かんじ)のようなワードからテキスト出力した場合にできるパターンもある。通常の()を表示するためにはエスケープするために|()として使う。
｜(.+?)（(.+?)）
｜(.+?)\((.+?)\)
｜ $1《 $2》
漢字にひらがなでふりがな
\p{Han}+?《 \p{Hiragana}+?》
\p{Han}+? \( \p{Hiragana}+?\)
漢字にカタカナでふりがな
\p{Han}+?《 \p{Katakana}+?》
\p{Han}+? \( \p{Katakana}+? \)
｜ $1《 $2》
ほかかなろうに変換する場合には()を|()に変換する。
\(.+?\)
|$0
pixiv仕様
\[\[rb:(.+?) > (.+?)\]\]
文章に傍点をつけて強調があるがはてなブログでつけようとしたら失敗した。傍点にはsesameとdotがあって、﹅と・を傍点につける。問題はでんでんコンバーターに傍点の機能が標準ではついてないのでCSSを弄る必要があって急に難易度が上がる。小説家になろうでは、ルビの部分に傍点をつけて代わりにしているが、カクヨムでは傍点専用の注記がある。
○○［＃「○○」に傍点］
○○［＃「○○」に丸傍点］
なろう
﹅や・分割している場合や一体になっている場合がある。
｜漢《・》｜字《・》
｜漢字《・・》
カクヨムの傍点ではドットである。
《《漢字 》》
小説家になろうで改ページの機能があったのででんでんコンバーターように変換する。
でんでんコンバーターでは前後に空行を入れて区切る、
［＃改ページ］
なろう
【改ページ】
[newpage]
でんでんコンバーター
=======================================
【改ページ】を\n=======================================\n
のように変換すればいいかな
でんでんコンバーター
改行を2×改行に
<p><br/></p>
挿絵は小説投稿サイトで用意されたところに画像を置く必要がある。
［＃説明（ファイル名、横サイズ×縦サイズ）入る］
pixv
[pixivimage:イラストID]
カクヨムなし
小説家になろう
<i3724|23>がURLに変換される。
でんでんコンバーター
［＃中見出し］〇〇［＃中見出し終わり］
pixiv
[chapter:章タイトル]
小説家になろう
でんでんコンバーター
## 見出しレベル2 ##
電書ちゃんがツイキャス始めたようです。
下のアフィリエイトから商品を買うと私にお金が入ります。
この世界がゲームだと俺だけが知っている 1<この世界がゲームだと俺だけが知っている> (ファミ通クリアコミックス)
