[PATCH] Issue#343 & #353: Improve&Correct UI Init Logic Flow

Fixed the 2 issues: 1) When refreshing (F5) a plugin tab, default tab will be redirected then; 2) tabs.xml is requested twice. Signed-off-by: Hongliang Wang <hlwang@linux.vnet.ibm.com> --- ui/js/src/kimchi.main.js | 127 +++++++++++++++++++++++++++-------------------- 1 file changed, 72 insertions(+), 55 deletions(-) diff --git a/ui/js/src/kimchi.main.js b/ui/js/src/kimchi.main.js index aac7e28..9b0acbf 100644 --- a/ui/js/src/kimchi.main.js +++ b/ui/js/src/kimchi.main.js @@ -16,10 +16,75 @@ * limitations under the License. */ kimchi.main = function() { - var tabUrl = "/config/ui/tabs.xml"; - var DEFAULT_HASH = kimchi.getDefaultPage(tabUrl); kimchi.popable(); + var genTabs = function(tabs) { + var tabsHtml = []; + $(tabs).each(function(i, tab) { + var title = tab['title']; + var path = tab['path']; + tabsHtml.push( + '<li>', + '<a class="item" href="', path, '">', + title, + '</a>', + '</li>' + ); + }); + return tabsHtml.join(''); + }; + + var parseTabs = function(xmlData) { + var tabs = []; + $(xmlData).find('tab').each(function() { + var $tab = $(this); + var titleKey = $tab.find('title').text(); + var title = i18n[titleKey]; + var path = $tab.find('path').text(); + tabs.push({ + title: title, + path: path + }); + }); + + return tabs; + }; + + var retrieveTabs = function(url) { + var tabs; + $.ajax({ + url : url, + async : false, + success : function(xmlData) { + tabs = parseTabs(xmlData); + } + }); + return tabs; + }; + + var tabConfigUrl = '/config/ui/tabs.xml'; + var pluginConfigUrl = '/plugins/{plugin}/ui/config/tab-ext.xml'; + var DEFAULT_HASH; + var buildTabs = function(callback) { + var tabs = retrieveTabs(tabConfigUrl); + kimchi.listPlugins(function(plugins) { + $(plugins).each(function(i, p) { + var url = kimchi.template(pluginConfigUrl, { + plugin: p + }); + tabs.concat(retrieveTabs(url)); + }); + + var firstTabPath = tabs[0] && tabs[0]['path']; + DEFAULT_HASH = firstTabPath && + firstTabPath.substring(0, firstTabPath.length - 5); + + $('#nav-menu').append(genTabs(tabs)); + + callback && callback(); + }); + }; + var onLanguageChanged = function(lang) { kimchi.lang.set(lang); location.reload(); @@ -132,8 +197,6 @@ kimchi.main = function() { }); // Perform logging out via Ajax request. - - $('#btn-logout').on('click', function() { kimchi.logout(function() { updatePage(); @@ -145,9 +208,7 @@ kimchi.main = function() { $('#btn-help').on('click', kimchi.getHelp); }; - // Load i18n translation strings first and then render the page. - $('#main').load('i18n.html', function() { - kimchi.addTabs(tabUrl); + var initUI = function() { $(document).bind('ajaxError', function(event, jqXHR, ajaxSettings, errorThrown) { if (!ajaxSettings['kimchi']) { return; @@ -175,56 +236,12 @@ kimchi.main = function() { kimchi.user.showUser(true); initListeners(); updatePage(); - }); -}; - -kimchi.addTabs = function(url) { - var tabsHtml = kimchi.getTabHtml(url); - $('#nav-menu').prepend(tabsHtml); - kimchi.addExtTabs(); -}; - -kimchi.addExtTabs = function() { - kimchi.listPlugins(function(results) { - for ( var i = 0; i < results.length; i++) { - var tabsHtml = kimchi.getTabHtml("/plugins/" + results[i] + "/ui/config/tab-ext.xml"); - $('#nav-menu').append(tabsHtml); - } - }); -}; - -kimchi.getDefaultPage = function(url) { - var defautLocation = ""; - $.ajax({ - url : url, - async : false, - success : function(xmlData) { - var tab = $(xmlData).find('tab').first(); - var path = tab.find('path').text(); - if (path) { - defautLocation = path.substring(0, path.length - 5); - } - } - }); - return defautLocation; -}; + }; -kimchi.getTabHtml = function(url) { - var tabsHtml = ""; - $.ajax({ - url : url, - async : false, - success : function(xmlData) { - $(xmlData).find('tab').each(function() { - var $tab = $(this); - var titleKey = $tab.find('title').text(); - var title = i18n[titleKey]; - var path = $tab.find('path').text(); - tabsHtml += "<li><a class='item' href=" + path + ">" + title + "</a></li>"; - }); - } + // Load i18n translation strings first and then render the page. + $('#main').load('i18n.html', function() { + buildTabs(initUI); }); - return tabsHtml; }; kimchi.getHelp = function(e) { -- 1.8.1.4

Reviewed-by: Aline Manera <alinefm@linux.vnet.ibm.com> On 03/28/2014 06:30 AM, Hongliang Wang wrote:
Fixed the 2 issues: 1) When refreshing (F5) a plugin tab, default tab will be redirected then; 2) tabs.xml is requested twice.
Signed-off-by: Hongliang Wang <hlwang@linux.vnet.ibm.com> --- ui/js/src/kimchi.main.js | 127 +++++++++++++++++++++++++++-------------------- 1 file changed, 72 insertions(+), 55 deletions(-)
diff --git a/ui/js/src/kimchi.main.js b/ui/js/src/kimchi.main.js index aac7e28..9b0acbf 100644 --- a/ui/js/src/kimchi.main.js +++ b/ui/js/src/kimchi.main.js @@ -16,10 +16,75 @@ * limitations under the License. */ kimchi.main = function() { - var tabUrl = "/config/ui/tabs.xml"; - var DEFAULT_HASH = kimchi.getDefaultPage(tabUrl); kimchi.popable();
+ var genTabs = function(tabs) { + var tabsHtml = []; + $(tabs).each(function(i, tab) { + var title = tab['title']; + var path = tab['path']; + tabsHtml.push( + '<li>', + '<a class="item" href="', path, '">', + title, + '</a>', + '</li>' + ); + }); + return tabsHtml.join(''); + }; + + var parseTabs = function(xmlData) { + var tabs = []; + $(xmlData).find('tab').each(function() { + var $tab = $(this); + var titleKey = $tab.find('title').text(); + var title = i18n[titleKey]; + var path = $tab.find('path').text(); + tabs.push({ + title: title, + path: path + }); + }); + + return tabs; + }; + + var retrieveTabs = function(url) { + var tabs; + $.ajax({ + url : url, + async : false, + success : function(xmlData) { + tabs = parseTabs(xmlData); + } + }); + return tabs; + }; + + var tabConfigUrl = '/config/ui/tabs.xml'; + var pluginConfigUrl = '/plugins/{plugin}/ui/config/tab-ext.xml'; + var DEFAULT_HASH; + var buildTabs = function(callback) { + var tabs = retrieveTabs(tabConfigUrl); + kimchi.listPlugins(function(plugins) { + $(plugins).each(function(i, p) { + var url = kimchi.template(pluginConfigUrl, { + plugin: p + }); + tabs.concat(retrieveTabs(url)); + }); + + var firstTabPath = tabs[0] && tabs[0]['path']; + DEFAULT_HASH = firstTabPath && + firstTabPath.substring(0, firstTabPath.length - 5); + + $('#nav-menu').append(genTabs(tabs)); + + callback && callback(); + }); + }; + var onLanguageChanged = function(lang) { kimchi.lang.set(lang); location.reload(); @@ -132,8 +197,6 @@ kimchi.main = function() { });
// Perform logging out via Ajax request. - - $('#btn-logout').on('click', function() { kimchi.logout(function() { updatePage(); @@ -145,9 +208,7 @@ kimchi.main = function() { $('#btn-help').on('click', kimchi.getHelp); };
- // Load i18n translation strings first and then render the page. - $('#main').load('i18n.html', function() { - kimchi.addTabs(tabUrl); + var initUI = function() { $(document).bind('ajaxError', function(event, jqXHR, ajaxSettings, errorThrown) { if (!ajaxSettings['kimchi']) { return; @@ -175,56 +236,12 @@ kimchi.main = function() { kimchi.user.showUser(true); initListeners(); updatePage(); - }); -}; - -kimchi.addTabs = function(url) { - var tabsHtml = kimchi.getTabHtml(url); - $('#nav-menu').prepend(tabsHtml); - kimchi.addExtTabs(); -}; - -kimchi.addExtTabs = function() { - kimchi.listPlugins(function(results) { - for ( var i = 0; i < results.length; i++) { - var tabsHtml = kimchi.getTabHtml("/plugins/" + results[i] + "/ui/config/tab-ext.xml"); - $('#nav-menu').append(tabsHtml); - } - }); -}; - -kimchi.getDefaultPage = function(url) { - var defautLocation = ""; - $.ajax({ - url : url, - async : false, - success : function(xmlData) { - var tab = $(xmlData).find('tab').first(); - var path = tab.find('path').text(); - if (path) { - defautLocation = path.substring(0, path.length - 5); - } - } - }); - return defautLocation; -}; + };
-kimchi.getTabHtml = function(url) { - var tabsHtml = ""; - $.ajax({ - url : url, - async : false, - success : function(xmlData) { - $(xmlData).find('tab').each(function() { - var $tab = $(this); - var titleKey = $tab.find('title').text(); - var title = i18n[titleKey]; - var path = $tab.find('path').text(); - tabsHtml += "<li><a class='item' href=" + path + ">" + title + "</a></li>"; - }); - } + // Load i18n translation strings first and then render the page. + $('#main').load('i18n.html', function() { + buildTabs(initUI); }); - return tabsHtml; };
kimchi.getHelp = function(e) {
participants (2)
-
Aline Manera
-
Hongliang Wang