Make a note of it: Web tech, montaineering, and so on.
こんちわSig.です。今回は第29回Sugamo.cssで発表したネタ。スライド出せば良いや−、と思っていたのだけど@soh335がピュアな視線で訴えてくるので、重い腰を上げてBlog記事にしてみることにしました。
さて、Vimにおいて多数のファイルを対象に検索→置換する場合、だいたい２つの方法があります。
:argdo %s/FooBar/BarBaz/gce | update:bufdo %s/warnings/warningssss/gce | update順に、引数リストを使う方法、バッファリストを使う方法です。:bufdoの類似で:tabdoとか:windoとかもありますが、まあ使うとすればこの辺でしょう。これらに関しては、過去の記事でも書きました。複数ファイル置換の定番というか王道というか、普通は:argdo使いますよね。ただ、この方法には個人的に以下の問題点があります。
けっこー前の話ですが、Sugamo.vimってのやりました。その3回目で軽く話したスライド、のURLをメモっておきます。参加者はthincaさんみたいなマスタークラスにも来て頂けましたが、初心者ユーザも相当数おりました。で、事前に「ダウンロードから教えてくれ」とあったのでそのようにした。このスライドは、そういうレベルです。あしからず。LT用だから薄いし軽いし。
これだけってのも難なので、Vim環境の構築メモも置いておきましょう。
まず、俺の環境は以下。あんまり弄っていない。
エントリ書いても流れて忘れそうなので、ブログパーツに義援金リンクを張っておくことにした。サイトのよく見るとこ(ウチの場合はUpdate)に貼っとけばOK。
まあ絵心ないのでサクッと作ったやっつけだけどね。そこは大きな問題じゃないよ。
シンプルな赤十字ロゴはこういう時に良いよね。
はてブより、赤十字ロゴは任意で使えるものではなかったりします。 http://www.jrc.or.jp/about/mark/
ということで訂正しました。さすが安定のvantクオリティ。thx!
1年以上前のSugamo.cssで出したネタ。もうちょい纏めてから出そうと思ってたけど、いつまでたっても手を付けられないうちに風化しだしてきたから、えいやっと張るだけ張ってみることにした。（サンプル）
何をやっているかというと、まあつまり、本文組の行間サイズで全部揃えてみたら心地良いリズムになるんじゃね？という実験。当然、毎回手動で各要素をpx調整するのはクールじゃないから、あらかじめ<p>とか<pre>とか<blockquote>とかにルールを設定しといて、テキスト流し込むだけで良い感じにならないかなー、と。
まあ結論としては、「こんなのWebじゃねぇ」といった感じですがね！ 仕事なら、こういったことはデザイナさんが考えるべきだろうし、そこまで決められるなら自分でやった方が速いだろうし、そもそもそんな余裕のあるプロジェクトなんて稀じゃね？ そこまで詰める時間があれば、もっと面白いコンテンツで埋めろよ、というのがWebだよなあ。
個人ブログとか、フルスクラッチでコーディングから作れる実験サイトみたいなんなら活かせるかなー、といったところ。
Note: Chart APIは現在ではGoogle Chartとして整理されており、この記事で利用されているImage Chart APIは旧仕様として削除対象になっています。実際に削除はされていないので今のところ利用できていますが、2015年中には消えてしまいそうです。(2015-08-31)
JQueryプラグイン書いた。そう、最近ようやくJQuery使ってるんですよ。
まあ仕事でJS触る機会ってのもなかなかないのですが、そろそろ慣れとかないとSugamoでぼっちになりそ(ry。
さて、GoogleChartAPIでは<img>のsrc属性にパラメータ入れてリクエストする訳ですが、パラメータが長くなると無視られたりする。そうした場合には、データ部分をエンコードして短くしてやれば通る。今回つくったのは、データ値をエンコードしてsrc属性に追加するスクリプトです。構造はちょっと前のSugamoでずどさんに教えてもらった$.widget風味。こんな感じ。
$('#contents img#googleChartApi_1')
.gcaEncoding({ maxVal: 100 })
.gcaEncoding('extendEncode', [50,75,100,100,100, ... ,100] )
.gcaEncoding('extendEncode', [50,75,100,100,100, ... ,0] )
.gcaEncoding('extendEncode', [25,50,75,100,75, ... ,0] )
.gcaEncoding('extendEncode', [0,0,0,0,0,0, ... ,0] )
;