余弦発振　〜さわ狂ぶろぐ〜

　懸念した通り、前回の画像が早速背景画像のせいで見づらくなったが気にせず。どうせ月が変われば見やすい白バックに戻るんだ！で、PDRをSVGに変換して再利用できないか探るプロジェクト第2回目。
　いやさ。SVGに関してはネットを探せば仕様を書いた資料くらいいくらでも見つかると思うから、わざわざ自力で解読しようとしなくてもいいんじゃねって話になるだろうけど。俺は俺が使う範囲の使用だけ分かればいいんだから手元にあるデータだけでなんとかした方がきっと早いと思うの。
　と言うわけで、早速前回と同じ図形のSVGをみてみよう。同じと言っても、まったく同じものが用意できるんだったら変換プロジェクトなんか要らない。手作業で、ざっくりと似たような形を書いただけだ。大した図形でもないからな。
　SVGファイルには一番余分な部分が省かれた最適化バージョンでも宣言文とかメタデータとかがたっぷり含まれているが、そこら辺はスルー。コピペしただけで記事が終わりそうなのでサンプルも無し。変換の際にテンプレートとしては使えそう＆使いそうだが、まあ精々折を見て要らないの割愛するくらいで変更する必要はなさそうだし、細かい内容はどうでもいいや。、
　その下にgって言うタグで挟まれた部分があるが、これがHTMLで言うところのbodyに相当するみたい。その中にそれぞれの図形を現すタグがある。まずは上の線を表すタグを見てみよう。

＜path id="path815" stroke-linejoin="miter" d="m17.36,25.195,27.722,14.24c20.723,4.1101,32.428 -7.529,42.398 -22.198,25.189,0.78132,23.357,16.046,24.461,29.737" stroke="#000" stroke-linecap="butt" stroke-width="0.14462669px" fill="none"/＞

　1行に纏まってるせいで絶望的に見づらい。しかも桁数も不揃いの小数がカンマやスペースで区切られてるんだからますますだ。一番ごちゃごちゃしたdパラメータがメインの座標一覧なのは分かる。お楽しみは後に残し、あるいは面倒なものは先送りにして分かりやすそうな周りのパラメータを見ていくことにする。
　PDRと違ってその値がなんなのかちゃんと書かれてるから“ここは”分かりやすくて助かる。strokeってのは線の色、fillが"none"で塗らないことを宣言。線の太さのパラメータもあり、他にも線の繋ぎ目と端っこの形状についてのパラメータが見受けられるがどうでもいいな。
　では本題となる座標だが……。見づらいので、バラした上で桁数も揃えて整理してみる。
d="
m17.36 , 25.19,
27.72 , 14.24
c20.72 , 4.11,
32.42 -7.52,
42.39 -22.19,
25.18 , 0.78,
23.35 , 16.04,
24.46 , 29.73"

　おおう。想像以上にワケ分かんねえ……。とりあえず、ざっと見た感じで分かるのは、マイナスがあると言うことで座標の指定が相対座標なんだなと言うことだな。で、区切りがカンマだったりスペースだったりする。最初はx,y x,y……みたいにカンマで区切られた座標がセットでそれをスペースで区切ってるのかと思ったが、どちらのあとにもカンマがあったりなかったりするじゃねーか。とりあえず、図形の形状的にマイナスになるのは線が上に進む部分だけだからxyはこの並びであってるはず。
　んー、でもよく見ると行末にカンマがないのはcの直前だけか。これはcがカンマの役目も果たしてるだけだな。じゃあ問題はそもそもそのcとか冒頭のmとかなんなのって事だが。ノードがスムースかシャープか(角が丸いかとがっているか)を示しているんだとしても、尖ってるノードは2個あるんだから数が合わん。むしろ、スペースで区切られている座標セットがスムース……でもないよな。やっぱワケ分からん。
　サンプルが少ないからこういうことになるんだ。と言うわけで、四角形の方の記述を見てみることにする……が。長くなったのでまた次に。

