Skip to content

Commit 92facd8

Browse files
aercolinoaercolino
committed
fix - add a space to empty lines, not all lines
-- add more/improve examples for filters
1 parent 568ff8f commit 92facd8

File tree

5 files changed

+302
-3
lines changed

5 files changed

+302
-3
lines changed

‎src/examples/filters-div-n.html

+99
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,99 @@
1+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3c.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
2+
<!-- http://noteslog.com/chili/ - Copyright 2010 / Andrea Ercolino -->
3+
<html xmlns="http://www.w3.org/1999/xhtml">
4+
<head>
5+
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
6+
7+
<title>TESTING CHILI 3.0 - Filters</title>
8+
9+
<script type="text/javascript" src="../jquery.js"></script>
10+
<script type="text/javascript" src="../jquery.chili.js"></script>
11+
12+
13+
<script id="setup" type="text/javascript">
14+
$.chili.options.dynamic.origin = "../recipes/";
15+
$.chili.options.automatic.active = false;
16+
$.chili.options.selection.active = false;
17+
$.chili.options.decoration.lineNumbers = true;
18+
$( function() {
19+
$( '#highlight' )
20+
.one( 'click', function() {
21+
var time1 = new Date();
22+
var $chili = $( '#jq' ).chili({
23+
filters: {
24+
background: function( color )
25+
{
26+
var result = ''
27+
+ '<div style="background-color: ' + color + '">'
28+
+ this.html
29+
+ '</div>';
30+
return result;
31+
}
32+
}
33+
});
34+
var time2 = new Date();
35+
var delta = time2 - time1;
36+
var spans = $chili.find( 'span' ).length;
37+
var rate = Math.round( spans / delta * 100 ) / 100;
38+
$( '#highlight' ).html(
39+
'highlight done in ' + delta + ' milliseconds'
40+
+ ' with ' + spans + ' spans'
41+
+ ' at a rate of ' + rate * 1000 + ' span/sec'
42+
);
43+
} )
44+
.show()
45+
;
46+
} );
47+
</script>
48+
49+
<script type="text/javascript" src="examples.js"></script>
50+
<link type="text/css" rel="stylesheet" href="examples.css" />
51+
52+
</head>
53+
<body>
54+
55+
<h2 id="title"></h2>
56+
57+
<h3 id="highlight" style="color:red; display:none;">
58+
<a href="#">highlight</a> now
59+
</h3>
60+
61+
<p>
62+
This page has the following setup.
63+
</p>
64+
<div id="show_setup"></div>
65+
66+
67+
<hr/>
68+
69+
70+
<div class="section">
71+
<h3>JavaScript</h3>
72+
<p><a href="http://noteslog.com/chili/" target="_blank">Chili</a> highlights <a href="http://jquery.com/" target="_blank">jQuery</a></p>
73+
<pre><code class="chili-lang-javascript" id='jq'>
74+
/**
75+
* Shows a dialog containing the text selected by the user
76+
*/
77+
function displaySelectedTextDialog( event )
78+
{
79+
if (! (element &amp;&amp; element == this))
80+
{
81+
return;
82+
}
83+
element = null;
84+
85+
{:off()[var selectedText = getSelectedText();]off:}
86+
{:background('#FFC')[ if ( '' == selectedText )
87+
{
88+
return;
89+
}
90+
]background:} selectedText = cleanText(selectedText);
91+
92+
var $container = makeDialog(selectedText, event);
93+
selectTextAgain($container);
94+
}
95+
</code></pre>
96+
</div>
97+
98+
</body>
99+
</html>

‎src/examples/filters-div.html

+99
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,99 @@
1+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3c.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
2+
<!-- http://noteslog.com/chili/ - Copyright 2010 / Andrea Ercolino -->
3+
<html xmlns="http://www.w3.org/1999/xhtml">
4+
<head>
5+
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
6+
7+
<title>TESTING CHILI 3.0 - Filters</title>
8+
9+
<script type="text/javascript" src="../jquery.js"></script>
10+
<script type="text/javascript" src="../jquery.chili.js"></script>
11+
12+
13+
<script id="setup" type="text/javascript">
14+
$.chili.options.dynamic.origin = "../recipes/";
15+
$.chili.options.automatic.active = false;
16+
$.chili.options.selection.active = false;
17+
$.chili.options.decoration.lineNumbers = false;
18+
$( function() {
19+
$( '#highlight' )
20+
.one( 'click', function() {
21+
var time1 = new Date();
22+
var $chili = $( '#jq' ).chili({
23+
filters: {
24+
background: function( color )
25+
{
26+
var result = ''
27+
+ '<div style="background-color: ' + color + '">'
28+
+ this.html
29+
+ '</div>';
30+
return result;
31+
}
32+
}
33+
});
34+
var time2 = new Date();
35+
var delta = time2 - time1;
36+
var spans = $chili.find( 'span' ).length;
37+
var rate = Math.round( spans / delta * 100 ) / 100;
38+
$( '#highlight' ).html(
39+
'highlight done in ' + delta + ' milliseconds'
40+
+ ' with ' + spans + ' spans'
41+
+ ' at a rate of ' + rate * 1000 + ' span/sec'
42+
);
43+
} )
44+
.show()
45+
;
46+
} );
47+
</script>
48+
49+
<script type="text/javascript" src="examples.js"></script>
50+
<link type="text/css" rel="stylesheet" href="examples.css" />
51+
52+
</head>
53+
<body>
54+
55+
<h2 id="title"></h2>
56+
57+
<h3 id="highlight" style="color:red; display:none;">
58+
<a href="#">highlight</a> now
59+
</h3>
60+
61+
<p>
62+
This page has the following setup.
63+
</p>
64+
<div id="show_setup"></div>
65+
66+
67+
<hr/>
68+
69+
70+
<div class="section">
71+
<h3>JavaScript</h3>
72+
<p><a href="http://noteslog.com/chili/" target="_blank">Chili</a> highlights <a href="http://jquery.com/" target="_blank">jQuery</a></p>
73+
<pre><code class="chili-lang-javascript" id='jq'>
74+
/**
75+
* Shows a dialog containing the text selected by the user
76+
*/
77+
function displaySelectedTextDialog( event )
78+
{
79+
if (! (element &amp;&amp; element == this))
80+
{
81+
return;
82+
}
83+
element = null;
84+
85+
{:off()[var selectedText = getSelectedText();]off:}
86+
{:background('#FFC')[ if ( '' == selectedText )
87+
{
88+
return;
89+
}
90+
]background:} selectedText = cleanText(selectedText);
91+
92+
var $container = makeDialog(selectedText, event);
93+
selectTextAgain($container);
94+
}
95+
</code></pre>
96+
</div>
97+
98+
</body>
99+
</html>

