aefxx / jqote2 Goto Github PK
View Code? Open in Web Editor NEWjQote2 - jQuery's most powerful and versatile templating engine
Home Page: http://aefxx.com
License: MIT License
jQote2 - jQuery's most powerful and versatile templating engine
Home Page: http://aefxx.com
License: MIT License
I write a template like so:
<![CDATA[
<div class="grid_5 server">
<a class='dom-link' href="javascript:void(0);" onclick="EditServer(<%= this.id %>)"><i title="edit this server" class="icon icon-edit"></i></a><b><%= this.name %></b><br>
<span class="record-header">IP:</span> <%= this.ip %>
<br>
<span class="record-header">Login:</span> <%= this.domainname %>\<%= this.login %>
<br>
<span class="record-header">Password:</span> <%= this.password %>
<br>
<span class="record-header">Notes:</span><span class="serverNotes"> <%= this.notes %></span>
<br>
<span class="record-header">ID:</span> <%= this.id %>
</div>
]]>
If I take out the enclosing div(the class=grid_5 server div) - the 'this.id' doesn't show up. For some strange reason, you can't end a template block with a variable. you have to have it all enclosed within a tag of some kind.
I'm not sure if this is reproducible. However, in my current project, jQuery has been aliased as j() instead of $(). I think doing this causes jqote to complain that "j is not a function". Could this be an issue? Thanks!
I found that (in chrome) using string.replace is faster than string.split.join. Also performance can be boosted by caching regex objects used in string.replace once they are created. Here are some benchmarks. Regards.
var str = '& &<some html="string">html for the win</html>'
var r1 = /&(?!\w+;)/g;
var r2 = /</g;
var r3 = />/g;
var r4 = /"/g;
var r5 = /'/g;
var t = (new Date()).valueOf();
for(var i = 0; i < 100000; ++i) {
var rr = str.replace(/&(?!\w+;)/g, '&');
}
console.log('String.replace with new regexp every time', (new Date()).valueOf() - t);
var t = (new Date()).valueOf();
for(var i = 0; i < 100000; ++i) {
var rr = str.replace(r1, '&');
}
console.log('String.replace reusing regexp', (new Date()).valueOf() - t);
var t = (new Date()).valueOf();
for(var i = 0; i < 100000; ++i) {
var rr = str.split('<').join('<').split('>').join('>')
.split('"').join('"').split("'").join(''');
}
console.log('String.split.join', (new Date()).valueOf() - t);
var t = (new Date()).valueOf();
for(var i = 0; i < 100000; ++i) {
var rr = str.replace(r2, '<').replace(r3, '>').replace(r4, '"').replace(r5, ''');
}
console.log('String.replace (reusing regexps)', (new Date()).valueOf() - t);
How does one handle template in template situations? Is that possible? For instance, I am trying to document a list of methods, e.g.
<script type="text/x-jqote-template" id="template-module">
<![CDATA[
...
<% $.each(publicMethods, function(i,m) { %>
// insert template-method here m -> this
<% } %>
<% $.each(privateMethods, function(i,m) { %>
// insert template-method here m -> this
<% } %>
...
]]>
</script>
<script type="text/x-jqote-template" id="template-method">
Method Name: <%= this.name %>
...
</script>
So I need to reuse the template-method
template multiple times inside of the template-module
template.
How to add a check in the template for null, undefined??, i need the check wrapped around the dom, so if its unavailable it should show the div
Hi, is there a way to access nested objects such as
"one":
{
"two":
[
{ "id": "1001", "type": "Regular" },
{ "id": "1002", "type": "Normal" }
]
},
"ten":
[
{ "id": "5001", "type": "None" },
]
Several place in the source, something similiar to this is used at the start of a function
function lambda(tmpl, t) {
var f, fn = [], t = t || tag,
...
}
This is invalid JS as the variable 't' is declared twice. First as an argument in the function signature and then as a local variable inside the function body. The correct approach would be something like this:
function lambda(tmpl, t) {
t = t || tag;
var f, fn = [],
...
}
As far as I can tell this is repeated on line 42, 96 and 113
I noticed that any leading or trailing whitespace gets stripped out of templates. That's great and all, except for <pre> and <code> tags that really are useful because of the pre-formatted text.
Hi. I suggest changing the type checks from "type_of.call" to the javascript instanceof operator.
For example "type_of(str) == ARR" becomes "str instanceof Array" . But I believe it will not work for strings for unknown for me reason. Here is a small benchmark. In my test the instanceof operator performs 30x+ times faster and it should be even faster in the actual code because of the longer scope chain there. Although the actual difference is small it is not good coding practice IMO to use string conversations for type checks and it involves calling functions, creating new scopes, comparing strings, etc which is all useless in this case. Also if you have 1,000,000 users and sum their added performance you will save lot of world's computing time and resources and power and co2 etc ;)
var type_of = Object.prototype.toString;
var arr = [];
var t = (new Date()).valueOf();
for(var i = 0; i < 1000000; ++i) {
type_of.call(arr) === '[object Array]';
}
console.log((new Date()).valueOf() - t);
t = (new Date()).valueOf();
for(var i = 0; i < 1000000; ++i) {
arr instanceof Array;
}
console.log((new Date()).valueOf() - t);
Hi,
we use jQote2 in JSPs all the time and since <% has special meaning for JSP, we need to escape it in our jQote2 templates. So, instead of <%=
we need to write <\%=
which is somewhat ugly.
We are aware that the tag can be passed to most of the functions but that is a little painful as well, as the tag would have to be passed to every invocation. Besides, we have recursive templates making this way of overriding even more cumbersome. It would be nice if it were possible to change the default template tag on a global level.
Will be attaching patch soon.
I no longer see jQote2 on the jsDelivr CDN. Has it been taken down? Will it be back?
Hi. Thanks for the good work.
I suggest few small changes to make the generated template functions more stable:
Add newlines (\n) before "out+=", this allows the templates to contain single line comments (//), otherwise these comments are carried in the generated function code thus breaking it.
line 134:
for ( var m=0,l=arr.length; m < l; m++ )
str += arr[m].charAt(0) !== '\x1b' ?
"\nout+='" + arr[m].replace(/(|["'])/g, '$1') + "'" : (arr[m].charAt(1) === '=' ?
';\nout+=(' + arr[m].substr(2) + ');' : (arr[m].charAt(1) === '!' ?
';\nout+=$.jqotenc((' + arr[m].substr(2) + '));' : ';' + arr[m].substr(1)));
Add check for null and undefined values in jqoteenc. Without this check jqotenc crashes on null and undefined values because they don't have .toString() method. I guess booleans will crash too, but I haven't tested this.
line 168:
jqotenc: function(str) {
if(str === null || str === undefined) return '';
return str.toString()
.replace(/&(?!\w+;)/g, '&')
.split('<').join('<').split('>').join('>')
.split('"').join('"').split("'").join(''');
how would i add
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.