Add tokenfield tag editor

templates/edit.html

@@ -1,7 +1,5 @@
 {{template "header.html" .S}}
 
-<!-- TODO: tokenfield -->
-
 {{$submissionID := .SubmissionID}}
 {{with .Book}}
 <div class="row">
@@ -108,6 +106,27 @@
 </div>
 {{end}}
 
-<!-- TODO: tokenfield -->
+<script src="/js/tokenfield.min.js"></script>
+<script>
+var tf = new Tokenfield({
+	el: document.querySelector('#tags'),
+	items: [
+		{{range $i, $tag := .Tags}}
+		{id: 1000 + {{$i}}, name: '{{$tag}}'},
+		{{end}}
+	],
+	setItems: [
+		{{range $i, $tag := .Book.Tags}}
+		{id: {{$i}}, name: '{{$tag}}'},
+		{{end}}
+	],
+	delimiters: [","],
+	newItems: true
+});
+tf.on('change', function() {
+	const tag_list = tf.getItems().map((i) => i.name).join();
+	document.querySelector('#tags').value = tag_list;
+});
+</script>
 
 {{template "footer.html" .S}}

templates/header.html

@@ -7,6 +7,7 @@
 	<link href="/img/favicon.ico" rel="icon" type="image/x-icon" />
 	<link href="/css/bootstrap.min.css" rel="stylesheet">
 	<link href="/css/custom.css" rel="stylesheet">
+	<link href="/css/tokenfield.css" rel="stylesheet">
 	<link rel="alternate" type="application/rss+xml" title="{{.Title}}" href="/search/?fmt=rss&q={{.Search}}" />
 
 	<title>{{.Title}}</title>