From 26700fbe766e06c3b953ee9ebae3f51ff1a08968 Mon Sep 17 00:00:00 2001
From: Rohit Yadav <rohit.yadav@shapeblue.com>
Date: Tue, 25 Aug 2015 11:29:21 +0530
Subject: [PATCH] CLOUDSTACK-8766: Fix infinite scrolling pagination for zonal
 template listing

Uses listViewDataProvider to implement pagination for listing templates and ISOs
in the zones tab. Dedupes isos and templates in the list views.

This closes #739

Signed-off-by: Rohit Yadav <rohit.yadav@shapeblue.com>
---
 ui/scripts/templates.js | 72 +++++++++++++++++++++++++----------------
 1 file changed, 44 insertions(+), 28 deletions(-)

diff --git a/ui/scripts/templates.js b/ui/scripts/templates.js
index f0b8103afef..ffad8e28402 100644
--- a/ui/scripts/templates.js
+++ b/ui/scripts/templates.js
@@ -15,8 +15,10 @@
 // specific language governing permissions and limitations
 // under the License.
 (function(cloudStack, $) {
-	var ostypeObjs;
-	
+    var ostypeObjs;
+    var previousCollection = [];
+    var previousFilterType = null;
+
     cloudStack.sections.templates = {
         title: 'label.menu.templates',
         id: 'templates',
@@ -588,6 +590,10 @@
                         var ignoreProject = false;
                         if (args.filterBy != null) { //filter dropdown
                             if (args.filterBy.kind != null) {
+                                if (previousFilterType != args.filterBy.kind || args.page == 1) {
+                                    previousFilterType = args.filterBy.kind;
+                                    previousCollection = [];
+                                }
                                 switch (args.filterBy.kind) {
                                     case "all":
                                         ignoreProject = true;
@@ -631,19 +637,19 @@
                                 var itemsView = [];
 								
                                 $(items).each(function(index, item) {
-                                    var existing = $.grep(itemsView, function(it){
+                                    var existing = $.grep(previousCollection, function(it){
                                         return it != null && it.id !=null && it.id == item.id;
                                     });
-								
-                                    if (existing.length == 0) {
-                                        itemsView.push($.extend(item, {                                            
+
+                                    if (existing.length > 0) {
+                                        return true; // skip adding this entry
+                                    } else {
+                                        var templateItem = $.extend(item, {
                                             zones: item.zonename,
                                             zoneids: [item.zoneid]
-                                        }));
-                                    }
-                                    else {
-                                        existing[0].zones = 'label.multiplezones';
-                                        existing[0].zoneids.push(item.zoneid);
+                                        });
+                                        itemsView.push(templateItem);
+                                        previousCollection.push(templateItem);
                                     }
                                 });								
 
@@ -1080,12 +1086,13 @@
 
 
                                     dataProvider: function(args) {  // UI > Templates menu (listing) > select a template from listing > Details tab > Zones tab (listing) 
-                                    	$.ajax({
+                                        var data = { templatefilter: "self",
+                                                     id: args.context.templates[0].id
+                                                   };
+                                        listViewDataProvider(args, data);
+                                        $.ajax({
                                             url: createURL("listTemplates"),
-                                            data: {
-                                            	templatefilter: "self",
-                                            	id: args.context.templates[0].id
-                                            },
+                                            data: data,
                                             success: function(json) {
                                             	var jsonObjs = json.listtemplatesresponse.template;
                                             	                                            	
@@ -1724,6 +1731,10 @@
                         var ignoreProject = false;
                         if (args.filterBy != null) { //filter dropdown
                             if (args.filterBy.kind != null) {
+                                if (previousFilterType != args.filterBy.kind || args.page == 1) {
+                                    previousFilterType = args.filterBy.kind;
+                                    previousCollection = [];
+                                }
                                 switch (args.filterBy.kind) {
                                     case "all":
                                         ignoreProject = true;
@@ -1767,22 +1778,24 @@
 
                                 var itemsView = [];
                                 $(items).each(function(index, item) {
-                                    var existing = $.grep(itemsView, function(it){
+                                    var existing = $.grep(previousCollection, function(it){
                                         return it != null && it.id !=null && it.id == item.id;
                                     });
-                                    if (existing.length == 0) {
-                                        itemsView.push({
+
+
+                                    if (existing.length > 0) {
+                                        return true; // skip adding this entry
+                                    } else {
+                                        var isoItem = {
                                             id: item.id,
                                             name: item.name,
                                             description: item.description,
                                             ostypeid: item.ostypeid,
                                             zones: item.zonename,
                                             zoneids: [item.zoneid]
-                                        });
-                                    }
-                                    else {
-                                        existing[0].zones = 'Multiple Zones';
-                                        existing[0].zoneids.push(item.zoneid);
+                                        };
+                                        itemsView.push(isoItem);
+                                        previousCollection.push(isoItem);
                                     }
                                 }
 );
@@ -2081,11 +2094,14 @@
                                     hideSearchBar: true,
 
                                     dataProvider: function(args) {
-                                                var jsonObj = args.context.isos[0];
-                                                var apiCmd = "listIsos&isofilter=self&id=" + jsonObj.id;
-
+                                                var data = {
+                                                    isofilter: 'self',
+                                                    id: args.context.isos[0].id
+                                                };
+                                                listViewDataProvider(args, data);
                                                 $.ajax({
-                                                    url: createURL(apiCmd),
+                                                    url: createURL('listIsos'),
+                                                    data: data,
                                                     dataType: "json",
                                                     success: function(json) {
                                                             var isos = json.listisosresponse.iso;