　KIEF更新、今回はラブラシス機界編。
　肝試しエピソードが始まった時は夏だったが、いい感じで季節外れの真冬に続いてしまった。どちらかというと今回の方が本番だし。
　ラブラシス機界編はバルキリーと呼ばれているロボを中心にいろんな人を描く形にすることにしており、このエピソードではチームヘンデンビルにスポットが当たっている。
　スポットを当てるにあたり、中央からの逃亡時に名前を呼ばれる程度だったキャラ達もしっかり登場。しかもそれぞれ出番がそれなりにあるのでキャラ付けもされた。だがしかし、今後出番あるんだろうか。物語の舞台がまたこの辺になれば自ずと出ることにはなると思うが……。って言うか、しっかりキャラがついてる分、元々のバティスラマ勢すなわち主要でない男キャラは名前くらいで個性の設定さえなく、一言言葉を発したきりくらいのキャラがほとんどの連中よりは使いやすいよな。まあ、その辺は今最初の方で進んでいる書き直し次第でもあるんだけど。そっちで出番が増えてキャラも立つかも知れないからな。
　で。バルキリーに人型モードが加わってみんなのペット状態からヒロインっぽくなってきたわけだが。ようやくだよ！
　そう言えば、書き直しとバルキリーで今の所バルキリーと呼ばれているロボの『本体』をフレイアと呼ばせるのを早める、と言うかタイミングを逃しまくってたのをなんとかする予定もある。ブログの看板娘名表記では使われ出している固有名・イリスってのもあるし、呼び方が変わるスパンを広げたい。
　そんな感じで女の子の姿をゲットした、まあやっぱり今の時点ではバルキリーとした呼べないそれなんだが……。次回では早速出番がなくなります。
　そして、書き始める直前くらいまで俺すら想像もしていなかった展開に。これまで無名のやられ役として生け捕りにされてきた青の人、黒の人、そしてプラスもう一人の野郎三人がまさかのパート主役に。意外な新敵対陣営が出現する次回からの将校三人編が始まるよー。
　ヤベえ、色気も華もなさ過ぎなんだけど、どうしよう。
　ちなみに、書き直しを決めた理由の一つにこの三人と言うか青黒の二人が、あとから追加された個性に沿ってないし、そもそも今述べた通り名前さえ無しの扱いだったのもあったんだよな。
　なんにせよ、そこまで書き直すのにどれだけかかるかって言う。最初の方はホントにちょこちょこ加筆したり削ったりしてるだけだったのに、なんか途中から丸ごと書き直しになってるって言う。当然、書き直したところとその後がちゃんと繋がってないし、そのせいできりのいいところまで更新ってのがしにくいし、そもそも話が1本増えちゃってるんですが。ええー……。

　ネタがないので変なことを始めてみる。
　FLASHが終了したことで色々ばたばたしているというかじたばたしている所だが、これまでにFLASHとして作ったものをFLASH以外にするのがそのじたばたの大部分だ。
　逆if証拠品もFLASHのASからJSに切り替えたが、見た目を支える画像のほとんどはParadrawからPNG出力、その後リサイズする形で作成している。
　基本的にこれだけでほぼ用は足りると思う。これから編集したいと思ったらParadrawで編集してPNGにすればいい。一部Suzukaでパーツを寄せ合わせた大規模プロジェクト（笑）もあるが、そっちもソフトが使えないわけではないから大丈夫だ。そもそも、前に描いた物をまた使うケースが特に思いつかないし。
　そんなこんなで特にやる必要はないんだが、何せネタがないもので。Paradrawで描いた絵をどうにかしてSVGに変換できないか考えてみる。
　そんなことを考えた理由は、SVGもParadrawのPDR形式も基本はテキストで構成されているから。どちらも座標データ他の羅列であるなら、PDRを手作業でSVGに変換するのだって可能なはず。さあ、やってみよう！
　って言うか、確かにさ。これでPDRをSVGに変換できたとして、だ。そこまでしてSVG化する必要性ってものをまったく感じないんだけど。まあ、大きめのイラストならSVG化してページに貼り付けたりするのも悪くないとは思うし。でもやっぱPNGでいいよな……。

