From f0f83a862eee908c308c25561a18f8b1e218c081 Mon Sep 17 00:00:00 2001 From: "Endi S. Dewata" Date: Thu, 7 Apr 2011 16:14:58 -0500 Subject: Refactored action panel and client area. To improve code readability and extensibility the containers for action panel and client area are now created in IPA.entity.setup(). The 'client area' has been renamed into 'content'. The IPA.facet.create() has been renamed to IPA.facet.create_content(). --- install/ui/associate.js | 2 +- install/ui/details.js | 12 ++++------ install/ui/dns.js | 8 +++---- install/ui/entity.js | 50 +++++++++++++++++++++++----------------- install/ui/ipa.css | 12 ++-------- install/ui/search.js | 6 ++--- install/ui/test/details_tests.js | 8 ++++++- install/ui/test/entity_tests.js | 8 ++++++- 8 files changed, 56 insertions(+), 50 deletions(-) (limited to 'install/ui') diff --git a/install/ui/associate.js b/install/ui/associate.js index 050d8f6db..b8a7d825a 100644 --- a/install/ui/associate.js +++ b/install/ui/associate.js @@ -788,7 +788,7 @@ IPA.association_facet = function (spec) { return pkey != that.pkey; }; - that.create = function(container) { + that.create_content = function(container) { that.pkey = $.bbq.getState(that.entity_name + '-pkey', true) || ''; diff --git a/install/ui/details.js b/install/ui/details.js index 40dd6d4f8..794e19fd2 100644 --- a/install/ui/details.js +++ b/install/ui/details.js @@ -266,7 +266,7 @@ IPA.details_facet = function(spec) { that.label = ( IPA.messages && IPA.messages.facets && IPA.messages.facets.details) || spec.label; that.is_dirty = spec.is_dirty || is_dirty; - that.create = spec.create || create; + that.create_content = spec.create_content || create_content; that.setup = spec.setup || setup; that.load = spec.load || load; that.update = spec.update || IPA.details_update; @@ -323,9 +323,7 @@ IPA.details_facet = function(spec) { } }; - function create(container) { - - container.attr('title', that.entity_name); + function create_content(container) { var label = IPA.metadata.objects[that.entity_name].label; @@ -338,7 +336,7 @@ IPA.details_facet = function(spec) { appendTo(container); var details = $('
', { - 'class': 'content' + 'name': 'details' }).appendTo(container); $('', { @@ -430,7 +428,7 @@ IPA.details_facet = function(spec) { }); button.replaceWith(that.update_button); - var details = $('div.content', that.container); + var details = $('div[name=details]', that.container); var expand_all = $('a[name=expand_all]', details); expand_all.click(function() { @@ -528,7 +526,7 @@ IPA.details_facet = function(spec) { } that.details_facet_init = that.init; - that.details_facet_create = that.create; + that.details_facet_create_content = that.create_content; that.details_facet_load = that.load; return that; diff --git a/install/ui/dns.js b/install/ui/dns.js index 1af95f726..36ee2d6ef 100644 --- a/install/ui/dns.js +++ b/install/ui/dns.js @@ -282,16 +282,14 @@ IPA.records_facet = function (spec){ return pkey != that.pkey || record != that.record; }; - function create(container) { - - container.attr('title', that.entity_name); + function create_content(container) { $('

',{ }).append(IPA.create_network_spinner()). appendTo(container); var details = $('
', { - 'class': 'content' + 'name': 'details' }).appendTo(container); var div = $('
'). @@ -522,7 +520,7 @@ IPA.records_facet = function (spec){ } - that.create = create; + that.create_content = create_content; that.setup = setup; that.refresh = refresh; diff --git a/install/ui/entity.js b/install/ui/entity.js index 9e37a1271..75ec32cfa 100644 --- a/install/ui/entity.js +++ b/install/ui/entity.js @@ -36,7 +36,7 @@ IPA.facet = function (spec) { that._entity_name = spec.entity_name; that.init = spec.init || init; - that.create = spec.create || create; + that.create_content = spec.create_content || create_content; that.setup = spec.setup || setup; that.load = spec.load || load; @@ -71,7 +71,7 @@ IPA.facet = function (spec) { } } - function create(container) { + function create_content(container) { } function setup(container) { @@ -85,8 +85,8 @@ IPA.facet = function (spec) { return false; }; - that.get_client_area = function() { - return $('.client', that.container); + that.get_content = function() { + return $('.content', that.container); }; that.get_action_panel = function() { @@ -95,7 +95,8 @@ IPA.facet = function (spec) { // methods that should be invoked by subclasses that.facet_init = that.init; - that.facet_create = that.create; + that.facet_create_action_panel = that.create_action_panel; + that.facet_create_content = that.create_content; that.facet_setup = that.setup; return that; @@ -275,9 +276,20 @@ IPA.entity_setup = function (container) { container.empty(); - facet.create_action_panel(container); - facet.create(container); - container.children().last().addClass('client'); + container.attr('title', entity.name); + + var action_panel = $('
', { + 'class': 'action-panel' + }).appendTo(container); + + facet.create_action_panel(action_panel); + + var content = $('
', { + 'class': 'content' + }).appendTo(container); + + facet.create_content(content); + facet.setup(container); facet.refresh(); }; @@ -381,7 +393,7 @@ IPA. facet_create_action_panel = function(container) { if($(this).hasClass('entity-facet-disabled')){ return false; } - var this_pkey = $('input[id=pkey]', action_panel).val(); + var this_pkey = $('input[id=pkey]', container).val(); IPA.switch_and_show_page( entity_name, other_facet_name, this_pkey); @@ -392,38 +404,34 @@ IPA. facet_create_action_panel = function(container) { return li; } - var that = this; var entity_name = that.entity_name; var panel_title = IPA.metadata.objects[entity_name].label; var nested_tabs = IPA.nested_tabs(entity_name); - if (nested_tabs.length > 1){ panel_title = IPA.get_nested_tab_label(entity_name); } - var action_panel = $('
', { - "class": "action-panel", - html: $('

',{ - text: panel_title - }) + $('

', { + text: panel_title }).appendTo(container); - /*Note, for debugging purposes, it is useful to set var pkey_type = 'text';*/ var pkey_type = 'hidden'; $('', { 'type': pkey_type, id:'pkey', name:'pkey' - }).appendTo(action_panel); - var ul = $('
    ', {'class': 'action'}).appendTo(action_panel); + }).appendTo(container); + + var ul = $('
      ', {'class': 'action'}).appendTo(container); var entity = IPA.get_entity(entity_name); var facet_name = IPA.current_facet(entity); var other_facet = entity.facets[0]; var other_facet_name = other_facet.name; var main_facet = build_link(other_facet,other_facet.label); + for (var nested_index = 0 ; nested_index < nested_tabs.length; nested_index += 1){ @@ -522,9 +530,9 @@ IPA. facet_create_action_panel = function(container) { /*When we land on the search page, disable all facets that require a pkey until one is selected*/ if (facet_name === 'search'){ - $('.entity-facet', action_panel).addClass('entity-facet-disabled'); + $('.entity-facet', container).addClass('entity-facet-disabled'); } - return action_panel; + return container; }; IPA.entity_builder = function(){ diff --git a/install/ui/ipa.css b/install/ui/ipa.css index 80f347d71..a4189ac44 100644 --- a/install/ui/ipa.css +++ b/install/ui/ipa.css @@ -124,13 +124,6 @@ div.tabs { background: url("centered-bg.png") no-repeat scroll 0 8.4em transparent; } -div#content { - margin-top: 0; - position: relative; - width: 100%; -} - - ul#viewtype { padding-left: 2em; } @@ -177,8 +170,7 @@ h1 { background: -webkit-gradient(linear, left top, left bottom, from(#EEEEEE), to(#DFDFDF)); padding: 0.5em 0.9em; position: relative; - width: 40.5em; - margin-left: 1.9em; + margin-right: 0em; } h2 { @@ -742,7 +734,7 @@ a.action-button-disabled { display:inline; } -.client { +.content { font-size: 10px; margin-top: 0.4em; float: left; diff --git a/install/ui/search.js b/install/ui/search.js index dc347aa39..bd2c0f166 100644 --- a/install/ui/search.js +++ b/install/ui/search.js @@ -387,9 +387,7 @@ IPA.search_facet = function(spec) { return filter != that.filter; }; - that.create = function(container) { - - container.attr('title', that.entity_name); + that.create_content = function(container) { var span = $('', { 'name': 'search' }).appendTo(container); @@ -409,7 +407,7 @@ IPA.search_facet = function(spec) { // methods that should be invoked by subclasses that.search_facet_init = that.init; - that.search_facet_create = that.create; + that.search_facet_create_content = that.create_content; that.search_facet_setup = that.setup; diff --git a/install/ui/test/details_tests.js b/install/ui/test/details_tests.js index d3c18d435..76a752400 100644 --- a/install/ui/test/details_tests.js +++ b/install/ui/test/details_tests.js @@ -200,7 +200,13 @@ test("Testing details lifecycle: create, setup, load.", function(){ var facet = entity.get_facet('details'); facet.init(); - facet.create(container); + + var content = $('
      ', { + 'class': 'content' + }).appendTo(container); + + facet.create_content(content); + facet.setup(container); facet.load(result); diff --git a/install/ui/test/entity_tests.js b/install/ui/test/entity_tests.js index 86e44cd67..0adc091fd 100644 --- a/install/ui/test/entity_tests.js +++ b/install/ui/test/entity_tests.js @@ -74,7 +74,13 @@ test('Testing IPA.entity_set_search_definition().', function() { var facet = entity.get_facet('search'); facet.init(); - facet.create(entities_container); + + var content = $('
      ', { + 'class': 'content' + }).appendTo(entities_container); + + facet.create_content(content); + facet.setup(entities_container); -- cgit