Adding template option, fixing unreported issue and more #58
Conversation
| init: function() { | ||
| var self = this; | ||
| self.linewidth = self.options.linewidth; | ||
| if (self.options.storedElement) { |
There was a problem hiding this comment.
this allows us to bring annotations from DB.
| fromy: self.fromy, | ||
| tox: self.tox, | ||
| toy: self.toy | ||
| self.myCanvasContainerId = self.$el.attr('id'); |
There was a problem hiding this comment.
small refectory no big deal here.
| classPosition1 = 'btn-group-vertical'; | ||
| classPosition2 = 'btn-block'; | ||
| } | ||
| if (self.options.useOwnTemplate) { |
There was a problem hiding this comment.
here is where the magic happens, basically this allows to use handlebar, angular or whatever other client side framework to build toolbox template and here we pass corresponding element id, it means we don't need other handcrafted styling that is the reason of this big if-else statement.
| tox: self.tox, | ||
| toy: self.toy | ||
| $('#' + self.drawingLayerId).on('mouseup touchend', function(event) { | ||
| if (self.isToolboxDisable) { |
There was a problem hiding this comment.
this allows to disable drawing by default so user does not edit image by mistake.
| toolbox$.css({ | ||
| cursor: 'pointer', | ||
| }); | ||
| self.isToolboxDisable = true; |
There was a problem hiding this comment.
the default toolbox is disable now.
| }); | ||
| self.isToolboxDisable = true; | ||
| }, | ||
| startEditing: function() { |
There was a problem hiding this comment.
this allows client application to control when to start / end editing, so it can persist annotation in backend repository, etc.
| id: id, | ||
| path: path, | ||
| storedUndo: [], | ||
| storedElement: self.storedElement |
There was a problem hiding this comment.
this is also needed to bring annotations from db for editing.
| undoaction: function(event) { | ||
| event.preventDefault(); | ||
| var self = this; | ||
| if (self.storedElement.length === 0) { |
There was a problem hiding this comment.
fixing a bug, if nothing has been added and user click on undo action, we get some undefined errors in console.
| event.preventDefault(); | ||
| var self = this; | ||
|
|
||
| if (self.storedUndo.length === 0) { |
| for (var i = 0; i < self.storedElement.length; i++) { | ||
| var element = self.storedElement[i]; | ||
|
|
||
| if (element === undefined || element === null) { |
There was a problem hiding this comment.
to prevent persisting undefined / blank annotations
| default: | ||
| } | ||
| } | ||
| self.options.onRedraw(self); |
There was a problem hiding this comment.
notify caller a redraw just happened so it can update annotations in memory, etc.
| } | ||
| if (self.storedUndo.length > 0) { |
There was a problem hiding this comment.
don't remember this change, but without it works ok
| 'id')); | ||
| } | ||
| } else { | ||
| if ($annotate) { |
There was a problem hiding this comment.
if i hide / show the parent canvas from client app, i need to make sure all objects are destroyed otherwise it brings objects / annotations from previous instance. just a bit of memory clean up.
| var opts = $.extend({}, $.fn.annotate.defaults, options); | ||
| var annotate = new Annotate($(this), opts); | ||
| $(this).data('annotate', annotate); | ||
| return annotate; |
There was a problem hiding this comment.
returning annotate objects so client app can use for start / stop editing, etc and access annotations as needed.
djaodjin-annotate.js
Outdated
| color: 'red', | ||
| type: 'rectangle', | ||
| linewidth: 2, | ||
| fontsize: '20p |
There was a problem hiding this comment.
callback to notified caller a redraw just happen.
Now for real:
@smirolo
@paulJordaan
No idea what is going on with formatting but should be easier to follow my changes this time.