search

BlogoText / blogotext

A little more than a lightweight SQLite Blog-Engine.
Other
137 stars 30 forks source link

<br> and links inserted in <pre> tags #378

Closed Ailothaen closed 5 years ago

Ailothaen commented 6 years ago

Hey :owl:

I'm using the <pre> (alongside with <code>) tag directly when redacting articles, for some reasons (especially because I use a syntax highlighting library) The <pre> tag is supposed to render line-breaks, tabs, spaces... exactly as they were in the article (so for example, the line-breaks are displayed as line-breaks, we don't need to use <br> ) However, it seems that Blogotext automatically inserts <br> tags within <pre> elements, which results as double-line-breaks:

example

So this is an unwanted behavior, as <pre> already "manages" line-breaks by himself. Also, there is the same problem with the link detection : Blogotext also markups the links (i.e. text beginning by http://, https://, ...) in <pre> tags, which could result to bugs.

I've tried to implement a fix for that, but did not succeeded. Here's an useful regexp I found, that seems to work: $clean = preg_replace('#<br\s*\/>(?=(?:(?!<\/?pre>)[\s\S])*<\/pre>)#', '', $unclean);

remrem commented 6 years ago

Hello, Thanks for reporting this bug, I'll take a look.

remrem commented 6 years ago

Can you try this solution : replace the function post_markup() in admin/ecrire.php` with this https://gist.github.com/remrem/adebe8a1f5c16d548c6c2e69c68c0d4c (2 functions)

When you write an article with <code>...</code> or <pre>...</pre>, the parser will replace <code>...</code> or <pre>...</pre> by <html_code>, then continue to convert and at the end will replace '' with the right <code>...</code> or <pre>...</pre>. You can use multiple <code>...</code> and <pre>...</pre> in the same article, and you can use attributs (class, id ...) <code class="example">...</code> .

Ailothaen commented 6 years ago

I tested it and it seems to work. I use <pre><code class="lang">...</code></pre> for syntax highlighting (I use highlight.js) and it keeps everything, good job! The links are no longer "tagged" as well.

Ailothaen commented 6 years ago

I come back on this suggestion, because I actually noticed some problems (I only did check if it was working...)

Although the <pre><code> combination seems to work, the simple [code] tag no longer works: the [code] tag is displayed in the formatted text, with the inside content without formatting on it... like the tag does not exist anymore.

Also, I've noticed a weird thing about the <pre><code> blocks: a paragraph immediately after will not have an opening <p> tag, only a closing one. It also has a <br /> coming out of nowhere. Here is an example:

pre1

<p>Si le flux RSS est inscrit dans la page, il apparaît dans le &lt;head&gt; du code source HTML, sous cette forme :</p>

<p><pre><code class="html">&lt;link rel="alternate" type="application/rss+xml" title="RSS - Articles" href="rss.php" /&gt;
&lt;link rel="alternate" type="application/atom+xml" title="ATOM - Articles" href="atom.php" /&gt;</code></pre><br />
Il existe des extensions navigateur (<a href="https://addons.mozilla.org/fr/firefox/addon/awesome-rss/">Firefox</a>, <a href="https://chrome.google.com/webstore/detail/get-rss-feed-url/kfghpdldaipanmkhfpdcjglncmilendn?hl=fr">Chrome</a>) pour récupérer automatiquement le lien. Sous Firefox, il existe même un bouton RSS natif (qu'il faut activer en personnalisant l'interface), mais je ne recommande pas son utilisation car il ne permet pas d'obtenir facilement le lien.<br />
Sinon, il existe toujours la solution... de parcourir le code source !</p>
remrem commented 6 years ago

I think I know what the problem is, can you post here the text you're writing, at least the extract that causes the problem?

Ailothaen commented 6 years ago

If you mean the text in the admin section, here it is;

Si le flux RSS est inscrit dans la page, il apparaît dans le &lt;head&gt; du code source HTML, sous cette forme :

<pre><code class="html">&lt;link rel="alternate" type="application/rss+xml" title="RSS - Articles" href="rss.php" /&gt;
&lt;link rel="alternate" type="application/atom+xml" title="ATOM - Articles" href="atom.php" /&gt;</code></pre>

Il existe des extensions navigateur ([Firefox|https://addons.mozilla.org/fr/firefox/addon/awesome-rss/], [Chrome|https://chrome.google.com/webstore/detail/get-rss-feed-url/kfghpdldaipanmkhfpdcjglncmilendn?hl=fr]) pour récupérer automatiquement le lien. Sous Firefox, il existe même un bouton RSS natif (qu'il faut activer en personnalisant l'interface), mais je ne recommande pas son utilisation car il ne permet pas d'obtenir facilement le lien.
Sinon, il existe toujours la solution... de parcourir le code source !

I posted the result source code and "view" just above.

remrem commented 6 years ago

Thanks for the extract, Can you try replacing the functions of my previous gist post_markup() and parse_texte_code_html() with this one https://gist.github.com/remrem/adebe8a1f5c16d548c6c2e69c68c0d4c (the same gist, updated).

Details :

Ailothaen commented 6 years ago

It seems to work for real now. Great, thanks again! :owl:

remrem commented 6 years ago

:) I keep this issue open until the BT 3.7.7 release.