[WIP] Conversion of Preferences/preview to mvvm

[calixtus]

follow-up to #5033

This is my first shot on the PreviewTab in the Preferences and it has been a real nightmare. What started as an i-thought-so-easy-sunday-morning-project became a horrorstory of listViews, impossible bindings and codeAreas. codeArea? Yes. Syntax-highlighting is real fancy. But there are questions left.

1. Can I use the syntax-highlighting-stuff of RichTextFX, or to be more precise: The sample, the creators of RichTextFX credited (see the method computeHighlighting )

2. What does PreviewCycle do, what should it do?

3. What should the default-button do?

The store-logic somehow copied from the original PreviewTab

---

• Change in CHANGELOG.md described
• Tests created for changes
• Manually tested changed features in running JabRef
• Screenshots added in PR description (for bigger UI changes)
• Ensured that the git commit message is a good one
• Check documentation status (Issue created for outdated help page at help.jabref.org?)

[Siedlerchr]

First of all thanks for your efforts.
The preview tab in the preferences allows you to modify the default HTML ("Preview") layout for the entry editor. Only that. The CSL styles are coming from an external library and can't be modified inside JabRef. They are just converted to html for displaying.
Preview cycle method allows you to cycle through the styles in the entry editor preview panel defined in the list on the right.
I think it's F9, e.g. you have default "Preview" style selected and "IEEE" as second style in the right and ACM as thrid
Now in the preview panel in the entry editor you can cycle between the two in the defined order. e..g. Preview -> IEEE -> ACM -> Preview

Default button should reset the html code you entered or modified to the default hard codes one.

[Siedlerchr]

Furthermore the position of the current selected preview Style is stored in n the prefs. This info is used for the preview cycle function. Complex stuff 😈

[Siedlerchr]

Yep. BSD2-clause aka FreeBSD is compatible

[calixtus]

So I can cut the comment? Where do I give credit to him?

[Siedlerchr]

I would suggest extending the javadoc comment, e.g. author copyright, and link to the code
Not sure if you need the whole Disclaimer or licence text.
https://opensource.org/licenses/BSD-2-Clause
That should be enough. We already link to the library in our external-libraries.txt file
@koppor knows more about this licence stuff

[koppor]

Just add "License: BSD-2-Clause". Try to add a reference to it at https://github.com/JabRef/jabref/blob/master/external-libraries.txt. Note to self: Investigate https://github.com/aposin/LicenseScout/blob/master/org.aposin.licensescout.core/doc/documentation.adoc Christoph <notifications@github.com> schrieb am Mo., 17. Juni 2019, 08:20:

…

In src/main/java/org/jabref/gui/preferences/PreviewTabView.java <#5062 (comment)>: > + ActionFactory factory = new ActionFactory(Globals.getKeyPrefs()); > + ContextMenu contextMenu = new ContextMenu(); > + contextMenu.getItems().addAll( > + factory.createMenuItem(StandardActions.CUT, new PreviewTabView.EditAction(StandardActions.CUT)), > + factory.createMenuItem(StandardActions.COPY, new PreviewTabView.EditAction(StandardActions.COPY)), > + factory.createMenuItem(StandardActions.PASTE, new PreviewTabView.EditAction(StandardActions.PASTE)), > + factory.createMenuItem(StandardActions.SELECT_ALL, new PreviewTabView.EditAction(StandardActions.SELECT_ALL)) > + ); > + > + contextMenu.getStyleClass().add("context-menu"); > + previewTextArea.setContextMenu(contextMenu); > + } > + > + /** > + * This was originally created by Carlos Martins (github: @cemarins ) > + * Can this be used here? (BSD-2clause License) I would suggest extending the javadoc comment, e.g. author copyright, and link to the code Not sure if you need the whole Disclaimer or licence text. https://opensource.org/licenses/BSD-2-Clause That should be enough. We already link to the library in our external-libraries.txt file @koppor <https://github.com/koppor> knows more about this licence stuff — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <https://github.com/JabRef/jabref/pull/5062/files/b1826872519fd5b6070e5bb89945332e056f6341?email_source=notifications&email_token=AAKNU7RI3UVJTJCCIDODFQTP24UJ3A5CNFSM4HYSBTJ2YY3PNVWWK3TUL52HS4DFXBIHK3DMKJSXC5LFON2FEZLWNFSXOQ3PNVWWK3TUVJRW63LNMVXHIX3JMTHBDCCYN4#r294148207>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAKNU7RR5O42H7FJAYTWYSLP24UJ3ANCNFSM4HYSBTJQ> .

[tobiasdiez]

That tab is indeed very confusing. A few suggestions (depending on how much time you want to invest):

• Move the "Default" button below the source code (because it is not connected to the list) and rename it to "Reset to default"
• Move to the "up/down" buttons directly in the row of the item as e.g here
  . In some dialogs we already provide a similar item-wise functionality if you want to have a look at the code. Alternatively/in addition support drag and drop to reorder
