brad/lmc
1
0
Fork 0
Code Issues Pull Requests Releases Activity

API Region Names #2

Manually merged
brad merged 1 commits from api-region-names into main 2024-05-06 17:09:32 -04:00
Conversation 0 Commits 1 Files Changed 21 +333 -107
21 changed files with 333 additions and 107 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
global.js
View File

@ -35,36 +35,38 @@ var elements = {
"username": "username" "username": "username"
}; };
// Regions (Linode doesn't provide "friendly" names via the API) // Region names for legacy DCs no longer in the API
var regionNames = { var regionNames = {
"us-central": "Dallas, TX, USA", "us-east-1b": "Newark 2, NJ",
"us-west": "Fremont, CA, USA", "philadelphia": "Philadelphia, PA",
"us-southeast": "Atlanta, GA, USA", "absecon": "Absecon, NJ"
"us-east": "Newark, NJ, USA", };
"us-east-1b": "Newark 2, NJ, USA",
"eu-west": "London, England, UK", // Group contries into regions for easier selection
"ap-south": "Singapore, SG", var countryContinents = {
"eu-central": "Frankfurt, DE", "us": "na",
"ap-northeast": "Tokyo, JP", "gb": "eu",
"ap-northeast-1a": "Tokyo 2, JP", "jp": "ap",
"ca-central": "Toronto, ON, CA", "sg": "ap",
"ap-west": "Mumbai, IN", "de": "eu",
"ap-southeast": "Sydney, NSW, AU", "in": "ap",
"philadelphia": "Philadelphia, PA, USA", "ca": "na",
"absecon": "Absecon, NJ, USA", "au": "ap",
"us-iad": "Washington DC, USA", "fr": "eu",
"us-ord": "Chicago, IL, USA", "br": "sa",
"fr-par": "Paris, FR", "nl": "eu",
"in-maa": "Chennai, IN", "se": "eu",
"us-sea": "Seattle, WA, USA", "es": "eu",
"br-gru": "San Paulo, BR", "it": "eu",
"nl-ams": "Amsterdam, NL", "id": "ap",
"se-sto": "Stockholm, SE", "nz": "ap",
"jp-osa": "Osaka, JP", "pl": "eu",
"it-mil": "Milan, IT", "za": "af",
"id-cgk": "Jakarta, ID", "my": "ap",
"us-lax": "Los Angeles, CA, USA", "hk": "ap",
"us-mia": "Miami, FL, USA" "co": "sa",
"mx": "na",
"cl": "sa"
}; };
// Human-readable event titles // Human-readable event titles
@ -862,4 +864,4 @@ function translateKernel(slug, element)
apiGet("/linode/kernels/" + slug, callback, null); apiGet("/linode/kernels/" + slug, callback, null);
} }
export { settings, elements, regionNames, apiDelete, apiGet, apiPost, apiPut, drawSeries, md5, migrateETA, oauthPost, oauthScopes, objPut, parseParams, setupHeader, eventTitles, timeString, translateKernel }; export { settings, elements, regionNames, countryContinents, apiDelete, apiGet, apiPost, apiPut, drawSeries, md5, migrateETA, oauthPost, oauthScopes, objPut, parseParams, setupHeader, eventTitles, timeString, translateKernel };

2
images/create/create.js
View File

