docs/source/Template-more.html

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