Skip to content

Commit 5cacfde

Browse files
committed
minimal PDF tooltip.
1 parent 562eca3 commit 5cacfde

File tree

1 file changed

+84
-29
lines changed

1 file changed

+84
-29
lines changed

previewers/betatest/js/refiqdacore.js

Lines changed: 84 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -295,7 +295,16 @@ function parseData2(data) {
295295
// Create tooltip-enabled name if we have position data
296296
let displayName = selectionName;
297297
if (startPos && endPos && plainTextPath && (selection.nodeName === "PlainTextSelection" || selection.nodeName === "PDFSelection")) {
298-
displayName = createSelectionWithTooltip(selectionName, startPos, endPos, plainTextPath, sourceGuid);
298+
if (selection.nodeName === "PDFSelection") {
299+
let page = selection.getAttribute("page");
300+
let firstX = selection.getAttribute("firstX");
301+
let firstY = selection.getAttribute("firstY");
302+
let secondX = selection.getAttribute("secondX");
303+
let secondY = selection.getAttribute("secondY");
304+
displayName = createPdfSelectionWithTooltip(selectionName, page, firstX, firstY, secondX, secondY, sourceGuid);
305+
} else {
306+
displayName = createSelectionWithTooltip(selectionName, startPos, endPos, plainTextPath, sourceGuid);
307+
}
299308
}
300309

301310
annotationRows.push({
@@ -837,6 +846,36 @@ function createSelectionWithTooltip(selectionName, startPos, endPos, plainTextPa
837846
return spanHtml;
838847
}
839848

849+
function createPdfSelectionWithTooltip(selectionName, page, firstX, firstY, secondX, secondY, sourceGuid) {
850+
// Create a span with data attributes for the tooltip
851+
let spanHtml = '<span class="selection-with-pdf-coords" ' +
852+
'data-page="' + page + '" ' +
853+
'data-first-x="' + firstX + '" ' +
854+
'data-first-y="' + firstY + '" ' +
855+
'data-second-x="' + secondX + '" ' +
856+
'data-second-y="' + secondY + '" ' +
857+
'data-source-guid="' + sourceGuid + '">' +
858+
selectionName +
859+
'</span>';
860+
861+
return spanHtml;
862+
}
863+
864+
function formatPdfCoordsTooltip(page, firstX, firstY, secondX, secondY) {
865+
return `
866+
<div style="padding: 8px; font-family: sans-serif;">
867+
<div style="font-weight: bold; margin-bottom: 6px; font-size: 11px; color: #666; border-bottom: 1px solid #ddd; padding-bottom: 4px;">
868+
PDF Selection Coordinates
869+
</div>
870+
<div style="font-size: 13px; line-height: 1.5;">
871+
<strong>Page:</strong> ${page}<br>
872+
<strong>Start (X, Y):</strong> ${firstX}, ${firstY}<br>
873+
<strong>End (X, Y):</strong> ${secondX}, ${secondY}
874+
</div>
875+
</div>
876+
`;
877+
}
878+
840879
function createSourceReference(source) {
841880
let sourceName = source.getAttribute("name");
842881
let plainTextPath = source.getAttribute("plainTextPath");
@@ -893,15 +932,15 @@ function formatExcerptTooltip(excerpt, startPos, endPos) {
893932
// Update the initializeExcerptTooltips function with better error handling
894933
function initializeExcerptTooltips() {
895934
// Destroy any existing Tippy instances to avoid duplicates
896-
$('.selection-with-excerpt').each(function() {
935+
$('.selection-with-excerpt, .selection-with-pdf-coords').each(function() {
897936
if (this._tippy) {
898937
this._tippy.destroy();
899938
}
900939
});
901940

902941
// Initialize Tippy for all selection elements
903-
tippy('.selection-with-excerpt', {
904-
content: 'Loading excerpt...',
942+
tippy('.selection-with-excerpt, .selection-with-pdf-coords', {
943+
content: 'Loading...',
905944
allowHTML: true,
906945
interactive: true,
907946
theme: 'light-border',
@@ -911,40 +950,56 @@ function initializeExcerptTooltips() {
911950
delay: [200, 0], // 200ms delay on show, 0ms on hide
912951
onShow(instance) {
913952
const element = instance.reference;
914-
const startPos = parseInt(element.getAttribute('data-start'));
915-
const endPos = parseInt(element.getAttribute('data-end'));
916-
const plainTextPath = element.getAttribute('data-path');
917-
const sourceGuid = element.getAttribute('data-source-guid');
918-
953+
919954
// If content is already loaded, show it immediately
920-
if (element.getAttribute('data-excerpt-loaded') === 'true') {
955+
if (element.getAttribute('data-tooltip-loaded') === 'true') {
921956
return; // Content already set, just show the tooltip
922957
}
923958

924-
// Set loading state
925-
instance.setContent('<div style="padding: 8px;"><em>Loading excerpt...</em></div>');
926-
927-
// Load the excerpt asynchronously
928-
loadTextExcerpt(plainTextPath, startPos, endPos, sourceGuid)
929-
.then(excerpt => {
930-
if (excerpt) {
931-
const formattedContent = formatExcerptTooltip(excerpt, startPos, endPos);
932-
instance.setContent(formattedContent);
933-
element.setAttribute('data-excerpt-loaded', 'true');
934-
} else {
935-
instance.setContent('<div style="padding: 8px; color: #999;"><em>Could not load excerpt</em></div>');
936-
}
937-
})
938-
.catch(error => {
939-
console.error('Error loading excerpt:', error);
940-
instance.setContent(`<div style="padding: 8px; color: #d32f2f;"><em>Error: ${error.message || 'Could not load excerpt'}</em></div>`);
941-
});
959+
if (element.classList.contains('selection-with-pdf-coords')) {
960+
// Handle PDF coordinate tooltips
961+
const page = element.getAttribute('data-page');
962+
const firstX = element.getAttribute('data-first-x');
963+
const firstY = element.getAttribute('data-first-y');
964+
const secondX = element.getAttribute('data-second-x');
965+
const secondY = element.getAttribute('data-second-y');
966+
967+
const formattedContent = formatPdfCoordsTooltip(page, firstX, firstY, secondX, secondY);
968+
instance.setContent(formattedContent);
969+
element.setAttribute('data-tooltip-loaded', 'true');
970+
971+
} else if (element.classList.contains('selection-with-excerpt')) {
972+
// Handle text excerpt tooltips
973+
const startPos = parseInt(element.getAttribute('data-start'));
974+
const endPos = parseInt(element.getAttribute('data-end'));
975+
const plainTextPath = element.getAttribute('data-path');
976+
const sourceGuid = element.getAttribute('data-source-guid');
977+
978+
// Set loading state
979+
instance.setContent('<div style="padding: 8px;"><em>Loading excerpt...</em></div>');
980+
981+
// Load the excerpt asynchronously
982+
loadTextExcerpt(plainTextPath, startPos, endPos, sourceGuid)
983+
.then(excerpt => {
984+
if (excerpt) {
985+
const formattedContent = formatExcerptTooltip(excerpt, startPos, endPos);
986+
instance.setContent(formattedContent);
987+
element.setAttribute('data-tooltip-loaded', 'true');
988+
} else {
989+
instance.setContent('<div style="padding: 8px; color: #999;"><em>Could not load excerpt</em></div>');
990+
}
991+
})
992+
.catch(error => {
993+
console.error('Error loading excerpt:', error);
994+
instance.setContent(`<div style="padding: 8px; color: #d32f2f;"><em>Error: ${error.message || 'Could not load excerpt'}</em></div>`);
995+
});
996+
}
942997
},
943998
onHidden(instance) {
944999
// Optional: Clear loading state when hidden
9451000
// This allows the tooltip to reload if shown again
9461001
// Remove this if you want to keep cached content
947-
// instance.reference.removeAttribute('data-excerpt-loaded');
1002+
// instance.reference.removeAttribute('data-tooltip-loaded');
9481003
}
9491004
});
9501005
}

0 commit comments

Comments
 (0)