/**
 * jQuery extension to enable templating.
 *     This extension is sweet adaptor for TrimPath/template to jQuery.
 *
 *     Template extension :
 *         Also <!-- {...} --> enabled instead of {...}. It's just desiner friendly!!
 *     Bugfix :
 *         Expression auto fix for URL encoded attributes. (...happens on FireFox.)
 *
 * Example:
 *   <script>
 *     $(document).ready(function(){
 *       var my_template = $('#my_template').tempate(); // Build template from jQuery expression.
 *       $.remove('#my_template');                      // Remove template node.
 *       var hello_world = my_template.render({         // Get new jQuery node builded from context with template.
 *           foo:"Hello",                               //   Hint: You can use context from another source like JSON via Ajax.
 *           bar:"World"
 *       });
 *       hello_world.attr('id', 'hello_world');         // Quick fix :-)
 *       $('#contents').append(hello_world);            // Insert generated contents into your page.
 *     });
 *   </script>
 *   
 *   <h1>Test</h1>
 *   <div id="contents">
 *     <h2>"Hello World" will be shown below:</h2>
 *       <div id="my_template">
 *         <p>
 *           <span>${foo}</span>
 *           <!--{if bar}-->
 *             <span>${bar}</span>
 *           <!--{else}-->
 *             <span style="color:gray;">Error on your context.</span>
 *           <!--{/if}-->
 *         </p>
 *       </div>
 *   </div>
 * 
 * Enjoy!
 * 
 * Copyright (c) 2008 Hisateru Tanaka.
 * Dual licensed under the MIT (MIT-LICENSE.txt)
 * and GPL (GPL-LICENSE.txt) licenses.
 */
(function() {
    if(!jQuery){
        alert('jQuery required.\nhttp://jquery.com/');
        return;
    }
    if(!TrimPath || !TrimPath.parseTemplate){
        alert('TrimPath\'s JavaScript Templates required.\nhttp://code.google.com/p/trimpath/');
        return;
    }
    
    var log_debug = function(text){
        if(console){
            if(console.debug){ console.debug(text); return; }
            if(console.info){ console.info(text); return; }
            if(console.log){ console.log(text); return; }
        }
        alert(text);        
    };
    
    jQuery.fn.extend({
        template: function() {
            function Template(trimpath_template_source){
                this.template = trimpath_template_source;
            }
            Template.prototype.render = function(context) {
                var generated_text = this.template.process(context);
                //log_debug(generated_text);
                var generated = $(generated_text);
                return generated;
            };
            
            var tag   = this.get()[0].tagName;
            var attrs = this.get()[0].attributes;
            var attrstrs = [];
            for(var i = 0; i < attrs.length; i++){
                if(attrs.item(i).specified){
                    attrstrs.push(attrs.item(i).name + '="' + this.attr(attrs.item(i).name) + '"');
                }
            }
            var content = this.html();
            content = content.replace(/&lt;/g, "<").replace(/&gt;/g, ">");
            content = content.replace(/\$%7B(\s*[A-Za-z_][A-Za-z0-9_$\.\|:\s]*)%7D/g, "\${$1}"); // FF hotfix
            content = content.replace(/<!--\s*{/g, "{").replace(/}\s*-->/g, "}");
            var source  = "<" + tag + " " + attrstrs.join(" ") + ">" + content + "</" + tag + ">";
            //log_debug(source);
            return new Template(TrimPath.parseTemplate(source));
        }
    });
})();


