[Kimchi-devel] [PATCH v2 3/4] Add/Edit Repository Support

Hongliang Wang hlwang at linux.vnet.ibm.com
Tue Mar 11 10:17:34 UTC 2014


Repositories management support:
1) Add a repository
2) Edit a repository

Signed-off-by: Hongliang Wang <hlwang at linux.vnet.ibm.com>
---
 po/POTFILES.in                           |   2 +
 ui/css/theme-default/repository-add.css  |  39 ++++++++++
 ui/css/theme-default/repository-edit.css |  69 ++++++++++++++++++
 ui/js/src/kimchi.repository_add_main.js  |  84 +++++++++++++++++++++
 ui/js/src/kimchi.repository_edit_main.js |  85 ++++++++++++++++++++++
 ui/pages/repository-add.html.tmpl        | 104 ++++++++++++++++++++++++++
 ui/pages/repository-edit.html.tmpl       | 121 +++++++++++++++++++++++++++++++
 7 files changed, 504 insertions(+)
 create mode 100644 ui/css/theme-default/repository-add.css
 create mode 100644 ui/css/theme-default/repository-edit.css
 create mode 100644 ui/js/src/kimchi.repository_add_main.js
 create mode 100644 ui/js/src/kimchi.repository_edit_main.js
 create mode 100644 ui/pages/repository-add.html.tmpl
 create mode 100644 ui/pages/repository-edit.html.tmpl

diff --git a/po/POTFILES.in b/po/POTFILES.in
index 4ff7eaa..955a675 100644
--- a/po/POTFILES.in
+++ b/po/POTFILES.in
@@ -7,6 +7,8 @@ ui/pages/i18n.html.tmpl
 ui/pages/kimchi-ui.html.tmpl
 ui/pages/login-window.html.tmpl
 ui/pages/report-add.html.tmpl
+ui/pages/repository-add.html.tmpl
+ui/pages/repository-edit.html.tmpl
 ui/pages/storagepool-add.html.tmpl
 ui/pages/tabs/guests.html.tmpl
 ui/pages/tabs/host.html.tmpl
