danvics/pdfdraw
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improve drag/drop for text annotations.

Browse source
This commit is contained in:
Joachim Bauch 2021-12-14 10:27:03 +01:00
parent 5e994f25a2
commit 9d19395dcc
No known key found for this signature in database
GPG key ID: 77C1D22D53E15F02
2 changed files with 23 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
css/pdfdraw.css
View file

@ -280,9 +280,15 @@
float: right; float: right;
margin-bottom: 5px; margin-bottom: 5px;
font-size: 18px; font-size: 18px;
cursor: pointer;
}
.textareaContainer .deleteButton[disabled] {
cursor: default;
} }
.textareaContainer .author { .textareaContainer .author {
cursor: default;
display: inline-block; display: inline-block;
margin-top: 12px; margin-top: 12px;
margin-left: 12px; margin-left: 12px;

21
src/pdfdraw.js
View file

@ -626,18 +626,28 @@ var TextArea = function(page_annotator, text, color, author) {
this.name = getObjectId(); this.name = getObjectId();
this.textareaContainer = $('<div class="textareaContainer form-group shadow-textarea"></div>'); this.textareaContainer = $('<div class="textareaContainer form-group shadow-textarea"></div>');
this.textareaContainer.draggable({ this.textareaContainer.draggable({
start: function(event, ui) {
if ($('textarea', this.textareaContainer).prop("disabled")) {
event.preventDefault();
}
}.bind(this),
drag: function(event, ui) { drag: function(event, ui) {
this.textareaContainerPos = [ui.position.left, ui.position.top]; this.textareaContainerPos = [
ui.position.left / this.page_annotator.scale,
ui.position.top / this.page_annotator.scale
];
this.update(); this.update();
this.sendData(); this.sendData();
}.bind(this), }.bind(this),
stop: function(event, ui) { stop: function(event, ui) {
this.textareaContainerPos = [ui.position.left, ui.position.top]; this.textareaContainerPos = [
ui.position.left / this.page_annotator.scale,
ui.position.top / this.page_annotator.scale
];
this.update(); this.update();
this.sendData(); this.sendData();
}.bind(this), }.bind(this),
}); });
this.textareaContainer.draggable('disable');
this.textareaContainer.on('click', function(event) { this.textareaContainer.on('click', function(event) {
this.page_annotator.annotator.drawer.onClick(this.page_annotator, { this.page_annotator.annotator.drawer.onClick(this.page_annotator, {
'point': { 'point': {
@ -677,6 +687,9 @@ var TextArea = function(page_annotator, text, color, author) {
this.textarea.on('focus', function(e) { this.textarea.on('focus', function(e) {
this.onFocus(); this.onFocus();
}.bind(this)); }.bind(this));
this.textarea.on('dragstart', function(e) {
e.preventDefault();
}.bind(this));
this.textareaContainer.append(this.authorLabel, this.closeButton, this.textarea); this.textareaContainer.append(this.authorLabel, this.closeButton, this.textarea);
this.textareaContainer.css("background-color", this.color); this.textareaContainer.css("background-color", this.color);
this.textarea.css("font-size", this.page_annotator.annotator.fontSize+"px"); this.textarea.css("font-size", this.page_annotator.annotator.fontSize+"px");
@ -824,7 +837,6 @@ TextArea.prototype.onFocus = function() {
this._selecting = true; this._selecting = true;
$('textarea', this.textareaContainer).prop("disabled", false); $('textarea', this.textareaContainer).prop("disabled", false);
this.closeButton.prop("disabled", false); this.closeButton.prop("disabled", false);
this.textareaContainer.draggable("enable");
this.textareaContainer.css("box-shadow", "0px 0px 15px 5px"+this.color); this.textareaContainer.css("box-shadow", "0px 0px 15px 5px"+this.color);
this.circle.shadowColor = "black"; this.circle.shadowColor = "black";
this.circle.shadowBlur = 10; this.circle.shadowBlur = 10;
@ -1008,6 +1020,7 @@ PageAnnotator.prototype.update = function(scale) {
(width + (this.pagewidth * (1 - scale))) / 2, (width + (this.pagewidth * (1 - scale))) / 2,
(height + (this.pageheight * (1 - scale))) / 2); (height + (this.pageheight * (1 - scale))) / 2);
this.view.zoom = scale; this.view.zoom = scale;
this.activate();
each(this.textAnnotations, function(ta) { each(this.textAnnotations, function(ta) {
ta.onResized(); ta.onResized();
}); });