　いいんだよ、ブログのネタが増えりゃ、なんでもさ。
　ってな訳で、まずはそれぞれのデータを見比べてみよー。今回サンプルにするのはこの図形。
　これはPDRのサンプル、Paradrawで描いたバージョン。SVGでもこれと大体同じような図形を用意した。で、PDRファイルの内容はこれ。短いので丸ごとコピペするぞ。
PDR030
300,300,255,255,255,1,60,30,2
0,"",0,0,1,128
2
5,#FALSE#,20,1,-16777216,0,-256,3320,1570,0,.1416016,.1416016,-1,#FALSE#,0,#FALSE#,0
0
0,1000,1100
0,2480,2380
1,3561,1861
0,4000,660
1,5381,1072
0,5780,2260
3,#TRUE#,20,1,-16777216,1,-3342541,3050,4030,0,3.051758E-02,3.051758E-02,-1,#FALSE#,0,#FALSE#,0
0
0,1320,2880
0,1320,5180
0,4780,5180
0,4780,2880

　1行目はファイルの形式の宣言文だな。メインは2行目からだ。2行目はキャンバスのサイズと背景色のRGB。その後の数字はさっぱりだが無視してよさそう。ちなみに、キャンバスのプロパティをみたらパスの最適化にまつわる設定が60と30だったので、他の数字もキャンバスの設定だろう。
　これまたキャンバスの設定関係だろう数字を2行ほど飛ばして、やたら長い行がパスのパラメータだな。それぞれなんなのかを推理しないとならんな。分かりそうなのは、一つ目のFALSEとTRUE。二つの図形の最大の差である、開いているか閉じてるかだと思われる。次の20は分からんが、その次の1は線の太さじゃないか？マイナスのやたらでかい……いや小さい数は案の定0xff000000でARGB、透明度がffであとは0の線の黒色。その次の0と1は分からん。塗りの有無？次のマイナスも色、今度は塗りだろう。ここからあとはさっぱりだ。小数とか何なの。次の0だけある行も謎だが多分パスのグループ番号とか複合IDとかじゃないかと思われる。まあ、色と座標くらいあれば大体再現できそうだし、わかんなくても別にいいんじゃね。
　さて、いよいよ座標の羅列だが……。キャンバスは300×300なのに1000とか、ましてや5000以上って。整数で表現するために倍率が設定されてるんだろうけど、どう見ても10倍じゃないな。まあ、20倍か、あるいは16倍とかかな。定義の行にあった「3320,1570」あたりも座標っぽい数字だ。パスのパラメータでノード以外に座標って言うと……グラデーション関係かなぁ。
　各行の最初の0と1は明らかにそのノードがシャープかスムーズかだ。座標はさっき書いた通りに何倍かにはなっているがまあ分かりやすくて助かる。
　で、次はSVGだが……。いい加減長くなってるのでまさしく次の機会ってことで。

