Rename option into overviewHighlightRectanglePadding and add overview…

…HighlightRectangleOpacity

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.

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,
-
  /**
  *
  */

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
  });