diff --git a/README.md b/README.md index 434f3478b..d528cda13 100644 --- a/README.md +++ b/README.md @@ -185,6 +185,12 @@ var options = { // Colour for the overview waveform rectangle that shows what the zoom view shows overviewHighlightRectangleColor: 'grey', + // Vertical padding in pixel to add to the overview waveform highlight rectangle. Defaults to 11px + overviewHighlightRectanglePadding: 11, + + // Opacity of the overview waveform highlight rectangle. Defaults to 0.3 + overviewHighlightRectangleOpacity: 0.3, + // Colour for segments on the waveform segmentColor: 'rgba(255, 161, 39, 1)', @@ -218,10 +224,6 @@ var options = { // Zoom view adapter to use. Valid adapters are: 'animated' (default) and 'static' zoomAdapter: 'animated', - // Vertical padding in pixel to add to the waveform reference rectangle. Defaults to 11px. You might want to adjust this - // depending on whether an axis is enabled in the overview waveform or not. - refWaveformRectPadding: 11, - // Array of initial segment objects with startTime and // endTime in seconds and a boolean for editable. // See below. diff --git a/src/main.js b/src/main.js index 3cc280af7..76da9b1bc 100644 --- a/src/main.js +++ b/src/main.js @@ -94,6 +94,17 @@ define('peaks', [ * Colour for the overview waveform */ overviewWaveformColor: 'rgba(0,0,0,0.2)', + + /** + * Vertical padding in pixel to add to the overview waveform highlight rectangle. Defaults to 11px + */ + overviewHighlightRectanglePadding: 11, + + /** + * Opacity of the overview waveform highlight rectangle. Defaults to 0.3 + */ + overviewHighlightRectangleOpacity: 0.3, + /** * Colour for the overview waveform highlight rectangle, which shows * you what you see in the zoom view. @@ -141,11 +152,6 @@ define('peaks', [ */ overviewAxisGridlineColor: '#ccc', - /** - * Vertical padding in pixel to add to the waveform reference rectangle. Defaults to 11px - */ - refWaveformRectPadding: 11, - /** * */ diff --git a/src/main/views/waveform.overview.js b/src/main/views/waveform.overview.js index d1cfaeb6a..e905db6c5 100644 --- a/src/main/views/waveform.overview.js +++ b/src/main/views/waveform.overview.js @@ -125,7 +125,7 @@ define([ strokeWidth: 0 });*/ - var refPadding = this.options.refWaveformRectPadding; + var refPadding = this.options.overviewHighlightRectanglePadding; if (refPadding * 2 > this.height) { refPadding = 0; } @@ -137,8 +137,8 @@ define([ stroke: that.options.overviewHighlightRectangleColor, strokeWidth: 1, height: this.height - (refPadding * 2), - fill: that.options.overviewHighlightRectangleColor, - opacity: 0.3, + fill: this.options.overviewHighlightRectangleColor, + opacity: this.options.overviewHighlightRectangleOpacity, cornerRadius: 2 });