　ああもう次から次へと！
　FLASH余命宣告を受けてのFirefoxでの取り扱いほぼ打ち切りにつき、JSかを余儀なくされた逆if証拠品。ほっと一息入れていたら今度はAutoPageがSSL導入とかでまた表示できなくなっちゃいましたよ！なんかアナウンスはあった気がするが、関係ないことだと高を括ってたら大騒ぎですよ！
　って言うかそもそもSSLって何。SLなら近所で土日とかにプオオオオオォォ！とか吼えたくりながら写真撮られてるけど。
　SSLとは盗聴・傍受・改竄などを防止するためにデータを暗号化して通信するプロトコルのことで、以前からちらほら見かけていたhttpsで始まるアドレスがそれだそうな。
　AutoPageがSSL導入に踏み切ったのは、恐らくGoogle ChromeがSSLじゃない普通のhttpプロトコルのサイトで「安全じゃない」表示を行うようになったためだと思われる。さらには、httpのページはGoogleなんかでの検索順位がグッと下がるとか。つまりはまたアメリカの連中が自分たちの仕様を押しつけようとしてるって事か。別に表示するだけなら暗号化なんかされてなくたってなんてことないし、入力するったって個人情報を入れるようなフォームじゃなきゃ問題ないと思うがね。
　なお、SSLについて調べていたら2015年6月にSSLの使用は禁止されてそれっきりみたいな記事があって、SSLについては使うべきではない。とまで書かれていてええっとなったが、禁止されたのはセキュリティの問題が見つかった最後のSSLバージョン3.0であり、その後は後継のTLSシリーズが使われているがTLSとはなかなか呼んで貰えずSSL呼ばわりされている模様。あれか、オーストリーと呼んでくださいと発表したのに誰もそう呼んでくれなくて時刻大使館すらオーストリアに戻したのと似たようなもんか？違うか？違うな。むしろナビスコがいつの間にかヤマザキビスケットになったのにいつまでもナビスコのような気がするのと……も違うか。まあいいや。
　で、そのSSLで保護されたページには、インラインフレームで逆ifのスクリプトページが表示できないという訳らしい。
　俺の場合はKIEFを表示してそこからリンクで飛んできているので最初のアドレスはhttpだし、そこからリンクを辿ってブログ内を移動してもhttpのままなのだが、投稿後にブログを表示するボタンを押したり、俺は未確認だがコメント投稿した後などはhttpsの方で表示されてスクリプト部分が空白になる。google辺りから飛んでくる場合もhttpsとして表示されるんだろう。
　AutoPageによるアナウンスを読み返してみたが、どう対応すればいいのかがさっぱり分からん。余所のブログパーツなどを表示している場合はそれが表示できるか確認し、表示されていない場合は提供サービスに対応状況をお問い合わせください、と書かれている。何それめんどくさい。
　なるべく人に頼らずに対応せねば。

　KIEF、タカマ過去更新。
　天神が遂に5人揃って言うなれば第一部完と言った所の今回。ある種、やっとかって感じですね！そして、一部の終わりと二部の頭が一緒になっちゃってるのが今回。もっとキレイに切れなかったものか。そして一つ目の山になる場面のはずが、全体的に見るとギャグ展開が多くてそんな感じがしないって言うね。
　この回はとにかく苦労した思い出が……。いや、今日更新したという体なんだから思い出とか言うなって事だが。これまで割と思いつきで色々書いてた軍の裏事情をまとめて片付けないといけなかったのでそれをどうしたものかと。でもって、こんだけ風呂敷広げちゃってどう畳むのかと。まあ、結局風呂敷に油かけて火を付けて無理矢理終わらせた形か。こう書くとホント酷い。
　とりあえず、ずっと進めていた『一番最初に存在が明らかになるスバポが仲間になるのは一番最後』というのだけはちゃんとやれた。散々引っぱった割にはさらっと流してしまったが。絶対濃いオッサンのラズニにインパクトで喰われてるしな。
　で、その濃いオッサンのラズニが早速活躍している。得体の知れない愛のパワーで怪現象を引き起こしているが、もちろんこれはまだ本人も気付いていない（ある種気付いてて確信の上に力を行使してはいるけど）天神としての力ですな。

　さて。ここまでは、歴代月読の政策というか方針で人間の領域と自然の領域を分けているという設定の元、自然界の住人との接触少なめでやってきたわけだが、この辺りから舞台はド田舎へ、自然とのふれあいも増えてくることになる。タカマらしくなりますね！
　そしてこの辺から読む割合が増えてきたラノベの影響でお色気とかラブコメ展開が増強されていくことにもなりつつ。まあそこら辺はどうでもいいよね。
　あんまりそんな気はしないと思うがこのところシリアス展開が続いていたので、そろそろ一旦緩む展開になっていきますです。迫る温泉回！
　まあ、今の所緩んだっきりで戻る所まで話が出来上がっていないんだけどね……。

