Add mobile text selection handles

pdfjs/viewer.css

@@ -302,6 +302,12 @@ body.portal #viewerContainer::-webkit-scrollbar { /* WebKit */
 	z-index: 2;
 }
 
+:root[data-mobile-reader] .textLayer {
+	user-select: none;
+	-webkit-user-select: none;
+	-webkit-touch-callout: none;
+}
+
 .textLayer :is(span, br) {
 	color: transparent;
 	position: absolute;
@@ -400,6 +406,65 @@ body.portal #viewerContainer::-webkit-scrollbar { /* WebKit */
 	outline: none;
 }
 
+.mobileTextSelectionHandles {
+	position: absolute;
+	left: 0;
+	top: 0;
+	z-index: 5;
+	pointer-events: none;
+}
+
+.mobileTextSelectionHandle {
+	position: absolute;
+	width: 44px;
+	height: 44px;
+	margin-left: -22px;
+	margin-top: -22px;
+	touch-action: none;
+	pointer-events: auto;
+}
+
+.mobileTextSelectionHandleGlyph {
+	position: absolute;
+	left: 6px;
+	top: 0;
+	width: 32px;
+	height: 44px;
+	transform: rotate(var(--selection-handle-rotation, 0deg));
+	transform-origin: 50% 50%;
+}
+
+.mobileTextSelectionHandleGlyph::before {
+	content: '';
+	position: absolute;
+	left: 15px;
+	top: 8px;
+	width: 2px;
+	height: 28px;
+	border-radius: 1px;
+	background: #4078f2;
+}
+
+.mobileTextSelectionHandleGlyph::after {
+	content: '';
+	position: absolute;
+	width: 12px;
+	height: 12px;
+	border-radius: 50%;
+	background: #4078f2;
+	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
+}
+
+.mobileTextSelectionHandle[data-side="start"] .mobileTextSelectionHandleGlyph::after {
+	left: 4px;
+	top: 3px;
+}
+
+.mobileTextSelectionHandle[data-side="end"] .mobileTextSelectionHandleGlyph::after {
+	right: 4px;
+	bottom: 3px;
+}
+
 body, #viewerContainer {
 	background-color: #f2f2f2; /* --color-toolbar */
 }

src/pdf/lib/auto-scroll.js

@@ -34,17 +34,22 @@ export class AutoScroll {
 		};
 		container.ownerDocument.defaultView.requestAnimationFrame(scroll);
 
-
 		container.ownerDocument.defaultView.addEventListener('mousemove', this._handleMouseMove.bind(this));
-		container.ownerDocument.defaultView.addEventListener('mouseup', () => this.disable.bind(this));
-
+		container.ownerDocument.defaultView.addEventListener('mouseup', () => this.disable());
 	}
 
 	_handleMouseMove(event) {
 		if (event.buttons !== 1) {
 			this.disable();
 			return;
 		}
+		if (!this._enabled) {
+			return;
+		}
+		this.update(event.clientX, event.clientY);
+	}
+
+	update(clientX, clientY) {
 		if (!this._enabled) {
 			return;
 		}
@@ -57,7 +62,7 @@ export class AutoScroll {
 			rect[3] - MARGIN
 		];
 
-		let p = [event.clientX, event.clientY];
+		let p = [clientX, clientY];
 
 		// Get absolute distance to rect
 		var dx = Math.max(rect[0] - p[0], 0, p[0] - rect[2]);
@@ -93,4 +98,8 @@ export class AutoScroll {
 		this._enabled = false;
 		this._scrollVector = [0, 0];
 	}
+
+	stop() {
+		this.disable();
+	}
 }

src/pdf/lib/text-range-handles.js

@@ -0,0 +1,37 @@
+import { normalizeDegrees } from './utilities';
+import { getRectRotationOnText } from '../selection';
+
+function getHandleRect(rect, rotation, side, padding) {
+	let [x1, y1, x2, y2] = rect;
+	if (side === 'start') {
+		return (
+			rotation === 0 && [x1 - padding, y1, x1 + padding, y2]
+			|| rotation === 90 && [x1, y2 - padding, x2, y2 + padding]
+			|| rotation === 180 && [x2 - padding, y1, x2 + padding, y2]
+			|| rotation === 270 && [x1, y1 - padding, x2, y1 + padding]
+		);
+	}
+	return (
+		rotation === 0 && [x2 - padding, y1, x2 + padding, y2]
+		|| rotation === 90 && [x1, y1 - padding, x2, y1 + padding]
+		|| rotation === 180 && [x1 - padding, y1, x1 + padding, y2]
+		|| rotation === 270 && [x1, y2 - padding, x2, y2 + padding]
+	);
+}
+
+export function getTextRangeHandle({ chars, pageIndex, rect, side, getRect, getViewportRotation, padding = 3 }) {
+	let rotation = getRectRotationOnText(chars, rect);
+	rotation += getViewportRotation(pageIndex);
+	rotation = normalizeDegrees(rotation);
+	let handleRect = getHandleRect(getRect(rect, pageIndex), rotation, side, padding);
+	if (!handleRect) {
+		return null;
+	}
+	return {
+		pageIndex,
+		rect: handleRect,
+		rotation,
+		side,
+		vertical: [90, 270].includes(rotation)
+	};
+}