@ -15,7 +15,7 @@
* along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>. * along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>.
*/ */
import { settings, elements, regionNames, apiGet, apiPost, parseParams, setupHeader, timeString } from "/global.js"; import { settings, elements, apiGet, apiPost, parseParams, setupHeader, timeString } from "/global.js";
(function() (function()
{ {

2
images/delete/delete.js
View File

@ -15,7 +15,7 @@
* along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>. * along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>.
*/ */
import { settings, elements, regionNames, apiGet, apiDelete, parseParams, setupHeader, timeString } from "/global.js"; import { settings, elements, apiGet, apiDelete, parseParams, setupHeader, timeString } from "/global.js";
(function() (function()
{ {

2
images/edit/edit.js
View File

@ -15,7 +15,7 @@
* along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>. * along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>.
*/ */
import { settings, elements, regionNames, apiGet, apiPut, parseParams, setupHeader, timeString } from "/global.js"; import { settings, elements, apiGet, apiPut, parseParams, setupHeader, timeString } from "/global.js";
(function() (function()
{ {

2
images/images.js
View File

@ -15,7 +15,7 @@
* along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>. * along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>.
*/ */
import { settings, elements, regionNames, apiGet, parseParams, setupHeader, timeString } from "/global.js"; import { settings, elements, apiGet, parseParams, setupHeader, timeString } from "/global.js";
(function() (function()
{ {

9
images/upload/index.shtml
View File

@ -46,7 +46,14 @@ along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>.
</tr> </tr>
<tr class="lmc-tr3"> <tr class="lmc-tr3">
<td>Region</td> <td>Region</td>
<td><select id="region"></select></td> <td><select id="region">
<optgroup id="na" label="North America"></optgroup>
<optgroup id="eu" label="Europe"></optgroup>
<optgroup id="ap" label="Asia/Pacific"></optgroup>
<optgroup id="sa" label="South America"></optgroup>
<optgroup id="af" label="Africa"></optgroup>
<optgroup id="dc-other" label="Other"></optgroup>
</select></td>
<td class="info"> <td class="info">
For fastest initial upload, select the region that is geographically closest to you.<br /> For fastest initial upload, select the region that is geographically closest to you.<br />
Once uploaded you will be able to deploy the image to other regions. Once uploaded you will be able to deploy the image to other regions.

4
images/upload/upload.css
View File

@ -17,6 +17,10 @@
@import url('/global.css'); @import url('/global.css');
optgroup {
display: none;
}
.step-2 { .step-2 {
display: none; display: none;
} }

17
images/upload/upload.js
View File

@ -15,11 +15,12 @@
* along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>. * along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>.
*/ */
import { settings, elements, regionNames, apiGet, apiPost, objPut, parseParams, setupHeader } from "/global.js"; import { settings, elements, regionNames, countryContinents, apiGet, apiPost, objPut, parseParams, setupHeader } from "/global.js";
(function() (function()
{ {
// Element names specific to this page // Element names specific to this page
elements.dcOther = "dc-other";
elements.description = "description"; elements.description = "description";
elements.imageFile = "image-file"; elements.imageFile = "image-file";
elements.label = "label"; elements.label = "label";
@ -35,6 +36,7 @@ import { settings, elements, regionNames, apiGet, apiPost, objPut, parseParams,
// Static references to UI elements // Static references to UI elements
var ui = {}; var ui = {};
ui.dcOther = {};
ui.description = {}; ui.description = {};
ui.imageFile = {}; ui.imageFile = {};
ui.label = {}; ui.label = {};
@ -49,11 +51,19 @@ import { settings, elements, regionNames, apiGet, apiPost, objPut, parseParams,
for (var i = 0; i < response.data.length; i++) { for (var i = 0; i < response.data.length; i++) {
var dc = document.createElement("option"); var dc = document.createElement("option");
dc.value = response.data[i].id; dc.value = response.data[i].id;
if (regionNames[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]; dc.innerHTML = regionNames[response.data[i].id];
else else
dc.innerHTML = response.data[i].id; dc.innerHTML = response.data[i].id;
ui.region.appendChild(dc); 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);
} }
ui.nextButton.disabled = false; ui.nextButton.disabled = false;
@ -126,6 +136,7 @@ import { settings, elements, regionNames, apiGet, apiPost, objPut, parseParams,
} }
// Get element references // Get element references
ui.dcOther = document.getElementById(elements.dcOther);
ui.description = document.getElementById(elements.description); ui.description = document.getElementById(elements.description);
ui.imageFile = document.getElementById(elements.imageFile); ui.imageFile = document.getElementById(elements.imageFile);
ui.label = document.getElementById(elements.label); ui.label = document.getElementById(elements.label);

4
linodes/add/add.css
View File

@ -89,6 +89,10 @@ h3 {
padding: 15px; padding: 15px;
} }
optgroup {
display: none;
}
#right-links { #right-links {
float: right; float: right;
} }

21
linodes/add/add.js
View File

@ -15,13 +15,14 @@
* along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>. * along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>.
*/ */
import { settings, elements, regionNames, apiGet, apiPost, parseParams, setupHeader } from "/global.js"; import { settings, elements, regionNames, countryContinents, apiGet, apiPost, parseParams, setupHeader } from "/global.js";
(function() (function()
{ {
// Element names specific to this page // Element names specific to this page
elements.addButton = "add-button"; elements.addButton = "add-button";
elements.datacenters = "datacenters"; elements.datacenters = "datacenters";
elements.dcOther = "dc-other";
elements.instanceType = "instance-type"; elements.instanceType = "instance-type";
elements.instanceTypeActive = "instance-type-active"; elements.instanceTypeActive = "instance-type-active";
@ -33,6 +34,7 @@ import { settings, elements, regionNames, apiGet, apiPost, parseParams, setupHea
// Static references to UI elements // Static references to UI elements
var ui = {}; var ui = {};
ui.datacenters = {}; ui.datacenters = {};
ui.dcOther = {};
var createLinodeTypeButton = function(type) var createLinodeTypeButton = function(type)
{ {
@ -67,16 +69,26 @@ import { settings, elements, regionNames, apiGet, apiPost, parseParams, setupHea
for (var i = 0; i < response.data.length; i++) { for (var i = 0; i < response.data.length; i++) {
var dc = document.createElement("option"); var dc = document.createElement("option");
dc.value = response.data[i].id; dc.value = response.data[i].id;
if (regionNames[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]; dc.innerHTML = regionNames[response.data[i].id];
else else
dc.innerHTML = response.data[i].id; dc.innerHTML = response.data[i].id;
ui.datacenters.appendChild(dc); 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 // Request the next page if there are more pages
if (response.page != response.pages) if (response.page != response.pages) {
apiGet("/regions?page=" + (response.page + 1), displayRegions, null); apiGet("/regions?page=" + (response.page + 1), displayRegions, null);
return;
}
}; };
var displayTypes = function(response) var displayTypes = function(response)
@ -135,6 +147,7 @@ import { settings, elements, regionNames, apiGet, apiPost, parseParams, setupHea
data.params = parseParams(); data.params = parseParams();
ui.datacenters = document.getElementById(elements.datacenters); ui.datacenters = document.getElementById(elements.datacenters);
ui.dcOther = document.getElementById(elements.dcOther);
// Register add button handler // Register add button handler
document.getElementById(elements.addButton).addEventListener("click", handleAddLinode); document.getElementById(elements.addButton).addEventListener("click", handleAddLinode);

9
linodes/add/index.shtml
View File

@ -65,7 +65,14 @@ along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>.
</div> </div>
<div id="location"> <div id="location">
<h2>Location</h2> <h2>Location</h2>
<select id="datacenters"></select> <select id="datacenters">
<optgroup id="na" label="North America"></optgroup>
<optgroup id="eu" label="Europe"></optgroup>
<optgroup id="ap" label="Asia/Pacific"></optgroup>
<optgroup id="sa" label="South America"></optgroup>
<optgroup id="af" label="Africa"></optgroup>
<optgroup id="dc-other" label="Other"></optgroup>
</select>
</div> </div>
<div id="submit"> <div id="submit">
<button id="add-button" type="button">Add this Linode!</button> <button id="add-button" type="button">Add this Linode!</button>

54
linodes/backup_details/backup_details.js
View File

@ -50,6 +50,7 @@ import { settings, elements, apiGet, apiPost, parseParams, regionNames, setupHea
data.backup = {}; data.backup = {};
data.linode = {}; data.linode = {};
data.linodes = []; data.linodes = [];
data.region = {};
data.types = []; data.types = [];
// Static references to UI elements // Static references to UI elements
@ -89,6 +90,7 @@ import { settings, elements, apiGet, apiPost, parseParams, regionNames, setupHea
var plan = document.createElement("td"); var plan = document.createElement("td");
if (linode.type) { if (linode.type) {
plan.innerHTML = linode.type;
for (var i = 0; i < data.types.length; i++) { for (var i = 0; i < data.types.length; i++) {
if (data.types[i].id == linode.type) { if (data.types[i].id == linode.type) {
plan.innerHTML = data.types[i].label; plan.innerHTML = data.types[i].label;
@ -103,7 +105,9 @@ import { settings, elements, apiGet, apiPost, parseParams, regionNames, setupHea
row.appendChild(plan); row.appendChild(plan);
var location = document.createElement("td"); var location = document.createElement("td");
if (regionNames[linode.region]) if (data.region.label && data.region.label.length)
location.innerHTML = data.region.label;
else if (regionNames[linode.region])
location.innerHTML = regionNames[linode.region]; location.innerHTML = regionNames[linode.region];
else else
location.innerHTML = linode.region; location.innerHTML = linode.region;
@ -136,6 +140,15 @@ import { settings, elements, apiGet, apiPost, parseParams, regionNames, setupHea
ui.backupType.innerHTML = data.backup.type; ui.backupType.innerHTML = data.backup.type;
if (regionNames[data.backup.region]) {
ui.backupLocation.innerHTML = regionNames[data.backup.region];
ui.destLocation.innerHTML = regionNames[data.backup.region];
} else {
ui.backupLocation.innerHTML = data.backup.region;
ui.destLocation.innerHTML = data.backup.region;
}
apiGet("/regions/" + data.backup.region, displayRegion, null);
for (var i = 0; i < data.backup.configs.length; i++) { for (var i = 0; i < data.backup.configs.length; i++) {
var li = document.createElement("li"); var li = document.createElement("li");
li.innerHTML = data.backup.configs[i]; li.innerHTML = data.backup.configs[i];
@ -152,7 +165,7 @@ import { settings, elements, apiGet, apiPost, parseParams, regionNames, setupHea
ui.backupSize.innerHTML = data.backup.totalSize + " MB"; ui.backupSize.innerHTML = data.backup.totalSize + " MB";
if (state.haveTypes && data.linode.id) if (state.haveTypes)
insertTypes(); insertTypes();
}; };
@ -169,18 +182,6 @@ import { settings, elements, apiGet, apiPost, parseParams, regionNames, setupHea
ui.linodeTagLink.innerHTML = "(" + data.linode.tags[0] + ")"; ui.linodeTagLink.innerHTML = "(" + data.linode.tags[0] + ")";
ui.linodeTag.style.display = "inline"; ui.linodeTag.style.display = "inline";
} }
// Display location
if (regionNames[data.linode.region]) {
ui.backupLocation.innerHTML = regionNames[data.linode.region];
ui.destLocation.innerHTML = regionNames[data.linode.region];
} else {
ui.backupLocation.innerHTML = data.linode.region;
ui.destLocation.innerHTML = data.linode.region;
}
if (state.haveTypes && data.backup.id)
insertTypes();
}; };
// Callback for linode disks API call // Callback for linode disks API call
@ -238,7 +239,7 @@ import { settings, elements, apiGet, apiPost, parseParams, regionNames, setupHea
// Request the next page if there are more pages // Request the next page if there are more pages
if (response.page != response.pages) { if (response.page != response.pages) {
var filter = { var filter = {
"region": data.linode.region "region": data.backup.region
}; };
apiGet("/linode/instances?page=" + (response.page + 1), displayLinodes, filter); apiGet("/linode/instances?page=" + (response.page + 1), displayLinodes, filter);
return; return;
@ -254,6 +255,17 @@ import { settings, elements, apiGet, apiPost, parseParams, regionNames, setupHea
} }
}; };
// Callback for region API call
var displayRegion = function(response)
{
data.region = response;
if (data.region.label && data.region.label.length) {
ui.backupLocation.innerHTML = response.label;
ui.destLocation.innerHTML = response.label;
}
};
// Callback for linode types API call // Callback for linode types API call
var displayTypes = function(response) var displayTypes = function(response)
{ {
@ -267,7 +279,7 @@ import { settings, elements, apiGet, apiPost, parseParams, regionNames, setupHea
} }
state.haveTypes = true; state.haveTypes = true;
if (data.backup.id && data.linode.id) if (data.backup.id)
insertTypes(); insertTypes();
}; };
@ -295,7 +307,7 @@ import { settings, elements, apiGet, apiPost, parseParams, regionNames, setupHea
var req = { var req = {
"label": ui.destLabel.value, "label": ui.destLabel.value,
"type": ui.destPlan.value, "type": ui.destPlan.value,
"region": data.linode.region, "region": data.backup.region,
"backup_id": data.backup.id "backup_id": data.backup.id
}; };
var callback = function(response) var callback = function(response)
@ -348,11 +360,11 @@ import { settings, elements, apiGet, apiPost, parseParams, regionNames, setupHea
ui.destPlan.appendChild(option); ui.destPlan.appendChild(option);
} }
updatePrice(null); updateSpace(null);
ui.newLinode.disabled = false; ui.newLinode.disabled = false;
var filter = { var filter = {
"region": data.linode.region "region": data.backup.region
}; };
apiGet("/linode/instances", displayLinodes, filter); apiGet("/linode/instances", displayLinodes, filter);
}; };
@ -410,7 +422,7 @@ import { settings, elements, apiGet, apiPost, parseParams, regionNames, setupHea
ui.newLinode = document.getElementById(elements.newLinode); ui.newLinode = document.getElementById(elements.newLinode);
// Register event handlers // Register event handlers
ui.destPlan.addEventListener("input", updatePrice); ui.destPlan.addEventListener("input", updateSpace);
ui.newLinode.addEventListener("click", handleCreate); ui.newLinode.addEventListener("click", handleCreate);
// Get data from API // Get data from API
@ -431,7 +443,7 @@ import { settings, elements, apiGet, apiPost, parseParams, regionNames, setupHea
}; };
// Update the price display // Update the price display
var updatePrice = function(event) var updateSpace = function(event)
{ {
// Find the selected type // Find the selected type
var type = null; var type = null;

71
linodes/clone/clone.js
View File

@ -15,7 +15,7 @@
* along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>. * along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>.
*/ */
import { settings, elements, apiGet, apiPost, migrateETA, parseParams, regionNames, setupHeader, translateKernel } from "/global.js"; import { settings, elements, apiGet, apiPost, countryContinents, migrateETA, parseParams, regionNames, setupHeader, translateKernel } from "/global.js";
(function() (function()
{ {
@ -25,6 +25,7 @@ import { settings, elements, apiGet, apiPost, migrateETA, parseParams, regionNam
elements.configDiskRow = "config-disk-row"; elements.configDiskRow = "config-disk-row";
elements.configsNone = "configs-none"; elements.configsNone = "configs-none";
elements.configTable = "config-table-body"; elements.configTable = "config-table-body";
elements.dcOther = "dc-other";
elements.destBackups = "dest-backups"; elements.destBackups = "dest-backups";
elements.destBackupsPrice = "dest-backups-price"; elements.destBackupsPrice = "dest-backups-price";
elements.destLabel = "dest-label"; elements.destLabel = "dest-label";
@ -54,6 +55,7 @@ import { settings, elements, apiGet, apiPost, migrateETA, parseParams, regionNam
data.configs = []; data.configs = [];
data.disks = []; data.disks = [];
data.linode = {}; data.linode = {};
data.regions = [];
data.types = []; data.types = [];
// Static references to UI elements // Static references to UI elements
@ -62,6 +64,7 @@ import { settings, elements, apiGet, apiPost, migrateETA, parseParams, regionNam
ui.configCloneTable = {}; ui.configCloneTable = {};
ui.configsNone = {}; ui.configsNone = {};
ui.configTable = {}; ui.configTable = {};
ui.dcOther = {};
ui.destBackups = {}; ui.destBackups = {};
ui.destBackupsPrice = {}; ui.destBackupsPrice = {};
ui.destLabel = {}; ui.destLabel = {};
@ -241,7 +244,17 @@ import { settings, elements, apiGet, apiPost, migrateETA, parseParams, regionNam
} }
// Display the source location // Display the source location
if (regionNames[data.linode.region]) var region = null;
for (var i = 0; i < data.regions.length; i++) {
if (data.regions[i].id == data.linode.region) {
region = data.regions[i];
break;
}
}
if (region && region.label && region.label.length)
ui.sourceLocation.innerHTML = region.label;
else if (regionNames[data.linode.region])
ui.sourceLocation.innerHTML = regionNames[data.linode.region]; ui.sourceLocation.innerHTML = regionNames[data.linode.region];
else else
ui.sourceLocation.innerHTML = data.linode.region; ui.sourceLocation.innerHTML = data.linode.region;
@ -290,25 +303,8 @@ import { settings, elements, apiGet, apiPost, migrateETA, parseParams, regionNam
// Callback for regions API call // Callback for regions API call
var displayRegions = function(response) var displayRegions = function(response)
{ {
for (var i = 0; i < response.data.length; i++) { // Add regions to array
// Add regions to selector data.regions = data.regions.concat(response.data);
var dc = document.createElement("option");
dc.value = response.data[i].id;
if (regionNames[response.data[i].id])
dc.innerHTML = regionNames[response.data[i].id];
else
dc.innerHTML = response.data[i].id;
ui.destLocation.appendChild(dc);
// Add optgroups to linode selector
var optgroup = document.createElement("optgroup");
optgroup.id = response.data[i].id;
if (regionNames[response.data[i].id])
optgroup.label = regionNames[response.data[i].id];
else
optgroup.label = response.data[i].label;
ui.destLinode.appendChild(optgroup);
}
// Request the next page if there are more pages // Request the next page if there are more pages
if (response.page != response.pages) { if (response.page != response.pages) {
@ -316,6 +312,37 @@ import { settings, elements, apiGet, apiPost, migrateETA, parseParams, regionNam
return; return;
} }
for (var i = 0; i < data.regions.length; i++) {
// Add regions to selector
var dc = document.createElement("option");
dc.value = data.regions[i].id;
if (data.regions[i].label && data.regions[i].label.length)
dc.innerHTML = data.regions[i].label;
else if (regionNames[data.regions[i].id])
dc.innerHTML = regionNames[data.regions[i].id];
else
dc.innerHTML = data.regions[i].id;
var group = null;
if (countryContinents[data.regions[i].country])
group = document.getElementById(countryContinents[data.regions[i].country]);
if (!group)
group = ui.dcOther;
group.style.display = "initial";
group.appendChild(dc);
// Add optgroups to linode selector
var optgroup = document.createElement("optgroup");
optgroup.id = data.regions[i].id;
if (data.regions[i].label && data.regions[i].label.length)
optgroup.label = data.regions[i].label;
else if (regionNames[data.regions[i].id])
optgroup.label = regionNames[data.regions[i].id];
else
optgroup.label = data.regions[i].label;
ui.destLinode.appendChild(optgroup);
}
apiGet("/linode/instances/" + data.params.lid, displayDetails, null);
apiGet("/linode/instances", displayLinodes, null); apiGet("/linode/instances", displayLinodes, null);
}; };
@ -415,6 +442,7 @@ import { settings, elements, apiGet, apiPost, migrateETA, parseParams, regionNam
ui.configCloneTable = document.getElementById(elements.configCloneTable); ui.configCloneTable = document.getElementById(elements.configCloneTable);
ui.configsNone = document.getElementById(elements.configsNone); ui.configsNone = document.getElementById(elements.configsNone);
ui.configTable = document.getElementById(elements.configTable); ui.configTable = document.getElementById(elements.configTable);
ui.dcOther = document.getElementById(elements.dcOther);
ui.destBackups = document.getElementById(elements.destBackups); ui.destBackups = document.getElementById(elements.destBackups);
ui.destBackupsPrice = document.getElementById(elements.destBackupsPrice); ui.destBackupsPrice = document.getElementById(elements.destBackupsPrice);
ui.destLabel = document.getElementById(elements.destLabel); ui.destLabel = document.getElementById(elements.destLabel);
@ -442,7 +470,6 @@ import { settings, elements, apiGet, apiPost, migrateETA, parseParams, regionNam
ui.destPlan.addEventListener("input", updatePrices); ui.destPlan.addEventListener("input", updatePrices);
// Get data from API // Get data from API
apiGet("/linode/instances/" + data.params.lid, displayDetails, null);
apiGet("/linode/instances/" + data.params.lid + "/configs", displayConfigs, null); apiGet("/linode/instances/" + data.params.lid + "/configs", displayConfigs, null);
apiGet("/linode/instances/" + data.params.lid + "/disks", displayDisks, null); apiGet("/linode/instances/" + data.params.lid + "/disks", displayDisks, null);
apiGet("/linode/types", displayTypes, null); apiGet("/linode/types", displayTypes, null);

9
linodes/clone/index.shtml
View File

@ -142,7 +142,14 @@ along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>.
</tr> </tr>
<tr class="lmc-tr3 new-linode"> <tr class="lmc-tr3 new-linode">
<td>Location</td> <td>Location</td>
<td><select id="dest-location"></select></td> <td><select id="dest-location">
<optgroup id="na" label="North America"></optgroup>
<optgroup id="eu" label="Europe"></optgroup>
<optgroup id="ap" label="Asia/Pacific"></optgroup>
<optgroup id="sa" label="South America"></optgroup>
<optgroup id="af" label="Africa"></optgroup>
<optgroup id="dc-other" label="Other"></optgroup>
</select></td>
</tr> </tr>
<tr class="lmc-tr3 new-linode"> <tr class="lmc-tr3 new-linode">
<td>Plan</td> <td>Plan</td>

78
linodes/linodes.js
View File

@ -48,6 +48,7 @@ import { settings, elements, regionNames, apiGet, parseParams, setupHeader } fro
data.noTag = false; data.noTag = false;
data.notifications = []; data.notifications = [];
data.plans = []; data.plans = [];
data.regions = [];
// Static references to UI elements // Static references to UI elements
var ui = {}; var ui = {};
@ -60,6 +61,8 @@ import { settings, elements, regionNames, apiGet, parseParams, setupHeader } fro
var state = {}; var state = {};
state.haveLinodes = false; state.haveLinodes = false;
state.haveNotifications = false; state.haveNotifications = false;
state.haveRegions = false;
state.haveTypes = false;
var createLinodeRow = function(linode, alt) var createLinodeRow = function(linode, alt)
{ {
@ -92,8 +95,10 @@ import { settings, elements, regionNames, apiGet, parseParams, setupHeader } fro
plan.innerHTML = getPlanLabel(linode.type); plan.innerHTML = getPlanLabel(linode.type);
else else
plan.innerHTML = "Unknown"; plan.innerHTML = "Unknown";
if (plan.innerHTML == "") if (plan.innerHTML == "") {
plan.innerHTML = linode.type;
translatePlan(linode.type, plan); translatePlan(linode.type, plan);
}
var ip = document.createElement("td"); var ip = document.createElement("td");
ip.innerHTML = linode.ipv4[0]; ip.innerHTML = linode.ipv4[0];
var ipCount = 0; var ipCount = 0;
@ -110,8 +115,17 @@ import { settings, elements, regionNames, apiGet, parseParams, setupHeader } fro
plus.innerHTML = " (+" + ipCount + ")"; plus.innerHTML = " (+" + ipCount + ")";
ip.appendChild(plus); ip.appendChild(plus);
} }
var regionData = null;
for (var i = 0; i < data.regions.length; i++) {
if (data.regions[i].id == linode.region) {
regionData = data.regions[i];
break;
}
}
var region = document.createElement("td"); var region = document.createElement("td");
if (regionNames[linode.region]) if (regionData && regionData.label && regionData.label.length)
region.innerHTML = regionData.label;
else if (regionNames[linode.region])
region.innerHTML = regionNames[linode.region]; region.innerHTML = regionNames[linode.region];
else else
region.innerHTML = linode.region; region.innerHTML = linode.region;
@ -312,8 +326,19 @@ import { settings, elements, regionNames, apiGet, parseParams, setupHeader } fro
body.innerHTML = data.notifications[i].message; body.innerHTML = data.notifications[i].message;
} }
// Replace "this facility" with actual location for outages // Replace "this facility" with actual location for outages
if (data.notifications[i].type == "outage" && data.notifications[i].entity && data.notifications[i].entity.type == "region" && regionNames[data.notifications[i].entity.id]) if (data.notifications[i].type == "outage" && data.notifications[i].entity && data.notifications[i].entity.type == "region") {
header.innerHTML = header.innerHTML.replace("this facility", regionNames[data.notifications[i].entity.id]); var region = null;
for (var j = 0; j < data.regions.length; j++) {
if (data.regions[j].id == data.notifications[i].entity.id) {
region = data.regions[j];
break;
}
}
if (region && region.label && region.label.length)
header.innerHTML = header.innerHTML.replace("this facility", region.label);
else if (regionNames[data.notifications[i].entity.id])
header.innerHTML = header.innerHTML.replace("this facility", regionNames[data.notifications[i].entity.id]);
}
notification.appendChild(header); notification.appendChild(header);
notification.appendChild(body); notification.appendChild(body);
ui.notifications.appendChild(notification); ui.notifications.appendChild(notification);
@ -379,13 +404,42 @@ import { settings, elements, regionNames, apiGet, parseParams, setupHeader } fro
return; return;
} }
// Get linodes state.haveTypes = true;
var filters = null; if (state.haveRegions) {
if (data.params.tag) // Get linodes
filters = { var filters = null;
"tags": data.params.tag if (data.params.tag)
}; filters = {
apiGet("/linode/instances", displayLinodes, filters); "tags": data.params.tag
};
apiGet("/linode/instances", displayLinodes, filters);
}
};
var getRegions = function(response)
{
// Add regions to array
data.regions = data.regions.concat(response.data);
// Request the next page if there are more pages
if (response.page != response.pages) {
apiGet("/regions?page=" + (response.page + 1), getRegions, null);
return;
}
state.haveRegions = true;
if (state.haveTypes) {
// Get linodes
var filters = null;
if (data.params.tag)
filters = {
"tags": data.params.tag
};
apiGet("/linode/instances", displayLinodes, filters);
}
// Get notifications
apiGet("/account/notifications", displayNotifications, null);
}; };
var insertLinodes = function() var insertLinodes = function()
@ -425,9 +479,9 @@ import { settings, elements, regionNames, apiGet, parseParams, setupHeader } fro
setupHeader(); setupHeader();
// Get linode and transfer info // Get linode and transfer info
apiGet("/regions", getRegions, null);
apiGet("/linode/types", getPlans, null); apiGet("/linode/types", getPlans, null);
apiGet("/account/transfer", displayTransfer, null); apiGet("/account/transfer", displayTransfer, null);
apiGet("/account/notifications", displayNotifications, null);
}; };
var translatePlan = function(name, cell) var translatePlan = function(name, cell)

4
volumes/add/add.css
View File

@ -21,6 +21,10 @@
padding: 0px 15px 15px; padding: 0px 15px 15px;
} }
optgroup {
display: none;
}
tbody tr td:first-of-type { tbody tr td:first-of-type {
font-weight: bold; font-weight: bold;
text-align: right; text-align: right;

17
volumes/add/add.js
View File

@ -15,13 +15,14 @@
* along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>. * along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>.
*/ */
import { settings, elements, apiGet, apiPost, parseParams, regionNames, setupHeader } from "/global.js"; import { settings, elements, apiGet, apiPost, countryContinents, parseParams, regionNames, setupHeader } from "/global.js";
(function() (function()
{ {
// Element names specific to this page // Element names specific to this page
elements.addButton = "add-button"; elements.addButton = "add-button";
elements.attachment = "attachment"; elements.attachment = "attachment";
elements.dcOther = "dc-other";
elements.label = "label"; elements.label = "label";
elements.location = "location"; elements.location = "location";
elements.size = "size"; elements.size = "size";
@ -35,6 +36,7 @@ import { settings, elements, apiGet, apiPost, parseParams, regionNames, setupHea
var ui = {}; var ui = {};
ui.addButton = {}; ui.addButton = {};
ui.attachment = {}; ui.attachment = {};
ui.dcOther = {};
ui.label = {}; ui.label = {};
ui.location = {}; ui.location = {};
ui.size = {}; ui.size = {};
@ -90,11 +92,19 @@ import { settings, elements, apiGet, apiPost, parseParams, regionNames, setupHea
for (var i = 0; i < data.regions.length; i++) { for (var i = 0; i < data.regions.length; i++) {
var loc = document.createElement("option"); var loc = document.createElement("option");
loc.value = data.regions[i].id; loc.value = data.regions[i].id;
if (regionNames[data.regions[i].id]) if (data.regions[i].label && data.regions[i].label.length)
loc.innerHTML = data.regions[i].label;
else if (regionNames[data.regions[i].id])
loc.innerHTML = regionNames[data.regions[i].id]; loc.innerHTML = regionNames[data.regions[i].id];
else else
loc.innerHTML = data.regions[i].id; loc.innerHTML = data.regions[i].id;
ui.location.appendChild(loc); var optgroup = null;
if (countryContinents[data.regions[i].country])
optgroup = document.getElementById(countryContinents[data.regions[i].country]);
if (!optgroup)
optgroup = ui.dcOther;
optgroup.style.display = "initial";
optgroup.appendChild(loc);
} }
// Request linodes in all the supported regions // Request linodes in all the supported regions
@ -180,6 +190,7 @@ import { settings, elements, apiGet, apiPost, parseParams, regionNames, setupHea
// Get element references // Get element references
ui.addButton = document.getElementById(elements.addButton); ui.addButton = document.getElementById(elements.addButton);
ui.attachment = document.getElementById(elements.attachment); ui.attachment = document.getElementById(elements.attachment);
ui.dcOther = document.getElementById(elements.dcOther);
ui.label = document.getElementById(elements.label); ui.label = document.getElementById(elements.label);
ui.location = document.getElementById(elements.location); ui.location = document.getElementById(elements.location);
ui.size = document.getElementById(elements.size); ui.size = document.getElementById(elements.size);

6
volumes/add/index.shtml
View File

@ -50,6 +50,12 @@ along with Linode Manager Classic. If not, see <https://www.gnu.org/licenses/>.
<td> <td>
<select id="location"> <select id="location">
<option selected disabled value="0">Choose A Location</option> <option selected disabled value="0">Choose A Location</option>
<optgroup id="na" label="North America"></optgroup>
<optgroup id="eu" label="Europe"></optgroup>
<optgroup id="ap" label="Asia/Pacific"></optgroup>
<optgroup id="sa" label="South America"></optgroup>
<optgroup id="af" label="Africa"></optgroup>
<optgroup id="dc-other" label="Other"></optgroup>
</select> </select>
</td> </td>
<td class="info">The datacenter where the new volume should be created</td> <td class="info">The datacenter where the new volume should be created</td>

8
volumes/clone/clone.js
View File

@ -39,6 +39,13 @@ import { settings, elements, apiGet, apiPost, parseParams, regionNames, setupHea
ui.size = {}; ui.size = {};
ui.volumeLabel = {}; ui.volumeLabel = {};
// Callback for region API call
var displayRegion = function(response)
{
if (response.label && response.label.length)
ui.location.innerHTML = response.label;
};
// Callback for volume API call // Callback for volume API call
var displayVolume = function(response) var displayVolume = function(response)
{ {
@ -55,6 +62,7 @@ import { settings, elements, apiGet, apiPost, parseParams, regionNames, setupHea
ui.location.innerHTML = response.region; ui.location.innerHTML = response.region;
ui.cloneButton.disabled = false; ui.cloneButton.disabled = false;
apiGet("/regions/" + response.region, displayRegion, null);
}; };
// Click handler for clone button // Click handler for clone button

9
volumes/settings/settings.js
View File

@ -83,6 +83,13 @@ import { settings, elements, regionNames, apiGet, apiPost, apiPut, parseParams,
} }
}; };
// Callback for region API call
var displayRegion = function(response)
{
if (response.label && response.label.length)
ui.location.innerHTML = response.label;
};
// Callback for volume API call // Callback for volume API call
var displayVolume = function(response) var displayVolume = function(response)
{ {
@ -117,6 +124,8 @@ import { settings, elements, regionNames, apiGet, apiPost, apiPut, parseParams,
} }
ui.saveButton.disabled = false; ui.saveButton.disabled = false;
apiGet("/regions/" + data.volume.region, displayRegion, null);
}; };
// Click handler for save button // Click handler for save button

50
volumes/volumes.js
View File

@ -28,6 +28,7 @@ import { settings, elements, regionNames, apiGet, parseParams, setupHeader } fro
// Data recieved from API calls // Data recieved from API calls
var data = {}; var data = {};
data.linodes = {}; data.linodes = {};
data.regions = [];
data.volumes = []; data.volumes = [];
// Static references to UI elements // Static references to UI elements
@ -35,6 +36,11 @@ import { settings, elements, regionNames, apiGet, parseParams, setupHeader } fro
ui.loading = {}; ui.loading = {};
ui.volumeBody = {}; ui.volumeBody = {};
// Temporary state
var state = {};
state.haveRegions = false;
state.haveVolumes = false;
// Generates a table row for a volume // Generates a table row for a volume
var createVolumeRow = function(volume, alt) var createVolumeRow = function(volume, alt)
{ {
@ -59,8 +65,17 @@ import { settings, elements, regionNames, apiGet, parseParams, setupHeader } fro
size.innerHTML = volume.size + " GiB"; size.innerHTML = volume.size + " GiB";
row.appendChild(size); row.appendChild(size);
var regionData = null;
for (var i = 0; i < data.regions.length; i++) {
if (data.regions[i].id == volume.region) {
regionData = data.regions[i];
break;
}
}
var region = document.createElement("td"); var region = document.createElement("td");
if (regionNames[volume.region]) if (regionData && regionData.label && regionData.label.length)
region.innerHTML = regionData.label;
else if (regionNames[volume.region])
region.innerHTML = regionNames[volume.region]; region.innerHTML = regionNames[volume.region];
else else
region.innerHTML = volume.region; region.innerHTML = volume.region;
@ -108,6 +123,27 @@ import { settings, elements, regionNames, apiGet, parseParams, setupHeader } fro
return row; return row;
}; };
// Callback for regions API call
var displayRegions = function(response)
{
// Add regions to array
data.regions = data.regions.concat(response.data);
// Request the next page if there are more pages
if (response.page != response.pages) {
apiGet("/regions?page=" + (response.page + 1), displayRegions, null);
return;
}
state.haveRegions = true;
if (state.haveVolumes) {
// Insert volumes
ui.loading.remove();
for (var i = 0; i < data.volumes.length; i++)
ui.volumeBody.appendChild(createVolumeRow(data.volumes[i], i % 2));
}
};
// Callback for volumes API call // Callback for volumes API call
var displayVolumes = function(response) var displayVolumes = function(response)
{ {
@ -127,10 +163,13 @@ import { settings, elements, regionNames, apiGet, parseParams, setupHeader } fro
if (data.volumes.length == 0) if (data.volumes.length == 0)
location.href = "/volumes/add"; location.href = "/volumes/add";
// Insert volumes state.haveVolumes = true;
ui.loading.remove(); if (state.haveRegions) {
for (var i = 0; i < data.volumes.length; i++) // Insert volumes
ui.volumeBody.appendChild(createVolumeRow(data.volumes[i], i % 2)); ui.loading.remove();
for (var i = 0; i < data.volumes.length; i++)
ui.volumeBody.appendChild(createVolumeRow(data.volumes[i], i % 2));
}
}; };
// Initial setup // Initial setup
@ -147,6 +186,7 @@ import { settings, elements, regionNames, apiGet, parseParams, setupHeader } fro
// Get data from API // Get data from API
apiGet("/volumes", displayVolumes, null); apiGet("/volumes", displayVolumes, null);
apiGet("/regions", displayRegions, null);
}; };
// Get the label of a given linode ID and update a cell's contents // Get the label of a given linode ID and update a cell's contents