Make it work

style.html.j2

@@ -1,9 +1,2 @@
 
-
-
-
-spis meg
-
-<div class="">
-    
-</div>
+asdasd

style.js

@@ -1,6 +1,13 @@
 
-template = new plate.Template(jinja_template)
+var template = new plate.Template(jinja_template)
+var context = jsyaml.load(document.getElementById("yaml_data").innerHTML);
 
-template.render({world: 'everyone'}, function(err, data) {
-	document.write(data);
+
+
+console.log(yaml_data);
+
+template.render(context, function(err, data) {
+	if (err) throw err;
+	document.getElementById("my_card").innerHTML = data;
+//	document.write(data);
 })

templates/style.xsl.j2

@@ -4,8 +4,8 @@
 <xsl:text disable-output-escaping='yes'>&lt;!DOCTYPE html&gt;
 </xsl:text>
 
-<script src="https://raw.githubusercontent.com/nodeca/js-yaml/master/dist/js-yaml.min.js"></script>
-<script src="https://raw.githubusercontent.com/chrisdickinson/plate/master/dist/plate.min.js"></script>
+<script type="text/javascript" src="/dist/js-yaml.min.js"/>
+<script type="text/javascript" src="/dist/plate.min.js"/>
 <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css"/>
 
 <title>Status Card</title>
@@ -14,14 +14,16 @@
 {{ css_data }}
 </style>
 
-<script type="text/html" id="yaml_data">
-xsl
+<script type="text/html" id="yaml_data">---
+<xsl:value-of select="yaml_data"/>
 </script>
 
+
 <script type="text/javascript">
 var jinja_template = {{ jinja_data | tojson }};
 </script>
 
+<div id="my_card"></div>
 <script type="text/javascript">
 {{ js_data }}
 </script>