├── .gitignore ├── demos ├── movies │ ├── images │ │ ├── ui-icons_004276_256x240.png │ │ ├── ui-icons_cc0000_256x240.png │ │ ├── ui-icons_ffffff_256x240.png │ │ ├── ui-bg_flat_0_333333_40x100.png │ │ ├── ui-bg_flat_65_ffffff_40x100.png │ │ ├── ui-bg_flat_75_ffffff_40x100.png │ │ ├── ui-bg_glass_55_fbf8ee_1x400.png │ │ ├── ui-bg_glass_75_dadada_1x400.png │ │ ├── ui-bg_dots-small_65_a6a6a6_2x2.png │ │ ├── ui-bg_highlight-soft_15_cc0000_1x100.png │ │ ├── ui-bg_diagonals-thick_75_f3d8d8_40x40.png │ │ ├── ui-bg_highlight-hard_100_eeeeee_1x100.png │ │ └── ui-bg_highlight-hard_100_f6f6f6_1x100.png │ ├── components │ │ └── jquery.pager.js │ ├── css │ │ └── movies.css │ ├── PagesTmplPlus │ │ ├── movies3.html │ │ ├── movies2.html │ │ └── movies1.html │ └── PagesCore │ │ ├── movies.html │ │ └── moviesNoGlobals.html ├── samplesCore │ ├── Interactive │ │ ├── resources │ │ │ ├── empty.png │ │ │ ├── folder.png │ │ │ ├── expanded.png │ │ │ ├── collapsed.png │ │ │ ├── treeView.css │ │ │ └── tabs.css │ │ ├── tabsWrapImperative.html │ │ ├── tabsWrap.html │ │ ├── tabsTmpl.html │ │ ├── tabsWrapNested.html │ │ └── treeView.html │ ├── conditional.html │ ├── each.html │ ├── composition.html │ ├── parameters.html │ └── basic.html ├── resources │ ├── movielist.css │ ├── demos.css │ ├── syntaxhighlighter.css │ └── syntaxhighlighter.min.js ├── step-by-step │ ├── 0_tmpl-read-only │ │ ├── 0_local-data.html │ │ ├── 6_hierarchical-data.html │ │ ├── 1_remote-data.html │ │ ├── 3_if-else-tag.html │ │ ├── 4_each-tag.html │ │ ├── 0_local-data-source.html │ │ ├── 2_html-tag.html │ │ ├── 5_javascript.html │ │ ├── 6_hierarchical-data-source.html │ │ ├── 4_each-tag-source.html │ │ ├── 2_html-tag-source.html │ │ ├── 3_if-else-tag-source.html │ │ ├── 1_remote-data-source.html │ │ └── 5_javascript-source.html │ └── 1_tmpl-interactive │ │ ├── 1_tree-view-using-tmpl-tag.html │ │ ├── 0_accordion-switching-template.html │ │ ├── 2_tabs-using-wrap-tag.html │ │ ├── 2_tabs-using-wrap-tag-source.html │ │ ├── 0_accordion-switching-template-source.html │ │ └── 1_tree-view-using-tmpl-tag-source.html ├── step-by-step.html └── samplesTmplPlus │ ├── composition.html │ ├── basic.html │ └── parameters.html ├── bower.json ├── tests ├── index.html └── qunit.css ├── jquery-tmpl.jquery.json └── README.md /.gitignore: -------------------------------------------------------------------------------- 1 | build/dist 2 | docs 3 | .project 4 | *~ 5 | *.diff 6 | *.patch 7 | .DS_Store 8 | -------------------------------------------------------------------------------- /demos/movies/images/ui-icons_004276_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KanbanSolutions/jquery-tmpl/HEAD/demos/movies/images/ui-icons_004276_256x240.png -------------------------------------------------------------------------------- /demos/movies/images/ui-icons_cc0000_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KanbanSolutions/jquery-tmpl/HEAD/demos/movies/images/ui-icons_cc0000_256x240.png -------------------------------------------------------------------------------- /demos/movies/images/ui-icons_ffffff_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KanbanSolutions/jquery-tmpl/HEAD/demos/movies/images/ui-icons_ffffff_256x240.png -------------------------------------------------------------------------------- /demos/movies/images/ui-bg_flat_0_333333_40x100.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KanbanSolutions/jquery-tmpl/HEAD/demos/movies/images/ui-bg_flat_0_333333_40x100.png -------------------------------------------------------------------------------- /demos/samplesCore/Interactive/resources/empty.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KanbanSolutions/jquery-tmpl/HEAD/demos/samplesCore/Interactive/resources/empty.png -------------------------------------------------------------------------------- /demos/samplesCore/Interactive/resources/folder.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KanbanSolutions/jquery-tmpl/HEAD/demos/samplesCore/Interactive/resources/folder.png -------------------------------------------------------------------------------- /demos/movies/images/ui-bg_flat_65_ffffff_40x100.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KanbanSolutions/jquery-tmpl/HEAD/demos/movies/images/ui-bg_flat_65_ffffff_40x100.png -------------------------------------------------------------------------------- /demos/movies/images/ui-bg_flat_75_ffffff_40x100.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KanbanSolutions/jquery-tmpl/HEAD/demos/movies/images/ui-bg_flat_75_ffffff_40x100.png -------------------------------------------------------------------------------- /demos/movies/images/ui-bg_glass_55_fbf8ee_1x400.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KanbanSolutions/jquery-tmpl/HEAD/demos/movies/images/ui-bg_glass_55_fbf8ee_1x400.png -------------------------------------------------------------------------------- /demos/movies/images/ui-bg_glass_75_dadada_1x400.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KanbanSolutions/jquery-tmpl/HEAD/demos/movies/images/ui-bg_glass_75_dadada_1x400.png -------------------------------------------------------------------------------- /demos/samplesCore/Interactive/resources/expanded.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KanbanSolutions/jquery-tmpl/HEAD/demos/samplesCore/Interactive/resources/expanded.png -------------------------------------------------------------------------------- /demos/movies/images/ui-bg_dots-small_65_a6a6a6_2x2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KanbanSolutions/jquery-tmpl/HEAD/demos/movies/images/ui-bg_dots-small_65_a6a6a6_2x2.png -------------------------------------------------------------------------------- /demos/samplesCore/Interactive/resources/collapsed.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KanbanSolutions/jquery-tmpl/HEAD/demos/samplesCore/Interactive/resources/collapsed.png -------------------------------------------------------------------------------- /demos/movies/images/ui-bg_highlight-soft_15_cc0000_1x100.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KanbanSolutions/jquery-tmpl/HEAD/demos/movies/images/ui-bg_highlight-soft_15_cc0000_1x100.png -------------------------------------------------------------------------------- /demos/movies/images/ui-bg_diagonals-thick_75_f3d8d8_40x40.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KanbanSolutions/jquery-tmpl/HEAD/demos/movies/images/ui-bg_diagonals-thick_75_f3d8d8_40x40.png -------------------------------------------------------------------------------- /demos/movies/images/ui-bg_highlight-hard_100_eeeeee_1x100.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KanbanSolutions/jquery-tmpl/HEAD/demos/movies/images/ui-bg_highlight-hard_100_eeeeee_1x100.png -------------------------------------------------------------------------------- /demos/movies/images/ui-bg_highlight-hard_100_f6f6f6_1x100.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KanbanSolutions/jquery-tmpl/HEAD/demos/movies/images/ui-bg_highlight-hard_100_f6f6f6_1x100.png -------------------------------------------------------------------------------- /demos/resources/movielist.css: -------------------------------------------------------------------------------- 1 | table { border-collapse: collapse; } 2 | table tr { color: blue; height: 25px; } 3 | .header { color: #009; border-bottom: solid #77c 2px; background-color: #E8E8F7; } 4 | .header th { padding:5px; border: 1px solid #77c; } 5 | #movieList tr td:first-child { width: 100px; } 6 | table { border: 2px solid blue; width: 480px; margin: 4px 0 4px 4px; padding: 2px; background-color: #f8f8f8; } 7 | table td { padding: 3px; margin: 3px; border: solid #77c 1px; } 8 | -------------------------------------------------------------------------------- /demos/resources/demos.css: -------------------------------------------------------------------------------- 1 | body { padding: 10px; font-family: Verdana; font-size: small } 2 | h4 { font-size: inherit`; font-variant: small-caps; } 3 | .height { width: 100%; margin-bottom:10px; float: left; clear: both; } 4 | .bottom { height:400px; width: 100%; margin-bottom:10px; float: left; clear: both; } 5 | body > button { float: left; clear: right; margin: 3px } 6 | .subhead { margin: 15px 0 4px 0; font-weight:bolder; color:#116; font-family:Arial; font-size:10pt } 7 | a { color: #55b} 8 | -------------------------------------------------------------------------------- /bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "jquery-tmpl", 3 | "version": "1.0.4", 4 | "homepage": "https://github.com/KanbanSolutions/jquery-tmpl", 5 | "authors": [ 6 | "DJ Gilcrease " 7 | ], 8 | "description": "A templating plugin", 9 | "main": "./jquery.tmpl.js", 10 | "keywords": [ 11 | "templating", 12 | "jquery", 13 | "plugin" 14 | ], 15 | "dependencies": { 16 | "jquery": ">=1.7" 17 | }, 18 | "license": "MIT", 19 | "ignore": [ 20 | "**/.*", 21 | "*.json", 22 | "node_modules", 23 | "bower_components", 24 | "test", 25 | "tests" 26 | ] 27 | } 28 | -------------------------------------------------------------------------------- /demos/samplesCore/Interactive/resources/treeView.css: -------------------------------------------------------------------------------- 1 | .treeView, .treeView ul 2 | { 3 | padding: 0; 4 | margin: 0; 5 | } 6 | 7 | .treeView li 8 | { 9 | list-style-type: none; 10 | padding: 2px; 11 | } 12 | 13 | .treeView li li 14 | { 15 | margin-left: 18px; 16 | } 17 | 18 | .treeView img 19 | { 20 | vertical-align: middle; 21 | border: 0px; 22 | margin-right:7px; 23 | } 24 | 25 | img.folder 26 | { 27 | width:15px; 28 | height:14px; 29 | } 30 | 31 | img.expand 32 | { 33 | width:8px; 34 | width:9px; 35 | } 36 | 37 | .treeView li.folderItem 38 | { 39 | cursor: pointer; 40 | color:Blue; 41 | text-decoration: underline; 42 | font-style:italic; 43 | margin-bottom: 4px; 44 | } 45 | 46 | .content_true 47 | { 48 | cursor: pointer; 49 | font-weight: bold; 50 | } 51 | -------------------------------------------------------------------------------- /tests/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | jquery-tmpl unit tests 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 16 |

jquery-tmpl unit tests

17 |

18 |
19 |

20 |
    21 | 22 | 23 | -------------------------------------------------------------------------------- /jquery-tmpl.jquery.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "jquery-tmpl", 3 | "title": "jQuery Templates", 4 | "description": "This is the fork of jQuery Templates that we use internally here at Kanban Solutions. We have fixed all known and encountered bugs as well as changing the syntax from the standard", 5 | "keywords": [ 6 | "tmpl", 7 | "jquery-tmpl", 8 | "templates", 9 | "template" 10 | ], 11 | "version": "1.0.4", 12 | "author": { 13 | "name": "jQuery Foundation and other contributors" 14 | }, 15 | "maintainers": [ 16 | { 17 | "name": "Kanban Solutions", 18 | "email": "dj.gilcrease@kanbansolutions.com", 19 | "url": "http://www.kanbansolutions.com" 20 | } 21 | ], 22 | "licenses": [ 23 | { 24 | "type": "MIT", 25 | "url": "http://jquery.org/license" 26 | } 27 | ], 28 | "bugs": "https://github.com/KanbanSolutions/jquery-tmpl/issues", 29 | "homepage": "https://github.com/KanbanSolutions/jquery-tmpl", 30 | "docs": "https://github.com/KanbanSolutions/jquery-tmpl", 31 | "dependencies": { 32 | "jquery": ">=1.6" 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /demos/step-by-step/0_tmpl-read-only/0_local-data.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Home
    10 | Source 11 | 12 |

    Demo: Render template against local data

    13 | 14 | 15 | 16 | 21 | 22 | 23 | 24 | 36 | 37 | 38 | 39 | 40 | 41 | -------------------------------------------------------------------------------- /demos/samplesCore/conditional.html: -------------------------------------------------------------------------------- 1 | 2 | 6 | 7 | 8 | 9 | 10 | 24 | 25 | 37 | 38 | 39 | 40 | 41 | 42 | -------------------------------------------------------------------------------- /demos/samplesCore/Interactive/resources/tabs.css: -------------------------------------------------------------------------------- 1 | body 2 | { 3 | font-family: Arial; 4 | } 5 | 6 | .special 7 | { 8 | color: Red; 9 | font-family: Comic Sans MS; 10 | font-size: 20px; 11 | font-style: italic; 12 | } 13 | 14 | .tabsView .body 15 | { 16 | height: 200px; 17 | } 18 | 19 | .tabsView .body div 20 | { 21 | padding: 15px; 22 | height: 60px; 23 | vertical-align: middle; 24 | text-align: center; 25 | } 26 | 27 | .tabsView .body h3 28 | { 29 | text-align:center; 30 | } 31 | 32 | .tabsView td 33 | { 34 | border: solid 1px #0000A6; 35 | border-top: none; 36 | border-right: solid 2px #1E1ED2; 37 | } 38 | 39 | .tabsView th 40 | { 41 | cursor: pointer; 42 | padding: 2px; 43 | font-weight: normal; 44 | font-style: italic; 45 | color: #888; 46 | border: solid 1px #bbb; 47 | border-right: none; 48 | background-color: #f8f8f8; 49 | border-bottom: solid 1px #1E1ED2; 50 | } 51 | 52 | .tabsView 53 | { 54 | width: 500px; 55 | border-collapse: collapse; 56 | border: none; 57 | margin-top: 20px; 58 | } 59 | 60 | .tabsView tr 61 | { 62 | border-right: solid 1px #bbb; 63 | } 64 | 65 | .tabsView th.header_true 66 | { 67 | cursor:default; 68 | font-weight: bold; 69 | border: solid 1px #0000A6; 70 | border-right: solid 2px #1E1ED2; 71 | border-bottom: solid 1px #eee; 72 | color: #0000A6; 73 | background-color: #fff; 74 | } 75 | 76 | -------------------------------------------------------------------------------- /demos/step-by-step.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 |

    jQuery Templates: Step by Step Examples

    8 |

    App Example

    9 | Movies
    10 | 11 |

    Read-only rendering

    12 |
    API: $( "#template" ).tmpl( data ).appendTo( "#list");
    13 | Local data
    14 | Remote data
    15 | 16 |
    Tags - Content
    17 | ${} and {%html%}
    18 | {%if%} and {%else%}
    19 | {%each%}
    20 | javascript demo
    21 | 22 |
    Tags - Composition
    23 | 24 | Hierarchical data - {%tmpl%}
    25 | 26 |

    Interactivity

    27 |
    Navigating through data
    28 | Switch templates: Accordion
    29 | Recursive Tree View - {%tmpl%}
    30 | Tabs View - {%wrap%}
    31 | 32 | 33 | 34 | -------------------------------------------------------------------------------- /demos/step-by-step/0_tmpl-read-only/6_hierarchical-data.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | Home
    12 | Source 13 | 14 |

    Demo: Using {%tmpl%} to render hierarchical data.

    15 | 16 | 17 | 18 | 26 | 27 | 32 | 33 | 34 | 35 |
    TitleLanguages
    36 | 37 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | -------------------------------------------------------------------------------- /demos/step-by-step/0_tmpl-read-only/1_remote-data.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Home
    10 | Source 11 | 12 |

    Demo: Render template against remote data

    13 | 14 | 15 | 16 | 19 | 20 | 21 | 22 | 23 |
    24 | 25 |
    26 | 27 | 60 | 61 | 62 | 63 | 64 | 65 | -------------------------------------------------------------------------------- /demos/step-by-step/0_tmpl-read-only/3_if-else-tag.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | Home
    12 | Source 13 | 14 |

    Demo: Using {%if%} and {%else%} to render conditional sections.

    15 | 16 | 17 | 18 | 32 | 33 | 34 | 35 |
    SynopsisTitle
    36 | 37 | 62 | 63 | 64 | 65 | 66 | 67 | -------------------------------------------------------------------------------- /demos/step-by-step/0_tmpl-read-only/4_each-tag.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | Home
    12 | Source 13 | 14 |

    Demo: Using {%each%} to render repeating sections.

    15 | 16 | 17 | 18 | 30 | 31 | 32 | 33 |
    SynopsisTitle
    34 | 35 | 71 | 72 | 73 | 74 | 75 | 76 | -------------------------------------------------------------------------------- /demos/step-by-step/0_tmpl-read-only/0_local-data-source.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | Home
    13 | Run 14 | 15 |

    Demo: Render template against local data

    16 | 17 | 18 | 19 | 22 | 23 | 24 | 25 | 39 | 40 | 41 | 42 |

    Data:

    43 | 
    var movies = [
44 | 	{ Name: "The Red Violin", ReleaseYear: "1998" },
45 | 	{ Name: "Eyes Wide Shut", ReleaseYear: "1999" },
46 | 	{ Name: "The Inheritance", ReleaseYear: "1976" }
47 | ];
    48 | 49 |

    HTML:

    50 | 
    <script id="movieTemplate" type="text/x-jquery-tmpl">
51 | 	<li>
52 | 		<b>${Name}</b> (${ReleaseYear})
53 | 	</li>
54 | </script>
55 | 
56 | <ul id="movieList"></ul>
    57 | 58 |

    Script:

    59 | 
    $( "#movieTemplate" ).tmpl( movies )
60 | 	.appendTo( "#movieList" );
    61 | 62 | 63 | 64 | -------------------------------------------------------------------------------- /demos/samplesCore/Interactive/tabsWrapImperative.html: -------------------------------------------------------------------------------- 1 | 2 | 5 | 6 | 7 | A tabs control against HTML markup, using imperative API to provide wrapped HTML content 8 | 9 | 10 | 11 | 12 |

    Tabs

    13 | 14 |
    ..loading
    15 | 16 | 17 | 18 | 19 | 35 | 36 | 52 | 53 | 72 | 73 | 74 | 75 | -------------------------------------------------------------------------------- /demos/step-by-step/0_tmpl-read-only/2_html-tag.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 14 | 15 | 16 | Home
    17 | Source 18 | 19 |

    Demo: Using ${} or {%html%} to render data values or expressions

    20 | 21 |
    25 | 26 | 27 | 28 | 34 | 35 | 36 | 37 |
    TitleSynopsis
    38 | 39 | 56 | 57 | 58 | 59 | 60 | 61 | -------------------------------------------------------------------------------- /demos/step-by-step/0_tmpl-read-only/5_javascript.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | Home
    12 | Source 13 | 14 |

    Demo: Using JavaScript expressions and functions calls within templates.

    15 | 16 | 17 | 18 | 36 | 37 | 38 | 39 |
    SynopsisTitle
    40 | 41 | 85 | 86 | 87 | 88 | 89 | 90 | -------------------------------------------------------------------------------- /demos/samplesCore/Interactive/tabsWrap.html: -------------------------------------------------------------------------------- 1 | 2 | 5 | 6 | 7 | A tabs control against HTML markup, using {{wrap}} 8 | 9 | 10 | 11 | 12 |

    Tabs

    13 | 14 |
    ..loading
    15 | 16 | 17 | 18 | 19 | 39 | 40 | 56 | 57 | 92 | 93 | 94 | 95 | -------------------------------------------------------------------------------- /demos/samplesCore/each.html: -------------------------------------------------------------------------------- 1 | 2 | 6 | 7 | 8 | 16 | 17 | 18 | 19 | 20 | 69 | 70 | 79 | 80 | 81 | 82 |
    83 | 84 | 85 | 86 | -------------------------------------------------------------------------------- /demos/step-by-step/0_tmpl-read-only/6_hierarchical-data-source.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | Home
    14 | Run 15 | 16 |

    Demo: Using {%tmpl%} to render hierarchical data.

    17 | 18 | 19 | 20 | 28 | 29 | 32 | 33 |
    34 | 35 | 36 |
    TitleLanguages
    37 |
    38 | 39 | 63 | 64 | 65 | 66 |

    Data:

    67 | 
    var movies = [
68 | 	{ Name: "Meet Joe Black",
69 | 		Languages:[
70 | 			{ Name: "English" },
71 | 			{ Name: "French" }
72 | 		]
73 | 	},
74 | 	{ Name: "Eyes Wide Shut",
75 | 		Languages:[
76 | 			{ Name: "French" },
77 | 			{ Name: "German" } ,
78 | 			{ Name: "Spanish" }
79 | 		]
80 | 	}
81 | ];
    82 | 83 |

    HTML:

    84 | 
    <script id="movieTemplate" type="text/x-jquery-tmpl">
85 | 	<tr>
86 | 		<td>${Name}</td>
87 | 		<td>{%tmpl(Languages) languageTemplate%}</td>
88 | 	</tr>
89 | </script>
90 | 
91 | <script id="languageTemplate" type="text/x-jquery-tmpl">
92 | 	<div>${Name}</div>
93 | </script>
    94 | 95 | 96 | 97 | -------------------------------------------------------------------------------- /demos/step-by-step/0_tmpl-read-only/4_each-tag-source.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | Home
    14 | Run 15 | 16 |

    Demo: Using {%each%} to render repeating sections.

    17 | 18 | 19 | 20 | 32 | 33 | 34 | 35 |
    SynopsisTitle
    36 | 37 | 73 | 74 | 75 | 76 |

    Data:

    77 | 78 | 
    var movies = [
 79 | 	{
 80 | 		Title: "Meet Joe Black",
 81 | 		Languages: [
 82 | 			{ Name: "English" },
 83 | 			{ Name: "French" }
 84 | 		]
 85 | 	}
 86 | ];
    87 | 88 |

    HTML:

    89 | 90 | 
    <script id="movieTemplate" type="text/x-jquery-tmpl">
 91 | 	<tr>
 92 | 		<td>${Title}</td>
 93 | 		<td>Languages:
 94 | 			<em>
 95 | 				{%each Languages%}
 96 | 					${$value.Name}
 97 | 				{%/each%}
 98 | 			</em>
 99 | 		</td>
100 | 	</tr>
101 | </script>
    102 | 103 | 104 | 105 | -------------------------------------------------------------------------------- /demos/samplesCore/Interactive/tabsTmpl.html: -------------------------------------------------------------------------------- 1 | 2 | 5 | 6 | 7 | A tabs control against data, using {{tmpl}} 8 | 9 | 10 | 11 | 12 |

    Tabs

    13 |
    ..loading
    14 | 15 | 16 | 17 | 18 | 26 | 27 | 30 | 31 | 35 | 36 | 75 | 76 | 77 | 78 | -------------------------------------------------------------------------------- /demos/step-by-step/0_tmpl-read-only/2_html-tag-source.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 17 | 18 | 19 | Home
    20 | Run 21 | 22 |

    Demo: Using ${} or {%html%} to render data values or expressions

    23 | 24 |
    28 | 29 | 30 | 31 | 37 | 38 | 39 | 40 |
    TitleSynopsis
    41 | 42 | 59 | 60 | 61 | 62 |

    Data:

    63 | 64 | 
    var movies = [
65 | 	{
66 | 		Title: "Eyes Wide Shut",
67 | 		Synopsis: "Director <span class='red'>Stanley Kubrick's</span> final film:<img src='...'/>"
68 | 	}
69 | ];
    70 | 71 |

    HTML:

    72 | 73 | 
    <script id="movieTemplate" type="text/x-jquery-tmpl">
74 | 	<tr>
75 | 		<td>${Title}</td>
76 | 		<td class="synopsis">{{html Synopsis}}</td>
77 | 	</tr>
78 | </script>
    79 | 80 | 81 | 82 | -------------------------------------------------------------------------------- /demos/step-by-step/0_tmpl-read-only/3_if-else-tag-source.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | Home
    14 | Run 15 | 16 |

    Demo: Using {%if%} and {%else%} to render conditional sections.

    17 | 18 | 19 | 20 | 34 | 35 | 36 | 37 |
    SynopsisTitle
    38 | 39 | 64 | 65 | 66 | 67 |

    Data:

    68 | 69 | 
    var movies = [
 70 | 	{
 71 | 		Title: "Meet Joe Black",
 72 | 		Languages: "English and French",
 73 | 		Subtitles: "English"
 74 | 	},
 75 | 	{
 76 | 		Title: "Eyes Wide Shut",
 77 | 		Subtitles: "French and Spanish"
 78 | 	},
 79 | 	{
 80 | 		Title: "The Mighty"
 81 | 	}
 82 | ];
    83 | 84 |

    HTML:

    85 | 86 | 
    <script id="movieTemplate" type="text/x-jquery-tmpl">
 87 | 	<tr>
 88 | 		<td>${Title}</td>
 89 | 		<td>
 90 | 			{%if Languages%}
 91 | 				Alternative languages: <em>${Languages}</em>.
 92 | 			{%elif Subtitles%}
 93 | 				Original language only... <br/>Subtitles in <em>${Subtitles}</em>.
 94 | 			{%else%}
 95 | 				Original version only, without subtitles.
 96 | 			{%/if%}
 97 | 		</td>
 98 | 	</tr>
 99 | </script>
    100 | 101 | 102 | 103 | -------------------------------------------------------------------------------- /demos/samplesCore/composition.html: -------------------------------------------------------------------------------- 1 | 2 | 5 | 6 | 7 | 15 | 16 | 17 | 18 | 19 | 20 | 76 | 77 | 84 | 85 | 88 | 89 | 94 | 95 |
    96 | 97 | 98 | 99 | -------------------------------------------------------------------------------- /demos/samplesCore/Interactive/tabsWrapNested.html: -------------------------------------------------------------------------------- 1 | 2 | 5 | 6 | 7 | Nested tabs controls against HTML markup, using {{wrap}} 8 | 9 | 10 | 11 | 12 |

    Tabs

    13 | 14 |
    ..loading
    15 | 16 | 17 | 18 | 19 | 54 | 55 | 71 | 72 | 114 | 115 | 116 | 117 | -------------------------------------------------------------------------------- /demos/step-by-step/0_tmpl-read-only/1_remote-data-source.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | Home
    13 | Run 14 | 15 |

    Demo: Render template against remote data

    16 | 17 | 18 | 19 | 22 | 23 | 24 |

    25 | 26 |
    27 |
    28 |
      29 |
      30 |
      31 | 32 | 65 | 66 | 67 | 68 |

      HTML:

      69 | 70 | 
      <script id="movieTemplate" type="text/x-jquery-tmpl">
 71 | 	<li>
 72 | 		<b>${Name}</b> (${ReleaseYear})
 73 | 	</li>
 74 | </script>
 75 | 
 76 | <ul id="movieList"></ul>
      77 | 78 |

      Script:

      79 | 
      $.ajax({
 80 | 
 81 | 	dataType: "jsonp",
 82 | 
 83 | 	url: "http://odata.netflix.com/Catalog/Genres('" + genre
 84 | 		+ "')/Titles?$format=json&$skip="
 85 | 		+ skip + "&$top=" + top,
 86 | 
 87 | 	jsonp: "$callback",
 88 | 
 89 | 	success: function( data ) {
 90 | 			var movies = data.d;				 // Get the movies array from the data
 91 | 
 92 | 			$( "#movieList" ).empty();			 // Remove current set of movie template items
 93 | 
 94 | 			$( "#movieTemplate" ).tmpl( movies ) // Render the template with the movies data
 95 | 				.appendTo( "#movieList" );		 // and insert the rendered HTML under the "movieList" element
 96 | 	}
 97 | });
 98 |
      99 | 100 | 101 | 102 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | jQuery Templates plugin 1.0.1 2 | ==== 3 | This is the fork of jQuery Templates that we use internally here at Kanban Solutions. We have fixed all known and encountered bugs as well as changing the syntax from the standard 4 | 5 | Docs 6 | ==== 7 | 8 | [.tmpl()](http://api.jquery.com/tmpl/) 9 | [jQuery.tmpl()](http://api.jquery.com/jquery.tmpl/) 10 | [.template()](http://api.jquery.com/template/) 11 | [jQuery.template()](http://api.jquery.com/jQuery.template/) 12 | 13 | {%= fieldNameOrExpression %} 14 | ---- 15 | Used for insertion of data values in the rendered template. Evaluates the specified field (property) on the current data item, or the specified JavaScript function or expression. 16 | 17 | _identical to the `${}` tag of the origional jQuery Templates http://api.jquery.com/template-tag-equal/_ 18 | 19 | {%html fieldNameOrExpression %} 20 | ---- 21 | Used for insertion of HTML markup strings in the rendered template. Evaluates the specified field on the current data item, or the specified JavaScript function or expression. 22 | 23 | _identical to the `{{html}}` tag of the origional jQuery Templates http://api.jquery.com/template-tag-html/_ 24 | 25 | {%if fieldNameOrExpression %} 26 | ---- 27 | Used for conditional insertion of content. Renders the content between the opening and closing template tags only if the specified data item field, JavaScript function or expression does not evaluate to false (or to zero, null, type "undefined", or the empty string ). 28 | 29 | _identical to the `{{if}}` tag of the origional jQuery Templates http://api.jquery.com/template-tag-if/_ 30 | 31 | {%elif fieldNameOrExpression %} 32 | ---- 33 | Used in association with the `{{if}}...{{/if}}` tag to provide alternative content based on the values of one or more expressions. The `{%elif%}` tag can be used with a parameter, as in: `{%if a%}...{%elif b%}...{%/if%}`. 34 | 35 | _Added because the old system actualy overloaded the else tag to handle elif as well and I didnt like that_ 36 | 37 | {%else%} 38 | ---- 39 | Used in association with the `{{if}}...{{/if}}` tag to provide alternative content based on the values of one or more expressions. The `{%else%}` tag can be used without a parameter, as in: `{%if a%}...{%elif b%}...{%else%}...{%/if%}` 40 | 41 | _almost identical to the `{{else}}` tag of the origional jQuery Templates http://api.jquery.com/template-tag-else/ but I removed the ability to do `{{else _test_}}`_ 42 | 43 | 44 | {%each( index, value ) collection %} 45 | ---- 46 | Used to iterate over a data array, and render the content between the opening and closing template tags once for each data item. 47 | 48 | _identical to the `{{each}}` tag of the origional jQuery Templates http://api.jquery.com/template-tag-each/_ 49 | 50 | 51 | {%tmpl( [data], [options] ) template %} 52 | ---- 53 | Used to iterate over a data array, and render the content between the opening and closing template tags once for each data item. 54 | 55 | _identical to the `{{tmpl}}` tag of the origional jQuery Templates http://api.jquery.com/template-tag-tmpl/_ 56 | 57 | 58 | {%wrap( [data], [options] ) template %} 59 | ---- 60 | Used for composition of templates which incorporate wrapped HTML content. Rendered template items can combine wrapped HTML content with template markup. 61 | 62 | _identical to the `{{wrap}}` tag of the origional jQuery Templates http://api.jquery.com/template-tag-wrap/_ 63 | -------------------------------------------------------------------------------- /demos/samplesTmplPlus/composition.html: -------------------------------------------------------------------------------- 1 | 2 | 10 | 11 | 12 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 77 | 78 | 85 | 86 | 89 | 90 | 93 | 94 | 99 | 100 |
      101 | 102 | 103 | 104 | -------------------------------------------------------------------------------- /demos/samplesCore/parameters.html: -------------------------------------------------------------------------------- 1 | 2 | 5 | 6 | 7 | 15 | 16 | 17 | 18 | 19 | 76 | 77 | 94 | 95 | 98 | 99 | 100 | 101 |
      102 | 103 | 104 | 105 | -------------------------------------------------------------------------------- /demos/samplesTmplPlus/basic.html: -------------------------------------------------------------------------------- 1 | 2 | 10 | 11 | 12 | 13 | 14 | 15 | 85 | 86 | 95 | 96 | 99 | 100 | 101 | 102 |
      Target
      103 | 104 | 105 | 106 | -------------------------------------------------------------------------------- /demos/step-by-step/0_tmpl-read-only/5_javascript-source.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | Home
      14 | Run 15 | 16 |

      Demo: Using JavaScript expressions and functions calls within templates.

      17 | 18 | 19 | 20 | 38 | 39 | 40 | 41 |
      SynopsisTitle
      42 | 43 | 87 | 88 | 89 | 90 |

      HTML:

      91 | 92 | 
      <script id="movieTemplate" type="text/x-jquery-tmpl">
 93 | 	<td>${Title}</td>
 94 | 	<td><b>Languages:</b>
 95 | 		<em>
 96 | 			{%each Languages%}
 97 | 				${$value.Name}{%if $index < Languages.length - 2%}, {%else $index === Languages.length - 2%} and {%/if%}
 98 | 			{%/each%}
 99 | 		</em><br/><br/>
100 | 		<b>Subtitles:</b>
101 | 		<em>
102 | 			{%each( i, lang ) Subtitles%}
103 | 				${namePlusSeparator( lang.Name, i, Subtitles.length )}
104 | 			{%/each%}
105 | 		</em>
106 | 	</td>
107 | </script>
      108 | 109 |

      Script:

      110 | 
      function namePlusSeparator( name, index, length ){
111 | 	var ret = name.toUpperCase();
112 | 	if ( index < length - 1 ) {
113 | 		if ( index === length - 2 ) {
114 | 			ret += " and";
115 | 		} else {
116 | 			ret += ",";
117 | 		}
118 | 	}
119 | 	return ret;
120 | }
      121 | 122 | 123 | 124 | -------------------------------------------------------------------------------- /demos/samplesTmplPlus/parameters.html: -------------------------------------------------------------------------------- 1 | 2 | 10 | 11 | 12 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 82 | 83 | 100 | 101 | 104 | 105 | 106 | 107 |
      108 | 109 | 110 | 111 | -------------------------------------------------------------------------------- /demos/step-by-step/1_tmpl-interactive/1_tree-view-using-tmpl-tag.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 14 | 15 | 16 | Home
      17 | Source 18 | 19 |

      Tree view: using recursive nested {%tmpl%} tags.

      20 | 21 | 22 | 23 | 24 | 25 | 39 | 40 | 43 | 44 | 101 | 102 | 103 | 104 | 105 | 106 | 5 | 6 | 7 | 8 | 13 | 14 | 15 | Home
      16 | Source 17 | 18 |

      Accordion: Using dynamic switching of templates

      19 | 20 | 21 | 22 | 27 | 28 | 36 | 37 | 42 | 43 | Click for details: 44 |
      45 |
      46 |
      47 | 48 | 119 | 120 | 121 | 122 | 123 | 124 | -------------------------------------------------------------------------------- /demos/step-by-step/1_tmpl-interactive/2_tabs-using-wrap-tag.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 21 | 22 | 23 | Home
      24 | Source 25 | 26 |

      Tab View: Using {%wrap%} for template composition incorporating wrapped HTML

      27 | 28 | 29 | 30 | 63 | 64 | 80 | 81 |
      82 |
      ..loading

      83 | 84 | 116 | 117 | 118 | 119 | 120 | 121 | -------------------------------------------------------------------------------- /demos/samplesCore/Interactive/treeView.html: -------------------------------------------------------------------------------- 1 | 2 | 5 | 6 | 7 | A tree view control using recursive templates 8 | 9 | 10 | 11 | 12 |

      Tree View

      13 | 14 |
      15 | 16 | 17 | 18 | 19 | 32 | 33 | 36 | 37 | 121 | 122 | 123 | 124 | -------------------------------------------------------------------------------- /demos/samplesCore/basic.html: -------------------------------------------------------------------------------- 1 | 2 | 5 | 6 | 7 | 13 | 14 | 15 | 16 | 17 | 117 | 118 | 131 | 132 | 135 | 136 | 137 | 138 |
      139 | 140 | 141 | 142 | -------------------------------------------------------------------------------- /tests/qunit.css: -------------------------------------------------------------------------------- 1 | /** Font Family and Sizes */ 2 | 3 | #qunit-tests, #qunit-header, #qunit-banner, #qunit-testrunner-toolbar, #qunit-userAgent, #qunit-testresult { 4 | font-family: "Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial; 5 | } 6 | 7 | #qunit-testrunner-toolbar, #qunit-userAgent, #qunit-testresult, #qunit-tests li { font-size: small; } 8 | #qunit-tests { font-size: smaller; } 9 | 10 | 11 | /** Resets */ 12 | 13 | #qunit-tests, #qunit-tests ol, #qunit-header, #qunit-banner, #qunit-userAgent, #qunit-testresult { 14 | margin: 0; 15 | padding: 0; 16 | } 17 | 18 | 19 | /** Header */ 20 | 21 | #qunit-header { 22 | padding: 0.5em 0 0.5em 1em; 23 | 24 | color: #8699a4; 25 | background-color: #0d3349; 26 | 27 | font-size: 1.5em; 28 | line-height: 1em; 29 | font-weight: normal; 30 | 31 | border-radius: 15px 15px 0 0; 32 | -moz-border-radius: 15px 15px 0 0; 33 | -webkit-border-top-right-radius: 15px; 34 | -webkit-border-top-left-radius: 15px; 35 | } 36 | 37 | #qunit-header a { 38 | text-decoration: none; 39 | color: #c2ccd1; 40 | } 41 | 42 | #qunit-header a:hover, 43 | #qunit-header a:focus { 44 | color: #fff; 45 | } 46 | 47 | #qunit-banner { 48 | height: 5px; 49 | } 50 | 51 | #qunit-testrunner-toolbar { 52 | padding: 0em 0 0.5em 2em; 53 | } 54 | 55 | #qunit-userAgent { 56 | padding: 0.5em 0 0.5em 2.5em; 57 | background-color: #2b81af; 58 | color: #fff; 59 | text-shadow: rgba(0, 0, 0, 0.5) 2px 2px 1px; 60 | } 61 | 62 | 63 | /** Tests: Pass/Fail */ 64 | 65 | #qunit-tests { 66 | list-style-position: inside; 67 | } 68 | 69 | #qunit-tests li { 70 | padding: 0.4em 0.5em 0.4em 2.5em; 71 | border-bottom: 1px solid #fff; 72 | list-style-position: inside; 73 | } 74 | 75 | #qunit-tests li strong { 76 | cursor: pointer; 77 | } 78 | 79 | #qunit-tests ol { 80 | margin-top: 0.5em; 81 | padding: 0.5em; 82 | 83 | background-color: #fff; 84 | 85 | border-radius: 15px; 86 | -moz-border-radius: 15px; 87 | -webkit-border-radius: 15px; 88 | 89 | box-shadow: inset 0px 2px 13px #999; 90 | -moz-box-shadow: inset 0px 2px 13px #999; 91 | -webkit-box-shadow: inset 0px 2px 13px #999; 92 | } 93 | 94 | #qunit-tests table { 95 | border-collapse: collapse; 96 | margin-top: .2em; 97 | } 98 | 99 | #qunit-tests th { 100 | text-align: right; 101 | vertical-align: top; 102 | padding: 0 .5em 0 0; 103 | } 104 | 105 | #qunit-tests td { 106 | vertical-align: top; 107 | } 108 | 109 | #qunit-tests pre { 110 | margin: 0; 111 | white-space: pre-wrap; 112 | word-wrap: break-word; 113 | } 114 | 115 | #qunit-tests del { 116 | background-color: #e0f2be; 117 | color: #374e0c; 118 | text-decoration: none; 119 | } 120 | 121 | #qunit-tests ins { 122 | background-color: #ffcaca; 123 | color: #500; 124 | text-decoration: none; 125 | } 126 | 127 | /*** Test Counts */ 128 | 129 | #qunit-tests b.counts { color: black; } 130 | #qunit-tests b.passed { color: #5E740B; } 131 | #qunit-tests b.failed { color: #710909; } 132 | 133 | #qunit-tests li li { 134 | margin: 0.5em; 135 | padding: 0.4em 0.5em 0.4em 0.5em; 136 | background-color: #fff; 137 | border-bottom: none; 138 | list-style-position: inside; 139 | } 140 | 141 | /*** Passing Styles */ 142 | 143 | #qunit-tests li li.pass { 144 | color: #5E740B; 145 | background-color: #fff; 146 | border-left: 26px solid #C6E746; 147 | } 148 | 149 | #qunit-tests .pass { color: #528CE0; background-color: #D2E0E6; } 150 | #qunit-tests .pass .test-name { color: #366097; } 151 | 152 | #qunit-tests .pass .test-actual, 153 | #qunit-tests .pass .test-expected { color: #999999; } 154 | 155 | #qunit-banner.qunit-pass { background-color: #C6E746; } 156 | 157 | /*** Failing Styles */ 158 | 159 | #qunit-tests li li.fail { 160 | color: #710909; 161 | background-color: #fff; 162 | border-left: 26px solid #EE5757; 163 | } 164 | 165 | #qunit-tests .fail { color: #000000; background-color: #EE5757; } 166 | #qunit-tests .fail .test-name, 167 | #qunit-tests .fail .module-name { color: #000000; } 168 | 169 | #qunit-tests .fail .test-actual { color: #EE5757; } 170 | #qunit-tests .fail .test-expected { color: green; } 171 | 172 | #qunit-banner.qunit-fail, 173 | #qunit-testrunner-toolbar { background-color: #EE5757; } 174 | 175 | 176 | /** Footer */ 177 | 178 | #qunit-testresult { 179 | padding: 0.5em 0.5em 0.5em 2.5em; 180 | 181 | color: #2b81af; 182 | background-color: #D2E0E6; 183 | 184 | border-radius: 0 0 15px 15px; 185 | -moz-border-radius: 0 0 15px 15px; 186 | -webkit-border-bottom-right-radius: 15px; 187 | -webkit-border-bottom-left-radius: 15px; 188 | } 189 | 190 | /** Fixture */ 191 | 192 | #qunit-fixture { 193 | position: absolute; 194 | top: -10000px; 195 | left: -10000px; 196 | } 197 | -------------------------------------------------------------------------------- /demos/movies/components/jquery.pager.js: -------------------------------------------------------------------------------- 1 | /* 2 | * jQuery pager plugin 3 | * Version 1.0 (12/22/2008) 4 | * @requires jQuery v1.2.6 or later 5 | * 6 | * Example at: http://jonpauldavies.github.com/JQuery/Pager/PagerDemo.html 7 | * 8 | * Copyright (c) 2008-2009 Jon Paul Davies 9 | * Dual licensed under the MIT and GPL licenses: 10 | * http://www.opensource.org/licenses/mit-license.php 11 | * http://www.gnu.org/licenses/gpl.html 12 | * 13 | * Read the related blog post and contact the author at http://www.j-dee.com/2008/12/22/jquery-pager-plugin/ 14 | * 15 | * This version is far from perfect and doesn't manage it's own state, therefore contributions are more than welcome! 16 | * 17 | * Usage: .pager({ pagenumber: 1, pagecount: 15, buttonClickCallback: PagerClickTest }); 18 | * 19 | * Where pagenumber is the visible page number 20 | * pagecount is the total number of pages to display 21 | * buttonClickCallback is the method to fire when a pager button is clicked. 22 | * 23 | * buttonClickCallback signiture is PagerClickTest = function(pageclickednumber) 24 | * Where pageclickednumber is the number of the page clicked in the control. 25 | * 26 | * The included Pager.CSS file is a dependancy but can obviously tweaked to your wishes 27 | * Tested in IE6 IE7 Firefox & Safari. Any browser strangeness, please report. 28 | */ 29 | (function($) { 30 | 31 | $.fn.pager = function(options) { 32 | 33 | var opts = $.extend({}, $.fn.pager.defaults, options); 34 | 35 | return this.each(function() { 36 | 37 | // empty out the destination element and then render out the pager with the supplied options 38 | $(this).empty().append(renderpager(parseInt(options.pagenumber), parseInt(options.pagecount), options.buttonClickCallback)); 39 | 40 | // specify correct cursor activity 41 | $('.pages li').mouseover(function() { document.body.style.cursor = "pointer"; }).mouseout(function() { document.body.style.cursor = "auto"; }); 42 | }); 43 | }; 44 | 45 | // render and return the pager with the supplied options 46 | function renderpager(pagenumber, pagecount, buttonClickCallback) { 47 | 48 | // setup $pager to hold render 49 | var $pager = $(''); 50 | 51 | // add in the previous and next buttons 52 | $pager.append(renderButton('first', pagenumber, pagecount, buttonClickCallback)).append(renderButton('prev', pagenumber, pagecount, buttonClickCallback)); 53 | 54 | // pager currently only handles 10 viewable pages ( could be easily parameterized, maybe in next version ) so handle edge cases 55 | var startPoint = 1; 56 | var endPoint = 9; 57 | 58 | if (pagenumber > 4) { 59 | startPoint = pagenumber - 4; 60 | endPoint = pagenumber + 4; 61 | } 62 | 63 | if (endPoint > pagecount) { 64 | startPoint = pagecount - 8; 65 | endPoint = pagecount; 66 | } 67 | 68 | if (startPoint < 1) { 69 | startPoint = 1; 70 | } 71 | 72 | // loop thru visible pages and render buttons 73 | for (var page = startPoint; page <= endPoint; page++) { 74 | 75 | var currentButton = $('
    • ' + (page) + '
      • '); 76 | 77 | page == pagenumber ? currentButton.addClass('pgCurrent') : currentButton.click(function() { buttonClickCallback(this.firstChild.data); }); 78 | currentButton.appendTo($pager); 79 | } 80 | 81 | // render in the next and last buttons before returning the whole rendered control back. 82 | $pager.append(renderButton('next', pagenumber, pagecount, buttonClickCallback)).append(renderButton('last', pagenumber, pagecount, buttonClickCallback)); 83 | 84 | return $pager; 85 | } 86 | 87 | // renders and returns a 'specialized' button, ie 'next', 'previous' etc. rather than a page number button 88 | function renderButton(buttonLabel, pagenumber, pagecount, buttonClickCallback) { 89 | 90 | var $Button = $('
    • ' + buttonLabel + '
      • '); 91 | 92 | var destPage = 1; 93 | 94 | // work out destination page for required button type 95 | switch (buttonLabel) { 96 | case "first": 97 | destPage = 1; 98 | break; 99 | case "prev": 100 | destPage = pagenumber - 1; 101 | break; 102 | case "next": 103 | destPage = pagenumber + 1; 104 | break; 105 | case "last": 106 | destPage = pagecount; 107 | break; 108 | } 109 | 110 | // disable and 'grey' out buttons if not needed. 111 | if (buttonLabel == "first" || buttonLabel == "prev") { 112 | pagenumber <= 1 ? $Button.addClass('pgEmpty') : $Button.click(function() { buttonClickCallback(destPage); }); 113 | } 114 | else { 115 | pagenumber >= pagecount ? $Button.addClass('pgEmpty') : $Button.click(function() { buttonClickCallback(destPage); }); 116 | } 117 | 118 | return $Button; 119 | } 120 | 121 | // pager defaults. hardly worth bothering with in this case but used as placeholder for expansion in the next version 122 | $.fn.pager.defaults = { 123 | pagenumber: 1, 124 | pagecount: 1 125 | }; 126 | 127 | })(jQuery); 128 | 129 | 130 | 131 | 132 | 133 | -------------------------------------------------------------------------------- /demos/movies/css/movies.css: -------------------------------------------------------------------------------- 1 | body 2 | { 3 | background-color: #b9090b; 4 | font-family: Verdana; 5 | font-size: 12px; 6 | } 7 | 8 | #pageBody 9 | { 10 | display: block; 11 | clear: both; 12 | position: relative; 13 | margin: auto; 14 | width: 90%; 15 | background-color: #F9F5FA; 16 | padding: 10px 15px 5px 15px; 17 | } 18 | 19 | #genres 20 | { 21 | clear: both; 22 | display: block; 23 | padding: 0; 24 | } 25 | 26 | #genres li 27 | { 28 | list-style: none; 29 | float: left; 30 | border: 1px solid #888; 31 | text-decoration: none; 32 | margin: 0 5px 0 0; 33 | padding: 5px; 34 | cursor: pointer; 35 | background-color: #fff; 36 | } 37 | 38 | #genres li:hover 39 | { 40 | border: 1px solid #003f7e; 41 | } 42 | 43 | #genres li.selected 44 | { 45 | border: 1px solid #003f7e; 46 | color: #042CCA; 47 | font-weight: 700; 48 | background: url(../images/ui-bg_glass_75_dadada_1x400.png) repeat-x 50% 50%; 49 | } 50 | 51 | #pager 52 | { 53 | width: 100%; 54 | float: left; 55 | clear: left; 56 | margin: 0 0 10px; 57 | } 58 | 59 | #pager ul.pages 60 | { 61 | display: block; 62 | border: none; 63 | text-transform: uppercase; 64 | font-size: 10px; 65 | padding: 0; 66 | } 67 | 68 | #pager ul.pages li 69 | { 70 | list-style: none; 71 | float: left; 72 | border: 1px solid #888; 73 | text-decoration: none; 74 | margin: 0 5px 0 0; 75 | padding: 5px; 76 | background-color: #fff; 77 | } 78 | 79 | #pager ul.pages li:hover 80 | { 81 | border: 1px solid #00376f; 82 | } 83 | 84 | #pager ul.pages li.pgEmpty 85 | { 86 | border: 1px solid #ccc; 87 | color: #aaa; 88 | cursor: default; 89 | } 90 | 91 | #pager ul.pages li.pgCurrent 92 | { 93 | border: 1px solid #003f7e; 94 | color: #042CCA; 95 | font-weight: 700; 96 | background: url(../images/ui-bg_glass_75_dadada_1x400.png) #dadada repeat-x 50% 50%; 97 | } 98 | 99 | #movieList 100 | { 101 | display: block; 102 | float: left; 103 | width: 49.7%; 104 | clear: both; 105 | } 106 | 107 | #movieList > div 108 | { 109 | border: 1px solid #00509f; 110 | margin-bottom: 10px; 111 | padding: 8px; 112 | background-color: #fff; 113 | height: 180px; 114 | } 115 | 116 | #movieList div div 117 | { 118 | margin-right: 8px; 119 | float: left; 120 | width: 120px; 121 | height: 150px; 122 | float: left; 123 | clear: both; 124 | } 125 | 126 | #movieList div img 127 | { 128 | height: 150px; 129 | } 130 | 131 | #movieList div br, #pageBody br 132 | { 133 | clear: both; 134 | } 135 | 136 | .buyButton 137 | { 138 | float: left; 139 | clear: both; 140 | margin-left: 6px; 141 | margin-top: 6px; 142 | } 143 | 144 | #bookingsList 145 | { 146 | border-collapse: collapse; 147 | border: 3px double #00509f; 148 | width: 49.7%; 149 | float: right; 150 | background-color: #fff; 151 | margin-bottom: 10px; 152 | } 153 | 154 | #bookingsList tr 155 | { 156 | border: 1px solid #00509f; 157 | padding: 5px 158 | } 159 | 160 | .cart td 161 | { 162 | height: 30px; 163 | border: 3px double #00509f; 164 | background-color: #F9F5FA; 165 | text-align:center; 166 | } 167 | 168 | .cart .cart-true 169 | { 170 | background-color: #E8DAEB; 171 | } 172 | 173 | .cart span.text 174 | { 175 | color: #2F5071; 176 | float:none; 177 | height: 25px; 178 | line-height: 25px; 179 | font-size: 14px; 180 | font-style: italic; 181 | border: none; 182 | } 183 | 184 | #submit, #cancel, #sort 185 | { 186 | color: #2F5071; 187 | font-weight: 700; 188 | float: right; 189 | height: 25px; 190 | line-height: 25px; 191 | font-style: italic; 192 | margin: 0 15px; 193 | } 194 | 195 | #submit, #cancel, #sortBtn 196 | { 197 | text-decoration: underline; 198 | cursor: pointer; 199 | } 200 | 201 | #submit 202 | { 203 | float: left; 204 | } 205 | 206 | .bookingTitle 207 | { 208 | color: #2F5071; 209 | font-weight: bold; 210 | background: url(../images/ui-bg_highlight-hard_100_eeeeee_1x100.png) #e6e6e6 repeat-x 50% 50%; 211 | cursor: pointer; 212 | } 213 | 214 | .bookingTitle:hover, .bookingTitleEdit:hover 215 | { 216 | background: url(../images/ui-bg_glass_75_dadada_1x400.png) #dadada repeat-x 50% 50%; 217 | } 218 | 219 | .bookingTitleEdit 220 | { 221 | color: #042CCA; 222 | font-weight: bold; 223 | background: url(../images/ui-bg_highlight-hard_100_eeeeee_1x100.png) #e6e6e6 repeat-x 50% 50%; 224 | cursor: pointer; 225 | } 226 | 227 | .bookingTitle td 228 | { 229 | padding: 8px; 230 | } 231 | 232 | .bookingTitleEdit td 233 | { 234 | padding: 7px 8px 7px 8px; 235 | } 236 | 237 | .bookingEdit div 238 | { 239 | float: right; 240 | height: 116px; 241 | } 242 | 243 | .bookingEdit .fields 244 | { 245 | float: left; 246 | } 247 | 248 | .bookingEdit .fields span 249 | { 250 | margin: 12px 0 0 8px; 251 | display: inline-block; 252 | width: 100px; 253 | } 254 | 255 | .bookingEdit .fields input 256 | { 257 | margin: 12px 0 0 8px; 258 | width: 250px; 259 | } 260 | 261 | .bookingEdit img 262 | { 263 | height: 100px; 264 | margin: 8px; 265 | } 266 | 267 | .close 268 | { 269 | background-position: -96px -128px; 270 | float: right; 271 | cursor: pointer; 272 | } 273 | 274 | .ui-icon 275 | { 276 | width: 16px; 277 | height: 16px; 278 | background-image: url(../images/ui-icons_cc0000_256x240.png); 279 | } 280 | -------------------------------------------------------------------------------- /demos/step-by-step/1_tmpl-interactive/2_tabs-using-wrap-tag-source.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 23 | 24 | 25 | Home
      26 | Run 27 | 28 |

      Tab View: Using {%wrap%} for template composition incorporating wrapped HTML

      29 | 30 | 31 | 32 | 65 | 66 | 82 | 83 |
      84 |
      ..loading
      85 | 86 | 119 | 120 | 121 | 122 |

      HTML:

      123 | 
      <script id="movieTemplate" type="text/x-jquery-tmpl">
124 | 	<h2>${Title}</h2>
125 | 
126 | 	{%wrap tabsTemplate%}
127 | 		<h3>Details</h3>
128 | 		<div>
129 | 			Title: <input value="${Title}" >
130 | 			Languages:
131 | 			{%each Languages%}<span>${$value.Name}</span>{%/each%}
132 | 		</div>
133 | 
134 | 		<h3>Description</h3>
135 | 		<div>
136 | 			... content of tab 2
137 | 		</div>
138 | 
139 | 		<h3>Comments</h3>
140 | 		<div>
141 | 			... content of tab 3
142 | 		</div>
143 | 	{%/wrap%}
144 | </script>
145 | 
146 | <script id="tabsTemplate" type="text/x-jquery-tmpl">
147 | 	<table><tbody>
148 | 		<tr>
149 | 			{%each $item.html("h3", true)%}
150 | 				<th class="header_${$index === selectedTab}">
151 | 					${$value}
152 | 				</th>
153 | 			{%/each%}
154 | 		</tr>
155 | 		<tr><td colspan='${$item.html("h3").length}'>
156 | 			<div>
157 | 				{%html $item.html("div")[selectedTab]%}
158 | 			</div>
159 | 		</td></tr>
160 | 	</tbody></table>
161 | </script>
162 |
      163 | 164 |

      Script:

      165 | 
      	function refresh() {
166 | 		$( "#tabsView" ).empty();
167 | 
168 | 		$( "#movieTemplate" ).tmpl( movie )
169 | 			.appendTo( "#tabsView" );
170 | 	}
171 | 
172 | 	$( "#tabsView" )
173 | 		.delegate( ".tabsView th", "click", function() {
174 | 			/* Set the selected tab index to this tab */
175 | 			$.tmplItem( this ).data.selectedTab = $(this).index();
176 | 
177 | 			/* update the rendering */
178 | 			refresh();
179 | 		});
      180 | 181 | 182 | -------------------------------------------------------------------------------- /demos/step-by-step/1_tmpl-interactive/0_accordion-switching-template-source.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 15 | 16 | 17 | Home
      18 | Run 19 | 20 |

      Accordion: Using dynamic switching of templates

      21 | 22 | 23 | 24 | 29 | 30 | 38 | 39 | 44 | 45 | Click for details: 46 |
      47 |
      48 |
      49 | 50 | 121 | 122 | 123 | 124 |

      Data:

      125 | 
      var movies = [
126 | 	{
127 | 		Title: "The Red Violin",
128 | 		Languages: [
129 | 			{ Name: "English" },
130 | 			{ Name: "French" }
131 | 		]
132 | 	},
133 | 	...
134 | ];
135 | ;
      136 | 137 |

      HTML:

      138 | 
      <script id="summaryTemplate" type="text/x-jquery-tmpl">
139 | 	<tr class='movieSummary'><td>
140 | 		${Title}
141 | 	</td></tr>
142 | </script>
143 | 
144 | <script id="detailTemplate" type="text/x-jquery-tmpl">
145 | 	<tr class='movieDetail'><td>
146 | 		${Title}
147 | 	</td></tr>
148 | 	<tr class='movieDetail'><td><b>Languages:</b>
149 | 		{%tmpl(Languages) languageTemplate%}
150 | 	</td></tr>
151 | </script>
152 |
      153 | 154 |

      Script:

      155 | 
      var selectedItem = null;
156 | 
157 | $("#movieList")
158 | 	.delegate( ".movieSummary", "click", function () {
159 |  		/* Unselect the currently selected item */
160 | 		unselect( selectedItem );
161 | 
162 | 		/* Get template item clicked element belongs to, and make it the selected item */
163 | 		selectedItem = $.tmplItem(this);
164 | 
165 | 		/* Swap template on this item to the detail template, and update item */
166 | 		selectedItem.tmpl = detailTemplate;
167 | 		selectedItem.update();
168 | 	})
169 | 	.delegate( ".movieDetail", "click", function () {
170 |  		/* Unselect the currently selected item */
171 | 		unselect();
172 | 	});
173 | 
174 | function unselect( tmplItem ) {
175 | 	if ( selectedItem ) {
176 | 		/* Swap template back to the summary template and update item */
177 | 		selectedItem.tmpl = summaryTemplate;
178 | 		selectedItem.update();
179 | 		selectedItem = null;
180 | 	}
181 | }
      182 | 183 | 184 | 185 | -------------------------------------------------------------------------------- /demos/step-by-step/1_tmpl-interactive/1_tree-view-using-tmpl-tag-source.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 16 | 17 | 18 | Home
      19 | Run 20 | 21 |

      Tree view: using recursive nested {%tmpl%} tags.

      22 | 23 | 24 | 25 | 26 | 27 | 41 | 42 | 45 | 46 | 103 | 104 | 105 | 106 |

      Data:

      107 | 
      var rootFolder = {
108 | 	name: "Categories",
109 | 	folders: [
110 | 		{ name: "Drama", folders: [
111 | 			{ name: "Courtroom" },
112 | 			{ name: "Political" }
113 | 		]},
114 | 		{ name: "Classic", folders: [
115 | 			{ name: "Musicals", folders: [
116 | 				{ name: "Jazz"},
117 | 				{ name: "R&B/Soul"}
118 | 			]},
119 | 		]}
120 | 	]
121 | };
122 | 
123 | /* Array for the folder items. Each item can show up in one or more folders */
124 | var movies = [
125 | 	{ name: "12 Angry Men",
126 | 		folders: [ "Courtroom" ],
127 | 		description: "A jury of 12 men must decide the fate of an 18-year-old boy."
128 | 	},
129 | 	{ name: "Word of Honor",
130 | 		folders: [ "Courtroom", "Classic" ],
131 | 		description: "One man's word against the U.S. military."
132 | 	}
133 | ];
      134 | 135 |

      HTML:

      136 | 
      <script id="folderTemplate" type="text/x-jquery-tmpl">
137 | 	<li>
138 | 		{%if hasContent($data)%}
139 | 			<span class="toggle">${$data.expanded ? "-" : "+"}</span>
140 | 		{%/if%}
141 | 		<span>${name}</span>
142 | 	</li>
143 | 	{%if expanded%}
144 | 		<li>
145 | 			<ul>{%tmpl(getFolderItems(name)) itemTemplate%}</ul>
146 | 			<ul>{%tmpl($data.folders || []) folderTemplate%}</ul>
147 | 		</li>
148 | 	{%/if%}
149 | </script>
150 | 
151 | <script id="itemTemplate" type="text/x-jquery-tmpl">
152 | 	<li class="folderItem">${name}</li>
153 | </script>
154 |
      155 | 156 |

      Script:

      157 | 
      $( "#folderTmpl" ).tmpl( folders ).appendTo( "#movieList" );
158 | 
159 | $( "#movieList" )
160 | 	.delegate( ".toggle", "click", function() {
161 | 		/* Toggle expanded property on data, then update rendering */
162 | 		var tmplItem = $.tmplItem( this );
163 | 		tmplItem.data.expanded = !tmplItem.data.expanded;
164 | 		tmplItem.update();
165 | 	})
166 | 	.delegate( ".folderItem", "click", function() {
167 | 		alert( $.tmplItem( this ).data.description );
168 | 	});
      169 | 170 | 171 | 172 | 42 | 43 | 44 | 45 | 46 | 47 | 56 | 57 | 76 | 77 | 87 | 88 | 101 | 102 | 331 | 332 | 333 | 334 | -------------------------------------------------------------------------------- /demos/movies/PagesTmplPlus/movies2.html: -------------------------------------------------------------------------------- 1 | 2 | 10 | 11 | 12 | jQuery + OData + Netflix Catalog API 13 | 14 | 15 | 16 | 17 |
      18 |

      Netflix: Book a Movie...

      19 | 20 | 28 | 29 |
      • first
      • prev
      30 | 31 |
      32 | 33 | 36 |
      34 | 0 items in Cart... 35 |
      37 |
      38 |
      39 | 40 | 41 | 42 | 43 | 44 | 45 | 54 | 55 | 74 | 75 | 85 | 86 | 99 | 100 | 340 | 341 | 342 | 343 | -------------------------------------------------------------------------------- /demos/movies/PagesTmplPlus/movies1.html: -------------------------------------------------------------------------------- 1 | 2 | 10 | 11 | 12 | jQuery + OData + Netflix Catalog API 13 | 14 | 15 | 16 | 17 |
      18 |

      Netflix: Book a Movie...

      19 | 20 | 28 | 29 |
      • first
      • prev
      30 | 31 |
      32 | 33 | 36 |
      34 | 0 items in Cart... 35 |
      37 |
      38 |
      39 | 40 | 41 | 42 | 43 | 44 | 45 | 54 | 55 | 74 | 75 | 85 | 86 | 99 | 100 | 349 | 350 | 351 | 352 | -------------------------------------------------------------------------------- /demos/movies/PagesCore/movies.html: -------------------------------------------------------------------------------- 1 | 2 | 12 | 13 | 14 | jQuery + OData + Netflix Catalog API 15 | 16 | 17 | 18 | 19 |
      20 |

      Netflix: Book a Movie...

      21 | 22 | 30 | 31 |
      • first
      • prev
      32 | 33 |
      34 | 35 | 38 |
      36 | 0 items in Cart... 37 |
      39 |
      40 |
      41 | 42 | 43 | 44 | 45 | 46 | 55 | 56 | 75 | 76 | 86 | 87 | 100 | 101 | 351 | 352 | 353 | 354 | -------------------------------------------------------------------------------- /demos/movies/PagesCore/moviesNoGlobals.html: -------------------------------------------------------------------------------- 1 | 2 | 20 | 21 | 22 | jQuery + OData + Netflix Catalog API 23 | 24 | 25 | 26 | 27 |
      28 |

      Netflix: Book a Movie...

      29 | 30 | 38 | 39 |
      • first
      • prev
      40 | 41 |
      42 | 43 | 46 |
      44 | 0 items in Cart... 45 |
      47 |
      48 |
      49 | 50 | 51 | 52 | 53 | 54 | 63 | 64 | 83 | 84 | 94 | 95 | 108 | 109 | 361 | 362 | 363 | 364 | -------------------------------------------------------------------------------- /demos/resources/syntaxhighlighter.css: -------------------------------------------------------------------------------- 1 | /** 2 | * SyntaxHighlighter 3 | * http://alexgorbatchev.com/ 4 | * 5 | * SyntaxHighlighter is donationware. If you are using it, please donate. 6 | * http://alexgorbatchev.com/wiki/SyntaxHighlighter:Donate 7 | * 8 | * @version 9 | * 2.0.296 (March 01 2009) 10 | * 11 | * @copyright 12 | * Copyright (C) 2004-2009 Alex Gorbatchev. 13 | * 14 | * @license 15 | * This file is part of SyntaxHighlighter. 16 | * 17 | * SyntaxHighlighter is free software: you can redistribute it and/or modify 18 | * it under the terms of the GNU General Public License as published by 19 | * the Free Software Foundation, either version 3 of the License, or 20 | * (at your option) any later version. 21 | * 22 | * SyntaxHighlighter is distributed in the hope that it will be useful, 23 | * but WITHOUT ANY WARRANTY; without even the implied warranty of 24 | * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 25 | * GNU General Public License for more details. 26 | * 27 | * You should have received a copy of the GNU General Public License 28 | * along with SyntaxHighlighter. If not, see . 29 | */ 30 | .syntaxhighlighter, 31 | .syntaxhighlighter div, 32 | .syntaxhighlighter code, 33 | .syntaxhighlighter span 34 | { 35 | margin: 0 !important; 36 | padding: 0 !important; 37 | border: 0 !important; 38 | outline: 0 !important; 39 | background: none !important; 40 | text-align: left !important; 41 | float: none !important; 42 | vertical-align: baseline !important; 43 | position: static !important; 44 | left: auto !important; 45 | top: auto !important; 46 | right: auto !important; 47 | bottom: auto !important; 48 | height: auto !important; 49 | width: auto !important; 50 | line-height: 1.1em !important; 51 | font-family: "Consolas", "Monaco", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace !important; 52 | font-weight: normal !important; 53 | font-style: normal !important; 54 | font-size: 1em !important; 55 | } 56 | 57 | .syntaxhighlighter 58 | { 59 | width: 100% !important; 60 | margin: 1em 0 1em 0 !important; 61 | padding: 1px !important; /* adds a little border on top and bottom */ 62 | position: relative !important; 63 | } 64 | 65 | .syntaxhighlighter .bold { 66 | font-weight: bold !important; 67 | } 68 | 69 | .syntaxhighlighter .italic { 70 | font-style: italic !important; 71 | } 72 | 73 | .syntaxhighlighter .line .number 74 | { 75 | float: left !important; 76 | width: 3em !important; 77 | padding-right: .3em !important; 78 | text-align: right !important; 79 | display: block !important; 80 | } 81 | 82 | /* Disable numbers when no gutter option is set */ 83 | .syntaxhighlighter.nogutter .line .number 84 | { 85 | display: none !important; 86 | } 87 | 88 | .syntaxhighlighter .line .content 89 | { 90 | margin-left: 3.3em !important; 91 | padding-left: .5em !important; 92 | display: block !important; 93 | } 94 | 95 | .syntaxhighlighter .line .content .block 96 | { 97 | display: block !important; 98 | padding-left: 1.5em !important; 99 | text-indent: -1.5em !important; 100 | } 101 | 102 | .syntaxhighlighter .line .content .spaces 103 | { 104 | display: none !important; 105 | } 106 | 107 | /* Disable border and margin on the lines when no gutter option is set */ 108 | .syntaxhighlighter.nogutter .line .content 109 | { 110 | margin-left: 0 !important; 111 | border-left: none !important; 112 | } 113 | 114 | .syntaxhighlighter .bar 115 | { 116 | } 117 | 118 | .syntaxhighlighter.collapsed .bar 119 | { 120 | 121 | } 122 | 123 | .syntaxhighlighter.nogutter .ruler 124 | { 125 | margin-left: 0 !important; 126 | padding-left: 0 !important; 127 | } 128 | 129 | .syntaxhighlighter .ruler 130 | { 131 | padding: 0 0 .5em .5em !important; 132 | margin-left: 3.3em !important; 133 | overflow: hidden !important; 134 | } 135 | 136 | /* Adjust some properties when collapsed */ 137 | 138 | .syntaxhighlighter.collapsed .lines, 139 | .syntaxhighlighter.collapsed .ruler 140 | { 141 | display: none !important; 142 | } 143 | 144 | /* Styles for the toolbar */ 145 | 146 | .syntaxhighlighter .toolbar 147 | { 148 | position: absolute !important; 149 | right: 0px !important; 150 | top: 0px !important; 151 | font-size: 1px !important; 152 | padding: 8px 8px 8px 0 !important; /* in px because images don't scale with ems */ 153 | } 154 | 155 | .syntaxhighlighter.collapsed .toolbar 156 | { 157 | font-size: 80% !important; 158 | padding: .2em 0 .5em .5em !important; 159 | position: static !important; 160 | } 161 | 162 | .syntaxhighlighter .toolbar a.item, 163 | .syntaxhighlighter .toolbar .item 164 | { 165 | display: block !important; 166 | float: left !important; 167 | margin-left: 8px !important; 168 | background-repeat: no-repeat !important; 169 | overflow: hidden !important; 170 | text-indent: -5000px !important; 171 | } 172 | 173 | .syntaxhighlighter.collapsed .toolbar .item 174 | { 175 | display: none !important; 176 | } 177 | 178 | .syntaxhighlighter.collapsed .toolbar .item.expandSource 179 | { 180 | background-image: url(magnifier.png) !important; 181 | display: inline !important; 182 | text-indent: 0 !important; 183 | width: auto !important; 184 | float: none !important; 185 | height: 16px !important; 186 | padding-left: 20px !important; 187 | } 188 | 189 | .syntaxhighlighter .toolbar .item.viewSource 190 | { 191 | background-image: url(page_white_code.png) !important; 192 | } 193 | 194 | .syntaxhighlighter .toolbar .item.printSource 195 | { 196 | background-image: url(printer.png) !important; 197 | } 198 | 199 | .syntaxhighlighter .toolbar .item.copyToClipboard 200 | { 201 | text-indent: 0 !important; 202 | background: none !important; 203 | overflow: visible !important; 204 | } 205 | 206 | .syntaxhighlighter .toolbar .item.about 207 | { 208 | background-image: url(help.png) !important; 209 | } 210 | 211 | /** 212 | * Print view. 213 | * Colors are based on the default theme without background. 214 | */ 215 | 216 | .syntaxhighlighter.printing, 217 | .syntaxhighlighter.printing .line.alt1 .content, 218 | .syntaxhighlighter.printing .line.alt2 .content, 219 | .syntaxhighlighter.printing .line.highlighted .number, 220 | .syntaxhighlighter.printing .line.highlighted.alt1 .content, 221 | .syntaxhighlighter.printing .line.highlighted.alt2 .content, 222 | .syntaxhighlighter.printing .line .content .block 223 | { 224 | background: none !important; 225 | } 226 | 227 | /* Gutter line numbers */ 228 | .syntaxhighlighter.printing .line .number 229 | { 230 | color: #bbb !important; 231 | } 232 | 233 | /* Add border to the lines */ 234 | .syntaxhighlighter.printing .line .content 235 | { 236 | color: #000 !important; 237 | } 238 | 239 | /* Toolbar when visible */ 240 | .syntaxhighlighter.printing .toolbar, 241 | .syntaxhighlighter.printing .ruler 242 | { 243 | display: none !important; 244 | } 245 | 246 | .syntaxhighlighter.printing a 247 | { 248 | text-decoration: none !important; 249 | } 250 | 251 | .syntaxhighlighter.printing .plain, 252 | .syntaxhighlighter.printing .plain a 253 | { 254 | color: #000 !important; 255 | } 256 | 257 | .syntaxhighlighter.printing .comments, 258 | .syntaxhighlighter.printing .comments a 259 | { 260 | color: #008200 !important; 261 | } 262 | 263 | .syntaxhighlighter.printing .string, 264 | .syntaxhighlighter.printing .string a 265 | { 266 | color: blue !important; 267 | } 268 | 269 | .syntaxhighlighter.printing .keyword 270 | { 271 | color: #069 !important; 272 | font-weight: bold !important; 273 | } 274 | 275 | .syntaxhighlighter.printing .preprocessor 276 | { 277 | color: gray !important; 278 | } 279 | 280 | .syntaxhighlighter.printing .variable 281 | { 282 | color: #a70 !important; 283 | } 284 | 285 | .syntaxhighlighter.printing .value 286 | { 287 | color: #090 !important; 288 | } 289 | 290 | .syntaxhighlighter.printing .functions 291 | { 292 | color: #ff1493 !important; 293 | } 294 | 295 | .syntaxhighlighter.printing .constants 296 | { 297 | color: #0066CC !important; 298 | } 299 | 300 | .syntaxhighlighter.printing .script 301 | { 302 | font-weight: bold !important; 303 | } 304 | 305 | .syntaxhighlighter.printing .color1, 306 | .syntaxhighlighter.printing .color1 a 307 | { 308 | color: #808080 !important; 309 | } 310 | 311 | .syntaxhighlighter.printing .color2, 312 | .syntaxhighlighter.printing .color2 a 313 | { 314 | color: #ff1493 !important; 315 | } 316 | 317 | .syntaxhighlighter.printing .color3, 318 | .syntaxhighlighter.printing .color3 a 319 | { 320 | color: red !important; 321 | } 322 | 323 | /** 324 | * SyntaxHighlighter 325 | * http://alexgorbatchev.com/ 326 | * 327 | * SyntaxHighlighter is donationware. If you are using it, please donate. 328 | * http://alexgorbatchev.com/wiki/SyntaxHighlighter:Donate 329 | * 330 | * @version 331 | * 2.0.296 (March 01 2009) 332 | * 333 | * @copyright 334 | * Copyright (C) 2004-2009 Alex Gorbatchev. 335 | * 336 | * @license 337 | * This file is part of SyntaxHighlighter. 338 | * 339 | * SyntaxHighlighter is free software: you can redistribute it and/or modify 340 | * it under the terms of the GNU General Public License as published by 341 | * the Free Software Foundation, either version 3 of the License, or 342 | * (at your option) any later version. 343 | * 344 | * SyntaxHighlighter is distributed in the hope that it will be useful, 345 | * but WITHOUT ANY WARRANTY; without even the implied warranty of 346 | * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 347 | * GNU General Public License for more details. 348 | * 349 | * You should have received a copy of the GNU General Public License 350 | * along with SyntaxHighlighter. If not, see . 351 | */ 352 | /************************************ 353 | * Default Syntax Highlighter theme. 354 | * 355 | * Interface elements. 356 | ************************************/ 357 | 358 | .syntaxhighlighter 359 | { 360 | background-color: #E7E5DC !important; 361 | } 362 | 363 | /* Highlighed line number */ 364 | .syntaxhighlighter .line.highlighted .number 365 | { 366 | background-color: #6CE26C !important; 367 | color: black !important; 368 | } 369 | 370 | /* Highlighed line */ 371 | .syntaxhighlighter .line.highlighted.alt1 .content, 372 | .syntaxhighlighter .line.highlighted.alt2 .content 373 | { 374 | background-color: #6CE26C !important; 375 | } 376 | 377 | /* Gutter line numbers */ 378 | .syntaxhighlighter .line .number 379 | { 380 | color: #5C5C5C !important; 381 | } 382 | 383 | /* Add border to the lines */ 384 | .syntaxhighlighter .line .content 385 | { 386 | border-left: 3px solid #6CE26C !important; 387 | color: #000 !important; 388 | } 389 | 390 | .syntaxhighlighter.printing .line .content 391 | { 392 | border: 0 !important; 393 | } 394 | 395 | /* First line */ 396 | .syntaxhighlighter .line.alt1 .content 397 | { 398 | background-color: #fff !important; 399 | } 400 | 401 | /* Second line */ 402 | .syntaxhighlighter .line.alt2 .content 403 | { 404 | background-color: #F8F8F8 !important; 405 | } 406 | 407 | .syntaxhighlighter .line .content .block 408 | { 409 | background: url(wrapping.png) 0 1.1em no-repeat !important; 410 | } 411 | 412 | .syntaxhighlighter .ruler 413 | { 414 | color: silver !important; 415 | background-color: #F8F8F8 !important; 416 | border-left: 3px solid #6CE26C !important; 417 | } 418 | 419 | .syntaxhighlighter.nogutter .ruler 420 | { 421 | border: 0 !important; 422 | } 423 | 424 | .syntaxhighlighter .toolbar 425 | { 426 | background-color: #F8F8F8 !important; 427 | border: #E7E5DC solid 1px !important; 428 | } 429 | 430 | .syntaxhighlighter .toolbar a 431 | { 432 | color: #a0a0a0 !important; 433 | } 434 | 435 | .syntaxhighlighter .toolbar a:hover 436 | { 437 | color: red !important; 438 | } 439 | 440 | /************************************ 441 | * Actual syntax highlighter colors. 442 | ************************************/ 443 | .syntaxhighlighter .plain, 444 | .syntaxhighlighter .plain a 445 | { 446 | color: #000 !important; 447 | } 448 | 449 | .syntaxhighlighter .comments, 450 | .syntaxhighlighter .comments a 451 | { 452 | color: #008200 !important; 453 | } 454 | 455 | .syntaxhighlighter .string, 456 | .syntaxhighlighter .string a 457 | { 458 | color: blue !important; 459 | } 460 | 461 | .syntaxhighlighter .keyword 462 | { 463 | color: #069 !important; 464 | font-weight: bold !important; 465 | } 466 | 467 | .syntaxhighlighter .preprocessor 468 | { 469 | color: gray !important; 470 | } 471 | 472 | .syntaxhighlighter .variable 473 | { 474 | color: #a70 !important; 475 | } 476 | 477 | .syntaxhighlighter .value 478 | { 479 | color: #090 !important; 480 | } 481 | 482 | .syntaxhighlighter .functions 483 | { 484 | color: #ff1493 !important; 485 | } 486 | 487 | .syntaxhighlighter .constants 488 | { 489 | color: #0066CC !important; 490 | } 491 | 492 | .syntaxhighlighter .script 493 | { 494 | background-color: yellow !important; 495 | } 496 | 497 | .syntaxhighlighter .color1, 498 | .syntaxhighlighter .color1 a 499 | { 500 | color: #808080 !important; 501 | } 502 | 503 | .syntaxhighlighter .color2, 504 | .syntaxhighlighter .color2 a 505 | { 506 | color: #ff1493 !important; 507 | } 508 | 509 | .syntaxhighlighter .color3, 510 | .syntaxhighlighter .color3 a 511 | { 512 | color: red !important; 513 | } -------------------------------------------------------------------------------- /demos/resources/syntaxhighlighter.min.js: -------------------------------------------------------------------------------- 1 | /** 2 | * SyntaxHighlighter 3 | * http://alexgorbatchev.com/ 4 | * 5 | * SyntaxHighlighter is donationware. If you are using it, please donate. 6 | * http://alexgorbatchev.com/wiki/SyntaxHighlighter:Donate 7 | * 8 | * @version 9 | * 2.0.296 (March 01 2009) 10 | * 11 | * @copyright 12 | * Copyright (C) 2004-2009 Alex Gorbatchev. 13 | * 14 | * @license 15 | * This file is part of SyntaxHighlighter. 16 | * 17 | * SyntaxHighlighter is free software: you can redistribute it and/or modify 18 | * it under the terms of the GNU General Public License as published by 19 | * the Free Software Foundation, either version 3 of the License, or 20 | * (at your option) any later version. 21 | * 22 | * SyntaxHighlighter is distributed in the hope that it will be useful, 23 | * but WITHOUT ANY WARRANTY; without even the implied warranty of 24 | * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 25 | * GNU General Public License for more details. 26 | * 27 | * You should have received a copy of the GNU General Public License 28 | * along with SyntaxHighlighter. If not, see . 29 | */ 30 | eval(function(e,d,a,c,b,f){b=function(a){return(a35?String.fromCharCode(a+29):a.toString(36))};if(!"".replace(/^/,String)){while(a--)f[b(a)]=c[a]||b(a);c=[function(a){return f[a]}];b=function(){return"\\w+"};a=1}while(a--)if(c[a])e=e.replace(new RegExp("\\b"+b(a)+"\\b","g"),c[a]);return e}('f(!1o.31){p 31=h(){p l={5S:{"1e-1c":"","73-2E":1,"2a-1P":u,"1I":u,"6T-6S":U,"1F-1P":4,"5F":O,"5x":U,"1q":U,"5v":O,"6i-6p":U,"6J":O},Q:{5D:u,5i:16,5k:16,7P:O,7I:"5L",1b:{4e:"91 1i",3Y:"92 1i",5l:"93 90 6K",6X:"8Z I 8W 1X 8X 6K 8Y",3u:"3u",6h:"?",1u:"31\\n\\n",5Z:"94\'t 95 7J C: ",7z:"9b 9c\'t 9a C 2j-2n 99: ",6B:"<2j 8G=\\"2y://7A.7E.7o/8D/8E\\"><70><8F 2y-8L=\\"8M-8S\\" 5h=\\"2c/2j; 8T=8R-8\\" /><36>8Q 31<2R 1f=\\"2a-7T:8N,\'7h 8O 8P\',7h,7L;9d-53:#9e;53:#9D;2a-1P:9E;2c-8i:85;\\">3184 2.0.9O (9M 9L 6H)2y://6a.4a9w I 9k 9l.9m 9j-6H 9i 9f."},7j:O},1p:{59:u,3q:u,3o:u,5j:{}},30:{},8a:{9g:/\\/\\*[\\s\\S]*?\\*\\//4M,9h:/\\/\\/.*$/4M,9n:/#.*$/4M,9o:/"(?:\\.|(\\\\\\")|[^\\""\\n])*"/g,9u:/\'(?:\\.|(\\\\\\\')|[^\\\'\'\\n])*\'/g,9v:/"(?:\\.|(\\\\\\")|[^\\""])*"/g,9t:/\'(?:\\.|(\\\\\\\')|[^\\\'\'])*\'/g,3e:/\\w+:\\/\\/[\\w-.\\/?%&=]*/g,9s:{E:/(&1C;|<)\\?=?/g,17:/\\?(&2m;|>)/g},9p:{E:/(&1C;|<)%=?/g,17:/%(&2m;|>)/g},9q:{E:/(&1C;|<)\\s*2n.*?(&2m;|>)/47,17:/(&1C;|<)\\/\\s*2n\\s*(&2m;|>)/47}},1q:{15:h(32){p 38=J.1t("37"),4L=l.1q.77;38.Y="1q";C(p 2N 1X 4L){p 6j=4L[2N],4G=R 6j(32),22=4G.15();32.5E[2N]=4G;f(22==u){1V}f(9r(22)=="9P"){22=l.1q.6C(22,32.1j,2N)}22.Y+="8w "+2N;38.1z(22)}q 38},6C:h(4v,6O,4w){p a=J.1t("a"),5e=a.1f,4F=l.Q,57=4F.5i,5c=4F.5k;a.2q="#"+4w;a.36=4v;a.5P=6O;a.6c=4w;a.1r=4v;f(5z(57)==O){5e.1N=57+"5H"}f(5z(5c)==O){5e.2u=5c+"5H"}a.8q=h(e){8j{l.1q.6f(c,e||1o.6g,c.5P,c.6c)}8m(e){l.B.1u(e.6F)}q O};q a},6f:h(7i,7a,5T,7O,72){p 4Y=l.1p.5j[5T],45;f(4Y==u||(45=4Y.5E[7O])==u){q u}q 45.2h(7i,7a,72)},77:{4e:h(4p){c.15=h(){f(4p.T("5v")!=U){q}q l.Q.1b.4e};c.2h=h(4q,8v,8B){p z=4p.z;4q.71.51(4q);z.Y=z.Y.D("5t","")}},3Y:h(8g){c.15=h(){q l.Q.1b.3Y};c.2h=h(8p,8o,8t){p 33=l.B.3d(8g.5r).D(/"+33+"");2b.J.4N()}},5l:h(4S){p 3x,8y,5M=4S.1j;c.15=h(){p 2A=l.Q;f(2A.5D==u){q u}h 1L(5C){p 5s="";C(p 5A 1X 5C){5s+="<8z 1c=\'"+5A+"\' 1W=\'"+5C[5A]+"\'/>"}q 5s};h 2p(43){p 5p="";C(p 5o 1X 43){5p+=" "+5o+"=\'"+43[5o]+"\'"}q 5p};p 48={1N:2A.5i,2u:2A.5k,1j:5M+"ai",6z:"bu/x-74-79",36:l.Q.1b.5l},46={bl:"bm",bx:"bA",bz:"5P="+5M,bF:"O"},4t=2A.5D,35;f(/aQ/i.1R(61.6b)){35="<8h"+2p({aT:"bd:bf-b9-b5-b4-b7",b8:"2y://ba.be.4a/bb/74/bc/79/b3.b2#84=9,0,0,0"})+2p(48)+">"+1L(46)+1L({aU:4t})+""}F{35=""}3x=J.1t("z");3x.1r=35;q 3x};c.2h=h(aV,aW,4R){p 68=4R.b1;6V(68){2J"7C":p 5d=l.B.2W(l.B.3d(4S.5r).D(/&1C;/g,"<").D(/&2m;/g,">").D(/&b0;/g,"&"));f(1o.6e){1o.6e.aZ("2c",5d)}F{q l.B.2W(5d)}2J"aX":l.B.1u(l.Q.1b.6X);2B;2J"aY":l.B.1u(4R.6F);2B}}},bh:h(4I){c.15=h(){q l.Q.1b.3u};c.2h=h(bg,by,bB){p 25=J.1t("bG"),1J=u;f(l.1p.3o!=u){J.2R.51(l.1p.3o)}l.1p.3o=25;25.1f.bC="bE:bD;1N:6m;2u:6m;E:-6l;4z:-6l;";J.2R.1z(25);1J=25.4J.J;6t(1J,1o.J);1J.3t(""+4I.z.1r+"");1J.4N();25.4J.4A();25.4J.3u();h 6t(6A,6s){p 2S=6s.7M("4K");C(p i=0;i<2S.v;i++){f(2S[i].6r.bk()=="6q"&&/bi\\.12$/.1R(2S[i].2q)){6A.3t("<4K 6z=\\"2c/12\\" 6r=\\"6q\\" 2q=\\""+2S[i].2q+"\\">")}}}}},bj:h(bo){c.15=h(){q l.Q.1b.6h};c.2h=h(bv,bt){p 2b=l.B.4y("","4P",bq,bs,"6n=0"),1J=2b.J;1J.3t(l.Q.1b.6B);1J.4N();2b.4A()}}}},B:{5m:h(6R){q 6R+3z.aN(3z.aa()*ab).2f()},5u:h(4E,4x){p 3l={},1S;C(1S 1X 4E){3l[1S]=4E[1S]}C(1S 1X 4x){3l[1S]=4x[1S]}q 3l},7w:h(4u){6V(4u){2J"U":q U;2J"O":q O}q 4u},4y:h(3e,6M,4D,4C,2I){p x=(6N.1N-4D)/2,y=(6N.2u-4C)/2;2I+=", E="+x+", 4z="+y+", 1N="+4D+", 2u="+4C;2I=2I.D(/^,/,"");p 4Q=1o.9Q(3e,6M,2I);4Q.4A();q 4Q},78:h(1A,29,23){f(1A.6D){1A["e"+29+23]=23;1A[29+23]=h(){1A["e"+29+23](1o.6g)};1A.6D("a6"+29,1A[29+23])}F{1A.a7(29,23,O)}},1u:h(A){1u(l.Q.1b.1u+A)},4c:h(5a,5Y){p 2k=l.1p.59,3j=u;f(2k==u){2k={};C(p 55 1X l.30){p 3g=l.30[55].ac;f(3g==u){1V}C(p i=0;i<3g.v;i++){2k[3g[i]]=55}}l.1p.59=2k}3j=l.30[2k[5a]];f(3j==u&&5Y!=O){l.B.1u(l.Q.1b.5Z+5a)}q 3j},42:h(A,60){p 2T=A.21("\\n");C(p i=0;i<2T.v;i++){2T[i]=60(2T[i])}q 2T.4h("\\n")},6x:h(){p z=J.1t("z"),3h=J.1t("z"),6d=10,i=1;28(i<=aO){f(i%6d===0){z.1r+=i;i+=(i+"").v}F{z.1r+="&ah;";i++}}3h.Y="5F 2E";3h.1z(z);q 3h},6U:h(A){q A.D(/^[ ]*[\\n]+|[\\n]*[ ]*$/g,"")},7d:h(A){p 3i,4V={},5b=R M("^\\\\[(?<54>(.*?))\\\\]$"),69=R M("(?<1c>[\\\\w-]+)"+"\\\\s*:\\\\s*"+"(?<1W>"+"[\\\\w-%#]+|"+"\\\\[.*?\\\\]|"+"\\".*?\\"|"+"\'.*?\'"+")\\\\s*;?","g");28((3i=69.N(A))!=u){p 2g=3i.1W.D(/^[\'"]|[\'"]$/g,"");f(2g!=u&&5b.1R(2g)){p m=5b.N(2g);2g=m.54.v>0?m.54.21(/\\s*,\\s*/):[]}4V[3i.1c]=2g}q 4V},80:h(A,12){f(A==u||A.v==0||A=="\\n"){q A}A=A.D(/"+2i+""})}q A},7f:h(66,67){p 2Z=66.2f();28(2Z.v<67){2Z="0"+2Z}q 2Z},5y:h(){p 3b=J.1t("z"),3f,3a=0,52=J.2R,1j=l.B.5m("5y"),2O="",4W="";3b.1r=2O+"6L\\">"+2O+"26\\">"+2O+"2E\\">"+2O+"5h"+"\\"><1T 1e=\\"7V\\"><1T 1j=\\""+1j+"\\">&1O;"+4W+4W+2Q+2Q+2Q+2Q;52.1z(3b);3f=J.a5(1j);f(/a4/i.1R(61.6b)){p 5Q=1o.9V(3f,u);3a=7l(5Q.9W("1N"))}F{3a=3f.9U}52.51(3b);q 3a},6Q:h(7R,6Y){p 1F="";C(p i=0;i<6Y;i++){1F+=" "}q 7R.D(/\\t/g,1F)},6P:h(2P,41){p 9T=2P.21("\\n"),1F="\\t",5f="";C(p i=0;i<50;i++){5f+=" "}h 7X(3c,18,7Z){q 3c.1M(0,18)+5f.1M(0,7Z)+3c.1M(18+1,3c.v)};2P=l.B.42(2P,h(20){f(20.1h(1F)==-1){q 20}p 18=0;28((18=20.1h(1F))!=-1){p 7U=41-18%41;20=7X(20,18,7U)}q 20});q 2P},3d:h(A){q(l.Q.7P==U)?A.D(/|&1C;br\\s*\\/?&2m;/47,"\\n"):A},3P:h(A){q A.D(/\\s*$/g,"").D(/^\\s*/,"")},2W:h(A){p 1Q=l.B.3d(A).21("\\n"),9X=R 5B(),7S=/^\\s*/,24=9Y;C(p i=0;i<1Q.v&&24>0;i++){p 3V=1Q[i];f(l.B.3P(3V).v==0){1V}p 3S=7S.N(3V);f(3S==u){q A}24=3z.24(3S[0].v,24)}f(24>0){C(p i=0;i<1Q.v;i++){1Q[i]=1Q[i].1M(24)}}q 1Q.4h("\\n")},7B:h(2L,2K){f(2L.H<2K.H){q-1}F{f(2L.H>2K.H){q 1}F{f(2L.v<2K.v){q-1}F{f(2L.v>2K.v){q 1}}}}q 0},2D:h(8d,2G){h 8e(3W,81){q[R l.4i(3W[0],3W.H,81.12)]};p a2=0,3X=u,3y=[],8c=2G.4m?2G.4m:8e;28((3X=2G.3D.N(8d))!=u){3y=3y.2H(8c(3X,2G))}q 3y},6o:h(8f){q 8f.D(l.8a.3e,h(m){q""+m+""})}},1I:h(7c,4l){h 88(4s){p 49=[];C(p i=0;i<4s.v;i++){49.K(4s[i])}q 49};p 3m=4l?[4l]:88(J.7M(l.Q.7I)),7g="1r",2t=u;f(3m.v===0){q}C(p i=0;i<3m.v;i++){p 2F=3m[i],2s=l.B.7d(2F.Y),2Y;2s=l.B.5u(7c,2s);2Y=2s["7J"];f(2Y==u){1V}f(2s["2j-2n"]=="U"){2t=R l.44(2Y)}F{p 4o=l.B.4c(2Y);f(4o){2t=R 4o()}F{1V}}2t.1I(2F[7g],2s);p 2l=2t.z;f(l.Q.7j){2l=J.1t("a0");2l.1W=2t.z.1r;2l.1f.1N="aj";2l.1f.2u="aE"}2F.71.aF(2l,2F)}},aD:h(76){l.B.78(1o,"aC",h(){l.1I(76)})}};l.4i=h(4j,75,12){c.1W=4j;c.H=75;c.v=4j.v;c.12=12};l.4i.Z.2f=h(){q c.1W};l.44=h(4g){p 1H=l.B.4c(4g),4f=R l.30.aA(),aB=u;f(1H==u){q}1H=R 1H();c.4X=4f;f(1H.3K==u){l.B.1u(l.Q.1b.7z+4g);q}4f.4B.K({3D:1H.3K.I,4m:7F});h 39(4d,7G){C(p j=0;j<4d.v;j++){4d[j].H+=7G}};h 7F(14,aH){p 7x=14.I,1E=[],4k=1H.4B,7p=14.H+14.E.v,2X=1H.3K,1n;C(p i=0;i<4k.v;i++){1n=l.B.2D(7x,4k[i]);39(1n,7p);1E=1E.2H(1n)}f(2X.E!=u&&14.E!=u){1n=l.B.2D(14.E,2X.E);39(1n,14.H);1E=1E.2H(1n)}f(2X.17!=u&&14.17!=u){1n=l.B.2D(14.17,2X.17);39(1n,14.H+14[0].aM(14.17));1E=1E.2H(1n)}q 1E}};l.44.Z.1I=h(7u,7t){c.4X.1I(7u,7t);c.z=c.4X.z};l.87=h(){};l.87.Z={T:h(7v,7n){p 5J=c.1L[7v];q l.B.7w(5J==u?7n:5J)},15:h(7y){q J.1t(7y)},7m:h(5G){C(p i=0;i2V.H)&&(5G.H<2V.H+2V.v)){q U}}q O},6v:h(3v,7D){p 2e=[];f(3v!=u){C(p i=0;i<3v.v;i++){2e=2e.2H(l.B.2D(7D,3v[i]))}}2e=2e.aL(l.B.7B);q 2e},6u:h(){C(p i=0;i"+""+82+"."+"<1T 1e=\\"5h\\">"+(1D!=u?""+1D.D(/\\s/g,"&1O;")+"":"")+"<1T 1e=\\"7V\\" 1f=\\"5n-E: "+2w+"5H !aq;\\">"+1s+""+""+""}q 2C},6w:h(5N,5K){p 18=0,3n="",3r=l.B.80;C(p i=0;i<5K.v;i++){p 1y=5K[i];f(1y===u||1y.v===0){1V}3n+=3r(5N.1M(18,1y.H-18),"63")+3r(1y.1W,1y.12);18=1y.H+1y.v}3n+=3r(5N.1M(18),"63");q 3n},1I:h(1g,5R){p am=l.Q,3p=l.1p,z,34;c.1L={};c.z=u;c.26=u;c.I=u;c.2d=u;c.5E={};c.1j=l.B.5m("ar");3p.5j[c.1j]=c;f(1g===u){1g=""}f(3p.3q===u){3p.3q=l.B.5y()}c.1L=l.B.5u(l.5S,5R||{});f(c.T("6J")==U){c.1L.1q=c.1L.5x=O}c.z=z=c.15("37");c.26=c.15("37");c.26.Y="26";z.Y="6L";z.1j=c.1j;f(c.T("5v")){z.Y+=" 5t"}f(c.T("5x")==O){z.Y+=" ax"}z.Y+=" "+c.T("1e-1c");z.1f.av=c.T("2a-1P","");c.5r=1g;c.I=l.B.6U(1g).D(/\\r/g," ");34=c.T("1F-1P");c.I=c.T("6T-6S")==U?l.B.6P(c.I,34):l.B.6Q(c.I,34);c.I=l.B.2W(c.I);f(c.T("1q")){c.2d=c.15("37");c.2d.Y="2d";c.2d.1z(l.1q.15(c));z.1z(c.2d)}f(c.T("5F")){z.1z(l.B.6x())}z.1z(c.26);c.1Y=c.6v(c.4B,c.I);c.6u();1g=c.6w(c.I,c.1Y);1g=c.6k(l.B.3P(1g));f(c.T("6i-6p")){1g=l.B.6o(1g)}c.26.1r=1g},au:h(A){A=A.D(/^\\s+|\\s+$/g,"").D(/\\s+/g,"\\\\b|\\\\b");q"\\\\b"+A+"\\\\b"},at:h(2z){c.3K={E:{3D:2z.E,12:"2n"},17:{3D:2z.17,12:"2n"},I:R M("(?"+2z.E.1i+")"+"(?.*?)"+"(?<17>"+2z.17.1i+")","aw")}}};q l}()}f(!5B.1h){5B.Z.1h=h(5V,3J){3J=3z.as(3J||0,0);C(p i=3J;i|[65]{[^}]+})[\\S\\s]?|\\((?=\\?(?!#|<[\\w$]+>)))+|(\\()(?:\\?(?:(#)[^)]*\\)|<([$\\w]+)>))?|\\\\(?:k<([\\w$]+)>|[65]{([^}]+)})|(\\[\\^?)|([\\S\\s])/g,al:/(?:[^$]+|\\$(?![1-9$&`\']|{[$\\w]+}))+|\\$(?:([1-9]\\d*|[$&`\'])|{([$\\w]+)})/g,3F:/^(?:\\s+|#.*)+/,3R:/^(?:[?*+]|{\\d+(?:,\\d*)?})/,7H:/&&\\[\\^?/g,7q:/]/g},7N=h(5I,7Y,7K){C(p i=7K||0;i<5I.v;i++){f(5I[i]===7Y){q i}}q-1},7k=/()??/.N("")[1]!==3A,3L={};M=h(1d,1U){f(1d 4T V){f(1U!==3A){3G 62("56\'t 58 an 6G ao 5X V ap ay")}q 1d.3I()}p 1U=1U||"",7s=1U.1h("s")>-1,7r=1U.1h("x")>-1,4b=O,3C=[],13=[],11=1G.11,G,3N,3O,3E,3B;11.L=0;28(G=2v.N.2x(11,1d)){f(G[2]){f(!1G.3R.1R(1d.19(11.L))){13.K("(?:)")}}F{f(G[1]){3C.K(G[3]||u);f(G[3]){4b=U}13.K("(")}F{f(G[4]){3E=7N(3C,G[4]);13.K(3E>-1?"\\\\"+(3E+1)+(5z(1d.5O(11.L))?"":"(?:)"):G[0])}F{f(G[5]){13.K(3L.6Z?3L.6Z.7C(G[5],G[0].5O(1)==="P"):G[0])}F{f(G[6]){f(1d.5O(11.L)==="]"){13.K(G[6]==="["?"(?!)":"[\\\\S\\\\s]");11.L++}F{3N=M.6E("&&"+1d.19(G.H),1G.7H,1G.7q,"",{5W:"\\\\"})[0];13.K(G[6]+3N+"]");11.L+=3N.v+1}}F{f(G[7]){f(7s&&G[7]==="."){13.K("[\\\\S\\\\s]")}F{f(7r&&1G.3F.1R(G[7])){3O=2v.N.2x(1G.3F,1d.19(11.L-1))[0].v;f(!1G.3R.1R(1d.19(11.L-1+3O))){13.K("(?:)")}11.L+=3O-1}F{13.K(G[7])}}}F{13.K(G[0])}}}}}}}3B=V(13.4h(""),2v.D.2x(1U,/[aG]+/g,""));3B.1v={1i:1d,2o:4b?3C:u};q 3B};M.ak=h(1c,o){3L[1c]=o};V.Z.N=h(A){p 1a=2v.N.2x(c,A),1c,i,5g;f(1a){f(7k&&1a.v>1){5g=R V("^"+c.1i+"$(?!\\\\s)",c.3U());2v.D.2x(1a[0],5g,h(){C(i=1;i<7b.v-2;i++){f(7b[i]===3A){1a[i]=3A}}})}f(c.1v&&c.1v.2o){C(i=1;i<1a.v;i++){1c=c.1v.2o[i-1];f(1c){1a[1c]=1a[i]}}}f(c.3H&&c.L>(1a.H+1a[0].v)){c.L--}}q 1a}})()}V.Z.3U=h(){q(c.3H?"g":"")+(c.9Z?"i":"")+(c.6W?"m":"")+(c.3F?"x":"")+(c.a1?"y":"")};V.Z.3I=h(7Q){p 3T=R M(c.1i,(7Q||"")+c.3U());f(c.1v){3T.1v={1i:c.1v.1i,2o:c.1v.2o?c.1v.2o.19(0):u}}q 3T};V.Z.2x=h(a3,A){q c.N(A)};V.Z.9S=h(9R,7W){q c.N(7W[0])};M.3Z=h(4r,4Z){p 40="/"+4r+"/"+(4Z||"");q M.3Z[40]||(M.3Z[40]=R M(4r,4Z))};M.3M=h(A){q A.D(/[-[\\]{}()*+?.\\\\^$|,#\\s]/g,"\\\\$&")};M.6E=h(A,E,W,1k,2M){p 2M=2M||{},2U=2M.5W,X=2M.af,1k=1k||"",4O=1k.1h("g")>-1,6y=1k.1h("i")>-1,5U=1k.1h("m")>-1,4H=1k.1h("y")>-1,1k=1k.D(/y/g,""),E=E 4T V?(E.3H?E:E.3I("g")):R M(E,"g"+1k),W=W 4T V?(W.3H?W:W.3I("g")):R M(W,"g"+1k),1K=[],2r=0,1m=0,1l=0,1x=0,27,1Z,1w,1B,3Q,4n;f(2U){f(2U.v>1){3G ae("56\'t 58 ag ad 5X 3M 6I")}f(5U){3G 62("56\'t 58 3M 6I 6G a8 a9 6W aP")}3Q=M.3M(2U);4n=R V("^(?:"+3Q+"[\\\\S\\\\s]|(?:(?!"+E.1i+"|"+W.1i+")[^"+3Q+"])+)+",6y?"i":"")}28(U){E.L=W.L=1l+(2U?(4n.N(A.19(1l))||[""])[0].v:0);1w=E.N(A);1B=W.N(A);f(1w&&1B){f(1w.H<=1B.H){1B=u}F{1w=u}}f(1w||1B){1m=(1w||1B).H;1l=(1w?E:W).L}F{f(!2r){2B}}f(4H&&!2r&&1m>1x){2B}f(1w){f(!2r++){27=1m;1Z=1l}}F{f(1B&&2r){f(!--2r){f(X){f(X[0]&&27>1x){1K.K([X[0],A.19(1x,27),1x,27])}f(X[1]){1K.K([X[1],A.19(27,1Z),27,1Z])}f(X[2]){1K.K([X[2],A.19(1Z,1m),1Z,1m])}f(X[3]){1K.K([X[3],A.19(1m,1l),1m,1l])}}F{1K.K(A.19(1Z,1m))}1x=1l;f(!4O){2B}}}F{E.L=W.L=0;3G b6("bw bp 8l 8u 8A")}}f(1m===1l){1l++}}f(4O&&!4H&&X&&X[0]&&A.v>1x){1K.K([X[0],A.19(1x),1x,A.v])}E.L=W.L=0;q 1K};',62,725,"||||||||||||this|||if||function||||sh||||var|return||||null|length||||div|str|utils|for|replace|left|else|_109|index|code|document|push|lastIndex|XRegExp|exec|false||config|new||getParam|true|RegExp|_121|vN|className|prototype||part|css|_107|_c3|create||right|pos|slice|_111|strings|name|_101|class|style|_ed|indexOf|source|id|_122|_12d|_12c|_ca|window|vars|toolbar|innerHTML|_e0|createElement|alert|_x|_131|_12e|_ec|appendChild|obj|_132|lt|_e5|_c6|tab|lib|_bd|highlight|doc|_12a|params|substr|width|nbsp|size|_97|test|_4b|span|_102|continue|value|in|matches|_130|_91|split|_8|_57|min|_3c|lines|_12f|while|_56|font|wnd|text|bar|_d7|toString|_6e|execute|_75|html|_5b|_b7|gt|script|captureNames|attributes|href|_12b|_b4|_b1|height|_f8|_e1|call|http|_f4|_28|break|_da|getMatches|line|_b3|_a1|concat|_51|case|m2|m1|_123|_5|_80|_88|_81|body|_40|_62|_124|_d4|unindent|_c9|_b5|_7a|brushes|SyntaxHighlighter|_2|_22|_f2|_32|title|DIV|_3|offsetMatches|_7d|_7b|_8e|fixForBlogger|url|_7c|_5e|_65|_6a|_5c|_76|_4a|_af|_e9|printFrame|_f0|spaceWidth|_ea|_dc|write|print|_d5|_db|_25|_a6|Math|undefined|_10d|_106|regex|_10c|extended|throw|global|addFlags|_f6|htmlScript|_100|escape|cc|len|trim|_133|quantifier|_9d|_116|getNativeFlags|_9c|_a2|_a5|viewSource|cache|key|_89|eachLine|_2c|HtmlScript|_18|_30|gi|_2f|_ad|com|_105|findBrush|_c0|expandSource|_be|_bc|join|Match|_b9|_c7|_ab|func|esc|_b6|_19|_1a|_11b|_ac|swf|_4c|_9|_b|_49|popup|top|focus|regexList|_50|_4f|_48|_e|_7|_129|_38|contentWindow|link|_4|gm|close|_126|_blank|win|_35|_24|instanceof|_73|_6b|_82|xmlBrush|_17|_11c||removeChild|_7e|color|values|_5d|can|_f|supply|discoveredBrushes|_59|_6c|_10|_37|_d|_8c|r2|content|toolbarItemWidth|highlighters|toolbarItemHeight|copyToClipboard|guid|margin|_2e|_2d|String|originalCode|_2a|collapsed|merge|collapse|_e2|gutter|measureSpace|isNaN|_2b|Array|_29|clipboardSwf|toolbarCommands|ruler|_d2|px|_fb|_d0|_e7|pre|_27|_e6|charAt|highlighterId|_83|_ee|defaults|_14|_128|_f5|escapeChar|one|_5a|noBrush|_61|navigator|TypeError|plain|match|pP|_78|_79|_36|_6d|alexgorbatchev|userAgent|commandName|_66|clipboardData|executeCommand|event|help|auto|_6|createDisplayLines|500px|0px|scrollbars|processUrls|links|stylesheet|rel|_3f|copyStyles|removeNestedMatches|findMatches|processMatches|createRuler|_127|type|_3e|aboutDialog|createButton|attachEvent|matchRecursive|message|when|2009|character|light|clipboard|syntaxhighlighter|_4e|screen|_a|processSmartTabs|processTabs|_47|tabs|smart|trimFirstAndLastLines|switch|multiline|copyToClipboardConfirmation|_85|unicode|head|parentNode|_16|first|shockwave|_ba|_b8|items|addEvent|flash|_13|arguments|_aa|parseParams|_dd|padNumber|_b0|Times|_12|debug|_ff|parseInt|isMatchNested|_cf|org|_c8|classRight|_104|_103|_cd|_cc|_ce|toBoolean|_c5|_d1|brushNotHtmlScript|www|matchesSortCallback|get|_d6|w3|process|_c1|classLeft|tagName|brush|_fd|serif|getElementsByTagName|_fa|_15|bloggerMode|_115|_84|_99|family|_93|block|args|insertSpaces|_fc|_90|decorate|_a3|_e3|_e4|version|center|xhtml1|Highlighter|toArray|_de|regexLib|DTD|_a7|_a0|defaultAdd|_a8|_1e|object|align|try|resizable|contains|catch|400|_20|_1f|onclick|750|menubar|_21|unbalanced|_1b|item|location|_26|param|delimiters|_1c|sans|1999|xhtml|meta|xmlns|dtd|EN|TR|transitional|equiv|Content|Georgia|New|Roman|About|utf|Type|charset|Transitional|XHTML|is|your|now|The|to|expand|view|copy|Can|find|DOCTYPE|PUBLIC|W3C|option|configured|Brush|wasn|background|fff|Gorbatchev|multiLineCComments|singleLineCComments|Alex|2004|syntax|highlighter|Copyright|singleLinePerlComments|doubleQuotedString|aspScriptTags|scriptScriptTags|typeof|phpScriptTags|multiLineSingleQuotedString|singleQuotedString|multiLineDoubleQuotedString|JavaScript|none|Helvetica|xx|large|Arial|Geneva|000|1em|3em|75em|bottom|target|0099FF|decoration|01|March|4em|296|string|open|_119|apply|_8a|offsetWidth|getComputedStyle|getPropertyValue|_98|1000|ignoreCase|textarea|sticky|_a4|_117|opera|getElementById|on|addEventListener|using|the|random|1000000|aliases|than|SyntaxError|valueNames|more|middot|_clipboard|70em|addPlugin|replaceVar|_ef|flags|constructing|from|important|highlighter_|max|forHtmlScript|getKeywords|fontSize|sgi|nogutter|another|spaces|Xml|_bf|load|all|30em|replaceChild|sx|_c4|highlighted|number|alt|sort|lastIndexOf|round|150|flag|msie|src|embed|classid|movie|_33|_34|ok|error|setData|amp|command|cab|swflash|96b8|11cf|Error|444553540000|codebase|ae6d|download|pub|cabs|clsid|macromedia|d27cdb6e|_39|printSource|shCore|about|toLowerCase|allowScriptAccess|always|printing|_42|data|500||250|_44|application|_43|subject|wmode|_3a|flashVars|transparent|_3b|cssText|absolute|position|menu|IFRAME".split("|"),0,{}));SyntaxHighlighter.brushes.JScript=function(){var a="abstract boolean break byte case catch char class const continue debugger default delete do double else enum export extends false final finally float for function goto if implements import in instanceof int interface long native new null package private protected public return short static super switch synchronized this throw throws transient true try typeof var void volatile while with";this.regexList=[{regex:SyntaxHighlighter.regexLib.singleLineCComments,css:"comments"},{regex:SyntaxHighlighter.regexLib.multiLineCComments,css:"comments"},{regex:SyntaxHighlighter.regexLib.doubleQuotedString,css:"string"},{regex:SyntaxHighlighter.regexLib.singleQuotedString,css:"string"},{regex:/\s*#.*/gm,css:"preprocessor"},{regex:new RegExp(this.getKeywords(a),"gm"),css:"keyword"}];this.forHtmlScript(SyntaxHighlighter.regexLib.scriptScriptTags)};SyntaxHighlighter.brushes.JScript.prototype=new SyntaxHighlighter.Highlighter;SyntaxHighlighter.brushes.JScript.aliases=["js","jscript","javascript"];SyntaxHighlighter.brushes.Xml=function(){function a(b){var e=SyntaxHighlighter.Match,f=b[0],d=(new XRegExp("(<|<)[\\s\\/\\?]*(?[:\\w-\\.]+)","xg")).exec(f),c=[];if(b.attributes!=null){var a,g=new XRegExp("(? [\\w:\\-\\.]+)\\s*=\\s*(? \".*?\"|'.*?'|\\w+)","xg");while((a=g.exec(f))!=null){c.push(new e(a.name,b.index+a.index,"color1"));c.push(new e(a.value,b.index+a.index+a[0].indexOf(a.value),"string"))}}d!=null&&c.push(new e(d.name,b.index+d[0].indexOf(d.name),"keyword"));return c}this.regexList=[{regex:new XRegExp("(\\<|<)\\!\\[[\\w\\s]*?\\[(.|\\s)*?\\]\\](\\>|>)","gm"),css:"color2"},{regex:new XRegExp("(\\<|<)!--\\s*.*?\\s*--(\\>|>)","gm"),css:"comments"},{regex:new XRegExp("(<|<)[\\s\\/\\?]*(\\w+)(?.*?)[\\s\\/\\?]*(>|>)","sg"),func:a}]};SyntaxHighlighter.brushes.Xml.prototype=new SyntaxHighlighter.Highlighter;SyntaxHighlighter.brushes.Xml.aliases=["xml","xhtml","xslt","html","xhtml"];SyntaxHighlighter.config.bloggerMode=true;SyntaxHighlighter.config.clipboardSwf="http://alexgorbatchev.com/pub/sh/2.0.296/scripts/clipboard.swf";SyntaxHighlighter.defaults.toolbar=false;SyntaxHighlighter.defaults.smartTabs=true;SyntaxHighlighter.defaults.gutter=false;SyntaxHighlighter.all() --------------------------------------------------------------------------------