anti scroll

ブラウザと小説の新しい関係を模索する

nehan.js

クラス名やID名が短く書けるようになりました

これまで縦書き文庫でマークアップするとき、特定の表示を利用する場合、クラス名にnehan-という接頭辞を付けなければならなかったのですが、これが不要になりました。 例えば行末寄せは、これまでは <p class="nehan-ta-end">行末に寄せる</p> だったのですが、今後は <p class="ta-end">行末に寄せる</p> とマ…

nehan.jsのデモページをReact/Fluxで作ってみた

必然性は全くなかったのですが、Fluxを試してみたかったので作ってみました。 http://tb.antiscroll.com/static/nehan-demo/ 使ってみた感想 あんまり感触は良くないかも… ただ今はなんとなく全体像を掴んだかもっていう段階なので、もっと複雑なUIを作ると…

Nehan Readerアップデート。サイトごとに変換対象を設定できるようになりました

Nehan Reader ver0.9.63から、サイトごとに変換対象を設定できるようになりました。 Nehan Readerchrome.google.com 設定の仕方 「涅」のボタンを右クリック→「オプション」と進みます。 「table of selectors to main article」の欄に [siteのURL], [select…

nehan.js 5.1.0系

まだ安定していないのでリリースまではしてないのですが、自分の中で懸案だった幾つかのトラブルが解消したっぽいので、nehan.jsのバージョンを5.0.5から、5.1.0へと上げました。 tategakibunko/nehan.jsgithub.com ちなみに安定していなくても、縦書き文庫…

Kefir.jsを使ってnehan.jsなビューアーをReactiveに作る

Kefir.jsを使ったのは、ドキュメントがわかりやすくて綺麗だったからです。 ビューアーの要件 NEXTクリックでページを進める。 PREVクリックでページを戻す。 $(“#page-count”)に、現在の総ページ数を表示する(非同期で増える)。 $(“#page-no”)に、現在の…

「Novelytics」の紹介 〜なぜ小説専用のアクセス解析が必要なのか〜

小説専用のアクセス解析 Novelyticsという小説専用のアクセス解析サービスを作りました。 なぜこんなものを作ったのかについて書きます。 アクセスをベースにしたログの限界 アクセス数というのは、言い方を変えれば単なるクリック数です。 当たり前ですが、…

ドラッグ・アンド・ドロップで、テキストを縦書きページ送りで表示するサイト「Nehan Text Reader」

HTMLファイルやテキストファイルをドラッグ・アンド・ドロップすると、縦書きページ送りで表示してくれるサイト「Nehan Text Reader」を公開しました。 tb.antiscroll.com 画面上(どこでもいい)にテキストファイルをドラッグ・アンド・ドロップすると、ビ…

box-sizing:margin-box

margin-boxとは margin-boxとは、ボックスのサイズをmarginも含めて計算するボックスのことです。 つまりmarginが50pxで、widthが200pxなら、コンテントサイズは 200(width) - 50(margin-left) - 50(margin-right) = 100 になります。 ちなみにこのmargin-bo…

nehan.jsのプラグイン紹介

nehan.jsのリポジトリにpluginsというディレクトリを追加しました。 最初に追加したプラグインは以下の5つです。 nehan.font-awesome.js 先日のエントリでも紹介しましたが、font-awesomeのアイコンを短く書けるプラグイン。 <fa name="user"> <fa name="star"> nehan.gravator.js emailを指</fa></fa>…

Nehan.createPagedElementの紹介

nehan.jsでは、組版エンジンを扱う入り口として、主にPageStreamというものを提供しています。 ただしこれは柔軟に扱える反面、はじめての利用者にとっては直感的じゃなかったかもしれませんでした。 そこで、nehan.jsのversion5.0.3からは、より扱いやすい…

jekyllで縦書き横書きの本が簡単に投稿できるテーマ

jekyll-nehanというものを作りました( デモを見る)。 Jekyllという静的サイトジェネレータのテーマです。 このテーマを使うと、nehan.jsを使った縦書き横書きのページ送りエントリが簡単に投稿できます。 スクリーンショット 見た目はこんな感じになります…

nehan.jsの正規表現セレクタ

nehan.jsのversion5から、セレクターのエレメント名の部分が正規表現で記述できるようになっています。 サンプル 例えば、ヘッダー要素なら全てに適用したいスタイルがある時は、こんな風に書けます。 // すべてのh1〜h6 Nehan.setStyle("/h[1-6]/", { "font…

nehan.jsで閉じタグの不要なタグ(single tag)を定義する

前回発表したアイコンの埋め込み特殊タグですが、こういうタグをnehan.jsでどうやって定義するのかを紹介したいと思います。 おさらいですが、先月に発表したfaタグはこんな風に宣言します。 ハートのアイコンは、<fa name="heart"> imgタグとかhrタグみたいに、閉じタグがあ</fa>…

nehan.jsで始めるfunctional stylesheet入門

いつも思うんですけど、 CSSでセレクタのパスを書いてスタイルを設定する 同じものをjavascriptで取得してイベントを設定する って二度手間じゃないですか? どっちもDOMノードを指定して、何かの値を設定するってことですよね。 設定するものがスタイルかイ…

外部の埋め込み作品に独自のスタイルを設定する方法

外部の埋め込み作品に、独自のスタイルを設定する方法を用意しました。具体的には、作者が自前で用意したスタイルファイルを外部から読み込ませる形になります。 通常の埋め込みコード まず通常の埋め込みコードですが(先頭部分だけ抜粋すると)こんな感じ…

nehan.js version5 を試験運用中

今週から縦書き文庫やauto-machicなどで、nehan.js version5系列(ベータ版)を試験的に運用しています。nehan-readerもversion5をのせてver0.7.6を公開しました。ということで、しばらくは何かしら表示上の問題があるかもしれないです。ちなみにversion5以…

NehanReader 0.6.11 release

NehanReader 0.6.11をリリースしました。久々のバージョンアップです。Chromeウェブストアでダウンロードする

ウェブサイトをページ送りで閲覧できるGoogle Chrome拡張「Nehan Reader」をリリースしました

見ているサイトをページ送り表示に変えてしまうgoogle chrome用の拡張「Nehan Reader」を公開しました。» Nehan Readerをインストールする(Chromeウェブストア)使い方は、ブラウザーバーに表示される「涅」というアイコンをクリックするだけ。

nehan.js previewer を公開しました

nehan.js previewer(β) を公開しました。Chrome/Firefox などではドラッグ&ドロップでページ出力された結果をプレビューできます(IEの場合はテキストフォームから)。もともとテスト用に作ったものですが、一般の人にも便利かもと思って公開してみました…

nehan.jsにおける関数値を設定するセレクタについて

nehan.jsではセレクタの値に「関数値」を設定できるものがあります。例えばcssの擬似クラスにnth-childというものがありますが、これに2n+1とか-n+10とかいう値を設定するよりは、nを受け取る関数にしたほうがわかりやすいので、nehan.jsではnth-child, nth-…

drop caps表示ができるように

雑誌とかでよく見かけるDropCapsという表示が出来るようになりました。横書きだとこんな感じで……縦書きだとこんな感じになります。

ブラウザ別の涅槃パフォーマンス比較

前からやろうと思っていたのですが、涅槃1と涅槃2のスピード比較と、ブラウザ毎のスピード比較をしてみました。 テストデータ テストに利用したのは、夏目漱石の行人で、約60万字のテキストです。字数も多くルビも沢山振ってあるので、それなりにパースに…

涅槃リンク集

涅槃を活用してくれたホームページやブログのリンク集を、こちらに分けて載せることにしました。後はコメ欄とかで連絡をいただけたら、もれなく追加します。 縦書き日誌 Offbeat Editions Blog 東京散歩 senvaloran min Knowing She would(浮遊区域書庫) …