Feature Feedback: Pre-release 1.0.207

Beta Testing
1

I have not tested a lot of the functionality of the pre-release yet but I have a noted a few things about the new layout.

Joplin _1.0.207
Joplin _1.0.207907Ă—176 7.73 KB

(1) A "Code View" button has appeared which toggles between "traditional" and "WYSIWYG" modes. In the screenshot Jopin is in "traditional" mode and so there is also a "Layout" button which works as it did before. The WYSIWYG editor is in its really, really early stages of development. If this button is to make its way into the main release would it be possible to have the ability to switch this off in settings and also have it switched off by default? This button is inviting users to use what is still just an experimental feature. I just feel it should not advertise itself on the main toolbar until it no longer experimental.

(2) These features (External Edit, Tag Note , Note Info) have been moved to the left of the note title (4) and so can push the title some distance away from the left edge of the note (3). It's a personal opinion but this does not look right. The note title is important information. Previously the user was shown the notebook name (when selecting by tag) followed by the note title. That made sense, this doesn't. It's possibly a bit more logical to move this to the right of the note title so the information is presented Notebook - Note Title - Note Actions (External Edit, Tag Note , Note Info)? Alternatively put the Notebook name before the tags so this bar will show all the locations of the note? Admittedly the release notes do say:

It might be tweaked or moved later on once we have a clearer idea of what we want to do.

+1 to tweaking or moving...

(4) Speaking of the title, to me the reduced font size looks better than before.

(5) The above screenshot is from a note displayed with the layout as viewer pane only, yet it has an editor bar? IIRC that's going back in time. Also if you do press a button, say Bold Joplin adds the text **StrongText** at an apparently random point in the note which IIRC was an old bug...

(6) Back and forward arrows. There is no (6) in the screenshot because there are no back and forward arrows either :slight_smile: Without the ability to have multiple note editing the navigation arrows were useful, a bit erratic, but useful.

<end>

4 Likes
2

I was actually surprised to see this much visual changes.

  1. “Code View” is IMO, not the best name for this button.
  2. +1 for moving
2 Likes
3

It is quite a change but, to be fair, this version (1.0.207) has been marked as a pre-release so at least Joplin is not prompting users to upgrade and those that do download it are aware that it is not considered suitable for general use.

1 Like
4

I’m open to suggestions about the Code View button. I’ve discussed it a bit with Tessus but we haven’t found a satisfying solution yet to toggle between Markdown and WYSIWYG editor.

Maybe a toggle button like this, with WYSIWYG on one side and Markdown on the other?

6 Likes
5

Back and forward arrows

@naviji's PR has just been merged so they'll be back on the next release.

I agree the toolbar is a bit of a mess at the moment. My priority was to get the refactoring done and so the buttons ended up where it was logical in terms of code, but perhaps it's not the best in terms of UX.

2 Likes
6

Putting tags at the top causes the entire editor to bounce when navigating between notes.

erratic
erratic746Ă—526 839 KB

4 Likes
7

Yes, I was also going to comment on this. If and when we get tag display in meta-data (e.g. Show metadata in note list) then I, personally, would be happy not having the tags always on display…

1 Like
8

Do we need a button here? In my humble opinion the WYSIWYG Editor is also a layout so I would make it accessable through the layout-button.

In regards of the other changes I would only move buttons if we have a clear understanding where we want to go - because the actual set up is not that bad :wink:

9

The latest version addressed some of these issues: https://github.com/laurent22/joplin/releases/tag/v1.0.209 although I think I’ll leave the Code View button for now, as the toggle button I had in mind doesn’t really work with the current toolbar.

I want to make wysiwyg the default, but also make it very obvious that there’s a Markdown editor too, the key is to make this feature easily discoverable but not sure how to do that at this point.

If you find any issue in the latest release please let me know, and if everything’s good I’ll release it officially.

2 Likes
10

I am aware that the WYSIWYG feature is still experimental, and it’s very likely someone has mentioned it already, but on the off-chance that no one has, I would like to: It seems to be possible to markup text using certain shortcuts like Ctrl+B to bolden it etc. Could this somehow be turned into a hybrid mode instead, like for example found in Typora? I imagine just writing **test** in the editor pane, and it getting boldened in real time in the same editor/preview-pane.

If this isn’t technically possible with the current implementation, I understand. I don’t want to take the current efforts for granted and would be happy either way.

11

Joplin 1.0.209 (prod, win32) PORTABLE
Client ID: c74dc277148d4841bae1e02daa42ef90
Sync Version: 1
Profile Version: 29
Revision: e0721493 (master)
Windows 10 Pro x64 (VM)

