/Src/Bowerbird.Website/js/bowerbird/views/homePrivateView.js

https://github.com/Bowerbird/bowerbird-web · JavaScript · 229 lines · 169 code · 48 blank · 12 comment · 15 complexity · e717a1ded943d35236545a11d7d9acf6 MD5 · raw file

  1. /// <reference path="../../libs/log.js" />
  2. /// <reference path="../../libs/require/require.js" />
  3. /// <reference path="../../libs/jquery/jquery-1.7.2.js" />
  4. /// <reference path="../../libs/underscore/underscore.js" />
  5. /// <reference path="../../libs/backbone/backbone.js" />
  6. /// <reference path="../../libs/backbone.marionette/backbone.marionette.js" />
  7. // HomePrivateView
  8. // ---------------
  9. // The home page view when logged in
  10. define(['jquery', 'underscore', 'backbone', 'app', 'views/activitylistview', 'views/sightinglistview', 'views/postlistview', 'views/sightingsearchpanelview', 'views/postsearchpanelview'],
  11. function ($, _, Backbone, app, ActivityListView, SightingListView, PostListView, SightingSearchPanelView, PostSearchPanelView) {
  12. var HomePrivateView = Backbone.Marionette.Layout.extend({
  13. viewType: 'detail',
  14. className: 'home-private double',
  15. template: 'HomePrivateIndex',
  16. regions: {
  17. summary: '.summary',
  18. search: '.search',
  19. list: '.list'
  20. },
  21. events: {
  22. 'click .activities-tab-button': 'showActivityTabSelection',
  23. 'click .sightings-tab-button': 'showSightingsTabSelection',
  24. 'click .posts-tab-button': 'showPostsTabSelection'
  25. },
  26. initialize: function () {
  27. _.bindAll(this, 'toggleSearchPanel');
  28. },
  29. serializeData: function () {
  30. return {
  31. Model: {
  32. User: this.model.toJSON(),
  33. ShowUserWelcome: _.contains(app.authenticatedUser.callsToAction, 'user-welcome'),
  34. ShowActivities: this.activeTab === 'activities' || this.activeTab === '',
  35. ShowSightings: this.activeTab === 'sightings',
  36. ShowPosts: this.activeTab === 'posts'
  37. }
  38. };
  39. },
  40. activeTab: '',
  41. onShow: function () {
  42. this._showDetails();
  43. },
  44. showBootstrappedDetails: function () {
  45. this.initializeRegions();
  46. this._showDetails();
  47. },
  48. _showDetails: function () {
  49. var that = this;
  50. this.$el.find('.close-call-to-action').on('click', function (e) {
  51. e.preventDefault();
  52. that.$el.find('.call-to-action').slideUp('fast', function () {
  53. that.$el.find('.call-to-action').remove();
  54. });
  55. app.vent.trigger('close-call-to-action', 'user-welcome');
  56. return false;
  57. });
  58. },
  59. showActivityTabSelection: function (e) {
  60. e.preventDefault();
  61. this.showTabSelection('activities', $(e.currentTarget).attr('href'));
  62. },
  63. showSightingsTabSelection: function (e) {
  64. e.preventDefault();
  65. this.showTabSelection('sightings', $(e.currentTarget).attr('href'));
  66. },
  67. showPostsTabSelection: function (e) {
  68. e.preventDefault();
  69. this.showTabSelection('posts', $(e.currentTarget).attr('href'));
  70. },
  71. showTabSelection: function (tab, url) {
  72. if (this.activeTab === tab) {
  73. return;
  74. }
  75. this.switchTabHighlight(tab);
  76. this.list.currentView.showLoading();
  77. Backbone.history.navigate(url, { trigger: true });
  78. },
  79. showActivity: function (activityCollection) {
  80. this.switchTabHighlight('activities');
  81. var options = {
  82. model: this.model,
  83. collection: activityCollection,
  84. isHomeStream: true
  85. };
  86. if (app.isPrerenderingView('home')) {
  87. options['el'] = '.list > div';
  88. }
  89. var activityListView = new ActivityListView(options);
  90. if (app.isPrerenderingView('home')) {
  91. this.list.attachView(activityListView);
  92. activityListView.showBootstrappedDetails();
  93. } else {
  94. this.list.show(activityListView);
  95. }
  96. },
  97. showSightings: function (sightingCollection, categorySelectList, fieldSelectList) {
  98. this.switchTabHighlight('sightings');
  99. var options = {
  100. model: this.model,
  101. collection: sightingCollection
  102. };
  103. var searchOptions = {
  104. sightingCollection: sightingCollection,
  105. categorySelectList: categorySelectList,
  106. fieldSelectList: fieldSelectList
  107. };
  108. if (app.isPrerenderingView('home')) {
  109. options['el'] = '.list > div';
  110. searchOptions['el'] = '.search > div';
  111. }
  112. var sightingListView = new SightingListView(options);
  113. var sightingSearchPanelView = new SightingSearchPanelView(searchOptions);
  114. if (app.isPrerenderingView('home')) {
  115. this.list.attachView(sightingListView);
  116. sightingListView.showBootstrappedDetails();
  117. this.search.attachView(sightingSearchPanelView);
  118. sightingSearchPanelView.showBootstrappedDetails();
  119. } else {
  120. this.list.show(sightingListView);
  121. this.search.show(sightingSearchPanelView);
  122. }
  123. sightingListView.on('toggle-search', this.toggleSearchPanel);
  124. if (sightingCollection.hasSearchCriteria()) {
  125. this.$el.find('.search-bar').slideDown();
  126. }
  127. },
  128. showPosts: function (postCollection, fieldSelectList) {
  129. this.switchTabHighlight('posts');
  130. var options = {
  131. model: this.model,
  132. collection: postCollection
  133. };
  134. var searchOptions = {
  135. postCollection: postCollection,
  136. fieldSelectList: fieldSelectList
  137. };
  138. if (app.isPrerenderingView('home')) {
  139. options['el'] = '.list > div';
  140. searchOptions['el'] = '.search > div';
  141. }
  142. var postListView = new PostListView(options);
  143. var postSearchPanelView = new PostSearchPanelView(searchOptions);
  144. if (app.isPrerenderingView('home')) {
  145. this.list.attachView(postListView);
  146. postListView.showBootstrappedDetails();
  147. this.search.attachView(postSearchPanelView);
  148. postSearchPanelView.showBootstrappedDetails();
  149. } else {
  150. this.list.show(postListView);
  151. this.search.show(postSearchPanelView);
  152. }
  153. postListView.on('toggle-search', this.toggleSearchPanel);
  154. if (postCollection.hasSearchCriteria()) {
  155. this.$el.find('.search-bar').slideDown();
  156. }
  157. },
  158. switchTabHighlight: function (tab) {
  159. this.activeTab = tab;
  160. this.$el.find('.tab-button').removeClass('selected');
  161. this.$el.find('.' + tab + '-tab-button').addClass('selected');
  162. // if (tab === 'activities' && this.search.currentView) {
  163. // this.search.currentView.$el.hide();
  164. // }
  165. },
  166. toggleSearchPanel: function () {
  167. log('search bar', this.$el.find('.search-bar'));
  168. if (this.$el.find('.search-bar').is(':visible')) {
  169. log('search is visible');
  170. this.$el.find('.search-bar').slideToggle();
  171. } else {
  172. log('search is not visible');
  173. var that = this;
  174. this.$el.find('.search-bar').slideToggle(function () {
  175. that.$el.find('.search-bar #query').focus();
  176. });
  177. }
  178. }
  179. });
  180. return HomePrivateView;
  181. });