Merge branch 'master' of ssh://git.indexdata.com/home/git/private/mkws

diff --git a/examples/htdocs/mkws-widget-credo.css b/examples/htdocs/mkws-widget-credo.css
index 4cb10cb..e96c16a 100644 (file)
--- a/examples/htdocs/mkws-widget-credo.css
+++ b/examples/htdocs/mkws-widget-credo.css
@@ -1,3 +1,46 @@
 .mkwsCredo {
     font-family: Gill Sans, "Gillius ADF", Gillius, GilliusADF, Verdana, Sans-Serif;
 }
+
+.mkwsCredo table {
+    width: 90%;
+    border-collapse: collapse;
+}
+
+.mkwsCredo table tr.front {
+    background: #ddf3c3;
+}
+
+.mkwsCredo table tr:first-child td:first-child {
+    width: 70%;
+}
+
+.mkwsCredo table tr:first-child .section {
+    margin: 10px;
+    border: 1px solid #c0c0c0;
+}
+
+.mkwsCredo table tr {
+    vertical-align: top;
+}
+
+.mkwsCredo .front div.title {
+    font-size: 150%;
+    font-weight: bold;
+    color: white;
+    background: #666699;
+    padding: 0.25em 0.5em;
+}
+
+.mkwsCredo div.title {
+    font-size: 150%;
+    font-weight: bold;
+    color: #666699;
+    background: #ddf3c3;
+    padding: 0.25em 0.5em;
+}
+
+.mkwsCredo div.content {
+    background: white;
+    padding: 0.5em 1em;
+}

diff --git a/examples/htdocs/mkws-widget-credo.js b/examples/htdocs/mkws-widget-credo.js
index 7ea0169..2bb1b1a 100644 (file)
--- a/examples/htdocs/mkws-widget-credo.js
+++ b/examples/htdocs/mkws-widget-credo.js
@@ -1,51 +1,59 @@
 mkws.registerWidgetType('Credo', function() {
-  s = []
+  var that = this;
+  var s = []
   s.push('<table>');
 
   // Main panel: encylopaedia and images on the left, topics on the right
-  s.push('<tr>');
+  s.push('<tr class="front">');
 
   s.push('<td class="main">');
-
-  s.push('<div class="encyclopaedia">');
-  s.push('<div class="title">Topic Page: ### title</div>');
-  s.push(this.subwidget('Reference'));
-  s.push('</div>');
-
-  s.push('<div class="images">');
-  s.push('<div class="title">Images</div>');
-  s.push(this.subwidget('Images', { /* ### config */ } ));
-  s.push('</div>');
-
+  s.push(section('encyclopaedia', 'Topic Page: ### title',
+                 this.subwidget('Reference')));
+  s.push(section('image', 'Images',
+                 this.subwidget('Images', { /* ### config */ })));
   s.push('</td>');
 
   s.push('<td class="side">');
-
-  s.push('<div class="mindmap">');
-  s.push('<div class="title">Create a Mind Map for ### title</div>');
-  // ### Is there a way to make a mind-map?
-  s.push('</div>');
-
-  s.push('<div class="topics">');
-  s.push('<div class="title">Related Topics</div>');
-  s.push(this.subwidget('Facet', { facet: 'subject' }));
-  s.push('</div>');
-
+  s.push(section('mindmap', 'Create a Mind Map for ### title',
+                 '### Is there a way to make a mind-map?'));
+  s.push(section('topics', 'Related Topics',
+                 this.subwidget('Facet', { facet: 'subject' })));
   s.push('</td>');
 
   s.push('</tr>');
 
-  s.push('<tr>');
-  s.push('</td>');
-  s.push('<div class="entries">');
-  s.push('<div class="title">Credo Entries</div>');
-  s.push(this.subwidget('Records', { /* ### config */ }));
-  s.push('</div>');
-  s.push('</td>');
-  s.push('</tr>');
+  s.push(sectionRow('entries', 'Credo Entries',
+                    this.subwidget('Records', { /* ### config */ })));
+  s.push(sectionRow('articles', 'Articles',
+                    this.subwidget('Records', { /* ### config */ })));
+  s.push(sectionRow('books', 'Books',
+                    this.subwidget('Records', { /* ### config */ })));
+  s.push(sectionRow('news', 'News',
+                    this.subwidget('Records', { /* ### config */ })));
+  s.push(sectionRow('resources', 'Suggested Resources',
+                    this.subwidget('Records', { /* ### config */ })));
 
-  // More TRs for Articles, Books, News, Suggested Resources
   s.push('</table>');
 
   this.node.html(s.join(''));
+
+
+  function section(xclass, title, content) {
+    var s = [];
+    s.push('<div class="' + xclass + ' section">');
+    s.push('<div class="title">' + title + '</div>');
+    s.push('<div class="content">' + content + '</div>');
+    s.push('</div>');
+    return s.join('');
+  }
+
+  function sectionRow(xclass, title, content) {
+    var s = [];
+    s.push('<tr>');
+    s.push('<td colspan="2">');
+    s.push(section(xclass, title, content));
+    s.push('</td>');
+    s.push('</tr>');
+    return s.join('');
+  }
 });

diff --git a/examples/htdocs/table.html b/examples/htdocs/table.html
new file mode 100644 (file)
index 0000000..2f1c31c
--- /dev/null
+++ b/examples/htdocs/table.html
@@ -0,0 +1,24 @@
+<html>
+  <head>
+    <style type="text/css">
+      body  { background: white }
+      table { background: pink;   margin: 20px;  border: 5px solid red; padding: 10px; }
+      tr    { background: green;  margin: 200px; border: 5px solid red; padding: 100px; }
+      td    { background: yellow; margin: 200px; border: 5px solid red; padding: 10px; }
+      p     { background: cyan;   margin: 20px;  border: 5px solid red; padding: 10px; }
+    </style>
+  </head>
+  <body>
+    <table>
+      <tr>
+       <td><div>Top left</div></td>
+       <td><div>Top right</div></td>
+      </tr>
+      <tr>
+       <td><div>Bottom left</div></td>
+       <td><div>Bottom right</div></td>
+      </tr>
+    </table>
+    <p>This is a paragraph</p>
+  </body>
+</html>

diff --git a/src/mkws-widget.js b/src/mkws-widget.js
index 1fbd813..c92789a 100644 (file)
--- a/src/mkws-widget.js
+++ b/src/mkws-widget.js
@@ -28,8 +28,10 @@ function widget($, team, type, node) {
 
   // Returns the HTML of a subwidget of the specified type. It gets
   // the same attributes at the parent widget that invokes this
-  // function, except where overrides are passed in.
-  that.subwidget = function(type, overrides) {
+  // function, except where overrides are passed in. If defaults are
+  // also provided, then these are used when the parent widget
+  // provides no values.
+  that.subwidget = function(type, overrides, defaults) {
     var attrs = {};
     
     // Copy locally-set properties from the parent widget
@@ -45,6 +47,15 @@ function widget($, team, type, node) {
       log(this + " overrode property " + name + "='" + attrs[name] + "' for " + type + " subwidget");
     }
 
+    if (defaults) {
+      for (var name in defaults) {
+        if (!attrs[name]) {
+          attrs[name] = defaults[name];
+          log(this + " fell back to default property " + name + "='" + attrs[name] + "' for " + type + " subwidget");
+        }
+      }
+    }
+
     var s = [];
     s.push('<div class="mkws', type, ' mkwsTeam_', team.name(), '"');
     for (var name in attrs) {