Chris Pollett > Students >
Namon

    ( Print View )

    [Bio]

    [CS297Proposal]

    [Del1VML]

    [Del1SVG]

    [Del2Latex]

    [Del2MML]

    [Del3]

    [Del4]

    [CS297Report-PDF]

    [CS298Proposal]

    [CS298FinalReport-PDF]

    [CS298Presentation-PDF]

    [DemoSquareroot]

    [DemoSubscript]

    [DemoFraction]

                           

























Deliverable 4 -- Translating a fragment of MathML

Purpose: To get the MathML matrix related, apply, minus, times, divide, 
and eq tags to translate to VML and to SVG via XSLT.

Description: 

This deliverable gives a style sheet transformation to VML for some 
particular tags in MathML language such as: matrix related tags, apply, 
minus, times, divide, and eq. It differs from the last deliverable in 
that it translates those tags from the content markup mode, unlike 
last deliverable which transform according to the presentation markup 
mode. 

The use of content markup rather than presentation markup for mathematics 
is sometimes referred to as semantic tagging. The parse-tree of a valid 
element structure using MathML content elements corresponds directly to 
the expression tree of the underlying mathematical expression. 

However, even in such simple expressions as X + Y, some additional 
information may be required for applications such as computer algebra. 
Are X and Y integers, or functions, etc.?  For example, 
do we have X+Y or just +X. The intepretion
must determine which operand a given operator should be applied to. 
This additional information is referred to as semantic mapping. 
In MathML, this mapping is provided by the semantics, annotation and annotation-xml elements.

The semantics element is the container element for the MathML 
expression together with its semantic mappings. semantics expects a 
variable number of child elements. The first is the element (which 
may itself be a complex element structure) for which this additional 
semantic information is being defined. The second and subsequent 
children, if any, are instances of the elements annotation 
and/or annotation-xml.

Our stylesheet transformation inteprets the  MathML expression 
according to some features in the content markup mode explained 
above such as, the ability to determine which operand should the 
operator  apply to (eg. A-B or -B )

Technical Information: 

1) matrix and matrixrow 

The matrix element is used to represent mathematical matrices It has 
zero or more child elements, all of which are matrixrow elements. These 
in turn expect zero or more child elements that evaluate to algebraic 
expressions or numbers. These sub-elements are often numbers, or 
symbols as in the example below:

Example:
<matrix>
  <matrixrow> <cn> 1 </cn> <cn> 2 </cn> </matrixrow>
  <matrixrow> <cn> 3 </cn> <cn> 4 </cn> </matrixrow>
</matrix>
The matrixrow elements must always be contained inside of a matrix, and 
all rows in a given matrix must have the same number of elements. Note 
that the behavior of the matrix and matrixrow elements is substantially 
different from the mtable and mtr presentation elements. 

 
2) apply
Its purpose is to apply a function or operator to its arguments to 
produce an expression representing an element of the codomain of the
function. It is involved in everything from forming sums such as 
a + b as in 

<apply>
  <plus/>
  <ci> a </ci>
  <ci> b </ci>
</apply>

through to using the sine function to construct sin(a) as in 

<apply>
  <sin/>
  <ci> a </ci>
</apply>

or constructing integrals. Its usage in any particular setting is 
determined largely by the properties of the function (the first child 
element). However, in this deliverable the sin and integrals 
transformations are not provided.
 
3) Subtraction (minus)
The minus element is the subtraction operator.
The minus element can be used as a unary arithmetic operator (e.g. to 
represent - x), or as a binary arithmetic operator 
(e.g. to represent x- y).

Example
<apply> <minus/>
  <ci> x </ci>
  <ci> y </ci>
</apply>
 
4) Addition (plus)
The plus element is the addition operator (e.g. to represent x + y).

Example
<apply>
  <plus/>
  <ci> x </ci>
  <ci> y </ci>
  <ci> z </ci>
</apply>

5) Multiplication (times)
The times element is the multiplication operator 
(e.g. to represent x * y).

Example
<apply>
  <times/>
  <ci> a </ci>
  <ci> b </ci>
</apply>
 
