Commit 5132a5945fc5abc0083c7b97edad50aaaaed3074

Annotorious - editor UI options to add Label, Tags and related links -
  • Diff rendering mode:
  • inline
  • side by side

swtr/static/css/annotorious.css

234 border-bottom:1px solid #ccc;234 border-bottom:1px solid #ccc;
235 margin:0px;235 margin:0px;
236 background-color:#fff;236 background-color:#fff;
237 padding:3px;
237 /*padding:3px;*/
238 font-family:Verdana, Arial;238 font-family:Verdana, Arial;
239 font-size:12px; 239 font-size:12px;
240}240}

swtr/static/js/lib/custom-fields-plugin.js

1/**
2 * A plugin that adds 'Semantic Tagging' functionality to Annotorious.
3 * While typing an annotation in the editor, the text is sent to the plugin's
4 * server counterpart for Named Entity Recognition (NER). Recognized entities
5 * are suggested as possible tags, and the user can add them to the annotation
6 * by clicking on them. Tags are Semantic Tags in the sense that they are not
7 * just strings, but (underneath the hood) include a URI pointing to a concept
8 * in a specific 'knowledge context', hosted at the server.
9 *
10 * The config options for the plugin require a field named 'endpoint_url',
11 * holding the URL of the server endpoint to use as the NER/tag-suggestion
12 * service.
13 *
14 * @param {Object=} opt_config_options the config options
15 */
16annotorious.plugin.CustomFields = function(opt_config_options) {
17
18 //Container for custom fields
19
20
21 /** @private **/
22 //this._tags = [];
23 // this._link =[];
24 // this._label= [];
25 //annotorious.Annotation(tags);
26
27
28 /** @private **/
29/** this._ENDPOINT_URI = opt_config_options['endpoint_url'];
30
31 if (this._ENDPOINT_URI[this._ENDPOINT_URI.length - 1] != '/')
32 this._ENDPOINT_URI += '/';
33
34 this._ENDPOINT_URI +=
35 'services/wikify?minProbability=0.1&disambiguationPolicy=loose&responseFormat=json&source='; **/
36}
37
38annotorious.plugin.CustomFields.prototype.onInitAnnotator = function(annotorious) {
39 var container = document.createElement('div');
40 container.className = "btn-group";
41 console.log (container);
42
43 var textTemplate= _.template($('#button-template').html());
44 console.log($(textTemplate));
45 annotorious.editor.addField(textTemplate);
46
47 //this._EditField(annotorious);
48 //this._popupField(annotator);
49 //this._extendEditor(annotator);
50}

swtr/static/js/lib/label.js

1
2annotorious.plugin.CustomFields.prototype._EditField = function (annotorious) {
3 //Container for custom fields
4 var container = document.createElement('div');
5 container.className = "btn-group";
6 console.log (container);
7
8
9 window.container = container;
10
11 var textTemplate= _.template($('#button-template').html());
12 console.log($(textTemplate));
13 annotorious.editor.addField(textTemplate);
14}

swtr/static/js/swtmaker.js

