client/general: use 'ctx' variable for templates

This commit is contained in:
rr- 2016-05-21 09:45:43 +02:00
parent bae238794a
commit 052a7ca684
25 changed files with 97 additions and 97 deletions

View file

@ -1,4 +1,4 @@
<div class='page'>
<p><span>Page <%= page %> of <%= totalPages %></span></p>
<p><span>Page <%= ctx.page %> of <%= ctx.totalPages %></span></p>
<div class='page-content-holder'></div>
</div>

View file

@ -1,7 +1,7 @@
<div class='file-dropper-holder'>
<input type='file' id='<%= id %>'/>
<label class='file-dropper' for='<%= id %>'>
<% if (allowMultiple) { %>
<input type='file' id='<%= ctx.id %>'/>
<label class='file-dropper' for='<%= ctx.id %>'>
<% if (ctx.allowMultiple) { %>
Drop files here!
<% } else { %>
Drop file here!

View file

@ -1,4 +1,4 @@
<p>By accessing <%= name %> (&ldquo;Site&rdquo;) you agree to the following
<p>By accessing <%= ctx.name %> (&ldquo;Site&rdquo;) you agree to the following
Terms of Service. If you do not agree to these terms, then please do not access
the Site.</p>

View file

@ -1,5 +1,5 @@
<div class='content-wrapper transparent' id='home'>
<div class='messages'></div>
<h1><%= name %></h1>
<footer>Version: <span class='version'><%= version %></span> (built <%= makeRelativeTime(buildDate) %>)</footer>
<h1><%= ctx.name %></h1>
<footer>Version: <span class='version'><%= ctx.version %></span> (built <%= ctx.makeRelativeTime(ctx.buildDate) %>)</footer>
</div>

View file

@ -3,7 +3,7 @@
<head>
<meta charset='utf-8'/>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<title><!-- confiured in config file --></title>
<title><!-- configured in the config file --></title>
<link href='/app.min.css' rel='stylesheet' type='text/css'/>
<link href='//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css' rel='stylesheet' type='text/css'/>
<link href='//fonts.googleapis.com/css?family=Droid+Sans' rel='stylesheet' type='text/css'/>

View file

@ -4,20 +4,20 @@
<div class='input'>
<ul>
<li>
<%= makeTextInput({text: 'User name', id: 'user-name', name: 'name', required: true, pattern: userNamePattern}) %>
<%= ctx.makeTextInput({text: 'User name', id: 'user-name', name: 'name', required: true, pattern: ctx.userNamePattern}) %>
</li>
<li>
<%= makePasswordInput({text: 'Password', id: 'user-password', name: 'password', required: true, pattern: passwordPattern}) %>
<%= ctx.makePasswordInput({text: 'Password', id: 'user-password', name: 'password', required: true, pattern: ctx.passwordPattern}) %>
</li>
<li>
<%= makeCheckbox({text: 'Remember me', id: 'remember-user', name: 'remember-user'}) %>
<%= ctx.makeCheckbox({text: 'Remember me', id: 'remember-user', name: 'remember-user'}) %>
</li>
</ul>
</div>
<div class='messages'></div>
<div class='buttons'>
<input type='submit' value='Log in'/>
<% if (canSendMails) { %>
<% if (ctx.canSendMails) { %>
<a class='append' href='/password-reset'>Forgot the password?</a>
<% } %>
</div>

View file

@ -1,8 +1,8 @@
<nav class='text-nav'>
<ul>
<li>
<% if (prevLinkActive) { %>
<a class='prev' href='<%= prevLink %>'>
<% if (ctx.prevLinkActive) { %>
<a class='prev' href='<%= ctx.prevLink %>'>
<% } else { %>
<a class='prev disabled'>
<% } %>
@ -11,7 +11,7 @@
</a>
</li>
<% _.each(pages, page => { %>
<% _.each(ctx.pages, page => { %>
<% if (page.ellipsis) { %>
<li>&hellip;</li>
<% } else { %>
@ -26,8 +26,8 @@
<% }) %>
<li>
<% if (nextLinkActive) { %>
<a class='next' href='<%= nextLink %>'>
<% if (ctx.nextLinkActive) { %>
<a class='next' href='<%= ctx.nextLink %>'>
<% } else { %>
<a class='next disabled'>
<% } %>

View file

@ -4,7 +4,7 @@
<div class='input'>
<ul>
<li>
<%= makeTextInput({text: 'User name or e-mail address', id: 'user-name', name: 'user-name', required: true}) %>
<%= ctx.makeTextInput({text: 'User name or e-mail address', id: 'user-name', name: 'user-name', required: true}) %>
</li>
</ul>
</div>

View file

@ -5,11 +5,11 @@
<div class='input'>
<ul>
<li>
<%= makeCheckbox({text: 'Endless scroll', id: 'endless-scroll', name: 'endless-scroll', checked: browsingSettings.endlessScroll}) %>
<%= ctx.makeCheckbox({text: 'Endless scroll', id: 'endless-scroll', name: 'endless-scroll', checked: ctx.browsingSettings.endlessScroll}) %>
<p class='hint'>Rather than using a paged navigation, smoothly scroll through the content.</p>
</li>
<li>
<%= makeCheckbox({text: 'Enable keyboard shortcuts', id: 'keyboard-shortcuts', name: 'keyboard-shortcuts', checked: browsingSettings.keyboardShortcuts}) %>
<%= ctx.makeCheckbox({text: 'Enable keyboard shortcuts', id: 'keyboard-shortcuts', name: 'keyboard-shortcuts', checked: ctx.browsingSettings.keyboardShortcuts}) %>
<a class='append icon' href='/help/keyboard'><i class='fa fa-question-circle-o'></i></a>
</li>
</ul>

View file

@ -1,13 +1,13 @@
<div class='content-wrapper tag'>
<h1><%= tag.names[0] %></h1>
<h1><%= ctx.tag.names[0] %></h1>
<nav class='text-nav'><!--
--><ul><!--
--><li data-name='summary'><a href='/tag/<%= tag.names[0] %>'>Summary</a></li><!--
--><% if (canMerge) { %><!--
--><li data-name='merge'><a href='/tag/<%= tag.names[0] %>/merge'>Merge with&hellip;</a></li><!--
--><li data-name='summary'><a href='/tag/<%= ctx.tag.names[0] %>'>Summary</a></li><!--
--><% if (ctx.canMerge) { %><!--
--><li data-name='merge'><a href='/tag/<%= ctx.tag.names[0] %>/merge'>Merge with&hellip;</a></li><!--
--><% } %><!--
--><% if (canDelete) { %><!--
--><li data-name='delete'><a href='/tag/<%= tag.names[0] %>/delete'>Delete</a></li><!--
--><% if (ctx.canDelete) { %><!--
--><li data-name='delete'><a href='/tag/<%= ctx.tag.names[0] %>/delete'>Delete</a></li><!--
--><% } %><!--
--></ul><!--
--></nav>

View file

@ -10,18 +10,18 @@
</tr>
</thead>
<tbody>
<% _.each(tagCategories, category => { %>
<% _.each(ctx.tagCategories, category => { %>
<tr data-category='<%= category.name %>'>
<td class='name'>
<% if (canEditName) { %>
<%= makeTextInput({value: category.name, required: true}) %>
<% if (ctx.canEditName) { %>
<%= ctx.makeTextInput({value: category.name, required: true}) %>
<% } else { %>
<%= category.name %>
<% } %>
</td>
<td class='color'>
<% if (canEditColor) { %>
<%= makeColorInput({value: category.color}) %>
<% if (ctx.canEditColor) { %>
<%= ctx.makeColorInput({value: category.color}) %>
<% } else { %>
<%= category.color %>
<% } %>
@ -31,7 +31,7 @@
<%= category.usages %>
</a>
</td>
<% if (canDelete) { %>
<% if (ctx.canDelete) { %>
<td>
<% if (category.usages) { %>
<a class='inactive remove' title="Can't delete category in use">Remove</a>
@ -46,10 +46,10 @@
<tfoot>
<tr class='add-template'>
<td class='name'>
<%= makeTextInput({required: true}) %>
<%= ctx.makeTextInput({required: true}) %>
</td>
<td class='color'>
<%= makeColorInput({value: '#000000'}) %>
<%= ctx.makeColorInput({value: '#000000'}) %>
</td>
<td class='usages'>
0
@ -61,13 +61,13 @@
</tfoot>
</table>
<% if (canCreate) { %>
<% if (ctx.canCreate) { %>
<p><a href='#' class='add'>Add new category</a></p>
<% } %>
<div class='messages'></div>
<% if (canCreate || canEditName || canEditColor || canDelete) { %>
<% if (ctx.canCreate || ctx.canEditName || ctx.canEditColor || ctx.canDelete) { %>
<div class='buttons'>
<input type='submit' class='save' value='Save changes'>
</div>

View file

@ -1,13 +1,13 @@
<div class='tag-delete'>
<form>
<% if (tag.usages) { %>
<% if (ctx.tag.usages) { %>
<p>For extra <s>paranoia</s> safety, only tags that are unused can be deleted.</p>
<p>Check <a href='/posts/<%= tag.names[0] %>'>which posts</a> are tagged with <%= tag.names[0] %>.</p>
<p>Check <a href='/posts/<%= ctx.tag.names[0] %>'>which posts</a> are tagged with <%= ctx.tag.names[0] %>.</p>
<% } else { %>
<div class='input'>
<ul>
<li>
<%= makeCheckbox({id: 'confirm-deletion', name: 'confirm-deletion', required: true, text: 'I confirm that I want to delete this tag.'}) %>
<%= ctx.makeCheckbox({id: 'confirm-deletion', name: 'confirm-deletion', required: true, text: 'I confirm that I want to delete this tag.'}) %>
</li>
</ul>
</div>

View file

@ -1,16 +1,16 @@
<div class='tag-merge'>
<form class='tabular'>
<p>Proceeding will remove <%= tag.names[0] %> and retag its posts with
the tag specified below. Aliases and relations of <%= tag.names[0] %>
<p>Proceeding will remove <%= ctx.tag.names[0] %> and retag its posts with
the tag specified below. Aliases and relations of <%= ctx.tag.names[0] %>
will be discarded and need to be handled by hand.</p>
<div class='input'>
<ul>
<li class='target'>
<%= makeTextInput({required: true, text: 'Target tag', pattern: tagNamePattern}) %>
<%= ctx.makeTextInput({required: true, text: 'Target tag', pattern: ctx.tagNamePattern}) %>
</li>
<li class='confirm'>
<label></label>
<%= makeCheckbox({required: true, text: 'I confirm that I want to merge this tag.'}) %>
<%= ctx.makeCheckbox({required: true, text: 'I confirm that I want to merge this tag.'}) %>
</li>
</ul>
</div>

View file

@ -3,20 +3,20 @@
<div class='input'>
<ul>
<li class='names'>
<%= makeTextInput({text: 'Names', value: tag.names.join(' '), required: true, readonly: !canEditNames, pattern: tagNamesPattern}) %>
<%= ctx.makeTextInput({text: 'Names', value: ctx.tag.names.join(' '), required: true, readonly: !ctx.canEditNames, pattern: ctx.tagNamesPattern}) %>
</li>
<li class='category'>
<%= makeSelect({text: 'Category', keyValues: categories, selectedKey: tag.category, required: true, readonly: !canEditCategory}) %>
<%= ctx.makeSelect({text: 'Category', keyValues: ctx.categories, selectedKey: ctx.tag.category, required: true, readonly: !ctx.canEditCategory}) %>
</li>
<li class='implications'>
<%= makeTextInput({text: 'Implications', value: tag.implications.join(' '), readonly: !canEditImplications}) %>
<%= ctx.makeTextInput({text: 'Implications', value: ctx.tag.implications.join(' '), readonly: !ctx.canEditImplications}) %>
</li>
<li class='suggestions'>
<%= makeTextInput({text: 'Suggestions', value: tag.suggestions.join(' '), readonly: !canEditSuggestions}) %>
<%= ctx.makeTextInput({text: 'Suggestions', value: ctx.tag.suggestions.join(' '), readonly: !ctx.canEditSuggestions}) %>
</li>
</ul>
</div>
<% if (canEditNames || canEditCategory || canEditImplications || canEditSuggestions) { %>
<% if (ctx.canEditNames || ctx.canEditCategory || ctx.canEditImplications || ctx.canEditSuggestions) { %>
<div class='messages'></div>
<div class='buttons'>
<input type='submit' class='save' value='Save changes'>

View file

@ -3,14 +3,14 @@
<div class='input'>
<ul>
<li>
<%= makeTextInput({id: 'search-text', name: 'search-text', value: searchQuery.text}) %>
<%= ctx.makeTextInput({id: 'search-text', name: 'search-text', value: ctx.searchQuery.text}) %>
</li>
</ul>
</div>
<div class='buttons'>
<input type='submit' value='Search'/>
<a class='button append' href='/help/search/tags'>Syntax help</a>
<% if (canEditTagCategories) { %>
<% if (ctx.canEditTagCategories) { %>
<a class='append' href='/tag-categories'>Tag categories</a>
<% } %>
</div>

View file

@ -1,30 +1,30 @@
<div class='tag-list'>
<% if (results.length) { %>
<% if (ctx.results.length) { %>
<table>
<thead>
<th class='names'>
<% if (query == 'sort:name' || !query) { %>
<% if (ctx.query == 'sort:name' || !ctx.query) { %>
<a href='/tags/text=-sort:name'>Tag name(s)</a>
<% } else { %>
<a href='/tags/text=sort:name'>Tag name(s)</a>
<% } %>
</th>
<th class='implications'>
<% if (query == 'sort:implication-count') { %>
<% if (ctx.query == 'sort:implication-count') { %>
<a href='/tags/text=-sort:implication-count'>Implications</a>
<% } else { %>
<a href='/tags/text=sort:implication-count'>Implications</a>
<% } %>
</th>
<th class='suggestions'>
<% if (query == 'sort:suggestion-count') { %>
<% if (ctx.query == 'sort:suggestion-count') { %>
<a href='/tags/text=-sort:suggestion-count'>Suggestions</a>
<% } else { %>
<a href='/tags/text=sort:suggestion-count'>Suggestions</a>
<% } %>
</th>
<th class='usages'>
<% if (query == 'sort:usages') { %>
<% if (ctx.query == 'sort:usages') { %>
<a href='/tags/text=-sort:usages'>Usages</a>
<% } else { %>
<a href='/tags/text=sort:usages'>Usages</a>
@ -32,12 +32,12 @@
</th>
</thead>
<tbody>
<% _.each(results, tag => { %>
<% _.each(ctx.results, tag => { %>
<tr>
<td class='names'>
<ul>
<% _.each(tag.names, name => { %>
<li><%= makeTagLink(name) %></li>
<li><%= ctx.makeTagLink(name) %></li>
<% }) %>
</ul>
</td>
@ -45,7 +45,7 @@
<% if (tag.implications.length) { %>
<ul>
<% _.each(tag.implications, name => { %>
<li><%= makeTagLink(name) %></li>
<li><%= ctx.makeTagLink(name) %></li>
<% }) %>
</ul>
<% } else { %>
@ -56,7 +56,7 @@
<% if (tag.suggestions.length) { %>
<ul>
<% _.each(tag.suggestions, name => { %>
<li><%= makeTagLink(name) %></li>
<li><%= ctx.makeTagLink(name) %></li>
<% }) %>
</ul>
<% } else { %>

View file

@ -1,10 +1,10 @@
<nav id='top-nav' class='text-nav'>
<ul><!--
--><% _.each(items, (item, key) => { %><!--
--><% _.each(ctx.items, (item, key) => { %><!--
--><% if (item.available) { %><!--
--><li data-name='<%= key %>'><!--
--><a href='<%= item.url %>' accesskey='<%= item.accessKey %>'><!--
--><% if (item.imageUrl) { print(makeThumbnail(item.imageUrl)); } %><!--
--><% if (item.imageUrl) { print(ctx.makeThumbnail(item.imageUrl)); } %><!--
--><span class='text'><%- item.name %></span><!--
--></a><!--
--></li><!--

View file

@ -1,13 +1,13 @@
<div class='content-wrapper' id='user'>
<h1><%= user.name %></h1>
<h1><%= ctx.user.name %></h1>
<nav class='text-nav'><!--
--><ul><!--
--><li data-name='summary'><a href='/user/<%= user.name %>'>Summary</a></li><!--
--><% if (canEditAnything) { %><!--
--><li data-name='edit'><a href='/user/<%= user.name %>/edit'>Account settings</a></li><!--
--><li data-name='summary'><a href='/user/<%= ctx.user.name %>'>Summary</a></li><!--
--><% if (ctx.canEditAnything) { %><!--
--><li data-name='edit'><a href='/user/<%= ctx.user.name %>/edit'>Account settings</a></li><!--
--><% } %><!--
--><% if (canDelete) { %><!--
--><li data-name='delete'><a href='/user/<%= user.name %>/delete'>Account deletion</a></li><!--
--><% if (ctx.canDelete) { %><!--
--><li data-name='delete'><a href='/user/<%= ctx.user.name %>/delete'>Account deletion</a></li><!--
--><% } %><!--
--></ul><!--
--></nav>

View file

@ -3,7 +3,7 @@
<div class='input'>
<ul>
<li>
<%= makeCheckbox({id: 'confirm-deletion', name: 'confirm-deletion', required: true, text: 'I confirm that I want to delete this account.'}) %>
<%= ctx.makeCheckbox({id: 'confirm-deletion', name: 'confirm-deletion', required: true, text: 'I confirm that I want to delete this account.'}) %>
</li>
</ul>
</div>

View file

@ -3,27 +3,27 @@
<div class='left'>
<div class='input'>
<ul>
<% if (canEditName) { %>
<% if (ctx.canEditName) { %>
<li>
<%= makeTextInput({text: 'User name', id: 'user-name', name: 'name', value: user.name, pattern: userNamePattern}) %>
<%= ctx.makeTextInput({text: 'User name', id: 'user-name', name: 'name', value: ctx.user.name, pattern: ctx.userNamePattern}) %>
</li>
<% } %>
<% if (canEditPassword) { %>
<% if (ctx.canEditPassword) { %>
<li>
<%= makePasswordInput({text: 'Password', id: 'user-password', name: 'password', placeholder: 'leave blank if not changing', pattern: passwordPattern}) %>
<%= ctx.makePasswordInput({text: 'Password', id: 'user-password', name: 'password', placeholder: 'leave blank if not changing', pattern: ctx.passwordPattern}) %>
</li>
<% } %>
<% if (canEditEmail) { %>
<% if (ctx.canEditEmail) { %>
<li>
<%= makeEmailInput({text: 'Email', id: 'user-email', name: 'email', value: user.email}) %>
<%= ctx.makeEmailInput({text: 'Email', id: 'user-email', name: 'email', value: ctx.user.email}) %>
</li>
<% } %>
<% if (canEditRank) { %>
<% if (ctx.canEditRank) { %>
<li>
<%= makeSelect({text: 'Rank', id: 'user-rank', name: 'rank', keyValues: ranks, selectedKey: user.rank}) %>
<%= ctx.makeSelect({text: 'Rank', id: 'user-rank', name: 'rank', keyValues: ctx.ranks, selectedKey: ctx.user.rank}) %>
</li>
<% } %>
</ul>
@ -34,14 +34,14 @@
</div>
</div>
<% if (canEditAvatar) { %>
<% if (ctx.canEditAvatar) { %>
<div class='right'>
<ul>
<li>
<%= makeRadio({text: 'Gravatar', id: 'gravatar-radio', name: 'avatar-style', value: 'gravatar', selectedValue: user.avatarStyle}) %>
<%= ctx.makeRadio({text: 'Gravatar', id: 'gravatar-radio', name: 'avatar-style', value: 'gravatar', selectedValue: ctx.user.avatarStyle}) %>
</li>
<li>
<%= makeRadio({text: 'Manual avatar', id: 'avatar-radio', name: 'avatar-style', value: 'manual', selectedValue: user.avatarStyle}) %>
<%= ctx.makeRadio({text: 'Manual avatar', id: 'avatar-radio', name: 'avatar-style', value: 'manual', selectedValue: ctx.user.avatarStyle}) %>
<div id='avatar-content'></div>
</li>
</ul>

View file

@ -4,13 +4,13 @@
<div class='input'>
<ul>
<li>
<%= makeTextInput({text: 'User name', id: 'user-name', name: 'user-name', placeholder: 'letters, digits, _, -', required: true, pattern: userNamePattern}) %>
<%= ctx.makeTextInput({text: 'User name', id: 'user-name', name: 'user-name', placeholder: 'letters, digits, _, -', required: true, pattern: ctx.userNamePattern}) %>
</li>
<li>
<%= makePasswordInput({text: 'Password', id: 'user-password', name: 'user-password', placeholder: '5+ characters', required: true, pattern: passwordPattern}) %>
<%= ctx.makePasswordInput({text: 'Password', id: 'user-password', name: 'user-password', placeholder: '5+ characters', required: true, pattern: ctx.passwordPattern}) %>
</li>
<li>
<%= makeEmailInput({text: 'Email', id: 'user-email', name: 'user-email', placeholder: 'optional'}) %>
<%= ctx.makeEmailInput({text: 'Email', id: 'user-email', name: 'user-email', placeholder: 'optional'}) %>
<p class='hint'>Used for password reminder and to show a <a href='http://gravatar.com/'>Gravatar</a>. Leave blank for random Gravatar.</p>
</li>
</ul>

View file

@ -1,22 +1,22 @@
<div id='user-summary'>
<%= makeThumbnail(user.avatarUrl) %>
<%= ctx.makeThumbnail(ctx.user.avatarUrl) %>
<ul class='basic-info'>
<li>Registered: <%= makeRelativeTime(user.creationTime) %></li>
<li>Last seen: <%= makeRelativeTime(user.lastLoginTime) %></li>
<li>Rank: <%= user.rankName.toLowerCase() %></li>
<li>Registered: <%= ctx.makeRelativeTime(ctx.user.creationTime) %></li>
<li>Last seen: <%= ctx.makeRelativeTime(ctx.user.lastLoginTime) %></li>
<li>Rank: <%= ctx.user.rankName.toLowerCase() %></li>
</ul>
<div>
<nav class='plain-nav'>
<p><strong>Quick links</strong></p>
<ul>
<li><a href='/posts/text=submit:<%= user.name %>'>Uploads</a></li>
<li><a href='/posts/text=fav:<%= user.name %>'>Favorites</a></li>
<li><a href='/posts/text=comment:<%= user.name %>'>Posts commented on</a></li>
<li><a href='/posts/text=submit:<%= ctx.user.name %>'>Uploads</a></li>
<li><a href='/posts/text=fav:<%= ctx.user.name %>'>Favorites</a></li>
<li><a href='/posts/text=comment:<%= ctx.user.name %>'>Posts commented on</a></li>
</ul>
</nav>
<% if (isLoggedIn) { %>
<% if (ctx.isLoggedIn) { %>
<nav class='plain-nav'>
<p><strong>Only visible to you</strong></p>
<ul>

View file

@ -3,7 +3,7 @@
<div class='input'>
<ul>
<li>
<%= makeTextInput({id: 'search-text', name: 'search-text', value: searchQuery.text}) %>
<%= ctx.makeTextInput({id: 'search-text', name: 'search-text', value: ctx.searchQuery.text}) %>
</li>
</ul>
</div>

View file

@ -1,17 +1,17 @@
<div class='user-list'>
<ul><!--
--><% _.each(results, user => { %><!--
--><% _.each(ctx.results, user => { %><!--
--><li>
<div class='wrapper'>
<a class='image' href='/user/<%= user.name %>'><%= makeThumbnail(user.avatarUrl) %></a>
<a class='image' href='/user/<%= user.name %>'><%= ctx.makeThumbnail(user.avatarUrl) %></a>
<div class='details'>
<a href='/user/<%= user.name %>'><%= user.name %></a><br/>
Registered: <%= makeRelativeTime(user.creationTime) %><br/>
Last seen: <%= makeRelativeTime(user.lastLoginTime) %>
Registered: <%= ctx.makeRelativeTime(user.creationTime) %><br/>
Last seen: <%= ctx.makeRelativeTime(user.lastLoginTime) %>
</div>
</div>
</li><!--
--><% }) %><!--
--><%= makeFlexboxAlign() %><!--
--><%= ctx.makeFlexboxAlign() %><!--
--></ul>
</div>

View file

@ -238,7 +238,7 @@ function getTemplate(templatePath) {
return null;
}
const templateText = templates[templatePath].trim();
const templateFactory = lodash.template(templateText);
const templateFactory = lodash.template(templateText, {variable: 'ctx'});
return ctx => {
if (!ctx) {
ctx = {};