サイトのヘッダとフッタ分割

タイトルこれでいいのか悩む。
うちのサイトではページの上部にメニューがあって、こいつはどのページでも共通する部分。
だから変更を加えると全ページに渡って変更作業をしなきゃいけなかったのね。
そこで、ここだけ独立して管理して、あとから他のページに貼付けるようなことができないかなーと常々思ってたわけです。
(ちょっと紛らわしいけど、ここで言うヘッダってheadタグじゃなくてメニュー含むそれより上部に記述してある部分だと思ってね。)

当然PHPだわな…。

というわけでいろいろググってみたんだけど、どれもしっくりしない。
インラインフレームを使う方法なんかはもう前時代的だと思うしやりたくない。
ソースが外部にあるからSEO的にもよろしくないしね。
他にももろもろあったけど、いろんなデメリットを抑えられる方法が…PHPっすかー。
まあ予感はしてたけどね。しかし忍者ホームページさんは残念ながらサーバサイドのアプリは使えない…。困った。

しょうがないからオフライン環境でなんとかする方法を模索。
最初はド正直にcatコマンドとか使って本当にそのまんま分割htmlファイルを繋ぎあわそうとか思ってたのね。
でもこれにはひとつ問題点があったのよ。
うちのサイトで言えば、現在開いてるページはメニューのデザインが変わるようにしてある(ボタンが押されたような感じ)。
開いてるページに対応するli要素に、デザインを変えるためにクラスを設定してるわけ。
つまり、完全にはメニュー部分が全ページで一致してないのが問題として残っちゃう。

m4とMakefile

この時点で３時間ぐらい粘ってたんだけど、ついに解決法を発見。
watanet Personal Side-C
プリプロセッサでHTMLファイルの生成 – m4 Makefile html
まさに同じことで悩んでる人を発見！

詳細はリンク先を見てくれれば分かるけど、
m4とやらはテキストファイル厨に別のファイルの内容を挿入したり、
とある文字列を別の文字列に置き換えたりする機能をもってるそうで。
変数の宣言っぽいこともできるらしい。

これらの機能のおかげで、まず各ページの上部にメニュー部分を外部ファイルから挿入することができるようになった。
そのとき各ページによって変数の値を変えることで、先ほどの問題もクリア！

おまけでMakefileを使えばmakeコマンド一発で全ページ自動生成だよ！
いたれりつくせり。これは便利。

m4の概要を理解するのに1,2時間かかったり、
Makefileの記法(自動変数ェ…)を理解？するのに２時間ぐらいかかったり結構手こずっちゃったけど、相応の価値はあったね。

なにはともあれこれで目的は達成できた。
ほとんどないけどフッタの部分もついでに外部ファイル化。
あとmetaタグで更新日時を自動設定できるようにとかしてみた。
あとで入れようと思ってるjQueryの導入も一文書くだけで済むようになったじぇ。

唯一気になるのはemacsでのインデントが崩れちゃうことかな。
最終的に統合したhtmlを作った後にindent-regionをかける方法が分からなかった。
誰か知ってたらおしえてくだしゃー。

Minecraftを1.4.2にアップデート

マイクラのうpでがきてたので1.4.2に上げてみた。
クライアントだけじゃしょうがないので友達に頼んで鯖のほうも上げてもらった。

変更点は他のところで嫌ってほど見れるので割愛。
自分的には金床が一番嬉しいなあ。
EfficiencyIVの鉄ピッケルが捗りすぎてやばかったんだけど、
UnbreakingIIIつけててもやっぱり壊れるので、これを常用できるようにしたいなあ。

あとは石柵も建築指向の自分としては嬉しい。
階段ブロックの調整とか、うpでする度に建築に嬉しい変更が多くていいね。
画像は適当に石柵で遊んでみたところ。

うpでする度に今まで言ってない所に行かないと、新verの要素が見れないのは残念かな。
特に1.3のときにがんばって村と山岳地形探しした手前、もうダッシュで新天地探すのはしばらくいいやって印象。

まだまだMODが揃ってないので本格的にはいじらないけど、
ビーコンとかおもしろそうな機能がいっぱいでたので楽しみ。

