var md = window.markdownit();
var context = {
	'xml' : {},
	'yaml' : jsyaml.load(document.getElementById("yaml_data").innerHTML),
	'alert' : alert,
};

// read xml data
var xml_data_items = document.getElementsByClassName("xml_data")
for (var i=0; i < xml_data_items.length; i++) {
	var key = xml_data_items[i].id.substr(9);
	var val = xml_data_items[i].innerHTML;
	context.xml[key] = val;
}

var xml_component_items = document.getElementsByClassName("xml_component")
context.xml["components"] = [];
for (var i=0; i < xml_component_items.length/3; i++) {
	context.xml["components"].push({
		'@x'       : document.getElementById("xml_component_" + (i+1) + "_x").innerHTML,
		'@y'       : document.getElementById("xml_component_" + (i+1) + "_y").innerHTML,
		'@db_entry': document.getElementById("xml_component_" + (i+1) + "_db_entry").innerHTML,
	});
}

var env = new nunjucks.Environment([], {
	autoescape: true,
	trimBlocks: true,
	lstripBlocks: true,
});
env.addFilter('markdown', function(str) {
	return md.render(str);
});
env.addFilter('cull_whitespace', function(str) {
    return str.split(/\s+/).join(' ').trim();
});
env.addFilter('any', function(iterable) {
    for (var index = 0; index < iterable.length; index++) {
        if (iterable[index]) return true;
    }
    return false;
});
env.addFilter('all', function(iterable) {
    for (var index = 0; index < iterable.length; index++) {
        if (!iterable[index]) return false;
    }
    return true;
});
env.addFilter('startswith', function(string, match) {
	return string.slice(0, match.length) === match;
});
env.addFilter('endswith', function(string, match) {
	return string.endsWith(match);
});
env.addFilter('tail', function(sequence) {
	return sequence.slice(1);
});
env.addFilter('split', function(string, delimiter) {
	return string.split(delimiter);
});
env.addFilter('is_number', function(string) {
	return !isNaN(string);
});
env.addFilter('is_string', function(string) {
	return String(string) === string;
});

try {
	rendered = env.renderString(jinja_template, context);
} catch(err) {
	rendered = "<pre style=\"font-size:0.8em; width:100%; border-radius:5px; padding:2mm; box-sizing: border-box; border: 2px solid black;  white-space: normal; background-color:#ff8888;\">" + err + "</pre>";
}
//console.log(rendered);
document.write(rendered);