Index: /main/trunk/greenstone3/src/java/org/greenstone/gsdl3/core/TransformingReceptionist.java
===================================================================
--- /main/trunk/greenstone3/src/java/org/greenstone/gsdl3/core/TransformingReceptionist.java	(revision 23311)
+++ /main/trunk/greenstone3/src/java/org/greenstone/gsdl3/core/TransformingReceptionist.java	(revision 23312)
@@ -263,5 +263,5 @@
             logger.error("BEFORE Modify node attribute = "+result.getAttributes().getNamedItem("href").getNodeValue());
             String url = result.getAttributes().getNamedItem("href").getNodeValue();
-            url = url + "&excerptid=gs_content";
+            url = url + "&excerptid=results";
             result.getAttributes().getNamedItem("href").setNodeValue(url);
             logger.error("AFTER Modify node attribute = "+result.getAttributes().getNamedItem("href").getNodeValue());
Index: /main/trunk/greenstone3/web/interfaces/oran/js/gui_div.js
===================================================================
--- /main/trunk/greenstone3/web/interfaces/oran/js/gui_div.js	(revision 23311)
+++ /main/trunk/greenstone3/web/interfaces/oran/js/gui_div.js	(revision 23312)
@@ -3,4 +3,120 @@
 
 var initialised_iframe = "false";
