From 0b48fb09772160b5442c7496ea6035be8f6d8810 Mon Sep 17 00:00:00 2001 From: Stas Vilchik Date: Thu, 16 Jan 2014 14:02:27 +0600 Subject: New Issues Page: Load saved filters --- .../WEB-INF/app/views/issues/search2.html.erb | 13 +-- .../app/views/issues/templates/_header.hbs.erb | 11 +++ .../_issues_details_favorite_filter.hbs.erb | 13 +++ .../navigator/filters/ajax-select-filters.js | 28 ++++-- .../javascripts/navigator/filters/base-filters.js | 13 ++- .../navigator/filters/favorite-filters.js | 1 + .../navigator/filters/select-filters.js | 15 +++ .../webapp/javascripts/navigator/issues-app.js | 43 ++++++--- .../main/webapp/javascripts/navigator/issues.js | 106 +++++++++++++++++++-- .../src/main/webapp/stylesheets/navigator.css | 28 ++++++ .../src/main/webapp/stylesheets/navigator/base.css | 28 ++++++ .../main/webapp/stylesheets/navigator/base.less | 31 ++++++ .../src/main/webapp/stylesheets/variables.less | 1 + 13 files changed, 290 insertions(+), 41 deletions(-) create mode 100644 sonar-server/src/main/webapp/WEB-INF/app/views/issues/templates/_header.hbs.erb create mode 100644 sonar-server/src/main/webapp/WEB-INF/app/views/issues/templates/_issues_details_favorite_filter.hbs.erb (limited to 'sonar-server/src') diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/issues/search2.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/issues/search2.html.erb index 81a1393186a..5ff347b151b 100644 --- a/sonar-server/src/main/webapp/WEB-INF/app/views/issues/search2.html.erb +++ b/sonar-server/src/main/webapp/WEB-INF/app/views/issues/search2.html.erb @@ -1,28 +1,22 @@
- -
-

Issues