EWI-USBでリトバスED「Alicemagic-Rockstar.ver-」吹いてみた

今回はアニメもやってるし調度いいやーと思って「リトルバスターズ!」の「Alicemagic」を吹きました。
正確にはRockStarバージョンだね。

ひさびさの録画で割と緊張してるw
吹き出しちゃえばあんまり気にならないんだけど、
やっぱり吹き始めは固い気がするね。

EWI修理にやってから違和感があったけど、ようやく吸収できたっぽい。
ビブラートが思い通りに吹けることが多くなってきた。これは良いね。
緊張の性でいくらかビブラート抑えめだけど、練習時とかはもっとキモイぐらいにビブってるw
ビブラートとピッチベンドを使いまくってぐにゃぐにゃ吹けるようになるのが目標。

今回やっちまったのは、あまりにノリノリすぎて顔映っちゃったこと…w
吹き直すのもアレなんで、動画編集でなんとかならんかなあと試行錯誤。
ここで難航した。
というのもiMovieは基本的にはappleが想定したテンプレどおりにしか作れない。
まあテンプレ通りになるから素人が作っても見れるものができるのが良い。
しかし黒ベタで隠すとか、そういう簡単な処理もついてなかったりする。

ここで別の編集ソフトをいじくってみるが…めんどくさい(´・ω・｀)

しょうがないから、よくニコニコの弾幕で流れてくる黒い四角形の文字で隠すことに。
だが、やってみると微妙に上部数pxが隠せなくて見栄えが悪い…。
フォント変えても大して改善しないしどうしたもんか。

とか考えてる時に、画面中央に切り取りボタンを発見。
これで顔が映ってる上部を入れないように切り取ることでうまくいきましたとさ。
……２番歌のサビでだいぶあやうかったりするけどｾﾌｾﾌ。


とまあ今回のEWIはこんなかんじ。
大腸炎のせいで大分時間があいてしまった…。
連日ずーっとテイルズ(TOA)してたせいもあるんだけどNE。
jQueryも中断してたし、これ以上のクズっぷりは見せないようにせねば。
大腸炎のほうは痛む時期と痛くない時期がまだ混在してる感じ。
ちょっと前にもっかい医者に行って軽く強い薬を貰ってきてからはまだマシっす。
はよ治したい…(´；ω；｀)

ニコニコ静画で素早く画像を保存する方法

友達から「ニコニコ静画で画像保存できぬぇ！」っとか言われたのでいろいろ調べてみた。
先に結論から言うとFireGestureにCtr+Sを設定するだけっす。

とりあえず普段使ってる方法を試そう、
ってことでFireGestureさんの「画像を今すぐ保存」でやってみた。
ニコニコ静画はpixivと似たようなもんで、画像をクリックすると拡大画像(原寸)が別タブで開く感じ。
この拡大画像を開いた状態でジェスチャを働かせてみる。
ところが保存されたのはなぜかhtmファイル…。
試しに開いたらFirefoxがクラッシュしました(´・ω・｀)

情報を見てみるとなんか容量がMBクラスのファイル。
つまり、拡張子がhtmになってるだけで、実態は画像なんだねこれ。
拡張子を「jpg」とか「png」に変えればちゃんと見れるようになる。

が！これではめんどくさい

わざわざ拡張子を変えるなんてのは、「素早く」という主旨から離れてるよね。
というわけで別の方法を模索してみる。

今度は「[ハイブリッド]名前をつけて保存」ジェスチャーでやってみる。
すると、ちゃんと「jpg」の拡張子がついて保存されるではないか！
……が、「png」だとまたしてもhtmファイルが保存されてしまう…。惜しい。
最近は高品質のpng画像が主流…ってほどでもないけど、割と多いしなんとかしたい。
もうちょいがんばってみる。

さてさて今度はブラウザ側で「Ctr+S」を叩いて保存を試みる。
すると…「jpg」も「png」もちゃんと分類されて保存ダイアログがでてきた！
あとはenter押すなり、「保存」をクリックするなりすれば任務完了だ。

もう少しだけ早めてみる

