Feature: Add ability to drag and drop images to MarkdownEditor by ganesh-vk · Pull Request #14587 · JabRef/jabref

ganesh-vk · 2025-12-12T17:37:35Z

I've looked at the JavaFX documentation for dragging and dropping events and think I'm doing everything correctly. However I cannot seem to trigger the DRAG_DROPPED event at all. I've tried to debug and the DRAG_OVER event is being triggered everytime but the dropping isn't working. Please let me know what I should try to fix this.

Steps to test

Open a library and ensure Library file directory is set
Drag and drop an image into the comments section of any entry
The image is appended to the comments field and rendered, it is also saved in the specified directory

Screenshots:

Mandatory checks

I own the copyright of the code submitted and I license it under the MIT license
I manually tested my changes in running JabRef (always required)
[/] I added JUnit tests for changes (if applicable)
I added screenshots in the PR description (if change is visible to the user)
I described the change in CHANGELOG.md in a way that is understandable for the average user (if change is visible to the user)
I checked the user documentation: Is the information available and up to date? If not, I created an issue at https://github.com/JabRef/user-documentation/issues or, even better, I submitted a pull request updating file(s) in https://github.com/JabRef/user-documentation/tree/main/en.

Siedlerchr · 2025-12-12T21:19:52Z

Which OS are you using? Windows? Mac? Linux?

ganesh-vk · 2025-12-12T21:41:12Z

I'm using Linux (Fedora)

koppor · 2025-12-12T23:12:31Z

I've looked at the JavaFX documentation for dragging and dropping events and think I'm doing everything correctly. However I cannot seem to trigger the DRAG_DROPPED event at all.

Do a breakpoint at org.jabref.gui.fieldeditors.LinkedFilesEditor#handleOnDragDropped - and drop a file into the linked files editor (which is part of the Entry Editor)

ganesh-vk · 2025-12-13T20:24:55Z

Jabref-LinkedFilesEditor.mp4

I looked at the class and assume me dragging one file below the other or vice versa should reorder them, but as you can see from the video only the handleOnDragDetected event is being triggered here. Am I doing something wrong or understanding this incorrectly?

ganesh-vk · 2025-12-15T16:39:12Z

@Siedlerchr @koppor Please take a look when you find the time

Siedlerchr · 2025-12-15T19:30:28Z

@ganesh-vk Thanks for the video. I could reproduce it. It's a bug.
The PR #12871 broke the reordering. I am having a fix, will make a PR for it

Siedlerchr · 2025-12-16T11:05:17Z

If you merge in the latest main it will probably also work for your case

ganesh-vk · 2025-12-16T11:53:58Z

If you merge in the latest main it will probably also work for your case

Yes, it works now, thanks for the fix! However I'm unable to figure out how MarkdownEditor uses ViewModelListCellFactory, if you can explain how that would be great.

Related to the original issue, JavaFX WebView does not support all image types ref. Do I change IMAGE in StandardFileType to include only those supported, or create a helper method within MarkdownEditor to check only those formats supported? PreviewViewer's setPreviewText will need a <base> tag to specify the relative file path as well looks like.

koppor

Steps to test missing - why?
Screenshot missing - you can update the PR description to guide maintainers

Related to the original issue, JavaFX WebView does not support all image types ref.

What are "all images types"?

I think, it does not matter here. I just want to drag'n'drop an image from Windows explorer to the text field.

"png" from the issue description is listed there. So, what is the issue?

You can allow attachment of any file - the bibtex could be rendered by another tool, too. It is "just" an exchange format.

PreviewViewer's setPreviewText will need a <base> tag to specify the relative file path as well looks like.

Follow https://devdocs.jabref.org/code-howtos/#get-a-relative-filename-or-path-for-a-file

Use sub directory "assets" (make it a constant in JabRef, so that we could change later)

