use Javascript snippets for code in HTML templates

This commit is contained in:
ccd0 2014-08-03 08:16:23 -07:00
parent cff287c9c3
commit 2a5da0a0a9
6 changed files with 22 additions and 24 deletions

View File

@ -4,7 +4,7 @@ module.exports = (grunt) ->
"(innerHTML: #{JSON.stringify grunt.file.read("src/General/html/#{filename}.html").replace(/^\s+|\s+$</gm, '').replace(/\n/g, '')})"
html = (template) ->
parts = template.split /([\$&@]){([^}]*)}/
parts = template.split /([\$&@]){([^}`]*)}/
parts2 = []
checkText = ''
for part, i in parts
@ -15,12 +15,10 @@ module.exports = (grunt) ->
when 1
if /<[^>]*$/.test(checkText) and not (part is '$' and /\=['"][^"'<>]*$/.test checkText)
throw new Error "Illegal insertion into HTML template: #{template}"
expr = parts[i+1]
expr = "(#{expr})" for x in parts[i+1].split ')'
parts2.push switch part
when '$' then "E#{expr}"
when '&' then "#{expr}.innerHTML"
when '@' then "#{expr}.map((x) -> x.innerHTML).join('')"
when '$' then "E(`#{parts[i+1]}`)"
when '&' then "`#{parts[i+1]}`.innerHTML"
when '@' then "`#{parts[i+1]}`.map((x) -> x.innerHTML).join('')"
unless /^(<\w+( [\w-]+(='[^"'<>]*'|="[^"'<>]*")?)*>|<\/\w+>|[^"'<>]*)*$/.test checkText
throw new Error "HTML template is ill-formed: #{template}"
output = if parts2.length is 0 then '""' else parts2.join ' + '

View File

@ -138,7 +138,7 @@ ThreadHiding =
a = $.el 'a',
className: "#{type}-thread-button"
href: 'javascript:;'
$.extend a, <%= html('<span class="fa fa-${if type is "hide" then "minus" else "plus"}-square"></span>') %>
$.extend a, <%= html('<span class="fa fa-${(type === "hide") ? "minus" : "plus"}-square"></span>') %>
a.dataset.fullID = thread.fullID
$.on a, 'click', ThreadHiding.toggle
a

View File

@ -197,8 +197,8 @@ Build =
else if file and boardID is 'f'
<%= html(
'<div class="fileInfo"><span class="fileText" id="fT${postID}">' +
'File: <a data-width="${file.width}" data-height="${+file.height}" href="${file.url}" target="_blank">${file.name}</a>' +
'-(${$.bytesToString file.size}, ${file.width}x${file.height}, ${file.tag})' +
'File: <a data-width="${file.width}" data-height="${file.height}" href="${file.url}" target="_blank">${file.name}</a>' +
'-(${$.bytesToString(file.size)}, ${file.width}x${file.height}, ${file.tag})' +
'</span></div>'
) %>
else if file
@ -215,7 +215,7 @@ Build =
fileThumb = file.turl
fileSize = $.bytesToString file.size
fileDims = if file.url[-4..] is '.pdf' then 'PDF' else "#{+file.width}x#{+file.height}"
fileDims = if file.url[-4..] is '.pdf' then 'PDF' else "#{file.width}x#{file.height}"
fileLink = if file.isSpoiler or file.name is shortFilename
<%= html('<a href="${file.url}" target="_blank">${shortFilename}</a>') %>
@ -229,8 +229,8 @@ Build =
<%= html(
'&{fileText}' +
'<a class="fileThumb${if file.isSpoiler then " imgspoiler" else ""}" href="${file.url}" target="_blank">' +
'<img src="${fileThumb}" alt="${fileSize}" data-md5="${file.MD5}" style="height: ${file.theight}px; width: ${+file.twidth}px;">' +
'<a class="fileThumb${file.isSpoiler ? " imgspoiler" : ""}" href="${file.url}" target="_blank">' +
'<img src="${fileThumb}" alt="${fileSize}" data-md5="${file.MD5}" style="height: ${file.theight}px; width: ${file.twidth}px;">' +
'</a>'
) %>

View File

@ -19,10 +19,10 @@ FileInfo =
''
$.extend outputNode, <%= html('@{output}') %>
formatters:
t: -> <%= html('${@file.URL.match(/\\d+\\..+$/)[0]}') %>
T: -> <%= html('<a href="${@file.URL}" target="_blank">&{FileInfo.formatters.t.call @}</a>') %>
l: -> <%= html('<a href="${@file.URL}" target="_blank">&{FileInfo.formatters.n.call @}</a>') %>
L: -> <%= html('<a href="${@file.URL}" target="_blank">&{FileInfo.formatters.N.call @}</a>') %>
t: -> <%= html('${this.file.URL.match(/\\d+\\..+$/)[0]}') %>
T: -> <%= html('<a href="${this.file.URL}" target="_blank">&{FileInfo.formatters.t.call(this)}</a>') %>
l: -> <%= html('<a href="${this.file.URL}" target="_blank">&{FileInfo.formatters.n.call(this)}</a>') %>
L: -> <%= html('<a href="${this.file.URL}" target="_blank">&{FileInfo.formatters.N.call(this)}</a>') %>
n: ->
fullname = @file.name
shortname = Build.shortFilename @file.name, @isReply
@ -30,11 +30,11 @@ FileInfo =
<%= html('${fullname}') %>
else
<%= html('<span class="fnswitch"><span class="fntrunc">${shortname}</span><span class="fnfull">${fullname}</span></span>') %>
N: -> <%= html('${@file.name}') %>
N: -> <%= html('${this.file.name}') %>
p: -> if @file.isSpoiler then <%= html('Spoiler, ') %> else <%= html('') %>
s: -> <%= html('${@file.size}') %>
B: -> <%= html('${Math.round @file.sizeInBytes} Bytes') %>
K: -> <%= html('${Math.round(@file.sizeInBytes/1024)} KB') %>
M: -> <%= html('${Math.round(@file.sizeInBytes/1048576*100)/100} MB') %>
r: -> <%= html('${@file.dimensions or "PDF"}') %>
s: -> <%= html('${this.file.size}') %>
B: -> <%= html('${Math.round(this.file.sizeInBytes)} Bytes') %>
K: -> <%= html('${Math.round(this.file.sizeInBytes/1024)} KB') %>
M: -> <%= html('${Math.round(this.file.sizeInBytes/1048576*100)/100} MB') %>
r: -> <%= html('${this.file.dimensions || "PDF"}') %>
'%': -> <%= html('%') %>

View File

@ -14,7 +14,7 @@ ThreadStats =
Header.addShortcut sc
else
@dialog = sc = UI.dialog 'thread-stats', 'bottom: 0px; right: 0px;',
<%= html('<div class="move" title="Post Count / File Count${if Conf["Page Count in Stats"] then " / Page Count" else ""}">&{countHTML}</div>') %>
<%= html('<div class="move" title="Post Count / File Count${Conf["Page Count in Stats"] ? " / Page Count" : ""}">&{countHTML}</div>') %>
$.ready =>
$.add d.body, sc

View File

@ -46,7 +46,7 @@ QR =
link = $.el 'h1',
className: "qr-link-container"
$.extend link, <%= html('<a href="javascript:;" class="qr-link">${if g.VIEW is "thread" then "Reply to Thread" else "Start a Thread"}</a>') %>
$.extend link, <%= html('<a href="javascript:;" class="qr-link">${(g.VIEW === "thread") ? "Reply to Thread" : "Start a Thread"}</a>') %>
QR.link = link.firstElementChild
$.on link.firstChild, 'click', ->