1
0
mirror of https://github.com/laurent22/joplin.git synced 2024-12-24 10:27:10 +02:00

All: Allow loading image resources in IMG html tags

This commit is contained in:
Laurent Cozic 2018-09-27 18:42:34 +01:00
parent ef711af5b5
commit 9680ab74a3
5 changed files with 99 additions and 34 deletions

View File

@ -274,7 +274,9 @@ The checkboxes can then be ticked in the mobile and desktop applications.
## HTML support ## HTML support
Only the `<br>` tag is supported - it can be used to force a new line, which is convenient to insert new lines inside table cells. For security reasons, other HTML tags are not supported. It is generally recommended to enter the notes as Markdown as it makes the notes easier to edit. However for cases where certain features aren't supported (such as strikethrough or to highlight text), you can also use HTML code directly. For example this would be a valid note:
This is <s>strikethrough text</s> mixed with regular **Markdown**.
# Donations # Donations

View File

@ -73,8 +73,7 @@ class MdToHtml {
return attrs; return attrs;
} }
renderImage_(attrs, options) { async loadResource(id, options) {
const loadResource = async (id) => {
// console.info('Loading resource: ' + id); // console.info('Loading resource: ' + id);
// Initially set to to an empty object to make // Initially set to to an empty object to make
@ -98,6 +97,7 @@ class MdToHtml {
if (options.onResourceLoaded) options.onResourceLoaded(); if (options.onResourceLoaded) options.onResourceLoaded();
} }
renderImage_(attrs, options) {
const title = this.getAttr_(attrs, 'title'); const title = this.getAttr_(attrs, 'title');
const href = this.getAttr_(attrs, 'src'); const href = this.getAttr_(attrs, 'src');
@ -108,7 +108,7 @@ class MdToHtml {
const resourceId = Resource.urlToId(href); const resourceId = Resource.urlToId(href);
const resource = this.loadedResources_[resourceId]; const resource = this.loadedResources_[resourceId];
if (!resource) { if (!resource) {
loadResource(resourceId); this.loadResource(resourceId, options);
return ''; return '';
} }
@ -125,6 +125,27 @@ class MdToHtml {
return '[Image: ' + htmlentities(resource.title) + ' (' + htmlentities(mime) + ')]'; return '[Image: ' + htmlentities(resource.title) + ' (' + htmlentities(mime) + ')]';
} }
renderImageHtml_(before, src, after, options) {
const resourceId = Resource.urlToId(src);
const resource = this.loadedResources_[resourceId];
if (!resource) {
this.loadResource(resourceId, options);
return '';
}
if (!resource.id) return ''; // Resource is being loaded
const mime = resource.mime ? resource.mime.toLowerCase() : '';
if (Resource.isSupportedImageMimeType(mime)) {
let newSrc = './' + Resource.filename(resource);
if (this.resourceBaseUrl_ !== null) newSrc = this.resourceBaseUrl_ + newSrc;
let output = '<img ' + before + ' data-resource-id="' + resource.id + '" src="' + newSrc + '" ' + after + '/>';
return output;
}
return '[Image: ' + htmlentities(resource.title) + ' (' + htmlentities(mime) + ')]';
}
renderOpenLink_(attrs, options) { renderOpenLink_(attrs, options) {
let href = this.getAttr_(attrs, 'href'); let href = this.getAttr_(attrs, 'href');
const text = this.getAttr_(attrs, 'text'); const text = this.getAttr_(attrs, 'text');
@ -472,6 +493,12 @@ class MdToHtml {
} }
} }
renderedBody = renderedBody.replace(/<img(.*?)src=["'](.*?)["'](.*?)\/>/g, (v, before, src, after) => {
if (!Resource.isResourceUrl(src)) return '<img ' + before + ' src="' + src + '" ' + after + '/>';
return this.renderImageHtml_(before, src, after, options);
});
// https://necolas.github.io/normalize.css/ // https://necolas.github.io/normalize.css/
const normalizeCss = ` const normalizeCss = `
html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0} html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}
@ -561,7 +588,7 @@ class MdToHtml {
border-bottom: 1px solid ` + style.htmlDividerColor + `; border-bottom: 1px solid ` + style.htmlDividerColor + `;
} }
img { img {
width: auto; /* width: auto; */
max-width: 100%; max-width: 100%;
} }
.inline-code { .inline-code {

View File

@ -260,7 +260,7 @@
<li>On your WebDAV service, copy all the Joplin files from the old location to the new one. Make sure to also copy the <code>.resource</code> directory as it contains your images and other attachments.</li> <li>On your WebDAV service, copy all the Joplin files from the old location to the new one. Make sure to also copy the <code>.resource</code> directory as it contains your images and other attachments.</li>
<li>Once it&#39;s done, open Joplin again and change the WebDAV URL.</li> <li>Once it&#39;s done, open Joplin again and change the WebDAV URL.</li>
<li>Synchronise to verify that everything is working.</li> <li>Synchronise to verify that everything is working.</li>
<li>Do step 4 and 5 for all the other Joplin clients you need to sync.</li> <li>Do step 5 and 6 for all the other Joplin clients you need to sync.</li>
</ol> </ol>
<h1 id="how-can-i-easily-enter-markdown-tags-in-android-">How can I easily enter Markdown tags in Android?</h1> <h1 id="how-can-i-easily-enter-markdown-tags-in-android-">How can I easily enter Markdown tags in Android?</h1>
<p>You may use a special keyboard such as <a href="https://play.google.com/store/apps/details?id=kl.ime.oh&amp;hl=en">Multiling O Keyboard</a>, which has shortcuts to create Markdown tags. <a href="https://discourse.joplin.cozic.net/t/android-create-new-list-item-with-enter/585/2?u=laurent">More information in this post</a>.</p> <p>You may use a special keyboard such as <a href="https://play.google.com/store/apps/details?id=kl.ime.oh&amp;hl=en">Multiling O Keyboard</a>, which has shortcuts to create Markdown tags. <a href="https://discourse.joplin.cozic.net/t/android-create-new-list-item-with-enter/585/2?u=laurent">More information in this post</a>.</p>
@ -270,6 +270,20 @@
<p>Short answer: no. The end to end encryption that Joplin implements is to protect the data during transmission and on the cloud service so that only you can access it.</p> <p>Short answer: no. The end to end encryption that Joplin implements is to protect the data during transmission and on the cloud service so that only you can access it.</p>
<p>On the local device it is assumed that the data is safe due to the OS built-in security features. If additional security is needed it&#39;s always possible to put the notes on an encrypted Truecrypt drive for instance.</p> <p>On the local device it is assumed that the data is safe due to the OS built-in security features. If additional security is needed it&#39;s always possible to put the notes on an encrypted Truecrypt drive for instance.</p>
<p>If someone that you don&#39;t trust has access to the computer, they can put a keylogger anyway so any local encryption or PIN access would not be useful.</p> <p>If someone that you don&#39;t trust has access to the computer, they can put a keylogger anyway so any local encryption or PIN access would not be useful.</p>
<h1 id="webdav-synchronisation-is-not-working">WebDAV synchronisation is not working</h1>
<h2 id="-forbidden-error-in-strato">&quot;Forbidden&quot; error in Strato</h2>
<p>For example:</p>
<pre><code>MKCOL .sync/: Unknown error 2 (403): &lt;!DOCTYPE HTML PUBLIC &quot;-//IETF//DTD HTML 2.0//EN&quot;&gt;
&lt;html&gt;&lt;head&gt;
&lt;title&gt;403 Forbidden&lt;/title&gt;
&lt;/head&gt;&lt;body&gt;
&lt;h1&gt;Forbidden&lt;/h1&gt;
&lt;p&gt;You don&#39;t have permission to access /.sync/
on this server.&lt;/p&gt;
&lt;/body&gt;&lt;/html&gt;
</code></pre><p>In this case, <a href="https://github.com/laurent22/joplin/issues/309">make sure you enter the correct WebDAV URL</a>.</p>
<h2 id="nginx-sync-not-working">Nginx sync not working</h2>
<p>As of now, Joplin is not compatible with the Nginx WebDAV server: <a href="https://github.com/laurent22/joplin/issues/808">https://github.com/laurent22/joplin/issues/808</a></p>
<h1 id="why-is-it-named-joplin-">Why is it named Joplin?</h1> <h1 id="why-is-it-named-joplin-">Why is it named Joplin?</h1>
<p>The name comes from the composer and pianist <a href="https://en.wikipedia.org/wiki/Scott_Joplin">Scott Joplin</a>, which I often listen to. His name is also easy to remember and type so it fell like a good choice. And, to quote a user on Hacker News, &quot;though Scott Joplin&#39;s ragtime musical style has a lot in common with some very informal music, his own approach was more educated, sophisticated, and precise. Every note was in its place for a reason, and he was known to prefer his pieces to be performed exactly as written. So you could say that compared to the people who came before him, his notes were more organized&quot;.</p> <p>The name comes from the composer and pianist <a href="https://en.wikipedia.org/wiki/Scott_Joplin">Scott Joplin</a>, which I often listen to. His name is also easy to remember and type so it fell like a good choice. And, to quote a user on Hacker News, &quot;though Scott Joplin&#39;s ragtime musical style has a lot in common with some very informal music, his own approach was more educated, sophisticated, and precise. Every note was in its place for a reason, and he was known to prefer his pieces to be performed exactly as written. So you could say that compared to the people who came before him, his notes were more organized&quot;.</p>

View File

@ -469,8 +469,9 @@ $$
- [ ] Eggs - [ ] Eggs
</code></pre><p>The checkboxes can then be ticked in the mobile and desktop applications.</p> </code></pre><p>The checkboxes can then be ticked in the mobile and desktop applications.</p>
<h2 id="html-support">HTML support</h2> <h2 id="html-support">HTML support</h2>
<p>Only the <code>&lt;br&gt;</code> tag is supported - it can be used to force a new line, which is convenient to insert new lines inside table cells. For security reasons, other HTML tags are not supported.</p> <p>It is generally recommended to enter the notes as Markdown as it makes the notes easier to edit. However for cases where certain features aren&#39;t supported (such as strikethrough or to highlight text), you can also use HTML code directly. For example this would be a valid note:</p>
<h1 id="donations">Donations</h1> <pre><code>This is &lt;s&gt;strikethrough text&lt;/s&gt; mixed with regular **Markdown**.
</code></pre><h1 id="donations">Donations</h1>
<p>Donations to Joplin support the development of the project. Developing quality applications mostly takes time, but there are also some expenses, such as digital certificates to sign the applications, app store fees, hosting, etc. Most of all, your donation will make it possible to keep up the current development standard.</p> <p>Donations to Joplin support the development of the project. Developing quality applications mostly takes time, but there are also some expenses, such as digital certificates to sign the applications, app store fees, hosting, etc. Most of all, your donation will make it possible to keep up the current development standard.</p>
<p>Please see the <a href="https://joplin.cozic.net/donate/">donation page</a> for information on how to support the development of Joplin.</p> <p>Please see the <a href="https://joplin.cozic.net/donate/">donation page</a> for information on how to support the development of Joplin.</p>
<h1 id="community">Community</h1> <h1 id="community">Community</h1>

View File

@ -6,13 +6,13 @@ It seems to be due to the setting `set term=ansi` in .vimrc. Removing it should
When changing the WebDAV URL, make sure that the new location has the same exact content as the old location (i.e. copy all the Joplin data over to the new location). Otherwise, if there's nothing on the new location, Joplin is going to think that you have deleted all your data and will proceed to delete it locally too. So to change the WebDAV URL, please follow these steps: When changing the WebDAV URL, make sure that the new location has the same exact content as the old location (i.e. copy all the Joplin data over to the new location). Otherwise, if there's nothing on the new location, Joplin is going to think that you have deleted all your data and will proceed to delete it locally too. So to change the WebDAV URL, please follow these steps:
0. Make a backup of your Joplin data in case something goes wrong. Export to a JEX archive for example. 1. Make a backup of your Joplin data in case something goes wrong. Export to a JEX archive for example.
1. Synchronise one last time all your data from a Joplin client (for example, from the desktop client) 2. Synchronise one last time all your data from a Joplin client (for example, from the desktop client)
2. Close the Joplin client. 3. Close the Joplin client.
3. On your WebDAV service, copy all the Joplin files from the old location to the new one. Make sure to also copy the `.resource` directory as it contains your images and other attachments. 4. On your WebDAV service, copy all the Joplin files from the old location to the new one. Make sure to also copy the `.resource` directory as it contains your images and other attachments.
4. Once it's done, open Joplin again and change the WebDAV URL. 5. Once it's done, open Joplin again and change the WebDAV URL.
5. Synchronise to verify that everything is working. 6. Synchronise to verify that everything is working.
6. Do step 4 and 5 for all the other Joplin clients you need to sync. 7. Do step 5 and 6 for all the other Joplin clients you need to sync.
# How can I easily enter Markdown tags in Android? # How can I easily enter Markdown tags in Android?
@ -30,6 +30,27 @@ On the local device it is assumed that the data is safe due to the OS built-in s
If someone that you don't trust has access to the computer, they can put a keylogger anyway so any local encryption or PIN access would not be useful. If someone that you don't trust has access to the computer, they can put a keylogger anyway so any local encryption or PIN access would not be useful.
# WebDAV synchronisation is not working
## "Forbidden" error in Strato
For example:
MKCOL .sync/: Unknown error 2 (403): <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN">
<html><head>
<title>403 Forbidden</title>
</head><body>
<h1>Forbidden</h1>
<p>You don't have permission to access /.sync/
on this server.</p>
</body></html>
In this case, [make sure you enter the correct WebDAV URL](https://github.com/laurent22/joplin/issues/309).
## Nginx sync not working
As of now, Joplin is not compatible with the Nginx WebDAV server: https://github.com/laurent22/joplin/issues/808
# Why is it named Joplin? # Why is it named Joplin?
The name comes from the composer and pianist [Scott Joplin](https://en.wikipedia.org/wiki/Scott_Joplin), which I often listen to. His name is also easy to remember and type so it fell like a good choice. And, to quote a user on Hacker News, "though Scott Joplin's ragtime musical style has a lot in common with some very informal music, his own approach was more educated, sophisticated, and precise. Every note was in its place for a reason, and he was known to prefer his pieces to be performed exactly as written. So you could say that compared to the people who came before him, his notes were more organized". The name comes from the composer and pianist [Scott Joplin](https://en.wikipedia.org/wiki/Scott_Joplin), which I often listen to. His name is also easy to remember and type so it fell like a good choice. And, to quote a user on Hacker News, "though Scott Joplin's ragtime musical style has a lot in common with some very informal music, his own approach was more educated, sophisticated, and precise. Every note was in its place for a reason, and he was known to prefer his pieces to be performed exactly as written. So you could say that compared to the people who came before him, his notes were more organized".