[Kimchi-devel] [PATCH 5/6] Debug Report Rename UI: Add Rename Page
Hongliang Wang
hlwang at linux.vnet.ibm.com
Wed May 21 09:09:17 UTC 2014
Added rename page including HTML, CSS, and JS.
Signed-off-by: Hongliang Wang <hlwang at linux.vnet.ibm.com>
---
ui/css/theme-default/report-rename.css | 22 ++++++++++++++
ui/js/src/kimchi.report_rename_main.js | 39 +++++++++++++++++++++++++
ui/pages/report-rename.html.tmpl | 53 ++++++++++++++++++++++++++++++++++
3 files changed, 114 insertions(+)
create mode 100644 ui/css/theme-default/report-rename.css
create mode 100644 ui/js/src/kimchi.report_rename_main.js
create mode 100644 ui/pages/report-rename.html.tmpl
diff --git a/ui/css/theme-default/report-rename.css b/ui/css/theme-default/report-rename.css
new file mode 100644
index 0000000..959d577
--- /dev/null
+++ b/ui/css/theme-default/report-rename.css
@@ -0,0 +1,22 @@
+#report-rename-window {
+ height: 300px;
+ width: 400px;
+}
+
+#report-rename-window .field {
+ font-size: 12px;
+}
+
+#report-name-textbox {
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+ margin: .5em 0;
+ width: 100%;
+}
+
+#button-report-rename[disabled] {
+ background: #c0c0c0 url(../../images/theme-default/loading.gif) 7px
+ center no-repeat;
+ color: #DDD;
+ prenameing-left: 26px;
+}
diff --git a/ui/js/src/kimchi.report_rename_main.js b/ui/js/src/kimchi.report_rename_main.js
new file mode 100644
index 0000000..3bb5020
--- /dev/null
+++ b/ui/js/src/kimchi.report_rename_main.js
@@ -0,0 +1,39 @@
+kimchi.report_rename_main = function() {
+ var renameReportForm = $('#form-report-rename');
+ var submitButton = $('#button-report-rename');
+ var nameTextbox = $('input[name="name"]', renameReportForm);
+ var submitForm = function(event) {
+ if(submitButton.prop('disabled')) {
+ return false;
+ }
+ var reportName = nameTextbox.val();
+ var validator = RegExp("^[A-Za-z0-9-]*$");
+ if (!validator.test(reportName)) {
+ kimchi.message.error.code('KCHDR6011M');
+ return false;
+ }
+ var formData = renameReportForm.serializeObject();
+ submitButton.prop('disabled', true);
+ nameTextbox.prop('disabled', true);
+ kimchi.renameReport(kimchi.selectedReport, formData, function(result) {
+ kimchi.window.close();
+ kimchi.topic('kimchi/debugReportRenamed').publish({
+ result: result
+ });
+ }, function(result) {
+ var errText = result &&
+ result['responseJSON'] &&
+ result['responseJSON']['reason'];
+ kimchi.message.error(errText);
+ submitButton.prop('disabled', false);
+ nameTextbox.prop('disabled', false).focus();
+ });
+
+ event.preventDefault();
+ };
+
+ renameReportForm.on('submit', submitForm);
+ submitButton.on('click', submitForm);
+
+ nameTextbox.val(kimchi.selectedReport).select();
+};
diff --git a/ui/pages/report-rename.html.tmpl b/ui/pages/report-rename.html.tmpl
new file mode 100644
index 0000000..7fab0b6
--- /dev/null
+++ b/ui/pages/report-rename.html.tmpl
@@ -0,0 +1,53 @@
+#*
+ * Project Kimchi
+ *
+ * Copyright IBM, Corp. 2013
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *#
+#unicode UTF-8
+#import gettext
+#from kimchi.cachebust import href
+#silent t = gettext.translation($lang.domain, $lang.localedir, languages=$lang.lang)
+#silent _ = t.gettext
+#silent _t = t.gettext
+<!DOCTYPE html>
+<div id="report-rename-window" class="window">
+ <header>
+ <h1 class="title">$_("Rename a Debug Report")</h1>
+ <div class="close">X</div>
+ </header>
+ <div class="content">
+ <form id="form-report-rename">
+ <section class="form-section">
+ <h2>
+ <label for="report-name-textbox">$_("Report Name")</label>
+ </h2>
+ <div class="field">
+ <span>
+ $_("The name used to identify the report. Name can contain: letters, digits and hyphen (\"-\").")
+ </span>
+ <input type="text" class="text" id="report-name-textbox" name="name" />
+ </div>
+ </section>
+ </form>
+ </div>
+ <footer>
+ <div class="btn-group">
+ <button id="button-report-rename" class="btn-normal"><span class="text">$_("Submit")</span></button>
+ </div>
+ </footer>
+</div>
+<script>
+ kimchi.report_rename_main();
+</script>
--
1.8.1.4
More information about the Kimchi-devel
mailing list