Moved Content to HTML functionallity to Shared API and implement IMG files by cwhittl · Pull Request #624 · NotePlan/plugins

cwhittl · 2025-02-17T00:28:37Z

Moved Content to HTML functionallity to Shared API and implement IMG files to base64

jgclark

Overall, makes good sense to shift the code around.
Some small points to fix, please.

jgclark · 2025-02-18T09:11:05Z

helpers/HTMLView.js

+ * Convert a note's content to HTML and include any images as base64
+ * @author @cwhittl
+ * @param {string} content
+ * @param {NPNote} Note


type is TNote

jgclark · 2025-02-18T09:12:14Z

helpers/HTMLView.js

+/**
+ * Convert a note's content to HTML and include any images as base64
+ * @author @cwhittl
+ * @param {string} content


Why pass content and note? Is this different content from what the note has?

The reason is for using it with either a whole note or selected text.
I guess I could just call the editor from the function instead of passing anything?

jgclark · 2025-02-18T09:17:51Z

helpers/HTMLView.js

+
+/**
+ * Convert a note's content to HTML and include any images as base64
+ * @author @cwhittl


You mean because i wrote a few lines it's not my code? I 100% don't know what I was thinking, removed.

jgclark · 2025-02-18T09:20:18Z

np.Preview/src/previewMain.js

 * @param {string?} mermaidTheme name (optional)
 */
