LoginSignup
5
4

More than 5 years have passed since last update.

Scrivenerの出力ファイルを縦書きにして最強の小説エディタ化させるgulpfile

Last updated at Posted at 2016-10-13

最強の小説エディタとの呼び声高いScrivener
しかしながらたった一点だけ。ほんとうにたった一点だけ、とても残念な仕様があります。
それは、 いつまで待っても日本語縦書き対応してくれないこと

縦書きさえ対応してくれれば!入力はまだ我慢するとしてもせめて出力を!とか願うわけですが、無いなら無いで自分でなんとかすればいい。というわけでgulpでさくっと作ってみました。
スクリーンショット 2016-10-14 1.12.30.png
Scrivenerからはこんな感じでHTMLとしてコンパイル。
スクリーンショット 2016-10-14 1.11.10.png

package.json
{
  "scripts": {
    "gulp": "gulp",
    "replace": "gulp replace"
  },
  "devDependencies": {
    "gulp": "^3.9.1",
    "gulp-replace": "^0.5.4"
  }
}
gulpfile.js
var gulp = require('gulp'),
replace = require('gulp-replace');

const css = `
body{
  font-family: "HiraMinProN-W3", "@MS 明朝", serif, sans-serif;
  writing-mode: vertical-rl;
  -webkit-writing-mode: vertical-rl;
  -epub-writing-mode: vertical-rl;
  line-height: 1.75em;
  text-align: justify;
  margin:0;
  padding:0;
  font-size:1em;
}
body.vertical {
  writing-mode: vertical-rl;
  -webkit-writing-mode: vertical-rl;
  -epub-writing-mode: vertical-rl;
}
body.horizontal{
  writing-mode:horizontal-tb;
  -epub-writing-mode:horizontal-tb;
  -webkit-writing-mode:horizontal-tb;
}
/*
縦中横
縦書きに混じる!?や平成25年、ABCなどの半角英数字や記号などを正立
*/
.tcy {
    font-size:0.9em;
    letter-spacing:-0.1ex;
    text-combine: horizontal;
    -webkit-text-combine: horizontal;
    -epub-text-combine: horizontal;
}
/*
傍点
*/
span.sesami {
  text-emphasis-style : sesame;
  text-emphasis-color : #000;
  -epub-text-emphasis-style : sesame;
  -epub-text-emphasis-color : #000;
  -webkit-text-emphasis-style : sesame;
  -webkit-text-emphasis-color : #000;
}
/*
かぎかっこ開始行で字下げを行わない場合
*/
p.escape{
  text-indent:0;
}
`;

const styleTag = `<style>${css}</style>`;

gulp.task('replace', () =>{
  return gulp
  .src('*.html')
  .pipe(replace('</head>', `${styleTag}</head>`))
  .pipe(replace('《《', '<span class="sesami">')).pipe(replace('》》', '</span>'))
  .pipe(replace(/|?([々?一-龠]+)(.+?)》/g, '<ruby>$1<rt>$2</rt></ruby>'))
  .pipe(replace(/<p class="(.+?)">「/g, '<p class="$1 escape">「'))
  .pipe(gulp.dest('./convert'));
});


gulp.task('watch', ()=>{
  return gulp
  .watch('*.html', ['replace']);
});

gulp.task('default', ['watch']);

あとはgulpでこんな感じで書いておけば、作業ディレクトリでコマンドから

npm run replace

を実行すればconvertディレクトリに縦書きのHTMLファイルを出力してくれる。

現時点ではさらに

  • 傍点対応
    • 《《foo》》(全角二重やまかっこふたつ)で囲んだ文字に傍点を追加
  • ルビ対応
    • 漢字の直後に《baa》(全角二重やまかっこひとつ)で囲んだ文字をルビに変換
    • |漢字《baa》(全角縦棒と任意の漢字に続く全角二重やまかっこひとつ)で囲んだ文字をルビに変換

までを自動でやるようにしている。
そのうち気が向いたら縦中横も対応できるようにしよう。

ちなみにコマンドを

npm run gulp

にしておけば、執筆中はコンパイルを自動で監視して変更があれば勝手に縦書きにコンバートしてくれたりもする。

私の環境ではこのあとはPythonで形態素解析にかけて校正ツールや人工無脳タイトルジェネレーターなんかを自前で作っているが、精度はお察しなので今後このままgulpでepub出力までやってみるつもり。乞うご期待。

いっぽうロシアはInDesignを使った。

追記

  • 2016/10/14 かぎかっこから始まる行の字下げを行わないようにしました。
5
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
4