-
- +
-
-
- <%= render :partial => '/navigator/filter_templates' -%> +<%= render :partial => '/issues/templates/header.hbs' -%> <%= render :partial => '/issues/templates/issue.hbs' -%> <%= render :partial => '/issues/templates/issues_actions.hbs' -%> <%= render :partial => '/issues/templates/no_issues.hbs' -%> - +<%= render :partial => '/issues/templates/issues_details_favorite_filter.hbs' -%> diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/issues/templates/_issues_details_favorite_filter.hbs.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/issues/templates/_issues_details_favorite_filter.hbs.erb new file mode 100644 index 00000000000..22d0b4af753 --- /dev/null +++ b/sonar-server/src/main/webapp/WEB-INF/app/views/issues/templates/_issues_details_favorite_filter.hbs.erb @@ -0,0 +1,13 @@ + diff --git a/sonar-server/src/main/webapp/javascripts/navigator/filters/ajax-select-filters.js b/sonar-server/src/main/webapp/javascripts/navigator/filters/ajax-select-filters.js index 595354bb4ca..c68c8aaad9f 100644 --- a/sonar-server/src/main/webapp/javascripts/navigator/filters/ajax-select-filters.js +++ b/sonar-server/src/main/webapp/javascripts/navigator/filters/ajax-select-filters.js @@ -209,12 +209,20 @@ window.SS = typeof window.SS === 'object' ? window.SS : {}; if (this.choices && this.selection && value.length > 0) { this.selection.reset([]); + this.model.set({ + value: value, + enabled: true + }, { + silent: true + }); if (_.isArray(param.text) && param.text.length === value.length) { this.restoreFromText(value, param.text); } else { this.restoreByRequests(value); } + } else { + this.clear(); } }, @@ -245,12 +253,16 @@ window.SS = typeof window.SS === 'object' ? window.SS : {}; onRestore: function(value) { this.detailsView.updateLists(); - this.model.set({ - value: value, - enabled: true - }, { - silent: true - }); + this.renderBase(); + }, + + + clear: function() { + this.model.unset('value'); + if (this.selection && this.choices) { + this.choices.reset([]); + this.selection.reset([]); + } this.renderBase(); }, @@ -300,8 +312,8 @@ window.SS = typeof window.SS === 'object' ? window.SS : {}; detailsView: AjaxSelectDetailsFilterView }); - this.selection = new ProjectSuggestions(); - this.choices = new ProjectSuggestions(); + this.selection = new ComponentSuggestions(); + this.choices = new ComponentSuggestions(); }, diff --git a/sonar-server/src/main/webapp/javascripts/navigator/filters/base-filters.js b/sonar-server/src/main/webapp/javascripts/navigator/filters/base-filters.js index 1d177b58ff7..b7cf7201ea9 100644 --- a/sonar-server/src/main/webapp/javascripts/navigator/filters/base-filters.js +++ b/sonar-server/src/main/webapp/javascripts/navigator/filters/base-filters.js @@ -164,6 +164,8 @@ window.SS = typeof window.SS === 'object' ? window.SS : {}; var param = _.findWhere(q, { key: this.model.get('property') }); if (param && param.value) { this.restore(param.value, param); + } else { + this.clear(); } }, @@ -174,6 +176,11 @@ window.SS = typeof window.SS === 'object' ? window.SS : {}; }, + clear: function() { + this.model.unset('value'); + }, + + disable: function(e) { e.stopPropagation(); this.hideDetails(); @@ -222,7 +229,8 @@ window.SS = typeof window.SS === 'object' ? window.SS : {}; itemViewOptions: function() { return { - filterBarView: this + filterBarView: this, + app: this.options.app }; }, @@ -249,7 +257,8 @@ window.SS = typeof window.SS === 'object' ? window.SS : {}; render: function() { Backbone.Marionette.CompositeView.prototype.render.apply(this, arguments); - if (this.collection.where({ type: window.SS.FavoriteFilterView }).length > 0) { + if (this.collection.where({ type: window.SS.FavoriteFilterView }).length > 0 || + this.collection.where({ type: window.SS.IssuesFavoriteFilterView }).length > 0) { this.$el.addClass('navigator-filter-list-favorite'); } }, diff --git a/sonar-server/src/main/webapp/javascripts/navigator/filters/favorite-filters.js b/sonar-server/src/main/webapp/javascripts/navigator/filters/favorite-filters.js index 39d861b8a2e..04bfde2afb2 100644 --- a/sonar-server/src/main/webapp/javascripts/navigator/filters/favorite-filters.js +++ b/sonar-server/src/main/webapp/javascripts/navigator/filters/favorite-filters.js @@ -76,6 +76,7 @@ window.SS = typeof window.SS === 'object' ? window.SS : {}; */ _.extend(window.SS, { + DetailsFavoriteFilterView: DetailsFavoriteFilterView, FavoriteFilterView: FavoriteFilterView }); diff --git a/sonar-server/src/main/webapp/javascripts/navigator/filters/select-filters.js b/sonar-server/src/main/webapp/javascripts/navigator/filters/select-filters.js index d4e54059f4b..f14ca27f839 100644 --- a/sonar-server/src/main/webapp/javascripts/navigator/filters/select-filters.js +++ b/sonar-server/src/main/webapp/javascripts/navigator/filters/select-filters.js @@ -287,7 +287,22 @@ window.SS = typeof window.SS === 'object' ? window.SS : {}; }); this.renderBase(); + } else { + this.clear(); + } + }, + + + clear: function() { + var that = this; + this.model.unset('value'); + if (this.selection && this.choices) { + this.selection.each(function(m) { + that.choices.add(m); + }); + this.selection.reset([]); } + this.renderBase(); }, diff --git a/sonar-server/src/main/webapp/javascripts/navigator/issues-app.js b/sonar-server/src/main/webapp/javascripts/navigator/issues-app.js index b2e3ae5301b..d47cca1947c 100644 --- a/sonar-server/src/main/webapp/javascripts/navigator/issues-app.js +++ b/sonar-server/src/main/webapp/javascripts/navigator/issues-app.js @@ -10,6 +10,7 @@ jQuery(function() { NavigatorApp.addRegions({ + headerRegion: '.navigator-header', filtersRegion: '.navigator-filters', resultsRegion: '.navigator-results', actionsRegion: '.navigator-actions' @@ -20,6 +21,13 @@ jQuery(function() { this.issues = new window.SS.Issues(); this.issuesPage = 1; + this.favoriteFilter = new window.SS.FavoriteFilter(); + this.issuesHeaderView = new window.SS.IssuesHeaderView({ + app: this, + model: this.favoriteFilter + }); + this.headerRegion.show(this.issuesHeaderView); + this.issuesView = new window.SS.IssuesView({ collection: this.issues }); @@ -36,18 +44,6 @@ jQuery(function() { NavigatorApp.addInitializer(function() { this.filters = new window.SS.Filters(); - if (_.isObject(window.SS.favorites)) { - this.filters.add([ - new window.SS.Filter({ - type: window.SS.FavoriteFilterView, - enabled: true, - optional: false, - choices: window.SS.favorites, - favoriteUrl: '/issues/filter', - manageUrl: '/issues/manage' - })]); - } - this.filters.add([ new window.SS.Filter({ name: window.SS.phrases.project, @@ -141,6 +137,20 @@ jQuery(function() { ]); + this.favoriteFilters = new window.SS.FavoriteFilters(); + this.filters.unshift([ + new window.SS.Filter({ + type: window.SS.IssuesFavoriteFilterView, + enabled: true, + optional: false, + choices: this.favoriteFilters, + manageUrl: '/issues/manage' + })]); + this.favoriteFilters.fetch({ + reset: true + }); + + this.filterBarView = new window.SS.IssuesFilterBarView({ app: this, collection: this.filters, @@ -158,7 +168,12 @@ jQuery(function() { this.router = new window.SS.IssuesRouter({ app: this }); - Backbone.history.start() + Backbone.history.start(); + + var router = this.router; + this.favoriteFilter.on('change:query', function(model, query) { + router.navigate(query, { trigger: true }); + }); }); @@ -182,7 +197,7 @@ jQuery(function() { var queryString = _.map(fullQuery, function(v, k) { return [k, encodeURIComponent(v)].join('='); - }).join('&'); + }).join('|'); this.router.navigate(queryString); }; diff --git a/sonar-server/src/main/webapp/javascripts/navigator/issues.js b/sonar-server/src/main/webapp/javascripts/navigator/issues.js index 2bc0011f044..fea1bebe480 100644 --- a/sonar-server/src/main/webapp/javascripts/navigator/issues.js +++ b/sonar-server/src/main/webapp/javascripts/navigator/issues.js @@ -4,12 +4,7 @@ window.SS = typeof window.SS === 'object' ? window.SS : {}; jQuery(function() { - var Issue = Backbone.Model.extend({ - - }); - - - + var Issue = Backbone.Model.extend({}); var Issues = Backbone.Collection.extend({ model: Issue, @@ -40,6 +35,36 @@ jQuery(function() { + var FavoriteFilter = Backbone.Model.extend({ + + url: function() { + return baseUrl + '/api/issue_filters/show/' + this.get('id'); + }, + + + parse: function(r) { + return r.filter ? r.filter : r; + } + }); + + + + var FavoriteFilters = Backbone.Collection.extend({ + model: FavoriteFilter, + + + url: function() { + return baseUrl + '/api/issue_filters/favorites'; + }, + + + parse: function(r) { + return r.favoriteFilters; + } + }); + + + var IssueView = Backbone.Marionette.ItemView.extend({ template: Handlebars.compile(jQuery('#issue-template').html() || ''), tagName: 'li', @@ -220,6 +245,69 @@ jQuery(function() { + var IssuesHeaderView = Backbone.Marionette.ItemView.extend({ + template: Handlebars.compile(jQuery('#issues-header-template').html() || ''), + + + modelEvents: { + 'change': 'render' + }, + + + events: { + 'click #issues-new-search': 'newSearch' + }, + + + newSearch: function() { + this.options.app.router.navigate('', { trigger: true }); + } + + }); + + + + var IssuesDetailsFavoriteFilterView = window.SS.DetailsFavoriteFilterView.extend({ + template: Handlebars.compile(jQuery('#issues-details-favorite-filter-template').html() || ''), + + + applyFavorite: function(e) { + var id = $j(e.target).data('id'), + filter = this.model.get('choices').get(id), + app = this.options.filterView.options.app; + + filter.fetch({ + success: function() { + app.favoriteFilter.set(filter.toJSON()); + } + }); + + this.options.filterView.hideDetails(); + }, + + + serializeData: function() { + return _.extend({}, this.model.toJSON(), { + items: this.model.get('choices').toJSON() + }); + } + }); + + + + var IssuesFavoriteFilterView = window.SS.FavoriteFilterView.extend({ + + initialize: function() { + window.SS.BaseFilterView.prototype.initialize.call(this, { + detailsView: IssuesDetailsFavoriteFilterView + }); + + this.listenTo(this.model.get('choices'), 'reset', this.render); + } + }); + + + var IssuesRouter = Backbone.Router.extend({ routes: { @@ -234,7 +322,7 @@ jQuery(function() { index: function(query) { - var params = (query || '').split('&').map(function(t) { + var params = (query || '').split('|').map(function(t) { return { key: t.split('=')[0], value: decodeURIComponent(t.split('=')[1]) @@ -255,10 +343,14 @@ jQuery(function() { _.extend(window.SS, { Issue: Issue, Issues: Issues, + FavoriteFilter: FavoriteFilter, + FavoriteFilters: FavoriteFilters, IssueView: IssueView, IssuesView: IssuesView, IssuesActionsView: IssuesActionsView, IssuesFilterBarView: IssuesFilterBarView, + IssuesHeaderView: IssuesHeaderView, + IssuesFavoriteFilterView: IssuesFavoriteFilterView, IssuesRouter: IssuesRouter }); diff --git a/sonar-server/src/main/webapp/stylesheets/navigator.css b/sonar-server/src/main/webapp/stylesheets/navigator.css index 456acc9d921..ce63a7ec412 100644 --- a/sonar-server/src/main/webapp/stylesheets/navigator.css +++ b/sonar-server/src/main/webapp/stylesheets/navigator.css @@ -73,11 +73,39 @@ padding: 0 10px; border-bottom: 1px solid #cdcdcd; background-color: #efefef; + font-size: 0; } .navigator-header-title { + position: relative; + top: -2px; + display: inline-block; + vertical-align: middle; font-size: 20px; line-height: 34px; } +.navigator-header-actions { + display: inline-block; + vertical-align: middle; + margin-left: 24px; +} +.navigator-header-actions > button { + position: relative; + z-index: 2; + display: inline-block; + vertical-align: middle; + margin: 0; + padding: 2px 8px; + font-size: 11px; + font-weight: normal; + cursor: pointer; +} +.navigator-header-actions > button:hover, +.navigator-header-actions > button:focus { + z-index: 3; +} +.navigator-header-actions > button + button { + left: -1px; +} .navigator-results { border-right: 1px solid #e1e1e1; background-color: #ffffff; diff --git a/sonar-server/src/main/webapp/stylesheets/navigator/base.css b/sonar-server/src/main/webapp/stylesheets/navigator/base.css index 4d4430bf99f..2db6f1fd15a 100644 --- a/sonar-server/src/main/webapp/stylesheets/navigator/base.css +++ b/sonar-server/src/main/webapp/stylesheets/navigator/base.css @@ -73,11 +73,39 @@ padding: 0 10px; border-bottom: 1px solid #cdcdcd; background-color: #efefef; + font-size: 0; } .navigator-header-title { + position: relative; + top: -2px; + display: inline-block; + vertical-align: middle; font-size: 20px; line-height: 34px; } +.navigator-header-actions { + display: inline-block; + vertical-align: middle; + margin-left: 24px; +} +.navigator-header-actions > button { + position: relative; + z-index: 2; + display: inline-block; + vertical-align: middle; + margin: 0; + padding: 2px 8px; + font-size: 11px; + font-weight: normal; + cursor: pointer; +} +.navigator-header-actions > button:hover, +.navigator-header-actions > button:focus { + z-index: 3; +} +.navigator-header-actions > button + button { + left: -1px; +} .navigator-results { border-right: 1px solid #e1e1e1; background-color: #ffffff; diff --git a/sonar-server/src/main/webapp/stylesheets/navigator/base.less b/sonar-server/src/main/webapp/stylesheets/navigator/base.less index 98f1d5fe0a0..2546e347716 100644 --- a/sonar-server/src/main/webapp/stylesheets/navigator/base.less +++ b/sonar-server/src/main/webapp/stylesheets/navigator/base.less @@ -71,13 +71,44 @@ padding: 0 @navigatorPadding; border-bottom: 1px solid @navigatorBorderColor; background-color: @navigatorBarBackground; + font-size: 0; } .navigator-header-title { + position: relative; + top: -2px; + display: inline-block; + vertical-align: middle; font-size: 20px; line-height: @navigatorHeaderHeight; } +.navigator-header-actions { + display: inline-block; + vertical-align: middle; + margin-left: 24px; + + & > button { + position: relative; + z-index: 2; + display: inline-block; + vertical-align: middle; + margin: 0; + padding: 2px 8px; + font-size: @smallFontSize; + font-weight: normal; + cursor: pointer; + + &:hover, &:focus { + z-index: 3; + } + } + + & > button + button { + left: -1px; + } +} + // Results diff --git a/sonar-server/src/main/webapp/stylesheets/variables.less b/sonar-server/src/main/webapp/stylesheets/variables.less index b57b91b5fbd..51d6da6a405 100644 --- a/sonar-server/src/main/webapp/stylesheets/variables.less +++ b/sonar-server/src/main/webapp/stylesheets/variables.less @@ -4,6 +4,7 @@ @baseFontSize: 13px; @baseFontColor: #444; +@smallFontSize: 11px; -- cgit v1.2.3