@checksub_team/peaks_timeline 1.16.0-alpha.0 → 1.16.0-alpha.2

package/peaks.js

@@ -14809,12 +14809,6 @@ module.exports = function (Konva, Utils, SVGs) {
         this._indicators[lineId].text = text;
         this.draw();
     };
-    LineIndicator.prototype._showMenu = function (menu) {
-        menu.style.display = 'block';
-        var containerRect = this._stage.container().getBoundingClientRect();
-        menu.style.top = containerRect.top + this._stage.getPointerPosition().y - menu.offsetHeight + 'px';
-        menu.style.left = containerRect.left + this._stage.getPointerPosition().x + 6 + 'px';
-    };
     LineIndicator.prototype._createIndicator = function (line, type, text) {
         var indicator = new Konva.Group();
         var indicatorHeight = 0;
@@ -14949,7 +14943,7 @@ module.exports = function (Konva, Utils, SVGs) {
     return LineIndicator;
 }(_dereq_('konva'), _dereq_('./utils'), _dereq_('./svgs'));
 },{"./svgs":108,"./utils":113,"konva":43}],92:[function(_dereq_,module,exports){
-module.exports = function (Konva, Utils) {
+module.exports = function (SourceGroup, Konva, Utils) {
     'use strict';
     function Line(peaks, view, y, id, position) {
         this._peaks = peaks;
@@ -14982,8 +14976,8 @@ module.exports = function (Konva, Utils) {
     Line.prototype.getId = function () {
         return this._id;
     };
-    Line.prototype.isEmpty = function () {
-        return this.isSegmentsLine() ? this._segmentsGroup.isEmpty() : Object.keys(this._sources).length === 0;
+    Line.prototype.countRemainingElements = function () {
+        return this.isSegmentsLine() ? this._segmentsGroup.countRemainingElements() : Object.keys(this._sources).length;
     };
     Line.prototype.isSegmentsLine = function () {
         return Boolean(this._segmentsGroup);
@@ -15011,71 +15005,53 @@ module.exports = function (Konva, Utils) {
     Line.prototype.lineHeight = function () {
         return this._height;
     };
-    Line.prototype.changeHeight = function (from, to) {
-        if (this._sourceHeights[from]) {
-            var oldHeight = this._height;
-            if (this._sourceHeights[to]) {
-                this._sourceHeights[to] += this._sourceHeights[from];
-            } else {
-                this._sourceHeights[to] = this._sourceHeights[from];
+    Line.prototype._addHeight = function (height) {
+        if (this._sourceHeights[height]) {
+            this._sourceHeights[height]++;
+        } else {
+            this._sourceHeights[height] = 1;
+            if (height > this._height) {
+                this._height = height;
             }
-            if (to > this._height) {
-                this._height = to;
-            } else if (from === this._height) {
+        }
+    };
+    Line.prototype._subtractHeight = function (height) {
+        if (Object.keys(this._sources).length === 0) {
+            this._height = this._peaks.options.emptyLineHeight;
+            this._sourceHeights = {};
+        } else {
+            this._sourceHeights[height]--;
+            if (this._sourceHeights[height] === 0 && height === this._height) {
+                delete this._sourceHeights[height];
                 this._height = 0;
-                for (var height in this._sourceHeights) {
-                    if (Utils.objectHasProperty(this._sourceHeights, height)) {
-                        var parsedHeight = parseInt(height, 10);
-                        if (parsedHeight !== from) {
-                            if (parsedHeight > this._height) {
-                                this._height = parsedHeight;
-                            }
+                for (var sourceHeight in this._sourceHeights) {
+                    if (Utils.objectHasProperty(this._sourceHeights, sourceHeight)) {
+                        var parsedHeight = parseInt(sourceHeight, 10);
+                        if (parsedHeight > this._height) {
+                            this._height = parsedHeight;
                         }
                     }
                 }
             }
-            if (this._height !== oldHeight) {
-                this._peaks.emit('line.heightChanged', this._position);
-            }
-            delete this._sourceHeights[from];
         }
     };
-    Line.prototype.updateLineHeight = function (sourceGroup, action) {
+    Line.prototype.updateLineHeight = function (source, action) {
         var oldHeight = this._height;
+        var sourceGroup = this._sourcesGroup[source.id];
         var sourceGroupHeight;
         switch (action) {
         case 'add':
-            sourceGroupHeight = sourceGroup.getCurrentHeight();
-            if (this._sourceHeights[sourceGroupHeight]) {
-                this._sourceHeights[sourceGroupHeight]++;
-            } else {
-                this._sourceHeights[sourceGroupHeight] = 1;
-                if (sourceGroupHeight > this._height) {
-                    this._height = sourceGroupHeight;
-                }
-            }
+            sourceGroupHeight = sourceGroup ? sourceGroup.getCurrentHeight() : SourceGroup.getHeights(source, this._peaks).current;
+            this._addHeight(sourceGroupHeight);
             break;
         case 'remove':
-            if (Object.keys(this._sources).length === 0) {
-                this._height = this._peaks.options.emptyLineHeight;
-                this._sourceHeights = {};
-            } else {
-                sourceGroupHeight = sourceGroup.getCurrentHeight();
-                this._sourceHeights[sourceGroupHeight]--;
-                if (this._sourceHeights[sourceGroupHeight] === 0 && sourceGroupHeight === this._height) {
-                    delete this._sourceHeights[sourceGroupHeight];
-                    this._height = 0;
-                    for (var height in this._sourceHeights) {
-                        if (Utils.objectHasProperty(this._sourceHeights, height)) {
-                            var parsedHeight = parseInt(height, 10);
-                            if (parsedHeight > this._height) {
-                                this._height = parsedHeight;
-                            }
-                        }
-                    }
-                }
-            }
+            sourceGroupHeight = sourceGroup ? sourceGroup.getCurrentHeight() : SourceGroup.getHeights(source, this._peaks).current;
+            this._subtractHeight(sourceGroupHeight);
             break;
+        default:
+            var {unwrapped, wrapped} = sourceGroup ? sourceGroup.getHeights() : SourceGroup.getHeights(source, this._peaks);
+            this._addHeight(source.wrapped ? wrapped : unwrapped);
+            this._subtractHeight(source.wrapped ? unwrapped : wrapped);
         }
         if (this._height !== oldHeight) {
             this._peaks.emit('line.heightChanged', this._position);
@@ -15087,9 +15063,10 @@ module.exports = function (Konva, Utils) {
     Line.prototype.addToLayer = function (layer) {
         layer.add(this._group);
     };
-    Line.prototype.addSourceGroup = function (sourceGroup) {
-        var source = sourceGroup.getSource();
-        this._sourcesGroup[source.id] = sourceGroup;
+    Line.prototype.addSourceGroup = function (source, sourceGroup) {
+        if (sourceGroup) {
+            this._sourcesGroup[source.id] = sourceGroup;
+        }
         if (!this._sources[source.id]) {
             var newSource = {
                 source: source,
@@ -15106,9 +15083,9 @@ module.exports = function (Konva, Utils) {
                     }
                     if (source.endTime <= currentSource.source.startTime) {
                         var startLimit = currentSource.prevSourceId ? this._sources[currentSource.prevSourceId].source.endTime : 0;
-                        var newTimes = this._canBePlacedBetween(source.startTime, source.endTime, startLimit, currentSource.source.startTime);
-                        if (newTimes) {
-                            source.updateTimes(newTimes.start, newTimes.end);
+                        const {newStartTime, newEndTime} = this._canBePlacedBetween(source.startTime, source.endTime, startLimit, currentSource.source.startTime);
+                        if (newStartTime !== null && newEndTime !== null) {
+                            source.updateTimes(newStartTime, newEndTime);
                             if (currentSource.prevSourceId) {
                                 this._sources[currentSource.prevSourceId].nextSourceId = source.id;
                                 newSource.prevSourceId = currentSource.prevSourceId;
@@ -15135,9 +15112,9 @@ module.exports = function (Konva, Utils) {
                 this._firstSourceId = source.id;
                 this._sources[source.id] = newSource;
             }
-            this.updateLineHeight(sourceGroup, 'add');
+            this.updateLineHeight(source, 'add');
         }
-        if (!sourceGroup.getParent() || !sourceGroup.isDescendantOf(this._group)) {
+        if (sourceGroup && (!sourceGroup.getParent() || !sourceGroup.isDescendantOf(this._group))) {
             sourceGroup.addToGroup(this._group);
         }
     };
@@ -15157,26 +15134,23 @@ module.exports = function (Konva, Utils) {
     };
     Line.prototype._canBePlacedBetween = function (startTime, endTime, startLimit, endLimit) {
         var timeWidth = Utils.roundTime(endTime - startTime);
-        var newTimes = null;
+        var newStartTime, newEndTime;
         if (!endLimit && startTime > startLimit || startTime > startLimit && endTime < endLimit) {
-            newTimes = {
-                start: startTime,
-                end: endTime
-            };
+            newStartTime = startTime;
+            newEndTime = endTime;
         } else if (Utils.roundTime(endLimit - startLimit) >= timeWidth) {
             if (startTime > startLimit) {
-                newTimes = {
-                    start: Utils.roundTime(endLimit - timeWidth),
-                    end: endLimit
-                };
+                newStartTime = Utils.roundTime(endLimit - timeWidth);
+                newEndTime = endLimit;
             } else {
-                newTimes = {
-                    start: startLimit,
-                    end: Utils.roundTime(startLimit + timeWidth)
-                };
+                newStartTime = startLimit;
+                newEndTime = Utils.roundTime(startLimit + timeWidth);
             }
         }
-        return newTimes;
+        return {
+            newStartTime,
+            newEndTime
+        };
     };
     Line.prototype.removeSourceGroup = function (source, isPermanent) {
         var sourceGroup = this._sourcesGroup[source.id];
@@ -15199,7 +15173,7 @@ module.exports = function (Konva, Utils) {
             if (this._firstSourceId === source.id) {
                 this._firstSourceId = sourceData.nextSourceId;
             }
-            this.updateLineHeight(sourceGroup, 'remove');
+            this.updateLineHeight(source, 'remove');
         }
         return sourceGroup;
     };
@@ -15222,83 +15196,85 @@ module.exports = function (Konva, Utils) {
         this._y += dy;
         this._group.y(this._group.y() + dy);
     };
-    Line.prototype.manageSourceOrder = function (source, newTimes) {
-        var cursorTime = this._view.pixelsToTime(this._view.getPointerPosition().x);
+    Line.prototype.manageOrder = function (sources, startTime, endTime) {
+        const firstSource = sources[0];
+        const lastSource = sources[sources.length - 1];
+        const cursorTime = this._view.pixelsToTime(this._view.getPointerPosition().x);
+        var newStartTime = startTime;
+        var newEndTime = endTime;
         var tmpTimes;
-        var sourceDuration = source.endTime - source.startTime;
-        if (newTimes.start !== null && newTimes.end !== null) {
-            if (this._sources[source.id].prevSourceId) {
-                var previousStartTime = this._sources[this._sources[source.id].prevSourceId].source.startTime;
-                if (cursorTime + this._view.getTimeOffset() < previousStartTime) {
-                    tmpTimes = this._changeSourcePosition(source, sourceDuration, cursorTime + this._view.getTimeOffset());
-                    if (tmpTimes) {
-                        newTimes.start = tmpTimes.start;
-                        newTimes.end = tmpTimes.end;
+        var sourceDuration = Utils.roundTime(endTime - startTime);
+        if (typeof newStartTime === 'number' && typeof newEndTime === 'number') {
+            if (this._sources[firstSource.id].prevSourceId) {
+                var previousStartTime = this._sources[this._sources[firstSource.id].prevSourceId].source.startTime;
+                if (Utils.roundTime(cursorTime + this._view.getTimeOffset()) < previousStartTime) {
+                    tmpTimes = this._changeSourcesPosition(sources, sourceDuration, cursorTime + this._view.getTimeOffset());
+                    if (typeof tmpTimes.newStartTime === 'number' && typeof tmpTimes.newEndTime === 'number') {
+                        newStartTime = tmpTimes.newStartTime;
+                        newEndTime = tmpTimes.newEndTime;
                     }
                 }
             }
-            if (this._sources[source.id].nextSourceId) {
-                var nextEndTime = this._sources[this._sources[source.id].nextSourceId].source.endTime;
-                if (cursorTime + this._view.getTimeOffset() > nextEndTime) {
-                    tmpTimes = this._changeSourcePosition(source, sourceDuration, cursorTime + this._view.getTimeOffset());
-                    if (tmpTimes) {
-                        newTimes.start = tmpTimes.start;
-                        newTimes.end = tmpTimes.end;
+            if (this._sources[lastSource.id].nextSourceId) {
+                var nextEndTime = this._sources[this._sources[lastSource.id].nextSourceId].source.endTime;
+                if (Utils.roundTime(cursorTime + this._view.getTimeOffset()) > nextEndTime) {
+                    tmpTimes = this._changeSourcesPosition(sources, sourceDuration, cursorTime + this._view.getTimeOffset());
+                    if (typeof tmpTimes.newStartTime === 'number' && typeof tmpTimes.newEndTime === 'number') {
+                        newStartTime = tmpTimes.newStartTime;
+                        newEndTime = tmpTimes.newEndTime;
                     }
                 }
             }
         }
-        if (newTimes.start) {
-            newTimes.start = Utils.roundTime(newTimes.start);
-        }
-        if (newTimes.end) {
-            newTimes.end = Utils.roundTime(newTimes.end);
-        }
-        return newTimes;
+        return {
+            newStartTime,
+            newEndTime
+        };
     };
-    Line.prototype._changeSourcePosition = function (source, sourceDuration, time) {
-        if (source.orderable && this._firstSourceId) {
-            var currentRange = {
-                start: null,
-                end: null
-            };
-            var startLimit = null;
-            var endLimit = null;
-            do {
-                if (!currentRange.end) {
-                    currentRange.end = this._sources[this._firstSourceId];
-                } else {
-                    currentRange.start = currentRange.end;
-                    currentRange.end = this._sources[currentRange.start.nextSourceId];
-                }
-                if (currentRange.start) {
-                    startLimit = currentRange.start.source.endTime;
-                } else {
-                    startLimit = 0;
-                }
-                if (currentRange.end) {
-                    endLimit = currentRange.end.source.startTime;
-                } else {
-                    endLimit = null;
-                }
-                if (time > startLimit && (endLimit === null || time < endLimit)) {
-                    var newTimes = this._canBePlacedBetween(time, time + sourceDuration, startLimit, endLimit);
-                    if (newTimes) {
-                        if (newTimes.start) {
-                            newTimes.start = Utils.roundTime(newTimes.start);
-                        }
-                        if (newTimes.end) {
-                            newTimes.end = Utils.roundTime(newTimes.end);
-                        }
-                        source.updateTimes(newTimes.start, newTimes.end);
-                        var prevSourceId = currentRange.start ? currentRange.start.source.id : null;
+    Line.prototype._changeSourcesPosition = function (sources, sourceDuration, time) {
+        var currentRange = {
+            start: null,
+            end: null
+        };
+        var startLimit = null;
+        var endLimit = null;
+        let newStartTime, newEndTime;
+        do {
+            if (!currentRange.end) {
+                currentRange.end = this._sources[this._firstSourceId];
+            } else {
+                currentRange.start = currentRange.end;
+                currentRange.end = this._sources[currentRange.start.nextSourceId];
+            }
+            if (currentRange.start) {
+                startLimit = currentRange.start.source.endTime;
+            } else {
+                startLimit = 0;
+            }
+            if (currentRange.end) {
+                endLimit = currentRange.end.source.startTime;
+            } else {
+                endLimit = null;
+            }
+            if (time > startLimit && (endLimit === null || time < endLimit)) {
+                ({newStartTime, newEndTime} = this._canBePlacedBetween(time, time + sourceDuration, startLimit, endLimit));
+                if (typeof newStartTime === 'number' && typeof newEndTime === 'number') {
+                    let prevSourceId = currentRange.start ? currentRange.start.source.id : null;
+                    sources.forEach(function (source) {
                         this._moveSource(this._sources[source.id].source, prevSourceId);
-                        return newTimes;
-                    }
+                        prevSourceId = source.id;
+                    }.bind(this));
                 }
-            } while (currentRange.end);
-        }
-        return null;
+                return {
+                    newStartTime,
+                    newEndTime
+                };
+            }
+        } while (currentRange.end);
+        return {
+            newStartTime,
+            newEndTime
+        };
     };
     Line.prototype._moveSource = function (source, prevSourceId) {
         var sourceObj = this._sources[source.id];
@@ -15326,20 +15302,17 @@ module.exports = function (Konva, Utils) {
         }
         this._sources[source.id] = sourceObj;
     };
-    Line.prototype.manageCollision = function (source, newTimes) {
-        var originalStartTime = null;
-        var originalEndTime = null;
-        var newStartTime = null;
-        var newEndTime = null;
+    Line.prototype.manageCollision = function (sources, newStartTime, newEndTime) {
+        var originalStartTime = newStartTime;
+        var originalEndTime = newEndTime;
         var startLimited = false;
         var endLimited = false;
-        newTimes.updateTimelineLength = false;
-        if (newTimes.start !== null) {
-            originalStartTime = newTimes.start;
-            newStartTime = originalStartTime;
-            if (source.startTime > newStartTime) {
-                if (this._sources[source.id].prevSourceId) {
-                    var previousSource = this._sources[this._sources[source.id].prevSourceId].source;
+        const firstSource = sources[0];
+        const lastSource = sources[sources.length - 1];
+        if (typeof newStartTime === 'number') {
+            if (firstSource.startTime > newStartTime) {
+                if (this._sources[firstSource.id].prevSourceId) {
+                    var previousSource = this._sources[this._sources[firstSource.id].prevSourceId].source;
                     if (newStartTime < previousSource.endTime) {
                         newStartTime = previousSource.endTime;
                         startLimited = true;
@@ -15352,12 +15325,10 @@ module.exports = function (Konva, Utils) {
                 }
             }
         }
-        if (newTimes.end !== null) {
-            originalEndTime = newTimes.end;
-            newEndTime = originalEndTime;
-            if (source.endTime < newEndTime) {
-                if (this._sources[source.id].nextSourceId) {
-                    var nextSource = this._sources[this._sources[source.id].nextSourceId].source;
+        if (typeof newEndTime === 'number') {
+            if (lastSource.endTime < newEndTime) {
+                if (this._sources[lastSource.id].nextSourceId) {
+                    var nextSource = this._sources[this._sources[lastSource.id].nextSourceId].source;
                     if (newEndTime > nextSource.startTime) {
                         newEndTime = nextSource.startTime;
                         endLimited = true;
@@ -15365,7 +15336,7 @@ module.exports = function (Konva, Utils) {
                 }
             }
         }
-        if (newStartTime !== null && newEndTime !== null) {
+        if (typeof newStartTime === 'number' && typeof newEndTime === 'number') {
             var timeWidth = originalEndTime - originalStartTime;
             if (startLimited) {
                 newEndTime = Utils.roundTime(newStartTime + timeWidth);
@@ -15374,34 +15345,28 @@ module.exports = function (Konva, Utils) {
                 newStartTime = Utils.roundTime(newEndTime - timeWidth);
             }
         }
-        if (newStartTime !== null && newEndTime === null) {
-            if (Utils.roundTime(source.endTime - newStartTime) < source.minSize) {
-                newStartTime = Utils.roundTime(source.endTime - source.minSize);
+        if (typeof newStartTime === 'number' && typeof newEndTime !== 'number') {
+            if (Utils.roundTime(sources[0].endTime - newStartTime) < sources[0].minSize) {
+                newStartTime = Utils.roundTime(sources[0].endTime - sources[0].minSize);
             }
-        } else if (newEndTime !== null && newStartTime === null) {
-            if (Utils.roundTime(newEndTime - source.startTime) < source.minSize) {
-                newEndTime = Utils.roundTime(source.startTime + source.minSize);
+        } else if (typeof newEndTime === 'number' && typeof newStartTime !== 'number') {
+            if (Utils.roundTime(newEndTime - sources[0].startTime) < sources[0].minSize) {
+                newEndTime = Utils.roundTime(sources[0].startTime + sources[0].minSize);
             }
         } else {
-            if (Utils.roundTime(newEndTime - newStartTime) < source.minSize) {
-                if (source.endTime !== newEndTime) {
-                    newEndTime = Utils.roundTime(newStartTime + source.minSize);
+            if (Utils.roundTime(newEndTime - newStartTime) < sources[0].minSize) {
+                if (sources[0].endTime !== newEndTime) {
+                    newEndTime = Utils.roundTime(newStartTime + sources[0].minSize);
                 }
-                if (source.startTime !== newStartTime) {
-                    newStartTime = Utils.roundTime(newEndTime - source.minSize);
+                if (sources[0].startTime !== newStartTime) {
+                    newStartTime = Utils.roundTime(newEndTime - sources[0].minSize);
                 }
             }
         }
-        if (newStartTime !== null && newStartTime !== originalStartTime) {
-            newTimes.start = newStartTime;
-        }
-        if (newEndTime !== null && newEndTime !== originalEndTime) {
-            newTimes.end = newEndTime;
-            if (this._sources[source.id].nextSourceId === null) {
-                newTimes.updateTimelineLength = true;
-            }
-        }
-        return newTimes;
+        return {
+            newStartTime,
+            newEndTime
+        };
     };
     Line.prototype.getSourcesAfter = function (time) {
         const sources = [];
@@ -15466,8 +15431,8 @@ module.exports = function (Konva, Utils) {
         this._group.listening(bool);
     };
     return Line;
-}(_dereq_('konva'), _dereq_('./utils'));
-},{"./utils":113,"konva":43}],93:[function(_dereq_,module,exports){
+}(_dereq_('./source-group'), _dereq_('konva'), _dereq_('./utils'));
+},{"./source-group":105,"./utils":113,"konva":43}],93:[function(_dereq_,module,exports){
 module.exports = function (SegmentsGroup, Line, LineIndicator, Utils) {
     'use strict';
     function Lines(peaks, view, layer) {
@@ -15486,8 +15451,9 @@ module.exports = function (SegmentsGroup, Line, LineIndicator, Utils) {
         this._lineId = 0;
         this._lineIndicator = new LineIndicator(peaks, view, document.getElementById('line-indicator-container'));
         this._peaks.on('line.heightChanged', this._onLineHeightChanged.bind(this));
-        this._peaks.on('line.add', this._onLineAdd.bind(this));
         this._peaks.on('line.remove', this._onLineRemove.bind(this));
+        this._peaks.on('sources.show', this._onSourcesWrappingChanged.bind(this));
+        this._peaks.on('sources.hide', this._onSourcesWrappingChanged.bind(this));
         this._peaks.on('segment.updated', this._onSegmentsUpdate.bind(this));
         this._peaks.on('segments.add', this._onSegmentsAdd.bind(this));
         this._peaks.on('segments.remove', this._onSegmentsRemove.bind(this));
@@ -15531,31 +15497,24 @@ module.exports = function (SegmentsGroup, Line, LineIndicator, Utils) {
         this._updateLinesPosition(position);
         this._view.updateTimeline();
     };
-    Lines.prototype._onLineAdd = function (position) {
-        this._createLine(position);
-        this._setInteractions(position);
-        this._updateLinesPosition(position);
-    };
     Lines.prototype._onLineRemove = function (position) {
-        this.removeLine(position);
+        this._removeLine(position);
         this._updateLinesPosition(position);
     };
-    Lines.prototype.changeLineHeight = function (from, to) {
-        for (var position in this._linesByPosition) {
-            if (Utils.objectHasProperty(this._linesByPosition, position)) {
-                if (!this._linesByPosition[position].isSegmentsLine()) {
-                    this._linesByPosition[position].changeHeight(from, to);
-                }
+    Lines.prototype._onSourcesWrappingChanged = function (sources) {
+        sources.forEach(function (source) {
+            if (this._linesByPosition[source.position]) {
+                this._linesByPosition[source.position].updateLineHeight(source, 'wrappingChanged');
             }
-        }
+        }.bind(this));
     };
-    Lines.prototype.addSourceGroup = function (sourceGroup, position) {
+    Lines.prototype.addSourceGroup = function (source, sourceGroup, position) {
         if (!this._linesByPosition[position] || this._linesByPosition[position].isSegmentsLine()) {
             this._createLine(position);
             this._setInteractions(position);
         }
-        sourceGroup.getSource().position = position;
-        this._linesByPosition[position].addSourceGroup(sourceGroup);
+        source.position = position;
+        this._linesByPosition[position].addSourceGroup(source, sourceGroup);
     };
     Lines.prototype.addSegments = function (lineId, position) {
         this._createLine(position);
@@ -15575,7 +15534,7 @@ module.exports = function (SegmentsGroup, Line, LineIndicator, Utils) {
         }
         return sourceGroup;
     };
-    Lines.prototype.removeLine = function (pos) {
+    Lines.prototype._removeLine = function (pos) {
         var oldLine = this._linesByPosition[pos];
         var lineId = oldLine.getId();
         if (this._automaticallyCreatedLineId === lineId) {
@@ -15686,35 +15645,43 @@ module.exports = function (SegmentsGroup, Line, LineIndicator, Utils) {
         this._automaticLineCreationPosition = null;
         this._automaticallyCreatedLineId = null;
     };
-    Lines.prototype.manageAutomaticLineCreation = function (pos, source) {
+    Lines.prototype.manageAutomaticLineCreation = function (newLinePosition, initialPosition, sources) {
         if (this._automaticallyCreatedLineId !== null) {
             return;
-        } else if (this._automaticLineCreationPosition !== null && this._automaticLineCreationPosition !== pos) {
+        } else if (this._automaticLineCreationPosition !== null && this._automaticLineCreationPosition !== newLinePosition) {
             this.stopAutomaticLineCreation();
-        } else if (this._automaticLineCreationTimeout) {
+        }
+        if (this._automaticLineCreationTimeout) {
             return;
         }
-        this._automaticLineCreationPosition = pos;
+        this._automaticLineCreationPosition = newLinePosition;
         this._automaticLineCreationTimeout = setTimeout(function () {
             this._automaticLineCreationTimeout = null;
-            this._automaticallyCreatedLineId = this._createLine(pos);
-            this._setInteractions(pos);
-            this.moveSourceToPosition(source, pos);
+            var currentLine = this._linesByPosition[initialPosition];
+            if (currentLine.countRemainingElements() === sources.length) {
+                this.stopAutomaticLineCreation();
+                return;
+            }
+            this._automaticallyCreatedLineId = this._createLine(newLinePosition);
+            this._setInteractions(newLinePosition);
+            this.moveSourcesToPosition(sources, currentLine.getPosition(), newLinePosition);
         }.bind(this), this._peaks.options.automaticLineCreationDelay);
     };
-    Lines.prototype.manageVerticalPosition = function (source, mouseX, mouseY) {
-        if (mouseY !== null && mouseY !== undefined) {
-            var linePos = this.getLinesUnderY(mouseY);
-            if (linePos[0] !== linePos[1]) {
-                this.manageAutomaticLineCreation(linePos[0] + 1, source);
-            } else {
-                this.stopAutomaticLineCreation();
-                if (mouseX !== null && mouseX !== undefined && linePos[0] !== source.position && !this._linesByPosition[linePos[0]].isSegmentsLine()) {
-                    var mouseTime = this._view.pixelsToTime(mouseX + this._view.getFrameOffset());
-                    var sourceDuration = Utils.roundTime(source.endTime - source.startTime);
-                    if (this._hasSpaceForSourceAt(linePos[0], mouseTime, sourceDuration)) {
-                        this.moveSourceToPosition(source, linePos[0]);
-                    }
+    Lines.prototype.manageVerticalPosition = function (sources, startTime, endTime, mouseX, mouseY) {
+        if (mouseX === null || mouseX === undefined) {
+            return;
+        }
+        const position = sources[0].position;
+        const linePos = this.getLinesUnderY(mouseY);
+        if (linePos[0] !== linePos[1]) {
+            this.manageAutomaticLineCreation(linePos[0] + 1, position, sources);
+        } else {
+            this.stopAutomaticLineCreation();
+            if (mouseX !== null && mouseX !== undefined && linePos[0] !== position && !this._linesByPosition[linePos[0]].isSegmentsLine()) {
+                var mouseTime = this._view.pixelsToTime(mouseX + this._view.getFrameOffset());
+                var sourceDuration = Utils.roundTime(endTime - startTime);
+                if (this._hasSpaceForSourceAt(linePos[0], mouseTime, sourceDuration)) {
+                    this.moveSourcesToPosition(sources, position, linePos[0]);
                 }
             }
         }
@@ -15761,11 +15728,15 @@ module.exports = function (SegmentsGroup, Line, LineIndicator, Utils) {
         }
         return pos;
     };
-    Lines.prototype.moveSourceToPosition = function (source, pos) {
-        var sourceGroup = this._linesByPosition[source.position].removeSourceGroup(source, true);
-        sourceGroup.moveTo(this._linesByPosition[pos].getKonvaGroup());
-        this._updateLinesPosition(source.position);
-        this.addSourceGroup(sourceGroup, pos);
+    Lines.prototype.moveSourcesToPosition = function (sources, initialPosition, targetPosition) {
+        sources.forEach(function (source) {
+            var sourceGroup = this._linesByPosition[initialPosition].removeSourceGroup(source, true);
+            if (sourceGroup) {
+                sourceGroup.moveTo(this._linesByPosition[targetPosition].getKonvaGroup());
+            }
+            this.addSourceGroup(source, sourceGroup, targetPosition);
+        }.bind(this));
+        this._updateLinesPosition(initialPosition);
     };
     Lines.prototype._getNextLineId = function () {
         this._lineId++;
@@ -15808,11 +15779,11 @@ module.exports = function (SegmentsGroup, Line, LineIndicator, Utils) {
             }
         }
     };
-    Lines.prototype.manageCollision = function (source, newTimes) {
-        return this._linesByPosition[source.position].manageCollision(source, newTimes);
+    Lines.prototype.manageCollision = function (sources, newStartTime, newEndTime) {
+        return this._linesByPosition[sources[0].position].manageCollision(sources, newStartTime, newEndTime);
     };
-    Lines.prototype.manageSourceOrder = function (source, newTimes) {
-        return this._linesByPosition[source.position].manageSourceOrder(source, newTimes);
+    Lines.prototype.manageOrder = function (sources, startTime, endTime) {
+        return this._linesByPosition[sources[0].position].manageOrder(sources, startTime, endTime);
     };
     Lines.prototype._setInteractions = function (position) {
         var line = this._linesByPosition[position];
@@ -16144,11 +16115,6 @@ module.exports = function (Colors, EventEmitter, TimelineSegments, TimelineSourc
     Peaks.prototype._removeWindowResizeHandler = function () {
         window.removeEventListener('resize', this._onResize);
     };
-    Peaks.prototype.setLineHeight = function (newLineHeight) {
-        var oldHeight = this.options.lineHeight;
-        this.options.lineHeight = newLineHeight;
-        this.emit('options.set.line_height', oldHeight);
-    };
     Peaks.prototype.zoomIn = function () {
         this.view.setZoom(this.view.getTimeToPixelsScale() + Math.floor(this.view.getTimeToPixelsScale() / 10) + 1);
     };
@@ -17674,6 +17640,9 @@ module.exports = function (SegmentShape, Utils, Konva) {
     SegmentsGroup.prototype.isEmpty = function () {
         return Object.keys(this._segments).length === 0;
     };
+    SegmentsGroup.prototype.countRemainingElements = function () {
+        return Object.keys(this._segments).length;
+    };
     SegmentsGroup.prototype.addToGroup = function (group) {
         group.add(this._group);
     };
@@ -18179,13 +18148,12 @@ module.exports = function (WaveformBuilder, WaveformShape, Utils, Loader, Konva)
         this._indicators = {};
         var self = this;
         this._x = this._view.timeToPixels(source.startTime);
-        this._roundedX = Math.round(this._x);
         this._width = this._view.timeToPixels(source.endTime - source.startTime);
-        this._roundedWidth = Math.round(this._width);
-        this._unwrappedHeight = source.binaryHeight && source.previewHeight ? source.binaryHeight + source.previewHeight : this._peaks.options.lineHeight;
-        this._wrappedHeight = this._peaks.options.wrappedLineHeight;
+        var heights = SourceGroup.getHeights(source, peaks);
+        this._unwrappedHeight = heights.unwrapped;
+        this._wrappedHeight = heights.wrapped;
+        this._height = heights.current;
         this._borderWidth = this._source.borderWidth || 0;
-        this._height = this._unwrappedHeight;
         this._currentTimeToPixelsScaleUsed = this._view.getTimeToPixelsScale();
         this._selected = this._source.selected;
         this._isDragged = false;
@@ -18278,11 +18246,10 @@ module.exports = function (WaveformBuilder, WaveformShape, Utils, Loader, Konva)
         const timeOffsetDiff = this._view.getTimeOffset() - this._initialTimeOffset;
         const {start, end} = this._initialTimes;
         this._view.updateWithAutoScroll(function () {
-            if (this._layer.updateSource(this._source, leftHandle ? start + diff + timeOffsetDiff : null, leftHandle ? null : end + diff + timeOffsetDiff)) {
+            if (this._layer.manageSourceMovements([this._source], leftHandle ? start + diff + timeOffsetDiff : null, leftHandle ? null : end + diff + timeOffsetDiff)) {
                 this._layer.draw();
             }
         }.bind(this));
-        this._view.setTimelineLength(this._view.timeToPixels(this._source.endTime) + this._view.getWidth());
         return {
             x: draggedElement.absolutePosition().x,
             y: draggedElement.absolutePosition().y
@@ -18295,11 +18262,9 @@ module.exports = function (WaveformBuilder, WaveformShape, Utils, Loader, Konva)
         const newTimeToPixelsScale = this._view.getTimeToPixelsScale();
         this._group.x(startPixel - frameOffset);
         this._x = startPixel;
-        this._roundedX = Math.round(this._x);
         const newWidth = endPixel - startPixel;
         if (newWidth !== this._width) {
             this._width = newWidth;
-            this._roundedWidth = Math.round(this._width);
             if (newTimeToPixelsScale !== this._currentTimeToPixelsScaleUsed) {
                 this._currentTimeToPixelsScaleUsed = newTimeToPixelsScale;
                 this._updateMarkers();
@@ -18350,9 +18315,11 @@ module.exports = function (WaveformBuilder, WaveformShape, Utils, Loader, Konva)
             start: this._source.startTime,
             end: this._source.endTime
         };
+        this._isDragged = true;
         this._hideButtons();
     };
     SourceGroup.prototype._onHandleDragEnd = function () {
+        this._isDragged = false;
         this._showButtons();
     };
     SourceGroup.prototype._addHandles = function (forceCreate) {
@@ -18434,43 +18401,45 @@ module.exports = function (WaveformBuilder, WaveformShape, Utils, Loader, Konva)
     };
     SourceGroup.prototype.drawSourceShape = function (ctx, shape, addBorderWidth, fill) {
         var offset = addBorderWidth ? this._borderWidth : 0;
-        var radius = this._source.borderRadius !== undefined && this._source.borderRadius !== null ? this._source.borderRadius : Math.max(1, Math.min(this._roundedWidth / 2, Math.min(CORNER_RADIUS, this._height / 2)));
-        var x = Math.max(0, this._view.getFrameOffset() - this._roundedX - radius);
-        var width = Math.min(this._roundedWidth - x, this._view.getWidth() + radius - Math.max(0, this._roundedX - this._view.getFrameOffset()));
+        var radius = this._source.borderRadius !== undefined && this._source.borderRadius !== null ? this._source.borderRadius : Math.max(1, Math.min(this._width / 2, Math.min(CORNER_RADIUS, this._height / 2)));
+        var x = Math.max(0, this._view.getFrameOffset() - this._x - 2 * radius);
+        var width = Math.min(this._width - x, this._view.getWidth() + 4 * radius - Math.max(0, this._x - this._view.getFrameOffset()));
         var xWidth = x + width;
-        ctx.beginPath();
-        ctx.moveTo(x + radius, offset);
-        ctx.lineTo(xWidth - radius, offset);
-        ctx.quadraticCurveTo(xWidth - offset, offset, xWidth - offset, radius);
-        ctx.lineTo(xWidth - offset, this._height - radius);
-        ctx.quadraticCurveTo(xWidth - offset, this._height - offset, xWidth - radius, this._height - offset);
-        ctx.lineTo(x + radius, this._height - offset);
-        ctx.quadraticCurveTo(x + offset, this._height - offset, x + offset, this._height - radius);
-        ctx.lineTo(x + offset, radius);
-        ctx.quadraticCurveTo(x + offset, offset, x + radius, offset);
-        ctx.closePath();
-        if (fill) {
-            if (this._source.shouldShowWarning()) {
-                var gradient = ctx.createLinearGradient(0, 0, this._roundedWidth, 0);
-                if (this._source.mediaEndTime < this._source.duration) {
-                    var rightStopPosition = Math.max(1 - this._source.warningWidth / this._roundedWidth, 0.5);
-                    gradient.addColorStop(rightStopPosition, this._source.backgroundColor);
-                    gradient.addColorStop(1, this._source.warningColor);
-                }
-                if (this._source.mediaStartTime > 0) {
-                    var leftStopPosition = Math.min(this._source.warningWidth / this._roundedWidth, 0.5);
-                    gradient.addColorStop(0, this._source.warningColor);
-                    gradient.addColorStop(leftStopPosition, this._source.backgroundColor);
+        if (width > 0) {
+            ctx.beginPath();
+            ctx.moveTo(x + radius, offset);
+            ctx.lineTo(xWidth - radius, offset);
+            ctx.quadraticCurveTo(xWidth - offset, offset, xWidth - offset, radius);
+            ctx.lineTo(xWidth - offset, this._height - radius);
+            ctx.quadraticCurveTo(xWidth - offset, this._height - offset, xWidth - radius, this._height - offset);
+            ctx.lineTo(x + radius, this._height - offset);
+            ctx.quadraticCurveTo(x + offset, this._height - offset, x + offset, this._height - radius);
+            ctx.lineTo(x + offset, radius);
+            ctx.quadraticCurveTo(x + offset, offset, x + radius, offset);
+            ctx.closePath();
+            if (fill) {
+                if (this._source.shouldShowWarning()) {
+                    var gradient = ctx.createLinearGradient(0, 0, this._width, 0);
+                    if (this._source.mediaEndTime < this._source.duration) {
+                        var rightStopPosition = Math.max(1 - this._source.warningWidth / this._width, 0.5);
+                        gradient.addColorStop(rightStopPosition, this._source.backgroundColor);
+                        gradient.addColorStop(1, this._source.warningColor);
+                    }
+                    if (this._source.mediaStartTime > 0) {
+                        var leftStopPosition = Math.min(this._source.warningWidth / this._width, 0.5);
+                        gradient.addColorStop(0, this._source.warningColor);
+                        gradient.addColorStop(leftStopPosition, this._source.backgroundColor);
+                    }
+                    ctx.fillStyle = gradient;
+                    ctx.fill();
+                } else {
+                    ctx.fillStyle = this._source.backgroundColor;
+                    ctx.fill();
                 }
-                ctx.fillStyle = gradient;
-                ctx.fill();
-            } else {
-                ctx.fillStyle = this._source.backgroundColor;
-                ctx.fill();
             }
-        }
-        if (shape) {
-            ctx.fillStrokeShape(shape);
+            if (shape) {
+                ctx.fillStrokeShape(shape);
+            }
         }
     };
     SourceGroup.prototype._addUnwrap = function (forceCreate) {
@@ -18984,6 +18953,13 @@ module.exports = function (WaveformBuilder, WaveformShape, Utils, Loader, Konva)
     SourceGroup.prototype.getCurrentHeight = function () {
         return this._height;
     };
+    SourceGroup.prototype.getHeights = function () {
+        return {
+            unwrapped: this._unwrappedHeight,
+            wrapped: this._wrappedHeight,
+            current: this._height
+        };
+    };
     SourceGroup.prototype.setVisible = function (boolean) {
         this._group.visible(boolean);
     };
@@ -19366,6 +19342,16 @@ module.exports = function (WaveformBuilder, WaveformShape, Utils, Loader, Konva)
         }
         this._group.destroy();
     };
+    SourceGroup.getHeights = function (source, peaks) {
+        var unwrappedHeight = source.binaryHeight && source.previewHeight ? source.binaryHeight + source.previewHeight : peaks.options.lineHeight;
+        var wrappedHeight = peaks.options.wrappedLineHeight;
+        var height = source.wrapped ? wrappedHeight : unwrappedHeight;
+        return {
+            unwrapped: unwrappedHeight,
+            wrapped: wrappedHeight,
+            current: height
+        };
+    };
     return SourceGroup;
 }(_dereq_('./waveform-builder'), _dereq_('./waveform-shape'), _dereq_('./utils'), _dereq_('./loader'), _dereq_('konva'));
 },{"./loader":94,"./utils":113,"./waveform-builder":114,"./waveform-shape":115,"konva":43}],106:[function(_dereq_,module,exports){
@@ -20372,7 +20358,6 @@ module.exports = function (SourceGroup, Lines, DataRetriever, Utils, Invoker, Ko
         this._peaks.on('source.update', this._onSourceUpdate.bind(this));
         this._peaks.on('data.retrieved', this._onDataRetrieved.bind(this));
         this._peaks.on('segments.show', this._onSegmentsShow.bind(this));
-        this._peaks.on('options.set.line_height', this._onOptionsLineHeightChange.bind(this));
         this._peaks.on('source.setIndicators', this.setIndicators.bind(this));
     }
     SourcesLayer.prototype.fitToView = function () {
@@ -20399,23 +20384,6 @@ module.exports = function (SourceGroup, Lines, DataRetriever, Utils, Invoker, Ko
     SourcesLayer.prototype.isEditingEnabled = function () {
         return this._allowEditing;
     };
-    SourcesLayer.prototype._onOptionsLineHeightChange = function (oldHeight) {
-        var positions = [];
-        for (var sourceId in this._sourcesGroup) {
-            if (Utils.objectHasProperty(this._sourcesGroup, sourceId)) {
-                var source = this._sourcesGroup[sourceId].getSource();
-                if (!positions.includes(source.position)) {
-                    this._lines.changeLineHeight(oldHeight, this._peaks.options.lineHeight);
-                    positions.push(source.position);
-                }
-                this._removeSource(source);
-                this._addSourceGroup(source);
-            }
-        }
-        if (positions) {
-            this.refresh();
-        }
-    };
     SourcesLayer.prototype.refresh = function () {
         var frameOffset = this._view.getFrameOffset();
         var width = this._view.getWidth();
@@ -20449,13 +20417,6 @@ module.exports = function (SourceGroup, Lines, DataRetriever, Utils, Invoker, Ko
         }.bind(this));
         this.draw();
     };
-    SourcesLayer.prototype._onSourcesShow = function (sources) {
-        var self = this;
-        sources.forEach(function (source) {
-            self._sourcesGroup[source.id].setWrapping(false, true);
-        });
-        this._layer.draw();
-    };
     SourcesLayer.prototype._onSourcesAdd = function (sources) {
         var self = this;
         var frameOffset = self._view.getFrameOffset();
@@ -20525,7 +20486,7 @@ module.exports = function (SourceGroup, Lines, DataRetriever, Utils, Invoker, Ko
     SourcesLayer.prototype._addSourceGroup = function (source, startDataRetrieval = true) {
         var sourceGroup = this._createSourceGroup(source);
         this._sourcesGroup[source.id] = sourceGroup;
-        this._lines.addSourceGroup(sourceGroup, source.position);
+        this._lines.addSourceGroup(source, sourceGroup, source.position);
         if (startDataRetrieval) {
             this._dataRetriever.retrieveData(source);
         }
@@ -20552,13 +20513,28 @@ module.exports = function (SourceGroup, Lines, DataRetriever, Utils, Invoker, Ko
     SourcesLayer.prototype.onSourcesGroupDragStart = function (element) {
         this._initialTimeOffset = this._view.getTimeOffset();
         this._mouseDownX = this._view.getPointerPosition().x;
-        this._activeElements = {};
         const draggedElementId = element.currentTarget.attrs.sourceId;
-        const shouldDragSelectedElements = Object.keys(this._view.getSelectedElements()).includes(draggedElementId);
-        this._nonSelectedElement = shouldDragSelectedElements ? null : [this._sourcesGroup[draggedElementId].getSource()];
+        var selectedElements = this._view.getSelectedElements();
+        const shouldDragSelectedElements = Object.keys(selectedElements).includes(draggedElementId);
+        if (shouldDragSelectedElements) {
+            this._draggedElements = Object.values(selectedElements).sort((a, b) => a.startTime - b.startTime);
+        } else {
+            this._draggedElements = [this._sourcesGroup[draggedElementId].getSource()];
+            this._view.deselectAll();
+        }
+        this._draggedElementsData = this._draggedElements.reduce(function (bounds, source) {
+            bounds.initialStartTime = Math.min(source.startTime, bounds.initialStartTime);
+            bounds.initialEndTime = Math.max(source.endTime, bounds.initialEndTime);
+            bounds.orderable = source.orderable && bounds.orderable;
+            return bounds;
+        }, {
+            initialStartTime: Infinity,
+            initialEndTime: -Infinity,
+            orderable: true
+        });
     };
     SourcesLayer.prototype.onSourcesGroupDragEnd = function () {
-        const updatedSources = (this._nonSelectedElement || Object.values(this._view.getSelectedElements())).map(function (source) {
+        const updatedSources = this._draggedElements.map(function (source) {
             const sourceGroup = this._sourcesGroup[source.id];
             if (sourceGroup) {
                 sourceGroup.prepareDragEnd();
@@ -20567,7 +20543,6 @@ module.exports = function (SourceGroup, Lines, DataRetriever, Utils, Invoker, Ko
         }.bind(this));
         this._view.drawSourcesLayer();
         this._view.updateTimelineLength();
-        this._activeElements = {};
         this._peaks.emit('sources.updated', updatedSources);
     };
     SourcesLayer.prototype.onSourcesGroupDrag = function (draggedElement) {
@@ -20579,27 +20554,15 @@ module.exports = function (SourceGroup, Lines, DataRetriever, Utils, Invoker, Ko
     };
     SourcesLayer.prototype._dragSourcesGroup = function () {
         var mousePos = Math.min(this._view.getWidth() - this._peaks.options.autoScrollThreshold * this._view.getWidth(), Math.max(0, this._view.getPointerPosition().x));
-        const diff = this._view.pixelsToTime(mousePos - this._mouseDownX);
+        const timeDiff = this._view.pixelsToTime(mousePos - this._mouseDownX);
         const timeOffsetDiff = this._view.getTimeOffset() - this._initialTimeOffset;
         const mousePosX = this._view.getPointerPosition().x;
         const mousePosY = this._view.getPointerPosition().y;
-        var newEnd = 0;
-        var shouldRedraw = false;
-        (this._nonSelectedElement || Object.values(this._view.getSelectedElements())).forEach(function (source) {
-            if (!this._activeElements[source.id]) {
-                this._activeElements[source.id] = {
-                    initialStartTime: source.startTime,
-                    initialEndTime: source.endTime
-                };
-            }
-            const {initialStartTime, initialEndTime} = this._activeElements[source.id];
-            newEnd = Math.max(newEnd, source.endTime);
-            shouldRedraw = this.updateSource(source, initialStartTime + diff + timeOffsetDiff, initialEndTime + diff + timeOffsetDiff, mousePosX, mousePosY) || shouldRedraw;
-        }.bind(this));
+        const {initialStartTime, initialEndTime, orderable} = this._draggedElementsData;
+        const shouldRedraw = this.manageSourceMovements(this._draggedElements, initialStartTime + timeOffsetDiff + timeDiff, initialEndTime + timeOffsetDiff + timeDiff, orderable, mousePosX, mousePosY);
         if (shouldRedraw) {
             this.draw();
         }
-        this._view.setTimelineLength(this._view.timeToPixels(newEnd) + this._view.getWidth());
     };
     SourcesLayer.prototype.findSources = function (startTime, endTime) {
         var sources = this._peaks.sources.find(startTime, endTime);
@@ -20608,31 +20571,41 @@ module.exports = function (SourceGroup, Lines, DataRetriever, Utils, Invoker, Ko
             return positions[source.position];
         });
     };
-    SourcesLayer.prototype.updateSource = function (source, startTime, endTime, mouseX, mouseY) {
-        var newTimes = {
-            start: startTime,
-            end: endTime
-        };
-        if (this._peaks.options.canMoveSourcesBetweenLines) {
-            this.manageVerticalPosition(source, mouseX, mouseY);
-        }
-        newTimes = this.manageSourceOrder(source, newTimes);
-        newTimes = this.manageCollision(source, newTimes);
-        source.updateTimes(newTimes.start, newTimes.end);
-        if (newTimes) {
-            this._updateSource(source);
-            return true;
+    SourcesLayer.prototype._applyTimeChangesToSources = function (sources, initialStartTime, newStartTime, newEndTime) {
+        if (sources.length === 1) {
+            sources[0].updateTimes(newStartTime, newEndTime);
+        } else {
+            const timeDiff = Utils.roundTime(newStartTime - initialStartTime);
+            if (timeDiff !== 0) {
+                sources.forEach(function (source) {
+                    source.updateTimes(Utils.roundTime(source.startTime + timeDiff), Utils.roundTime(source.endTime + timeDiff));
+                });
+            }
         }
-        return false;
+        this.refresh();
+    };
+    SourcesLayer.prototype.manageSourceMovements = function (sources, newStartTime, newEndTime, orderable, mouseX, mouseY) {
+        newStartTime = typeof newStartTime === 'number' ? Utils.roundTime(newStartTime) : newStartTime;
+        newEndTime = typeof newEndTime === 'number' ? Utils.roundTime(newEndTime) : newEndTime;
+        if (this._peaks.options.canMoveSourcesBetweenLines && typeof mouseY === 'number') {
+            this.manageVerticalPosition(sources, newStartTime, newEndTime, mouseX, mouseY);
+        }
+        if (orderable) {
+            ({newStartTime, newEndTime} = this.manageOrder(sources, newStartTime, newEndTime));
+        }
+        ({newStartTime, newEndTime} = this.manageCollision(sources, newStartTime, newEndTime));
+        this._applyTimeChangesToSources(sources, sources[0].startTime, newStartTime, newEndTime);
+        this._view.setTimelineLength(this._view.timeToPixels(sources[sources.length - 1].endTime) + this._view.getWidth());
+        return true;
     };
-    SourcesLayer.prototype.manageVerticalPosition = function (source, mouseX, mouseY) {
-        return this._lines.manageVerticalPosition(source, mouseX, mouseY);
+    SourcesLayer.prototype.manageVerticalPosition = function (sources, startTime, endTime, mouseX, mouseY) {
+        return this._lines.manageVerticalPosition(sources, startTime, endTime, mouseX, mouseY);
     };
-    SourcesLayer.prototype.manageSourceOrder = function (source, newTimes) {
-        return this._lines.manageSourceOrder(source, newTimes);
+    SourcesLayer.prototype.manageOrder = function (sources, startTime, endTime) {
+        return this._lines.manageOrder(sources, startTime, endTime);
     };
-    SourcesLayer.prototype.manageCollision = function (source, newTimes) {
-        return this._lines.manageCollision(source, newTimes);
+    SourcesLayer.prototype.manageCollision = function (sources, newStartTime, newEndTime) {
+        return this._lines.manageCollision(sources, newStartTime, newEndTime);
     };
     SourcesLayer.prototype._updateSource = function (source) {
         var sourceGroup = this._findOrAddSourceGroup(source);
@@ -20767,7 +20740,6 @@ module.exports = function (SourceGroup, Lines, DataRetriever, Utils, Invoker, Ko
         this._peaks.off('source.update', this._onSourceUpdate);
         this._peaks.off('data.retrieved', this._onDataRetrieved);
         this._peaks.off('segments.show', this._onSegmentsShow);
-        this._peaks.off('options.set.line_height', this._onOptionsLineHeightChange);
         this._peaks.off('source.setIndicators', this.setIndicators);
     };
     SourcesLayer.prototype.getHeight = function () {
@@ -21324,10 +21296,16 @@ module.exports = function (Source, Utils) {
         }, shouldBlockEvent);
     };
     TimelineSources.prototype.showById = function (sourceId) {
+        if (this._sourcesById[sourceId].wrapped === false) {
+            return;
+        }
         this._sourcesById[sourceId].wrapped = false;
         this._peaks.emit('sources.show', [this._sourcesById[sourceId]]);
     };
     TimelineSources.prototype.hideById = function (sourceId) {
+        if (this._sourcesById[sourceId].wrapped === true) {
+            return;
+        }
         this._sourcesById[sourceId].wrapped = true;
         this._peaks.emit('sources.hide', [this._sourcesById[sourceId]]);
     };