docs/source/Template-more.html

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