docs/source/Template-more.html

   1 <html>
   2 <head>
   3   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   4   <title>The source code</title>
   5     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
   6     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
   7 </head>
   8 <body  onload="prettyPrint();">
   9     <pre class="prettyprint lang-js">/*!
  10  * Ext JS Library 3.3.1
  11  * Copyright(c) 2006-2010 Sencha Inc.
  12  * licensing@sencha.com
  13  * http://www.sencha.com/license
  14  */
  15 /**
  16  * @class Ext.Template
  17  */
  18 Ext.apply(Ext.Template.prototype, {
  19     <div id="cfg-Ext.Template-disableFormats"></div>/**
  20      * @cfg {Boolean} disableFormats Specify <tt>true</tt> to disable format
  21      * functions in the template. If the template does not contain
  22      * {@link Ext.util.Format format functions}, setting <code>disableFormats</code>
  23      * to true will reduce <code>{@link #apply}</code> time. Defaults to <tt>false</tt>.
  24      * <pre><code>
  25 var t = new Ext.Template(
  26     '&lt;div name="{id}"&gt;',
  27         '&lt;span class="{cls}"&gt;{name} {value}&lt;/span&gt;',
  28     '&lt;/div&gt;',
  29     {
  30         compiled: true,      // {@link #compile} immediately
  31         disableFormats: true // reduce <code>{@link #apply}</code> time since no formatting
  32     }
  33 );
  34      * </code></pre>
  35      * For a list of available format functions, see {@link Ext.util.Format}.
  36      */
  37     disableFormats : false,
  38     <div id="prop-Ext.Template-disableFormats"></div>/**
  39      * See <code>{@link #disableFormats}</code>.
  40      * @type Boolean
  41      * @property disableFormats
  42      */
  43
  44     <div id="prop-Ext.Template-re"></div>/**
  45      * The regular expression used to match template variables
  46      * @type RegExp
  47      * @property
  48      * @hide repeat doc
  49      */
  50     re : /\{([\w-]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?\}/g,
  51     argsRe : /^\s*['"](.*)["']\s*$/,
  52     compileARe : /\\/g,
  53     compileBRe : /(\r\n|\n)/g,
  54     compileCRe : /'/g,
  55
  56     <div id="method-Ext.Template-applyTemplate"></div>/**
  57      * Returns an HTML fragment of this template with the specified values applied.
  58      * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
  59      * @return {String} The HTML fragment
  60      * @hide repeat doc
  61      */
  62     applyTemplate : function(values){
  63         var me = this,
  64             useF = me.disableFormats !== true,
  65             fm = Ext.util.Format,
  66             tpl = me;
  67
  68         if(me.compiled){
  69             return me.compiled(values);
  70         }
  71         function fn(m, name, format, args){
  72             if (format && useF) {
  73                 if (format.substr(0, 5) == "this.") {
  74                     return tpl.call(format.substr(5), values[name], values);
  75                 } else {
  76                     if (args) {
  77                         // quoted values are required for strings in compiled templates,
  78                         // but for non compiled we need to strip them
  79                         // quoted reversed for jsmin
  80                         var re = me.argsRe;
  81                         args = args.split(',');
  82                         for(var i = 0, len = args.length; i < len; i++){
  83                             args[i] = args[i].replace(re, "$1");
  84                         }
  85                         args = [values[name]].concat(args);
  86                     } else {
  87                         args = [values[name]];
  88                     }
  89                     return fm[format].apply(fm, args);
  90                 }
  91             } else {
  92                 return values[name] !== undefined ? values[name] : "";
  93             }
  94         }
  95         return me.html.replace(me.re, fn);
  96     },
  97
  98     <div id="method-Ext.Template-compile"></div>/**
  99      * Compiles the template into an internal function, eliminating the RegEx overhead.
 100      * @return {Ext.Template} this
 101      * @hide repeat doc
 102      */
 103     compile : function(){
 104         var me = this,
 105             fm = Ext.util.Format,
 106             useF = me.disableFormats !== true,
 107             sep = Ext.isGecko ? "+" : ",",
 108             body;
 109
 110         function fn(m, name, format, args){
 111             if(format && useF){
 112                 args = args ? ',' + args : "";
 113                 if(format.substr(0, 5) != "this."){
 114                     format = "fm." + format + '(';
 115                 }else{
 116                     format = 'this.call("'+ format.substr(5) + '", ';
 117                     args = ", values";
 118                 }
 119             }else{
 120                 args= ''; format = "(values['" + name + "'] == undefined ? '' : ";
 121             }
 122             return "'"+ sep + format + "values['" + name + "']" + args + ")"+sep+"'";
 123         }
 124
 125         // branched to use + in gecko and [].join() in others
 126         if(Ext.isGecko){
 127             body = "this.compiled = function(values){ return '" +
 128                    me.html.replace(me.compileARe, '\\\\').replace(me.compileBRe, '\\n').replace(me.compileCRe, "\\'").replace(me.re, fn) +
 129                     "';};";
 130         }else{
 131             body = ["this.compiled = function(values){ return ['"];
 132             body.push(me.html.replace(me.compileARe, '\\\\').replace(me.compileBRe, '\\n').replace(me.compileCRe, "\\'").replace(me.re, fn));
 133             body.push("'].join('');};");
 134             body = body.join('');
 135         }
 136         eval(body);
 137         return me;
 138     },
 139
 140     // private function used to call members
 141     call : function(fnName, value, allValues){
 142         return this[fnName](value, allValues);
 143     }
 144 });
 145 Ext.Template.prototype.apply = Ext.Template.prototype.applyTemplate;
 146 </pre>
 147 </body>
 148 </html>