-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
60 lines (58 loc) · 1.82 KB
/
index.html
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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Fuzzy Template Matcher</title>
<style>
input {
width: 100%;
}
</style>
</head>
<body>
<h1>Fuzzy Template Matcher</h1>
<label>string:</label><br />
<input id="stringy" value="input a string and this will match variables in the template."/>
<br />
<label>template:</label><br />
<input id="template" value="Enter a {{object}}, and it will {{action}}." />
<br />
<button onclick="window.match()">Match</button>
<p id="out"></p>
<script id="match-template" type="text/x-handlebars-template">
<h3>Marked-up input:</h3>
<input value="{{markedUpInput}}" readonly>
<h3>Values</h3>
{{#each vars}}
{{vName}} : {{value}}<br />
{{/each}}
<h3>Lev distance: {{ld}} (adjusted: {{adjustedLd}})</h3>
</script>
<script src="libs/handlebars-v1.3.0.js" type="text/javascript"></script>
<script src="fuzzyTemplateMatcher.js" type="text/javascript"></script>
<script>
var source = document.getElementById("match-template").innerHTML;
var template = Handlebars.compile(source);
window.match = function() {
var stringyString = document.getElementById("stringy").value;
var templateString = document.getElementById("template").value;
var result = fuzzyTemplateMatch( stringyString, templateString );
result.vars = result.vars;
result.ld = result.ld;
console.log(result);
var markedUpInput = "";
var prevVar = {
start: 0,
end: 0
};
result.vars.forEach(function(v, i) {
markedUpInput += stringyString.slice(prevVar.end, v.start);
markedUpInput += "{{" + stringyString.slice(v.start, v.end) + "}}";
prevVar = v;
});
result.markedUpInput = markedUpInput;
document.getElementById("out").innerHTML = template(result);
};
</script>
</body>
</html>