widgets/grid/virtualgrid-auto.html

   1 <html>
   2         <head></head>
   3         <body>
   4                 <div id="virtualgrid_grid_page" data-role="page" class="virtualgrid_test_demo_page">
   5                         <div data-role="header" data-position="fixed">
   6                                 <h1>Virtual Grid - Auto</h1>
   7                         </div>
   8                         <div data-role="content" data-scroll="none">
   9                                 <script id="tizen-demo-namecard" type="text/x-jquery-tmpl">
  10                                         <div class="ui-demo-rotation-namecard">
  11                                                 <div class="ui-demo-namecard-pic">
  12                                                         <img class="ui-demo-namecard-pic-img" src="${TEAM_LOGO}"  />
  13                                                 </div>
  14                                                 <div class="ui-demo-namecard-contents">
  15                                                         <span class="name ui-li-text-main">${NAME}</span>
  16                                                 </div>
  17                                         </div>
  18                                 </script>
  19                                 <div id="virtualgrid-demo" data-role="virtualgrid" data-direction="y" data-rotation="false" data-template="tizen-demo-namecard">
  20                                 </div>
  21                         </div>
  22                         <script>
  23                                 $( ".virtualgrid_test_demo_page" ).one( "pagecreate", function() {
  24                                         $.getScript( "./js/virtualgrid-db-demo.js", function( data, textStatus ) {
  25                                                 $( ":jqmData(role='virtualgrid')" ).virtualgrid( "create", {
  26                                                         itemData: function ( idx ) {
  27                                                                 return JSON_DATA[ idx ];
  28                                                         },
  29                                                         numItemData: JSON_DATA.length,
  30                                                         cacheItemData: function ( minIdx, maxIdx ) {
  31                                                         }
  32                                                 });
  33                                         });
  34                                 });
  35                         </script>
  36                 </div>
  37         </body>
  38 </html>