define(["utils", 'juicer', 'mobile/i18n'], function (_u) {
    "use strict";
    var i18n = require("mobile/i18n");

    i18n.init(_userLanguage);

    var types = {
        DESIGN: "design",
        ATTR: "attr"
    };

    function IView(type) {
        this.template = {
            design: "text!/mobilemode/mobile/template/" + type + ".html",
            attr: "text!/mobilemode/admin/src/appdesigner/mec/design/template/" + type + ".html"
        };
    }

    IView.tpls = {}; // 缓存插件编译后的模板 

    IView.prototype = {
        loadStyle: function() {
            if (!this.model.runtimeCss) return;
            
            var type = this.model.type;

            require(['text!' + this.getCssPath(type)], function (_css) {
                _u.importCssText(_css, type + "_css");
            });
        },
        getCssPath: function (type) {
            var keywords = ["chart", "dataset"]; // 图表类 数据集无css
            var hasPath = false;

            keywords.every(function (k) {
                return hasPath = !~type.toLowerCase().indexOf(k);
            });

            if (!hasPath) return "";

            return "/mobilemode/mobile/dist/css/component/" + type + "-default.css";
        },
        getDesignHtml: function (data, cb) {
            var model = this.model;

            data.id = model.id;
            data.compType = model.type;
            // 缺省组件 防止juicer编译报错
            data.loading = {};
            data.moreLoading = {};

            this.render(types.DESIGN, data).then(cb);
        },
        getAttrDlgHtml: function (data, cb) {
            this.render(this.model.type, types.ATTR, data).then(cb);
        },
        render: function (tplType, data) {
            var t = $.Deferred();

            this.getTpl(this.model.type, tplType).then(function (tpl) {
                t.resolve(tpl.render(data));
            });

            return t;
        },
        /**
         * 获取插件设计或者属性面板的模板
         * @param {String} compType 组件类型
         * @param {String} tplType 模板类型 取值范围(DESIGN|ATTR)
         */
        getTpl: function (compType, tplType) {
            var t = $.Deferred();
            var tpls = IView.tpls;
            var compTpls = tpls[compType] || {}, tpl;

            tpl = compTpls[tplType];

            if (tpl) return t.resolve(tpl);

            var iview = this;
            var modName = this.template[tplType];
            var _getTpl = function (template) {
                template = iview.extendTpl(template);
                template = iview.replaceI18n(template);
                tpl = juicer(template);
                compTpls[tplType] = tpl;
                tpls[compType] = compTpls;

                t.resolve(tpl);
            };
            if(!modName) {
                _getTpl();
            } else {
                require([modName], _getTpl);
            }

            return t;
        }, 
        replaceI18n: function (content) {
            return content.replace(/\$i18n{(.*?)}/g, function (matchText, key) {
                return i18n[key];
            });
        },
        extendTpl: function (template) { // 用于子类重写扩展模板
            return template;
        },
        setDesignTpl: function(v) {
            this.template.design = v;
        }
    };

    return IView;
});