@checksub_team/peaks_timeline 2.0.0-alpha.4 → 2.0.0-alpha.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@checksub_team/peaks_timeline",
-  "version": "2.0.0-alpha.4",
+  "version": "2.0.0-alpha.6",
   "description": "JavaScript UI component for displaying audio waveforms",
   "main": "./peaks.js",
   "types": "./peaks.js.d.ts",

package/peaks.js

@@ -15601,19 +15601,15 @@ module.exports = function (SegmentsGroup, LineGroup, LineIndicator, Utils) {
     };
     LineGroups.prototype.refreshLineYs = function () {
         var y = this._peaks.options.padding - this._view.getFrameOffsetY();
-        var anyChange = false;
         for (var position in this._lineGroupsByPosition) {
             if (Utils.objectHasProperty(this._lineGroupsByPosition, position)) {
                 if (this._lineGroupsByPosition[position].y() !== y) {
-                    anyChange = true;
                     this._lineGroupsByPosition[position].y(y);
                 }
                 y += this._lineGroupsByPosition[position].lineHeight() + this._peaks.options.interline;
             }
         }
-        if (anyChange && this._lineIndicator.refreshIndicators()) {
-            this._lineIndicator.draw();
-        }
+        this._lineIndicator.refreshIndicators();
     };
     LineGroups.prototype._setLinePosition = function (lineId, position) {
         const lineGroup = this._lineGroupsById[lineId];
@@ -15911,6 +15907,9 @@ module.exports = function (Konva, SVGs, Utils) {
                 anyChange = this.refreshIndicator(lineId) || anyChange;
             }
         }
+        if (anyChange) {
+            this.draw();
+        }
         return anyChange;
     };
     LineIndicator.prototype.draw = function () {
@@ -18109,7 +18108,7 @@ module.exports = function (WaveformBuilder, WaveformShape, Loader, Utils, Konva)
         return group.isAncestorOf(this._group);
     };
     SourceGroup.prototype.hideButKeepFocus = function () {
-        this._group.moveTo(this._view.getTempLayer());
+        this._group.moveTo(this._view.getTempGroup());
     };
     SourceGroup.prototype.getParent = function () {
         return this._group.getParent();
@@ -22090,8 +22089,7 @@ module.exports = function (MouseDragHandler, PlayheadLayer, SourcesLayer, ModeLa
             width: self._width - self._peaks.options.lineIndicatorWidth,
             height: self._height
         });
-        self._tempLayer = new Konva.Layer();
-        self._stage.add(self._tempLayer);
+        self._tempGroup = new Konva.Group({ listening: false });
         self._width -= self._peaks.options.lineIndicatorWidth;
         self._axis = new Axis(self._peaks, self, {
             axisGridlineColor: this._options.axisGridlineColor,
@@ -22100,6 +22098,7 @@ module.exports = function (MouseDragHandler, PlayheadLayer, SourcesLayer, ModeLa
         self._axis.addBackToStage(self._stage);
         self._sourcesLayer = new SourcesLayer(peaks, self, true);
         self._sourcesLayer.addToStage(self._stage);
+        self._sourcesLayer.add(self._tempGroup);
         self._axis.addFrontToStage(self._stage);
         self._playheadLayer = new PlayheadLayer(peaks, self, self._sourcesLayer, self._options.showPlayheadTime);
         self._playheadLayer.addToStage(self._stage);
@@ -22208,8 +22207,8 @@ module.exports = function (MouseDragHandler, PlayheadLayer, SourcesLayer, ModeLa
     View.prototype.setClickable = function (clickable) {
         this._isClickable = clickable;
     };
-    View.prototype.getTempLayer = function () {
-        return this._tempLayer;
+    View.prototype.getTempGroup = function () {
+        return this._tempGroup;
     };
     View.prototype.getSelectedElements = function () {
         return Object.values(this._modeLayer.getSelectedElements());

package/src/components/line-groups.js

@@ -441,23 +441,19 @@ define([
 
   LineGroups.prototype.refreshLineYs = function() {
     var y = this._peaks.options.padding - this._view.getFrameOffsetY();
-    var anyChange = false;
 
     // This code assumes that lines are ordered in ascending order of position
     // This is the case as the keys are integers
     for (var position in this._lineGroupsByPosition) {
       if (Utils.objectHasProperty(this._lineGroupsByPosition, position)) {
         if (this._lineGroupsByPosition[position].y() !== y) {
-          anyChange = true;
           this._lineGroupsByPosition[position].y(y);
         }
         y += this._lineGroupsByPosition[position].lineHeight() + this._peaks.options.interline;
       }
     }
 
-    if (anyChange && this._lineIndicator.refreshIndicators()) {
-      this._lineIndicator.draw();
-    }
+    this._lineIndicator.refreshIndicators();
   };
 
   LineGroups.prototype._setLinePosition = function(lineId, position) {

package/src/components/line-indicator.js

@@ -297,6 +297,9 @@ define([
       }
     }
 
+    if (anyChange) {
+      this.draw();
+    }
     return anyChange;
   };
 

package/src/components/source-group.js

@@ -691,7 +691,7 @@ define([
   };
 
   SourceGroup.prototype.hideButKeepFocus = function() {
-    this._group.moveTo(this._view.getTempLayer());
+    this._group.moveTo(this._view.getTempGroup());
   };
 
   SourceGroup.prototype.getParent = function() {

package/src/view.js

@@ -119,9 +119,7 @@ define([
       height: self._height
     });
 
-    self._tempLayer = new Konva.Layer();
-    // self._tempLayer.listening(false);
-    self._stage.add(self._tempLayer);
+    self._tempGroup = new Konva.Group({ listening: false });
 
     self._width -= self._peaks.options.lineIndicatorWidth;
 
@@ -135,6 +133,8 @@ define([
     self._sourcesLayer = new SourcesLayer(peaks, self, true);
     self._sourcesLayer.addToStage(self._stage);
 
+    self._sourcesLayer.add(self._tempGroup);
+
     self._axis.addFrontToStage(self._stage);
 
     self._playheadLayer = new PlayheadLayer(
@@ -317,8 +317,8 @@ define([
     this._isClickable = clickable;
   };
 
-  View.prototype.getTempLayer = function() {
-    return this._tempLayer;
+  View.prototype.getTempGroup = function() {
+    return this._tempGroup;
   };
 
   View.prototype.getSelectedElements = function() {