sclbl-webnode/example.html at master · scailable/sclbl-webnode · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>Scailable WASI example</title>
</head>

<body>

<h1>Scailable webnode example</h1>

<p>Demo page for running a Scailable task either locally (in the browser), or remotely. See <a href="https://github.com/scailable/sclbl-webnode">https://github.com/scailable/sclbl-webnode</a> and the source code of this page for further details.</p>

<p>
	<b>Compute-function ID: </b> <input type="text" name="cfid" id="compute-function-id" value="27d21872-c4ff-11ea-816c-9600004e79cc"><br/>
	<b>Input vector: </b> <input type="text" name="cfid" id="input-vector" value="[[1,2,3,4,5]]"><br/>
	<b>Location: </b>
	<select id="location-select">
		<option value="local">Local (run in browser)</option>
		<option value="remote">Remote (run as a REST service)</option>
	</select>
	<br />
	<button type="button" id="run-button">Run task</button>
	<div id="result"></div>
</p>

<p>
	Examples:
	<ul>
		<li>Integer sum:
			<ul>
				<li><b>Compute-function ID::</b> 27d21872-c4ff-11ea-816c-9600004e79cc </li>
				<li><b>Input vector:</b> <code>[[1,2,3,4,5]]</code></li>
			</ul>
		</li>
		<li>Linear regression:
			<ul>
				<li><b>Compute-function ID::</b> e871d8e5-b2e2-11ea-a47d-9600004e79cc </li>
				<li><b>Input vector:</b> <code>[[2,5]]</code></li>
				<li>See our <a href="https://github.com/scailable/sclbl-tutorials/blob/master/sclbl-101-getting-started/README.md" target="_blank">getting started tutorial</a>.</li>
			</ul>
		</li>
	</ul>
	Please see your web console for debug output.
</p>

<script src="min/sclbl-webnode-min.js"></script> <!-- provides sclblRuntime object -->
<script>

// When button is pushed:
document.getElementById("run-button").onclick = function(){

	document.getElementById("result").innerHTML = "";

	// Get value selection:
	var select = document.getElementById("location-select");
	var location = select.options[select.selectedIndex].value;

	// Set task uptions:
	sclblRuntime.options({
		"cfid": document.getElementById("compute-function-id").value, // Required
		"location": location,  // Optional, default local
		"strict": false,  // Optional, default false
		"inputType": "string", // Optional, default string
		"outputType": "numVec", // Optional default string
		"debug": false, // Optional, default false, set to true for extensive logging
	});

	let inputData = document.getElementById("input-vector").value;

	// Run the task
	sclblRuntime.run(inputData).then(function(response) {
		document.getElementById("result").innerHTML = "Compute result is: " + response;
	}, function(error) {
		document.getElementById("result").innerHTML = "An error occurred (see console for more details): " + error;
	});

}

</script>

</body>
</html>