Skip to content

Commit 9bdea97

Browse files
DasFranckDasFranck
committed
Updating UI for worker groups configuration, working and nearly finished!
1 parent 2d1b322 commit 9bdea97

1 file changed

Lines changed: 115 additions & 43 deletions

File tree

‎mrq/dashboard/static/js/views/workergroups.js‎

Lines changed: 115 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -10,60 +10,132 @@ define(["jquery", "underscore", "models", "views/generic/page", "quicksettings"]
1010
"click .submit": "submit"
1111
},
1212

13-
render: function() {
13+
addCommandPanel: function() {
1414
var _this = this;
1515

16-
self.$("button")[0].setAttribute('style', 'top:80px;left:10px;');
17-
self.workers_panel = []
16+
if (typeof this.commandPanel === "undefined")
17+
{
18+
this.commandPanel = QuickSettings.create(25, 80, "Actions", $(this.el)[0])
19+
.addButton("Add a Worker Group", function() {
20+
_this.addPanel();
21+
})
22+
.addButton("Save", function() {
23+
_this.save();
24+
})
25+
.addButton("Reload", function() {
26+
_this.reload();
27+
})
28+
.addHTML("Status", "<font color=\"green\">OK</font>")
29+
.setDraggable(false)
30+
.setWidth(150);
31+
}
32+
},
1833

19-
self.command_panel = QuickSettings.create(25, 80, "Actions", self.$(_this.el)[0])
20-
.addButton("Add a Worker Group")
21-
.addButton("Save")
22-
.addButton("Reload")
23-
.setDraggable(false)
24-
.setWidth(150);
34+
addPanel: function(workergroup = null, workergroupName = "") {
35+
var _this = this;
36+
var panelIndex = this.workergroupPanels.length;
37+
var workerPanel = QuickSettings.create(225 + this.workergroupPanels.length * 350, 80, "Worker group configuration", $(this.el)[0])
38+
.addText("Workgroup Name", workergroupName)
39+
.hideTitle("Workgroup Name")
40+
.addButton("Remove this Worker Group", function() {
41+
_this.workergroupPanels[panelIndex].destroy();
42+
try {
43+
delete _this.workergroupPanels[panelIndex];
44+
}
45+
catch (e) {}
46+
_this.workergroupPanels[panelIndex] = null;
47+
})
48+
.addText("Process Termination Timeout", workergroup ? workergroup["process_termination_timeout"] : 0)
49+
.addButton("Add a Profile", function() {
50+
_this.addProfileToPanel(_this.workergroupPanels[panelIndex]);
51+
})
52+
.setDraggable(false)
53+
.setHeight(850)
54+
.setWidth(300);
55+
workerPanel.profilesNumber = 0;
56+
this.workergroupPanels.push(workerPanel);
57+
if (workergroup != null)
58+
{
59+
_.forEach(workergroup["profiles"], function(profile, profileName) {
60+
this.addProfileToPanel(workerPanel, profile, profileName);
61+
}, this);
62+
}
63+
},
2564

26-
$.get("/api/workergroups").done(function(data) {
27-
var i = 0;
28-
_.forEach(data["workergroups"], function(workgroup, workgroup_name) {
29-
var worker_panel = QuickSettings.create(225 + i * 350, 80, "Worker group configuration", self.$(_this.el)[0])
30-
.addText("Workgroup Name", workgroup_name)
31-
.hideTitle("Workgroup Name")
32-
.addButton("Remove this Worker Group")
33-
.addText("Process Termination Timeout", workgroup["process_termination_timeout"])
34-
.setDraggable(false)
35-
.setHeight(850)
36-
.setWidth(300);
37-
_.forEach(workgroup["profiles"], function(profile, profile_name) {
38-
worker_panel.addHTML("separator", "<br>")
39-
.hideTitle("separator")
40-
.addText("Profile Name", profile_name)
41-
.addText("Memory", profile["memory"])
42-
.addText("CPU", profile["cpu"])
43-
.addRange("MinCount", 0, 100, profile["min_count"], 1)
44-
.addRange("MaxCount", 0, 100, profile["max_count"], 1)
45-
.addTextArea("Command", profile["command"])
46-
.addButton("Remove this Profile");
47-
});
48-
self.workers_panel.push(worker_panel);
49-
console.log(workgroup_name, workgroup);
50-
i++;
51-
});
52-
});
65+
addProfileToPanel: function(workerPanel, profile = null, profileName = "") {
66+
workerPanel.profilesNumber += 1;
67+
header = "Profile " + String(workerPanel.profilesNumber) + " - ";
68+
workerPanel.addHTML("separator", "<br>")
69+
.hideTitle("separator")
70+
.addText(header + "Profile Name", profileName)
71+
.addText(header + "Memory", profile ? profile["memory"]: 0)
72+
.addText(header + "CPU", profile ? profile["cpu"] : 0)
73+
.addRange(header + "MinCount", 0, 100, profile ? profile["min_count"] : 0, 1)
74+
.addRange(header + "MaxCount", 0, 100, profile ? profile["max_count"] : 0, 1)
75+
.addTextArea(header + "Command", profile ? profile["command"]: "")
76+
.addButton("Remove this Profile");
5377
},
5478

55-
submit: function(el) {
56-
var self = this;
79+
remove_profile: function() {
80+
},
81+
82+
reload: function() {
83+
if (confirm('It will discard every changes that hasn\'t be saved. Are you sure?')) {
84+
_.forEach(this.workergroupPanels, function(panel) {
85+
if (panel != null && panel != undefined)
86+
panel.destroy();
87+
delete panel;
88+
})
89+
this.render();
90+
}
91+
},
5792

58-
self.$("button")[0].innerHTML = "Wait...";
93+
save: function() {
94+
this.commandPanel._controls["Status"].setValue("<font color=\"orange\">Saving...</font>");
5995

60-
var val = self.$("textarea").val();
96+
data = {};
97+
_.forEach(this.workergroupPanels, function(panel) {
98+
if (panel != null && panel != undefined )
99+
{
100+
panelJSON = panel.getValuesAsJSON();
101+
workergroup = {
102+
"profiles" : {},
103+
"process_termination_timeout": parseInt(panelJSON["Process Termination Timeout"], 10)
104+
}
105+
_.forEach(_.range(1, panel.profilesNumber + 1), function(index) {
106+
profile = {};
107+
header = "Profile " + String(index) + " - ";
108+
profile["memory"] = parseInt(panelJSON[header + "Memory"], 10);
109+
profile["cpu"] = parseInt(panelJSON[header + "CPU"], 10);
110+
profile["min_count"] = parseInt(panelJSON[header + "MinCount"], 10);
111+
profile["max_count"] = parseInt(panelJSON[header + "MaxCount"], 10);
112+
profile["command"] = panelJSON[header + "Command"];
113+
workergroup["profiles"][panelJSON[header + "Profile Name"]] = profile;
114+
})
115+
data[panelJSON["Workgroup Name"]] = workergroup;
116+
}
117+
})
118+
console.log(data)
119+
console.log(JSON.stringify(data))
61120

62-
$.post("/api/workergroups", {"workergroups": val}).done(function(data) {
63-
if (data.status != "ok") {
121+
$.post("/api/workergroups", {"workergroups": JSON.stringify(data)}).done(function(result) {
122+
if (result.status != "ok") {
64123
return alert("There was an error while saving!");
65124
}
66-
self.$("button")[0].innerHTML = "Save";
125+
});
126+
this.commandPanel._controls["Status"].setValue("<font color=\"green\">Saved</font>");
127+
},
128+
129+
render: function() {
130+
var _this = this;
131+
132+
this.workergroupPanels = [];
133+
this.addCommandPanel();
134+
135+
$.get("/api/workergroups").done(function(data) {
136+
_.forEach(data["workergroups"], function(workergroup, workergroupName) {
137+
_this.addPanel(workergroup, workergroupName);
138+
});
67139
});
68140
}
69141
});

0 commit comments

Comments
 (0)