Use entity names for tab state.

Previously the tab state is represented using numeric index such
as navigation=0&identity=1 which is not very user friendly. Now the
code has been modified to use entity names such as
navigation=identity&identity=group.
This commit is contained in:
Endi S. Dewata 2011-04-28 17:38:21 -05:00
parent 238da3dffd
commit 5eb9f088f2
11 changed files with 99 additions and 118 deletions

View File

@ -77,10 +77,7 @@ IPA.add_dialog = function (spec) {
var pkey_name = IPA.metadata.objects[that.entity_name].primary_key;
var pkey = record[pkey_name];
var state = {};
state[that.entity_name + '-facet'] = 'details';
state[that.entity_name + '-pkey'] = pkey;
$.bbq.pushState(state);
IPA.nav.show_page(that.entity_name, 'details', pkey);
}
);
});

View File

@ -288,10 +288,7 @@ IPA.association_pkey_setup = function (container, record) {
'html': value,
'click': function (value) {
return function() {
var state = IPA.tab_state(other_entity);
state[other_entity + '-facet'] = 'default';
state[other_entity + '-pkey'] = value;
$.bbq.pushState(state);
IPA.nav.show_page(other_entity, 'default', value);
return false;
};
}(value)
@ -776,10 +773,7 @@ IPA.association_facet = function (spec) {
'html': value,
'click': function (value) {
return function() {
var state = IPA.tab_state(that.other_entity);
state[that.other_entity + '-facet'] = 'default';
state[that.other_entity + '-pkey'] = value;
$.bbq.pushState(state);
IPA.nav.show_page(that.other_entity, 'default', value);
return false;
};
}(value)

View File

@ -455,7 +455,7 @@ IPA.entity_header = function(spec){
return false;
}
IPA.show_page(entity.name, 'search');
IPA.nav.show_page(entity.name, 'search');
$(that.facet_tabs).find('a').removeClass('selected');
return false;
@ -483,7 +483,7 @@ IPA.entity_header = function(spec){
return false;
}
var this_pkey = that.pkey_field.val();
IPA.show_page(
IPA.nav.show_page(
entity_name, other_facet_name,
this_pkey);
$(that.facet_tabs).find('a').removeClass('selected');

View File

@ -121,10 +121,7 @@ IPA.hbacsvcgroup_member_hbacsvc_table_widget = function (spec) {
'html': value,
'click': function (value) {
return function() {
var state = IPA.tab_state(that.other_entity);
state[that.other_entity + '-facet'] = 'details';
state[that.other_entity + '-pkey'] = value;
$.bbq.pushState(state);
IPA.nav.show_page(that.other_entity, 'details', value);
return false;
};
}(value)

View File

@ -379,10 +379,7 @@ IPA.host_managedby_host_facet = function (spec) {
'html': value,
'click': function (value) {
return function() {
var state = IPA.tab_state(that.other_entity);
state[that.other_entity + '-facet'] = 'details';
state[that.other_entity + '-pkey'] = value;
$.bbq.pushState(state);
IPA.nav.show_page(that.other_entity, 'details', value);
return false;
};
}(value)

View File

@ -185,21 +185,6 @@ var IPA = ( function () {
return true;
};
that.show_page = function(entity_name, facet_name, pkey) {
if (!IPA.test_dirty()) {
return;
}
var state = {};
if (pkey) {
state[entity_name + '-pkey'] = pkey;
}
state[entity_name + '-facet'] = facet_name;
$.bbq.pushState(state);
};
that.display_activity_icon = function() {
that.network_call_count++;
$('.network-activity-indicator').css('display','inline');

View File

@ -30,7 +30,53 @@ IPA.navigation = function(spec) {
that.container = spec.container;
that.tab_class = spec.tab_class || 'tabs';
that.tabs = spec.tabs || [];
that.tabs = [];
that.tabs_by_name = {};
that.set_tabs = function(tabs) {
that.tabs = tabs;
that.tabs_by_name = {};
for (var i=0; i<tabs.length; i++) {
that.add_tab(tabs[i]);
}
};
that.add_tab = function(tab, parent) {
if (!tab.name) {
tab.name = tab.entity;
}
tab.parent = parent;
that.tabs_by_name[tab.name] = tab;
for (var i=0; tab.children && i<tab.children.length; i++) {
that.add_tab(tab.children[i], tab);
}
};
that.get_tab = function(name) {
return that.tabs_by_name[name];
};
that.get_path_state = function(name) {
var state = {};
var tab = that.get_tab(name);
var parent = tab.parent;
while (parent) {
state[parent.name] = tab.name;
tab = parent;
parent = tab.parent;
}
state[that.container.attr('id')] = tab.name;
return state;
};
that.push_state = function(params) {
if (!IPA.test_dirty()) {
@ -48,6 +94,20 @@ IPA.navigation = function(spec) {
$.bbq.removeState(key);
};
that.show_page = function(entity_name, facet_name, pkey) {
var state = that.get_path_state(entity_name);
if (facet_name) {
state[entity_name + '-facet'] = facet_name;
}
if (pkey) {
state[entity_name + '-pkey'] = pkey;
}
that.push_state(state);
};
that.create = function() {
that._create(that.tabs, that.container, 1);
@ -56,11 +116,9 @@ IPA.navigation = function(spec) {
tabs.tabs({
select: function(event, ui) {
var panel = $(ui.panel);
var parent = panel.parent();
var id = parent.attr('id');
var state = {};
state[id] = ui.index;
return that.push_state(state);
var name = panel.attr('id');
return that.show_page(name);
}
});
};
@ -75,10 +133,6 @@ IPA.navigation = function(spec) {
for (var i=0; i<tabs.length; i++) {
var tab = tabs[i];
if (!tab.name) {
tab.name = tab.entity;
}
var label = tab.name;
if (tab.entity) {
var entity = IPA.get_entity(tab.entity);
@ -94,91 +148,55 @@ IPA.navigation = function(spec) {
label = tab.label;
}
var li = that.create_tab_li(tab.name, label);
ul.append(li);
$('<li/>').append($('<a/>', {
href: '#'+tab.name,
title: tab.name,
html: label
})).appendTo(ul);
var div = that.create_tab_div(tab.name);
container.append(div);
tab.content = $('<div/>', {
id: tab.name
}).appendTo(container);
if (tab.entity) {
div.addClass('entity-container');
tab.content.addClass('entity-container');
}
if (tab.children && tab.children.length) {
that._create(tab.children, div, depth+1);
that._create(tab.children, tab.content, depth+1);
}
}
};
that.create_tab_li = function(id, name) {
return $('<li/>').append($('<a/>', {
href: '#'+id,
title: id,
html: name
}));
};
that.create_tab_div = function(id) {
return $('<div/>', {
id: id
});
};
that.update = function() {
that._update(that.tabs, that.container, 1);
};
that._update = function(tabs, container, depth) {
var id = container.attr('id');
var index = that.get_state(id);
if (!index || index >= tabs.length) index = 0;
var parent_name = container.attr('id');
var tab_name = that.get_state(parent_name);
var index = 0;
while (index < tabs.length && tabs[index].name != tab_name) index++;
if (index >= tabs.length) index = 0;
container.tabs('select', index);
var tab = tabs[index];
var container2 = $('#' + tab.name);
if (tab.children && tab.children.length) {
that._update(tab.children, container2, depth+1);
that._update(tab.children, tab.content, depth+1);
} else if (tab.entity) {
tab.entity.setup(container2);
tab.entity.setup(tab.content);
}
};
// methods that should be invoked by subclasses
that.navigation_update = that.update;
that.set_tabs(spec.tabs);
return that;
};
IPA.tab_state = function(entity_name,tab){
var state;
var i;
var children;
var tab_name;
if (!tab){
children = IPA.nav.tabs;
tab_name = 'navigation';
}else if (tab.children){
children = tab.children;
tab_name = tab.name;
}else if (tab.entity){
if (tab.entity.name === entity_name){
state = {};
state[entity_name] = 0;
}
return state;
}
for (i = 0; i < children.length; i +=1){
state = IPA.tab_state(entity_name,children[i]);
if (state){
state[tab_name] = i;
return state;
}
}
return null;
};

View File

@ -95,7 +95,7 @@ IPA.search_widget = function (spec) {
var filter = that.filter.val();
var state = {};
state[that.entity_name + '-filter'] = filter;
$.bbq.pushState(state);
IPA.nav.push_state(state);
};
return that;
@ -166,10 +166,7 @@ IPA.search_facet = function(spec) {
'html': value,
'click': function (value) {
return function() {
var state = IPA.tab_state(that.entity_name);
state[that.entity_name + '-facet'] = 'default';
state[that.entity_name + '-pkey'] = value;
$.bbq.pushState(state);
IPA.nav.show_page(that.entity_name, 'default', value);
return false;
};
}(value)

View File

@ -369,10 +369,7 @@ IPA.service_managedby_host_facet = function(spec) {
'html': value,
'click': function (value) {
return function() {
var state = IPA.tab_state(that.other_entity);
state[that.other_entity + '-facet'] = 'details';
state[that.other_entity + '-pkey'] = value;
$.bbq.pushState(state);
IPA.nav.show_page(that.other_entity, 'details', value);
return false;
};
}(value)

View File

@ -117,7 +117,7 @@ test("Testing IPA.navigation.update() with valid index.", function() {
};
navigation.create();
navigation.push_state({"identity":1});
navigation.push_state({'identity': 'two'});
navigation.update();
same(
@ -164,7 +164,7 @@ test("Testing IPA.navigation.update() with out-of-range index.", function() {
};
navigation.create();
navigation.push_state({"identity":2});
navigation.push_state({'identity': 'three'});
navigation.update();
same(

View File

@ -85,8 +85,8 @@ IPA.self_serv_navigation = function(spec) {
var that = IPA.navigation(spec);
that.update = function() {
var pkey = $.bbq.getState('user-pkey');
var facet = $.bbq.getState('user-facet');
var pkey = that.get_state('user-pkey');
var facet = that.get_state('user-facet');
if (pkey && facet) {
that.navigation_update();
@ -96,7 +96,7 @@ IPA.self_serv_navigation = function(spec) {
'user-pkey': pkey || IPA.whoami_pkey,
'user-facet': facet || 'details'
};
$.bbq.pushState(state);
that.push_state(state);
}
};
@ -111,7 +111,6 @@ $(function() {
IPA.nav.update();
}
function create_navigation() {
var whoami = IPA.whoami;
var factory;