基盤：また+10000が近づいて来ました。
基盤：前回50000祭りは9/16、GShell歴0.4.3の日でした。
開発：測ったように3週に一度ですね。
基盤：今ではすっかり秋になりました。
社長：今回の記念改訂は何にしますかね。
開発：前回はシングルカラム表示ボタンを入れました。
基盤：結局シングルカラムではなくて、サイドバー縮小になりましたけどね。
社長：画像の表示チェックとかに時々使ってます。でも、やっぱりシングルカラムというか、本文だけで幅100％にしたいと思うことが多いです。
開発：サイドバーというかセカンダリセクションを切り離して別レイヤにするのが良いかもですね。スクロールを分離して位置固定メニュー化する。
社長：それにしましょう。
開発：またぞろfunctions.phpのPHPでセミコロンを打ち忘れてサイト全体が止まるのも嫌ですし、この際に全部JavaScriptにしたいと思います。GShellにもサイドバーを入れようかと思っていますので、GShellで作って動作確認して、出来上がりをWordPressに張るだけ。追加CSSの分も面倒なので、まとめてGShellでやりたいと思います。
悪路BAD
基盤：そういえば昨日の0.6.0がアーカイブされてないです。
社長：ブログもまだクローズしてませんでした。あー。あれ？AcrobatがコードのPDFを開いてくれませんね…
基盤：1万行を超えたのが何か影響しているのでしょうか？
開発：とりあえずAcrobat終了しましょう… あれ？終了もしてくれません。
基盤：アクティビティモニタで見ると、なにやらAdobeが編隊飛行してます。
開発：CPUを食っているわけではないですね。何かにけつまづいてるんでしょうか。とりあえず全部Kill。あーでもなんかすぐ生えてきますが。
基盤：ひとんちのPCに勝手に巣を作りますよね。
開発：Adobeがクラウドサービスだなんてなんかの悪い冗談かと思います。
社長：では昨日の分に署名してアップロード。やれやれ。まあ、PDFに自力で署名するようにして、おさらばですね。来年の契約は無いでしょう。
社長：うーん、やっぱりMacMiniのGoogle IMEは使いやすいですね。iMacもGIMEにしようと思います。
現状調査
開発：さて、インスペクタで見ると、TwetySeventeenのページ構造はこうなっています。
社長：これ、body のクラスから has-sidebar を落としたら、シングルカラムになるんじゃないですかね。
開発：そうですね… CSS的にはそれが一番整合した表示にしてくれそうな気はします。
開発：ただちょっと、生きてるDOMからクラスを外すというのもなかなかドラスティックな感じはしますが… やってみましょうか。インスペクターでエレメントを表示。
開発：Edit Attributeでクラスを抜く。
基盤：インスペクターは偉大なり！
開発：だけど max-width を調整しなおしてくれるわけでは無いように見えます。
開発：あれ？完全に骨抜きになってますかね。
社長：なんだかよくわからないですね。Firefox でギラギラさせてみましょうよ。
開発：ではFirefoxにて… まず通常状態。
開発：そして has-sidebar クラスを削除。
開発：サイドバー有りの状態と比較。
社長：マージンとかパディングとかがどう影響してるのかよくわからないですね。
開発：ではこれ以上大きくならないとこまで拡幅… 58％で524px が最大です。
基盤：524 / 0.58 ... つまり、相続されてるのは 910pxですね。
開発：一番外側から追いかけます。まず、ウィンドを大きくして、、、最外殻 1100px で。
html 1100px
body 1100px
div #page 1100px
div #site-content-contain 1100px
div #content 1100px
div .wrap 904px
div #primary 524.317px (904 x 58%)
div #secondary 325.433px (904 x 36%)
開発：次に has-sidebar を外して。
html 1100px
body 1100px
div #page 1100px
div #site-content-contain 1100px
div #content 1100px
div .wrap 904px
div #primary 740px
div #secondary 904px
開発：この場合の 740px というのは、TwentySeventeenの style.css で、サイドバーが無い場合の投稿記事の表示幅として指定されています。
社長：なるほど。状況はわかりました。
改造作戦
開発：さて、どういう作戦で行きましょう。
社長：私の要望は2点です。
- 要望
- サイドバーを画面に固定して独立スクロールできるようにする
- 各種サイズ等CSSパラメータはユーザが設定できるようにする
開発：そうですね。ではまず、サイドバーを画面に固定。これは #secondary.style.display を fix か何かにしてやれば良いと思います。えい！
開発：あれ？効きませんね。display:none; は効くんですが。
社長：基点が違うのでは。
基盤：そんな display の値は無いってインスペクタが言ってますが。
開発：ああ、display じゃなくて position でした。では、position:fixed; で…
全員：おおーっ。
開発：primary とかぶるの位置をずらしましょう。left:500pxくらいで…
style="position:fixed;left:500px;top:0px;z-index:60000;"
基盤：第一関門クリア。
開発：なんだかとても作業効率が悪いのですが。
基盤：スタイルエディタとか使ってみては。
開発：これかな。。。＋でスタイルを追加します。おー、ファイルに保存できたり、有効化・無効化ができるんですね。オートコンプリートもしてくれるし極楽極楽 (^-^)/
基盤：相変わらず色使いが。
開発：志茂田景樹か林家ペーパーですね。
社長：これ、要するにクライアントサイドCSSですよね。デフォルトで読み込めるようにできるんでしょうか？
開発：わからないですが、ダメっぽいような。それはともかくたたき台です。可変にしたい要素はこういうところかと。
社長：「たたき台」はよい言葉ですね。我社のワークおよびプロダクトのあり方にぴったりです。今日の一句。
たたき台
開発：五月雨をあつめて早したたき台とかですかね。
社長：形容の部分はいかようにも。
営業：一般には非売品ですよね。
開発：研究所という組織のプロダクトは一般にたたき台です。ハッタリかましてマスコミと役人に売りつけるｗ
基盤：英語ではなんていうんでしょう。
開発：プロトタイプとかアルファバージョンとかですかね。
社長：サイドバーがスクロールできないようですが。
開発：それなんですが、プライマリのほうはmainというのが一旦噛んでてそれをスクロールできるんですが、セコンダリのほうはいきなりウィジェットがべたべた並んでるもので。プライマリとセカンダリは道連れにしかスクロールしないという思想なのではないかと。
社長：セカンダリの上に親を作って#contentとの間に噛ませますかね。
基盤：TwentySeventeenをいじるんでしょうか？
開発：いや、JavaScriptで動的にやってやれば良いかなと。ただ、どうもブログ記事の中のカスタムHTMLからsecondaryが見えないんです。
社長：まだprimaryの中にいて、secondaryが出来てないのかもですね。
基盤：load完了イベントを拾って実行するようにしては。
開発：やってみましょう…
開発：ぴんぽーん。正解でした。
社長：このページはデフォでこのスタイルにしちゃいましょう。
開発：たまには緑を使ってみようかと。
社長：賛成。でも、眠くなってきてしまいました。
開発：昨日のスイカでも食べましょうか。アマゾンで買った皿に載せて。
基盤：明石焼きでしたっけ？
開発：いや… 美濃焼ですね。
社長：いい仕事してますよね。
基盤：大量生産ロボットでしょうけど。
社長：一般に機械的な作業ではロボットのほうが良い仕事をします。
開発：デザインは人間がしたんじゃないですかね。
社長：種無しスイカとか流行らなくなりました。
開発：味と両立しないんでしょうかね。
基盤：スイカにはこのタネが無いと。ぷっ。
社長：目の覚めるようなBGM無いですかね。
開発：夢は未来への道… あれ、音が悪いですが。
基盤：フィリップス君が鳴ってますね。iMacで開きましょう。
開発：夢は終わり無く始まる♪
社長：世界には幸せが似合うよ♪
基盤：希望の鍵で解き放て！
＊ ＊ ＊
開発：ふうぅ… なんとか単独スクロールするサイドバーができました。
開発：もちろん、リサイズもできます。
社長：要件１クリアですね。ユーザがサイズを変えられるようになったので要件２も最低限クリア。
基盤：これって、サイドバーと本体がオーバラップしないで押したり引いたりするモードも欲しいですね。
社長：そもそも本文については、上限の高さも選べるようになっていると良いかと思います。
開発：まあそのへんは、Wirtual Desktop のほうでやりましょう。
基盤：それにしても、もはやTwentySeventeenじゃなくなって来ました。
＊ ＊ ＊
社長：もう眠くて…
開発：私だって寝てないんです！
基盤：あと少しです。
開発：緑対青の対決ですね。
社長：私らが子供の頃は本当に信号は緑だったんですよね。何故青と呼ぶのか、私も不思議だったんです。
社長：気が早いですが、次回７万祭りの出し物は、キリ番監視ロボットにしましょう。定期的にリロードして、カウンターの値が変わってたら画面を保存する。
開発：まあ、それだけなら簡単ですね。
基盤：カウンターのプラグインからブロードキャストして貰えばいいんじゃないかと思いますが。
開発：まあ、サイトの運営をやってる場合にはそれが簡単ですが、一般のブロガーがそれを出来る立場にいるかというと、普通はエンドユーザですからね。
社長：この件に関しては、わざと靴底から足を掻く技術が面白いんだと思います。
開発：それに、単純労働はロボットに任せれば楽ちんという実例でもありますね。
基盤：今日は GShell 開始以来はじめて、コードに全く手を触れない一日でした。
開発：いや、参考のためにコードを覗きはしました。基本的に、自分が使いたい機能とかは全部あの数千行の中に利用例として凝縮しているので、調べるのがとっても楽です。
社長：grep は偉大なり。
開発：スコープが行単位に縛られてるのがどうかなという所はありますけどね。行をまたがる検索とか、検索結果を全文検索エンジンみたいに表示してくれればと。diff -c 程度で良いですから。
社長：だからそれを自作しようという話でしたが。
基盤：grep の結果を HTML で吐こうという話でしたが。
社長：使い方によっては出力がアーカイブファイルにもなるという話でした。はぁ形式の。
開発：もうやりたい事が50年分くらい堆積してしまいました。
基盤：下のほうは泥炭化が始まってそうですね。
開発：それにしてもこの、コンテンツの表示サイズなんですが、全部比率で表せると良いなと思います。例えば画像とかはとっても楽ちん。
開発：ですが、テキストのフォントを比率で表すことが出来ないように思うんです。1ページに何文字とか、非常に良く使われるサイズ指定方法だと思うのですが。入れ物のエレメントに横80文字とか指定したいじゃないですか。なぜ出来ないんでしょう？
社長：ズームと言うか、スケールを使うんでしょうかね。JavaScriptでイベントひろって計算して。
開発：表示に関してはCSSだけで出来るのが美しいと思うんです。
基盤：本当に無いんでしょうか。
開発：錦織の全仏も終わっちゃいましたしね。…あっ。
社長：この配色は面白いですね。
開発：なるほど。
基盤：xso には絶対真似できない色使いですねｗ
基盤：あと20。
社長：あと1時間くらいですかね。何かもうひとつ芸を足すとか。
開発：気力がございません。
社長：というかこの、実家から送って来てくれたお酒はなかなか美味しいです。なにかつまみを作りましょう。
開発：そういえば先日、我社における6大ブラウザの席次を決定したという記憶があるのですが。
社長：Edgeをどこに置くかですね。
基盤：後から来たのに親の七光りで偉そうみたいな。
開発：鳶が鷹を生んだとか。
社長：カッコウの卵じゃないですかね。
開発：こうやって並べてみると、上段右のOperaが何か仕様の理解を間違ってるのでは無いかという気がします。
基盤：これ、全ブラウザに一斉にリロードさせるように、GJ Linkでコマンドかキーイベントをブロードキャストすると良さそうです。
開発：ですね。
基盤：あと3。
基盤：あと1。
基盤：ただいま到達しました。
開発：最後の1つに10分くらい掛かりましたね。
社長：やれやれです。
基盤：撤収前に60006をパチリ。
-- 2020-1006 SatoxITX
#EndOfPost