This is what I have found after a couple of hours playing. This was all undertaken in a VM with a fully up to date copy of Windows 10. Sync functions were not tested.

Upon initial opening of Joplin the WYSIWYG editor is the default view. Is this wise? A new user would start up the program to be confronted by an orange "this is experimental" warning and IMHO this editor is not suitable for release or deployment without this warning yet.

WYSIWYG: Tables
Creating a table does not create a header row. The table when created is full width. The table has a properties option which allows the changing of width, height, border, background and line type. The properties also has a "caption" tick-box which apparently does not function. Clicking on any other note and then returning to the note with the table results in all table customisations being lost, the width reverts to "minimum required to display" and there is now an empty header row appended.

If you then use the table properties flyout to delete the table (without editing further) and switch to the Markdown editor; the deleted table returns.

Same loss of customising occurs if you place the cursor in a table cell and use the table cell properties from the main editor toolbar. I am assuming that this is because Markdown does not support this type of customisation which makes me wonder why all these HTML editor features are currently present in the table menus.

WYSIWYG: Editor
Highlighting and right-clicking any text in a note brings up a menu "copy". There are no "cut" and "paste" options.

Select a section of text to be a code block and select the code block tool on the edit bar. A dialog box appears where the block language and block text has to be input. It does not bring in the highlighted text. The previously highlighted text in the note itself is actually deleted if you just set the block language. Also language field is just a text box and has no drop-down or check that the type selected is actually supported. The area for adding the code text itself accepts ctrl+v but has no right-click cut, copy, paste menu.

Whilst you can insert a hyperlink in a WYSIWYG note you cannot apparently use it as a hyperlink. You can however right-click and "copy link address" but it doesn't actually do that.

An internal Joplin link also cannot be followed. Right-clicking gives a menu to:

  • Open - Opens "This PC"
  • Save As - Doesn't appear to do anything
  • Reveal file in folder - Doesn't appear to do anything (anywhere I have encountered it)
  • Copy path to clipboard - Doesn't appear to do anything

The only way I can get link functionality from a note is to:

  • Open Joplin and create a WYSIWYG note
  • Toggle the "code view" to get a layout icon
  • Switch to the markdown viewer

PORTABLE VERSION - Using the toolbar attach file tool, inserting an image results in a broken image link icon and the image file name. Using the markdown editor it can be seen that the file path for the image is stored as:

![picture.png](file://C:%5CUsers%5Cvbox%5CDesktop/JoplinProfile/resources/ae13dcd073834856ac09e3efe36f8bff.png)

rather than

![picture.png](:/ae13dcd073834856ac09e3efe36f8bff)

which is valid in the markdown viewer pane but still does not work in the WYSIWYG editor.

Trying drag and drop and copy/paste gives similar results.

However image handling seems to work correctly in the desktop version...

WYSIWYG does not support userstyle.css which for me is crucial as the default viewer font size is far too big and cannot be changed in Joplin settings.

Markdown Editor/Viewer

When viewing a note using only the viewer pane (not split) the note has an edit toolbar which is unnecessary.

12

That's true, on one hand I think the wysiwyg editor is nearly production ready (I use it every day), but on the other hand there are still a few things that could be improved so I won't make it the default for now.

3 Likes
13

Will there be an option to set which is the default? One of the reasons I like using Joplin is that I DON’T have to use a WYSIWYG editor. I’d rather just always have the default be Markdown.

1 Like
14

By definition you can’t set the default value, because that’s the default value. But you can change the option and your settings are obviously saved.

15

@derikb

If WYSIWYG is REALLY not for you, you can:

Start Joplin and, if not already visible, toggle the Code View button so that the Layout button we are all used to is visible on the toolbar. As @laurent says, Joplin will remember this as your selected default from then on.

Then, add the below to userchrome.css

a.button[title="Code View"] {
    display: none !important;
}

Quit and restart Joplin.

This will remove the Code View button from the toolbar so for you Joplin will look pretty much as it does now **.

(** At least this works with the 1.0.209 pre-release version)

2 Likes
16

It’d be good to have a build-in option to hide it, but thanks for the tip!

17

FYI, was just trying this and it didn't work, but have figured out that this works in Joplin 2.3.3 (prod, win32):

button.tox-tbtn { 
    display: none !important; 
}

Figured this out from https://github.com/laurent22/joplin/blob/dev/packages/app-desktop/gui/ToggleEditorsButton/ToggleEditorsButton.tsx, so hopefully I am not hiding more than I think I am :wink: