So the reply here was that the plugin does not handle complex HTML and that Zeroqode does not want to update it so that it does. This is ironic given that the javascript to build something that performs better than the current plugin (including handling complex HTML simply by ignoring it) is 40 lines long. Here is the code if anyone needs it. To use it you need to clear a few tags prior to passing the text to the javascript.
** I need to add in the paragraph breaks into the string before I pass it to javascript as Bubble won’t allow you to do that. Hence, I add lines with a find and replace for
and . The rest is taken care of by the javascript. I’ve accounted for styles by replacing h1 through h3 only with BBCode sizes 7, 6 and 5 respectively.
The rest of it is ignored because Bubble can’t pass it into a PDF generator anyway. I’ve asked PDF Conjurer to look at including table tags. The code to keep tables is in the javascript but I’ve edited it out and kept a holistic replace.
We use this output to as a way to ingest information into our AI model so that is what it was built for and to works perfectly fine. Not too complicated at all.
You can actually simplify this with a match case like I have at the end so you could easily reduce this to even less lines of code. This translates large HTML files in milliseconds but I agree that it could be faster.
I’m using the JS2Bubble plugin to run the javascript. There is a great Youtube video on how to do it.
var html = properties.param1;
// Remove <span> tags and their attributes
html = html.replace(/<div[^>]*>/gi, "").replace(/<\/div>/gi, "");
html = html.replace(/<figure[^>]*>/gi, "").replace(/<\/figure>/gi, "");
html = html.replace(/<span[^>]*>/gi, "").replace(/<\/span>/gi, "");
html = html.replace(/<iframe[^>]*>.*?<\/iframe>/gi,"");
html = html.replace(/<pre[^>]*>/gi, "").replace(/<\/pre>/gi, "");
// Bold, Italic, Underline
html = html.replace(/<b>/gi, "[b]").replace(/<\/b>/gi, "[/b]");
html = html.replace(/<i>/gi, "[i]").replace(/<\/i>/gi, "[/i]");
html = html.replace(/<u>/gi, "[u]").replace(/<\/u>/gi, "[/u]");
html = html.replace(/<strong>/gi, "[b]").replace(/<\/strong>/gi, "[/b]");
html = html.replace(/<em>/gi, "[b]").replace(/<\/em>/gi, "[/b]");
// Headings with specific sizes, removing style attributes
html = html.replace(/<h1[^>]*>/gi, "[center][size=6]").replace(/<\/h1>/gi, "[/size][/center]");
html = html.replace(/<h2[^>]*>/gi, "[center][size=5]").replace(/<\/h2>/gi, "[/size][/center]");
html = html.replace(/<h3[^>]*>/gi, "[center][size=4]").replace(/<\/h3>/gi, "[/size][/center]");
// Correctly handle <a href> tags
html = html.replace(/<a[^>]+href="([^"]+)"[^>]*>(.*?)<\/a>/gi, "[url=$1]$2[/url]");
// Images
// html = html.replace(/<img src="(.+?)"( alt="(.+?)")?>/gi, "[img]$1[/img]");
html = html.replace(/<img[^>]*>.*?<\/img>/gi,"");
html = html.replace(/<img [^>]*>/gi, "");
// Lists (unordered and ordered)
html = html.replace(/<ul>/gi, "[list]").replace(/<\/ul>/gi, "[/list]");
html = html.replace(/<ol>/gi, "[list]").replace(/<\/ol>/gi, "[/list]");
html = html.replace(/<li>/gi, "[li]").replace(/<\/li>/gi, "[/li]");
// Line Breaks and Paragraphs
html = html.replace(/<br>/gi, "\n");
html = html.replace(/<p[^>]*>/gi, "").replace(/<\/p>/gi, "\n");
// Quotes
html = html.replace(/<blockquote>/gi, "[quote]").replace(/<\/blockquote>/gi, "[/quote]");
// Strikethrough
html = html.replace(/<s>/gi, "[s]").replace(/<\/s>/gi, "[/s]");
// Tables Keep
// html = html.replace(/<table[^>]*>/gi, "[table]").replace(/<\/table>/gi, "[/table]");
// html = html.replace(/<tr[^>]*>/gi, "[tr]").replace(/<\/tr>/gi, "[/tr]");
// html = html.replace(/<th[^>]*>/gi, "[th]").replace(/<\/th>/gi, "[/th]");
// html = html.replace(/<thead[^>]*>/gi, "").replace(/<\/thead>/gi, "");
// html = html.replace(/<td[^>]*>/gi, "[td]").replace(/<\/td>/gi, "[/td]");
// html = html.replace(/<tbody[^>]*>/gi, "").replace(/<\/tbody>/gi, "");
// Tables Remove
html = html.replace(/<table[^>]*>/gi, "").replace(/<\/table>/gi, "");
html = html.replace(/<tr[^>]*>/gi, "").replace(/<\/tr>/gi, "");
html = html.replace(/<th[^>]*>/gi, "").replace(/<\/th>/gi, "");
html = html.replace(/<thead[^>]*>/gi, "").replace(/<\/thead>/gi, "");
html = html.replace(/<td[^>]*>/gi, "").replace(/<\/td>/gi, "");
html = html.replace(/<tbody[^>]*>/gi, "").replace(/<\/tbody>/gi, "");
//HTML character substitutions
const specialChars = {
'<': '<',
'>': '>',
'&': '&',
'"': '"',
''': "'",
' ' : ' '
};
html=html.replace(/<|>|&|"|'| /g, (match) => specialChars[match]);
console.log(html);
bubble_fn_convert(html);
130+ Bubble Templates
25+ Bubble Courses
300+ Bubble Plugins
Convert Bubble app to iOS & Android
No-code Development Services
