[Kimchi-devel] [PATCH v3 5/5] [UI] Repository Management - Integrate into Host Tab

Hongliang Wang hlwang at linux.vnet.ibm.com
Thu Mar 13 09:18:50 UTC 2014


Integrate add/enable/disalbe/edit/remove a repository feature into host tab.

Signed-off-by: Hongliang Wang <hlwang at linux.vnet.ibm.com>
---
 po/POTFILES.in                |   2 +
 ui/css/theme-default/host.css |  40 ++++++++++
 ui/js/src/kimchi.host.js      | 170 ++++++++++++++++++++++++++++++++++++++++++
 ui/pages/tabs/host.html.tmpl  |  13 ++++
 4 files changed, 225 insertions(+)

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/host.css b/ui/css/theme-default/host.css
index 0f8b941..98c63da 100644
--- a/ui/css/theme-default/host.css
+++ b/ui/css/theme-default/host.css
@@ -253,3 +253,43 @@
     width: 846px;
 }
 /* End of Software Updates */
+
+/* Repository */
+.host-panel #repositories-grid {
+    border-color: #ddd;
+    height: 200px;
+    width: 850px;
+}
+
+.repository-id {
+    width: 70px;
+}
+
+.repository-name {
+    width: 180px;
+}
+
+.repository-baseurl {
+    width: 300px;
+}
+
+.repository-ismirror {
+    width: 60px;
+}
+
+.repository-urlargs {
+    width: 70px;
+}
+
+.repository-enabled {
+    width: 60px;
+}
+
+.repository-gpgcheck {
+    width: 60px;
+}
+
+.repository-gpgkey {
+    width: 300px;
+}
+/* End of Repository */
diff --git a/ui/js/src/kimchi.host.js b/ui/js/src/kimchi.host.js
index 6300f37..bb07333 100644
--- a/ui/js/src/kimchi.host.js
+++ b/ui/js/src/kimchi.host.js
@@ -22,6 +22,157 @@ kimchi.host_main = function() {
         $(header).attr('aria-expanded', toExpand ? 'true' : 'false');
     };
 
+    var repositoriesGridID = 'repositories-grid';
+    var repositoriesGrid = null;
+    var initRepositoriesGrid = function(repositories) {
+        repositoriesGrid = new kimchi.widget.Grid({
+            container: 'repositories-grid-container',
+            id: repositoriesGridID,
+            title: i18n['KCHREPO6003M'],
+            toolbarButtons: [{
+                id: repositoriesGridID + '-add-button',
+                label: i18n['KCHREPO6012M'],
+                onClick: function(event) {
+                    kimchi.window.open('repository-add.html');
+                }
+            }, {
+                id: repositoriesGridID + '-enable-button',
+                label: i18n['KCHREPO6016M'],
+                disabled: true,
+                onClick: function(event) {
+                    var repository = repositoriesGrid.getSelected();
+                    if(!repository) {
+                        return;
+                    }
+                    var name = repository['repo_id'];
+                    var enable = !repository['enabled'];
+                    $(this).prop('disabled', true);
+                    kimchi.enableRepository(name, enable, function() {
+                        kimchi.topic('kimchi/repositoryUpdated').publish();
+                    });
+                }
+            }, {
+                id: repositoriesGridID + '-edit-button',
+                label: i18n['KCHREPO6013M'],
+                disabled: true,
+                onClick: function(event) {
+                    var repository = repositoriesGrid.getSelected();
+                    if(!repository) {
+                        return;
+                    }
+                    kimchi.selectedRepository = repository['repo_id'];
+                    kimchi.window.open('repository-edit.html');
+                }
+            }, {
+                id: repositoriesGridID + '-remove-button',
+                label: i18n['KCHREPO6014M'],
+                disabled: true,
+                onClick: function(event) {
+                    var repository = repositoriesGrid.getSelected();
+                    if(!repository) {
+                        return;
+                    }
+
+                    var settings = {
+                        title : i18n['KCHREPO6001M'],
+                        content : i18n['KCHREPO6002M'],
+                        confirm : i18n['KCHAPI6004M'],
+                        cancel : i18n['KCHAPI6003M']
+                    };
+
+                    kimchi.confirm(settings, function() {
+                        kimchi.deleteRepository(
+                            repository['repo_id'],
+                            function(result) {
+                                kimchi.topic('kimchi/repositoryDeleted').publish(result);
+                            }, function(error) {
+                            }
+                        );
+                    });
+                }
+            }],
+            onRowSelected: function(row) {
+                var repository = repositoriesGrid.getSelected();
+                if(!repository) {
+                    return;
+                }
+
+                $('#' + repositoriesGridID + '-remove-button')
+                    .prop('disabled', false);
+                $('#' + repositoriesGridID + '-edit-button')
+                    .prop('disabled', false);
+
+                var enabled = repository['enabled'];
+                $('#' + repositoriesGridID + '-enable-button')
+                    .text(i18n[enabled ? 'KCHREPO6017M' : 'KCHREPO6016M'])
+                    .prop('disabled', false);
+            },
+            frozenFields: [],
+            fields: [{
+                name: 'repo_id',
+                label: i18n['KCHREPO6004M'],
+                'class': 'repository-id'
+            }, {
+                name: 'repo_name',
+                label: i18n['KCHREPO6005M'],
+                'class': 'repository-name'
+            }, {
+                name: 'enabled',
+                label: i18n['KCHREPO6009M'],
+                'class': 'repository-enabled'
+            }, {
+                name: 'baseurl',
+                label: i18n['KCHREPO6006M'],
+                makeTitle: true,
+                'class': 'repository-baseurl'
+            }, {
+                name: 'url_args',
+                label: i18n['KCHREPO6008M'],
+                'class': 'repository-urlargs'
+            }, {
+                name: 'is_mirror',
+                label: i18n['KCHREPO6007M'],
+                'class': 'repository-ismirror'
+            }, {
+                name: 'gpgcheck',
+                label: i18n['KCHREPO6010M'],
+                'class': 'repository-gpgcheck'
+            }, {
+                name: 'gpgkey',
+                label: i18n['KCHREPO6011M'],
+                'class': 'repository-gpgkey'
+            }],
+            data: listRepositories
+        });
+    };
+
+    var listRepositories = function(gridCallback) {
+        kimchi.listRepositories(function(repositories) {
+            $.each(repositories, function(i, item) {
+                repositories[i]['rowno'] = i + 1;
+            });
+
+            if($.isFunction(gridCallback)) {
+                gridCallback(repositories);
+            }
+            else {
+                if(repositoriesGrid) {
+                    repositoriesGrid.setData(repositories);
+                }
+                else {
+                    initRepositoriesGrid(repositories);
+                }
+            }
+        });
+
+        $('#' + repositoriesGridID + '-remove-button')
+            .prop('disabled', true);
+        $('#' + repositoriesGridID + '-edit-button')
+            .prop('disabled', true);
+        $('#' + repositoriesGridID + '-enable-button')
+            .prop('disabled', true);
+    };
+
     var softwareUpdatesGridID = 'software-updates-grid';
     var softwareUpdatesGrid = null;
     var progressAreaID = 'software-updates-progress-textarea';
