tiny dots

裏方の日々

2014年4月3日(木)

本日のよしなしごと

11時頃起床。コーヒーとパンで朝食。外は雨、桜が散らない程度に収まればいいが。。今日は自宅作業にしておいたので、一服後にゆっくり作業開始。今やっているフロントエンド構築に合いそうなフレームワークを物色する。AngularJSやBackboneJSを使うには小さすぎるし、jQueryだけで収めるにはステートが多い。ふとステートマシンを思い付いてググると、javascript-state-machineというまあまあ良さそうなのを発見。状態を抽象化したオブジェクトが無いのがいけてないけど、ひとまず導入完了。各ステートをAMD形式のモジュールで定義しつつRequireJSで読み込んで使う方法に落ち着いた。↓に書いた感じ。23時くらいまで作業して本日は閉店。アナ雪のサントラを4ループくらい聴いては涙ぐんだりしていた。

requirejs.config({
  baseUrl: 'js/libs',
  paths: {
    'statemachine': 'state-machine.min'
  }
});

require(['statemachine'].concat(states), function(StateMachine) {
  (window.app = window.app || StateMachine.create({
    events: [
      { name: 'start', from: 'none', to: 'state1' },
      { name: 'next', from: 'state1', to: 'state2' }
    ],

    callbacks: {
      // イベント用イベント
      onbeforestart: function(event, from, to) { ... },
      onstart: function(event, from, to) { ... },
      onbeforenex: function(event, from, to) { ... },
      onnext: function(event, from, to) { ... },

      // ステート用イベント
      onstate1: function(event, from, to) { ... },
      onleavestate1: function(event, from, to) { ... },
      onstate2: function(event, from, to) { ... },
      onleavestate2: function(event, from, to) {
        // 非同期な遷移も可能
        var to = setTimeout(function() {
          clearTimeout(to);
          app.transition();
        });
        return StateMachine.ASYNC;
      },
    }
  })).start();
});

今日の何か

為末、挫折、自分を許す事、を語る - Togetterまとめ

為末氏の洞察にはいつも頷いてしまう。