appy.gen: bugfix in group widget 'tabs'; improved layout of grid widgets in view mode; appy.pod: class OdtTable allows to generate HTML tables as well.

gen/ui/appy.css

@@ -65,7 +65,7 @@ img {border: 0;}
 .list { border: 1px solid grey; margin-bottom: 3px;}
 .list td, .list th { border: 1px solid grey;
                      padding-left: 5px; padding-right: 5px; padding-top: 3px;}
-.list th { background-color: #cbcbcb; font-style: italic; font-weight: normal;}
+.list th { background-color: #D4D4D4; font-style: italic; font-weight: normal;}
 .grid th { font-style: italic; font-weight: normal;
            border-bottom: 2px solid grey; padding: 2px 2px;}
 .grid td { padding-right: 5px; }

gen/ui/widgets/list.pt

@@ -18,10 +18,11 @@
 </tr>
 
 <tal:comment replace="nothing">The whole table, edit or view.</tal:comment>
-<table metal:define-macro="table" class="grid"
+<table metal:define-macro="table"
        tal:define="isEdit python: layoutType == 'edit'"
        tal:condition="python: isEdit or value"
-       tal:attributes="id python: 'list_%s' % name">
+       tal:attributes="id python: 'list_%s' % name;
+                       class python: isEdit and 'grid' or 'list'">
  <tal:comment replace="nothing">Header</tal:comment>
  <tr valign="bottom">
   <th tal:repeat="fieldInfo widget/fieldsd"
@@ -39,7 +40,7 @@
  <tal:templateRow define="rowIndex python:-1" condition="isEdit">
   <metal:call use-macro="app/ui/widgets/list/macros/row"/>
  </tal:templateRow>
- <tr height="7px"><td></td></tr>
+ <tr height="7px" tal:condition="isEdit"><td></td></tr>
  <tal:comment replace="nothing">Rows of data</tal:comment>
  <tal:rows define="rows python: inRequest and requestValue or value"
            repeat="row rows">

gen/ui/widgets/show.pt

@@ -108,8 +108,8 @@
                          id tagId; name tagId">
     <tal:comment replace="nothing">First row: the tabs.</tal:comment>
     <tr valign="middle"><td style="border-bottom: 1px solid #ff8040">
-      <table style="position:relative; bottom:-1px;">
+      <table style="position:relative; bottom:-2px;" cellpadding="0" cellspacing="0">
-        <tr valign="middle">
+        <tr valign="bottom">
           <tal:tab repeat="widgetRow widget/widgets">
           <tal:id define="tabId python:'tab_%s_%d_%d' % (widget['name'], repeat['widgetRow'].number(), len(widget['widgets']))">
           <td><img tal:attributes="src string: $appUrl/ui/tabLeft.png;

pod/parts.py

@@ -3,14 +3,17 @@ import cgi
 
 # ------------------------------------------------------------------------------
 class OdtTable:
-    '''This class allows to construct an ODT table programmatically.'''
+    '''This class allows to construct an ODT table programmatically. As ODT and
+       HTML are very similar, this class also allows to contruct an
+       HTML table.'''
     # Some namespace definitions
     tns = 'table:'
     txns = 'text:'
 
     def __init__(self, name, paraStyle, cellStyle, nbOfCols,
-                 paraHeaderStyle=None, cellHeaderStyle=None):
+                 paraHeaderStyle=None, cellHeaderStyle=None, html=False):
-        # An ODT table must have a name.
+        # An ODT table must have a name. In the case of an HTML table, p_name
+        # represents the CSS class for the whole table.
         self.name = name
         # The default style of every paragraph within cells
         self.paraStyle = paraStyle
@@ -24,6 +27,8 @@ class OdtTable:
         self.cellHeaderStyle = cellHeaderStyle or cellStyle
         # The buffer where the resulting table will be rendered
         self.res = ''
+        # Do we need to generate an HTML table instead of an ODT table ?
+        self.html = html
 
     def dumpCell(self, content, span=1, header=False,
                  paraStyle=None, cellStyle=None):
@@ -37,32 +42,55 @@ class OdtTable:
         if not cellStyle:
             if header: cellStyle = self.cellHeaderStyle
             else: cellStyle = self.cellStyle
-        self.res += '<%stable-cell %sstyle-name="%s" ' \
+        if not self.html:
-                    '%snumber-columns-spanned="%d">' % \
+            self.res += '<%stable-cell %sstyle-name="%s" ' \
-                    (self.tns, self.tns, cellStyle, self.tns, span)
+                        '%snumber-columns-spanned="%d">' % \
-        self.res += '<%sp %sstyle-name="%s">%s</%sp>' % \
+                        (self.tns, self.tns, cellStyle, self.tns, span)
-                    (self.txns, self.txns, paraStyle, cgi.escape(str(content)),
+            self.res += '<%sp %sstyle-name="%s">%s</%sp>' % \
-                     self.txns)
+                        (self.txns, self.txns, paraStyle,
-        self.res += '</%stable-cell>' % self.tns
+                         cgi.escape(str(content)), self.txns)
+            self.res += '</%stable-cell>' % self.tns
+        else:
+            tag = header and 'th' or 'td'
+            self.res += '<%s colspan="%d">%s</%s>' % \
+                        (tag, span, cgi.escape(str(content)), tag)
 
     def startRow(self):
-        self.res += '<%stable-row>' % self.tns
+        if not self.html:
+            self.res += '<%stable-row>' % self.tns
+        else:
+            self.res += '<tr>'
 
     def endRow(self):
-        self.res += '</%stable-row>' % self.tns
+        if not self.html:
+            self.res += '</%stable-row>' % self.tns
+        else:
+            self.res += '</tr>'
 
     def startTable(self):
-        self.res += '<%stable %sname="%s">' % (self.tns, self.tns, self.name)
+        if not self.html:
-        self.res += '<%stable-column %snumber-columns-repeated="%d"/>' % \
+            self.res += '<%stable %sname="%s">' % (self.tns, self.tns,
-                    (self.tns, self.tns, self.nbOfCols)
+                                                   self.name)
+            self.res += '<%stable-column %snumber-columns-repeated="%d"/>' % \
+                        (self.tns, self.tns, self.nbOfCols)
+        else:
+            css = ''
+            if self.name: css = ' class="%s"' % self.name
+            self.res += '<table%s cellpadding="0" cellspacing="0">' % css
 
     def endTable(self):
-        self.res += '</%stable>' % self.tns
+        if not self.html:
+            self.res += '</%stable>' % self.tns
+        else:
+            self.res += '</table>'
 
     def dumpFloat(self, number):
         return str(round(number, 2))
 
     def get(self):
         '''Returns the whole table.'''
-        return self.res.decode('utf-8')
+        if self.html:
+            return self.res
+        else:
+            return self.res.decode('utf-8')
 # ------------------------------------------------------------------------------