+
+function createFormatStatement()
+{
+
+    var formatStatement = document.getElementById('formatStatement');
+    console.log(formatStatement);
+    if(formatStatement.hasChildNodes())
+    {
+        var formatstring = traverse(formatStatement, "");
+        console.log(formatstring);
+
+        // var children = $(formatStatement).children('div');
+        // for(var i=0; i < children.length; i++)
+        //    traverse(children[i], formatstring)
+     
+        /*
+        var children = formatStatement.childNodes; //[]getChildNodes();
+        var current;
+        for(var i = 0; i < formatStatement.childNodes.length; i++)
+        {
+            current = formatStatement.childNodes[i];
+            //console.log(current.nodeName);
+            //console.log(current.nodeType);
+            if(current.nodeName=='DIV')
+            {
+                //console.log(current);
+                //console.log(current.className);
+                var gsf = find_class(current);
+                console.log(gsf);
+            }
+        }
+        */
+    }
+}
+
+function traverse(node, formatstring)
+  {
+    //console.log("node=("+node.nodeName+","+node.nodeType+")");
+
+    if(node.nodeName=='DIV')
+    {
+        console.log("Found a div" +node.nodeName+","+node.nodeType);
+        formatstring = formatstring + find_class(node);
+        console.log(formatstring);
+    }
+
+    var children = $(node).children();
+    for(var i=0; i < children.length; i++)
+        formatstring = formatstring + traverse(children[i], formatstring);
+
+    return formatstring;
+  }
+        
+
+/*
+    console.log("node=("+node.nodeName+","+node.nodeType+")");
+
+    if(node.children.length == 0) //hasChildNodes()) 
+    {
+        console.log("No children so return");
+        return "";
+    }
+
+    if(node.nodeName=='DIV')
+    {
+        console.log("Found a div");
+        formatstring = formatstring + find_class(node);
+    }        
+    
+    for(var i = 0; i < node.children.length; i++)
+        return recursiveTraverse(node.children[i], formatstring);
+    
+
+    return formatstring;
+  }
+*/
+
+function find_class(current)
+{
+    var classes = current.className.split(' ');
+    var none = "";
+    for(var i = 0; i < classes.length; i++)
+    {
+        switch(classes[i])
+        {
+            case 'gsf_template':
+              return create_gsf_template(current);
+            default:
+            {
+              console.log("Class not found");
+              return none;
+            }
+        }
+    }
+}
+
+function create_gsf_template(current)
+{
+    // find match text which is an input with class match
+    var match = $(current).find('.match')[0].value;
+    console.log(match);
+    
+    // find mode text which is an input with class mode
+    var mode = $(current).find('.mode')[0].value;
+    console.log(mode);
+
+    // "<gsf:template match=\"classifierNode\" mode=\"horizontal\">"
+    var gsf = "<gsf:template match=\"" + match + "\"";
+    if(mode != "vertical")
+        gsf = gsf + " mode=\"" + mode + "\"";
+    gsf = gsf + ">";
+    
+    return gsf;
+
+}
+
 /*
 $("#iframe").ready(function(){
@@ -107,9 +223,22 @@
             a = preview_html.substring(0,end_index);
             b = preview_html.substring(end_index);
-            preview_html = a.concat("&excerptid=gs_content", b);
+            preview_html = a.concat("&excerptid=results", b);
             console.log(preview_html);
-            start_index = end_index + "&excerptid=gs_content\">".length;
+            start_index = end_index + "&excerptid=results\">".length;
         }
     }
+
+    // Split the html code in to three parts
+    var first_index = preview_html.indexOf("<ul id=\"results\"");
+    console.log("First index is "+first_index);
+    var second_index = preview_html.indexOf("</ul>", first_index) + "</ul>".length;
+    console.log("Second index is "+second_index);
+
+    var first_half = preview_html.substring(0, first_index);
+    var iframe_code = preview_html.substring(first_index, second_index);
+    var second_half = preview_html.substring(second_index);
+
+    //$('#my_categories').innerHTML = first_half.concat(second_half);
+    document.getElementById("my_categories").innerHTML = first_half.concat(second_half);
 
     // Put the content in the iframe
@@ -119,5 +248,5 @@
         console.log(preview_html);
         iframe_document.open();
-        iframe_document.writeln(preview_html); //.concat("&excerptid=gs_content"));
+        iframe_document.writeln(iframe_code); //.concat("&excerptid=gs_content"));
         iframe_document.close(); 
         initialised_iframe = "true";
Index: /main/trunk/greenstone3/web/interfaces/oran/transform/layouts/main.xsl
===================================================================
--- /main/trunk/greenstone3/web/interfaces/oran/transform/layouts/main.xsl	(revision 23311)
+++ /main/trunk/greenstone3/web/interfaces/oran/transform/layouts/main.xsl	(revision 23312)
@@ -173,4 +173,6 @@
 
     <td width="75%">
+
+    <button id="updateFormatStatement" type="button" onclick="createFormatStatement()">Update Format Statement</button>
 
     <div id="formatStatement">
@@ -239,4 +241,7 @@
 <!-- *************************************************************************************** -->
 <H2>Preview</H2>
+
+                    <div id="my_categories"><xsl:text> </xsl:text></div>
+
                     <iframe name="preview" id="iframe" width="98%" height="300">Your browser does not support iframes</iframe> 
 
Index: /main/trunk/greenstone3/web/interfaces/oran/transform/layouts/xml-to-gui.xsl
===================================================================
--- /main/trunk/greenstone3/web/interfaces/oran/transform/layouts/xml-to-gui.xsl	(revision 23311)
+++ /main/trunk/greenstone3/web/interfaces/oran/transform/layouts/xml-to-gui.xsl	(revision 23312)
@@ -236,11 +236,10 @@
             <xsl:variable name="mode">
                 <xsl:choose>
-                    <xsl:when test="not(@mode)"> <!-- parameter has not been supplied -->
-                    </xsl:when>
-                    <xsl:otherwise>MODE=<input type="text" name="rawtextinput" size="10" value="{@mode}"/></xsl:otherwise>
+                    <xsl:when test="not(@mode)">MODE=<input class="mode" type="text" name="rawtextinput" size="10" value="vertical"/></xsl:when>
+                    <xsl:otherwise>MODE=<input class="mode" type="text" name="rawtextinput" size="10" value="{@mode}"/></xsl:otherwise>
                 </xsl:choose>
             </xsl:variable>
     
-            <table class="header"><tbody><tr><td class="header">MATCH=<input type="text" name="rawtextinput" size="10" value="{@match}"/></td><td class="header"><xsl:copy-of select="$mode"/></td><td class="header"><a href="#" class="minmax ui-icon ui-icon-plusthick" title="Click me to expand">[+]</a></td><td class="header"><a href="#" class="remove ui-icon ui-icon-closethick" title="Click me to remove"/></td></tr></tbody></table>
+            <table class="header"><tbody><tr><td class="header">MATCH=<input class="match" type="text" name="rawtextinput" size="10" value="{@match}"/></td><td class="header"><xsl:copy-of select="$mode"/></td><td class="header"><a href="#" class="minmax ui-icon ui-icon-plusthick" title="Click me to expand">[+]</a></td><td class="header"><a href="#" class="remove ui-icon ui-icon-closethick" title="Click me to remove"/></td></tr></tbody></table>
 
                 <table class="table" border="1">
