playing with jspreadsheet

Signed-off-by: Stephan Richter <s.richter@srsoftware.de>

core/src/main/java/de/srsoftware/umbrella/core/Util.java

@@ -37,12 +37,51 @@ import org.json.JSONObject;
 public class Util {
 	public static final System.Logger LOG = System.getLogger("Util");
 	private static final Pattern UML_PATTERN = Pattern.compile("@start(\\w+)(.*?)@end(\\1)",Pattern.DOTALL);
+	private static final Pattern SPREADSHEET_PATTERN = Pattern.compile("@startsheet(.*?)@endsheet",Pattern.DOTALL);
 	private static File plantumlJar = null;
 	private static final JParsedown MARKDOWN = new JParsedown();
 	public static final String SHA1 = "SHA-1";
 	private static final MessageDigest SHA1_DIGEST;
 	private static final Map<Integer,String> umlCache = new HashMap<>();
 
+	private static final String SCRIPT = """
+<script src="http://127.0.0.1:8080/js/jspreadsheet-ce.js"></script>
+<div id="spreadsheet"></div>
+<script type="application/javascript">
+alert('Test');
+jspreadsheet(document.getElementById('spreadsheet'), {
+    worksheets: [
+        {
+            data: [
+                ['Jazz', 'Honda', '2019-02-12', '', true, '$ 2.000,00', '#777700'],
+                ['Civic', 'Honda', '2018-07-11', '', true, '$ 4.000,01', '#007777'],
+            ],
+            columns: [
+                { type: 'text', title: 'Car', width: 120 },
+                {
+                    type: 'dropdown',
+                    title: 'Make',
+                    width: 200,
+                    source: ['Alfa Romeo', 'Audi', 'Bmw', 'Honda'],
+                },
+                { type: 'calendar', title: 'Available', width: 200 },
+                { type: 'image', title: 'Photo', width: 120 },
+                { type: 'checkbox', title: 'Stock', width: 80 },
+                {
+                    type: 'numeric',
+                    title: 'Price',
+                    width: 100,
+                    mask: '$ #.##,00',
+                    decimal: ',',
+                },
+                { type: 'color', width: 100, render: 'square' },
+            ],
+        },
+    ],
+});
+</script>
+			""";
+
 	static {
 		try {
 			SHA1_DIGEST = MessageDigest.getInstance(SHA1);
@@ -79,8 +118,16 @@ public class Util {
 	public static String markdown(String source){
 		if (source == null) return source;
 		try {
+			var matcher = SPREADSHEET_PATTERN.matcher(source);
+			while (matcher.find()){
+				var sheetData = matcher.group(0).trim();
+				var start = matcher.start(0);
+				var end = matcher.end(0);
+				source = source.substring(0, start) + SCRIPT + source.substring(end);
+				matcher = SPREADSHEET_PATTERN.matcher(source);
+			}
 			if (plantumlJar != null && plantumlJar.exists()) {
-				var matcher = UML_PATTERN.matcher(source);
+				matcher = UML_PATTERN.matcher(source);
 				while (matcher.find()) {
 					var uml = matcher.group(0).trim();
 					var start = matcher.start(0);

frontend/src/routes/calc.svelte

@@ -2,26 +2,36 @@
 	import { onMount } from 'svelte';
 	import jspreadsheet from "jspreadsheet-ce";
     import "jspreadsheet-ce/dist/jspreadsheet.css";
-    //import 'jsuites/dist/jsuites.min.css'; // required UI styles
-	function load(){
 
-jspreadsheet(document.getElementById('spreadsheet'), {
+	var spreadsheet = null;
-    worksheets: [{
+
-            data: [
+	function update(instance, cell, x, y, value) {
-                ["1","Sum of A:","=SUM(A1:A99)"],
+		console.log({instance,cell,x,y,value});
-                ["2"],
+		console.log(spreadsheet[0].getData());
-                ["3"],
+	}
-                ["4"]
+
-            ],
+
-            columns: [
+	const config = {
-                { type: 'autonumber', title: 'amount' },
+	    worksheets: [{
-                { type: 'text', width: '350px', title: 'description', align: 'right' },
+	            data: [
-                { type: 'text', width: '250px', title: 'value' },
+	                ["1","Sum of A:","=SUM(A1:A99)"],
-            ],
+	                ["2"],
-            // Name of the worksheet
+	                ["3"],
-            worksheetName: 'Albums'
+	                ["4"]
-    }]
+	            ],
-});
+	            columns: [
+	                { type: 'autonumber', title: 'amount' },
+	                { type: 'text', width: '350px', title: 'description', align: 'right' },
+	                { type: 'text', width: '250px', title: 'value' },
+	            ],
+	            // Name of the worksheet
+	            worksheetName: 'Albums'
+	    }],
+	    onchange: update
+	};
+
+	function load(){
+		spreadsheet = jspreadsheet(document.getElementById('spreadsheet'), config);
 	}
 
 	onMount(load);

web/build.gradle.kts

@@ -11,3 +11,20 @@ tasks.processResources {
     }
     duplicatesStrategy = DuplicatesStrategy.EXCLUDE
 }
+
+fun download(url : String, destination : String){
+    var destFile = projectDir.toPath().resolve(destination).toFile();
+    destFile.parentFile.mkdirs()
+    if (!destFile.exists()) {
+        System.out.println("Downloading "+url)
+        ant.invokeMethod("get", mapOf("src" to url, "dest" to destFile))
+    }
+}
+
+tasks.register("downloadLib"){
+    download("https://bossanova.uk/jspreadsheet/v5/jspreadsheet.js", "src/main/resources/web/js/jspreadsheet-ce.js")
+}
+
+tasks.named("compileJava") {
+    dependsOn("downloadLib")
+}