　おお、略してぼんくらだ。略すな。
　煩悩と言えば除夜の鐘。まあそれ以外の時もガン無視しているだけで年中煩悩につきまとわれてるが、そんなわけで概ねタイトルだけで年末だと分かるような、……やっぱり分からんか。まあそんな感じである。で、ついでに言うとクライマックスはクリスマスをもじっているが苦しすぎる。まだクルシミマスの方が分かりやすいくらいだ。こっちは既に鉄板ネタでもあるしな。
　そんなわけでクリスマスから年末までをざっと流した今回。一応この小説もラブコメを標榜してるんだから、ラブコメとしてクリスマスは一大イベントのはずなんだが。兄弟姉妹で部屋に寄り集まって駄弁って終わりというラブコメらしからぬ展開でクリスマスはさらっと流れました。
　で、超久々に登場した加奈子と恒星。改めて調べてみたら恒星は20話で加奈子と共に、加奈子は更に25話でも一度流星・樹理亜の会話の中で名前だけ登場。まあ、そもそも加奈子自体がキャラとして登場した事ってあったっけ。考えてみたら恒星すら怪しい。
　そんなもしかしたらキャラとして登場するのは初めてかも知れない二人。加奈子はしばらく見ないうちに変わっていて、加奈子とも疎遠になっていた恒星も加奈子から見れば大分変わったとの事だが、そもそも変わる前の二人が登場してないんだから読んでる人にしてみりゃどう変わったのって感じだろう。どう変わったのかは作中で書いてはいるが、変わる前の印象が無さそうだもんなぁ。
　そもそも、中学卒業までの15年間が10話の中にみっちりと詰まってるわけで。でもって序盤は孤独に未来に向けて研鑽する日々、樹理亜らと出会うまでに3話くらい使っててそれからだからな。伽椎とのラブコメ展開もあったしそりゃあ弟衆とか出番無いわ。
　つーか、今その辺見直してて気付いたんだが、恒星＆加奈子って流星らが幼稚園に入る頃に生まれたことになってたんだな。その計算だとこれから中学進む所じゃん。やっべ、なんで一つ下だと勘違いしてたんだろ。まずいな、直しておかないと。何と言うか、まだ始まってないこといなってるけど雛罌粟の方で加奈子がナガミーの後輩になる予定なので1歳差に合わせないと。そうしないと、ただでさえ縁が薄く出番の少ない加奈子をどこかで登場させるための折角の口実がなくなる。
　ちょっと前から中学までの話の詰め込み過ぎと高校入ってからのテンポの、ひいては各時代の扱いの差とか、爺婆や和弘隊長みたいななんのために登場してたのか分からないうちにフェードアウトしたキャラでもうちょっと何かやれなかったろうかとか、幼児期しかやれないイベントがもっとあったよなーみたいなことを考えてはいて、その辺を加筆するプランがあったんだけど。恒星らの設定をしれっと修正するためにもほぼ必須になったわ。
　まあ、同じようなことを既にラブラシス機界編でやってるからそっちと並行させるか、あっち片付けてこっちに移るかプランを立てないといかんが、あっちもなかなか進まないんだよな……。これ以上並行は難しいだろ。まあ、心に留め置いてそのうちってことにしておく。逆ifのスクリプトも一段落したんだし、ペースも上がるだろ……。
　なんだ、要するにアレか。略してぼんくらとか言ってたら俺のぼんくらぶりが露呈した訳か。いやぁン。