diff --git a/ui/css/theme-default/repository-add.css b/ui/css/theme-default/repository-add.css
new file mode 100644
index 0000000..2434efd
--- /dev/null
+++ b/ui/css/theme-default/repository-add.css
@@ -0,0 +1,39 @@
+/*
+ * Project Kimchi
+ *
+ * Copyright IBM, Corp. 2013
+ *
+ * Authors:
+ *  Hongliang Wang <hlwang at linux.vnet.ibm.com>
+ *
+ * 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.
+ */
+#repository-add-window {
+    height: 680px;
+    width: 1000px;
+}
+
+#repository-add-window .required {
+    color: red;
+    padding-left: 5px;
+    vertical-align: top;
+}
+
+#repository-add-window .textbox-wrapper input[type="text"] {
+    box-sizing: border-box;
+    width: 100%;
+}
+
+#repository-add-window .textbox-wrapper label {
+    vertical-align: middle;
+}
diff --git a/ui/css/theme-default/repository-edit.css b/ui/css/theme-default/repository-edit.css
new file mode 100644
index 0000000..ee6ad2e
--- /dev/null
+++ b/ui/css/theme-default/repository-edit.css
@@ -0,0 +1,69 @@
+/*
+ * Project Kimchi
+ *
+ * Copyright IBM, Corp. 2013
+ *
+ * Authors:
+ *  Hongliang Wang <hlwang at linux.vnet.ibm.com>
+ *
+ * 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.
+ */
+#repository-edit-window {
+    height: 420px;
+    width: 1000px;
+}
+
+.repository-edit-fieldset {
+    float: left;
+    padding: 1em;
+}
+
+.repository-edit-wrapper-label, .repository-edit-wrapper-controls {
+    display: inline-block;
+    height: 38px;
+    line-height: 38px;
+    margin-top: 5px;
+    vertical-align: top;
+}
+
+.repository-edit-wrapper-label {
+    width: 150px;
+}
+
+.repository-edit-wrapper-controls label {
+    vertical-align: middle;
+}
+
+.repository-edit-wrapper-controls {
+    width: 300px;
+}
+
+.repository-edit-wrapper-controls input[type="text"] {
+    font-size: 16px;
+    height: 38px;
+    line-height: 38px;
+    background: #fff;
+    -webkit-border-radius: 5px;
+    border-radius: 5px;
+    box-shadow: 2px 2px 2px #eee inset;
+    border-top: 1px solid #bbb;
+    border-left: 1px solid #bbb;
+    padding: 0 10px;
+    width: 250px;
+}
+
+.repository-edit-wrapper-controls input[type="text"][disabled] {
+    color: #bbb;
+    background-color: #fafafa;
+    cursor: not-allowed;
+}
diff --git a/ui/js/src/kimchi.repository_add_main.js b/ui/js/src/kimchi.repository_add_main.js
new file mode 100644
index 0000000..75b785e
--- /dev/null
+++ b/ui/js/src/kimchi.repository_add_main.js
@@ -0,0 +1,84 @@
+/*
+ * Project Kimchi
+ *
+ * Copyright IBM, Corp. 2013
+ *
+ * Authors:
+ *  Hongliang Wang <hlwang at linux.vnet.ibm.com>
+ *
+ * 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.
+ */
+kimchi.repository_add_main = function() {
+
+    var addForm = $('#form-repository-add');
+    var addButton = $('#button-repository-add');
+
+    var nameBox = $('input[name="repo_id"]', addForm);
+    var urlBox = $('input[name="baseurl"]', addForm);
+    var isMirrorButton = $('input[name="is_mirror"]', addForm);
+    var urlArgsBox = $('input[name="url_args"]', addForm);
+    var gpgkeyBox = $('input[name="gpgkey"]', addForm);
+
+    var validateForm = function(event) {
+        var valid = $(urlBox).val() !== '';
+        $(addButton).prop('disabled', !valid);
+        return valid;
+    };
+
+    $(urlBox).on('input propertychange', validateForm);
+
+    var booleanFields = ['is_mirror'];
+
+    var addRepository = function(event) {
+        var valid = validateForm();
+        if(!valid) {
+            return false;
+        }
+
+        var formData = $(addForm).serializeObject();
+        for(var p in formData) {
+            if(formData[p] == '') {
+                delete formData[p];
+            }
+        }
+
+        $(booleanFields).each(function(i, f) {
+            switch(formData[f]) {
+            case 'true':
+                formData[f] = true;
+                break;
+            case 'false':
+                formData[f] = false;
+                break;
+            default:
+                delete formData[f];
+                break;
+            }
+        });
+
+        kimchi.createRepository(formData, function() {
+            kimchi.topic('kimchi/repositoryAdded').publish();
+            kimchi.window.close();
+        }, function(jqXHR, textStatus, errorThrown) {
+            var reason = jqXHR &&
+                jqXHR['responseJSON'] &&
+                jqXHR['responseJSON']['reason'];
+            reason = reason ? ': ' + reason : '';
+            kimchi.message.error(i18n['KCHREPO6015M'] + reason);
+        });
+
+        return false;
+    };
+
+    $(addForm).on('submit', addRepository);
+};
diff --git a/ui/js/src/kimchi.repository_edit_main.js b/ui/js/src/kimchi.repository_edit_main.js
new file mode 100644
index 0000000..0ab008e
--- /dev/null
+++ b/ui/js/src/kimchi.repository_edit_main.js
@@ -0,0 +1,85 @@
+/*
+ * 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.
+ */
+kimchi.repository_edit_main = function() {
+
+    var editForm = $('#form-repository-edit');
+    var saveButton = $('#repository-edit-button-save');
+
+    kimchi.retrieveRepository(kimchi.selectedRepository, function(repository) {
+        for(var prop in repository) {
+            var control = $('input[name="' + prop + '"]', editForm);
+            switch($(control).attr('type')) {
+            case 'text':
+                $(control).val(repository[prop]);
+                break;
+            case 'radio':
+            case 'checkbox':
+                $(control).each(function(i, c) {
+                    var matched = ('' + repository[prop]) == $(c).val();
+                    $(c).prop('checked', matched);
+                });
+                break;
+            default:
+                break;
+            }
+
+        }
+
+        $('input', editForm).on('input propertychange', function(event) {
+            if($(this).val() !== '') {
+                $(saveButton).prop('disabled', false);
+            }
+        });
+    });
+
+    var booleanFields = ['is_mirror', 'gpgcheck'];
+
+    var editRepository = function(event) {
+        var formData = $(editForm).serializeObject();
+
+        $(booleanFields).each(function(i, f) {
+            switch(formData[f]) {
+            case 'true':
+                formData[f] = true;
+                break;
+            case 'false':
+                formData[f] = false;
+                break;
+            default:
+                delete formData[f];
+                break;
+            }
+        });
+
+        kimchi.updateRepository(kimchi.selectedRepository, formData, function() {
+            kimchi.topic('kimchi/repositoryUpdated').publish();
+            kimchi.window.close();
+        }, function(jqXHR, textStatus, errorThrown) {
+            var reason = jqXHR &&
+                jqXHR['responseJSON'] &&
+                jqXHR['responseJSON']['reason'];
+            reason = reason ? ': ' + reason : '';
+            kimchi.message.error(i18n['KCHREPO6015M'] + reason);
+        });
+
+        return false;
+    };
+
+    $(editForm).on('submit', editRepository);
+    $(saveButton).on('click', editRepository);
+};
diff --git a/ui/pages/repository-add.html.tmpl b/ui/pages/repository-add.html.tmpl
new file mode 100644
index 0000000..a170f1d
--- /dev/null
+++ b/ui/pages/repository-add.html.tmpl
@@ -0,0 +1,104 @@
+#*
+ * Project Kimchi
+ *
+ * Copyright IBM, Corp. 2013
+ *
+ * Authors:
+ *  Hongliang Wang <hlwang at linux.vnet.ibm.com>
+ *
+ * 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
+<div id="repository-add-window" class="window">
+    <form id="form-repository-add">
+        <header class="window-header">
+            <h1 class="title">$_("Add a Repository")</h1>
+            <div class="close">X</div>
+        </header>
+        <div class="content">
+            <section class="form-section">
+                <h2>1. $_("Name")</h2>
+                <div class="field">
+                    <p class="text-help">
+                        $_("Unique repository name for each repository, one word.")
+                    </p>
+                    <div class="textbox-wrapper">
+                        <input type="text" class="text" name="repo_id" />
+                    </div>
+                </div>
+            </section>
+            <section class="form-section">
+                <h2>2. $_("Base URL")<span class="required" role="presentation" title="$_("Required Field")">*</span></h2>
+                <div class="field">
+                    <p class="text-help">
+                        $_("URL to the repodata directory when \"is_mirror\" is false. Otherwise, it can be URL to the mirror system for YUM. Can be an http://, ftp:// or file://  URL.")
+                    </p>
+                    <div class="textbox-wrapper">
+                        <input type="text" class="text" name="baseurl" />
+                    </div>
+                </div>
+            </section>
+            <section class="form-section">
+                <h2>3. $_("Is Mirror")</h2>
+                <div class="field">
+                    <p class="text-help">
+                        $_("Set the given URI of baseurl as a mirror list, instead of use baseurl in repository configuration.")
+                    </p>
+                    <div class="textbox-wrapper">
+                        <input type="radio" id="isMirrorRadioTrue" name="is_mirror" value="true" />
+                        <label for="isMirrorRadioTrue">$_("Yes")</label>
+                        <input type="radio" id="isMirrorRadioFalse" name="is_mirror" value="false" />
+                        <label for="isMirrorRadioFalse">$_("No")</label>
+                    </div>
+                </div>
+            </section>
+            <section class="form-section">
+                <h2>4. $_("URL Args")</h2>
+                <div class="field">
+                    <p class="text-help">
+                        $_("Arguments to be passed to baseurl, like the list of APT repositories provided by the same baseurl.")
+                    </p>
+                    <div class="textbox-wrapper">
+                        <input type="text" class="text" name="url_args" />
+                    </div>
+                </div>
+            </section>
+            <section class="form-section">
+                <h2>5. $_("GPG Key")</h2>
+                <div class="field">
+                    <p class="text-help">
+                        $_("URL pointing to the ASCII-armored GPG key file for the repository. This option is used if yum needs a public key to verify a package and the required key hasn't been imported into the RPM database.")
+                    </p>
+                    <div class="textbox-wrapper">
+                        <input type="text" class="text" name="gpgkey" />
+                    </div>
+                </div>
+            </section>
+        </div>
+        <footer>
+            <div class="btn-group">
+                <button type="submit" id="button-repository-add" class="btn-normal" disabled="disabled">
+                    <span class="text">$_("Add")</span>
+                </button>
+            </div>
+        </footer>
+    </form>
+</div>
+<script>
+    kimchi.repository_add_main();
+</script>
diff --git a/ui/pages/repository-edit.html.tmpl b/ui/pages/repository-edit.html.tmpl
new file mode 100644
index 0000000..9adf0a1
--- /dev/null
+++ b/ui/pages/repository-edit.html.tmpl
@@ -0,0 +1,121 @@
+#*
+ * 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
+
+<div id="repository-edit-window" class="window">
+    <header>
+        <h1 class="title">$_("Edit Repository")</h1>
+        <div class="close">X</div>
+    </header>
+    <div class="content">
+        <form id="form-repository-edit">
+            <fieldset class="repository-edit-fieldset">
+                <div>
+                    <div class="repository-edit-wrapper-label">
+                        <label for="repository-edit-id-textbox">$_("ID")</label>
+                    </div>
+                    <div class="repository-edit-wrapper-controls">
+                        <input id="repository-edit-id-textbox" name="repo_id" type="text" />
+                    </div>
+                </div>
+                <div>
+                    <div class="repository-edit-wrapper-label">
+                        <label for="repository-edit-name-textbox">$_("Name")</label>
+                    </div>
+                    <div class="repository-edit-wrapper-controls">
+                        <input id="repository-edit-name-textbox" name="repo_name" type="text" />
+                    </div>
+                </div>
+                <div>
+                    <div class="repository-edit-wrapper-label">
+                        <label>$_("Enabled")</label>
+                    </div>
+                    <div class="repository-edit-wrapper-controls">
+                        <input id="repository-edit-enabled-radio-true" name="enabled" type="radio" value="true" disabled="disabled" />
+                        <label for="repository-edit-enabled-radio-true">$_("Yes")</label>
+                        <input id="repository-edit-enabled-radio-false" name="enabled" type="radio" value="false" disabled="disabled" />
+                        <label for="repository-edit-enabled-radio-false">$_("No")</label>
+                    </div>
+                </div>
+                <div>
+                    <div class="repository-edit-wrapper-label">
+                        <label for="repository-edit-baseurl-textbox">$_("Base URL")</label>
+                    </div>
+                    <div class="repository-edit-wrapper-controls">
+                        <input id="repository-edit-baseurl-textbox" name="baseurl" type="text" />
+                    </div>
+                </div>
+            </fieldset>
+            <fieldset class="repository-edit-fieldset">
+                <div>
+                    <div class="repository-edit-wrapper-label">
+                        <label for="repository-edit-urlargs-textbox">$_("URL Args")</label>
+                    </div>
+                    <div class="repository-edit-wrapper-controls">
+                        <input id="repository-edit-urlargs-textbox" name="url_args" type="text" />
+                    </div>
+                </div>
+                <div>
+                    <div class="repository-edit-wrapper-label">
+                        <label>$_("Is Mirror")</label>
+                    </div>
+                    <div class="repository-edit-wrapper-controls">
+                        <input id="repository-edit-ismirror-radio-true" name="is_mirror" type="radio" value="true" />
+                        <label for="repository-edit-ismirror-radio-true">$_("Yes")</label>
+                        <input id="repository-edit-ismirror-radio-false" name="is_mirror" type="radio" value="false" />
+                        <label for="repository-edit-ismirror-radio-false">$_("No")</label>
+                    </div>
+                </div>
+                <div>
+                    <div class="repository-edit-wrapper-label">
+                        <label>$_("GPG Check")</label>
+                    </div>
+                    <div class="repository-edit-wrapper-controls">
+                        <input id="repository-edit-gpgcheck-radio-true" name="gpgcheck" type="radio" value="true" />
+                        <label for="repository-edit-gpgcheck-radio-true">$_("Yes")</label>
+                        <input id="repository-edit-gpgcheck-radio-false" name="gpgcheck" type="radio" value="false" />
+                        <label for="repository-edit-gpgcheck-radio-false">$_("No")</label>
+                    </div>
+                </div>
+                <div>
+                    <div class="repository-edit-wrapper-label">
+                        <label for="repository-edit-gpgkey-textbox">$_("GPG Key")</label>
+                    </div>
+                    <div class="repository-edit-wrapper-controls">
+                        <input id="repository-edit-gpgkey-textbox" name="gpgkey" type="text" />
+                    </div>
+                </div>
+            </fieldset>
+        </form>
+    </div>
+    <footer>
+        <div class="btn-group">
+            <button id="repository-edit-button-save" class="btn-normal">
+                <span class="text">$_("Save")</span>
+            </button>
+        </div>
+    </footer>
+</div>
+<script type="text/javascript">
+    kimchi.repository_edit_main();
+</script>
-- 
1.8.1.4




More information about the Kimchi-devel mailing list