title: Semantic zoom with grouped items for the zoomed-out view in a Javascript Metro application
body: <p>I'm adding semantic zoom to my application and I'm having issues with the data binding in the zoomed out listview.
  In the normal (zoomed in) listview I'm binding grouped data and it renders fine. 
  For the zoomed out listview I would like to render the same grouped data (same itemDataSource and groupDataSource) , but with different itemTemplate and groupTemplate (the same as the normal view but smaller).</p>
  
  <p>The problem I'm having is that when I zoom out I get an error at ui.js line 2117 saying "0x800a138f - JavaScript runtime error: Object.defineProperty: argument is not an Object".</p>
  
  <p>I've tryed binding the zoomed out listview itemDataSource property to the groups.dataSource collection and not set the groupDataSource property (like all the examples I found on the web) and I works fine.</p>
  
  <p>Why is the zoomed out view not rendering grouped items like the normal view?</p>
  
  <p><strong>EDIT:</strong>
  Seems like the zoomed out view behaves in a different way than the normal (zoomed in) listview. While the zoomed in view accepts both itemDataSource and groupDataSource, the zoomed out view only accepts itemDataSource.
  I edited the <a href="http://code.msdn.microsoft.com/windowsapps/ListView-grouping-and-6d032cc1" rel="nofollow">Microsoft Official Semantic Zoom Sample</a> (scenario2.html) and changed the zoomedOutListView to use myGroupedList.dataSource as itemDataSource and the same issue arises.</p>
  
  <p>Code before:</p>
  
  <pre><code>        &lt;div id="zoomedOutListView"
              data-win-control="WinJS.UI.ListView"
              data-win-options="{ 
                  itemDataSource: myGroupedList.groups.dataSource, 
                  itemTemplate: semanticZoomTemplate, 
                  selectionMode: 'none', 
                  tapBehavior: 'invoke', 
                  swipeBehavior: 'none' 
              }"
          &gt;&lt;/div&gt;
  </code></pre>
  
  <p>Code after (which reproduces the issue):</p>
  
  <pre><code>            &lt;div id="zoomedOutListView"
              data-win-control="WinJS.UI.ListView"
              data-win-options="{ 
                  itemDataSource: myGroupedList.dataSource, //originally was myGroupedList.groups.dataSource
                  itemTemplate: semanticZoomTemplate, 
                  selectionMode: 'none', 
                  tapBehavior: 'invoke', 
                  swipeBehavior: 'none' 
              }"
          &gt;&lt;/div&gt;
  </code></pre>
  
  <p>Thanks.
  Diego</p>