jQuery plugin - metadata

Today, when reading an article - A Plugin Development Pattern , i found an interesting plugin - metadata .
First, let’s see it in action:

    <li id="Li1" class='someclass {"item_id": 1, "item_label": "Label"}'>Item 1</li>
    <li id="Li2" metadata='{"item_id": 1, "item_label": "Label"}'>Item 2</li>
    <li id="Li3">
        <metadata style="display: none;">{"item_id": 1, "item_label": "Label"}</metadata>
        Item 3 </li>
    <li id="Li4">
        <script type="metadata">{"item_id": 1, "item_label": "Label"}</script>
        Item 4 </li>

    $(function() {
        $("#item1").metadata().item_id; // 1
        $("#item1").metadata({
            "type": "class"
        }).item_id; // 1 

        $("#item2").metadata({
            "type": "attr"
        }).item_label; // "Label"
        $("#item2").metadata({
            "type": "attr",
            "name": "metadata"
        }).item_label; // "Label" 

        $("#item3").metadata({
            "type": "elem"
        }).item_label; // "Label"
        $("#item3").metadata({
            "type": "elem",
            "name": "metadata"
        }).item_label; // "Label" 

        $("#item4").metadata({
            "type": "elem",
            "name": "script"
        }).item_label; // "Label"
    });

OK, this plugin extract JSON string from class, attribute or child node and parseit into JavaScript Object.
Let’s go through the source code:

    (function($) { 

        $.extend({
            metadata: {
                defaults: {
                    type: 'class',
                    name: 'metadata',
                    cre: /({.*})/,
                    single: 'metadata'
                },
                setType: function(type, name) {
                    this.defaults.type = type;
                    this.defaults.name = name;
                },
                get: function(elem, opts) {
                    var settings = $.extend({}, this.defaults, opts);
                    // check for empty string in single property
                    if (!settings.single.length) settings.single = 'metadata'; 

                    var data = $.data(elem, settings.single);
                    // returned cached data if it already exists
                    if (data) return data; 

                    data = "{}"; 

                    if (settings.type == "class") {
                        var m = settings.cre.exec(elem.className);
                        if (m)
                            data = m[1];
                    } else if (settings.type == "elem") {
                        if (!elem.getElementsByTagName) return;
                        var e = elem.getElementsByTagName(settings.name);
                        if (e.length)
                            data = $.trim(e[0].innerHTML);
                    } else if (elem.getAttribute != undefined) {
                        var attr = elem.getAttribute(settings.name);
                        if (attr)
                            data = attr;
                    } 

                    if (data.indexOf('{') < 0)
                        data = "{" + data + "}"; 

                    data = eval("(" + data + ")"); 

                    $.data(elem, settings.single, data);
                    return data;
                }
            }
        }); 

        $.fn.metadata = function(opts) {
            return $.metadata.get(this[0], opts);
        }; 

    })(jQuery);

Following is a modified version to demonstrate the main concept (also working well):

    (function($) { 

        $.fn.metadata = function(options) {
            var options = $.extend({}, {
                type: 'class',
                name: 'metadata'
            }, options); 

            var data = this.data("metadata");
            if (data) {
                return data;
            } 

            data = "{}";
            if (options.type == "class") {
                var m = /{.*}/.exec(this.attr("class"));
                if (m) {
                    data = m[0];
                }
            } else if (options.type == "elem") {
                var childElem = this.find(options.name);
                if (childElem) {
                    data = $.trim(childElem[0].innerHTML);
                }
            } else if (options.type == "attr") {
                data = this.attr(options.name);
            } 

            data = JSON.parse(data);
            this.data("metadata", data);
            return data;
        }; 

    })(jQuery);

Maybe Athena should take this convention to simplify default options that passedto widget constructor.
This is done manually by developers now. You can refer to “How to pass parametersto widget constructor?” in $.wbx.doc for details.
I will post another article to demonstrate how to add this feature to $.wbx client-framework later.