[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