Skip to content
This repository was archived by the owner on Aug 31, 2018. It is now read-only.

Commit 61035fa

Browse files
author
Matt R. Wilson
committed
Apply standard formatting.
Let the minifier take care of multiple var statements and removing unnecessary brackets.
1 parent aab8b7b commit 61035fa

File tree

2 files changed

+91
-80
lines changed

2 files changed

+91
-80
lines changed

‎test/basic.html renamed to ‎example.html

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
<!DOCTYPE html>
22
<head>
33
<meta charset="utf-8">
4-
<title>tmpljs basic test</title>
4+
<title>tmpljs basic example</title>
55
</head>
66
<body>
7-
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
8-
<script src="../tmpl.js"></script>
7+
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
8+
<script src="tmpl.js"></script>
99
<script>
1010

1111
$(function(){

‎tmpl.js

+88-77
Original file line numberDiff line numberDiff line change
@@ -8,12 +8,10 @@
88
* Requires jQuery 1.4+
99
*/
1010

11-
(function ($) {
11+
(function($) {
1212

1313
"use strict";
1414

15-
var
16-
1715
// Regex to break the main string into parts
1816
// example " getTag(p, 6).world[placeholder=some text] {myvar} yeah"
1917
// matches
@@ -22,97 +20,106 @@
2220
// 3: parentheses "(p, 6)"
2321
// 4: method args "p, 6"
2422
// 5: everything else ".world[placeholder=some text] {myvar} yeah"
25-
rparse = /^(\s*)([\w-]*)(\((.*)\))?(.*)$/,
23+
var rline = /^(\s*)([\w-]*)(\((.*)\))?(.*)$/;
2624

2725
// Regex for explicitly stated attributes ( the stuff in square brackets )
2826
// matches
2927
// 1: attribute name "placeholder"
3028
// 2: value "some text"
31-
rattrs = /\[([\w-]+)=?([^\]]*)\]/g,
29+
var rattrs = /\[([\w-]+)=?([^\]]*)\]/g;
3230

3331
// Regex for the modifiers ( class, id, cache )
3432
// matches
3533
// 1: type flag ".", "#", "$"
3634
// 2: value from the example above "world"
37-
rmods = /([.#$])([\w-]+)/g,
35+
var rmods = /([.#$])([\w-]+)/g;
3836

3937
// Regex for the handlebar type variable syntax in text
4038
// matches
4139
// 1: start or leading character, check comments in varReplacer() for why
4240
// 2: variable key
43-
rvariables = /(^|[^\\])\{(.*?[^\\])\}/g,
41+
var rvariables = /(^|[^\\])\{(.*?[^\\])\}/g;
4442

45-
// set the value property instead of innerhtml for these tags
46-
setValuesFor = ["input", "textarea"],
43+
// set the `value` property instead of `innerHTML` for these tags
44+
var setValuesFor = ["input", "textarea"];
4745

4846
// just for compression
49-
isFunction = $.isFunction,
47+
var isFunction = $.isFunction;
5048

5149
// Turn dot notation in a string into object reference
5250
// example "a.b.c" on a = {b:{c:variable}} will return variable
53-
dotToRef = function (notation, object) {
51+
var dotToRef = function (notation, object) {
5452
return notation.split(".")
5553
.reduce(function (current, i) {
5654
return current[i];
5755
}, object);
58-
},
56+
};
57+
58+
// scratch vars
59+
var lastEl;
60+
var parentEl;
61+
var indexOfSpace;
62+
var textVal;
63+
var modVal;
5964

6065
// The actual plugin function
61-
tmpl = function (template, data) {
66+
var tmpl = function(template, data) {
6267

63-
if (!$.isArray(template))
68+
if (!$.isArray(template)) {
6469
template = [];
70+
}
6571

6672
data = data || {};
6773

68-
var ret = $(),
69-
itemIndex,
70-
parent,
71-
lastEl,
72-
lastDepth = 0,
73-
objCache = {},
74-
75-
// Replace variables in strings
76-
varReplacer = function (match, lead, key) {
77-
var val = dotToRef(key, data);
78-
79-
if (isFunction(val))
80-
val = val.call(data);
81-
82-
if (null == val)
83-
val = "";
84-
85-
// In order to have escapeable opening curly brackets,
86-
// we have to capture the character before the bracket
87-
// then append it back in.
88-
// Without lookbehinds in js, is there a better way to do this?
89-
return lead + val;
90-
};
91-
92-
for (itemIndex in template) {
93-
94-
var matches = rparse.exec(template[itemIndex]),
95-
tag = matches[2],
96-
postTag = matches[5],
97-
el = 0,
98-
$el = 0,
99-
indexOfSpace, textVal, modVal,
100-
classes = [],
101-
102-
// The amount of white space that starts the string
103-
// defines its depth in the DOM tree
104-
// Four spaces to a level, add one to compensate for
105-
// the quote character then floor the value
106-
// examples
107-
// "tag" : 0 spaces = 0
108-
// " tag" : 3 spaces = 1
109-
// " tag" : 7 spaces = 2
110-
depth = ((matches[1].length + 1) / 4) | 0;
74+
var ret = $();
75+
var templateIndex = 0;
76+
var templateLength = template.length;
77+
var lastDepth = 0;
78+
var objCache = {};
79+
80+
// Replace variables in strings
81+
var varReplacer = function(match, lead, key) {
82+
var val = dotToRef(key, data);
83+
84+
if (isFunction(val)) {
85+
val = val.call(data);
86+
}
87+
88+
if (!val && 0 !== val) {
89+
val = "";
90+
}
91+
92+
// In order to have escapable opening curly brackets,
93+
// we have to capture the character before the bracket
94+
// then append it back in.
95+
// Without lookbehinds in js, is there a better way to do this?
96+
return lead + val;
97+
};
98+
99+
while (templateIndex < templateLength) {
100+
101+
var matches = rline.exec(template[templateIndex++]);
102+
var tag = matches[2];
103+
var postTag = matches[5];
104+
var el = false;
105+
var $el = false;
106+
var classes = [];
107+
108+
// The amount of white space that starts the string
109+
// defines its depth in the DOM tree
110+
// Four spaces to a level, add one to compensate for
111+
// the quote character then floor the value
112+
// examples
113+
// "tag" : 0 spaces = 0
114+
// " tag" : 3 spaces = 1
115+
// " tag" : 7 spaces = 2
116+
var depth = ((matches[1].length + 1) / 4) | 0;
111117

112118
// Make sure there is at least a tag or postTag declared
113119
// basically, skip empty lines
114-
if (!tag && !postTag)
120+
if (!tag && !postTag) {
115121
continue;
122+
}
116123

117124
// matches[3] is truthy if parentheses were provided after the tag name
118125
// so we consider it a fn call
@@ -134,32 +141,35 @@
134141
el = document.createElement(tag || "div");
135142
}
136143

137-
if (depth && parent) {
138-
if (depth > lastDepth) // nest in last element
139-
parent = lastEl;
144+
if (depth && parentEl) {
145+
if (depth > lastDepth) { // nest in last element
146+
parentEl = lastEl;
147+
}
140148

141-
while (depth < lastDepth--) // traverse up
142-
parent = parent.parentNode;
149+
while (depth < lastDepth--) { // traverse up
150+
parentEl = parentEl.parentNode;
151+
}
143152

144-
parent.appendChild(el);
153+
parentEl.appendChild(el);
145154
} else {
146-
ret.push(parent = el);
155+
ret.push(parentEl = el);
147156
}
148157

149158
lastDepth = depth;
150159
lastEl = el;
151160

152161
// Don't bother with the rest if there's no mods or text
153-
if (!postTag)
162+
if (!postTag) {
154163
continue;
164+
}
155165

156166
// Search for attributes
157167
// Attach them to the element and remove the characters
158168
// from the postTag string, this allows us to have spaces in the attr values
159169
//
160170
// [placeholder=Hello World] -> placeholder="Hello World"
161171
// [disabled] -> disabled="disabled"
162-
postTag = postTag.replace(rattrs, function (match, attr, val) {
172+
postTag = postTag.replace(rattrs, function(match, attr, val) {
163173
el.setAttribute(attr, val || attr);
164174
return "";
165175
});
@@ -178,27 +188,28 @@
178188

179189
// Set the value for the tags we want to,
180190
// otherwise set innerHTML
181-
if ($.inArray(el.tagName.toLowerCase(), setValuesFor) < 0)
191+
if ($.inArray(el.tagName.toLowerCase(), setValuesFor) < 0) {
182192
el.innerHTML = textVal;
183-
else
193+
} else {
184194
el.value = textVal;
195+
}
185196
}
186197

187198
// Loop the mods
188199
while ((matches = rmods.exec(postTag))) {
189200
modVal = matches[2];
190201

191202
switch (matches[1]) {
192-
case ".": // Add class
193-
classes.push(modVal);
194-
break;
203+
case ".": // Add class
204+
classes.push(modVal);
205+
break;
195206

196-
case "#": // Set id
197-
el.id = modVal;
198-
break;
207+
case "#": // Set id
208+
el.id = modVal;
209+
break;
199210

200-
case "$": // cache jQueryized element for later
201-
objCache[modVal] = $el || $(el);
211+
case "$": // cache jQueryized element for later
212+
objCache[modVal] = $el || $(el);
202213
}
203214
}
204215

0 commit comments

Comments
 (0)