　逆ifのJavaScriptが相当雑だが概ね出来上がった。細かいところは後で気が向いたらどうにかする。
　と言うわけで、ここからしばらく雑さ自慢。誰得。
　見てわかると思うが、インラインフレームで外側が隠れてるのをいいことにやりたい放題だ。詳細も一ページ中に全部入れちゃったし、おまけにアンカーとリンクで飛んでるだけだもんな。最初は最終的にきっちりブロックを作って重ね、スクリプトで表示をオンオフしたりしてスクロールなしで実現できるようにしようとも思っていたが、このままで何の問題があるのかって感じになった。まあ、スクロールさせたら見えちゃうのは、特にまだ入手前とか変更前の証拠品の詳細が見えちゃうのがどうかって感じだが、まあいいんじゃね、で片付ける気満々です。
　スクロールと言えば、その詳細のうちの一つ鉄パイプの指紋詳細がただのスクロールバー付きブロックと言うシンプルな構造のわりにいい動きをする。特にedge。edgeのスクロールはもっさり感があるものの滑らかだ。
　こんな感じでスクリプトを駆使せずハイパーテキストの持つ機能に頼る方向へどんどん流れて行っている。最初の試作品では無地のボタンにスクリプトで文字を表示させていたが、特に詳細＆戻るボタンなんかはただのアンカーリンクに成り果て、それならば背景画像にテキストを重ねる方式よりも一枚の画像をリンクシンボルに使う昔ながらの方式の方がシンプルオブベストだと判断、それに伴い無地のボタンから文字入りのボタンに作り直したり。昔から使えた基本的な機能に頼った話をした直後に言うことじゃないが、HTML自体が進歩してるから単独で色々やれるようになってるよな。スタイルシート無しじゃ何にも出来なくなってもいるけどさ。
　スタイルシートと言えば、今の所Edgeでは思い通りの表示が出来てるが、Firefoxだと少しずれてるというか潰れてるんだよな。こういう場合は大体スタイルのどれかが微妙に間違ってるんだけど。編集作業に主に使っているのーパそにはFirefox入れてないからテストが出来ないんよ。入れんといかんわ。
　スタイルシートでも、スクロールの挙動でもそうだが、EdgeとFirefoxはページ読み込み時の挙動も違うんだよな。具体的には、ページに飛んでから実際に表示される時のプロセス。
　Edgeは初期ジェネレートのスクリプトが一通り済むまで表示が行われず、もっさり感が半端なくてちゃんと動いてるのか不安になるが、それが終わればきっちりと表示される。Firefoxはリアルタイムで少しずつ表示されていくので、今ページを生成しているなってのが目に見えて安心だが、最初にアンカーで設定した位置より上の方でページに変更が加えられると表示がずるずると下にずれて行ってしまう。
　これがEdgeで問題なかったのでそのままGOを出したらFirefoxで悲惨なことになっていた例その2か3だ。下が切れるので操作の主軸になる証拠品/人物切り替えボタンや詳細ボタンが押せずに面倒だ。スクロールバーも隠してないし、隠したとしてもマウスのホイールをくりくりすればいいんだけど、その辺に気付かない人もいるだろうしな。
　これに関しても雑な対策を講じることにした。実に簡単。メイン部分の上と下にメイン部分へのアンカーリンクを配置するだけ。このリンクをクリックするだけでベストなポジションに移動する。まあ、もともとアンカーの場所に移動したら後からアンカーの方が動いちゃったって話なんだから、またアンカーに移動しなおせばいいというだけの話だ。
　ひとまずその準備だけは済んだ。アンカー置くだけだしな。リアルじゃKIEF更新近いし、そのついでに直すことにする。あとはさっき書いたスタイルシートが怪しい件と、画像リンク方式を使ってない一部のボタンにカーソルを載せても見た目に何の変化もなく押せるのかどうか分かりにくいので、できればフラッシュみたいにボタンが光るように、最低でもスタイルシートでマウスカーソルを指カーソルに変えてやればクリックできるのが分かりやすいはずだ。それだけやったら一区切りにする。