x/compass-web
Code Issues Proposed changes

Add refresh function for each switch.

Browse Source 
Update switch API handling.
Update loading state for 'find servers' button.
Update servers order on host config page.

Change-Id: Ia25f13a0c6fba3a3115646aa5af5995cc016bf6b
This commit is contained in:
jiahuay 2014-01-22 11:05:48 -08:00
parent a4856ff62a
commit 4571242354
23 changed files with 852 additions and 560 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
public/css/base.css
View File

@ -119,8 +119,9 @@
color:#ffffff; color:#ffffff;
font-family:arial; font-family:arial;
font-size:12px; font-size:12px;
padding: 3px 20px; padding: 5px 20px;
text-decoration:none; text-decoration:none;
width: 120px
} }
.btn_find:hover { .btn_find:hover {
background: rgba(50,54,162,1); background: rgba(50,54,162,1);
@ -131,6 +132,19 @@
background: -ms-linear-gradient(top, rgba(50,54,162,1) 0%, rgba(141,146,251,1) 100%); background: -ms-linear-gradient(top, rgba(50,54,162,1) 0%, rgba(141,146,251,1) 100%);
background: linear-gradient(to bottom, rgba(50,54,162,1) 0%, rgba(141,146,251,1) 100%); background: linear-gradient(to bottom, rgba(50,54,162,1) 0%, rgba(141,146,251,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3236a2', endColorstr='#8d92fb', GradientType=0 ); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3236a2', endColorstr='#8d92fb', GradientType=0 );
cursor: pointer;
}
.btn_find[disabled] {
background: rgba(50,54,162,1);
background: -moz-linear-gradient(top, rgba(50,54,162,1) 0%, rgba(141,146,251,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(50,54,162,1)), color-stop(100%, rgba(141,146,251,1)));
background: -webkit-linear-gradient(top, rgba(50,54,162,1) 0%, rgba(141,146,251,1) 100%);
background: -o-linear-gradient(top, rgba(50,54,162,1) 0%, rgba(141,146,251,1) 100%);
background: -ms-linear-gradient(top, rgba(50,54,162,1) 0%, rgba(141,146,251,1) 100%);
background: linear-gradient(to bottom, rgba(50,54,162,1) 0%, rgba(141,146,251,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3236a2', endColorstr='#8d92fb', GradientType=0 );
opacity: 0.5;
cursor: default;
} }
.btn_find_inactive { .btn_find_inactive {

6
public/css/style.css
View File

@ -8,7 +8,7 @@ body {
#header { #header {
height: 60px; height: 60px;
min-width: 1150px; min-width: 1200px;
background-color: rgb(248, 248, 248); background-color: rgb(248, 248, 248);
background-image: url("../img/hw_000469.jpg"); background-image: url("../img/hw_000469.jpg");
border-bottom: 1px solid rgb(255, 255, 255); border-bottom: 1px solid rgb(255, 255, 255);
@ -30,7 +30,7 @@ body {
#menu { #menu {
height: 46px; height: 46px;
min-width: 1150px; min-width: 1200px;
overflow: hidden; overflow: hidden;
width: auto !important; width: auto !important;
margin: 0px auto; margin: 0px auto;
@ -106,7 +106,7 @@ h2 {
} }
#content { #content {
min-width: 1150px; min-width: 1200px;
min-height: 200px; min-height: 200px;
overflow-x: hidden; overflow-x: hidden;
position: relative; position: relative;

BIN
public/img/blue_refresh_16px.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 842 B

BIN
public/img/green_check_16px.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 338 B

After

Width:  |  Height:  |  Size: 3.2 KiB

BIN
public/img/red_cross_16px.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 928 B

BIN
public/img/refresh.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 KiB

BIN
public/img/waiting_16px.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.5 KiB

284
public/ods/config.js
View File

@ -1,149 +1,153 @@
config = { config = {
"switches": [ "switches": [{
{ "switch": {
"switch": { "ip": "172.29.8.40",
"ip": "172.29.8.40", "credential": {
"credential": { "version": "v2c",
"version": "v2c", "community": "public"
"community": "public" }
} }
} }, {
}, "switch": {
{ "ip": "172.29.8.41",
"switch": { "credential": {
"ip": "172.29.8.41", "version": "v2c",
"credential": { "community": "public"
"version": "v2c", }
"community": "public" }
} }, {
} "switch": {
} "ip": "172.29.8.42",
], "credential": {
"security": { "version": "v2c",
"server_credentials": { "community": "public"
"username": "root", }
"password": "root" }
}, }],
"service_credentials": { "security": {
"username": "service", "server_credentials": {
"password": "admin" "username": "root",
}, "password": "root"
"console_credentials": { },
"username": "console", "service_credentials": {
"password": "admin" "username": "service",
} "password": "admin"
}, },
"networking": { "console_credentials": {
"interfaces": { "username": "console",
"management": { "password": "admin"
"ip_start": "10.10.10.100", }
"ip_end": "10.10.10.255", },
"netmask": "255.255.255.0", "networking": {
"gateway": "10.10.10.1", "interfaces": {
"nic": "eth0", "management": {
"promisc": 0 "ip_start": "10.10.10.100",
}, "ip_end": "10.10.10.255",
"tenant": { "netmask": "255.255.255.0",
"ip_start": "192.168.100.100", "gateway": "10.10.10.1",
"ip_end": "192.168.100.200", "nic": "eth0",
"netmask": "255.255.255.0", "promisc": 0
"gateway": "192.168.100.1", },
"nic": "eth0", "tenant": {
"promisc": 0 "ip_start": "192.168.100.100",
}, "ip_end": "192.168.100.200",
"public": { "netmask": "255.255.255.0",
"ip_start": "172.29.3.100", "gateway": "192.168.100.1",
"ip_end": "172.29.3.200", "nic": "eth0",
"netmask": "255.255.255.0", "promisc": 0
"gateway": "172.29.3.1", },
"nic": "eth1", "public": {
"promisc": 1 "ip_start": "172.29.3.100",
}, "ip_end": "172.29.3.200",
"storage": { "netmask": "255.255.255.0",
"ip_start": "172.16.128.10", "gateway": "172.29.3.1",
"ip_end": "172.16.128.200", "nic": "eth1",
"netmask": "255.255.255.0", "promisc": 1
"gateway": "172.16.128.1", },
"nic": "eth0", "storage": {
"promisc": 0 "ip_start": "172.16.128.10",
} "ip_end": "172.16.128.200",
}, "netmask": "255.255.255.0",
"global": { "gateway": "172.16.128.1",
"nameservers": "4.4.4.4,8.8.8.8", "nic": "eth0",
"search_path": "ods.com", "promisc": 0
"gateway": "172.19.100.1", }
"proxy": "", },
"ntp_server": "" "global": {
} "nameservers": "4.4.4.4,8.8.8.8",
} "search_path": "ods.com",
"gateway": "172.19.100.1",
"proxy": "",
"ntp_server": ""
}
}
}; };
config_demo = { config_demo = {
"switches": [ "switches": [{
{ "switch": {
"switch": { "ip": "127.0.0.1",
"ip": "127.0.0.1", "credential": {
"credential": { "version": "v2c",
"version": "v2c", "community": "public"
"community": "public" }
} }
} }],
} ],
"security": { "security": {
"server_credentials": { "server_credentials": {
"username": "root", "username": "root",
"password": "huawei123" "password": "huawei123"
}, },
"service_credentials": { "service_credentials": {
"username": "service", "username": "service",
"password": "huawei123" "password": "huawei123"
}, },
"console_credentials": { "console_credentials": {
"username": "console", "username": "console",
"password": "huawei123" "password": "huawei123"
} }
}, },
"networking": { "networking": {
"interfaces": { "interfaces": {
"management": { "management": {
"ip_start": "33.33.33.100", "ip_start": "33.33.33.100",
"ip_end": "33.33.33.255", "ip_end": "33.33.33.255",
"netmask": "255.255.255.0", "netmask": "255.255.255.0",
"gateway": "33.33.33.10", "gateway": "33.33.33.10",
"nic": "eth0", "nic": "eth0",
"promisc": 0 "promisc": 0
}, },
"tenant": { "tenant": {
"ip_start": "192.168.100.100", "ip_start": "192.168.100.100",
"ip_end": "192.168.100.200", "ip_end": "192.168.100.200",
"netmask": "255.255.255.0", "netmask": "255.255.255.0",
"gateway": "192.168.100.1", "gateway": "192.168.100.1",
"nic": "eth0", "nic": "eth0",
"promisc": 0 "promisc": 0
}, },
"public": { "public": {
"ip_start": "172.29.3.100", "ip_start": "172.29.3.100",
"ip_end": "172.29.3.200", "ip_end": "172.29.3.200",
"netmask": "255.255.255.0", "netmask": "255.255.255.0",
"gateway": "172.29.3.1", "gateway": "172.29.3.1",
"nic": "eth1", "nic": "eth1",
"promisc": 1 "promisc": 1
}, },
"storage": { "storage": {
"ip_start": "172.16.128.10", "ip_start": "172.16.128.10",
"ip_end": "172.16.128.200", "ip_end": "172.16.128.200",
"netmask": "255.255.255.0", "netmask": "255.255.255.0",
"gateway": "172.16.128.1", "gateway": "172.16.128.1",
"nic": "eth0", "nic": "eth0",
"promisc": 0 "promisc": 0
} }
}, },
"global": { "global": {
"nameservers": "33.33.33.10", "nameservers": "33.33.33.10",
"search_path": "ods.com", "search_path": "ods.com",
"gateway": "33.33.33.10", "gateway": "33.33.33.10",
"proxy": "http://33.33.33.10:3128", "proxy": "http://33.33.33.10:3128",
"ntp_server": "33.33.33.10" "ntp_server": "33.33.33.10"
} }
} }
}; };

55
public/ods/fixtures/fixtures.js
View File

@ -15,17 +15,18 @@ steal("jquery/dom/fixture", "jquery/lang/json", function(){
var manage_ip = JSON.parse(original.data).switch.ip; var manage_ip = JSON.parse(original.data).switch.ip;
var switchId = 1; var switchId = 1;
if(manage_ip == "172.29.8.40") { if (manage_ip == "172.29.8.40") {
switchId = 1; switchId = 1;
} } else if (manage_ip == "172.29.8.41") {
else if(manage_ip == "172.29.8.41"){
switchId = 2; switchId = 2;
} else if (manage_ip == "172.29.8.42") {
switchId = 3;
} }
var returnData = { var returnData = {
"status": "accepted", "status": "accepted",
"switch": { "switch": {
"state": "not_reached", "state": "initialized",
"link": { "link": {
"href": "/switches/"+switchId+"/", "href": "/switches/"+switchId+"/",
"rel": "self" "rel": "self"
@ -41,12 +42,15 @@ steal("jquery/dom/fixture", "jquery/lang/json", function(){
}; };
//var xhr = {responseText: JSON.stringify(duplicateErr), status: 409}; //var xhr = {responseText: JSON.stringify(duplicateErr), status: 409};
if(switchId == 1) { if (switchId == 1) {
return [202, "accepted", returnData, {} ]; return [202, "accepted", returnData, {}];
//return [202, returnData ]; //return [202, returnData ];
} } else if (switchId == 2) {
else if(switchId == 2) {
return [409, duplicateErr]; return [409, duplicateErr];
//return [202, "accepted", returnData, {} ];
} else if (switchId == 3) {
//return [409, duplicateErr];
return [202, "accepted", returnData, {} ];
} }
}); });
@ -57,7 +61,7 @@ steal("jquery/dom/fixture", "jquery/lang/json", function(){
var returnData = { var returnData = {
"status": "accepted", "status": "accepted",
"switch": { "switch": {
"state": "not_reached", "state": "repulling",
"link": { "link": {
"href": "/switches/"+switchId+"/", "href": "/switches/"+switchId+"/",
"rel": "self" "rel": "self"
@ -76,7 +80,8 @@ steal("jquery/dom/fixture", "jquery/lang/json", function(){
var returnData = { var returnData = {
"status": "OK", "status": "OK",
"switch": { "switch": {
"state": switchId == 10 ? "not_reached" : "under_monitoring", "state": switchId == 10 ? "initialized" : "under_monitoring",
"err-msg": "error message",
"link": { "link": {
"href": settings.url, "href": settings.url,
"rel": "self" "rel": "self"
@ -183,6 +188,36 @@ steal("jquery/dom/fixture", "jquery/lang/json", function(){
}; };
return returnData; return returnData;
} }
else if(switchId == 3) {
var returnData = {
"status": "OK",
"machines": [
{
"mac": "28:e5:ee:23:14:92",
"vlan": 3,
"link": {
"href": "/api/machines/80",
"rel": "self"
},
"id": 80,
"port": 1,
"switch_ip": "172.29.8.42"
},
{
"mac": "28:22:77:c2:46:4a",
"vlan": 3,
"link": {
"href": "/api/machines/90",
"rel": "self"
},
"id": 90,
"port": 2,
"switch_ip": "172.29.8.42"
}
]
};
return returnData;
}
}); });

2
public/ods/ods.js
View File

@ -18,7 +18,7 @@ steal(
feature: null, feature: null,
machines: [], machines: [],
switches: [], switches: [],
snmp: 1, snmp: true,
adapter_id: null adapter_id: null
}; };

2
public/ods/ui/host_config/host_config.js
View File

@ -48,7 +48,7 @@ steal(
} }
}); });
$(document).tooltip({ $(".pattern-tip").tooltip({
items: "[data-geo], [title]", items: "[data-geo], [title]",
content: function() { content: function() {
var element = $(this); var element = $(this);

2
public/ods/ui/host_config/views/init.ejs
View File

@ -17,7 +17,7 @@
<option>Switch alias</option> <option>Switch alias</option>
<option>Host</option> <option>Host</option>
</select> </select>
<span class="ui-icon ui-icon-info" style="float: right; margin: 6px 19px 4px 7px;" data-geo="info-ico"> <span class="pattern-tip ui-icon ui-icon-info" style="float: right; margin: 6px 19px 4px 7px;" data-geo="info-ico">
</p> </p>
</div> </div>
<div class=""> <div class="">

82
public/ods/ui/install_review/install_review.js
View File

@ -129,18 +129,14 @@ steal(
$("#continuing").css("opacity", 1); $("#continuing").css("opacity", 1);
var cluster_id = this.options.odsState.cluster_id; var cluster_id = this.options.odsState.cluster_id;
Ods.Cluster.action( Ods.Cluster.action(cluster_id, {"deploy": []},
cluster_id, { this.proxy('onTriggerDeploy'),
"deploy": "" this.proxy('onTriggerDeployErr'));
},
this.proxy('onTriggerDeploy'),
this.proxy('onTriggerDeployErr'));
}, },
onTriggerDeploy: function(data, textStatus, xhr) { onTriggerDeploy: function(data, textStatus, xhr) {
steal.dev.log(" *** onTriggerDeploy data *** ", data); steal.dev.log(" *** onTriggerDeploy data *** ", data);
steal.dev.log(" *** onTriggerDeploy textStatus *** ", steal.dev.log(" *** onTriggerDeploy textStatus *** ", textStatus);
textStatus);
steal.dev.log(" *** onTriggerDeploy xhr *** ", xhr); steal.dev.log(" *** onTriggerDeploy xhr *** ", xhr);
if (xhr.status == 202) { // accepted if (xhr.status == 202) { // accepted
@ -155,8 +151,7 @@ steal(
onTriggerDeployErr: function(xhr, status, statusText) { onTriggerDeployErr: function(xhr, status, statusText) {
steal.dev.log(" *** onTriggerDeployErr xhr *** ", xhr); steal.dev.log(" *** onTriggerDeployErr xhr *** ", xhr);
steal.dev.log(" *** onTriggerDeployErr status *** ", status); steal.dev.log(" *** onTriggerDeployErr status *** ", status);
steal.dev.log(" *** onTriggerDeployErr statusText *** ", steal.dev.log(" *** onTriggerDeployErr statusText *** ", statusText);
statusText);
}, },
initProgressbars: function() { initProgressbars: function() {
@ -186,8 +181,7 @@ steal(
switchjson.children.push(serverjson); switchjson.children.push(serverjson);
// initiate list based progress bars // initiate list based progress bars
this.initListProgressbar(servers[i].clusterhost_id, this.initListProgressbar(servers[i].clusterhost_id, servers[i].hostname);
servers[i].hostname);
} }
this.serverTreeJson.children.push(switchjson); this.serverTreeJson.children.push(switchjson);
} }
@ -202,10 +196,8 @@ steal(
this.totalProgressbar.progressbar({ this.totalProgressbar.progressbar({
value: false value: false
}); });
this.totalProgressLabel = this.totalProgressbar.children( this.totalProgressLabel = this.totalProgressbar.children(".progress-label");
".progress-label"); this.totalProgressbarValue = this.totalProgressbar.find(".ui-progressbar-value");
this.totalProgressbarValue = this.totalProgressbar.find(
".ui-progressbar-value");
}, },
initListProgressbar: function(hostid, hostname) { initListProgressbar: function(hostid, hostname) {
@ -214,8 +206,7 @@ steal(
"hostid": hostid, "hostid": hostid,
"message": "Waiting..." "message": "Waiting..."
} }
$("#tabs-2 table tbody").append(this.view('progress_row', $("#tabs-2 table tbody").append(this.view('progress_row', initPData));
initPData));
var pbar = $('div[data-hostid="' + hostid + '"]'); var pbar = $('div[data-hostid="' + hostid + '"]');
pbar.progressbar({ pbar.progressbar({
@ -247,10 +238,7 @@ steal(
this.pendingHostList = []; this.pendingHostList = [];
for (var i = 0; i < count; i++) { for (var i = 0; i < count; i++) {
Ods.ClusterHost.progress( Ods.ClusterHost.progress(hosts[i], this.proxy('updateProgressBar'), this.proxy('updateProgressBarErr'));
hosts[i],
this.proxy('updateProgressBar'),
this.proxy('updateProgressBarErr'));
} }
}, },
@ -263,12 +251,12 @@ steal(
steal.dev.log(" *** onUpdateProgressBar textStatus *** ", textStatus); steal.dev.log(" *** onUpdateProgressBar textStatus *** ", textStatus);
steal.dev.log(" *** onUpdateProgressBar xhr *** ", xhr); steal.dev.log(" *** onUpdateProgressBar xhr *** ", xhr);
this.pendingHostCount --; this.pendingHostCount--;
var progressData = data.progress; var progressData = data.progress;
if(progressData.percentage < 1) { if (progressData.percentage < 1) {
this.pendingHostList.push(progressData.id); this.pendingHostList.push(progressData.id);
} }
@ -289,8 +277,7 @@ steal(
updateProgressBarErr: function(xhr, status, statusText) { updateProgressBarErr: function(xhr, status, statusText) {
steal.dev.log(" *** updateProgressBarErr xhr *** ", xhr); steal.dev.log(" *** updateProgressBarErr xhr *** ", xhr);
steal.dev.log(" *** updateProgressBarErr status *** ", status); steal.dev.log(" *** updateProgressBarErr status *** ", status);
steal.dev.log(" *** updateProgressBarErr statusText *** ", steal.dev.log(" *** updateProgressBarErr statusText *** ", xhr);
xhr);
//TODO //TODO
}, },
@ -311,16 +298,13 @@ steal(
} }
// update graph-based progress bar // update graph-based progress bar
if ($('rect[data-hostid="' + progressData.id + '"]')) { if ($('rect[data-hostid="' + progressData.id + '"]')) { // check if the node is expanded
// check if the node is expanded
if (progressData.percentage > 1.0) { if (progressData.percentage > 1.0) {
progressData.percentage = 1.0; progressData.percentage = 1.0;
} }
$('rect[data-hostid="' + progressData.id + '"]') $('rect[data-hostid="' + progressData.id + '"]').attr("width", imgWidth * progressData.percentage);
.attr("width", imgWidth * progressData.percentage);
$('text[data-hostid="' + progressData.id + '"]') $('text[data-hostid="' + progressData.id + '"]').text(progressData.message);
.text(progressData.message);
} }
}, },
@ -360,17 +344,14 @@ steal(
"background": "#5BB75B" "background": "#5BB75B"
}); });
} else { } else {
pbar.progressbar( pbar.progressbar("value", progressData.percentage * 100)
"value", progressData.percentage * 100)
} }
} }
}, },
updateTotalBar: function(data) { updateTotalBar: function(data) {
if(this.pendingHostCount == 0) { if (this.pendingHostCount == 0) {
Ods.Cluster.progress(this.options.odsState.cluster_id, Ods.Cluster.progress(this.options.odsState.cluster_id, this.proxy('onTotalProgressData'), this.proxy('onTotalProgressDataErr'));
this.proxy('onTotalProgressData'),
this.proxy('onTotalProgressDataErr'));
} }
}, },
@ -379,8 +360,7 @@ steal(
/********************************************/ /********************************************/
onTotalProgressData: function(data, textStatus, xhr) { onTotalProgressData: function(data, textStatus, xhr) {
steal.dev.log(" *** onTotalProgressData data *** ", data); steal.dev.log(" *** onTotalProgressData data *** ", data);
steal.dev.log(" *** onTotalProgressData textStatus *** ", steal.dev.log(" *** onTotalProgressData textStatus *** ", textStatus);
textStatus);
steal.dev.log(" *** onTotalProgressData xhr *** ", xhr); steal.dev.log(" *** onTotalProgressData xhr *** ", xhr);
var total = data.progress.percentage; var total = data.progress.percentage;
@ -397,9 +377,7 @@ steal(
setTimeout(this.proxy('getProgressData'), 3000); setTimeout(this.proxy('getProgressData'), 3000);
} else { } else {
this.totalProgressbar.progressbar("value", 100); this.totalProgressbar.progressbar("value", 100);
Ods.DashboardLink.findOne( Ods.DashboardLink.findOne(this.options.odsState.cluster_id, this.proxy('onFindDashboardLink'));
this.options.odsState.cluster_id,
this.proxy('onFindDashboardLink'));
} }
}, },
@ -408,23 +386,18 @@ steal(
/********************************************/ /********************************************/
onTotalProgressDataErr: function(xhr, status, statusText) { onTotalProgressDataErr: function(xhr, status, statusText) {
steal.dev.log(" *** onTotalProgressDataErr xhr *** ", xhr); steal.dev.log(" *** onTotalProgressDataErr xhr *** ", xhr);
steal.dev.log(" *** onTotalProgressDataErr status *** ", steal.dev.log(" *** onTotalProgressDataErr status *** ", status);
status); steal.dev.log(" *** onTotalProgressDataErr statusText *** ", xhr);
steal.dev.log(" *** onTotalProgressDataErr statusText *** ",
xhr);
//TODO //TODO
}, },
onFindDashboardLink: function(data, textStatus, xhr) { onFindDashboardLink: function(data, textStatus, xhr) {
steal.dev.log(" *** onFindDashboardLink data *** ", data); steal.dev.log(" *** onFindDashboardLink data *** ", data);
steal.dev.log(" *** onFindDashboardLink textStatus *** ", steal.dev.log(" *** onFindDashboardLink textStatus *** ", textStatus);
textStatus);
steal.dev.log(" *** onFindDashboardLink xhr *** ", xhr); steal.dev.log(" *** onFindDashboardLink xhr *** ", xhr);
if (data.status == "OK") { if (data.status == "OK") {
$(".dashboard-link").attr( $(".dashboard-link").attr("href", data.dashboardlinks["os-single-controller"]);
"href",
data.dashboardlinks["os-single-controller"]);
$(".dashboard-link").attr("target", "_blank"); $(".dashboard-link").attr("target", "_blank");
$(".dashboard-link").removeClass("disabled"); $(".dashboard-link").removeClass("disabled");
} }
@ -432,7 +405,7 @@ steal(
'.ui-tabs-nav click': function(el, ev) { '.ui-tabs-nav click': function(el, ev) {
if ($("#tabs-2").is(":visible")) { if ($("#tabs-2").is(":visible")) {
var children = this.serverTreeJson.children; var children = this.serverTreeJson.children;
for (var sw in children) { for (var sw in children) {
var servers = children[sw]._children; var servers = children[sw]._children;
if (servers == null) { if (servers == null) {
@ -486,8 +459,7 @@ steal(
.attr("width", width + margin.right + margin.left) .attr("width", width + margin.right + margin.left)
.attr("height", height + margin.top + margin.bottom) .attr("height", height + margin.top + margin.bottom)
.append("g") .append("g")
.attr("transform", .attr("transform", "translate(" + margin.left + "," + margin.top + ")");
"translate(" + margin.left + "," + margin.top + ")");
root = this.serverTreeJson; root = this.serverTreeJson;
root.x0 = height / 2; root.x0 = height / 2;

12
public/ods/ui/networking/networking.js
View File

@ -165,7 +165,7 @@ steal(
server['roles'] = []; server['roles'] = [];
} }
server['server_ip'] = this.startPrefix + (parseInt(this.startLastDigit) + i); //server['server_ip'] = this.startPrefix + (parseInt(this.startLastDigit) + i);
var switchIp = server.switch_ip; var switchIp = server.switch_ip;
if (this.serverData[switchIp] == undefined) { if (this.serverData[switchIp] == undefined) {
@ -176,6 +176,16 @@ steal(
} }
this.options.odsState.servers_config = this.serverData; this.options.odsState.servers_config = this.serverData;
var j = 0;
var serverData = this.options.odsState.servers_config;
for (var key in serverData) {
var servers = serverData[key];
for (var i = 0; i < servers.length; i++) {
serverData[key][i]['server_ip'] = this.startPrefix + (parseInt(this.startLastDigit) + j);
j++;
}
}
var networkingData = { var networkingData = {
"networking": { "networking": {
"interfaces": { "interfaces": {

20
public/ods/ui/networking/views/init.ejs
View File

@ -26,12 +26,12 @@
<option>eth3</option> <option>eth3</option>
<option>eth4</option> <option>eth4</option>
</select> </select>
<div id="mgt_nic_err" class="nicHint float_left"></div> <div id="mgt_nic_err" class="nicHint float_left" ><i> (This selection should be consistent with your networking plan.)</i></div>
</td> </td>
</tr> </tr>
<tr> <tr>
<td>Promisc Mode</td> <td>Promisc Mode</td>
<td><input id="mgt_promisc" type="checkbox"> The interface running in promisc mode will receive all packages in network. </td> <td><input id="mgt_promisc" type="checkbox"><i> (The interface running in promisc mode will receive and pass all the trafic.)</i></td>
</tr> </tr>
</table> </table>
</div> </div>
@ -65,7 +65,7 @@
</tr> </tr>
<tr> <tr>
<td>Promisc Mode</td> <td>Promisc Mode</td>
<td><input id="vnw_promisc" type="checkbox"> The interface running in promisc mode will receive all packages in network. </td> <td><input id="vnw_promisc" type="checkbox"><i> (The interface running in promisc mode will receive and pass all the trafic.)</i> </td>
</tr> </tr>
</table> </table>
</div> </div>
@ -105,7 +105,7 @@
</tr> </tr>
<tr> <tr>
<td>Promisc Mode</td> <td>Promisc Mode</td>
<td><input id="float_promisc" type="checkbox"> The interface running in promisc mode will receive all packages in network. </td> <td><input id="float_promisc" type="checkbox"><i> (The interface running in promisc mode will receive and pass all the trafic.)</i></td>
</tr> </tr>
</table> </table>
</div> </div>
@ -141,7 +141,7 @@
</tr> </tr>
<tr> <tr>
<td>Promisc Mode</td> <td>Promisc Mode</td>
<td><input id="storage_promisc" type="checkbox"> The interface running in promisc mode will receive all packages in network. </td> <td><input id="storage_promisc" type="checkbox"><i> (The interface running in promisc mode will receive and pass all the trafic.)</i></td>
</tr> </tr>
</table> </table>
</div> </div>
@ -150,23 +150,23 @@
<table> <table>
<tr> <tr>
<td>Nameserver</td> <td>Nameserver</td>
<td><input id="global_nameservers" type="input" class="rounded non-empty-value" value="">e.g. "[compass server ip]"</td> <td><input id="global_nameservers" type="input" class="rounded non-empty-value" value=""></td>
</tr> </tr>
<tr> <tr>
<td>Search Path</td> <td>Search Path</td>
<td><input id="global_searchpath" type="input" class="rounded non-empty-value" value="">e.g. "ods.com"</td> <td><input id="global_searchpath" type="input" class="rounded non-empty-value" value=""></td>
</tr> </tr>
<tr> <tr>
<td>Gateway</td> <td>Gateway</td>
<td><input id="global_gateway" type="input" class="rounded non-empty-value" value="">e.g. "[compass server gateway ip]"</td> <td><input id="global_gateway" type="input" class="rounded non-empty-value" value=""></td>
</tr> </tr>
<tr> <tr>
<td>Proxy (optional)</td> <td>Proxy (optional)</td>
<td><input id="global_proxy" type="input" class="rounded" value="">e.g. "http://[compass server ip]:3128"</td> <td><input id="global_proxy" type="input" class="rounded" value=""></td>
</tr> </tr>
<tr> <tr>
<td>NTP Server (optional)</td> <td>NTP Server (optional)</td>
<td><input id="global_ntpserver" type="input" class="rounded" value="">e.g. "[compass server ip]"</td> <td><input id="global_ntpserver" type="input" class="rounded" value=""></td>
</tr> </tr>
</table> </table>
</div> </div>

6
public/ods/ui/servers/servers.css
View File

@ -85,15 +85,15 @@ table.display thead th {
} }
.sorting { .sorting {
background: url('../../../img/bg.gif') no-repeat center right; background: url('../../../img/bg.gif') no-repeat 60% 50%;
} }
.sorting_desc { .sorting_desc {
background: url('../../../img/desc.gif') no-repeat center right; background: url('../../../img/desc.gif') no-repeat 60% 50%;
} }
.sorting_asc { .sorting_asc {
background: url('../../../img/asc.gif') no-repeat center right; background: url('../../../img/asc.gif') no-repeat 60% 50%;
} }
.highlight { .highlight {

445
public/ods/ui/servers/servers.js
View File

@ -7,20 +7,20 @@ steal(
'./servers.css', './servers.css',
'./views/init.ejs', './views/init.ejs',
'lib/jquery.dataTables.js', 'lib/jquery.dataTables.js',
'./views/switch_row.ejs', //'lib/jquery.dataTables.dataSourcePlugins.js',
'ods/models/servers.js', 'ods/models/servers.js',
'ods/models/cluster.js' 'ods/models/cluster.js',
'ods/ui/switch_entry'
).then(function($) { ).then(function($) {
$.Controller('Ods.Ui.servers', {}, { $.Controller('Ods.Ui.servers', {}, {
init: function() { init: function() {
this.element.html(this.view('init')); this.element.html(this.view('init'));
this.pendingSwitchList = [];
// we query up to 10 times. Report an error if any of the switches // we query up to 10 times. Report an error if any of the switches
// remains in not_reached status. // remains in not_reached status.
this.queryCount = 0; this.queryCount = 0;
this.displayNodes = [];
this.initServerTable(); this.initServerTable();
this.checked_num = 0; this.checked_num = 0;
@ -50,10 +50,8 @@ steal(
var oldSwitchesData = this.options.odsState.switches; var oldSwitchesData = this.options.odsState.switches;
var tbody = $(".switchtable tbody");
if (oldSwitchesData.length > 0) { if (oldSwitchesData.length > 0) {
var tbody = $(".switchtable tbody");
if (this.options.odsState.snmp) { if (this.options.odsState.snmp) {
$('#useSNMP').prop('checked', true); $('#useSNMP').prop('checked', true);
} else { } else {
@ -61,39 +59,31 @@ steal(
} }
for (var i = 0; i < oldSwitchesData.length; i++) { for (var i = 0; i < oldSwitchesData.length; i++) {
if (i > 0) { tbody.append("<tr class=\"switch_row\"></tr>");
tbody.append(this.view('switch_row')); var tr = tbody.find("tr:last");
} tr.ods_ui_switch_entry({
if (this.options.odsState.snmp) { "odsState": this.options.odsState,
$("#snmpTitle").html("SNMP Version"); "switchData": oldSwitchesData[i].switch,
$("#communityTitle").html("Community"); "first": i == 0,
$(".switch_row").find(".snmp").show(); "serverControl": this
$(".switch_row").find(".community").show(); });
$(".switch_row").find(".username").hide();
$(".switch_row").find(".password").hide();
} else {
$("#snmpTitle").html("Username");
$("#communityTitle").html("Password");
$(".switch_row").find(".snmp").hide();
$(".switch_row").find(".community").hide();
$(".switch_row").find(".username").show();
$(".switch_row").find(".password").show();
}
if (this.options.odsState.snmp) {
$(".switch_row").eq(i).find(".switchIp").val(oldSwitchesData[i].switch.ip);
$(".switch_row").eq(i).find(".snmp").val(oldSwitchesData[i].switch.credential.version);
$(".switch_row").eq(i).find(".community").val(oldSwitchesData[i].switch.credential.community);
} else {
$(".switch_row").eq(i).find(".switchIp").val(oldSwitchesData[i].switch.ip);
$(".switch_row").eq(i).find(".username").val(oldSwitchesData[i].switch.credential.username);
$(".switch_row").eq(i).find(".password").val(oldSwitchesData[i].switch.credential.password);
}
} }
} else {
tbody.append("<tr class=\"switch_row\"></tr>");
var tr = tbody.find("tr:last");
tr.ods_ui_switch_entry({
"odsState": this.options.odsState,
"switchData": null,
"first": true,
"serverControl": this
});
} }
}, },
initServerTable: function() { initServerTable: function() {
var currNode = [];
var self = this;
this.dataTable = $('#tb_server_select').dataTable({ this.dataTable = $('#tb_server_select').dataTable({
"sScrollY": "200px", "sScrollY": "200px",
"bPaginate": false, "bPaginate": false,
@ -117,12 +107,24 @@ steal(
aTargets: [0, 1, 3] aTargets: [0, 1, 3]
}, { }, {
bSearchable: false, bSearchable: false,
aTargets: [ 0 ] aTargets: [0]
}], }],
"aaSorting": [ "aaSorting": [
[2, "asc"], [2, "asc"],
[4, "asc"] [4, "asc"]
] ],
"fnPreDrawCallback": function(oSettings) {
/* reset currNode before each draw*/
currNode = [];
},
"fnRowCallback": function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {
/* push this row of data to currNode array*/
currNode.push(nRow);
},
"fnDrawCallback": function(oSettings) {
/* can now access sorted node array*/
self.displayNodes = currNode;
}
}); });
$('.dataTables_info').remove(); $('.dataTables_info').remove();
@ -130,21 +132,30 @@ steal(
$('.dataTables_filter input').addClass('rounded'); $('.dataTables_filter input').addClass('rounded');
}, },
removeServersBySwitch: function(switchIp) {
var servers = this.dataTable.fnGetData();
var serversCount = servers.length;
var i = 0;
while (i < serversCount) {
if (servers[i].switch_ip == switchIp) {
this.dataTable.fnDeleteRow(i);
servers = this.dataTable.fnGetData();
serversCount = servers.length;
} else {
i++;
}
}
},
'input[name="snmp"] click': function(el, ev) { 'input[name="snmp"] click': function(el, ev) {
this.options.odsState.attr("snmp", el.val() == "snmp");
if (el.val() == "snmp") { if (el.val() == "snmp") {
$("#snmpTitle").html("SNMP Version"); $("#snmpTitle").html("SNMP Version");
$("#communityTitle").html("Community"); $("#communityTitle").html("Community");
$(".snmp").show();
$(".community").show();
$(".username").hide();
$(".password").hide();
} else { } else {
$("#snmpTitle").html("Username"); $("#snmpTitle").html("Username");
$("#communityTitle").html("Password"); $("#communityTitle").html("Password");
$(".snmp").hide();
$(".community").hide();
$(".username").show();
$(".password").show();
} }
}, },
@ -203,22 +214,23 @@ steal(
}, },
'getSelectedServers': function() { 'getSelectedServers': function() {
selectedServers = []; console.log("displayNodes ", this.displayNodes);
var selectedServers = [];
this.options.odsState.servers = []; this.options.odsState.servers = [];
this.options.odsState.servers_config = []; this.options.odsState.servers_config = [];
// loop through dataTable nodes to find selected servers // loop through dataTable nodes to find selected servers
for (var i = 0; i < this.dataTable.fnGetNodes().length; i++) { for (var i = 0; i < this.displayNodes.length; i++) {
var ckboxTd = $('td', this.dataTable.fnGetNodes()[i])[0]; var ckboxTd = $('td', this.displayNodes[i])[0];
var server_ckbox = $('input', ckboxTd)[0]; var server_ckbox = $('input', ckboxTd)[0];
if (server_ckbox.checked == true) { if (server_ckbox.checked == true) {
var checkTd = $('td', this.dataTable.fnGetNodes()[i])[1]; var checkTd = $('td', this.displayNodes[i])[1];
var macTd = $('td', this.dataTable.fnGetNodes()[i])[1]; var macTd = $('td', this.displayNodes[i])[1];
var switchIpTd = $('td', this.dataTable.fnGetNodes()[i])[2]; var switchIpTd = $('td', this.displayNodes[i])[2];
var vlanTd = $('td', this.dataTable.fnGetNodes()[i])[3]; var vlanTd = $('td', this.displayNodes[i])[3];
var portTd = $('td', this.dataTable.fnGetNodes()[i])[4]; var portTd = $('td', this.displayNodes[i])[4];
var mac = macTd.textContent || macTd.innerText; var mac = macTd.textContent || macTd.innerText;
var switch_ip = switchIpTd.textContent || switchIpTd.innerText; var switch_ip = switchIpTd.textContent || switchIpTd.innerText;
@ -242,29 +254,25 @@ steal(
'div.add click': function(el, ev) { 'div.add click': function(el, ev) {
var tbody = el.closest('tbody'); var tbody = el.closest('tbody');
tbody.append(this.view('switch_row'));
if (!$("#useSNMP:checked").val()) { tbody.append("<tr class=\"switch_row\"></tr>");
$(".switch_row").last().find(".snmp").hide(); var tr = tbody.find("tr:last");
$(".switch_row").last().find(".community").hide(); tr.ods_ui_switch_entry({
$(".switch_row").last().find(".username").show(); "odsState": this.options.odsState,
$(".switch_row").last().find(".password").show(); "switchData": null
} });
}, },
'div.remove click': function(el, ev) { '.find_server click': function(el, ev) {
var row = el.closest('tr');
row.remove();
},
'a.find_server click': function(el, ev) {
// remove the error class within the el // remove the error class within the el
$('.switchtable').find('.error').removeClass('error'); $('.switchtable').find('.error').removeClass('error');
$(".switchesErr").hide(); $(".switchesErr").hide();
this.dataTable.fnClearTable();
var self = this; var self = this;
var hasError = false; var hasError = false;
this.pendingSwitchList.length = 0;
this.queryCount = 0; this.queryCount = 0;
// return if the switch_ip/community or username/password input is empty // return if the switch_ip/community or username/password input is empty
@ -273,6 +281,7 @@ steal(
hasError = true; hasError = true;
} }
}); });
// return if the ip format is not correct
$('.switchtable').find('.switchIp').each(function(index, value) { $('.switchtable').find('.switchIp').each(function(index, value) {
var isValid = self.validateIpFormat($(value).val()); var isValid = self.validateIpFormat($(value).val());
if (!isValid) { if (!isValid) {
@ -287,269 +296,44 @@ steal(
} }
$("#finding-servers").css("opacity", 1); $("#finding-servers").css("opacity", 1);
$('.find_server').attr("disabled", true);
$('.find_server').html("Finding...");
var switch_count = $(".switch_row").length; $('.switchtable').find('tr.switch_row').each(function(index, value) {
this.pendingCount = switch_count; $(value).controller().findServers();
this.switches = []; });
// loop through switch rows to create new switches
for (i = 0; i < switch_count; i++) {
var switch_ip = $(".switch_row").eq(i).find(".switchIp");
var snmp_version = null,
community = null;
var username = null,
password = null;
var switchData = {};
if ($("#useSNMP:checked").val()) { setTimeout(this.proxy('checkSwitchesStatus'), 2000);
this.options.odsState.snmp = 1; },
snmp_version = $(".switch_row").eq(i).find(".snmp");
community = $(".switch_row").eq(i).find(".community"); checkSwitchesStatus: function() {
switchData = { var switchesFinished = true;
"switch": { $('.switchtable').find('tr.switch_row').each(function(index, value) {
"ip": switch_ip.val(), var status = $(value).controller().getSwitchStatus();
"credential": { if(status.status == 1) {
'version': snmp_version.val(), switchesFinished = false;
'community': community.val()
}
}
};
} else {
this.options.odsState.snmp = 0;
username = $(".switch_row").eq(i).find(".username");
password = $(".switch_row").eq(i).find(".password");
switchData = {
"switch": {
"ip": switch_ip.val(),
"credential": {
"username": username.val(),
"password": password.val()
}
}
};
} }
})
this.switches.push(switchData); if (switchesFinished) {
Ods.Switch.create(switchData, this.proxy('onSwitchCreated', i), this.proxy('onSwitchCreateErr', i));
}
this.options.odsState.switches = this.switches;
},
'input.switchIp keyup': function(el, ev) {
var isValid = this.validateIpFormat(el.val());
if (!isValid) {
el.addClass("error");
} else {
el.removeClass("error");
}
},
validateIpFormat: function(value) {
var ipformat = /^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;
if (value.match(ipformat)) {
return true;
} else {
return false;
}
},
/************************************/
// switch create success callback
/************************************/
onSwitchCreated: function(switchIndex, data, textStatus, xhr) {
steal.dev.log(" *** onSwitchCreated data *** ", data);
steal.dev.log(" *** onSwitchCreated textStatus *** ", textStatus);
steal.dev.log(" *** onSwitchCreated xhr *** ", xhr);
this.pendingCount--;
if (xhr.status == 202) { // accepted
var switchId = data.
switch.id;
this.pendingSwitchList.push(switchId);
}
if (this.pendingCount == 0) {
this.checkSwitchState();
}
},
/************************************/
// switch create error callback
/************************************/
onSwitchCreateErr: function(switchIndex, xhr, status, statusText) {
steal.dev.log(" *** onSwitchCreatErr xhr *** ", xhr);
steal.dev.log(" *** onSwitchCreatErr status *** ", status);
steal.dev.log(" *** onSwitchCreatErr statusText *** ", xhr);
$("#finding-servers").css("opacity", 0);
if (xhr.status == 409) { // duplicate
var failedSwitchId = 0;
if ($.fixture.on == true) {
failedSwitchId = statusText.failedSwitch;
} else {
failedSwitchId = JSON.parse(xhr.responseText).failedSwitch;
}
steal.dev.log(" *** failed Switch Id *** ", failedSwitchId);
// PUT switches
Ods.Switch.update(failedSwitchId, this.switches[switchIndex],
this.proxy('onSwitchUpdated', switchIndex), this.proxy('onSwitchUpdateErr'));
} else if (xhr.status == 400) { //bad request
$(".switchesErr").html("Switch post error code: 400");
$(".switchesErr").show();
} else if (xhr.status == 500) { // internal server error
$(".switchesErr").html("Switch post error code: 500");
$(".switchesErr").show();
}
},
/************************************/
// switch update success callback
/************************************/
onSwitchUpdated: function(switchIndex, data, textStatus, xhr) {
steal.dev.log(" *** onSwitchUpdated data *** ", data);
steal.dev.log(" *** onSwitchUpdated textStatus *** ", textStatus);
steal.dev.log(" *** onSwitchUpdated xhr *** ", xhr);
this.pendingCount--;
if (xhr.status == 202 || xhr.status == 200) { // accepted or OK
var switchId = data.
switch.id;
this.pendingSwitchList.push(switchId);
}
if (this.pendingCount == 0) {
this.checkSwitchState();
}
},
/************************************/
// switch create error callback
/************************************/
onSwitchUpdateErr: function(xhr, status, statusText) {
steal.dev.log(" *** onSwitchUpdateErr xhr *** ", xhr);
steal.dev.log(" *** onSwitchUpdateErr status *** ", status);
steal.dev.log(" *** onSwitchUpdateErr statusText *** ", statusText);
$("#finding-servers").css("opacity", 0);
if (xhr.status == 404) { // not found
$(".switchesErr").html("Switch update error code: 404");
$(".switchesErr").show();
} else if (xhr.status == 400) { // bad request
$(".switchesErr").html("Switch update error code: 400");
$(".switchesErr").show();
} else if (xhr.status == 500) { // internal server error
$(".switchesErr").html("Switch update error code: 500");
$(".switchesErr").show();
}
},
checkSwitchState: function() {
this.queryCount++;
this.pendingCount = this.pendingSwitchList.length;
if (this.queryCount > 10) {
$(".switchesErr").html("There is(are) " + this.pendingCount + " switch(es) not responding now. Please try again later.")
$(".switchesErr").show();
$("#finding-servers").css("opacity", 0); $("#finding-servers").css("opacity", 0);
return; $('.find_server').attr("disabled", false);
} $('.find_server').html("Find Servers");
} else {
var switches = this.pendingSwitchList; setTimeout(this.proxy('checkSwitchesStatus'), 2000);
this.pendingSwitchList = [];
var count = this.pendingCount;
for (var i = 0; i < count; i++) {
Ods.Switch.findOne(switches[i], this.proxy('onFindOneSwitch'), this.proxy('onFindOneSwitchErr'));
} }
}, },
/************************************/
// find one switch success callback
/************************************/
onFindOneSwitch: function(data, textStatus, xhr) {
steal.dev.log(" *** onFindOneSwitch data *** ", data);
steal.dev.log(" *** onFindOneSwitch textStatus *** ", textStatus);
steal.dev.log(" *** onFindOneSwitch xhr *** ", xhr);
this.pendingCount--; onNewMachines: function(machines) {
this.element.find('div.right-side').show();
if (xhr.status == 200) { //OK if (machines.length > 0) {
if (data.switch.state === "under_monitoring") { this.dataTable.fnAddData(machines);
this.element.find('div.right-side').show(); this.machines = this.machines.concat(machines);
this.dataTable.fnClearTable();
this.getServersBySwitch(data.switch.id);
} else {
this.pendingSwitchList.push(data.switch.id);
}
}
if (this.pendingCount == 0) {
setTimeout(this.proxy('checkSwitchState'), 2000);
}
},
/************************************/
// find one switch error callback
/************************************/
onFindOneSwitchErr: function(xhr, status, statusText) {
steal.dev.log(" *** onFindOneSwitchErr xhr *** ", xhr);
steal.dev.log(" *** onFindOneSwitchErr status *** ", status);
steal.dev.log(" *** onFindOneSwitchErr statusText *** ", statusText);
$("#finding-servers").css("opacity", 0);
if (xhr.status == 404) { // not found
$(".switchesErr").html("Find switch error code: 404");
$(".switchesErr").show();
} else if (xhr.status == 500) {
$(".switchesErr").html("Find switch error code: 500");
$(".switchesErr").show();
}
},
getServersBySwitch: function(id) {
Ods.Server.findAll({
switchId: id
}, this.proxy('onFindAllServers'));
},
/************************************/
// find all servers success callback
/************************************/
onFindAllServers: function(data, textStatus, xhr) {
steal.dev.log(" *** onFindAllServers data *** ", data);
steal.dev.log(" *** onFindAllServers textStatus *** ", textStatus);
steal.dev.log(" *** onFindAllServers xhr *** ", xhr);
this.dataTable.fnAddData(data.machines);
this.machines = this.machines.concat(data.machines);
if (this.pendingCount == 0 && this.pendingSwitchList.length == 0) {
steal.dev.log("loading finished");
$("#finding-servers").css("opacity", 0);
this.options.odsState.machines = this.machines; this.options.odsState.machines = this.machines;
} }
}, },
checkNonEmpty: function(el) {
var value = el.val();
if (!value) {
el.addClass('error');
return false;
}
return true;
},
/************************************/ /************************************/
// add server to cluster success callback // add server to cluster success callback
/************************************/ /************************************/
@ -621,6 +405,33 @@ steal(
this.countCheckedServers(); this.countCheckedServers();
}, },
'input.switchIp keyup': function(el, ev) {
var isValid = this.validateIpFormat(el.val());
if (!isValid) {
el.addClass("error");
} else {
el.removeClass("error");
}
},
validateIpFormat: function(value) {
var ipformat = /^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;
if (value.match(ipformat)) {
return true;
} else {
return false;
}
},
checkNonEmpty: function(el) {
var value = el.val();
if (!value) {
el.addClass('error');
return false;
}
return true;
},
show: function() { show: function() {
this.element.show(); this.element.show();

18
public/ods/ui/servers/views/init.ejs
View File

@ -19,26 +19,12 @@
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr class="switch_row">
<td><input type="input" class="switchIp non-empty-value rounded" placeholder="Switch IP" value=""> </td>
<td style="width:110px">
<select class="snmp">
<option>v1</option>
<option selected>v2c</option>
</select>
<input type="input" class="username non-empty-value rounded" placeholder="Username" value="" style="display:none">
</td>
<td>
<input type="password" class="community non-empty-value rounded" placeholder="Community" value="">
<input type="password" class="password non-empty-value rounded" placeholder="Password" value="" style="display:none;">
</td>
<td width="120px"><div class="add"> </div></td>
</tr>
</tbody> </tbody>
</table> </table>
<div class="continue"> <div class="continue">
<center> <center>
<a href="javascript:void(0)" class="find_server btn_find"> Find Servers </a> <button class="find_server btn_find"> Find Servers </button>
<img id="finding-servers" class="loading" src="../img/ajax_loader.gif" height="30px" width="30px"></img> <img id="finding-servers" class="loading" src="../img/ajax_loader.gif" height="30px" width="30px"></img>
</center> </center>
<center class="switchesErr errhint" style="margin-top:10px;display:none;"> <center class="switchesErr errhint" style="margin-top:10px;display:none;">

55
public/ods/ui/switch_entry/servers_test.html Normal file
View File

@ -0,0 +1,55 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>servers Widget Unit Test</title>
<link rel="stylesheet" type="text/css" href="../../../css/base.css" />
<link rel="stylesheet" type="text/css" href="../../../css/style.css" />
</head>
<body>
<div class="container-fluid">
<div class="row-fluid">
<table><tbody id="servers-test"> </tbody></table>
</div>
<button class="b">Click Me </button>
</div>
<script type='text/javascript' src='../../../steal/steal.js'></script>
<script type='text/javascript'>
steal('jquery/dom/route', 'ods/fixtures', 'ods/ui/switch_entry').then(function($) {
var odsState = {
credential: "snmp",
networking: null,
servers: [],
servers_config: null,
cluster_id: null,
security: null,
partition: null,
feature: null,
machines: [],
switches: [],
snmp: 1
};
var state = new $.Observe(odsState);
/* $("button.b").click(function() { console.log("clicked ....."); state.attr("credential", "ssh");}); */
$("button.b").click(function() {
$('#servers-test').ods_ui_switch_entry("findServers");
});
$('#servers-test').ods_ui_switch_entry({
"odsState": state
});
});
</script>
</body>
</html>

51
public/ods/ui/switch_entry/switch_entry.css Normal file
View File

@ -0,0 +1,51 @@
.switch-status {
width: 16px;
height: 16px;
}
.switch-refresh {
width: 16px;
height: 16px;
margin-left: 5px;
}
.switch-refresh img {
cursor: hand;
cursor: pointer;
}
img.err:hover {
cursor: pointer;
}
.add {
width: 16px;
height: 16px;
background-image: url("../../../img/add_button_16px.png");
cursor: hand;
cursor: pointer;
float: left;
}
.remove {
width: 16px;
height: 16px;
background-image: url("../../../img/remove_button_16px.png");
cursor: hand;
cursor: pointer;
float: left;
}
.switch_row input {
width: 100px;
}
.server-result {
min-height: 200px;
}
.server-g-num {
padding: 1px 10px;
margin-top: 2px;
}

327
public/ods/ui/switch_entry/switch_entry.js Normal file
View File

@ -0,0 +1,327 @@
steal(
'jquery/controller',
'jquery/view/ejs',
'jquery/controller/view',
'jquery/lang/json'
).then(
'./switch_entry.css',
'./views/init.ejs',
'./views/switch_row.ejs',
'ods/models/servers.js',
'ods/models/cluster.js',
'lib/jquery-ui-1.10.3.custom.js'
).then(function($) {
$.Controller('Ods.Ui.SwitchEntry', {}, {
init: function() {
this.element.html(this.view('init', {
"first": this.options.first
}));
this.switchId = 0;
this.switchStatus = {
"status": 0,
"message": ""
};
this.queryCount = 0;
this.displaySnmp(this.options.odsState.snmp);
var switchData = this.options.switchData;
if (switchData) {
if (this.options.odsState.snmp) {
this.find(".switchIp").val(switchData.ip);
this.find(".snmp").val(switchData.credential.version);
this.find(".community").val(switchData.credential.community);
} else {
this.find(".switchIp").val(switchData.ip);
this.find(".username").val(switchData.credential.username);
this.find(".password").val(switchData.credential.password);
}
}
},
findServers: function() {
this.setSwitchStatus(1, "waiting");
var switchData = this.getSwitchData();
Ods.Switch.create(switchData, this.proxy('onSwitchCreated'), this.proxy('onSwitchCreateErr'));
},
getSwitchData: function() {
var snmp_version = null,
community = null;
var username = null,
password = null;
var switchData = {};
var ip = this.find('.switchIp').val();
if ($("#useSNMP:checked").val()) {
snmp_version = $(".switch_row").eq(i).find(".snmp");
community = $(".switch_row").eq(i).find(".community");
switchData = {
"switch": {
"ip": ip,
"credential": {
'version': snmp_version.val(),
'community': community.val()
}
}
};
} else {
username = this.find(".username");
password = this.find(".password");
switchData = {
"switch": {
"ip": ip,
"credential": {
"username": username.val(),
"password": password.val()
}
}
};
}
return switchData;
},
'div.switch-refresh img click': function(el, ev) {
//remove previously found servers in the data table
var oldSwitchStatus = this.getSwitchStatus().status;
if(oldSwitchStatus == 2) {
var switchIp = this.getSwitchData().switch.ip;
this.options.serverControl.removeServersBySwitch(switchIp);
}
this.setSwitchStatus(1, "waiting");
this.queryCount = 0;
this.checkSwitchState();
},
/************************************/
// switch create success callback
/************************************/
onSwitchCreated: function(data, textStatus, xhr) {
steal.dev.log(" *** onSwitchCreated data *** ", data);
steal.dev.log(" *** onSwitchCreated textStatus *** ", textStatus);
steal.dev.log(" *** onSwitchCreated xhr *** ", xhr);
if (xhr.status == 202) { // accepted
this.switchId = data.switch.id;
this.checkSwitchState();
}
},
/************************************/
// switch create error callback
/************************************/
onSwitchCreateErr: function(xhr, status, statusText) {
steal.dev.log(" *** onSwitchCreatErr xhr *** ", xhr);
steal.dev.log(" *** onSwitchCreatErr status *** ", status);
steal.dev.log(" *** onSwitchCreatErr statusText *** ", xhr);
if (xhr.status == 409) { // duplicate
var failedSwitchId = 0;
if ($.fixture.on == true) {
failedSwitchId = statusText.failedSwitch;
} else {
failedSwitchId = JSON.parse(xhr.responseText).failedSwitch;
}
steal.dev.log(" *** failed Switch Id *** ", failedSwitchId);
// PUT switches
var switchData = this.getSwitchData();
Ods.Switch.update(failedSwitchId, switchData,
this.proxy('onSwitchUpdated'),
this.proxy('onSwitchUpdateErr'));
} else {
this.setSwitchStatus(3, "POST switch API error");
//TODO
/*
if (xhr.status == 400) { //bad request
$(".switchesErr").html("Switch post error code: 400");
$(".switchesErr").show();
} else if (xhr.status == 500) { // internal server error
$(".switchesErr").html("Switch post error code: 500");
$(".switchesErr").show();
}
*/
}
},
/************************************/
// switch update success callback
/************************************/
onSwitchUpdated: function(data, textStatus, xhr) {
steal.dev.log(" *** onSwitchUpdated data *** ", data);
steal.dev.log(" *** onSwitchUpdated textStatus *** ", textStatus);
steal.dev.log(" *** onSwitchUpdated xhr *** ", xhr);
if (xhr.status == 202 || xhr.status == 200) { // accepted or OK
this.switchId = data.switch.id;
this.checkSwitchState();
}
},
/************************************/
// switch create error callback
/************************************/
onSwitchUpdateErr: function(xhr, status, statusText) {
steal.dev.log(" *** onSwitchUpdateErr xhr *** ", xhr);
steal.dev.log(" *** onSwitchUpdateErr status *** ", status);
steal.dev.log(" *** onSwitchUpdateErr statusText *** ", statusText);
this.setSwitchStatus(3, "PUT switch API error");
if (xhr.status == 404) { // not found
$(".switchesErr").html("Switch update error code: 404");
$(".switchesErr").show();
} else if (xhr.status == 400) { // bad request
$(".switchesErr").html("Switch update error code: 400");
$(".switchesErr").show();
} else if (xhr.status == 500) { // internal server error
$(".switchesErr").html("Switch update error code: 500");
$(".switchesErr").show();
}
},
checkSwitchState: function() {
this.queryCount++;
if (this.queryCount > 5) {
this.setSwitchStatus(3, "Timed out in connecting to switch");
return;
}
Ods.Switch.findOne(this.switchId, this.proxy('onFindOneSwitch'), this.proxy('onFindOneSwitchErr'));
},
/************************************/
// find one switch success callback
/************************************/
onFindOneSwitch: function(data, textStatus, xhr) {
steal.dev.log(" *** onFindOneSwitch data *** ", data);
steal.dev.log(" *** onFindOneSwitch textStatus *** ", textStatus);
steal.dev.log(" *** onFindOneSwitch xhr *** ", xhr);
if (xhr.status == 200) { //OK
if (data.switch.state === "under_monitoring") {
this.element.find('div.right-side').show();
this.getServersBySwitch(data.switch.id);
this.setSwitchStatus(2, "The switch is under monitoring");
} else if (data.switch.state === "unreachable"){
this.element.find('div.right-side').show();
this.getServersBySwitch(data.switch.id);
this.setSwitchStatus(3, data.switch.err_msg);
} else if (data.switch.state === "initialized" || data.switch.state === "repulling") {
setTimeout(this.proxy('checkSwitchState'), 2000);
} else if (data.switch.state === "notsupported") {
this.setSwitchStatus(3, data.switch.err_msg);
}
}
},
/************************************/
// find one switch error callback
/************************************/
onFindOneSwitchErr: function(xhr, status, statusText) {
steal.dev.log(" *** onFindOneSwitchErr xhr *** ", xhr);
steal.dev.log(" *** onFindOneSwitchErr status *** ", status);
steal.dev.log(" *** onFindOneSwitchErr statusText *** ", statusText);
this.setSwitchStatus(3, "GET switch API error");
/*
if (xhr.status == 404) { // not found
$(".switchesErr").html("Find switch error code: 404");
$(".switchesErr").show();
} else if (xhr.status == 500) {
$(".switchesErr").html("Find switch error code: 500");
$(".switchesErr").show();
}*/
},
getServersBySwitch: function(id) {
Ods.Server.findAll({
switchId: id
}, this.proxy('onFindAllServers'));
},
/************************************/
// find machines success callback
/************************************/
onFindAllServers: function(data, textStatus, xhr) {
steal.dev.log(" *** onFindAllServers data *** ", data);
steal.dev.log(" *** onFindAllServers textStatus *** ", textStatus);
steal.dev.log(" *** onFindAllServers xhr *** ", xhr);
this.setSwitchStatus(2, "The switch is under monitoring");
this.options.serverControl.onNewMachines(data.machines);
},
"{odsState} snmp change": function(Observe, ev, attr, action, newVal, oldVal) {
console.log(Observe, ev, attr, action, newVal, oldVal);
if (attr == "snmp" && action == "set") {
this.displaySnmp(newVal);
}
},
displaySnmp: function(snmp) {
if (snmp) {
$(".username").hide();
$(".password").hide();
$(".snmp").show();
$(".community").show();
} else {
$(".snmp").hide();
$(".community").hide();
$(".username").show();
$(".password").show();
}
},
getSwitchStatus: function() {
return this.switchStatus;
},
setSwitchStatus: function(status, message) {
this.switchStatus.status = status;
this.switchStatus.message = message;
this.displaySwitchStatus(this.switchStatus);
},
displaySwitchStatus: function(swStatus) {
switch(swStatus.status) {
case 0: //none
this.find(".waiting").hide();
this.find(".ok").hide();
this.find(".err").hide();
this.find(".refresh").hide();
break;
case 1: //waiting
this.find(".waiting").show();
this.find(".ok").hide();
this.find(".err").hide();
this.find(".refresh").hide();
break;
case 2: //ok
this.find(".ok").show();
this.find(".waiting").hide();
this.find(".err").hide();
this.find(".refresh").show();
break;
case 3: //error
this.find(".err").show();
this.find(".ok").hide();
this.find(".waiting").hide();
this.find(".refresh").show();
this.find(".err").attr("title", swStatus.message);
this.find(".err").tooltip();
break;
}
},
// remove switch row in switch table
'div.remove click': function(el, ev) {
var row = el.closest('tr');
row.remove();
},
});
});

27
public/ods/ui/switch_entry/views/init.ejs Normal file
View File

@ -0,0 +1,27 @@
<td><input type="input" class="switchIp non-empty-value rounded" placeholder="Switch IP"> </td>
<td>
<select class="snmp">
<option>v1</option>
<option selected>v2c</option>
</select>
<input type="input" class="username non-empty-value rounded" placeholder="Username" style="display:none">
</td>
<td>
<input type="password" class="community non-empty-value rounded" placeholder="Community">
<input type="password" class="password non-empty-value rounded" placeholder="Password" style="display:none">
</td>
<td>
<div class='add'></div>
<% if (!first) { %> <div class='remove'></div> <% } %>
<span class="status"></span>
<div class="switch-refresh float_right">
<img class="refresh" src="../img/blue_refresh_16px.png" style="display:none;">
</div>
<div class="switch-status float_right">
<img class="waiting" src="../img/waiting_16px.gif" style="display:none;">
<img class="ok" src="../img/green_check_16px.png" style="display:none;">
<img class="err" src="../img/red_cross_16px.png" style="display:none;">
</div>
</td>

2
public/ods/ui/servers/views/switch_row.ejs → public/ods/ui/switch_entry/views/switch_row.ejs
View File

@ -1,4 +1,4 @@
<tr class="switch_row"> <tr class="switch_row" <% this %>>
<td><input type="input" class="switchIp non-empty-value rounded" placeholder="Switch IP"> </td> <td><input type="input" class="switchIp non-empty-value rounded" placeholder="Switch IP"> </td>
<td> <td>
<select class="snmp"> <select class="snmp">