ここまでくると欲が出るもので、もう少しだけ手間を減らしたい。
「Ctr+S」をFireGestureに登録したいなあなんて思ったり。
そんなことを察してか、友人がこんなページを見つけてきた。
キーボードショートカットをFireGesturesに登録する:右京web
どうやらこれのソースをちょっといじればいけそう。

コードそのものを書くとグチャグチャになりそうなのでポイントだけ書いていく。
ちなみにwin用。

• //holds shift key のとこの値を「false」に
• //presses a normal key のとこを「evt.DOM_VK_S」に

これでおk。
マカーの人はコマンドキーが「Meta key」にあたるようなので、
「Ctrl key」も「false」にして、「Meta key」を「true」にする。

これでようやくマウスでササっと保存ダイアログがでてきて、保存できるようになりましたとさ。

ダイアログすらかっとばしたい人は自分でがんばってくだしゃー(´・ω・｀)
強制的に拡張子をjpgで保存するようにーとかも考えたけど、
png画像のときがうまくいかないだろうし、ここらへん結構めんどくさそう。

にしてもこのジェスチャーにショートカットあてる方法、他にも使えそうね。
URL先の人も言ってるけど、他のアドオンでショートカットが当てられてる場合とかに使うといいんじゃないですかね。
Firebugさんをサッと呼び出す、とかできそう。

EWIのベンドとバイトセンサーは内部的には同じ出力？

garagebandで気まぐれに録音してたらこんなのを発見した。
画像の谷(青枠)の部分が右手親指のベンドでしゃくってるところ。
波(緑枠)の部分がバイトセンサーでビブラートかけてるところ。

どうやらEWIはベンドもバイトセンサーも一括で「ピッチベンド」とやらで出力してるっぽいね。
garageband(というかIFW)はそれを受け取って音程の上げ下げをしてると。

データ点の個数がすごくたくさんに見えるけど、このくらいないとズレを感じるのかな。



とまあそんな感じで、EWI(garageband)の動作がちょっと分かる発見でしたとさ。

JavaScript勉強中

いやーおもしろいねこの言語。
やっぱり視覚的になんかしらのアクションがあるとプログラミングは楽しいや。

参考にしたサイト様はドットインストールさん。
レッスンの各工程を３分以内で細かく刻んで進めていくサイト。
原理とかはちょっと分かりづらいけど、とにかく書いてみるか！って人にはピッタリかと。

んで、今参考にしてるのがRe:Creator's Kansaiさん。
こっちもとりあえず書いてみるかって感じのサイト。
(自分がそう使ってるだけかもw)
タブパネルとかひとまずの目標にしてたのでちょうど良かった。

css勉強した時にdisplay要素って本当に使うのか？とか思ってたけど、
JSだとこれがキモなんだなあと分かってきた。
display属性のnoneとblockを切り替えることでダイナミックな動きのあるウェブサイトが作れるのね。


長いことHPのほうを放置してるのでそろそろ手を加えたいのです。
で、ちょろっとJS(jQuery)でオサレなことしたいのよ。 がんばる。

[Minecraft]崖の家建設中

たまにはマイクラでも。

こんな感じで山岳地帯の崖に家を建ててる。
内装はこんな感じ。

1.3.2で追加された横向き原木とか、色違い木材パーツやらを結構使ってます。
階段は奥に見える階段はこんな感じになってて、

2階(屋根裏)と地下？(床下？)に続いてます。
2階はエンチャ部屋にしようかなと思ってるけどスペース足りないかなあ。

床下はこんな感じになってて倉庫にしようと思ってるけど、
やっぱりスペースが足りない印象w
両開きドアの回路とかが結構スペースを食う要因。
ちなみに支柱はジャングルの木。

奥の柵が見えないとこはさらに階段があって、
地下２階？(床下下？w)に続いてます。

今思うと階段急だなあ…半ブロックに変えることも検討しよう。
このスペースは何に使うかは未定。
なんかおもしろいものができればいいな。


さてさて腸炎のせいでまともに外出もできないので、
家でマイクラかelonaする日々です。
特にelonaのほうは金策が稔りだしてうまうましてるので結構中毒になってるね。
しかしこのままではBlenderもJSもいじらなくなってしまう…あばばb
とりあえず体調優先にしつつ遊ぶにしても時間を無駄にしないようにしたいね。