{"id":181,"date":"2009-08-18T11:27:31","date_gmt":"2009-08-18T05:57:31","guid":{"rendered":"http:\/\/www.tothenew.com\/blog\/?p=181"},"modified":"2011-06-16T12:31:35","modified_gmt":"2011-06-16T07:01:35","slug":"alfresco-render-html-code-written-in-tinymce","status":"publish","type":"post","link":"https:\/\/www.tothenew.com\/blog\/alfresco-render-html-code-written-in-tinymce\/","title":{"rendered":"Alfresco : Render html code written in tinymce"},"content":{"rendered":"<p>Hi,<\/p>\n<p>We were using tinymce on alfresco labs 3 stable version. Lately, client came up with the new requirement to display video&#8217;s in the page rendered from text given in tinymce. Since coupling between alfresco and current version of tinymce was so tight, we did not include the latest version of tinymce, which might have supported video&#8217;s too.<\/p>\n<p>So we decided to render html given in tinymce ourselves, after loading the domain object. The Sample code is given below :<\/p>\n<blockquote>\n<div class=\"wp_syntax\">\n<div class=\"code\">\n<pre class=\"\u201dgroovy\u201d\">import java.util.regex.Pattern\r\nimport java.util.regex.Matcher\r\nString sampleText = new String('''###&amp;lt;width&amp;gt;369&amp;lt;\/width&amp;gt;&amp;lt;height&amp;gt;174&amp;lt;\/height&amp;gt;&amp;lt;image&amp;gt;\/bw\/images\/preview.jpg&amp;lt;\/image&amp;gt;&amp;lt;url&amp;gt;http:\/\/www.mediacollege.com\/video-gallery\/testclips\/barsandtone.flv&amp;lt;\/url&amp;gt; ###''')\r\n\r\nsampleText = replaceHtmlTags(sampleText)\r\n\r\ndef replaceHtmlTags(def text){\r\ntry{\r\n   Pattern pattern = Pattern.compile('''###(.*?)###'''); \/\/ searches the string wrapped up with \"###\"\r\n   Matcher matcher\r\n   def tagStr,updatedTagStr\r\n   matcher = pattern.matcher(text);\r\n   int count=1\r\n   while (matcher.find()) {\r\n       tagStr = matcher.group()\r\n       updatedTagStr = new String(tagStr)   \r\n       updatedTagStr = updatedTagStr.replaceAll(\"&amp;lt;\", \"&lt;\")\r\n       updatedTagStr = updatedTagStr.replaceAll(\"&amp;gt;\", \"&gt;\")\r\n       updatedTagStr = updatedTagStr.replaceAll(\"&amp;quot;\", \"\\\"\")\r\n       updatedTagStr = updatedTagStr.replaceAll(\"&amp;amp;\", \"&amp;\")\r\n       updatedTagStr = updatedTagStr.replaceAll(\"###\", \"\")\r\n       text = text.replace(tagStr, updatedTagStr)   \r\n   }\r\n}catch(Exception e){\r\n    println \"Exception caused \" + e.message\r\n}\r\n   return text\r\n}<\/pre>\n<\/div>\n<\/div>\n<\/blockquote>\n<p>With this code in place, html code wrapped up with &#8220;###&#8221; in tinymce, can be rendered as HTML tags rather than just a string. This gives\u00a0lot of power to the user, as it can be used to show videos, slides from slideshare and anything we can display using html. for example, to play youtube video on our webpage along with other content, we just need to copy the embed or object tag from youtube to our tinymce and call replaceHtmlTags function we just saw on that text and the video would be up and running. <\/p>\n<p>Hope this helped.<\/p>\n<p>Cheers!<br \/>\n~~Amit Jain~~<br \/>\n<a href=\"mailto:amit@intelligrape.com\">amit@intelligrape.com<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Write and render your html code written in tinymce. It allows user to used any html tags like we can copy embed tag from youtube and paste in our tinymce. and that video can be visible on our webpage along with the text entered in tinymce.  <\/p>\n","protected":false},"author":7,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"iawp_total_views":5},"categories":[1],"tags":[4842,598],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/posts\/181"}],"collection":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/comments?post=181"}],"version-history":[{"count":0,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/posts\/181\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/media?parent=181"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/categories?post=181"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/tags?post=181"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}