<?xml version="1.0" encoding="ISO-8859-1" ?>

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
  <xsl:template match="/">
    <html>
      <head>
        <script type="text/javascript">
        <![CDATA[
            var imgExpand   = '#define x_width 16\n#define x_height 16\nstatic char x_bits[] = {\n0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xF8, 0x0F, 0x08, 0x08, 0x88, 0x08, 0x88, 0x08, 0xE8, 0x0B, 0x88, 0x08, 0x88, 0x08, 0x08, 0x08, 0xF8, 0x0F, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00};\n';
            var imgCollapse = '#define x_width 16\n#define x_height 16\nstatic char x_bits[] = {\n0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xF8, 0x0F, 0x08, 0x08, 0x08, 0x08, 0x08, 0x08, 0xE8, 0x0B, 0x08, 0x08, 0x08, 0x08, 0x08, 0x08, 0xF8, 0x0F, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00};\n';
            var imgNil      = '#define x_width 16\n#define x_height 16\nstatic char x_bits[] = {\n0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00};\n';
            var imgItem     = '#define x_width 16\n#define x_height 16\nstatic char x_bits[] = {\n0x00, 0x00, 0x00, 0x00, 0xF0, 0x00, 0x90, 0x00, 0x90, 0x00, 0x90, 0x00, 0x90, 0x00, 0x90, 0x00, 0x90, 0x00, 0x90, 0x1F, 0x10, 0x10, 0x10, 0x10, 0xF0, 0x1F, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00};\n';
            var imgTopic    = '#define x_width 16\n#define x_height 16\nstatic char x_bits[] = {\n0x00, 0x00, 0x00, 0x00, 0xF8, 0x1F, 0x08, 0x10, 0x08, 0x10, 0x78, 0x1E, 0x40, 0x02, 0x40, 0x02, 0x40, 0x02, 0x40, 0x02, 0x40, 0x02, 0x40, 0x02, 0x40, 0x02, 0xC0, 0x03, 0x00, 0x00, 0x00, 0x00};\n';

            function clickElement(SuperMemoElement, ID, Type) {
                if (SuperMemoElement.open == "false") {
                    expandNode(SuperMemoElement, ID, Type);
                }
                else {
                    collapseNode(SuperMemoElement, ID, Type);
                }
                window.event.cancelBubble = true;
            }

            function expandNode(SuperMemoElement, ID, Type) {
                if (Type == "Topic") {
                    PicName = "Pic" + ID;

                    document.images[PicName].src = 'javascript:imgCollapse';
                    document.images[PicName].alt = "Collapse";
                }

                for (i = 0; i < SuperMemoElement.childNodes.length; i++) {
                    if (SuperMemoElement.childNodes(i).tagName == "DIV") {
                        SuperMemoElement.childNodes(i).style.display = "block";
                    }
                }
                SuperMemoElement.open = "true";
            }

            function collapseNode(SuperMemoElement, ID, Type) {
                if (Type == "Topic") {
                    PicName = "Pic" + ID;

                    document.images[PicName].src = 'javascript:imgExpand';
                    document.images[PicName].alt = "Expand";
                }

                for (i = 0; i < SuperMemoElement.childNodes.length; i++) {
                    if (SuperMemoElement.childNodes(i).tagName == "DIV") {
                        SuperMemoElement.childNodes(i).style.display = "none";
                    }
                }
                SuperMemoElement.open = "false";
            }

            function expandLearningData(LearningDataID) {
                PicName = "Pic" + LearningDataID;

                document.images[PicName].src = 'javascript:imgCollapse';
                document.images[PicName].alt = "Collapse";
            }

            function collapseLearningData(LearningDataID) {
                PicName = "Pic" + LearningDataID;

                document.images[PicName].src = 'javascript:imgExpand';
                document.images[PicName].alt = "Expand";
            }

            function clickLearningData(LearningDataID) {
              LearningData = document.getElementById(LearningDataID).style;

              if (LearningData.display == "block") {
                collapseLearningData(LearningDataID);
                LearningData.display = "none";
              }
              else {
                expandLearningData(LearningDataID);
                LearningData.display = "block";
              }
            }
          ]]>
        </script>
      </head>
      <body>
        <xsl:apply-templates />
      </body>
    </html>
  </xsl:template>
  <xsl:template match="Count"></xsl:template>
  <xsl:template match="SuperMemoElement">
    <xsl:variable name="ID">
      <xsl:value-of select="ID" />
    </xsl:variable>
    <xsl:variable name="Type">
      <xsl:value-of select="Type" />
    </xsl:variable>
    <div id="{$ID}" onclick="window.event.cancelBubble = true; clickElement(this, '{$ID}', '{$Type}');">
      <xsl:attribute name="open">false</xsl:attribute>
      <xsl:attribute name="style">
        padding-left : 16px;
        <xsl:if test="count(ancestor-or-self::SuperMemoElement) > 1">
          display : none;
        </xsl:if>
      </xsl:attribute>
      <xsl:choose>
        <xsl:when test="Type = 'Topic'">
          <span><img alt="Expand" height="16" id="Pic{$ID}" src="javascript:imgExpand" width="16" /></span>
          <span><img alt="Topic" height="16" src="javascript:imgTopic" width="16" /></span>
          <span>
            <xsl:attribute name="Style">
              padding-left : 5px;
            </xsl:attribute>
              <xsl:value-of select="Title" />
          </span>
        </xsl:when>
        <xsl:otherwise>
          <table cellpadding="0" cellspacing="3">
            <tr>
              <td><img height="16" src="javascript:imgNil" width="16" /></td>
              <td><img alt="Item" height="16" src="javascript:imgItem" width="16" /></td>
              <td>
                <div>
                  <xsl:attribute name="style">
                    border : 1px solid #DFDFDF;
                  </xsl:attribute>
                    <table cellpadding="0" cellspacing="3">
                      <tr>
                        <td rowspan="4"></td>
                        <td>
                          <xsl:attribute name="style">
                            color     : green;
                            font-size : x-small;
                          </xsl:attribute>
                            Question
                        </td>
                      </tr>
                      <tr>
                        <td><xsl:value-of disable-output-escaping="yes" select="Content/Question" /></td>
                      </tr>
                      <tr>
                        <td>
                          <xsl:attribute name="style">
                            color     : green;
                            font-size : x-small;
                          </xsl:attribute>
                            Answer
                        </td>
                      </tr>
                      <tr>
                        <td><xsl:value-of disable-output-escaping="yes" select="Content/Answer" /></td>
                      </tr>
                      <xsl:if test="LearningData">
                        <tr>
                          <td><img alt="Expand" height="16" id="PicLearningData{$ID}" onclick="clickLearningData('LearningData{$ID}')" src="javascript:imgExpand" width="16" /></td>
                          <td onclick="clickLearningData('LearningData{$ID}')">
                            <xsl:attribute name="style">
                              color     : green;
                              font-size : x-small;
                            </xsl:attribute>
                              Learning data
                          </td>
                        </tr>
                        <tr>
                          <td></td>
                          <td>
                            <div id="LearningData{$ID}">
                              <xsl:attribute name="style">
                                display : none;
                              </xsl:attribute>
                                <table border="1" cellpadding="3" cellspacing="0">
                                  <tr>
                                    <th>Interval</th>
                                    <th>Reps</th>
                                    <th>Lapses</th>
                                    <th>Last Rep</th>
                                    <th>AF</th>
                                    <th>UF</th>
                                  </tr>
                                  <tr>
                                    <td>
                                      <xsl:attribute name="style">
                                        text-align : center;
                                      </xsl:attribute>
                                        <xsl:value-of disable-output-escaping="yes" select="LearningData/Interval" />
                                    </td>
                                    <td>
                                      <xsl:attribute name="style">
                                        text-align : center;
                                      </xsl:attribute>
                                        <xsl:value-of disable-output-escaping="yes" select="LearningData/Repetitions" />
                                    </td>
                                    <td>
                                      <xsl:attribute name="style">
                                        text-align : center;
                                      </xsl:attribute>
                                        <xsl:value-of disable-output-escaping="yes" select="LearningData/Lapses" />
                                    </td>
                                    <td>
                                      <xsl:attribute name="style">
                                        text-align : center;
                                      </xsl:attribute>
                                        <xsl:value-of disable-output-escaping="yes" select="LearningData/LastRepetition" />
                                    </td>
                                    <td>
                                      <xsl:attribute name="style">
                                        text-align : center;
                                      </xsl:attribute>
                                        <xsl:value-of disable-output-escaping="yes" select="LearningData/AFactor" />
                                    </td>
                                    <td>
                                      <xsl:attribute name="style">
                                        text-align : center;
                                      </xsl:attribute>
                                        <xsl:value-of disable-output-escaping="yes" select="LearningData/UFactor" />
                                    </td>
                                  </tr>
                                </table>
                            </div>
                          </td>
                        </tr>
                      </xsl:if>
                    </table>
                </div>
              </td>
            </tr>
          </table>
        </xsl:otherwise>
      </xsl:choose>
      <xsl:apply-templates select="SuperMemoElement" />
    </div>
  </xsl:template>
</xsl:stylesheet>