今天完成的事情：

1.推进任务。流程界面

明天计划的事情：

1.处理流程界面

遇到的问题和收获：

1.关于状态机的写法。看了一个红绿灯的例子，开始尝试

首先列出了流程顺序。

var stage = new StateMachine({
    init: "step1",
    transitions: [
        {name: "kill", from: "step1", to: "step2"},
        {name: "ghost", from: "step2", to: "step3"},
        {name: "speak", from: "step3", to: "step4"},
        {name: "vote", from: "step4", to: "step1"}
    ],

methods: {

    onKill: function () {
        console.log(stage.state);
        if (stage.state === "step1") {
            $(".behavior").eq(0).addClass("over");
        }

    },

    onGhost: function () {
        if (stage.state === "step2") {
            alert("亡灵发表遗言");
            $(".behavior").eq(1).addClass("over");
        } else {
            alert("按照顺序，请杀手杀人");
        }

    },

    onSpeak: function () {
        if (stage.state === "step3") {
            alert("玩家依次发言");
            $(".behavior").eq(2).addClass("over");
        } else {
            alert("按照顺序，请亡灵发言");
        }

    },

    onVote: function () {
        if (stage.state === "step4") {
            $(".behavior").eq(3).addClass("over");
        } else {
            alert("按照顺序，请玩家发言");
        }

    }
}

然后是方法。后面开始调用。

$("#killer").click(function () {
    stage.onKill();
    stage.state === "step2";
    window.location.href = "../js-2-6/js-2-6.html";
    sessionStorage.setItem("processState",stage.state);
});

这里写法实现效果不对。需要修改。没实现点击后变色进行下一个流程。

再看看吧，这东西并没有太多心得可写。没吃透。