!(function () {
    var ToDoListHeader = BI.inherit(BI.Widget, {

        props: {
            baseCls: "my-todolist-header"
        },

        render: function () {
            var self = this, o = this.options;
            return {
                type: "bi.horizontal_auto",
                items: [
                    {
                        el: {
                            type: "bi.left_right_vertical_adapt",
                            width: 600,
                            height: o.height,
                            items: {
                                left: [
                                    {
                                        el: {
                                            type: "bi.label",
                                            cls: "my-todolist-title",
                                            text: "FineUI ToDoList",
                                            height: o.height
                                        }
                                    }
                                ],
                                right: [
                                    {
                                        el: {
                                            type: "bi.editor",
                                            allowBlank: true,
                                            cls: "my-todolist-header-editor",
                                            watermark: "添加ToDo",
                                            width: 300,
                                            height: 24,
                                            listeners: [
                                                {
                                                    eventName: "EVENT_ENTER",
                                                    action: function () {
                                                        self.fireEvent(ToDoListHeader.EVENT_ADD, this.getValue());
                                                        this.setValue("");
                                                    }
                                                }
                                            ]
                                        }
                                    }
                                ]
                            }
                        }
                    }
                ]
            };
        }
    });

    ToDoListHeader.EVENT_ADD = "EVENT_ADD";

    BI.shortcut("my.todolist.header", ToDoListHeader);
})();!(function () {
    var List = BI.inherit(BI.Widget, {

        props: {
            baseCls: "my-todolist-list",
            text: "正在进行"
        },

        render: function () {
            var self = this, o = this.options;
            return {
                type: "bi.vertical",
                items: [
                    {
                        el: {
                            type: "bi.vertical_adapt",
                            height: 40,
                            items: [
                                {
                                    type: "bi.label",
                                    cls: "my-todolist-list-text",
                                    textAlign: "left",
                                    text: o.text,
                                    width: 580
                                }, {
                                    type: "bi.center_adapt",
                                    cls: "my-todolist-list-count-container",
                                    width: 20,
                                    height: 20,
                                    items: [
                                        {
                                            el: {
                                                type: "bi.label",
                                                ref: function (_ref) {
                                                    self.count = _ref;
                                                },
                                                text: "0"
                                            }
                                        }
                                    ]
                                }
                            ]
                        }
                    }, {
                        type: "bi.button_group",
                        ref: function (_ref) {
                            self.list = _ref;
                        },
                        layouts: [
                            {
                                type: "bi.vertical",
                                vgap: 10
                            }
                        ],
                        items: o.items,
                        listeners: [
                            {
                                eventName: "EVENT_CHANGE",
                                action: function (v) {
                                    self.fireEvent("EVENT_CHANGE", v);
                                }
                            }
                        ]
                    }
                ]
            };
        },

        _createItems: function (items) {
            return BI.createItems(items, this.options.el);
        },

        _setCount: function (count) {
            this.count.setText(count);
        },

        populate: function (items) {
            this.list.populate(this._createItems(items));
            this._setCount(items.length);
        }
    });
    BI.shortcut("my.todolist.list", List);
})();!(function () {
    var ToDoList = BI.inherit(BI.Widget, {

        props: {
            baseCls: "fine-to-do-list"
        },

        _store: function () {
            return BI.Models.getModel("my.model.todolist");
        },

        watch: {
            todoList: function (items) {
                this.todolist.populate(items);
            },
            doneList: function (items) {
                this.donelist.populate(items);
            }
        },

        render: function () {
            var self = this, o = this.options;
            return {
                type: "bi.vtape",
                items: [
                    {
                        el: {
                            type: "my.todolist.header",
                            listeners: [
                                {
                                    eventName: "EVENT_ADD",
                                    action: function (v) {
                                        self.store.addToDo(v);
                                    }
                                }
                            ],
                            height: 40
                        },
                        height: 40
                    }, {
                        type: "bi.horizontal_auto",
                        cls: "bi-background",
                        items: [
                            {
                                el: {
                                    type: "my.todolist.list",
                                    ref: function (_ref) {
                                        self.todolist = _ref;
                                    },
                                    text: "正在进行",
                                    listeners: [
                                        {
                                            eventName: "EVENT_CHANGE",
                                            action: function (v) {
                                                self.store.finish(v);
                                            }
                                        }
                                    ],
                                    width: 600
                                }
                            }, {
                                el: {
                                    type: "my.todolist.list",
                                    text: "已经完成",
                                    ref: function (_ref) {
                                        self.donelist = _ref;
                                    },
                                    width: 600
                                }
                            }
                        ]
                    }
                ]
            };
        }
    });
    BI.shortcut("my.todolist", ToDoList);
})();
!(function () {

    var ToDoListModel = BI.inherit(Fix.Model, {

        state: function () {
            return {
                list: []
            };
        },
        watch: {},

        computed: {
            todoList: function () {
                var items = BI.filter(this.model.list, function (index, item) {
                    return !item.done;
                });
                return BI.map(items, function (index, item) {
                    return BI.extend({
                        type: "bi.multi_select_item"
                    }, item);
                });
            },
            doneList: function () {
                var items = BI.filter(this.model.list, function (index, item) {
                    return item.done;
                });
                return BI.map(items, function (index, item) {
                    return BI.extend({
                        type: "bi.multi_select_item",
                        selected: true,
                        disabled: true
                    }, item);
                });
            }
        },

        actions: {
            addToDo: function (v) {
                this.model.list.push({
                    value: BI.UUID(),
                    text: v,
                    done: false
                });
            },

            finish: function (v) {
                BI.some(this.model.list, function (index, item) {
                    if (item.value === v) {
                        item.done = true;
                    }
                });
            }
        }
    });
    BI.model("my.model.todolist", ToDoListModel);
})();
!(function () {
    BI.createWidget({
        type: "my.todolist",
        element: "#wrapper"
    });
})();