Add list item type to directive

dist/js/ionic-angular.js

@@ -560,10 +560,10 @@ angular.module('ionic.ui.content', [])
 
 angular.module('ionic.ui.list', ['ngAnimate'])
 
-.directive('listItem', ['$timeout', function($timeout) {
+.directive('item', ['$timeout', function($timeout) {
   return {
     restrict: 'E',
-    require: ['?^list', '?^virtualList'],
+    require: ['?^list'],
     replace: true,
     transclude: true,
     scope: {
@@ -574,8 +574,9 @@ angular.module('ionic.ui.list', ['ngAnimate'])
       canReorder: '@',
       canSwipe: '@',
       buttons: '=',
+      type: '@'
     },
-    template: '<a href="#" class="item item-slider">\
+    template: '<a href="#" class="item">\
             <div class="item-edit" ng-if="canDelete && isEditing">\
               <button class="button button-icon" ng-click="onDelete()"><i ng-class="deleteIcon"></i></button>\
             </div>\
@@ -589,20 +590,6 @@ angular.module('ionic.ui.list', ['ngAnimate'])
            </div>\
           </a>',
 
-    /*
-    template:   '<li class="list-item">\
-                   <div class="list-item-edit" ng-if="canDelete && isEditing">\
-                     <button class="button button-icon" ng-click="onDelete()"><i ng-class="deleteIcon"></i></button>\
-                   </div>\
-                   <div class="list-item-content" ng-transclude>\
-                   </div>\
-                   <div class="list-item-drag" ng-if="canReorder && isEditing">\
-                     <button data-ionic-action="reorder" class="button button-icon"><i ng-class="reorderIcon"></i></button>\
-                   </div>\
-                   <div class="list-item-buttons" ng-if="canSwipe && !isEditing">\
-                     <button ng-click="buttonClicked(button)" class="button" ng-class="button.type" ng-repeat="button in buttons">{{button.text}}</button>\
-                   </div>\
-                </li>',*/
     link: function($scope, $element, $attr, list) {
       // Grab the parent list controller
       if(list[0]) {
@@ -611,6 +598,13 @@ angular.module('ionic.ui.list', ['ngAnimate'])
         list = list[1];
       }
 
+      // Add the list item type class
+      $element.addClass($attr.type || 'item-slider');
+
+      if($attr.type !== 'item-slider') {
+        $scope.canSwipe = false;
+      }
+
       $scope.isEditing = false;
       $scope.deleteIcon = list.scope.deleteIcon;
       $scope.reorderIcon = list.scope.reorderIcon;

js/ext/angular/src/directive/ionicList.js

@@ -3,10 +3,10 @@
 
 angular.module('ionic.ui.list', ['ngAnimate'])
 
-.directive('listItem', ['$timeout', function($timeout) {
+.directive('item', ['$timeout', function($timeout) {
   return {
     restrict: 'E',
-    require: ['?^list', '?^virtualList'],
+    require: ['?^list'],
     replace: true,
     transclude: true,
     scope: {
@@ -17,8 +17,9 @@ angular.module('ionic.ui.list', ['ngAnimate'])
       canReorder: '@',
       canSwipe: '@',
       buttons: '=',
+      type: '@'
     },
-    template: '<a href="#" class="item item-slider">\
+    template: '<a href="#" class="item">\
             <div class="item-edit" ng-if="canDelete && isEditing">\
               <button class="button button-icon" ng-click="onDelete()"><i ng-class="deleteIcon"></i></button>\
             </div>\
@@ -32,20 +33,6 @@ angular.module('ionic.ui.list', ['ngAnimate'])
            </div>\
           </a>',
 
-    /*
-    template:   '<li class="list-item">\
-                   <div class="list-item-edit" ng-if="canDelete && isEditing">\
-                     <button class="button button-icon" ng-click="onDelete()"><i ng-class="deleteIcon"></i></button>\
-                   </div>\
-                   <div class="list-item-content" ng-transclude>\
-                   </div>\
-                   <div class="list-item-drag" ng-if="canReorder && isEditing">\
-                     <button data-ionic-action="reorder" class="button button-icon"><i ng-class="reorderIcon"></i></button>\
-                   </div>\
-                   <div class="list-item-buttons" ng-if="canSwipe && !isEditing">\
-                     <button ng-click="buttonClicked(button)" class="button" ng-class="button.type" ng-repeat="button in buttons">{{button.text}}</button>\
-                   </div>\
-                </li>',*/
     link: function($scope, $element, $attr, list) {
       // Grab the parent list controller
       if(list[0]) {
@@ -54,6 +41,13 @@ angular.module('ionic.ui.list', ['ngAnimate'])
         list = list[1];
       }
 
+      // Add the list item type class
+      $element.addClass($attr.type || 'item-slider');
+
+      if($attr.type !== 'item-slider') {
+        $scope.canSwipe = false;
+      }
+
       $scope.isEditing = false;
       $scope.deleteIcon = list.scope.deleteIcon;
       $scope.reorderIcon = list.scope.reorderIcon;

js/ext/angular/test/list.html

@@ -67,16 +67,18 @@
       <list is-editing="isEditingItems" on-refresh-holding="almostRefreshing()" on-refresh-opening="almostRefreshProjects(ratio)" on-refresh="refreshProjects()" animation="my-repeat-animation" delete-icon="icon ion-minus-circled" reorder-icon="icon ion-navicon">
         <list-refresher>
         </list-refresher>
-        <list-item ng-repeat="item in items" 
+        <item 
+            ng-repeat="item in items" 
             buttons="item.buttons"
             can-delete="true"
             can-reorder="true"
             can-swipe="true"
            on-delete="deleteProject(project)"
            on-select="selectProject(project)">
+           <i class="icon ion-email ion-primary"></i>
           {{item.text}}
           <i class="{{item.icon}}"></i>
-        </list-item>
+        </item>
       </list>
       <button ng-click="edit()" class="button button-success">Edit</button>
     </div>

js/ext/angular/test/tabs.html

@@ -60,7 +60,7 @@
           <h1 class="title">Tasks</h1>
           <button class="button button-clear button-primary" ng-click="isEditingItems = !isEditingItems">Edit</button>
         </header>
-        <content has-header="true" has-tabs="true" scroll="false">
+        <content has-header="true" has-footer="true" scroll="false">
           <list on-refresh="onRefresh()" is-editing="isEditingItems" animation="fade-out" delete-icon="icon ion-minus-circled" reorder-icon="icon ion-navicon">
             <refresher>
               <div id="refresh-content">
@@ -68,7 +68,7 @@
                 <i class="icon ion-ios7-reloading"></i>
               </div>
             </refresher>
-            <list-item ng-repeat="item in items" 
+            <item ng-repeat="item in items" 
             item="item"
             buttons="item.buttons"
             can-delete="true"

test/lists.html

@@ -21,7 +21,7 @@
     </header>
 
     <div id="list">
-    <main id="content" class="scroll">
+    <main id="content" class="content overflow-scroll">
 
       <div class="list">
 
@@ -500,6 +500,8 @@
 
         return false;
       }); 
+
+    
     </script>
 
   </body>