summaryrefslogtreecommitdiffstats
path: root/install
diff options
context:
space:
mode:
authorEndi S. Dewata <edewata@redhat.com>2011-08-02 16:48:08 -0500
committerAdam Young <ayoung@redhat.com>2011-08-02 22:56:58 -0400
commit9150187ab95f272de4e3c8bc1a1fe2acf08328f8 (patch)
tree9143c67482ae77665be7b72b52acc3362ae8371c /install
parent6412e59eedf5884456110a6597e35148925e4f46 (diff)
downloadfreeipa-9150187ab95f272de4e3c8bc1a1fe2acf08328f8.zip
freeipa-9150187ab95f272de4e3c8bc1a1fe2acf08328f8.tar.gz
freeipa-9150187ab95f272de4e3c8bc1a1fe2acf08328f8.tar.xz
Resizable adder dialog box.
The tables in the adder dialog have been modified to expand according to the size of the dialog. This patch also fixes the problem with row height on IE. Ticket #1542
Diffstat (limited to 'install')
-rw-r--r--install/ui/association.js2
-rw-r--r--install/ui/dialog.js104
-rw-r--r--install/ui/ipa.css94
3 files changed, 137 insertions, 63 deletions
diff --git a/install/ui/association.js b/install/ui/association.js
index 5b8a311..3c92454 100644
--- a/install/ui/association.js
+++ b/install/ui/association.js
@@ -217,7 +217,7 @@ IPA.association_adder_dialog = function (spec) {
name: pkey_name,
label: IPA.metadata.objects[spec.other_entity].label,
primary_key: true,
- width: '200px'
+ width: '600px'
}];
}
}
diff --git a/install/ui/dialog.js b/install/ui/dialog.js
index 848252d..0a1d542 100644
--- a/install/ui/dialog.js
+++ b/install/ui/dialog.js
@@ -202,11 +202,13 @@ IPA.dialog = function(spec) {
that.create();
that.container.dialog({
- 'title': that.title,
- 'modal': true,
- 'width': that.width,
- 'height': that.height,
- 'buttons': that.buttons,
+ title: that.title,
+ modal: true,
+ width: that.width,
+ minWidth: that.width,
+ height: that.height,
+ minHeight: that.height,
+ buttons: that.buttons,
close: function(event, ui) {
that.close();
}
@@ -295,8 +297,6 @@ IPA.dialog = function(spec) {
* values from the available results.
*/
IPA.adder_dialog = function (spec) {
- var NORMAL_HEIGHT = '151px';
- var EXTERNAL_HEIGHT = '119px';
spec = spec || {};
@@ -343,16 +343,10 @@ IPA.adder_dialog = function (spec) {
};
function initialize_table(){
- var table_height = NORMAL_HEIGHT;
- if (that.external){
- table_height = EXTERNAL_HEIGHT;
- }
-
that.available_table = IPA.table_widget({
entity: that.entity,
name: 'available',
- scrollable: true,
- height: table_height
+ scrollable: true
});
var columns = that.columns.values;
@@ -361,8 +355,7 @@ IPA.adder_dialog = function (spec) {
that.selected_table = IPA.table_widget({
entity: that.entity,
name: 'selected',
- scrollable: true,
- height: NORMAL_HEIGHT
+ scrollable: true
});
that.selected_table.set_columns(columns);
@@ -377,23 +370,26 @@ IPA.adder_dialog = function (spec) {
// do not call that.dialog_create();
- var search_panel = $('<div/>', {
- 'class': 'adder-dialog-filter'
+ var container = $('<div/>', {
+ 'class': 'adder-dialog'
}).appendTo(that.container);
+ var top_panel = $('<div/>', {
+ 'class': 'adder-dialog-top'
+ }).appendTo(container);
+
$('<input/>', {
type: 'text',
- name: 'filter',
- style: 'width: 244px'
- }).appendTo(search_panel);
+ name: 'filter'
+ }).appendTo(top_panel);
- search_panel.append(' ');
+ top_panel.append(' ');
$('<input/>', {
type: 'button',
name: 'find',
value: IPA.messages.buttons.find
- }).appendTo(search_panel);
+ }).appendTo(top_panel);
$('<input/>', {
type: 'checkbox',
@@ -401,40 +397,41 @@ IPA.adder_dialog = function (spec) {
id: 'hidememb',
checked: 'checked',
style: 'margin-left: 5px; vertical-align: middle'
- }).appendTo(search_panel);
+ }).appendTo(top_panel);
- var label = $('<label/>', {
+ $('<label/>', {
'for': 'hidememb',
+ text: IPA.messages.dialogs.hide_already_enrolled,
style: 'margin-left: 3px'
- });
-
- label.text(IPA.messages.dialogs.hide_already_enrolled);
+ }).appendTo(top_panel);
- label.appendTo(search_panel);
+ top_panel.append(IPA.create_network_spinner());
- search_panel.append(IPA.create_network_spinner());
-
- var results_panel = $('<div/>', {
- 'class': 'adder-dialog-results'
- }).appendTo(that.container);
+ var left_panel = $('<div/>', {
+ 'class': 'adder-dialog-left'
+ }).appendTo(container);
var available_panel = $('<div/>', {
name: 'available',
'class': 'adder-dialog-available'
- }).appendTo(results_panel);
+ }).appendTo(left_panel);
$('<div/>', {
html: IPA.messages.dialogs.available,
- 'class': 'ui-widget-header'
+ 'class': 'adder-dialog-header ui-widget-header'
}).appendTo(available_panel);
- that.available_table.create(available_panel);
+ var available_content = $('<div/>', {
+ 'class': 'adder-dialog-content'
+ }).appendTo(available_panel);
+
+ that.available_table.create(available_content);
var buttons_panel = $('<div/>', {
name: 'buttons',
'class': 'adder-dialog-buttons'
- }).appendTo(results_panel);
+ }).appendTo(container);
var p = $('<p/>').appendTo(buttons_panel);
$('<input />', {
@@ -450,17 +447,27 @@ IPA.adder_dialog = function (spec) {
value: '>>'
}).appendTo(p);
+
+ var right_panel = $('<div/>', {
+ 'class': 'adder-dialog-right'
+ }).appendTo(container);
+
var selected_panel = $('<div/>', {
name: 'selected',
'class': 'adder-dialog-selected'
- }).appendTo(results_panel);
+ }).appendTo(right_panel);
$('<div/>', {
html: IPA.messages.dialogs.prospective,
- 'class': 'ui-widget-header'
+ 'class': 'adder-dialog-header ui-widget-header'
+ }).appendTo(selected_panel);
+
+ var selected_content = $('<div/>', {
+ 'class': 'adder-dialog-content'
}).appendTo(selected_panel);
- that.selected_table.create(selected_panel);
+ that.selected_table.create(selected_content);
+
that.filter_field = $('input[name=filter]', that.container);
@@ -498,21 +505,26 @@ IPA.adder_dialog = function (spec) {
button.replaceWith(that.add_button);
if (that.external) {
+ container.addClass('adder-dialog-with-external');
+
var external_panel = $('<div/>', {
name: 'external',
'class': 'adder-dialog-external'
- }).appendTo(results_panel);
+ }).appendTo(left_panel);
$('<div/>', {
html: IPA.messages.objects.sudorule.external,
- 'class': 'ui-widget-header'
+ 'class': 'adder-dialog-header ui-widget-header'
+ }).appendTo(external_panel);
+
+ var external_content = $('<div/>', {
+ 'class': 'adder-dialog-content'
}).appendTo(external_panel);
that.external_field = $('<input/>', {
type: 'text',
- name: 'external',
- style: 'width: 244px'
- }).appendTo(external_panel);
+ name: 'external'
+ }).appendTo(external_content);
}
diff --git a/install/ui/ipa.css b/install/ui/ipa.css
index 3239d1e..d2470bc 100644
--- a/install/ui/ipa.css
+++ b/install/ui/ipa.css
@@ -1125,14 +1125,69 @@ table.scrollable tbody {
overflow: auto;
}
-.adder-dialog-filter {
- height: 2.5em;
- padding-top: 0.7em;
+.adder-dialog {
+ position: relative;
+ width: 100%;
+ height: 100%;
}
-.adder-dialog-results {
- position: relative;
- height: 20.0em;
+.adder-dialog-top {
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ height: 3em;
+ line-height: 3em;
+}
+
+.adder-dialog-top input[name=filter] {
+ width: 244px;
+}
+
+.adder-dialog-left {
+ position: absolute;
+ top: 3.5em;
+ left: 0;
+ right: 50%;
+ bottom: 0;
+}
+
+.adder-dialog-right {
+ position: absolute;
+ top: 3.5em;
+ left: 50%;
+ right: 0;
+ bottom: 0;
+}
+
+.adder-dialog .search-table {
+ width: 100%;
+ height: 100%;
+}
+
+.adder-dialog tbody {
+ position: absolute;
+ bottom: 32px;
+ left: 3px;
+ right: 4px;
+ top: 31px;
+}
+
+.adder-dialog-header {
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ height: 1.5em;
+ line-height: 1.5em;
+}
+
+.adder-dialog-content {
+ position: absolute;
+ top: 1.5em;
+ left: 0;
+ right: 0;
+ bottom: 0;
}
.adder-dialog-available {
@@ -1142,8 +1197,11 @@ table.scrollable tbody {
top: 0;
left: 0;
bottom: 0;
- width: 23em;
- padding-top: 1em;
+ right: 3em;
+}
+
+.adder-dialog-with-external .adder-dialog-available {
+ bottom: 4em;
}
.adder-dialog-selected {
@@ -1153,16 +1211,12 @@ table.scrollable tbody {
top: 0;
right: 0;
bottom: 0;
- width: 23em;
- padding-top: 1em;
+ left: 3em;
}
.adder-dialog-buttons {
- position: absolute;
- top: 7.5em;
- left: 23em;
- right: 23em;
- bottom: 0;
+ padding-top: 10em;
+ width: 100%;
text-align: center;
}
@@ -1183,10 +1237,18 @@ table.scrollable tbody {
position: absolute;
left: 0;
bottom: 0;
- width: 23em;
+ right: 3em;
height: 4em;
}
+.adder-dialog-external .adder-dialog-content {
+ top: 1.9em;
+}
+
+.adder-dialog-external input {
+ width: 98%;
+}
+
/* ---- Widgets ---- */
.text-widget input {