diff --git a/src/mmw/js/src/data_catalog/controllers.js b/src/mmw/js/src/data_catalog/controllers.js
index 4766e74f0..caf8fa829 100644
--- a/src/mmw/js/src/data_catalog/controllers.js
+++ b/src/mmw/js/src/data_catalog/controllers.js
@@ -44,11 +44,14 @@ var DataCatalogController = {
})
]);
- var view = new views.DataCatalogWindow({
- model: form,
- collection: catalogs
- });
- App.rootView.sidebarRegion.show(view);
+ var resultsWindow = new views.ResultsWindow({
+ model: form,
+ collection: catalogs
+ }),
+ header = new views.HeaderView();
+
+ App.rootView.subHeaderRegion.show(header);
+ App.rootView.sidebarRegion.show(resultsWindow);
},
dataCatalogCleanUp: function() {
diff --git a/src/mmw/js/src/data_catalog/templates/header.html b/src/mmw/js/src/data_catalog/templates/header.html
new file mode 100644
index 000000000..7db9a1db6
--- /dev/null
+++ b/src/mmw/js/src/data_catalog/templates/header.html
@@ -0,0 +1,29 @@
+
diff --git a/src/mmw/js/src/data_catalog/templates/resultsWindow.html b/src/mmw/js/src/data_catalog/templates/resultsWindow.html
new file mode 100644
index 000000000..34e1e7548
--- /dev/null
+++ b/src/mmw/js/src/data_catalog/templates/resultsWindow.html
@@ -0,0 +1,6 @@
+
diff --git a/src/mmw/js/src/data_catalog/views.js b/src/mmw/js/src/data_catalog/views.js
index 5e9674cc6..e93aea984 100644
--- a/src/mmw/js/src/data_catalog/views.js
+++ b/src/mmw/js/src/data_catalog/views.js
@@ -5,6 +5,7 @@ var $ = require('jquery'),
Marionette = require('../../shim/backbone.marionette'),
moment = require('moment'),
App = require('../app'),
+ analyzeViews = require('../analyze/views.js'),
settings = require('../core/settings'),
utils = require('./utils'),
errorTmpl = require('./templates/error.html'),
@@ -14,7 +15,9 @@ var $ = require('jquery'),
cuahsiSearchResultTmpl = require('./templates/cuahsiSearchResult.html'),
tabContentTmpl = require('./templates/tabContent.html'),
tabPanelTmpl = require('./templates/tabPanel.html'),
- windowTmpl = require('./templates/window.html');
+ headerTmpl = require('./templates/header.html'),
+ windowTmpl = require('./templates/window.html'),
+ resultsWindowTmpl = require('./templates/resultsWindow.html');
var ENTER_KEYCODE = 13,
PAGE_SIZE = settings.get('data_catalog_page_size'),
@@ -24,6 +27,44 @@ var ENTER_KEYCODE = 13,
cuahsi: cuahsiSearchResultTmpl,
};
+var HeaderView = Marionette.LayoutView.extend({
+ template: headerTmpl,
+
+ templateHelpers: function() {
+ return {
+ aoiName: App.map.get('areaOfInterestName')
+ };
+ }
+});
+
+var ResultsWindow = Marionette.LayoutView.extend({
+ id: 'model-output-wrapper',
+ tagName: 'div',
+ template: resultsWindowTmpl,
+
+ regions: {
+ analyzeRegion: '#analyze-tab-contents',
+ dataCatalogRegion: '#data-catalog-tab-contents'
+ },
+
+ onShow: function() {
+ var analyzeCollection = App.getAnalyzeCollection();
+
+ this.analyzeRegion.show(new analyzeViews.AnalyzeWindow({
+ collection: analyzeCollection
+ }));
+
+ this.dataCatalogRegion.show(new DataCatalogWindow({
+ model: this.model,
+ collection: this.collection
+ }));
+ },
+
+ onRender: function() {
+ this.$el.find('.tab-pane:last').addClass('active');
+ }
+});
+
var DataCatalogWindow = Marionette.LayoutView.extend({
template: windowTmpl,
className: 'data-catalog-window',
@@ -365,15 +406,15 @@ var PagerView = Marionette.ItemView.extend({
},
templateHelpers: function() {
- var resultCount = this.model.get('resultCount'),
- page = this.model.get('page'),
- lastPage = Math.ceil(resultCount / PAGE_SIZE);
+ var resultCount = this.model.get('resultCount'),
+ page = this.model.get('page'),
+ lastPage = Math.ceil(resultCount / PAGE_SIZE);
- return {
- has_results: resultCount > 0,
- has_previous: page > 1,
- has_next: page < lastPage,
- };
+ return {
+ has_results: resultCount > 0,
+ has_previous: page > 1,
+ has_next: page < lastPage,
+ };
},
previousPage: function() {
@@ -386,5 +427,6 @@ var PagerView = Marionette.ItemView.extend({
});
module.exports = {
- DataCatalogWindow: DataCatalogWindow
+ HeaderView: HeaderView,
+ ResultsWindow: ResultsWindow
};
diff --git a/src/mmw/sass/base/_header.scss b/src/mmw/sass/base/_header.scss
index c28c0a291..c62846ac1 100644
--- a/src/mmw/sass/base/_header.scss
+++ b/src/mmw/sass/base/_header.scss
@@ -82,6 +82,10 @@ header {
background-color: $ui-secondary;
height: $height-xl*2;
+ &.bigcz {
+ height: $height-xl;
+ }
+
.project {
position: relative;
top: -15px;
diff --git a/src/mmw/sass/components/_tabs.scss b/src/mmw/sass/components/_tabs.scss
index 935b661a8..676134046 100644
--- a/src/mmw/sass/components/_tabs.scss
+++ b/src/mmw/sass/components/_tabs.scss
@@ -57,6 +57,13 @@
}
}
+.data-catalog-stage-results-tab-pane {
+ .tab-content {
+ // Set a specific height to allow y-scroll:
+ height: 100% !important;
+ }
+}
+
//Model Output Tabs
.output-tabs-wrapper {
.nav-tabs {
diff --git a/src/mmw/sass/pages/_data-catalog.scss b/src/mmw/sass/pages/_data-catalog.scss
index 1c6bbef50..8d437cb3c 100644
--- a/src/mmw/sass/pages/_data-catalog.scss
+++ b/src/mmw/sass/pages/_data-catalog.scss
@@ -6,7 +6,7 @@
flex-direction: column;
position: absolute;
bottom: 0;
- top: 44px;
+ top: 90px;
.tab-contents-region {
background-color: rgba(0, 0, 0, 0.06);
@@ -16,6 +16,8 @@
}
.result-region {
+ height: auto !important;
+ width: auto !important;
padding: 6px 0px;
&.paginated {