From: Stas Vilchik Date: Sun, 2 Mar 2014 16:01:09 +0000 (+0100) Subject: SONAR-4366 Create initial layout on fly X-Git-Tag: 4.3~628 X-Git-Url: https://source.dussan.org/?a=commitdiff_plain;h=fc6319f6987103e869393c7fc418558d0cd03b8c;p=sonarqube.git SONAR-4366 Create initial layout on fly --- diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/quality_gates/index.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/quality_gates/index.html.erb index b3f04ae1e0a..b7533d0d9ee 100644 --- a/sonar-server/src/main/webapp/WEB-INF/app/views/quality_gates/index.html.erb +++ b/sonar-server/src/main/webapp/WEB-INF/app/views/quality_gates/index.html.erb @@ -2,13 +2,11 @@ <% end %> -
-
-
-
-
+
+
+<%= render :partial => '/quality_gates/templates/quality_gates_layout.hbs' -%> <%= render :partial => '/quality_gates/templates/quality_gate_sidebar_list_item_template.hbs' -%> <%= render :partial => '/quality_gates/templates/quality_gate_actions_template.hbs' -%> <%= render :partial => '/quality_gates/templates/quality_gate_edit_template.hbs' -%> diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/quality_gates/templates/_quality_gates_layout.hbs.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/quality_gates/templates/_quality_gates_layout.hbs.erb new file mode 100644 index 00000000000..97713cf86e4 --- /dev/null +++ b/sonar-server/src/main/webapp/WEB-INF/app/views/quality_gates/templates/_quality_gates_layout.hbs.erb @@ -0,0 +1,6 @@ + diff --git a/sonar-server/src/main/webapp/javascripts/quality-gate/app.coffee b/sonar-server/src/main/webapp/javascripts/quality-gate/app.coffee index 9346cb288c0..b2884874d53 100644 --- a/sonar-server/src/main/webapp/javascripts/quality-gate/app.coffee +++ b/sonar-server/src/main/webapp/javascripts/quality-gate/app.coffee @@ -29,7 +29,8 @@ requirejs [ 'quality-gate/views/quality-gate-sidebar-list-view', 'quality-gate/views/quality-gate-actions-view', 'quality-gate/views/quality-gate-edit-view', - 'quality-gate/router' + 'quality-gate/router', + 'quality-gate/layout', 'common/handlebars-extensions' ], ( Backbone, Marionette, Handlebars, @@ -38,7 +39,8 @@ requirejs [ QualityGateSidebarListItemView, QualityGateActionsView, QualityGateEditView, - QualityGateRouter + QualityGateRouter, + QualityGateLayout ) -> # Create a generic error handler for ajax requests @@ -62,7 +64,7 @@ requirejs [ if @qualityGates.length > 0 @router.navigate "show/#{@qualityGates.models[0].get('id')}", trigger: true else - App.contentRegion.reset() + App.layout.contentRegion.reset() App.deleteQualityGate = (id) -> App.qualityGates.remove id @@ -72,25 +74,23 @@ requirejs [ App.qualityGates.each (gate) -> gate.set('default', false) unless gate.id == id - # Define page regions - App.addRegions - headerRegion: '.navigator-header' - actionsRegion: '.navigator-actions' - listRegion: '.navigator-results' - detailsRegion: '.navigator-details' + # Construct layout + App.addInitializer -> + @layout = new QualityGateLayout + jQuery('body').append @layout.render().el # Construct actions bar App.addInitializer -> @qualityGateActionsView = new QualityGateActionsView app: @ - @actionsRegion.show @qualityGateActionsView + @layout.actionsRegion.show @qualityGateActionsView # Construct sidebar App.addInitializer -> @qualityGateSidebarListView = new QualityGateSidebarListItemView collection: @qualityGates app: @ - @listRegion.show @qualityGateSidebarListView + @layout.listRegion.show @qualityGateSidebarListView # Construct edit view App.addInitializer -> diff --git a/sonar-server/src/main/webapp/javascripts/quality-gate/app.js b/sonar-server/src/main/webapp/javascripts/quality-gate/app.js index 98e67daedfe..63301e4b418 100644 --- a/sonar-server/src/main/webapp/javascripts/quality-gate/app.js +++ b/sonar-server/src/main/webapp/javascripts/quality-gate/app.js @@ -29,7 +29,7 @@ } }); - requirejs(['backbone', 'backbone.marionette', 'handlebars', 'quality-gate/collections/quality-gates', 'quality-gate/collections/metrics', 'quality-gate/views/quality-gate-sidebar-list-view', 'quality-gate/views/quality-gate-actions-view', 'quality-gate/views/quality-gate-edit-view', 'quality-gate/router', 'common/handlebars-extensions'], function(Backbone, Marionette, Handlebars, QualityGates, Metrics, QualityGateSidebarListItemView, QualityGateActionsView, QualityGateEditView, QualityGateRouter) { + requirejs(['backbone', 'backbone.marionette', 'handlebars', 'quality-gate/collections/quality-gates', 'quality-gate/collections/metrics', 'quality-gate/views/quality-gate-sidebar-list-view', 'quality-gate/views/quality-gate-actions-view', 'quality-gate/views/quality-gate-edit-view', 'quality-gate/router', 'quality-gate/layout', 'common/handlebars-extensions'], function(Backbone, Marionette, Handlebars, QualityGates, Metrics, QualityGateSidebarListItemView, QualityGateActionsView, QualityGateEditView, QualityGateRouter, QualityGateLayout) { var App; jQuery.ajaxSetup({ error: function(jqXHR) { @@ -51,7 +51,7 @@ trigger: true }); } else { - return App.contentRegion.reset(); + return App.layout.contentRegion.reset(); } }; App.deleteQualityGate = function(id) { @@ -65,24 +65,22 @@ } }); }; - App.addRegions({ - headerRegion: '.navigator-header', - actionsRegion: '.navigator-actions', - listRegion: '.navigator-results', - detailsRegion: '.navigator-details' + App.addInitializer(function() { + this.layout = new QualityGateLayout; + return jQuery('body').append(this.layout.render().el); }); App.addInitializer(function() { this.qualityGateActionsView = new QualityGateActionsView({ app: this }); - return this.actionsRegion.show(this.qualityGateActionsView); + return this.layout.actionsRegion.show(this.qualityGateActionsView); }); App.addInitializer(function() { this.qualityGateSidebarListView = new QualityGateSidebarListItemView({ collection: this.qualityGates, app: this }); - return this.listRegion.show(this.qualityGateSidebarListView); + return this.layout.listRegion.show(this.qualityGateSidebarListView); }); App.addInitializer(function() { this.qualityGateEditView = new QualityGateEditView({ diff --git a/sonar-server/src/main/webapp/javascripts/quality-gate/layout.coffee b/sonar-server/src/main/webapp/javascripts/quality-gate/layout.coffee new file mode 100644 index 00000000000..6b0ef9175fe --- /dev/null +++ b/sonar-server/src/main/webapp/javascripts/quality-gate/layout.coffee @@ -0,0 +1,15 @@ +define [ + 'backbone.marionette', + 'common/handlebars-extensions' +], ( + Marionette +) -> + + class AppLayout extends Marionette.Layout + className: 'navigator quality-gates-navigator' + template: getTemplate '#quality-gates-layout' + regions: + headerRegion: '.navigator-header' + actionsRegion: '.navigator-actions' + listRegion: '.navigator-results' + detailsRegion: '.navigator-details' diff --git a/sonar-server/src/main/webapp/javascripts/quality-gate/router.coffee b/sonar-server/src/main/webapp/javascripts/quality-gate/router.coffee index b42539c7373..f21161a97bf 100644 --- a/sonar-server/src/main/webapp/javascripts/quality-gate/router.coffee +++ b/sonar-server/src/main/webapp/javascripts/quality-gate/router.coffee @@ -28,12 +28,12 @@ define [ qualityGateDetailHeaderView = new QualityGateDetailHeaderView app: @app model: qualityGate - @app.headerRegion.show qualityGateDetailHeaderView + @app.layout.headerRegion.show qualityGateDetailHeaderView qualityGateDetailView = new QualityGateDetailView app: @app model: qualityGate - @app.detailsRegion.show qualityGateDetailView + @app.layout.detailsRegion.show qualityGateDetailView qualityGateDetailView.$el.hide() qualityGateDetailHeaderView.showSpinner() diff --git a/sonar-server/src/main/webapp/javascripts/quality-gate/router.js b/sonar-server/src/main/webapp/javascripts/quality-gate/router.js index 998123bce29..3ffdf8f2947 100644 --- a/sonar-server/src/main/webapp/javascripts/quality-gate/router.js +++ b/sonar-server/src/main/webapp/javascripts/quality-gate/router.js @@ -30,12 +30,12 @@ app: this.app, model: qualityGate }); - this.app.headerRegion.show(qualityGateDetailHeaderView); + this.app.layout.headerRegion.show(qualityGateDetailHeaderView); qualityGateDetailView = new QualityGateDetailView({ app: this.app, model: qualityGate }); - this.app.detailsRegion.show(qualityGateDetailView); + this.app.layout.detailsRegion.show(qualityGateDetailView); qualityGateDetailView.$el.hide(); qualityGateDetailHeaderView.showSpinner(); return qualityGate.fetch().done(function() { diff --git a/sonar-server/src/main/webapp/stylesheets/quality-gates.css b/sonar-server/src/main/webapp/stylesheets/quality-gates.css index 6110fbb5b0b..a188ce71186 100644 --- a/sonar-server/src/main/webapp/stylesheets/quality-gates.css +++ b/sonar-server/src/main/webapp/stylesheets/quality-gates.css @@ -340,6 +340,9 @@ .navigator-page #ftlinks { margin-top: 0; } +.quality-gate-page-loader { + padding: 10px 0 0 10px; +} .quality-gates-navigator .navigator-header { left: 320px; border-bottom-color: #e1e1e1; diff --git a/sonar-server/src/main/webapp/stylesheets/quality-gates.less b/sonar-server/src/main/webapp/stylesheets/quality-gates.less index c16f58b053b..e95ef5e1b79 100644 --- a/sonar-server/src/main/webapp/stylesheets/quality-gates.less +++ b/sonar-server/src/main/webapp/stylesheets/quality-gates.less @@ -2,6 +2,10 @@ @import "mixins"; @import "navigator/base"; +.quality-gate-page-loader { + padding: @navigatorPadding 0 0 @navigatorPadding; +} + .quality-gates-navigator { .navigator-header {