CR1

client/app/assets/css/redash.css

@@ -345,6 +345,15 @@ counter-renderer counter-target {
   display: block;
 }
 
+counter-renderer value .ruler,
+counter-renderer counter-target .ruler {
+  display: inline-block;
+  font: inherit;
+  line-height: inherit;
+  margin: 0;
+  padding: 0;
+}
+
 counter-renderer counter-target {
   color: #ccc;
 }
@@ -715,3 +724,7 @@ div.table-name:hover {
   height: 400px;
   overflow: hidden;
 }
+
+visualization-renderer .pagination {
+  margin: 0;
+}

client/app/config/dashboard-grid-options.js

@@ -19,7 +19,7 @@ const dashboardGridOptions = {
   defaultSizeY: 3,
   minSizeX: 1,
   maxSizeX: null,
-  minSizeY: 1,
+  minSizeY: 4,
   maxSizeY: null,
   resizable: {
     enabled: false,

client/app/directives/gridster-auto-height.js

@@ -17,9 +17,18 @@ function gridsterAutoHeight($timeout) {
           .first()
           .value();
         if (element) {
-          const additionalHeight = 100 + _.last(controller.gridster.margins);
+          const childrenBounds = _.chain(element.children)
+            .map(child => child.getBoundingClientRect())
+            .reduce((result, bounds) => ({
+              left: Math.min(result.left, bounds.left),
+              top: Math.min(result.top, bounds.top),
+              right: Math.min(result.right, bounds.right),
+              bottom: Math.min(result.bottom, bounds.bottom),
+            }))
+            .value();
 
-          const contentsHeight = element.scrollHeight;
+          const additionalHeight = 100 + _.last(controller.gridster.margins);
+          const contentsHeight = childrenBounds.bottom - childrenBounds.top;
           $timeout(() => {
             controller.sizeY = Math.ceil((contentsHeight + additionalHeight) /
               controller.gridster.curRowHeight);

client/app/pages/dashboards/dashboard.html

@@ -81,7 +81,7 @@
     <div gridster="$ctrl.dashboardGridOptions" class="dashboard-wrapper"
       ng-class="{'preview-mode': !$ctrl.layoutEditing, 'editing-mode': $ctrl.layoutEditing}">
       <div ng-repeat="widget in $ctrl.dashboard.widgets" gridster-item="widget.options.position"
-        gridster-auto-height="counter, .scrollbox, .spinner-container">
+        gridster-auto-height=".scrollbox, .spinner-container">
         <dashboard-widget widget="widget" dashboard="$ctrl.dashboard" on-delete="$ctrl.removeWidget()"></dashboard-widget>
       </div>
     </div>

client/app/pages/dashboards/public-dashboard-page.html

@@ -18,7 +18,7 @@
   <div style="overflow: hidden">
     <div gridster="$ctrl.dashboardGridOptions" class="dashboard-wrapper">
       <div ng-repeat="widget in $ctrl.dashboard.widgets" gridster-item="widget.options.position"
-        gridster-auto-height="counter, .scrollbox, .spinner-container">
+        gridster-auto-height=".scrollbox, .spinner-container">
         <dashboard-widget widget="widget" dashboard="$ctrl.dashboard" public="true"></dashboard-widget>
       </div>
     </div>

client/app/services/widget.js

@@ -38,6 +38,10 @@ function Widget($resource, $http, Query, Visualization, dashboardGridOptions) {
     const visualizationOptions = {
       sizeX: Math.round(dashboardGridOptions.columns / 2),
       sizeY: -1, // auto-height
+      minSizeX: dashboardGridOptions.minSizeX,
+      maxSizeX: dashboardGridOptions.maxSizeX,
+      minSizeY: dashboardGridOptions.minSizeY,
+      maxSizeY: dashboardGridOptions.maxSizeY,
     };
     const visualization = widget.visualization ?
       Visualization.visualizations[widget.visualization.type] : null;

client/app/visualizations/map/index.js

@@ -1,6 +1,5 @@
 import _ from 'underscore';
 import d3 from 'd3';
-import angular from 'angular';
 import L from 'leaflet';
 import 'leaflet.markercluster';
 import 'leaflet/dist/leaflet.css';
@@ -204,9 +203,12 @@ function mapRenderer() {
         }
       }
 
+      $scope.handleResize = () => {
+        resize();
+      };
+
       $scope.$watch('queryResult && queryResult.getData()', render);
       $scope.$watch('visualization.options', render, true);
-      angular.element(window).on('resize', resize);
       $scope.$watch('visualization.options.height', resize);
     },
   };
@@ -289,7 +291,6 @@ export default function init(ngModule) {
       defaultColumns: 3,
       defaultRows: 8,
       minColumns: 2,
-      minRows: 3,
       classify: 'none',
       clusterMarkers: true,
     };

client/app/visualizations/map/map.html

@@ -1,3 +1,3 @@
 <div class="map-visualization-container">
-    <div style="width:100%; height:100%;"></div>
+    <div resize-event="handleResize()" style="width:100%; height:100%;"></div>
 </div>

client/app/visualizations/pivot/index.js

@@ -90,7 +90,6 @@ export default function init(ngModule) {
     const defaultOptions = {
       defaultRows: 10,
       defaultColumns: 3,
-      minRows: 4,
       minColumns: 2,
     };
 

client/app/visualizations/table/index.js

@@ -78,9 +78,8 @@ function GridRenderer(clientConfig) {
 export default function init(ngModule) {
   ngModule.config((VisualizationProvider) => {
     const defaultOptions = {
-      defaultRows: 15,
+      defaultRows: 14,
       defaultColumns: 4,
-      minRows: 4,
       minColumns: 2,
     };
 

webpack.config.js

@@ -1,15 +1,15 @@
 /* eslint-disable */
 
-var webpack = require('webpack');
-var HtmlWebpackPlugin = require('html-webpack-plugin');
-var ExtractTextPlugin = require("extract-text-webpack-plugin");
-var WebpackBuildNotifierPlugin = require('webpack-build-notifier');
-var LessPluginAutoPrefix = require('less-plugin-autoprefix');
-var path = require('path');
+const webpack = require('webpack');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const ExtractTextPlugin = require("extract-text-webpack-plugin");
+const WebpackBuildNotifierPlugin = require('webpack-build-notifier');
+const LessPluginAutoPrefix = require('less-plugin-autoprefix');
+const path = require('path');
 
-var redashBackend = process.env.REDASH_BACKEND || 'http://localhost:5000';
+const redashBackend = process.env.REDASH_BACKEND || 'http://localhost:5000';
 
-var config = {
+const config = {
   entry: {
     app: ['./client/app/index.js', './client/app/assets/less/main.less'],
   },
@@ -137,7 +137,7 @@ var config = {
         '/status.json', '/api', '/oauth'],
       target: redashBackend + '/',
       changeOrigin: true,
-      secure: false
+      secure: false,
     }],
     stats: {
       modules: false,