demos/tizen-winsets/widgets/list/list-swipe.html

   1 <div data-role="page" id="genlist-swipe" data-add-back-btn="true">
   2         <script type="text/javascript">
   3                 var openSwipe = function() {
   4                         $("#sw").swipe("open");
   5                 }
   6                 var closeSwipe = function() {
   7                         $("#sw").swipe("close");
   8                 }
   9
  10                 $("#covertest").bind("animationstart", function (ev) {
  11                         console.log("Swipe cover's animation is start.");
  12                 });
  13
  14                 $("#covertest").bind("animationend", function (ev) {
  15                         console.log("Swipe cover's animation is complete.");
  16                 });
  17
  18
  19         </script>
  20         <div data-role="header" data-position="fixed">
  21                 <h1>Swipe lists</h1>
  22         </div>
  23         <div class="content" data-role="content">
  24                 <ul data-role="listview">
  25                                 <li data-role="swipe">
  26                                         <div data-role="swipe-item-cover">
  27                                                 Swipe
  28                                         </div>
  29                                         <div data-role="swipe-item">
  30                                                 <div data-role="button" data-inline="true">Twitter</div>
  31                                                 <div data-role="button" data-inline="true">Facebook</div>
  32                                         </div>
  33                                 </li>
  34                                 <li data-role="swipe">
  35                                         <div data-role="swipe-item-cover">
  36                                                 Swipe
  37                                         </div>
  38                                         <div data-role="swipe-item">
  39                                                 <div data-role="button" data-inline="true">Twitter</div>
  40                                                 <div data-role="button" data-inline="true">Facebook</div>
  41                                         </div>
  42                                 </li>
  43                                 <li data-role="swipe">
  44                                         <div data-role="swipe-item-cover">
  45                                                 Swipe
  46                                         </div>
  47                                         <div data-role="swipe-item">
  48                                                 <div data-role="button" data-inline="true">Twitter</div>
  49                                                 <div data-role="button" data-inline="true">Facebook</div>
  50                                         </div>
  51                                 </li>
  52                                 <li data-role="swipe">
  53                                         <div data-role="swipe-item-cover">
  54                                                 Swipe
  55                                         </div>
  56                                         <div data-role="swipe-item">
  57                                                 <div data-role="button" data-inline="true">Twitter</div>
  58                                                 <div data-role="button" data-inline="true">Facebook</div>
  59                                         </div>
  60                                 </li>
  61                                 <li data-role="swipe">
  62                                         <div data-role="swipe-item-cover">
  63                                                 Swipe
  64                                         </div>
  65                                         <div data-role="swipe-item">
  66                                                 <div data-role="button" data-inline="true">Twitter</div>
  67                                                 <div data-role="button" data-inline="true">Facebook</div>
  68                                         </div>
  69                                 </li>
  70                                 <li data-role="swipe">
  71                                         <div data-role="swipe-item-cover">
  72                                                 Swipe
  73                                         </div>
  74                                         <div data-role="swipe-item">
  75                                                 <div data-role="button" data-inline="true">Twitter</div>
  76                                                 <div data-role="button" data-inline="true">Facebook</div>
  77                                         </div>
  78                                 </li>
  79                                 <li data-role="swipe">
  80                                         <div data-role="swipe-item-cover">
  81                                                 Swipe
  82                                         </div>
  83                                         <div data-role="swipe-item">
  84                                                 <div data-role="button" data-inline="true">Twitter</div>
  85                                                 <div data-role="button" data-inline="true">Facebook</div>
  86                                         </div>
  87                                 </li>
  88                                 <li data-role="swipe">
  89                                         <div data-role="swipe-item-cover">
  90                                                 Swipe
  91                                         </div>
  92                                         <div data-role="swipe-item">
  93                                                 <div data-role="button" data-inline="true">Twitter</div>
  94                                                 <div data-role="button" data-inline="true">Facebook</div>
  95                                         </div>
  96                                 </li>
  97                                 <li>
  98                                         Test API:
  99                                         <div data-role="button" data-inline="true" onclick="openSwipe()">
 100                                                 Open
 101                                         </div>
 102                                         <div data-role="button" data-inline="true" onclick="closeSwipe()">
 103                                                 Close
 104                                         </div>
 105                                 </li>
 106                                 <li data-role="swipe" id="sw">
 107                                         <div data-role="swipe-item-cover" id="covertest">
 108                                                 Test API - Swipe2
 109                                         </div>
 110                                         <div data-role="swipe-item" >
 111                                                 <div data-role="button" data-inline="true">Twitter</div>
 112                                                 <div data-role="button" data-inline="true">Facebook</div>
 113                                         </div>
 114                                 </li>
 115                 </ul>
 116         </div>
 117         <div data-role="footer">
 118         </div>
 119 </div>