6) Equals (eq)
The eq element is the relational operator `equals'
(e.g. to represent x = y).

Example
<apply>
  <eq/>
  <ci> a </ci>
  <ci> b </ci>
</apply>
 
7) Division (divide)
The divide element is the division operator 
(e.g. to represent x / y).

Example
<apply>
  <divide/>
  <ci> a </ci>
  <ci> b </ci>
</apply>
 	

An Example of Our Transformation

Here is a short example of a MathML document we can transform:

<?xml version="1.0" encoding="UTF-8"?>

<?xml-stylesheet type="text/xsl" href="matrix-content-xsl.xsl"?>

<!-- DOCTYPE math PUBLIC "-//W3C//DTD MathML 2.0//EN" "dtd/mathml2.dtd" -->


<!-- math xmlns="http://www.w3.org/1998/Math/MathML" -->

<math>

<matrix>
  
  <matrixrow>
    <apply> <plus/> <ci> c </ci> <cn>9</cn></apply>
    <cn> 10 </cn> 
    <cn> 11 </cn>
  </matrixrow>
  
  <matrixrow>
    <matrix>
    	    <matrixrow><cn> 1 </cn> <cn> 0 </cn> <cn> 0 </cn></matrixrow>
    	    <matrixrow><cn> 0 </cn> <cn> 1 </cn> <cn> 1 </cn></matrixrow>
  	    <matrixrow><cn> 1 </cn> <cn> 0 </cn> <cn> 1 </cn></matrixrow>
    </matrix>  
    <cn> 12 </cn>
    <cn> 13 </cn>
  </matrixrow>
  
  <matrixrow>
    <cn>10</cn>
    <ci>11</ci> 
    <ci>12</ci>
  
  </matrixrow>
</matrix>


<apply>
  <divide/>
  <ci> a </ci>
  <cn> 10 </cn>
  <cn> 20 </cn>
</apply>

<apply>
  <plus/>
  <ci> c </ci>
  
</apply>

<apply>
  <times/>
  <ci> c </ci>
  <cn> 20 </cn>
  <cn> 30 </cn>
</apply>

<apply>
  <eq/>
  <ci> c </ci>
  <cn> 40 </cn>
  <cn> 50 </cn>
</apply>

<apply>
  <minus/>
  <ci> c </ci>
  <cn> 60 </cn>
  <cn> 70 </cn>
</apply>




</math>

This example when transformed by our stylesheet looks like:

Transformed matrix document

Source Code

<!-- XML Header -->
<?xml version="1.0"?>
<!-- xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform xmlns:xsl="http://www.w3.org/TR/WD-xsl" -->
<!-- xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" -->
<xsl:stylesheet version="1.0"
      xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
      xmlns:msxsl="urn:schemas-microsoft-com:xslt"
      xmlns:user="http://mycompany.com/mynamespace">
<xsl:output method="html"/>


<!-- Declare variables -->
<!-- variable: heightPortion is used for multiply with the number of maximum rows in the matrix to assign the height of left & right matrix bracket -->
<xsl:variable name="heightPortion" select="170"/>





<!-- variable: MaxRows is used for find the number of maximum rows in the matrix (can be complicated in case of nested matrices) -->
<xsl:variable name="maxRows">
     	<xsl:call-template name="FindMaxRows">
             <xsl:with-param name="value" select="0"/>
        </xsl:call-template >
</xsl:variable>



<xsl:template match="/">

   <!-- header in vml -->    
   <html xmlns:v="urn:schemas-microsoft-com:vml">
        <head>
            <title>Deliverable 4</title>
            <object id="VMLRender"
                classid="CLSID:10072CEC-8CC1-11D1-986E-00A0C955B42E">
            </object>
            <style>
                v\:* {behavior: url(#VMLRender)}
            </style>
            
            <!-- VML Left Bracket ( [ ) -->
            <v:shapetype id="leftbracket"
	      	coordsize="516,516"
	      	stroke="true"
	        strokecolor="black"
	        strokeweight="1.50pt"
	      	path="m 50,30 l 30,30, 30,120, 50,120 e">
	    </v:shapetype>
	    
	    <!-- VML Right Bracket ( ] ) -->
	    <v:shapetype id="rightbracket"
	       	coordsize="516,516"
	       	path="m 30,30 l 50,30, 50,120, 30,120  e"
	       	stroke="true"
	    	strokecolor="black"
	    	strokeweight="1.50pt">
	    </v:shapetype>
	    
	    <!-- VML Divide ( / ) -->
	    <v:shapetype id="divide"
	        coordsize="516,516"
	        path="m 60,30 l 10,70 e"
	        stroke="true"
	    	strokecolor="black"
	    	strokeweight="1.50pt">
	    </v:shapetype>
	    
	    <!-- VML Plus  ( + ) -->
	    <v:shapetype id="plus"
	        coordsize="100,100"
	        path="m 30 20 l 30 60 e m 10 40 l 50 40 e"
	        stroke="true"
	    	strokecolor="black"
	    	strokeweight="1.50pt">
	     </v:shapetype>
	     
	     <!-- VML Equal ( = ) -->
	     <v:shapetype id="equal"
	        coordsize="100,100"
	        path="m 10 20 l 50 20 e m 10 40 l 50 40 e"
	        stroke="true"
	     	strokecolor="black"
	     	strokeweight="1.50pt">
	     </v:shapetype>
	    
	     <!-- VML Multiply ( * ) -->
	     <v:shapetype id="times"
	        coordsize="100,100"
	        path="m 20 20 l 40 50 e m 40 20 l 20 50 e"
	        stroke="true"
	     	strokecolor="black"
	     	strokeweight="1.50pt">
	     </v:shapetype>
	    
	     <!-- VML Minus ( - ) -->
	     <v:shapetype id="minus"
	        coordsize="100,100"
	        path="m 10 40 l 50 40 e"
	        stroke="true"
	     	strokecolor="black"
	     	strokeweight="1.50pt">
 	     </v:shapetype>
	    
        </head>
        <body>
             <xsl:apply-templates/>
        </body>        
    </html>
</xsl:template>


<!-- If match "matrix", add table header and set align to "center" -->
<xsl:template match="matrix">
    <!-- sets table width and align at center -->
    <table width="15%" align = "center">
    
    
    <!-- Add each row -->
    <xsl:apply-templates/>
    
       
    </table>
</xsl:template>


<!-- if row is the first one then add bracket into it -->
<!-- The left and right brackets are in the first row of table (in HTML). Therefore, the rowspan must be the number of rows of the entire matrix -->
<xsl:template match="matrixrow[position() = 1 ]">
   <tr>

	<!--Add Left Bracket ( we can also make this a template )-->
	   <!--<td rowspan="NumberOfRows" width="10%"> -->
	   <!--<v:shape type="#leftbracket" style='width:100px; height:(numberOfRows * heightPortion)px'/></v:shape> -->
	   <!--</td> -->
	
	<!-- This element uses attribute "tdBracketAttributes" to add <td> tag with its attributes to wrap this element -->
	<xsl:element name="td" use-attribute-sets="tdBracketAttributes">
	    
	    	<!-- output vml tag "v:shape type="#leftbracket" style='width:100px; height:300px'/></v:shape>" -->
		
		<!-- output and open vml tag "<" -->
	    	<xsl:text disable-output-escaping="yes">&lt;</xsl:text>
	    	
	    	<!-- output vml tag "v:shape type=" -->
	    	<xsl:text disable-output-escaping="yes">v:shape type=&quot;#leftbracket&quot; style=&quot;width:100px; height:</xsl:text>
	    	
	    	<!-- output hieght of the bracket which is "numberOfRow * heightPortion" -->
	      	<xsl:value-of select="$maxRows*$heightPortion"/>
	    	<xsl:text disable-output-escaping="yes">px &quot; /&gt;</xsl:text>
	</xsl:element>

	<!-- Add each column -->
	<xsl:if test="child::apply">
	        <xsl:text disable-output-escaping="yes">&lt;td width=&quot;25%&quot;&gt;</xsl:text>
	 	<div align="center"><i>
	 	  <xsl:apply-templates select="apply"/>
		</i></div>
		<xsl:text disable-output-escaping="yes">&lt;/td&gt;</xsl:text>
	</xsl:if>
	<xsl:apply-templates select="cn"/>
	<xsl:apply-templates select="ci"/>

	
	<!-- Add Right Bracket -->
	   <!-- <td rowspan="NumberOfRows" width="10%"> -->
	   <!-- <v:shape type="#rightbracket" style='width:100px; height:(numberOfRows * heightPortion)px'/></v:shape> -->
	   <!-- </td> -->
	
	<xsl:element name="td" use-attribute-sets="tdBracketAttributes">
	    
	    	<!-- output vml tag "v:shape type="#leftbracket" style='width:100px; height:300px'/></v:shape>" -->
		
		<!-- output and open vml tag "<" -->
	    	<xsl:text disable-output-escaping="yes">&lt;</xsl:text>
	    	
	    	<!-- output vml tag "v:shape type=" -->
	    	<xsl:text disable-output-escaping="yes">v:shape type=&quot;#rightbracket&quot; style=&quot;width:100px; height:</xsl:text>
	    	
	    	<!-- output hieght of the bracket which is "numberOfRow * heightPortion" -->
	      	<xsl:value-of select="$maxRows*$heightPortion"/>
	    	<xsl:text disable-output-escaping="yes">px &quot; /&gt;</xsl:text>
	</xsl:element>
    </tr>
</xsl:template>	  

<!-- if row is not the fist one then just add new row of table -->
<xsl:template match="matrixrow[position() &gt; 1]">
    <tr>

	<xsl:apply-templates select="cn"/>
	<xsl:apply-templates select="ci"/>
	<xsl:if test="child::apply">
	        <xsl:text disable-output-escaping="yes">&lt;td width=&quot;25%&quot;&gt;</xsl:text>
	 	<div align="center"><i>
	 	  <xsl:apply-templates select="apply"/>
		</i></div>
		<xsl:text disable-output-escaping="yes">&lt;/td&gt;</xsl:text>
	</xsl:if>
    </tr>
</xsl:template>


<!-- problem 1. it doesn't go in for-each. 2.it doesn't call column template -->


<xsl:template match="matrixrow[matrix]">
    <tr>
    <td width="25%" align="center"> 
   
    <!-- set maxRows to the numberOfRows attribute of the content node. -->
    <!-- if it contain nested matrix then set maxRows to Sum of numberOfRows of all the descendant and minus 1. -->    
    <!-- We need to copy the whole thing inside this loop, because the maxRows value doesn't update the global maxRows value outside this "when" tag -->
    <xsl:choose>
    	<xsl:when test="child::matrix/descendant::matrix">
     	    <xsl:variable name="maxRows" select="count(descendant-or-self::matrixrow)- 1"/> 
     	     <!-- xsl:text> Have nested Matrix maxRows = </xsl:text><xsl:value-of select="$maxRows"/ -->
	    
	    
	    <table width="15%" align = "center">
	    
	     <!-- select only the child of child level (not more than that), So it doesn't go in the nested matrix. -->
	     <xsl:for-each select="child::matrix/child::matrixrow">
		
		<xsl:choose>
		   <!-- If it's the first row then add bracket to it, otherwise just add td tag -->	
		   <xsl:when test="position() = 1">
		   
    		   <tr>
    		    		    
			<!--Add Left Bracket ( we can also make this a template )-->
			   <!--<td rowspan="NumberOfRows" width="10%"> -->
			   <!--<v:shape type="#leftbracket" style='width:100px; height:(numberOfRows * heightPortion)px'/></v:shape> -->
			   <!--</td> -->
			
			<!-- This element uses attribute "tdBracketAttributes" to add <td> tag with its attributes to wrap this element -->
			<xsl:element name="td" use-attribute-sets="tdBracketAttributes">
			    
			    	<!-- output vml tag "v:shape type="#leftbracket" style='width:100px; height:300px'/></v:shape>" -->
				
				<!-- output and open vml tag "<" -->
			    	<xsl:text disable-output-escaping="yes">&lt;</xsl:text>
			    	
			    	<!-- output vml tag "v:shape type=" -->
			    	<xsl:text disable-output-escaping="yes">v:shape type=&quot;#leftbracket&quot; style=&quot;width:100px; height:</xsl:text>
			    	
			    	<!-- output hieght of the bracket which is "numberOfRow * heightPortion" -->
			      	<xsl:value-of select="$maxRows*$heightPortion"/>
			    	<xsl:text disable-output-escaping="yes">px &quot; /&gt;</xsl:text>
			</xsl:element>
			
		
		
			<!-- Add each column -->
			<xsl:apply-templates select="cn"/>
			<xsl:apply-templates select="ci"/>
			<xsl:if test="self::apply">
			        <xsl:text disable-output-escaping="yes">&lt;td width=&quot;25%&quot;&gt;</xsl:text>
			 	<div align="center"><i>
			 	  <xsl:apply-templates select="apply"/>
				</i></div>
				<xsl:text disable-output-escaping="yes">&lt;/td&gt;</xsl:text>
			</xsl:if>


			
        			
			<!-- Add Right Bracket -->
			   <!-- <td rowspan="NumberOfRows" width="10%"> -->
			   <!-- <v:shape type="#rightbracket" style='width:100px; height:(numberOfRows * heightPortion)px'/></v:shape> -->
			   <!-- </td> -->
			
			<xsl:element name="td" use-attribute-sets="tdBracketAttributes">
			    
			    	<!-- output vml tag "v:shape type="#leftbracket" style='width:100px; height:300px'/></v:shape>" -->
				
				<!-- output and open vml tag "<" -->
			    	<xsl:text disable-output-escaping="yes">&lt;</xsl:text>
			    	
			    	<!-- output vml tag "v:shape type=" -->
			    	<xsl:text disable-output-escaping="yes">v:shape type=&quot;#rightbracket&quot; style=&quot;width:100px; height:</xsl:text>
			    	
			    	<!-- output hieght of the bracket which is "numberOfRow * heightPortion" -->
			      	<xsl:value-of select="$maxRows*$heightPortion"/>
			    	<xsl:text disable-output-escaping="yes">px &quot; /&gt;</xsl:text>
			</xsl:element>
		    </tr>
		    	
		   </xsl:when>
		   
		   
		   <!-- if it's not the first row just add tr tag to it, then call column template. -->
		   <xsl:when test="position() &gt; 1">
		    	<xsl:for-each select=".">
		   	  <tr>
				<xsl:apply-templates select="cn"/>
				<xsl:apply-templates select="ci"/>
				<xsl:if test="self::apply">
				        <xsl:text disable-output-escaping="yes">&lt;td width=&quot;25%&quot;&gt;</xsl:text>
				 	<div align="center"><i>
				 	  <xsl:apply-templates select="apply"/>
					</i></div>
					<xsl:text disable-output-escaping="yes">&lt;/td&gt;</xsl:text>
				</xsl:if>

    			  </tr>		      		
		    	</xsl:for-each>
		   
		  </xsl:when>
		  
		  
		        
                </xsl:choose>
	      </xsl:for-each>
       
   	    </table>


   	</xsl:when>
   	
   	
   	<!-- Check if it doesn't have anymore nested matrix then set maxRows to numberOfRows attribute of that matrix -->
   	<!-- We need to copy the whole thing inside this loop, because the maxRows value doesn't update the global maxRows value outside this "when" tag -->
   	<xsl:otherwise>
   	    <xsl:variable name="maxRows" select="count(child::matrix/child::matrixrow)-1"/>
   	    <!-- xsl:text> No nested matrix maxRows = </xsl:text><xsl:value-of select="$maxRows"/ -->
   	    

	    <table width="15%" align = "center">
	    
	     <!-- select only the child of child level (not more than that), So it doesn't go in the nested matrix. -->
	     <xsl:for-each select="child::matrix/child::matrixrow">
		
		<xsl:choose>
		   <!-- If it's the first row then add bracket to it, otherwise just add td tag -->	
		   <xsl:when test="position() = 1">
		   
    		   <tr>
    		    		    
			<!--Add Left Bracket ( we can also make this a template )-->
			   <!--<td rowspan="NumberOfRows" width="10%"> -->
			   <!--<v:shape type="#leftbracket" style='width:100px; height:(numberOfRows * heightPortion)px'/></v:shape> -->
			   <!--</td> -->
			
			<!-- This element uses attribute "tdBracketAttributes" to add <td> tag with its attributes to wrap this element -->
			<xsl:element name="td" use-attribute-sets="tdBracketAttributes">
			    
			    	<!-- output vml tag "v:shape type="#leftbracket" style='width:100px; height:300px'/></v:shape>" -->
				
				<!-- output and open vml tag "<" -->
			    	<xsl:text disable-output-escaping="yes">&lt;</xsl:text>
			    	
			    	<!-- output vml tag "v:shape type=" -->
			    	<xsl:text disable-output-escaping="yes">v:shape type=&quot;#leftbracket&quot; style=&quot;width:100px; height:</xsl:text>
			    	
			    	<!-- output hieght of the bracket which is "numberOfRow * heightPortion" -->
			      	<xsl:value-of select="$maxRows*$heightPortion"/>
			    	<xsl:text disable-output-escaping="yes">px &quot; /&gt;</xsl:text>
			</xsl:element>
			
		
		
			<!-- Add each column -->
			<xsl:apply-templates select="cn"/>
			<xsl:apply-templates select="ci"/>
			<xsl:if test="self::apply">
			        <xsl:text disable-output-escaping="yes">&lt;td width=&quot;25%&quot;&gt;</xsl:text>
			 	<div align="center"><i>
			 	  <xsl:apply-templates select="apply"/>
				</i></div>
				<xsl:text disable-output-escaping="yes">&lt;/td&gt;</xsl:text>
			</xsl:if>

			
			
			<!-- Add Right Bracket -->
			   <!-- <td rowspan="NumberOfRows" width="10%"> -->
			   <!-- <v:shape type="#rightbracket" style='width:100px; height:(numberOfRows * heightPortion)px'/></v:shape> -->
			   <!-- </td> -->
			
			<xsl:element name="td" use-attribute-sets="tdBracketAttributes">
			    
			    	<!-- output vml tag "v:shape type="#leftbracket" style='width:100px; height:300px'/></v:shape>" -->
				
				<!-- output and open vml tag "<" -->
			    	<xsl:text disable-output-escaping="yes">&lt;</xsl:text>
			    	
			    	<!-- output vml tag "v:shape type=" -->
			    	<xsl:text disable-output-escaping="yes">v:shape type=&quot;#rightbracket&quot; style=&quot;width:100px; height:</xsl:text>
			    	
			    	<!-- output hieght of the bracket which is "numberOfRow * heightPortion" -->
			      	<xsl:value-of select="$maxRows*$heightPortion"/>
			    	<xsl:text disable-output-escaping="yes">px &quot; /&gt;</xsl:text>
			</xsl:element>
		    </tr>
		    	
		   </xsl:when>
		   
		   
		   <!-- if it's not the first row just add tr tag to it, then call column template. -->
		   <xsl:when test="position() &gt; 1">
		    	<xsl:for-each select=".">
		   	  <tr>
				<xsl:apply-templates select="cn"/>
				<xsl:apply-templates select="ci"/>
				<xsl:if test="self::apply">
				        <xsl:text disable-output-escaping="yes">&lt;td width=&quot;25%&quot;&gt;</xsl:text>
				 	<div align="center"><i>
				 	  <xsl:apply-templates select="apply"/>
					</i></div>
					<xsl:text disable-output-escaping="yes">&lt;/td&gt;</xsl:text>
				</xsl:if>

    			  </tr>		      		
		    	</xsl:for-each>
		   
		  </xsl:when>
		        
                </xsl:choose>
	      </xsl:for-each>
       
   	    </table>   	
   	
   	</xsl:otherwise>
    </xsl:choose>

    </td>

    <xsl:apply-templates select="cn"/>
    <xsl:apply-templates select="ci"/>
    <xsl:if test="child::apply">

	        <xsl:text disable-output-escaping="yes">&lt;td width=&quot;25%&quot;&gt;</xsl:text>
	 	<div align="center"><i>
	 	  <xsl:apply-templates select="apply"/>
		</i></div>
		<xsl:text disable-output-escaping="yes">&lt;/td&gt;</xsl:text>


    </xsl:if>    
    </tr>
    
	
</xsl:template>


<xsl:template match="cn">

   <xsl:if test="parent::matrixrow">
       <xsl:text disable-output-escaping="yes">&lt;td width=&quot;25%&quot;&gt;</xsl:text>
 
    <!-- The font is VML code -->
    <!-- <div align="center"> -->
    <!-- <v:shape style='width:100;height:100' path="m 200 500 l 600 500 e" fillcolor="black" title="mi" > -->
    <!-- <v:path textpathok="t"/>  -->
    <!-- <v:textpath on="t" style='position:absolute;font-family:"Courier New";monospace; font-style:"italic";' -->
    <!--  string="a" /> -->
    <!-- </v:shape> -->
    <!--  </div> -->
    <!-- end comment -->
        
        
      <div align="center"><i>
	

	<!-- output and open vml tag "<" -->
	<xsl:text disable-output-escaping="yes">&lt;</xsl:text>
	<!-- output vml tag "v:shape type=" -->
        <xsl:text disable-output-escaping="yes">v:shape style=&quot;width:516;height:516&quot; path=&quot;m 200 500 l 800 500 e&quot; fillcolor=&quot;black&quot; title=&quot;mi&quot; &gt;</xsl:text>
        <xsl:text disable-output-escaping="yes">&lt;v:path textpathok=&quot;t&quot;/&gt;</xsl:text>
        <xsl:text disable-output-escaping="yes">&lt;v:textpath on=&quot;t&quot; style=&quot;position:absolute;font-family:&quot;Courier New&quot;;monospace; font-style:&quot;italic&quot;;&quot; string=&quot;</xsl:text>
        <!-- The value of matrix's element -->
        <xsl:value-of select="."/>
        <xsl:text disable-output-escaping="yes">&quot; /&gt;</xsl:text>
        <xsl:text disable-output-escaping="yes">&lt;/v:shape&gt;</xsl:text>
	
      
      </i></div>
      <xsl:text disable-output-escaping="yes">&lt;/td&gt;</xsl:text>
    </xsl:if>
</xsl:template>




<xsl:template match="ci">

 <xsl:if test="parent::matrixrow">
       <xsl:text disable-output-escaping="yes">&lt;td width=&quot;25%&quot;&gt;</xsl:text>
       <div align="center"><i>
	

	<!-- output and open vml tag "<" -->
	<xsl:text disable-output-escaping="yes">&lt;</xsl:text>
	<!-- output vml tag "v:shape type=" -->
        <xsl:text disable-output-escaping="yes">v:shape style=&quot;width:516;height:516&quot; path=&quot;m 200 500 l 800 500 e&quot; fillcolor=&quot;black&quot; title=&quot;mi&quot; &gt;</xsl:text>
        <xsl:text disable-output-escaping="yes">&lt;v:path textpathok=&quot;t&quot;/&gt;</xsl:text>
        <xsl:text disable-output-escaping="yes">&lt;v:textpath on=&quot;t&quot; style=&quot;position:absolute;font-family:&quot;Courier New&quot;;monospace; font-style:&quot;italic&quot;;&quot; string=&quot;</xsl:text>
        <!-- The value of matrix's element -->
        <xsl:value-of select="."/>
        <xsl:text disable-output-escaping="yes">&quot; /&gt;</xsl:text>
        <xsl:text disable-output-escaping="yes">&lt;/v:shape&gt;</xsl:text>
	
      
      </i></div>
      <xsl:text disable-output-escaping="yes">&lt;/td&gt;</xsl:text>
  </xsl:if>
</xsl:template>

<!-- Template to assign the value to the global variable "maxRows" -->
<!-- maxRows is equal to number of rows of this root matrix and all the nested matrix minus 1 -->
<xsl:template name="FindMaxRows">
  
 	<xsl:param name="value"/>
	<xsl:choose>

	<xsl:when test="$value=0">
 	   <xsl:value-of select="count(descendant-or-self::matrixrow)"/>   
	</xsl:when>
    
        </xsl:choose>
        
</xsl:template>

<!-- Attributes of td for the left & right brackets -->
<xsl:attribute-set name="tdBracketAttributes">
	<xsl:attribute name="rowspan"><xsl:value-of select="$maxRows"/></xsl:attribute>
	<xsl:attribute name="width">10%</xsl:attribute>
</xsl:attribute-set>





<!-- Apply -->

<xsl:template match="apply">
   	
   	<xsl:apply-templates/>
   	
</xsl:template>




<xsl:template match="divide">
	  <xsl:choose>
	    <!-- Case of only one operand display like this /a -->
	    <xsl:when test="count(parent::*//ci | parent::*//cn)=1">
	    	      	<!-- display divide symbol (/) in VML -->
	    	  	<xsl:call-template name="displayDivide"/>
	    	        <xsl:for-each select="parent::*//ci | parent::*//cn">
			    <xsl:call-template name="displayElement"/>
	    	        </xsl:for-each>
	    </xsl:when>
	    
	    <!-- display like this a/b/c -->
	    <xsl:otherwise>
	       <xsl:for-each select="parent::*//ci | parent::*//cn">
	          <xsl:choose>
	             <!-- display element follow by divide symbol eg. a/ -->
	             <xsl:when test="position()!=last()">
	             	<xsl:call-template name="displayElement"/>
	             	<xsl:call-template name="displayDivide"/>
	             </xsl:when>
	             <!-- For the last element, display only the element eg. a -->
	             <xsl:otherwise>
	             	<xsl:call-template name="displayElement"/>
	             </xsl:otherwise>	              
	          </xsl:choose>
	       </xsl:for-each>
	    </xsl:otherwise>
	  </xsl:choose>
	  <BR/>
	  <BR/>
</xsl:template>



<xsl:template match="eq">
	<xsl:call-template name="displayOperator">
	   <xsl:with-param name="operator" select="'#equal'"/>
	</xsl:call-template>	  
</xsl:template>




<xsl:template match="minus">
	<xsl:call-template name="displayOperator">
	   <xsl:with-param name="operator" select="'#minus'"/>
	</xsl:call-template>	  
</xsl:template>




<xsl:template match="plus">
	<xsl:call-template name="displayOperator">
	   <xsl:with-param name="operator" select="'#plus'"/>
	</xsl:call-template>
</xsl:template>




<xsl:template match="times">
	<xsl:call-template name="displayOperator">
	   <xsl:with-param name="operator" select="'#times'"/>
	</xsl:call-template>	  
</xsl:template>




<xsl:template name="displayOperator">
     <xsl:param name="operator"/>
	  <!-- display operand 1 -->
	  <!-- There are 2 cases -->
	  <!-- 1. with one operand, the out put is +a -->
	  <!-- 2. with two operands, the output is a+b or a+b+c+d -->
	 	  
	  <xsl:choose>
	    <!-- Case of only one operand display like this /a -->
	    <xsl:when test="count(parent::*//ci | parent::*//cn)=1">
	    	      	<!-- display operator in VML -->
	    	  	<!-- display operator -->
	    	  	
	    	  	<!-- <v:rect filled="false" fillcolor="white"  stroke="true" strokecolor="white" style="height:6px; width:18px"> </v:rect> -->
	    		<xsl:text disable-output-escaping="yes">&lt;v:group style=&quot;position:relative; width:100px; height:200px&quot; coordorigin=&quot;0,0&quot; coordsize=&quot;100, 100&quot;&gt;</xsl:text>
			<xsl:text disable-output-escaping="yes">&lt;v:rect filled=&quot;false&quot; fillcolor=&quot;white&quot;  stroke=&quot;true&quot; strokecolor=&quot;white&quot; style=&quot;height:6px; width:18px&quot;&gt;</xsl:text>
			<xsl:text disable-output-escaping="yes">&lt;/v:rect&gt;</xsl:text>
			
			<!-- <v:shape type="#plus" style='width:30px; height:10px'/> -->
			<xsl:text disable-output-escaping="yes">&lt;v:shape type=&quot;</xsl:text>
			<xsl:value-of select="$operator"/>
			<xsl:text disable-output-escaping="yes">&quot; style=&quot;width:30px; height:10px&quot; /&gt;</xsl:text>	             	
	    	        
	    	        <!-- </v:group> -->
	    	        <xsl:text disable-output-escaping="yes">&lt;/v:group&gt;</xsl:text>
	    	        
	    	        <xsl:for-each select="parent::*//ci | parent::*//cn">
	    	           <xsl:call-template name="displayElement"/>
	    	        </xsl:for-each>
	    </xsl:when>
	    
	    <!-- display like this a/b/c -->
	    <xsl:otherwise>
	       <xsl:for-each select="parent::*//ci | parent::*//cn">
	          <xsl:choose>
	             <!-- display element follow by operator eg. a+ -->
	             <xsl:when test="position()!=last()">
	                <xsl:call-template name="displayElement"/>
	             	<!-- display operator -->

	    	  	<!-- <v:rect filled="false" fillcolor="white"  stroke="true" strokecolor="white" style="height:6px; width:18px"> </v:rect> -->
	    		<xsl:text disable-output-escaping="yes">&lt;v:group style=&quot;position:relative; width:100px; height:200px&quot; coordorigin=&quot;0,0&quot; coordsize=&quot;100, 100&quot;&gt;</xsl:text>
			<xsl:text disable-output-escaping="yes">&lt;v:rect filled=&quot;false&quot; fillcolor=&quot;white&quot;  stroke=&quot;true&quot; strokecolor=&quot;white&quot; style=&quot;height:6px; width:18px&quot;&gt;</xsl:text>
			<xsl:text disable-output-escaping="yes">&lt;/v:rect&gt;</xsl:text>
			
			<!-- <v:shape type="#plus" style='width:30px; height:10px'/> -->
			<xsl:text disable-output-escaping="yes">&lt;v:shape type=&quot;</xsl:text>
			<xsl:value-of select="$operator"/>
			<xsl:text disable-output-escaping="yes">&quot; style=&quot;width:30px; height:10px&quot; /&gt;</xsl:text>	             	
	    	        
	    	        <!-- </v:group> -->
	    	        <xsl:text disable-output-escaping="yes">&lt;/v:group&gt;</xsl:text>

	             </xsl:when>
	             <!-- For the last element, display only the element eg. a -->
	             <xsl:otherwise>
	             	<xsl:call-template name="displayElement"/>
	             </xsl:otherwise>	              
	          </xsl:choose>
	       </xsl:for-each>
	    </xsl:otherwise>
	  </xsl:choose>
	  <BR/>
	  <BR/>
</xsl:template>


<!-- display divide symbol (/) in VML -->
<xsl:template name="displayDivide">
           <!-- output vml tag "v:shape type="#leftbracket" style='width:150px; height:150px'/></v:shape>" -->
	   
	   
	<!--
	   <v:group style="position:relative; width:100px; height:200px"
	       coordorigin="0,0" coordsize="100, 100">
	   
	   <v:rect filled="false" fillcolor="white"  stroke="true" strokecolor="white"
	           style="height:6px; width:18px">
	   </v:rect>
	   <v:shape type="#plus" style='width:30px; height:10px'/>
	   </v:group>
	-->
	<!--
	   <xsl:text disable-output-escaping="yes">&lt;v:group style=&quot;position:relative; width:100px; height:200px&quot; coordorigin=&quot;0,0&quot; coordsize=&quot;100, 100&quot;&gt;</xsl:text>
	   
	   <xsl:text disable-output-escaping="yes">&lt;v:rect filled=&quot;false&quot; fillcolor=&quot;white&quot;  stroke=&quot;true&quot; strokecolor=&quot;white&quot; style=&quot;height:6px; width:18px&quot;&gt;</xsl:text>
	   <xsl:text disable-output-escaping="yes">&lt;/v:rect&gt;</xsl:text>
	   <xsl:text disable-output-escaping="yes">&lt;v:shape type=&quot;#divide&quot; style=&quot;width:30px; height:10px&quot; /&gt;</xsl:text>
	   <xsl:text disable-output-escaping="yes">&lt;/v:group&gt;</xsl:text>
	
	--> 
	   
	   <xsl:text disable-output-escaping="yes">&lt;v:shape type=&quot;#divide&quot; style=&quot;width:50px; height:300px&quot; /&gt;</xsl:text>
</xsl:template>




<!-- display element in VML -->
<xsl:template name="displayElement">
 
     	    <xsl:call-template name="VMLshape-Attributes-open"/>
            <!-- The value of matrix's element -->
            <xsl:value-of select="."/>
            <xsl:call-template name="VMLshape-Attributes-close"/>
</xsl:template>




<!-- display divide symbol (+) in VML -->
<xsl:template name="displayPlus">

           <!-- output vml tag "v:shape type="#leftbracket" style='width:150px; height:150px'/></v:shape>" -->
	   <xsl:text disable-output-escaping="yes">&lt;v:shape type=&quot;#plus&quot; style=&quot;width:150px; height:150px&quot; /&gt;</xsl:text>
	  
</xsl:template>



<!-- Tag for viewing element in VML (tag to put before the element) -->
<xsl:template name="VMLshape-Attributes-open">

    <!-- vml code from <v:shape> open tag to the String content -->
    <!-- <v:shape style='width:60;height:70' path="m 200 500 l 600 500 e" fillcolor="black" title="ci" > -->
    <!-- <v:path textpathok="t"/>  -->
    <!-- <v:textpath on="t" style='position:absolute;font-family:"Courier New";monospace; font-style:"italic";' -->
    <!--   string=" -->


   	<!-- output and open vml tag "<" -->
    	<xsl:text disable-output-escaping="yes">&lt;</xsl:text>
    	<!-- output vml tag "v:shape type=" -->
        <xsl:text disable-output-escaping="yes">v:shape style=&quot;width:100;height:100&quot; path=&quot;m 200 500 l 600 500 e&quot; fillcolor=&quot;black&quot; title=&quot;mi&quot; &gt;</xsl:text>
        <xsl:text disable-output-escaping="yes">&lt;v:path textpathok=&quot;t&quot;/&gt;</xsl:text>
        <xsl:text disable-output-escaping="yes">&lt;v:textpath on=&quot;t&quot; style=&quot;position:absolute;font-family:&quot;Courier New&quot;;monospace; font-style:&quot;italic&quot;;&quot; string=&quot;</xsl:text>

</xsl:template>




<!-- Tag for viewing element in VML (tag to put after the element) -->
<xsl:template name="VMLshape-Attributes-close">
    
    <!-- vml code after the String content to the end of <v:shape> tag -->
    <!-- " /> -->
    <!-- </v:shape> -->

    <xsl:text disable-output-escaping="yes">&quot; /&gt;</xsl:text>
    <xsl:text disable-output-escaping="yes">&lt;/v:shape&gt;</xsl:text>
    
</xsl:template>








</xsl:stylesheet>