lmc/linodes/add/add.js

/*
 * This file is part of Linode Manager Classic.
 *
 * Linode Manager Classic is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 *
 * Linode Manager Classic is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with Linode Manager Classic.  If not, see <https://www.gnu.org/licenses/>.
 */

import { settings, elements, regionNames, countryContinents, apiGet, apiPost, parseParams, setupHeader } from "/global.js";

(function()
{
	// Element names specific to this page
	elements.addButton = "add-button";
	elements.datacenters = "datacenters";
	elements.dcOther = "dc-other";
	elements.instanceType = "instance-type";
	elements.instanceTypeActive = "instance-type-active";

	// Data recieved from API calls
	var data = {};
	data.params = {};
	data.linodeTypes = [];

	// Static references to UI elements
	var ui = {};
	ui.datacenters = {};
	ui.dcOther = {};

	var createLinodeTypeButton = function(type)
	{
		var typeButton = document.createElement("div");
		typeButton.id = type.id;
		typeButton.className = elements.instanceType;
		var label = document.createElement("h3");
		label.innerHTML = type.label;
		var storage = document.createElement("p");
		storage.innerHTML = (type.disk / 1024) + "GB Storage";
		var cpu = document.createElement("p");
		cpu.innerHTML = type.vcpus + " CPU Core";
		if (type.vcpus > 1)
			cpu.innerHTML = cpu.innerHTML + "s";
		var transfer = document.createElement("p");
		transfer.innerHTML = type.transfer + "GB XFER";
		var cost = document.createElement("p");
		cost.innerHTML = "$" + type.price.monthly + "/mo or (" + type.price.hourly + "/hr)";
		typeButton.appendChild(label);
		typeButton.appendChild(storage);
		typeButton.appendChild(cpu);
		typeButton.appendChild(transfer);
		typeButton.appendChild(cost);
		typeButton.addEventListener("click", handleTypeButtonClick);

		var list = document.getElementById(type["class"]);
		list.appendChild(typeButton);
	};

	var displayRegions = function(response)
	{
		for (var i = 0; i < response.data.length; i++) {
			var dc = document.createElement("option");
			dc.value = response.data[i].id;
			if (response.data[i].label && response.data[i].label.length)
				dc.innerHTML = response.data[i].label;
			else if (regionNames[response.data[i].id])
				dc.innerHTML = regionNames[response.data[i].id];
			else
				dc.innerHTML = response.data[i].id;
			var optgroup = null;
			if (countryContinents[response.data[i].country])
				optgroup = document.getElementById(countryContinents[response.data[i].country]);
			if (!optgroup)
				optgroup = ui.dcOther;
			optgroup.style.display = "initial";
			optgroup.appendChild(dc);
		}

		// Request the next page if there are more pages
		if (response.page != response.pages) {
			apiGet("/regions?page=" + (response.page + 1), displayRegions, null);
			return;
		}
	};

	var displayTypes = function(response)
	{
		// Add types to array
		data.linodeTypes = data.linodeTypes.concat(response.data);

		// Request the next page if there are more pages
		if (response.page != response.pages) {
			apiGet("/linode/types?page=" + (response.page + 1), displayTypes, null);
			return;
		}

		// Insert types
		for (var i = 0; i < data.linodeTypes.length; i++)
			createLinodeTypeButton(data.linodeTypes[i]);
	};

	var handleAddLinode = function(event)
	{
		if (event.currentTarget.disabled)
			return;

		var selectedPlan = document.getElementsByClassName(elements.instanceTypeActive);
		if (selectedPlan.length == 0) {
			alert("You must select a plan.");
			return;
		}

		var request = {
			"type": selectedPlan[0].id,
			"region": ui.datacenters.value
		};
		if (data.params.tag)
			request.tags = [data.params.tag];
		apiPost("/linode/instances", request, function(response)
		{
			location.href = "/linodes/dashboard?lid=" + response.id;
		});
	};

	var handleTypeButtonClick = function(event)
	{
		// Deselect any selected plans
		var selected = document.getElementsByClassName(elements.instanceTypeActive);
		for (var i = 0; i < selected.length; i++)
			selected[i].className = selected[i].className.replace(elements.instanceTypeActive, "");

		// Select the clicked plan
		event.currentTarget.className += " " + elements.instanceTypeActive;
	};

	var setup = function()
	{
		// Parse URL parameters
		data.params = parseParams();

		ui.datacenters = document.getElementById(elements.datacenters);
		ui.dcOther = document.getElementById(elements.dcOther);

		// Register add button handler
		document.getElementById(elements.addButton).addEventListener("click", handleAddLinode);

		setupHeader();

		// Get linode types and regions
		apiGet("/linode/types", displayTypes, null);
		apiGet("/regions", displayRegions, null);
	};

	// Attach onload handler
	window.addEventListener("load", setup);
})();