[Kimchi-devel] [PATCH 5/8] Applying new-ui at SEP Configuration Modal
sguimaraes943 at gmail.com
sguimaraes943 at gmail.com
Fri Nov 27 19:47:54 UTC 2015
From: Andre Teodoro <andreteodoro.work at gmail.com>
Signed-off-by: Andre Teodoro <andreteodoro.work at gmail.com>
Signed-off-by: samhenri <samuel.guimaraes at eldorado.org.br>
---
ui/js/host-admin.js | 97 ++++++++++++++++++-------------------------
ui/pages/host-admin.html.tmpl | 43 ++++++++++++-------
2 files changed, 69 insertions(+), 71 deletions(-)
diff --git a/ui/js/host-admin.js b/ui/js/host-admin.js
index 30110df..87a15ff 100644
--- a/ui/js/host-admin.js
+++ b/ui/js/host-admin.js
@@ -613,68 +613,53 @@ ginger.initSEPConfig = function() {
});
};
- $(".add-subscription", ".ginger .host-admin .subsc-manage").button({
- text: false
- }).click(function(event) {
+ $('#subscriptionAdd').on('show.bs.modal', function(event) {
var clearSubscriptionSubmit = function(clear) {
if (clear) {
- $(".subsc-add-body .subsc-add-content .subsc-input", "#subscriptionAdd").val("");
+ $("form#form-subscription-add :input", "#subscriptionAdd").val("");
}
- $(".subsc-add-content .subsc-input").attr("disabled", false);
- $("input", ".subsc-add-content .subsc-input").attr("disabled", false);
- $("#subsc-submit").button("option", "disabled", true);
- $("#subsc-cancel").button("option", "disabled", false);
+ $("form#form-subscription-add :input").attr("disabled", false);
+ $("#subsc-submit").prop("disabled", true);
+ $("#subsc-cancel").prop("disabled", false);
};
- $("#subscriptionAdd").dialog({
- modal: true,
- width: 350,
- draggable: false,
- resizable: false,
- closeText: "X",
- open: function() {
- $(".subsc-add-content .inputbox").keyup(function() {
- var sum = 0;
- $(".subsc-add-content .inputbox").each(function(index, data) {
- if ($(data).val() === "") {
- sum += 1;
- }
- })
- if (sum != 0) {
- $("#subsc-submit").button("option", "disabled", true);
- } else {
- $("#subsc-submit").button("option", "disabled", false);
- }
- });
- $("#subsc-submit", $(this)).button().click(function(event) {
- $(".subsc-add-content .subsc-input").attr("disabled", true);
- $("input", ".subsc-add-content .subsc-input").attr("disabled", true);
- $("#subsc-submit").button("option", "disabled", true);
- $("#subsc-cancel").button("option", "disabled", true);
- var hostname = $(".subsc-add-content .subsc-input[name='hostname']", ".subsc-add-body").val();
- var port = parseInt($(".subsc-add-content .subsc-input[name='port']", ".subsc-add-body").val());
- var community = $(".subsc-add-content .subsc-input[name='community']", ".subsc-add-body").val();
- var dataSubmit = {
- hostname: hostname,
- port: port,
- community: community,
- };
- ginger.addSEPSubscription(dataSubmit, function() {
- $("#subscriptionAdd").dialog("close");
- listSubscriptions();
- }, function(error) {
- wok.message.error(error.responseJSON.reason);
- clearSubscriptionSubmit(false);
- });
- });
- $("#subsc-cancel", $(this)).button().click(function(event) {
- $("#subscriptionAdd").dialog("close");
- });
- },
- beforeClose: function() {
- clearSubscriptionSubmit(true);
- $("#subsc-submit").unbind("click");
+ $("#subscriptionAdd, .input").keyup(function() {
+ var sum = 0;
+ $("form#form-subscription-add :input").each(function(index, data) {
+ if ($(data).val() === "") {
+ sum += 1;
+ }
+ })
+ if (sum != 0) {
+ $("#subsc-submit").prop("disabled", true);
+ } else {
+ $("#subsc-submit").prop("disabled", false);
}
});
+ $("#subsc-submit", $(this)).button().click(function(event) {
+ $("form#form-subscription-add :input").attr("disabled", true);
+ $("#subsc-submit").prop("disabled", true);
+ $("#subsc-cancel").prop("disabled", true);
+ var hostname = $("#subscriptionAdd, .input[name='hostname']", ".modal-body").val();
+ var port = parseInt($("#subscriptionAdd, .input[name='port']", ".modal-body").val());
+ var community = $("#subscriptionAdd, .input[name='community']", ".modal-body").val();
+ var dataSubmit = {
+ hostname: hostname,
+ port: port,
+ community: community,
+ };
+ ginger.addSEPSubscription(dataSubmit, function() {
+ clearSubscriptionSubmit(true);
+ $('#subscriptionAdd').modal('hide')
+ listSubscriptions();
+ }, function(error) {
+ wok.message.error(error.responseJSON.reason);
+ clearSubscriptionSubmit(false);
+ });
+
+ });
+ $("#subsc-cancel", $(this)).button().click(function(event) {
+ $('#subscriptionAdd').modal('hide')
+ });
});
$("#sepStart").button().click(function() {
sepStart();
diff --git a/ui/pages/host-admin.html.tmpl b/ui/pages/host-admin.html.tmpl
index 62ac84c..42d8bca 100644
--- a/ui/pages/host-admin.html.tmpl
+++ b/ui/pages/host-admin.html.tmpl
@@ -223,7 +223,7 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA
--><span id="sepStatusLog" style="font-weight: bold;"></span><!--
--><button class="btn btn-primary" type="submit" id="sepStart">$_("Start")</button><!--
--><button class="btn btn-primary" type="submit" id="sepStop">$_("Stop")</button><!--
- --><button class="btn btn-primary add-subscription" type="submit">$_("Subscribe")</button>
+ --><button class="btn btn-primary add-subscription" type="submit" data-toggle="modal" data-target="#subscriptionAdd">$_("Subscribe")</button>
</li>
<li class='header'>
<span class="column-hostname">$_("Hostname")</span><!--
@@ -286,20 +286,33 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA
</div>
</div>
-<div id="subscriptionAdd" title='$_("Add Subscription")' class="ginger-dialog">
- <div class="subsc-add-body">
- <div class="subsc-add-label subsc-colume">
- <div class="subsc-label">$_("Hostname")</div>
- <div class="subsc-label">$_("Port")</div>
- <div class="subsc-label">$_("Community")</div>
- </div>
- <div class="subsc-add-content subsc-colume">
- <input class="subsc-input inputbox" name="hostname" /><br>
- <input class="subsc-input inputbox" name="community" /><br>
- </div>
- <div class="subsc-manage-footer">
- <button id="subsc-submit" disabled>$_("Submit")</button>
- <button id="subsc-cancel">$_("Cancel")</button>
+<!-- SEP Configuration Modal - Add Subscription -->
+<div class="modal fade host-modal" id="subscriptionAdd" tabindex="-1" role="dialog" labelledby="hostsModalLabel" aria-hidden="true">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content" >
+ <div class="modal-header">
+ <h4 class="modal-title">$_("Add Subscription")</h4>
+ </div>
+ <div class="modal-body">
+ <form id="form-subscription-add">
+ <div class="form-group">
+ <label for="hostname-textbox">$_("Hostname")</label>
+ <input type="text" class="form-control input" id="hostname-textbox" name="hostname" />
+ </div>
+ <div class="form-group">
+ <label for="port-textbox">$_("Port")</label>
+ <input type="text" class="form-control input" id="port-textbox" name="port" />
+ </div>
+ <div class="form-group">
+ <label for="community-textbox">$_("Community")</label>
+ <input type="text" class="form-control input" id="community-textbox" name="community" />
+ </div>
+ </form>
+ </div>
+ <div class="modal-footer">
+ <button type="button" id="subsc-submit" class="btn btn-default" data-dismiss="modal" disabled>$_("Submit")</button>
+ <button type="button" id="subsc-cancel" class="btn btn-default" data-dismiss="modal">$_("Cancel")</button>
+ </div>
</div>
</div>
</div>
--
1.9.3
More information about the Kimchi-devel
mailing list