Alfresco : Render html code written in tinymce

18 / Aug / 2009 by Amit Jain 1 comments

Hi,

We were using tinymce on alfresco labs 3 stable version. Lately, client came up with the new requirement to display video’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’s too.

So we decided to render html given in tinymce ourselves, after loading the domain object. The Sample code is given below :

import java.util.regex.Pattern
import java.util.regex.Matcher
String sampleText = new String('''###<width>369</width><height>174</height><image>/bw/images/preview.jpg</image><url>http://www.mediacollege.com/video-gallery/testclips/barsandtone.flv</url> ###''')

sampleText = replaceHtmlTags(sampleText)

def replaceHtmlTags(def text){
try{
   Pattern pattern = Pattern.compile('''###(.*?)###'''); // searches the string wrapped up with "###"
   Matcher matcher
   def tagStr,updatedTagStr
   matcher = pattern.matcher(text);
   int count=1
   while (matcher.find()) {
       tagStr = matcher.group()
       updatedTagStr = new String(tagStr)   
       updatedTagStr = updatedTagStr.replaceAll("&lt;", "<")
       updatedTagStr = updatedTagStr.replaceAll("&gt;", ">")
       updatedTagStr = updatedTagStr.replaceAll("&quot;", "\"")
       updatedTagStr = updatedTagStr.replaceAll("&amp;", "&")
       updatedTagStr = updatedTagStr.replaceAll("###", "")
       text = text.replace(tagStr, updatedTagStr)   
   }
}catch(Exception e){
    println "Exception caused " + e.message
}
   return text
}

With this code in place, html code wrapped up with “###” in tinymce, can be rendered as HTML tags rather than just a string. This gives lot 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.

Hope this helped.

Cheers!
~~Amit Jain~~
amit@intelligrape.com

FOUND THIS USEFUL? SHARE IT

comments (1 “Alfresco : Render html code written in tinymce”)

Leave a Reply to Christos Cancel reply

Your email address will not be published. Required fields are marked *