• Make the "Test/Edit source" feature similar to how editing works here on github: have a tab with the rendered preview and one to edit the source.

[Siedlerchr]

Drag and drop reorder is implemented in the general tab for moving files up and down as far as I remember

[calixtus]

Thanks for the comments, i will look into it and resurface the next days again.

[calixtus]

I got the code-editor and the Preview now in the layout, as @tobiasdiez suggested, but there are still many issues. E.g. there is something wrong with the PreviewViewer: I can change the source for the default 'Preview', but it wont use the changed source in the PreviewViewer until I completly reload the class, even in the MainTable-Preview-View. Also the defaul-button now does not work at all, I think these two issues are connected.

Next I'm going to look into the drag'n'drop-stuff. Just wanted you to know, I am still on it. But I got little time these days to work on it.

[tobiasdiez]

It should work if you call PreviewViewer.setLayout with the updated layout.

[calixtus]

Thanks, that did the trick on the PreviewPane in the Preferences. Code is somehow ugly with typecasting all around, but i did not had a better quick solution.
Still on my ToDo-List:

• Default button - I think it would be nice not just to have the standard-TextBasedPreviewLayout, but others too (maybe let the user create one). so the default button should not be hardcoded. But I think this goes beyond this PR, so i will hardwire it for now.
• Multiple Selection is broken
• Drag'n'drop or per line-move-arrows. I think of it. Creating arrows would imply changing the ChosenListView to a Table or to fill the ListEntries with HBoxes of the entries and the arrows. Let's see,
  Suggestions?

[Siedlerchr]

If you adapt the html preview, it's stored in prefs. And under the hood the preview works similar or is similar to the custom html export styles

[Siedlerchr]

Multiple selection is normally handled via the selection model property. Must be explicitly set

[calixtus]

I implemented basic drag'n'drop between the two lists, fixed the issues around multiple selection, yet there are still some problems.

• the context-menu. This drives me crazy, I really don't know what to do about this:
  
• the size of the PreviewPane is too large, always, I cannot resize it.

About removing the buttons: this would also take away the ability to control this tab by keyboard. Opinions?

I'm thinking of moving things to the viewModel, but honestly, the longer I work on this, I get more and more confused about what has to go to the viewModel and what to the view. Does somebody have a clear view (😁) about this? Thanks

I am still working on sorting in the chosenListView. How do I get the index, where the user drops the items? I need general drop-action in the listview, so the user can drop an item in the empty space. Can I add an additional drop-action to the CellFactory or does this interfere with the general drop-action?

Also Im thinking of a proper way to bind the isEditableProperty.

[calixtus]

Just to remind of this PR, it would be great to have some feedback on the two issues mentioned above: the displaced icons in the ContextMenu and the internal size of the webpane. the size of the webpane is not that big thing, if there is no solution, the user just has to scroll a little bit more to the right. Not perfect, but ... meh...
If there is no solution on the displaced menuicons, I can remove the icons completly.
Besides that, I think everything else is ready to review...

[Siedlerchr]

lgtm!
About the icons and the web pane, no idea. I would vote to merge this PR now as is and then create an issue/addtional PR to see if we can fix the icon stuff and the webview

[Siedlerchr]

Could you please add a screensehot on the misplaced menu items?

[calixtus]

[tobiasdiez]

The code looks good to me. Nice job!

I don't really have an idea of how to fix the two display issues. The dropdown derives some css properties from the original control, which sometimes leads to surprises. But I couldn't identify what css property could result in the display error for the icons. You can use Scenic View to debug for a bit, but I wouldn't spend too much time into it. From my side, we can merge also the current version.

[calixtus]

Ok, I tried to debug the css-issues a little bit, but I could not figure it out, so i removed the icons. Of course, this is not a solution for the problem, but nobody will ever notice. ;-)
On the other hand, I was finally able to reset the size of the previewPane. Turns out, I had to cast it to a PreviewViewer-Class first.
I also made some minor refactoring on the ViewModel: Instead of testing if the value of the SelectionModelProperty is null I made them an instance of NoSelectionModel as the default value.
Should be ready to merge.

[calixtus]

Could not resist refactoring a little bit more... 😅

[Siedlerchr]

I am merging then ;)

[calixtus]

So this was fun again, at least in the beginning and in the end. In the middle it really hurt.
Before I can work on other tabs, I really have to get my "Lizenz"-thesis done. So it could take about a month, I really have to restrain myself here. 😢 But I will continue, I really don't like leaving things half-done.

Feel free to work on the other tabs. I think, before we start reordering everything, we should convert everything first to mvvm, because otherwise it will become a bit confusing, what is already moved to another prefTab etc.

[Siedlerchr]

Thanks for your great work and your interest! Regarding your thesis, I think you are not alone. You can ask other JabRef devs about how working on JabRef provides a nice distraction from finishing a thesis.... 😈
I think the other tabs should not be that complex

[koppor]

@calixtus We hope you finished your thesis. Feel free to rejoin for #hacktoberfest.