Skip to content
Snippets Groups Projects
Commit 79ae674b authored by hendrik.donath's avatar hendrik.donath Committed by Friederike Schwager
Browse files

Fixes for Pen- and Boxannotation under touch.

parent 6d84f5c5
No related branches found
No related tags found
No related merge requests found
...@@ -5441,7 +5441,9 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting ...@@ -5441,7 +5441,9 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting
var _penSize=void 0; var _penSize=void 0;
var _penColor=void 0; var _penColor=void 0;
var path=void 0; var path=void 0;
var lines=void 0;/** var lines=void 0;
var _svg=void 0;/**
* Handle document.mousedown event * Handle document.mousedown event
*/function handleDocumentMousedown(){ */function handleDocumentMousedown(){
path=null; path=null;
...@@ -5505,35 +5507,28 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting ...@@ -5505,35 +5507,28 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting
if(path){svg.removeChild(path);} if(path){svg.removeChild(path);}
path=(0,_appendChild2.default)(svg,{type:'drawing',color:_penColor,width:_penSize,lines:lines}); path=(0,_appendChild2.default)(svg,{type:'drawing',color:_penColor,width:_penSize,lines:lines});
} }
function handeContentTouchstart(e) { function handleContentTouchstart(e) {
document.documentElement.style.overflow = 'hidden';
document.getElementById('content-wrapper').style.overflow = 'hidden';
document.getElementById('body-wrapper').style.overflow = 'hidden';
document.body.classList.add("lock-screen");
path=null; path=null;
lines=[]; lines=[];
savePoint(e.touches[0].pageX,e.touches[0].pageY); _svg = (0, _utils.findSVGAtPoint)(e.touches[0].clientX, e.touches[0].clientY);
saveTouchPoint(e.touches[0].clientX,e.touches[0].clientY);
} }
function handeContentTouchmove(e) { function handleContentTouchmove(e) {
savePoint(e.touches[0].pageX,e.touches[0].pageY); e.preventDefault();
saveTouchPoint(e.touches[0].clientX,e.touches[0].clientY);
} }
function handeContentTouchend(e) { function handleContentTouchend(e) {
document.documentElement.style.overflow = 'auto'; if (lines.length > 1){
document.getElementById('content-wrapper').style.overflow = 'auto'; var _getMetadata=(0,_utils.getMetadata)(_svg);
document.getElementById('body-wrapper').style.overflow = 'auto';
document.body.classList.remove("lock-screen");
var svg=void 0;
if (lines.length > 1 && (svg = (0,findSVGAtTouchPoint(lines[lines.length-1][0],lines[lines.length-1][1])))){
var _getMetadata=(0,_utils.getMetadata)(svg);
var documentId=_getMetadata.documentId; var documentId=_getMetadata.documentId;
var pageNumber=_getMetadata.pageNumber; var pageNumber=_getMetadata.pageNumber;
_PDFJSAnnotate2.default.getStoreAdapter().addAnnotation(documentId,pageNumber,{type:'drawing',width:_penSize,color:_penColor,lines:lines}) _PDFJSAnnotate2.default.getStoreAdapter().addAnnotation(documentId,pageNumber,{type:'drawing',width:_penSize,color:_penColor,lines:lines})
.then(function(annotation){ .then(function(annotation){
if(path){svg.removeChild(path);} if(path){_svg.removeChild(path);}
(0,_appendChild2.default)(svg,annotation); (0,_appendChild2.default)(_svg,annotation);
}, function (err){ }, function (err){
// Remove path // Remove path
if(path){svg.removeChild(path);} if(path){_svg.removeChild(path);}
notification.addNotification({ notification.addNotification({
message: M.util.get_string('error:addAnnotation','pdfannotator'), message: M.util.get_string('error:addAnnotation','pdfannotator'),
type: "error" type: "error"
...@@ -5541,38 +5536,23 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting ...@@ -5541,38 +5536,23 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting
}); });
} }
} }
function handeContentTouchcancel(e) { function handleContentTouchcancel(e) {
document.documentElement.style.overflow = 'auto';
document.getElementById('content-wrapper').style.overflow = 'auto';
document.body.style.overflow = 'auto';
document.body.classList.remove("lock-screen");
lines=null; lines=null;
path.parentNode.removeChild(path); path.parentNode.removeChild(path);
} }
/**
* Determine if a point intersects a rect
*
* @param {Number} x The x coordinate of the point
* @param {Number} y The y coordinate of the point
* @param {Object} rect The points of a rect (likely from getBoundingClientRect)
* @return {Boolean} True if a collision occurs, otherwise false
*/function pointIntersectsRect(x,y,rect){return y>=rect.top&&y<=rect.bottom;}/**
/* Find an SVGElement container at a given touchpoint /* Save a touchpoint to the line being drawn.
* *
* @param {Number} x The x coordinate of the point * @param {Number} x The x coordinate of the point
* @param {Number} y The y coordinate of the point * @param {Number} y The y coordinate of the point
* @return {SVGElement} The container SVG or null if one can't be found. */function saveTouchPoint(x,y){
*/function findSVGAtTouchPoint(x,y){ if(!_svg){return;}
var elements=document.querySelectorAll('svg[data-pdf-annotate-container="true"]'); var rect=_svg.getBoundingClientRect();
for(var i=0,l=elements.length;i<l;i++){ var point=(0,_utils.scaleDown)(_svg,{x:(0,_utils.roundDigits)(x-rect.left,4),y:(0,_utils.roundDigits)(y-rect.top,4)});
var el=elements[i]; lines.push([point.x,point.y]);
var rect=el.getBoundingClientRect(); if(lines.length<=1){return;}
if(rect.top > 0 && rect.bottom > 0){ if(path){_svg.removeChild(path);}
return el; path=(0,_appendChild2.default)(_svg,{type:'drawing',color:_penColor,width:_penSize,lines:lines});
}
}
return null;
} }
   
/** /**
...@@ -5591,10 +5571,10 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting ...@@ -5591,10 +5571,10 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting
contentWrapper.classList.add('cursor-pen'); contentWrapper.classList.add('cursor-pen');
document.addEventListener('mousedown',handleDocumentMousedown); document.addEventListener('mousedown',handleDocumentMousedown);
document.addEventListener('keyup',handleDocumentKeyup); document.addEventListener('keyup',handleDocumentKeyup);
contentWrapper.addEventListener('touchstart',handeContentTouchstart); contentWrapper.addEventListener('touchstart',handleContentTouchstart);
contentWrapper.addEventListener('touchmove',handeContentTouchmove); contentWrapper.addEventListener('touchmove',handleContentTouchmove);
contentWrapper.addEventListener('touchend',handeContentTouchend); contentWrapper.addEventListener('touchend',handleContentTouchend);
contentWrapper.addEventListener('touchcancel',handeContentTouchcancel); contentWrapper.addEventListener('touchcancel',handleContentTouchcancel);
(0,_utils.disableUserSelect)(); (0,_utils.disableUserSelect)();
}/** }/**
* Disable the pen behavior * Disable the pen behavior
...@@ -5607,10 +5587,10 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting ...@@ -5607,10 +5587,10 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting
contentWrapper.classList.remove('cursor-pen'); contentWrapper.classList.remove('cursor-pen');
document.removeEventListener('mousedown',handleDocumentMousedown); document.removeEventListener('mousedown',handleDocumentMousedown);
document.removeEventListener('keyup',handleDocumentKeyup); document.removeEventListener('keyup',handleDocumentKeyup);
contentWrapper.removeEventListener('touchstart',handeContentTouchstart); contentWrapper.removeEventListener('touchstart',handleContentTouchstart);
contentWrapper.removeEventListener('touchmove',handeContentTouchmove); contentWrapper.removeEventListener('touchmove',handleContentTouchmove);
contentWrapper.removeEventListener('touchend',handeContentTouchend); contentWrapper.removeEventListener('touchend',handleContentTouchend);
contentWrapper.removeEventListener('touchcancel',handeContentTouchcancel); contentWrapper.removeEventListener('touchcancel',handleContentTouchcancel);
(0,_utils.enableUserSelect)(); (0,_utils.enableUserSelect)();
} }
/***/}, /***/},
...@@ -5974,7 +5954,6 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting ...@@ -5974,7 +5954,6 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting
// Disable scrolling on the page. // Disable scrolling on the page.
document.documentElement.style.overflow = 'hidden'; document.documentElement.style.overflow = 'hidden';
document.getElementById('content-wrapper').style.overflow = 'hidden'; document.getElementById('content-wrapper').style.overflow = 'hidden';
document.body.style.overflow = 'hidden';
   
rect=_svg.getBoundingClientRect(); rect=_svg.getBoundingClientRect();
originY=e.touches[0].clientY; originY=e.touches[0].clientY;
...@@ -6059,7 +6038,6 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting ...@@ -6059,7 +6038,6 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting
// Enable the scrolling again // Enable the scrolling again
document.documentElement.style.overflow = 'auto'; document.documentElement.style.overflow = 'auto';
document.getElementById('content-wrapper').style.overflow = 'auto'; document.getElementById('content-wrapper').style.overflow = 'auto';
document.body.style.overflow = 'auto';
   
//if the cursor is clicked nothing should happen! //if the cursor is clicked nothing should happen!
if((typeof e.target.getAttribute('className')!='string') && e.target.className.indexOf('cursor') === -1){ if((typeof e.target.getAttribute('className')!='string') && e.target.className.indexOf('cursor') === -1){
...@@ -6075,10 +6053,10 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting ...@@ -6075,10 +6053,10 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting
var _svg=overlay.parentNode.querySelector('svg.annotationLayer'); var _svg=overlay.parentNode.querySelector('svg.annotationLayer');
renderRect(_type,[{top:parseInt(overlay.style.top,10)+rect.top,left:parseInt(overlay.style.left,10)+rect.left,width:parseInt(overlay.style.width,10),height:parseInt(overlay.style.height,10)}],null); renderRect(_type,[{top:parseInt(overlay.style.top,10)+rect.top,left:parseInt(overlay.style.left,10)+rect.left,width:parseInt(overlay.style.width,10),height:parseInt(overlay.style.height,10)}],null);
[textarea,data] = (0,_commentWrapper.openComment)(e,handleCancelClick,handleSubmitClick,handleToolbarClick,handleSubmitBlur,_type); [textarea,data] = (0,_commentWrapper.openComment)(e,handleCancelTouch,handleSubmitClick,handleToolbarClick,handleSubmitBlur,_type);
}else if((rectsSelection=getSelectionRects()) && _type!=='area'){ }else if((rectsSelection=getSelectionRects()) && _type!=='area'){
renderRect(_type,[].concat(_toConsumableArray(rectsSelection)).map(function(r){return{top:r.top,left:r.left,width:r.width,height:r.height};}),null); renderRect(_type,[].concat(_toConsumableArray(rectsSelection)).map(function(r){return{top:r.top,left:r.left,width:r.width,height:r.height};}),null);
[textarea,data] = (0,_commentWrapper.openComment)(e,handleCancelClick,handleSubmitClick,handleToolbarClick,handleSubmitBlur,_type); [textarea,data] = (0,_commentWrapper.openComment)(e,handleCancelTouch,handleSubmitClick,handleToolbarClick,handleSubmitBlur,_type);
}else{ }else{
enableRect(_type); enableRect(_type);
//Do nothing! //Do nothing!
...@@ -6109,10 +6087,23 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting ...@@ -6109,10 +6087,23 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting
} }
function handleCancelClick(e){ function handleCancelClick(e){
//delete Overlay
if(_type==='area'&&overlay){
overlay.parentNode.removeChild(overlay);
overlay=null;
}
//Hide the form for Comments
(0,_commentWrapper.closeComment)(documentId,pageNumber,handleSubmitClick,handleCancelClick,null,false);
deleteUndefinedRect();
//register EventListeners to allow new Annotations
enableRect(_type);
(0,_utils.enableUserSelect)();
}
function handleCancelTouch(e){
// When using on mobile devices scrolling will be prevented, here we have to allow it again. // When using on mobile devices scrolling will be prevented, here we have to allow it again.
document.documentElement.style.overflow = 'auto'; document.documentElement.style.overflow = 'auto';
document.getElementById('content-wrapper').style.overflow = 'auto'; document.getElementById('content-wrapper').style.overflow = 'auto';
document.body.style.overflow = 'auto';
   
//delete Overlay //delete Overlay
if(_type==='area'&&overlay){ if(_type==='area'&&overlay){
...@@ -6122,10 +6113,16 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting ...@@ -6122,10 +6113,16 @@ function startIndex(Y,_cm,_documentObject,_userid,_capabilities, _toolbarSetting
//Hide the form for Comments //Hide the form for Comments
(0,_commentWrapper.closeComment)(documentId,pageNumber,handleSubmitClick,handleCancelClick,null,false); (0,_commentWrapper.closeComment)(documentId,pageNumber,handleSubmitClick,handleCancelClick,null,false);
deleteUndefinedRect(); deleteUndefinedRect();
//register EventListeners to allow new Annotations
// Because of a scrolling issue we have to disable the area annotation after canceling the annotation.
if (_type ==='area') {
disableRect();
document.querySelector('button.cursor').click();
} else {
enableRect(_type); enableRect(_type);
(0,_utils.enableUserSelect)(); (0,_utils.enableUserSelect)();
} }
}
function handleSubmitBlur(){ function handleSubmitBlur(){
if(overlay){ if(overlay){
......
...@@ -861,11 +861,3 @@ header, section, footer, aside, nav, main, article, figure { ...@@ -861,11 +861,3 @@ header, section, footer, aside, nav, main, article, figure {
.path-mod-pdfannotator .pdfannotator-statistic #chart-container { .path-mod-pdfannotator .pdfannotator-statistic #chart-container {
min-height: 500px; min-height: 500px;
} }
.lock-screen {
height: 100%;
overflow: hidden;
width: 100%;
position: fixed;
}
...@@ -25,6 +25,6 @@ ...@@ -25,6 +25,6 @@
defined('MOODLE_INTERNAL') || die(); defined('MOODLE_INTERNAL') || die();
$plugin->component = 'mod_pdfannotator'; // Full name of the plugin (used for diagnostics). $plugin->component = 'mod_pdfannotator'; // Full name of the plugin (used for diagnostics).
$plugin->version = 2021021600; // The current module version (Date: YYYYMMDDXX). $plugin->version = 2021030505; // The current module version (Date: YYYYMMDDXX).
$plugin->release = 'PDF Annotator v1.4 release 5'; $plugin->release = 'PDF Annotator v1.4 release 5';
$plugin->requires = 2016112900; // Requires this Moodle version. $plugin->requires = 2016112900; // Requires this Moodle version.
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment