Header.js 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. define([ "require", "hbs!tmpl/site/Header", "utils/CommonViewFunction", "utils/Globals", "utils/Utils", "utils/UrlLinks" ], function(require, tmpl, CommonViewFunction, Globals, Utils, UrlLinks) {
  2. "use strict";
  3. var Header = Marionette.LayoutView.extend({
  4. template: tmpl,
  5. regions: {
  6. RGlobalSearchLayoutView: "#r_globalSearchLayoutView",
  7. RFilterBrowserLayoutView: "#r_filterBrowserLayoutView"
  8. },
  9. templateHelpers: function() {
  10. return {
  11. apiDocUrl: UrlLinks.apiDocUrl(),
  12. isDebugMetricsEnabled: Globals.isDebugMetricsEnabled
  13. };
  14. },
  15. ui: {
  16. backButton: "[data-id='backButton']",
  17. menuHamburger: "[data-id='menuHamburger']",
  18. administrator: "[data-id='administrator']",
  19. showDebug: "[data-id='showDebug']",
  20. signOut: "[data-id='signOut']",
  21. uiSwitch: "[data-id='uiSwitch']"
  22. },
  23. events: function() {
  24. var events = {};
  25. return events["click " + this.ui.menuHamburger] = function() {
  26. this.setSearchBoxWidth({
  27. updateWidth: function(atlasHeaderWidth) {
  28. return $("body").hasClass("full-screen") ? atlasHeaderWidth - 350 : atlasHeaderWidth + 350;
  29. }
  30. }), $("body").toggleClass("full-screen");
  31. }, events["click " + this.ui.signOut] = function() {
  32. Utils.localStorage.setValue("last_ui_load", "v2");
  33. var path = Utils.getBaseUrl(window.location.pathname);
  34. window.location = path + "/logout.html";
  35. }, events["click " + this.ui.administrator] = function() {
  36. Utils.setUrl({
  37. url: "#!/administrator",
  38. mergeBrowserUrl: !1,
  39. trigger: !0,
  40. updateTabState: !0
  41. });
  42. }, events["click " + this.ui.showDebug] = function() {
  43. Utils.setUrl({
  44. url: "#!/debugMetrics",
  45. mergeBrowserUrl: !1,
  46. trigger: !0,
  47. updateTabState: !0
  48. });
  49. }, events["click " + this.ui.uiSwitch] = function() {
  50. var path = Utils.getBaseUrl(window.location.pathname) + "/index.html";
  51. window.location.hash.length > 2 && (path += window.location.hash), window.location.href = path;
  52. }, events;
  53. },
  54. initialize: function(options) {
  55. this.bindEvent(), this.options = options;
  56. },
  57. setSearchBoxWidth: function(options) {
  58. var atlasHeaderWidth = this.$el.find(".atlas-header").width(), minusWidth = Utils.getUrlState.isDetailPage() ? 413 : 263;
  59. options && options.updateWidth && (atlasHeaderWidth = options.updateWidth(atlasHeaderWidth)),
  60. atlasHeaderWidth > minusWidth && this.$el.find(".global-search-container").width(atlasHeaderWidth - minusWidth);
  61. },
  62. bindEvent: function() {
  63. var that = this;
  64. $(window).resize(function() {
  65. that.setSearchBoxWidth();
  66. }), $("body").on("click", ".userPopoverOptions li", function(e) {
  67. that.$(".user-dropdown").popover("hide");
  68. });
  69. },
  70. onRender: function() {
  71. var that = this;
  72. Globals.userLogedIn.status && that.$(".userName").html(Globals.userLogedIn.response.userName),
  73. this.options.fromDefaultSearch !== !0 && this.renderGlobalSearch();
  74. },
  75. onShow: function() {
  76. this.setSearchBoxWidth();
  77. },
  78. manualRender: function(options) {
  79. this.setSearchBoxWidth(), (void 0 === options || options && void 0 === options.fromDefaultSearch) && (options = _.extend({}, options, {
  80. fromDefaultSearch: !1
  81. })), _.extend(this.options, options), this.options.fromDefaultSearch === !0 ? this.$(".global-search-container>div,.global-filter-browser").hide() : (void 0 === this.RGlobalSearchLayoutView.currentView && this.renderGlobalSearch(),
  82. this.$(".global-search-container>div").show());
  83. },
  84. renderGlobalSearch: function() {
  85. var that = this;
  86. require([ "views/search/GlobalSearchLayoutView" ], function(GlobalSearchLayoutView) {
  87. that.RGlobalSearchLayoutView.show(new GlobalSearchLayoutView(that.options));
  88. });
  89. },
  90. renderFliterBrowser: function() {
  91. var that = this;
  92. require([ "views/search/SearchFilterBrowseLayoutView" ], function(SearchFilterBrowseLayoutView) {
  93. that.RFilterBrowserLayoutView.show(new SearchFilterBrowseLayoutView(_.extend({
  94. toggleLayoutClass: that.toggleLayoutClass
  95. }, that.options)));
  96. });
  97. }
  98. });
  99. return Header;
  100. });