Change plugin page to work with multiple versions, and more

micro_files/plugin-search.js

@@ -61,7 +61,69 @@ function showResults(results, collapsed) {
     if (!collapsed) {
         collapseStr += " in";
     }
+
+ 		function separate_with_commas(tar_array) {
+ 			let results = "";
+ 			// Break apart tags with a comma and space
+ 			for (let i = 0; i < tar_array.length; i++) {
+ 				results += tar_array[i];
+ 				if ((i + 1) < tar_array.length) {
+ 					results += ', ';
+ 				}
+ 			}
+ 			return results;
+ 		}
+
     results.forEach(function (item) {
-        table.innerHTML += '<div class="panel panel-default">\n        <div class="panel-heading" role="tab" id="h-' + item.Name + '">\n          <h4 class="panel-title">\n            <a role="button" data-toggle="collapse" data-parent="#results"\n              href="#c-' + item.Name + '" aria-controls="c-' + item.Name + '">\n              ' + item.Name + ' ' + item.Versions[0].Version + '\n            </a>\n          </h4>\n        </div>\n        <div id="c-' + item.Name + '" class="' + collapseStr + '" role="tabpanel" aria-labelledby="h-' + item.Name + '">\n          <div class="panel-body">\n            <p>' + item.Description + '</p>\n            <p><span class="glyphicon glyphicon-tags" aria-hidden="true"></span> ' + item.Tags.toString() + '<p>\n            <p><b>Require : </b>' + JSON.stringify(item.Versions[0].Require) + '</p>\n            <p>To install this plugin, open micro from your CLI,\n            press [Crtl + E] then run the command line below.\n            Once you are done, restart micro.</p>\n            <div class="well">&gt; plugin install ' + item.Name + '</div>\n          </div>\n        </div>\n      </div>';
+			// The displayed tag(s)
+			let display_item_tag = separate_with_commas(item.Tags);
+			// The displayed version(s)
+			let display_item_allversions = '<p><b>Available versions: </b>';
+			// The displayed require(s) list/version(s)
+			let display_item_require = '';
+			let current_requires = [];
+			let requires_len = 0;
+
+			// Handle  multiple versions in repo.json
+			for (let i = 0; i < item.Versions.length; i++) {
+				// Create a string of all versions other than the newest one
+				// Append the versions into a string
+				display_item_allversions += item.Versions[i].Version;
+				// Save the len so we don't have to recalculate
+				requires_len = Object.keys(item.Versions[i].Require).length;
+				// Go through each Require obj, turning them to strings, and separate multiples with commas
+				for (let x = 0; x < requires_len; x++) {
+					// Gets an array of the object's key and value
+					current_requires[x] = Object.entries(item.Versions[i].Require)[x];
+					// Because of how Micro's repo.json is formatted, there's no space between the [<>=] and the version
+					// This adds a space to be more visually appealing
+					current_requires[x][1] = current_requires[x][1].match(RegExp('[<>=]+', 'g')) + ' ' + current_requires[x][1].match(RegExp('[^<>=]+', 'g'));
+					// NOTE: I believe the require tag will always be 2 values per object - the requirement & the value
+					// If that's not right, this'll need to be changed
+					current_requires[x] = current_requires[x][0] + ' ' + current_requires[x][1];
+					// Instead of running separate_with_commas, do it here to avoid another needless loop
+					if ((x + 1) < requires_len) {
+						current_requires[x] += ', ';
+					}
+				}
+				// Append the requires into a string
+				display_item_require += '</p>\n            <p><b>' + item.Versions[i].Version + ' requires : </b>' + current_requires;
+				// If not on the last version, add a comma
+				if ((i + 1) < item.Versions.length) {
+					display_item_allversions += ', ';
+					// Linebreak so we display them below eachother
+					display_item_require += '\n';
+				}
+			}
+
+			// If there's only a single version, don't show the "All versions: " thing
+			if (item.Versions.length == 1) {
+				display_item_allversions = '';
+			} else {
+				// If there are multiple, we close off the paragraph tag we opened in the declaration
+				display_item_allversions += '</p>';
+			}
+
+        table.innerHTML += '<div class="panel panel-default">\n        <div class="panel-heading" role="tab" id="h-' + item.Name + '">\n          <h4 class="panel-title">\n            <a role="button" data-toggle="collapse" data-parent="#results"\n              href="#c-' + item.Name + '" aria-controls="c-' + item.Name + '">\n              ' + item.Name + ' ' + item.Versions[item.Versions.length - 1].Version + '\n            </a>\n          </h4>\n        </div>\n        <div id="c-' + item.Name + '" class="' + collapseStr + '" role="tabpanel" aria-labelledby="h-' + item.Name + '">\n          <div class="panel-body">\n            <p>' + item.Description + '</p>\n            <p><span class="glyphicon glyphicon-tags" aria-hidden="true"></span> ' + display_item_tag + display_item_allversions + display_item_require + '</p>\n            <p>To install this plugin, open micro from your CLI,\n            press [Crtl + E] then run the command line below.\n            Once you are done, restart micro.</p>\n            <div class="well">&gt; plugin install ' + item.Name + '</div>\n          </div>\n        </div>\n      </div>';
     });
 }