--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/src_js/iconolab-bundle/editor.html Wed Feb 15 16:42:06 2017 +0100
@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <title>Iconolab</title>
+ <link rel="stylesheet" href="/static/iconolab/css/iconolab.css">
+ <style>
+ body {
+ margin-top: 40px;
+ }
+ </style>
+ </head>
+ <body>
+
+ <div class="container-fluid">
+ <div class="row">
+ <div class="col-md-9">
+ <div id="wrapper">
+ <image-annotator ref="annotator" image="img/main-image.jpg"></image-annotator>
+ </div>
+ </div>
+ <div class="col-md-3">
+ <div class="alert alert-success" style="display: none;">Annotation saved in LocalStorage!</div>
+ <pre id="annotation"></pre>
+ </div>
+ </div>
+ </div>
+
+ <script src="/static/iconolab/js/vendor.js"></script>
+ <script src="/static/iconolab/js/iconolab.js"></script>
+ <script>
+
+ function showAlert() {
+ $('.alert-success').show();
+ setTimeout(function() {
+ $('.alert-success').hide();
+ }, 3000);
+ }
+
+ var vm = new Vue({
+ el: '#wrapper'
+ });
+
+ var data = localStorage.getItem('annotation');
+ if (data) {
+ var annotation = JSON.parse(data);
+ vm.$refs.annotator.setAnnotation(annotation);
+ $('#annotation').text(JSON.stringify(annotation, null, 2));
+ }
+
+ vm.$refs.annotator.$on('save', function(data) {
+ console.log('Saving in localStorage', JSON.stringify(data));
+ showAlert();
+ localStorage.setItem('annotation', JSON.stringify(data));
+ });
+
+ </script>
+ </body>
+</html>