refactor(delete-items): Small code adjustments

yannbf · yannbf · commit 88bcd2c3110a · 2017-06-28T00:19:40.000-03:00
diff --git a/src/pages/list/delete-items/delete-items.html b/src/pages/list/delete-items/delete-items.html
@@ -15,8 +15,8 @@
       <ion-item>
         {{item.title}}
       </ion-item>
-      <ion-item-options icon-start (ionSwipe)="items.splice(i,1)">
-        <button color="danger" ion-button expandable (click)="items.splice(i,1)">
+      <ion-item-options icon-start (ionSwipe)="deleteItem(items, i)">
+        <button color="danger" ion-button expandable (click)="deleteItem(items, i)">
           <ion-icon name="trash"></ion-icon>
         </button>
       </ion-item-options>
@@ -31,8 +31,8 @@
       <ion-item #item>
         <ion-icon item-start color="danger" name="remove-circle" (click)="openOption(slidingItem, item, $event)"></ion-icon> {{thing.title}}
       </ion-item>
-      <ion-item-options icon-start (ionSwipe)="things.splice(i,1)">
-        <button color="danger" ion-button expandable (click)="things.splice(i,1)">
+      <ion-item-options icon-start (ionSwipe)="deleteItem(things, i)">
+        <button color="danger" ion-button expandable (click)="deleteItem(things, i)">
           <ion-icon name="trash"></ion-icon>
         </button>
       </ion-item-options>
diff --git a/src/pages/list/delete-items/delete-items.ts b/src/pages/list/delete-items/delete-items.ts
@@ -1,5 +1,5 @@
 import { Component } from '@angular/core';
-import { IonicPage, NavController, NavParams } from 'ionic-angular';
+import { IonicPage, NavController } from 'ionic-angular';
 import { Item, ItemSliding } from 'ionic-angular';
 
 @IonicPage()
@@ -8,7 +8,9 @@ import { Item, ItemSliding } from 'ionic-angular';
   templateUrl: 'delete-items.html',
 })
 export class DeleteItemsPage {
+
 	activeItemSliding: ItemSliding = null;
+
 	items = [
     {
       title: 'Item 1',
@@ -20,6 +22,7 @@ export class DeleteItemsPage {
       title: 'Item 3',
     },
   ]
+
   things = [
     {
       title: 'Thing 1',
@@ -31,38 +34,41 @@ export class DeleteItemsPage {
       title: 'Thing 3',
     },
   ]
-  constructor(public navCtrl: NavController, public navParams: NavParams) {
-  }
 
-  ionViewDidLoad() {
-    console.log('ionViewDidLoad DeleteItemsPage');
-  }
-  addThing(){
+  constructor(public navCtrl: NavController) { }
+
+  addThing() {
   	console.log('add thing');
-  	this.things.push({title: 'Thing ' + (+this.things.length+1)})
+  	this.things.push({ title: 'Thing ' + (this.things.length + 1) })
   }
-  addItem(){
+
+  addItem() {
   	console.log('add item');
-  	this.items.push({title: 'Item ' + (+this.items.length+1)})
+  	this.items.push({ title: 'Item ' + (this.items.length + 1) })
+  }
+
+  deleteItem(list, index) {
+    list.splice(index,1);
   }
+
 	openOption(itemSlide: ItemSliding, item: Item, event) {
 		console.log('opening item slide..');
 		event.stopPropagation(); //here if you want item to be tappable
-		if(this.activeItemSliding!==null){ //use this so that only one active sliding item allowed
+    if(this.activeItemSliding) { //use this so that only one active sliding item allowed
 			this.closeOption();
 		}
+
 		this.activeItemSliding = itemSlide;
-		let swipeAmount = 33; //set your required swipe amount
-		//to do, can we make this width calculated? 
-		console.log('swipe amount ', itemSlide);
-		// console shows itemSlide._optsWidthRightSide is calculated, but it's a private var
+		const swipeAmount = 33; //set your required swipe amount
 
+		console.log('swipe amount ', swipeAmount);
 		itemSlide.startSliding(swipeAmount);
 		itemSlide.moveSliding(swipeAmount);
 
+		itemSlide.setElementClass('active-slide', true);
 		itemSlide.setElementClass('active-options-right', true);
 		item.setElementStyle('transition', null);
-		item.setElementStyle('transform', 'translate3d(-'+swipeAmount+'px, 0px, 0px)');
+		item.setElementStyle('transform', 'translate3d(-' + swipeAmount + 'px, 0px, 0px)');
   }
 
 	closeOption() {
