水元公園菖蒲祭り
毎年恒例。６月１日から水元公園は菖蒲祭りだ。
ステージのある広場。ステージではきいたことのない演歌歌手が歌い、地元の昔御嬢さんだったダンサーたちが踊りを披露する。広場の屋台では、地元の居酒屋や食堂が出店でやってきたり、農協や、農業高校が出店してたり、値段も品もばらばらで、さながらビックリ箱の楽しさ。
老人会婦人会町内会が集まり、お父さんは顔を赤くして寝転がり、犬と子供は走り回る。
満開の菖蒲が、水辺で青から紫、赤紫の花をつけて彩を添えて、という光景が広がる。
ステージとは橋を渡った公園の逆側は、菖蒲祭りと毎年同時開催の陶器市と屋台村。
澤乃井などの東京の地酒をはじめとして、関東近県の地酒が並び、たこ焼き、お好み焼き、モツ煮は当然として、八丈島のクサヤを焼いてくれたりと、公園の中にあらわれる赤提灯の居酒屋空間。
まったりとした時間と、梅雨時のじめっと暑い空気と、ちょっと涼しい風と、日本酒とおつまみ。
ちなみに、今日飲んだのは、澤乃井の蒼天、被災地を応援！の福島、谷乃越。蒼天が美味いのは知ってたけど、この福島の谷乃越もすっきりと切れ味があって美味かった！
いやもう。毎年きてるけど、好きでたまらない祭り。
だいたい、公園で屋台でお祭りで、というのはいいとこ取り。会社や学校、普段の生活でロクでもないこと・嫌なことがあっても、大半のひとは、「公園に行く」ときはそんなものを持ち込まない。なので、いいとこ取り。プラスのオーラしかない「場」。まわりをにんまり眺めてるだけで自分も、なんの根拠もないけど「なんか大丈夫」な気がする場ですなあ。
期間中にまたぜひ行く。
» ローカル環境で電子書籍を作る、Macアプリ・Windows版ツール 「かんたんEPUB3作成easy_epub」
ネット記事の原稿料
ネットで仕事を見つけるためのマッチングサイトには、ライティングの仕事も掲載されている。そのほとんどはブログへのヤラセの投稿、あとはSEOがらみの記事や、ネタ・テーマを指定されての記事。原稿料がびっくり。400字詰め原稿用紙に換算すると、1枚50円程度になってしまう。
また、いわゆるニュースサイトやポータルサイトに掲載するような記事も1枚500円程度。
わたしは以前、弱小出版社にいた。原稿料も、大手出版社と比較すると安かった。それでも原稿を頼むときは1枚2000円程度になるように調整してお願いしていた（ペラ1000円）それもほぼ10年前。
ネットに掲載されているテキストの質うんぬん。そりゃこのギャラじゃ、その程度にしかならんだろう。書き散らして、かき集めて、なんぼにするしかない。
ネットは印刷も紙も運送代も必要ない。言ってみれば、タダで情報を発信できる。なので、コンテンツにも金をかけない。って、違わないか。だからこそコンテンツに金をかけられるんじゃないのか。
ネットで金にする（最近ではマネタイズとかいうらしい）有効な方法がないもんだから、コンテンツに金をかけられない。安いコンテンツが垂れ流されたんじゃ、そんなものに金を払おうとも思わない。という悪循環じゃないのかね。
WEBサイトを構築するのに、制作会社に依頼すると、何人月とか工数という妙な単位を持ち出されて、ちょっとしたサイトを作るのにン百万単位になることも珍しくない。器を作るのに金をかけるヒマがあったら、中身に金かけろ、だ。
ネット企業の経営者や、アルファブロガー（ってなんじゃそりゃ）あたりの言ってることを見てると、なんちゃら新聞に掲載された、だの、どこそこの番組に出た、だの。既存メディア万歳で、ネットをメディアとしてなんとかしよう、なんて意識は感じられない。
結局、従来の権威が大好きなだけじゃん。
それで意識が高いだ低いだ、よく言ってんなあ、と思う。
テレビラジオ新聞雑誌書籍などなど、既存のメディアはむずかしい状況になってるんだろうけど、それにとってかわるものとして、安直にネットでいいのか、と。とってかわっていいのかな。
あっちが閉塞状況だから、こっちを見たけどあまり感心しないよなあ、という今日この頃。
» ローカル環境で電子書籍を作る、Macアプリ・Windows版ツール 「かんたんEPUB3作成easy_epub」
perl で QRcode生成
perlは本当にスゲー。こんなのないかな、あるかな、と思ったら、ほとんどすでにCPANに登録されている。ほかの lightweight language の状況は知らないので比較できないけど、perlがあればほとんど用が足りてしまうんじゃないか。
てことで、QRコードの生成。
創作文芸見本誌会場HappyReading のスマホ版を作ったことだし、スマートフォンで見てもらえるように、誘導したい、というのが目的。スマートフォンでちまちまURLを入力するのはうっとーしーんで、QRコードの出番だろう、と。
レンタルサーバーのlolipopには GD モジュールと一部の関連モジュールはインストールされているらしい。ただ、ここで肝心の、QRコードがインストールされていないので、CPANからもってきた。
CPAN https://search.cpan.org/~kwitknr/GD-Barcode-1.15/
↑これをダウンロードして解凍展開。中を見ると、何かをコンパイルするワケでもなく、ただ所定のディレクトリにコピーしてるだけの pure perl モジュール。そのままlolipopにFTPでアップロードしたら、問題なく使えた。
コードは、これだけ。
STRINGの部分にURLとかテキストを入れる。日本語もOKだけど、検索してみると、ガラケーはSHIFT JIS なので、文字コードを SHIFT JIS にしていることが多い。
これで、QRコードの画像 png を出力してくれるので、img タグに、このスクリプトのURLを書いておけばいい。ちょっと調べたのがQRコードの仕様。
ECC というは、エラー修復レベル。
アウトドアなど汚れ・破損が激しそうなところで使う場合には Hレベル(修復30%）、などなど修復できるレベルがあるので、それを指定する。
ModuleSize というのは、文字通りセルサイズ。
ひとつひとつのセルのサイズを指定できる。
Version・型番というのはセル構成＝セル数。
１～40まであって、大きいほど記録する文字数が増える。
て、ウチみたいな素人ヨタ話のブログを見るより、開発者の一次情報を確認しましょう。
QRコードドットコム
画像を生成して表示するのに、ほんの少し時間がかかるので、サイトではajaxを使ってスクリプトを呼び出すようにした。情報としては、URLとサークル名、本のタイトル。
スマホのQRコードで読み取って、URLに飛ぶとその本のページが開く。おお、これは便利だ。便利なはずだ。きっと。だがしかし。
QRコードの活用例として、流通の現場で商品の確認とか、製造の現場での商品トレースとか、バス停で時刻表とか、有効に活用されている。たとえば、WEBへ誘導するのに、チラシや名刺にQRコードがプリントされていたら便利。だけど、サイト上にQRコードを表示して、さてそれってどうなの？PCでサイトを見ていて、そのページをスマートフォンでも見てみたい、というリクエストがそんなにあるとは思えない。
QRコードが使えるのでとりあえずつけてみました感が漂う。
WEBサイト上にQRコードが表示してあって、こいつは便利だぜ、待ってたぜ、という事例があったら、ぜひ教えてください。
» ローカル環境で電子書籍を作る、Macアプリ・Windows版ツール 「かんたんEPUB3作成easy_epub」
jquery mobile管理化に別のjavascriptを
jquery mobileは、一度ページを読み込んだらいつまでどこまでDOMを保持管理してるのかが、複雑に入り組んでいる。サイトに着地して、ページのヘッダまでを読み込んだら、あとはbody部分のDOMの書き換えでページ表示している。リンク、というか、ページの取得は ajax が基本。そのために、id属性などは、ページに一意ではなくて、サイトで一意にしておいて、DOMまわりのトラブルを避けることが推奨されている。ajaxとidなどのプロパティは密接だからねえ。
このあたり「jquery mobile ポケットリファレンス」の Chapter20 ページイベントに図があって、ちょっとわかりやすい、かも。
やろうとしたことを具体的に。
PCサイトでは。
・本の詳細ページを開くと、そこには立ち読みテキストを読み込んで表示するコンテナがある。
・このコンテナにページャーがあって、ページリンククリックで ajax を走らせて、立ち読みテキストの次ページを取得して、コンテナ内を書き換えている。
上記したように、jquery mobileのDOM管理下だ。自作Javascriptで、$.ajaxを使ってページを取得する…スキルはわたしにはない。該当ページだけ ajaxではなくて、サイト外リンクを読むのと同様、ページ遷移するやりかたも用意されているが、それは jquery mobileの作法流儀じゃない。該当ページは、perlで動的に作ってるので、ページの中にJSONのデータを埋め込んで、evalでオブジェクトに読み込んでおくことにした。
というのが昨日までのあらすじ。
あとは、読み込んだオブジェクトを該当コンテナに $(#id).html(obj) とやれば楽勝、のはずだったのが、表示されるのは初めてページを読み込んだ時だけ。次にjquery mobile がajaxで遷移するとなにも表示されない。
alert(obj)では表示される。コンテナに直接 document.write(obj) とやると、エラー。とりあえず、pageshow とか pagecreate とか pagebeforecreate とか、それっぽいところにalertを入れまくって何が起こってるのかみた。
見てると。一度、オブジェクトに読み込んだら、いつまでも保持してる、っぽい。てことは、#id も掴んでまわしてる様子。そんなところに $(#id).html(obj) とやっても、受け付けてくれない、ということ、かな。
なので、pagebeforeload ページを読み込む前のところで、無理やり $(#id).remove() と初期化（？）したら、意図通り立ち読みテキストを該当コンテナに流し込むことができた。
iphoneで見る 創作文芸見本誌会場HappyReading
【象印社 「ソラ」著者：永瀬月臣・鳥久保咲人・くまっこ イラスト：あめ】
ヒラギノ明朝の縦書きはバランスもよくて、ほれぼれする美しさ。フォントは大事。小説に縦書きは大事、というのがよくわかるスクリーンショット。
これで公開だ、と思って、ヨメのAndroidで確認して愕然。というか慄然。縦書きになってない。
Androidもiphoneと同じwebkitのはずなのに、AndroidのブラウザはまだCSS3のwriting-modeに対応してないのだ。なんじゃそりゃ、と思って検索してみたら、Androidは個々ばらばらで、怨嗟呪いの声があちこちからあがっていた。
てことで、今まで公開していたスマホサイトも android用に残しておくことに。
iphone のヒラギノ明朝がきれいな、 新スマホサイト
android のために残した 今までのスマホサイト
うーん。スマホになったらブラウザの対応は簡単だと思ったのに。
» ローカル環境で電子書籍を作る、Macアプリ・Windows版ツール 「かんたんEPUB3作成easy_epub」
初心者メモ：javascriptのオブジェクトとかJSON
ハマったのでメモしておく。とほほ。
やりたいこと。
JSONで連想配列のペアを渡して、そいつをevalで読み込みオブジェクトにして、キーを作って値を取り出す。ありがちで、よく使われるシチュエーションだ。なのに、どうにもこうにも見えてこないんで、小さくテストをしてみた。
var data = {key1:val1, key2,val2}; というJSONのデータ
まず、evalの書き方でハマった。WEBを探すと、evalに渡す時に、変数を()で括る必要がある、という記事を多数見かけたので、やってみたら、missing after elements だかのエラー。
var obj=eval(data);
と、なんの細工もせずにシンプルに書いたら、これでOKだった。()で括る必要があったり、”の展開を考えたり、ラベルが問題？とか右往左往した。ネットの２次情報を呪文状態で使っちゃだめですよ、てことだな。１次情報に当たるべし、だった。
さて、次のハマり。
var str = "key";
var num = 1;
var key = str + num;
どの値が欲しいのか、てことで、こんなことは当たり前にある。
変数の key を作ったんで、さて値の取出しだ、と
obj.key
とかやったら undefined
for(var k in obj){
alert(k);
}
でオブジェクトを確認すると、当然 key1 はある。添え字とか、オブジェクトとか、値の取出しとか、グーグル様にすがった…これもevalの書式と同じことだった。基本部分をちゃんと読め、だ。おれ。
obj[key]
とやればいいだけだった。上記以外にも、セミコロンを最後に忘れてたり、JSONの中のダブルクォートをどうしようかとか（結局わからず、JSONのデータ中で使われてるダブルクォートはシングルクォートにした）
ほとんど半日潰れたようなもんだぞ、ううう。
とりあえず。これが解決したので、 創作文芸見本誌会場HappyReading のスマホ版リニューアルに向けて立ち読み動作の目途が立った、かな。
ここんとこ同じことばかり言ってアレだけど。jquery mobile は文句のつけようのないデザインフレームワーク。ネーム、絵コンテ、下書きまでやったら、残りのペン入れ、仕上げをやってくれるのだ。でもさすがに、それにはお約束事があって、jquery mobile のお作法では、リンクでページの読み込みや、ajaxの挙動にクセがある。
テキトーにページを読み込んだりajaxでコンテナを書き換えたりできるんだけど、それをしちゃうと、デザインフレームワークを生かせない。jquery mobileが提供してくれているデザインは、スマホに特化したもので、それはスマホの特性、画面、UIを考えて作られたデザインだ。考えらえたデザインを捨ててまで、自前のオリジナルjavascriptを組み込むのは愚の骨頂。デザインとjavascriptと、どちらのコストが高いか、比べるまでもない。
てことで、今、ajaxでいちいちページごとにサーバーに来て取得していた立ち読みテキストを、JSONで一度に取得してあとは、javascriptで document.write するだけ、に変更中。iphoneのヒラギノで見る縦書きにぞっこん、なので、モチベーションは高いのでありました。
» ローカル環境で電子書籍を作る、Macアプリ・Windows版ツール 「かんたんEPUB3作成easy_epub」
メモ：縦書き css3 writing-mode
創作文芸見本誌会場HappyReadingをはじめとして、わたしの作って公開しているサイトのあちこちに、文章を縦書き表示するページがある。いや、やっぱり小説は縦書きじゃなきゃ困る、昭和なもんで。
ブラウザでいえば、IEが以前から独自拡張で縦書き表示ができていた。
2010年ぐらいから、amazon の kindleがくる、すわ黒船来襲か！？というの踊らされ、あちこち見て回ってると、今なお、epub 、電子書籍のための規格決めで紆余曲折中らしい。少子高齢化じゃないけど、「日本語圏」って、世界的にはマイノリティになるんだろうな。
てのはともかく。
今日時点、ざっと検索したところ、webkit系のブラウザは writing-mode を実装していて、日本語の右から左へ流れる縦書きとか、アラブの右から左に流れる横書きなどに対応している（safariとかchromeですね）
わたしのサイトの縦書きは無理やり。幅1emのブロック要素にテキストを流しこんで、それをfloatで右から並べてる。ハイフンやかぎかっこなどは回転させて、句読点は位置を調整している、んだけど、しょせん横書きのフォントを縦に並べてるだけなので、フォントの環境によっては（プロポーショナルフォントなどで表示されてしまうと）全体がふにゃふにゃ波打つし、調整しきれない句読点なんかがハミ出していて、よろしくない。
で、safariで以下のスタイルシートを試したところ
きれいな縦書き表示。縦書きフォントを使ってるので、妙な歪みもないし、iphoneで見ると、ヒラギノ明朝はきれいだし。
ブラウザの対応状況が微妙なので、PC版のサイトでこの表示は難しいけど、スマホ版なら問題なさそう。こっそりスマホ版で試してみる、かな。
右側が今やってる無理やり縦書き、左側がsafariによる縦書き。ガタつきなど、その差は見てわかると思う。
» ローカル環境で電子書籍を作る、Macアプリ・Windows版ツール 「かんたんEPUB3作成easy_epub」