98 new_models.push(model);98 new_models.push(model);
99 }99 }
100 });100 });
101 return new_models;
101 return new_models;
102 },102 },
103 // update part of the collection after a save on the server103 // update part of the collection after a save on the server
104 update: function() {104 update: function() {
……
144 swtr.appView.$overlay.show();144 swtr.appView.$overlay.show();
145 this.collection.post({145 this.collection.post({
146 success: function(collection, response) {146 success: function(collection, response) {
147 //console.log(collection, response);
147 console.log(collection, response);
148 swtr.sweets.update(collection);148 swtr.sweets.update(collection);
149 //TODO: move this to a annotation view or something149 //TODO: move this to a annotation view or something
150 anno.removeAll();150 anno.removeAll();
……
153 swt.get('how')['editable'] = false;153 swt.get('how')['editable'] = false;
154 swt.get('how').text += '\n - by ' + swt.get('who');154 swt.get('how').text += '\n - by ' + swt.get('who');
155 }155 }
156 console.log(swt.get('how'));
156 anno.addAnnotation(swt.get('how'));157 anno.addAnnotation(swt.get('how'));
157 });158 });
158 //console.log(swtr.sweets.toJSON());159 //console.log(swtr.sweets.toJSON());
……
179 'click #img-url-submit': 'setImage',179 'click #img-url-submit': 'setImage',
180 'click #sweet': 'sweet',180 'click #sweet': 'sweet',
181 'click #signin-credentials': 'getSignInCredentials',181 'click #signin-credentials': 'getSignInCredentials',
182 'click #setbox': 'showHide'
182 'click #setbox': 'showHide',
183 'click #comment, #label, #tags, #links ': 'button_custom'
183 },184 },
184 initialize: function() {185 initialize: function() {
185 //var allElements = $('body *');186 //var allElements = $('body *');
……
192 anno.hideAnnotations();});192 anno.hideAnnotations();});
193 anno.addHandler('onSelectionCompleted', function(annotation) {193 anno.addHandler('onSelectionCompleted', function(annotation) {
194 anno.showAnnotations(); });194 anno.showAnnotations(); });
195
196
195 anno.addPlugin('CustomFields', this.showSwtHelp);
196 anno.addHandler('onSelectionCompleted', this.setShape);
197 this.$overlay = $('#app-overlay');197 this.$overlay = $('#app-overlay');
198 this.$img = $('#annotatable-img');198 this.$img = $('#annotatable-img');
199 this.imgURL = this.$img.attr('src');199 this.imgURL = this.$img.attr('src');
……
205 this.helpview.step(1);205 this.helpview.step(1);
206 }206 }
207 },207 },
208 setShape: function(annotation) {
209 window.annotation=annotation;
210 },
208211
209 setImage: function() {212 setImage: function() {
210 anno.reset();213 anno.reset();
……
291 }291 }
292 292
293 },293 },
294
295 /*build_txt: function(opt_array) {
296 var textarray = opt_array;
297 var newobj = [textarray];
298 console.log(newarray);
299
300 },*/
301 button_custom: function(event) {
302 var src = $('#img-url-input').val();
303 var newanno= {};
304 var tempinput = $('.annotorious-editor-text:first');
305 //type setting
306 // var type = $(tempinput).attr("placeholder").slice(5);
307 //console.log(type);
308 newanno.text = tempinput.val();
309 newanno.src = src;
310 $(tempinput).val("");
311 var placeHolder = "Add "+event.currentTarget.innerHTML;
312 $(tempinput).attr("placeholder", placeHolder);
313 newanno.shapes = [{'type':annotation.shape.type, 'geometry':{'x':annotation.shape.geometry.x, 'y':annotation.shape.geometry.y, 'width':annotation.shape.geometry.width, 'height':annotation.shape.geometry.height}}];
314 anno.addAnnotation(newanno);
315 //swtr.appView.ShowSwtHelp;
316 },
317
294 getSignInCredentials: function(event) {318 getSignInCredentials: function(event) {
295 event.preventDefault();319 event.preventDefault();
296 if(swtr.who === 'Guest' && !$('#username').length) {320 if(swtr.who === 'Guest' && !$('#username').length) {
……
372 break;372 break;
373 case 2: text = 'Annotate the image, or see other annotations';373 case 2: text = 'Annotate the image, or see other annotations';
374 break;374 break;
375 case 3: text = 'Now you can sweet this annotation.';
375 case 3: text = 'Now you can sweet this annotation, or add more annotations';
376 break;376 break;
377 case 4: text = 'Click button to sweet these sweet annotations';
377 case 4: text = 'Click Sweet button to publish these annotations to the Sweet Store';
378 break;378 break;
379 case 5: text = 'Publishing your sweets';379 case 5: text = 'Publishing your sweets';
380 break;380 break;

swtr/templates/index.html

66 <script src="{{ url_for('static', filename='js/lib/underscore-1.5.2.min.js') }}"></script>66 <script src="{{ url_for('static', filename='js/lib/underscore-1.5.2.min.js') }}"></script>
67 <script src="{{ url_for('static', filename='js/lib/backbone-1.0.0.min.js') }}"></script>67 <script src="{{ url_for('static', filename='js/lib/backbone-1.0.0.min.js') }}"></script>
68 <script src="{{ url_for('static', filename='js/lib/annotorious.debug.js') }}"></script>68 <script src="{{ url_for('static', filename='js/lib/annotorious.debug.js') }}"></script>
69 <script src="{{ url_for('static', filename='js/lib/custom-fields-plugin.js') }}"></script>
70 <script src="{{ url_for('static', filename='js/lib/label.js') }}"></script>
69 <!--script src="https://login.persona.org/include.js"></script-->71 <!--script src="https://login.persona.org/include.js"></script-->
70 <script src="{{ url_for('static', filename='js/swtmaker.js') }}"></script>72 <script src="{{ url_for('static', filename='js/swtmaker.js') }}"></script>
7173
……
87 <label class="sr-only" for="password">Password</label>87 <label class="sr-only" for="password">Password</label>
88 <input type="password" class="form-control" id="password" placeholder="Password">88 <input type="password" class="form-control" id="password" placeholder="Password">
89 </div>89 </div>
90 </script>
90 </script>
91 <script type="text/template" id="button-template">
92 <div class="btn-group">
93 <button type="button" class="btn-default"
94 id="comment">Comment</button>
95 <button type="button" class="btn-default"
96 id="label">Label</button>
97 <button type="button" class="btn-default"
98 id="tags">Tags</button>
99 <button type="button" class="btn-default "
100 id="links">Links</button>
101 </div>
102 </script>
91 </body>103 </body>
92</html>104</html>