‎src/examples/filters.html ‎src/examples/filters-span-n.html

+2-1
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@
1414
$.chili.options.dynamic.origin = "../recipes/";
1515
$.chili.options.automatic.active = false;
1616
$.chili.options.selection.active = false;
17+
$.chili.options.decoration.lineNumbers = true;
1718
$( function() {
1819
$( '#highlight' )
1920
.one( 'click', function() {
@@ -82,7 +83,7 @@ <h3>JavaScript</h3>
8283
element = null;
8384

8485
{:off()[var selectedText = getSelectedText();]off:}
85-
{:background('#FFC')[if ( '' == selectedText )
86+
{:background('#FFC')[ if ( '' == selectedText )
8687
{
8788
return;
8889
}]background:}

‎src/examples/filters-span.html

+99
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,99 @@
1+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3c.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
2+
<!-- http://noteslog.com/chili/ - Copyright 2010 / Andrea Ercolino -->
3+
<html xmlns="http://www.w3.org/1999/xhtml">
4+
<head>
5+
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
6+
7+
<title>TESTING CHILI 3.0 - Filters</title>
8+
9+
<script type="text/javascript" src="../jquery.js"></script>
10+
<script type="text/javascript" src="../jquery.chili.js"></script>
11+
12+
13+
<script id="setup" type="text/javascript">
14+
$.chili.options.dynamic.origin = "../recipes/";
15+
$.chili.options.automatic.active = false;
16+
$.chili.options.selection.active = false;
17+
$.chili.options.decoration.lineNumbers = false;
18+
$( function() {
19+
$( '#highlight' )
20+
.one( 'click', function() {
21+
var time1 = new Date();
22+
var $chili = $( '#jq' ).chili({
23+
filters: {
24+
background: function( color )
25+
{
26+
var result = ''
27+
+ '<span style="background-color: ' + color + '">'
28+
+ this.html
29+
+ '</span>';
30+
return result;
31+
}
32+
}
33+
});
34+
var time2 = new Date();
35+
var delta = time2 - time1;
36+
var spans = $chili.find( 'span' ).length;
37+
var rate = Math.round( spans / delta * 100 ) / 100;
38+
$( '#highlight' ).html(
39+
'highlight done in ' + delta + ' milliseconds'
40+
+ ' with ' + spans + ' spans'
41+
+ ' at a rate of ' + rate * 1000 + ' span/sec'
42+
);
43+
} )
44+
.show()
45+
;
46+
} );
47+
</script>
48+
49+
<script type="text/javascript" src="examples.js"></script>
50+
<link type="text/css" rel="stylesheet" href="examples.css" />
51+
52+
</head>
53+
<body>
54+
55+
<h2 id="title"></h2>
56+
57+
<h3 id="highlight" style="color:red; display:none;">
58+
<a href="#">highlight</a> now
59+
</h3>
60+
61+
<p>
62+
This page has the following setup.
63+
</p>
64+
<div id="show_setup"></div>
65+
66+
67+
<hr/>
68+
69+
70+
<div class="section">
71+
<h3>JavaScript</h3>
72+
<p><a href="http://noteslog.com/chili/" target="_blank">Chili</a> highlights <a href="http://jquery.com/" target="_blank">jQuery</a></p>
73+
<pre><code class="chili-lang-javascript" id='jq'>
74+
/**
75+
* Shows a dialog containing the text selected by the user
76+
*/
77+
function displaySelectedTextDialog( event )
78+
{
79+
if (! (element &amp;&amp; element == this))
80+
{
81+
return;
82+
}
83+
element = null;
84+
85+
{:off()[var selectedText = getSelectedText();]off:}
86+
{:background('#FFC')[ if ( '' == selectedText )
87+
{
88+
return;
89+
}]background:}
90+
selectedText = cleanText(selectedText);
91+
92+
var $container = makeDialog(selectedText, event);
93+
selectTextAgain($container);
94+
}
95+
</code></pre>
96+
</div>
97+
98+
</body>
99+
</html>

‎src/lines.js

+3-2
Original file line numberDiff line numberDiff line change
@@ -53,8 +53,9 @@
5353
{
5454
var well_formed = well_form(line, open);
5555
open = well_formed.open;
56-
//leave a space to account for empty lines
57-
line = '<li>' + well_formed.line + ' </li>';
56+
line = well_formed.line
57+
? '<li>' + well_formed.line + '</li>'
58+
: '<li> </li>'; //leave a space in empty lines
5859
return line;
5960
};
6061
var result = html.replace(expr, func);

0 commit comments

Comments
 (0)