@@ -271,6 +422,17 @@ kimchi.host_main = function() {
         });
 
         kimchi.getCapabilities(function(capabilities) {
+            if(capabilities['repo_mngt_tool']) {
+                $('#repository-management-section').removeClass('hidden');
+                initRepositoriesGrid();
+                kimchi.topic('kimchi/repositoryAdded')
+                    .subscribe(listRepositories);
+                kimchi.topic('kimchi/repositoryUpdated')
+                    .subscribe(listRepositories);
+                kimchi.topic('kimchi/repositoryDeleted')
+                    .subscribe(listRepositories);
+            }
+
             if(capabilities['update_tool']) {
                 $('#software-update-section').removeClass('hidden');
                 initSoftwareUpdatesGrid();
@@ -552,6 +714,14 @@ kimchi.host_main = function() {
             delete kimchi.hostTimer;
         }
 
+        repositoriesGrid && repositoriesGrid.destroy();
+        kimchi.topic('kimchi/repositoryAdded')
+            .unsubscribe(listRepositories);
+        kimchi.topic('kimchi/repositoryUpdated')
+            .unsubscribe(listRepositories);
+        kimchi.topic('kimchi/repositoryDeleted')
+            .unsubscribe(listRepositories);
+
         softwareUpdatesGrid && softwareUpdatesGrid.destroy();
         kimchi.topic('kimchi/softwareUpdated').unsubscribe(listSoftwareUpdates);
 
diff --git a/ui/pages/tabs/host.html.tmpl b/ui/pages/tabs/host.html.tmpl
index 179deba..4933b31 100644
--- a/ui/pages/tabs/host.html.tmpl
+++ b/ui/pages/tabs/host.html.tmpl
@@ -120,6 +120,19 @@
                     </div>
                 </div>
             </div>
+            <div id="repositories-section" class="host-section">
+                <h3 class="section-header"
+                    aria-controls="content-repositories">
+                    $_("Repositories")
+                </h3>
+                <div id="content-repositories" class="section-content">
+                    <div class="section-row">
+                        <div class="section-value">
+                            <div id="repositories-grid-container"></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
             <div id="software-update-section" class="host-section hidden">
                 <h3 class="section-header"
                     aria-controls="content-software-update">
-- 
1.8.1.4




More information about the Kimchi-devel mailing list