fixes #3307

public/src/admin/extend/plugins.js

@@ -181,28 +181,32 @@ define('admin/extend/plugins', function() {
 		socket.emit('admin.plugins.toggleInstall', {
 			id: pluginID,
 			version: version
-		}, function(err, status) {
+		}, function(err, pluginData) {
 			if (err) {
 				return app.alertError(err.message);
 			}
 
-			if (status.installed) {
+			var targetList = (pluginData.installed ? 'installed' : 'download'),
-				btn.html('<i class="fa fa-trash-o"></i> Uninstall');
+				otherList = (pluginData.installed ? 'download' : 'installed'),
-			} else {
+				payload = {};
-				btn.html('<i class="fa fa-download"></i> Install');
-			}
 
-			activateBtn.toggleClass('hidden', !status.installed);
+			payload[targetList] = pluginData;
+			templates.parse('admin/partials/' + targetList + '_plugin_item', payload, function(html) {
+				var pluginList = $('ul.' + targetList);
 
-			btn.toggleClass('btn-danger', status.installed)
+				pluginList.append(html);
-				.toggleClass('btn-success', !status.installed)
+				$('ul.' + otherList).find('li[data-plugin-id="' + pluginID + '"]').slideUp('slow', function() {
-				.attr('disabled', false)
+					$(this).remove();
-				.attr('data-installed', status.installed ? 1 : 0);
+					$('html,body').animate({
+						scrollTop: pluginList.find('li').last().offset().top - 48
+					}, 1000);
+				});
+			});
 
 			app.alert({
 				alert_id: 'plugin_toggled',
-				title: 'Plugin ' + (status.installed ? 'Installed' : 'Uninstalled'),
+				title: 'Plugin ' + (pluginData.installed ? 'Installed' : 'Uninstalled'),
-				message: status.installed ? 'Plugin successfully installed, please activate the plugin.' : 'The plugin has been successfully deactivated and uninstalled.',
+				message: pluginData.installed ? 'Plugin successfully installed, please activate the plugin.' : 'The plugin has been successfully deactivated and uninstalled.',
 				type: 'info',
 				timeout: 5000
 			});

src/plugins.js

@@ -164,27 +164,45 @@ var fs = require('fs'),
 		});
 	};
 
+	Plugins.get = function(id, callback) {
+		var url = (nconf.get('registry') || 'https://packages.nodebb.org') + '/api/v1/plugins/' + id;
+		console.log(url);
+
+		require('request')(url, {
+			json: true
+		}, function(err, res, body) {
+			Plugins.normalise([body.payload], function(err, normalised) {
+				return callback(err, !err ? normalised[0] : undefined);
+			});
+		});
+	};
+
 	Plugins.getAll = function(callback) {
 		var url = (nconf.get('registry') || 'https://packages.nodebb.org') + '/api/v1/plugins?version=' + require('../package.json').version;
 
-		require('request')(url, function(err, res, body) {
+		require('request')(url, {
+			json: true
+		}, function(err, res, body) {
 			var plugins = [];
 
-			try {
+			if (err) {
-				plugins = JSON.parse(body);
-			} catch(err) {
 				winston.error('Error parsing plugins : ' + err.message);
 				plugins = [];
 			}
 
+			Plugins.normalise(body, callback);
+		});
+	};
+
+	Plugins.normalise = function(apiReturn, callback) {
 		var pluginMap = {};
-			for(var i=0; i<plugins.length; ++i) {
+		for(var i=0; i<apiReturn.length; ++i) {
-				plugins[i].id = plugins[i].name;
+			apiReturn[i].id = apiReturn[i].name;
-				plugins[i].installed = false;
+			apiReturn[i].installed = false;
-				plugins[i].active = false;
+			apiReturn[i].active = false;
-				plugins[i].url = plugins[i].url ? plugins[i].url : plugins[i].repository ? plugins[i].repository.url : '';
+			apiReturn[i].url = apiReturn[i].url ? apiReturn[i].url : apiReturn[i].repository ? apiReturn[i].repository.url : '';
-				plugins[i].latest = plugins[i].latest;
+			apiReturn[i].latest = apiReturn[i].latest;
-				pluginMap[plugins[i].name] = plugins[i];
+			pluginMap[apiReturn[i].name] = apiReturn[i];
 		}
 
 		Plugins.showInstalled(function(err, installedPlugins) {
@@ -199,6 +217,8 @@ var fs = require('fs'),
 					pluginMap[plugin.id].installed = true;
 					pluginMap[plugin.id].error = true;
 					return next();
+				} else if (!pluginMap.hasOwnProperty(plugin.id)) {
+					return next();
 				}
 
 				pluginMap[plugin.id] = pluginMap[plugin.id] || {};
@@ -240,7 +260,6 @@ var fs = require('fs'),
 				callback(null, pluginArray);
 			});
 		});
-		});
 	};
 
 	Plugins.showInstalled = function(callback) {

src/plugins/install.js

@@ -96,8 +96,11 @@ module.exports = function(Plugins) {
 				if (err) {
 					return callback(err);
 				}
+
+				Plugins.get(id, function(err, pluginData) {
 					Plugins.fireHook('action:plugin.' + type, id);
-				callback(null, {id: id, installed: !installed});
+					callback(null, pluginData);
+				});
 			});
 		});
 	}

src/views/admin/extend/plugins.tpl

@@ -3,7 +3,7 @@
 		<div class="panel panel-default">
 			<div class="panel-heading"><i class="fa fa-code-fork"></i> Installed Plugins</div>
 			<div class="panel-body">
-				<ul>
+				<ul class="installed">
 					<!-- BEGIN installed -->
 					<!-- IMPORT admin/partials/installed_plugin_item.tpl -->
 					<!-- END installed -->
@@ -14,7 +14,7 @@
 		<div class="panel panel-default">
 			<div class="panel-heading"><i class="fa fa-code-fork"></i> Download Plugins</div>
 			<div class="panel-body">
-				<ul>
+				<ul class="download">
 					<!-- BEGIN download -->
 					<!-- IMPORT admin/partials/download_plugin_item.tpl -->
 					<!-- END download -->

src/views/admin/partials/download_plugin_item.tpl

@@ -1,4 +1,4 @@
-					<li data-plugin-id="{download.id}" class="clearfix">
+					<li id="{download.id}" data-plugin-id="{download.id}" class="clearfix">
 						<div class="pull-right">
 							<button data-action="toggleActive" class="btn btn-success hidden"><i class="fa fa-power-off"></i> Activate</button>
 							<button data-action="toggleInstall" data-installed="0" class="btn btn-success"><i class="fa fa-download"></i> Install</button>

src/views/admin/partials/installed_plugin_item.tpl

@@ -1,5 +1,5 @@
 					<!-- IF !installed.error -->
-					<li data-plugin-id="{installed.id}" data-version="{installed.version}" class="clearfix">
+					<li id="{installed.id}" data-plugin-id="{installed.id}" data-version="{installed.version}" class="clearfix">
 						<div class="pull-right">
 							<!-- IF installed.isTheme -->
 							<a href="{config.relative_path}/admin/appearance/themes" class="btn btn-info">Themes</a>