define("portal/list", ['utils', 'zepto', 'juicer'], function (_u) {
    var constants = require('constants');
    var list = {
        el: "#page-list",
        apps: [],
        data: null,
        status: "all",
        count: {
            all: 0,
            unuse: 0,
            inuse: 0
        },
        vieweds: null,
        getApps: function() {
            var that = this;

            return _u.ajax({
                action: "getApps"
            }, function(res) {
                var apps = [];
                var count = list.count;

                that.data = res;
                res.datas.forEach(function(r) {
                    apps.push.apply(apps, r.apps);
                });

                count.unuse = 0;
                count.inuse = 0;

                apps.forEach(function(app) {
                    if (!app.inuse) return count.unuse++;
                    count.inuse++;
                });
                count.all = apps.length;
                that.apps = apps;
            });
        },
        getViewedAppids: function() {
            var that = this;

            if(this.vieweds) return $.Deferred().resolve(this.vieweds);

            return _u.ajax({
                action: "viewedAppids",
                force: false
            }, function(res) {
                that.vieweds = res.datas;
            });
        },
        reset: function() {
            var $el = $(this.el);

            this.vieweds = null;
            // 默认选中全部
            this.status = "all";
            _u.toggleTab($el.find("[data-tab='all']"));
            return this;
        },
        render: function(data) {
            var tmpl = $("#list-tmpl").html();
            
            tmpl = juicer(tmpl, data);
            
            $(this.el).find(".tab-panel").html(tmpl);
            this.renderCount();
            this.getViewedAppids().then(this.renderViews.bind(this));
        },
        renderCount: function() {
            var $list = $(this.el);
            var count = this.count;
            
            Object.keys(count).forEach(function(key, index) {
                var htm = count[key] ? "(" + count[key] + ")" : "";

                $list.find('.count').eq(index).html(htm);
            });
        },
        renderClassifyCount: function() {
            var $list = $(this.el).find(".app-list");
            var status = this.status,
                selector = ".app-item";

            switch (status) {
                case "inuse":
                    selector += "[data-inuse='1']";
                    break;
                case "unuse":
                    selector += "[data-inuse='0']";
                    break;
            }

            $list.each(function() {
                var count = $(this).find(selector).length;
                var htm = count > 1 ? "(" + count + ")" : ""

                $(this).find(".app-count").html(htm)
            });
        },
        renderViews: function() {
            var $list = $(this.el);
            var vieweds = this.vieweds;
            var apps = this.apps;
            var hasVersion = false;

            $list.find(".app-item").data("version", true);
            $list.find(".tab").data("version", false);
            apps.forEach(function(app) {
                var id = app.id;
                var $app = $('.app-item[data-id="' + id + '"]');
                var sts = $app.data("inuse") == 1 ? 'inuse' : 'unuse';
                
                if (~vieweds.indexOf(parseInt(id))) {
                    return $('.app-item[data-id="' + id + '"]').data("version", false);    
                }
                hasVersion = true;
                $list.find("[data-tab='" + sts + "']").data("version", true);
            });
            $list.find(".tab:first-child").data("version", hasVersion);
        },
        bindEvent: function() {
            var that = this;
            var $list = $(this.el);

            $list.on("click.tab", ".tab", function() {
                var $tab = $(this), status = $tab.data("tab");

                if(status === that.status) return;

                that.status = status;
                that.filter(status);
            }).on("click.expand", ".expand", function() {
                var $applist = $(this).closest(".app-list");
                var isexpand = $applist.attr("data-expand") == "true";
                var html = !isexpand ? constants.SHRIK : constants.VIEW_ALL;
                
                $(this).html(html);
                $applist.attr("data-expand", !isexpand);
                that.filter(that.status);
            }).on("click.navigate", ".app-item", function(e) {
                var $target = $(e.target);
                var $appItem = $(this), 
                    appid = $appItem.data("id");
                
                // 防止.switch的冒泡
                if($target.hasClass("switch")) return;
                // 已查看的过的跳过
                if(~that.vieweds.indexOf(appid)) return;

                _u.ajax({
                    action: "logView",
                    data: { appid: $(this).data("id") }
                }, function() {
                    that.vieweds.push(appid);
                    that.renderViews();
                });
            });
        },
        filter: function (status) {
            var $list = $(this.el);
            var stscode = 0, needHide;
                
            $list.find(".app-list").show();
            $list.find(".app-item").show();

            if(status === "unuse") {
                stscode = 1;
            }

            needHide = '.app-item[data-inuse="' + stscode + '"]';
            needShow = '.app-item[data-inuse="' + Math.abs(stscode - 1) + '"]';

            if(status === "all") {
                needHide = ".none";
                needShow = ".app-item";
            }

            $list.find(needHide).hide();
            $list.find(".app-list").each(function() {
                var $applist = $(this);
                var ishide = $applist.find(needHide).length == $(this).find(".app-item").length;

                $applist.toggle(!ishide);
                
                var $needShow = $applist.find(needShow);

                if(!$applist.data("expand")) {
                    $needShow.hide();
                    $needShow.eq(0).show();
                    $needShow.eq(1).show();
                }
                $applist.find(".expand").toggle($needShow.length > 2);
            });
            this.renderClassifyCount();
        },
        toggleSwitch: function (el, inuse, onlyrender) {
            var that = this;
            var $switch = $(el),
                $appItem = $switch.closest(".app-item");
            var action = inuse == 1 ? "unuse" : "use";
            var _render = function () {
                var plus = "inuse",
                    minus = "unuse";

                if (inuse == 1) {
                    plus = minus;
                    minus = "inuse";
                }

                $appItem.data("inuse", Math.abs(inuse - 1));
                that.count[plus]++;
                that.count[minus]--;
                that.renderCount();
                that.renderViews();
            };
            
            if(onlyrender) return $.Deferred().resolve(function() {
                _render();
                that.filter(that.status);
            }());

            return _u.ajax({
                action: action,
                data: { appid: $appItem.data("id") }
            }, _render);
        }
    };

    list.bindEvent();
    list.getViewedAppids();

    return {
        init: function () {
            list.reset().getApps().then(list.render.bind(list));
        },
        toggleSwitch: function(appid, inuse) {
            var $el = $(list.el);
            var $switch = $(appid);

            if(!appid.nodeName) {
                $switch = $el.find(".app-item[data-id='" + appid + "']").find(".switch");
                $switch.toggleClass("switch-checked");
            }

            return list.toggleSwitch($switch, inuse, !appid.nodeName);
        }
    };
});