dynamic list for json definition
by Paweł Niemczyk
HTML
<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/2.0.0-alpha.4/handlebars.min.js"></script>
<div id="efect"> </div>
<script id="template" type="template/text">
<div>
<table>
<thead>
{{#each headers}}
<tr>
{{#each this}}
<th colspan="{{colspan}}" rowspan="{{rowspan}}">{{this.name}}</th>
{{/each}}
</tr>
{{/each}}
</thead>
<tbody>
{{#each rows}}
-==ROW==-
{{/each}}
</tbody>
</table>
</div>
</script>
CSS
td, th{
border: 1px solid black;
}
CoffeeScript
l = (d) -> console.log(d)
json =
from: '2014-04-02'
to: '2014-04-10'
kind: 'zabiegi_agrotechniczne'
name: 'podorywka'
deep: '10 cm'
width: '5m'
state_of_sol: 'sucha'
warnings: ''
alerts: ''
worker: 'pawel niemczyk'
human_cost: 10
machine_cost: 30
area: 10
costs: 11
json2 =
from: '2014-04-05'
to: '2014-04-15'
kind: 'wapnowanie'
name: 'wapnowanie'
deep: '0 cm'
width: '10 m'
state_of_sol: 'slaba'
warnings: ''
alerts: ''
worker: 'pawel niemczyk'
human_cost: 23
machine_cost: 14
area: 1114
costs: 2411112
jsonDefinition =
from:
name: 'od'
group: 'daty'
type: 'date'
to:
name: 'do'
group: 'daty'
type: 'date'
kind:
name: 'rodzaj'
worker:
name: 'pracownik'
deep:
name: 'glebokosc'
group: 'parametry pracy'
width:
name: 'szerokosc'
group: 'parametry pracy'
warnings:
name: 'uwagi'
alerts:
name: 'alerty'
costs:
name: 'calkowity koszt'
group: 'koszta'
sum: true
class JsonListTemplateBuilder
jsonToObj: (json) -> if typeof json is 'string' then JSON.parse(json) else json
cellTemplate: (name) -> "<td>{{#{name}}}</td>"
buildTemplateRow: (fields) ->
cells = []
cells.push(@cellTemplate(field)) for field of fields
cells.join('')
buildListData: (jsonDef, templateBody) ->
def = @jsonToObj(jsonDef)
groups = {}
headerTop = []
headerBottom = []
headerRows = 1
for field of def
group = def[field]['group']
if group
headerRows = 2
if groups[group]
groups[group]['items'].push(jsonDef[field])
groups[group]['colspan'] = groups[group]['items'].length
else
...