1function extractXm(tag) { 2 const text = jQuery(tag).text(); 3 return decodeURIComponent(escape(window.atob(text))); 4} 5 6async function replaceBpmnTag(tag) { 7 const xml = extractXm(tag); 8 9 // avoid doing it twice 10 jQuery(tag).removeAttr("id"); 11 12 // bundle exposes the viewer / modeler via the BpmnJS variable 13 const BpmnViewer = window.BpmnJS; 14 let containerdiv = document.createElement("div"); 15 containerdiv.className = "canvas"; 16 jQuery(tag).parent().append(containerdiv); 17 const viewer = new BpmnViewer({ container: containerdiv }); 18 19 try { 20 const result = await viewer.importXML(xml); 21 const { warnings } = result; 22 console.log(warnings); 23 let canvas = viewer.get("canvas"); 24 const bboxViewport = canvas.getActiveLayer().getBBox(); 25 const bboxSvg = canvas.getSize(); 26 canvas.viewbox({ 27 x: bboxViewport.x, 28 y: bboxViewport.y, 29 width: bboxSvg.width, 30 height: bboxSvg.height, 31 }); 32 const height = bboxViewport.height + 4; 33 // hack: adjust the div height because it doesn't automatically. 34 containerdiv.style.height = `${height}px`; 35 containerdiv.style.width = `${bboxViewport.width}px`; 36 // Fix #3 by introducing a small space to allow clicks. 37 containerdiv.style.marginRight = "32px"; 38 } catch (err) { 39 containerdiv.text = err; 40 console.log(err.message, err.warnings); 41 } 42 43 jQuery(tag).remove(); 44} 45 46function safeReplaceBpmnTag(tag) { 47 try { 48 replaceBpmnTag(tag); 49 } catch (err) { 50 console.warn(err.message); 51 } 52} 53 54jQuery(document).ready(function () { 55 jQuery("textarea[id^=__bpmn_js_]").each((_, tag) => 56 safeReplaceBpmnTag(tag) 57 ); 58}); 59