(Maybe you find another solution at the related feature #14330 , but I don't remember)

…dered by preview viewer

ganesh-vk · 2025-12-16T13:11:03Z

What are "all images types"?

For e.g. webp is not rendered correctly, but webp is an image format so FileUtil.isImage will return true for webp. I can remove webp and other unsupported types from StandardFileTypes but I didn't think that would be a good fix.

Currently all supported formats get rendered and the image gets saved in the directory specified in preferences.

Adding Steps to test and screenshots now, since the PR was incomplete and still a draft I didn't add them.

jabgui/src/main/java/org/jabref/gui/preview/assets/PreviewText.java

jabgui/src/main/java/org/jabref/gui/fieldeditors/MarkdownEditor.java

jablib/src/main/java/org/jabref/logic/util/io/FileUtil.java

jabgui/src/main/java/org/jabref/gui/fieldeditors/MarkdownEditor.java

koppor · 2025-12-17T10:09:37Z

jabgui/src/main/java/org/jabref/gui/fieldeditors/MarkdownEditor.java

+            Files.copy(file.toPath(), destination, StandardCopyOption.REPLACE_EXISTING);
+            String relativePath = FileUtil.relativize(destination, databaseContext.getFileDirectories(filePreferences)).toString();
+            String markdownText = "![](" + relativePath + ")\n";
+            textArea.appendText(markdownText);


Is it possible to insert the link at the place where the mouse pointer was placed when the drop was triggered.

I've changed it to insert at caret position, I wasn't sure if it is better if it's pasted where the caret is compared to just appending since it might lead to formatting errors.

…rted at caret position and not appended

github-actions · 2025-12-20T03:30:14Z

Your pull request conflicts with the target branch.

Please merge with your code. For a step-by-step guide to resolve merge conflicts, see https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/addressing-merge-conflicts/resolving-a-merge-conflict-using-the-command-line.

koppor · 2025-12-23T21:00:04Z

Note that I merged main to have JabRef starting again.

koppor · 2025-12-23T22:47:44Z

CHANGELOG.md

 ### Added

- We added the ability to drag and drop images to the comments field. [14620](https://github.com/JabRef/jabref/pull/14620/files#diff-06572a96a58dc510037d5efa622f9bec8519bc1beab13c9f251e97e657a9d4ed)
+- We added the ability to drag and drop images to the comments field. [#14620](https://github.com/JabRef/jabref/issues/10559)


Really? Are you sure???

Did you or your AI not perform? What time is it? I am awake since 17 hours and still see it.

Why are you doing this to us?

Note #10559 is the right link and #10559 the right issue number

Suggested change

- We added the ability to drag and drop images to the comments field. [#14620](https://github.com/JabRef/jabref/issues/10559)

- We added the ability to drag and drop images to the comments field. [#10559](https://github.com/JabRef/jabref/issues/10559)

It's 4 AM, I'm sorry I missed that, only copy pasted the correct link and forgot to change that :)

koppor · 2025-12-23T22:49:05Z

jabgui/src/main/java/org/jabref/gui/preview/PreviewViewer.java

-            }
-        }
-
-        layoutText = formatPreviewText(baseUrl, text);


For an unsaved library no preview will ever be generated - why?

koppor · 2025-12-23T22:50:06Z

jabgui/src/main/java/org/jabref/gui/fieldeditors/MarkdownEditor.java

+        List<Path> fileDirList = databaseContext.getFileDirectories(filePreferences);
+        Path relativePath = FileUtil.relativize(file.toPath(), fileDirList);
+
+        // If the path is already relative, just insert the Markdown text


Suggested change

// If the path is already relative, just insert the Markdown text

// If the path can be reached from the configured directories somehow, just insert the Markdown text

koppor

Thank you for the follow up.

You are on Windows or Linux?

![](img\assignment.png)

Cannot be rendered here

![](img/'assignment.png)

can.

Any idea of a fix or should I do it?

ganesh-vk · 2025-12-23T23:31:14Z

Thank you for the follow up.

You are on Windows or Linux?
![](img\assignment.png)
``´

Cannot be rendered here


```markdown
![](img/'assignment.png)
can.

Any idea of a fix or should I do it?

I didn't understand, could you please elaborate?

I am using Linux (Fedora)
I've attached a video showcasing a weird bug I found, I cannot figure out what is causing it. Dragging and dropping files from the file manager seems to not work, but the same downloaded file from firefox works

Jabref-DragDropBug.mp4

koppor · 2025-12-23T23:47:10Z

I didn't understand, could you please elaborate?

result of drag and drop - no image shown

Change \ to /

image shown

ganesh-vk · 2025-12-23T23:50:06Z

Looks like this is a windows path problem, I will look into this tomorrow, do you have any hints on what I should try?

Siedlerchr · 2025-12-23T23:55:47Z

jabgui/src/main/java/org/jabref/gui/fieldeditors/MarkdownEditor.java

+    }
+
+    private void insertMarkdownText(String relativePath, EditorTextArea textArea) {
+        String markdownText = "![](" + relativePath + ")\n";


Markdown only understands forward / slashes! Backslash \ is an escape character. This might explain the path issue

https://www.markdownguide.org/basic-syntax/

koppor · 2025-12-24T00:10:28Z

Looks like this is a windows path problem, I will look into this tomorrow, do you have any hints on what I should try?

replace \ by / in the path - locally in insertMarkdownText

koppor · 2025-12-24T00:12:10Z

Dragging and dropping files from the file manager seems to not work,

Welcome to the hell of drag and drop...

One "just" need to add LOGGERR.trace statements for the drag type, read the output, think etc... but I would postpone that for a follow-up. Basically, this will work (if the windows path issue is solved)

See https://devdocs.jabref.org/code-howtos/logging.html for loggin

…-dragdrop

ganesh-vk · 2025-12-24T09:04:25Z

Looks like this is a windows path problem, I will look into this tomorrow, do you have any hints on what I should try?

replace \ by / in the path - locally in insertMarkdownText

I've done this, could you please test it out in Windows and see if it works? I can't test this since I'm on linux

koppor · 2025-12-24T09:45:21Z

@ganesh-vk Works well - thank you for the quick follow ups. This values our time.

ganesh-vk · 2025-12-24T09:49:50Z

@ganesh-vk Works well - thank you for the quick follow ups. This values our time.

Thank you for the reviews!

ganesh-vk added 2 commits December 12, 2025 21:27

Feat: Add necessary event listeners for drag and drop events

fa1ebaf

Switch back to handler from filter

a76451e

ganesh-vk changed the title ~~Markdown dragdrop~~ Feature: Add ability to drag and drop images to MarkdownEditor Dec 12, 2025

calixtus added the component: entry-editor label Dec 12, 2025

Siedlerchr mentioned this pull request Dec 15, 2025

Fix dnd reordering in linked files #14627

Merged

3 tasks

koppor requested changes Dec 16, 2025

View reviewed changes

github-actions bot added the status: changes-required Pull requests that are not yet complete label Dec 16, 2025

add ability to drag and drop images and image files, ensure it is ren…

f403993

…dered by preview viewer

github-actions bot added good second issue Issues that involve a tour of two or three interweaved components in JabRef and removed status: changes-required Pull requests that are not yet complete labels Dec 16, 2025

ganesh-vk marked this pull request as ready for review December 16, 2025 13:16

Moved PreviewViewer text setter to assets and updated CHANGELOG.MD

8d3cb69

ganesh-vk requested a review from koppor December 16, 2025 14:08

calixtus reviewed Dec 17, 2025

View reviewed changes

jabgui/src/main/java/org/jabref/gui/preview/assets/PreviewText.java Outdated Show resolved Hide resolved

koppor requested changes Dec 17, 2025

View reviewed changes

github-actions bot added the status: changes-required Pull requests that are not yet complete label Dec 17, 2025

Address review comments, files no longer replaced, markdown text inse…

a3a6ed3

…rted at caret position and not appended

ganesh-vk requested a review from koppor December 17, 2025 18:57

github-actions bot added status: changes-required Pull requests that are not yet complete and removed status: changes-required Pull requests that are not yet complete labels Dec 17, 2025

github-actions bot removed the status: changes-required Pull requests that are not yet complete label Dec 23, 2025

koppor added the 📌 Pinned label Dec 23, 2025

Address review comments, remove duplicate changelog entry

314ae99

koppor reviewed Dec 23, 2025

View reviewed changes

Added necessary null check

9b0b40f

koppor reviewed Dec 23, 2025

View reviewed changes

Fix PreviewViewer bug, changelog and improve comment

d693100

github-actions bot added the status: changes-required Pull requests that are not yet complete label Dec 23, 2025

koppor requested changes Dec 23, 2025

View reviewed changes

Merge branch 'main' into markdown-dragdrop

0e9cacb

Siedlerchr reviewed Dec 23, 2025

View reviewed changes

github-actions bot removed the status: changes-required Pull requests that are not yet complete label Dec 23, 2025

ganesh-vk added 2 commits December 24, 2025 14:32

Fix windows path bug to ensure images render correctly

e892857

Merge remote-tracking branch 'origin/markdown-dragdrop' into markdown…

552c7a9

…-dragdrop

koppor approved these changes Dec 24, 2025

View reviewed changes

koppor added this pull request to the merge queue Dec 24, 2025

Merged via the queue into JabRef:main with commit 865add7 Dec 24, 2025
49 checks passed

github-actions bot mentioned this pull request Dec 24, 2025

Allow file attachment into the comments editor (Markdown) #10559

Closed

3 tasks

ganesh-vk deleted the markdown-dragdrop branch December 24, 2025 10:23

	- We added the ability to drag and drop images to the comments field. [#14620](https://github.com/JabRef/jabref/issues/10559)
	- We added the ability to drag and drop images to the comments field. [#10559](https://github.com/JabRef/jabref/issues/10559)

	// If the path is already relative, just insert the Markdown text
	// If the path can be reached from the configured directories somehow, just insert the Markdown text

Uh oh!

Conversation

ganesh-vk commented Dec 12, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Steps to test

Screenshots:

Mandatory checks

Uh oh!

Siedlerchr commented Dec 12, 2025

Uh oh!

ganesh-vk commented Dec 12, 2025

Uh oh!

koppor commented Dec 12, 2025

Uh oh!

ganesh-vk commented Dec 13, 2025

Uh oh!

ganesh-vk commented Dec 15, 2025

Uh oh!

Siedlerchr commented Dec 15, 2025

Uh oh!

Siedlerchr commented Dec 16, 2025

Uh oh!

ganesh-vk commented Dec 16, 2025

Uh oh!

koppor left a comment

Choose a reason for hiding this comment

Uh oh!

ganesh-vk commented Dec 16, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

github-actions bot commented Dec 20, 2025

Uh oh!

koppor commented Dec 23, 2025

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

koppor left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

ganesh-vk commented Dec 23, 2025

Uh oh!

koppor commented Dec 23, 2025

Uh oh!

ganesh-vk commented Dec 23, 2025

Uh oh!

Siedlerchr Dec 23, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

koppor commented Dec 24, 2025

Uh oh!

koppor commented Dec 24, 2025

Uh oh!

ganesh-vk commented Dec 24, 2025

Uh oh!

koppor commented Dec 24, 2025

Uh oh!

ganesh-vk commented Dec 24, 2025

Uh oh!

ganesh-vk commented Dec 12, 2025 •

edited

Loading

ganesh-vk commented Dec 16, 2025 •

edited

Loading

koppor left a comment •

edited

Loading

Siedlerchr Dec 23, 2025 •

edited

Loading