-export function previewNote(mermaidTheme?: string): void {
+export async function previewNote(mermaidTheme?: string): void {


You've removed a default for mermaidTheme. Please add='green'.

dwertheimer · 2025-02-19T03:22:52Z

@cwhittl @jgclark I pulled and tried to test the PR but I wasn't 100% sure what to test.
I ran it on a test document I had and a bunch of things don't look quite right to me, but I'm not 100% sure what you guys would expect to be covered. I think some things (e.g. checklists etc.) may have been added since jgclark created the Preview plugin. Also some things in NotePlan are not quite standard MD so they don't look quite right.

Here's what the @jgclark test document looks like when shared using the built-in NotePlan sharing:

Note that Eduard is loading the fonts remotely:

Download the test documents:
clay russell version
jgclark version here

dwertheimer · 2025-02-19T04:47:50Z

@cwhittl @jgclark I wonder if you can bake @EduardMe's custom noteplanstate font into the html itself? ChatGPT says we can.

https://chatgpt.com/share/67b55c18-1244-8012-a635-2d8f9e3c123d

Here are the font files:

noteplanstate_formats.zip

Here are the ascii chars that generate each glyph as far as I can tell:

const states = [
  { type: 'open', icon: '*', class: 'noteplanstate' },
  { type: 'done', icon: 'a', class: 'noteplanstate' },
  { type: 'scheduled', icon: 'b', class: 'noteplanstate' },
  { type: 'cancelled', icon: 'c', class: 'noteplanstate' },
  { type: 'list', icon: '-', class: 'noteplanstate' },
  { type: 'checklist', icon: '+', class: 'noteplanstate' },
  { type: 'checklistDone', icon: 'd', class: 'noteplanstate' },
  { type: 'checklistCancelled', icon: 'e', class: 'noteplanstate' },
  { type: 'checklistScheduled', icon: 'f', class: 'noteplanstate' },
]

Also in case anybody is interested for posterity, there's some Eduard -> Jonathan discussion here about FontAwesome glyphs.

dwertheimer · 2025-02-19T05:35:51Z

Now that I look at this document I realize... @EduardMe has gone to great lengths to make the HTML version of a published note look as much like it does in the editor as possible. Maybe you guys want to look at whether you can adapt his JS code (which is basically one JS file) to generate the HTML preview rather than using the more general purpose showdown or doing it by hand? Just a thought...

Of course, @cwhittl still needs @EduardMe to take a look at getting the HTML to clipboard.

cwhittl · 2025-02-19T13:37:45Z

@jgclark @dwertheimer @EduardMe

I'm really fine either way, my goal has been to be able to copy an HTML version of the a note including images to other applications. With this change to preview I can do that but completely ok switching gears and looking in another direction if you all want to point me there.

If you want I can move the code back to np.Preview and we can get the functionallity for now this way and then work on using @EduardMe version (if he's ok with that) to make a more common library.

dwertheimer · 2025-02-19T14:05:53Z

I will leave that to @jgclark. But are you able to copy to the Clipboard?

cwhittl · 2025-02-19T14:09:55Z

Right now to make it work I just do a preview and then copy and paste from that window. On my other plugin that I am making the clipboard doesn't work other than just Clipboard.string from what I have tested.

EduardMe · 2025-02-19T15:05:54Z

Copying html into the clipboard through the API is fixed for the next update.

jgclark · 2025-02-19T19:40:31Z

IMHO we now have a couple of different design questions, and at least one bug, here.

1. Bug: hopefully EM has fixed it already.
2. Decide which plugin should the new functionality live in. Ideally its baked into the app itself, but until then, I think NoteHelpers is the most obvious location, as its a note-level command. Alternatively we change the name of Preview plugin to something that would naturally cover this as well. [@cwhittl FYI it's easy to change the display name of a plugin, but not the underlying pluginID.]
3. How far to improve the HTML output? When I wrote Preview some while ago, I said I wasn't going to put lots of effort into perfecting the output, as @EduardMe was already working on a web version which should be able in time to give us an 'official' (and therefore maintained) HTML output function to use.

jgclark · 2025-02-19T19:42:33Z

On 2: I'm happy to try this: perhaps "HTML Output" with commands "Save as HTML" (the one one) and "Preview as HTML" (the existing one). Thoughts?

On 3: I hope @EduardMe can comment on whether getting an API call like returnHTMLForNote(note: TNote): string is likely.

EduardMe · 2025-02-20T13:46:14Z

An API call like returnHTMLForNote(note: TNote): string is not planned so far.

cwhittl · 2025-02-20T13:59:15Z

So this PR was to make images work with Preview and to move that functionality to a shared place to be used by other plugins. Are we ok with that?

The bug that @EduardMe has put a fix for doesn't keep this PR from going it will be a problem for my extension (that's not on this PR) and will test it during that process.

jgclark · 2025-02-20T15:44:58Z

I know I was going beyond the scope of the PR with the discussion above, but wanted to capture it while I was thinking about it.
So I will now merge it.

Chris Whittle added 4 commits February 16, 2025 18:23

tested and working

6edee63

added correct documentation for function

465f0ce

something missed

41cc744

something missed

d9125b2

dwertheimer requested a review from jgclark February 17, 2025 00:37

jgclark requested changes Feb 18, 2025

View reviewed changes

changes from PR

ddc0cdd

cwhittl requested a review from jgclark February 18, 2025 13:35

jgclark merged commit 470a12e into NotePlan:main Feb 20, 2025

Comments

Conversation

cwhittl commented Feb 17, 2025

Uh oh!

jgclark left a comment

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!

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!

dwertheimer commented Feb 19, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

dwertheimer commented Feb 19, 2025

Uh oh!

dwertheimer commented Feb 19, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

cwhittl commented Feb 19, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

dwertheimer commented Feb 19, 2025

Uh oh!

cwhittl commented Feb 19, 2025

Uh oh!

EduardMe commented Feb 19, 2025

Uh oh!

jgclark commented Feb 19, 2025

Uh oh!

jgclark commented Feb 19, 2025

Uh oh!

EduardMe commented Feb 20, 2025

Uh oh!

cwhittl commented Feb 20, 2025

Uh oh!

jgclark commented Feb 20, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

dwertheimer commented Feb 19, 2025 •

edited

Loading

dwertheimer commented Feb 19, 2025 •

edited

Loading

cwhittl commented Feb 19, 2025 •

edited

Loading