概要っぽいの

温泉発火村とは

温泉発火村とは 温泉でハッカソンしようぜという企画です。まーまー普通のハッカソンです。 ノートPCが持参出来ればだれでも参加出来ます。

温泉でゆったりしつつ美味しいものを食べつつわいわいもくもくハックしようぜ！ってイベントです。

会場について

今回の会場は山木旅館（静岡県熱海）という旅館で、なかなか良い感じでした。あとご飯が美味しかった。ご飯が美味しかった。（大事なことなの(ry

ふりかえり

ご飯美味しかったなぁ・・・お昼ごはんに食べた「あじなどんぶり」。味のぬかづけ？だったろうか、臭みもなくてでも鯵の味がしてて、程よい香りがついてて、一杯では物足りない感じだった。

・・・って考えてるとご飯が美味しかったコトだけで記事埋めちゃうのでこの辺はコンテンツ力ある方々におまかせして。僕は淡々と作ったものの話をしますよ。

成果物

https://github.com/rymizuki/Heimdall

Heimdal!! キラキラネームを採用したjQuery,Zeptoで使えるFormValidatorモジュールを作りました。もともとbackbone-validatorというBackbonejs用のValidator書いてたんですけど、弊社開発二部のチャンネル内にて「それBackboneに依存しなくてよくね」ってツッコミもらったので、underscorejsの依存を外して$系とネイティブコードを使ったValidatorに書き換えました。

SYNOPSISとしてはこんな感じ。

// validatorのインスタンスを生成
var heimdall = $.heimdall({
    "name"    : ["required", ["length", [1,  32]]],
    "age"     : ["required", "int"],
    "gender"  : ["required", ["select", ["male", "female"],
    "message" : [            ["length", [0, 256]]]
});

$('.form')
  .on('submit', function () {
    var result = heimdall.validate({
      "name": $('#input-name').val(), // みたいな感じでフォームのデータを{name: value, }でvalidateに渡す
      ...
    });
  
    if (result.has_error()) { // エラーがあったら ...
      $(this).trigger('invalid', [result]); // エラーだよってイベントのトリガ発火するとか。
    }
  })
  .on('invalid', function (e, result) {
    // エラーを表示するなり、アラートを出すなり、リダイレクトするなり。
  });

みたいな感じでバリデーションに特化したモジュールになっております。ちょっとJSの流儀であるところの命名規則とか、jQueryの公式が出してるpluginのフォーマットに沿ってない、とかもろもろ後になってから気づいたんだけど。

特にdisが飛んでこなければ僕の好みのままで放置しようかなと。

今後の予定

・・・とは言うものの、jQueryのフォーマットには沿わせようかなと。配布の仕組みとかよくしらないし。
@gfx さんより「キーアップ等のイベントに連動して特定のinputだけvalidationしたいケース」という宿題を提示してもらったので直近のTODOにする。

今回の困ったこと

唐突に僕のpocketWifiが初期化されパスワードがわからず @kfly8 の無線LANを借りる事になった。事故にも程がある
電源コンセントが辛かったのでタコ足持って行くと良い。
testemをgrunt-testemからではなく直接叩きたかったがディレクトリ構造の解決がうまくいかず数時間testemの調査で終わってしまった。
温泉が気持ちよすぎて、ご飯が美味しすぎて、満足感に浸りすぎて作業にならない

今回の学び

熱海素晴らしい
熱海のご飯は実に美味しい
- 山木旅館さんは山木茶屋という食事処を併設してて（そこでお昼食べた）そこのご飯も実に、実に美味しかった。　　* またいきたい
grunt-init jquery jsプロジェクトのひな形はコピペで済ましていたんだけど、やっぱりジェネレーター使うべきだなって思った。
$.expr[':'].heimdall jQueryの拡張セレクタは、実は好きに定義することが可能。
Zeptojsには拡張セレクタが無いので、DOM操作周り気をつけないとjQueryでは動くけど、Zeptoだと動かないプロダクトが出来上がる。
- 拡張セレクタが使えないのは結構大きい気もするけど、Form操作がそんなに無いなら大体querySelect系でなんとかなる気もする。
海楽しい

まとめ

Heimdallというバリデーション特化ライブラリを書きました。
熱海最高
山木旅館飯が美味い
温泉発火村はやっぱり最高だぜ！

のらねこの気まま暮らし

技術系だけど、Qiita向きではないポエムとかを書くめったに更新されないヤツ

温泉発火村 #2 に参加しました #発火村