หน้าเว็บ

วันจันทร์ที่ 8 เมษายน พ.ศ. 2556

get template from url by jquery template (customize)

require : jquery template https://github.com/jquery/jquery-tmpl
var na5cent = {
     HOST : 'na5cent.blogspot.com',
     PREFIX_TEMPLATE : '/template'
};

na5cent.TemplateLoad = (function($, na5cent) {

    if (!na5cent.template) {
        na5cent.template = {};
    }

    function _filterPath(path) {
        path = path.replace(/\#/g, '');

        return path;
    }

    function _load(path, callback) {
        path = _filterPath(path);
        //
        var name_ = path.split('/').pop();
        var url_ = na5cent.HOST + na5cent.PREFIX_TEMPLATE + path;

        if (na5cent.template[url_]) {
            callback($.getTmpl(url_)); //use cache template

            return;
        }

        $.ajax({
            url: url_,
            dataType: 'html',
            success: function(response) {
                na5cent.template[url_] = true;
                $.template(url_, response); //cache template
                callback($.getTmpl(url_));

                console.log('Template ' + name_ + ' [' + url_ + '] loaded.');
            }
        });
    }

    return function(path, callback) {
        new _load(path, callback || function() {

        });
    };
})(jQuery, na5cent);





/**
 * example to use
 *
 * na5cent.TemplateLoad('/comment/commentBox', function(template) {
 *     template({
 *         name : 'redcrow',
 *         date : new Date(),
 *         content : 'hello world'   
 *     }).appendTo('#comment');
 * }); 
*/

แก้ไข code jquery template เพิ่มเติม โดยการเพิ่ม method getTmpl: function(tmpl, options, parentItem) เข้าไป เป็น jquery plugin

 ซึ่ง method นี้ดัดแปลง code มาจาก method tmpl: function(tmpl, data, options, parentItem) ครับ  โดยการเพิ่ม  return function(data) { }  เข้าไป
        //
        getTmpl: function(tmpl, options, parentItem) {
            var ret, topLevel = !parentItem;
            if (topLevel) {
                // This is a top-level tmpl call (not from a nested template using {{tmpl}})
                parentItem = topTmplItem;
                tmpl = jQuery.template[tmpl] || jQuery.template(null, tmpl);
                wrappedItems = {}; // Any wrapped items will be rebuilt, since this is top level
            } else if (!tmpl) {
                // The template item is already associated with DOM - this is a refresh.
                // Re-evaluate rendered template for the parentItem
                tmpl = parentItem.tmpl;
                newTmplItems[parentItem.key] = parentItem;
                parentItem.nodes = [];
                if (parentItem.wrapped) {
                    updateWrapped(parentItem, parentItem.wrapped);
                }
                // Rebuild, without creating a new template item
                return jQuery(build(parentItem, null, parentItem.tmpl(jQuery, parentItem)));
            }
            
            if (!tmpl) {
                return []; // Could throw...
            }

            return function(data) { //เพิ่มเติม

                if (typeof data === "function") {
                    data = data.call(parentItem || {});
                }
                if (options && options.wrapped) {
                    updateWrapped(options, options.wrapped);
                }
                ret = jQuery.isArray(data) ?
                        jQuery.map(data, function(dataItem) {
                    return dataItem ? newTmplItem(options, parentItem, tmpl, dataItem) : null;
                }) : [newTmplItem(options, parentItem, tmpl, data)];

                return topLevel ? jQuery(build(parentItem, null, ret)) : ret;
            };
        },
code ของ method tmpl: function(tmpl, data, options, parentItem)
        tmpl: function(tmpl, data, options, parentItem) {

            var ret, topLevel = !parentItem;
            if (topLevel) {
                // This is a top-level tmpl call (not from a nested template using {{tmpl}})
                parentItem = topTmplItem;
                tmpl = jQuery.template[tmpl] || jQuery.template(null, tmpl);
                wrappedItems = {}; // Any wrapped items will be rebuilt, since this is top level
            } else if (!tmpl) {
                // The template item is already associated with DOM - this is a refresh.
                // Re-evaluate rendered template for the parentItem
                tmpl = parentItem.tmpl;
                newTmplItems[parentItem.key] = parentItem;
                parentItem.nodes = [];
                if (parentItem.wrapped) {
                    updateWrapped(parentItem, parentItem.wrapped);
                }
                // Rebuild, without creating a new template item
                return jQuery(build(parentItem, null, parentItem.tmpl(jQuery, parentItem)));
            }
            if (!tmpl) {
                return []; // Could throw...
            }

            if (typeof data === "function") {
                data = data.call(parentItem || {});
            }
            if (options && options.wrapped) {
                updateWrapped(options, options.wrapped);
            }
            ret = jQuery.isArray(data) ?
                    jQuery.map(data, function(dataItem) {
                return dataItem ? newTmplItem(options, parentItem, tmpl, dataItem) : null;
            }) :
                    [newTmplItem(options, parentItem, tmpl, data)];
            return topLevel ? jQuery(build(parentItem, null, ret)) : ret;
        },

ไม่มีความคิดเห็น:

แสดงความคิดเห็น