Leaflet polyline draggable

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.0-beta.2/leaflet-src.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.0-beta.2/leaflet.css">
<script src="//revh.github.io/leaflet-draggable-polyline/leaflet.geometryutil.js"></script>
<script src="//rawgithub.com/RevH/leaflet-draggable-polyline/master/leaflet-draggable-polyline.js"></script>
<body>
<div id="mapWrapper">
  <div id="map" ></div>
</div>
</body>

CSS

html, body, #map {
        margin: 0;
        width: 100%;
        height: 100%;
}

#mapWrapper
{
  padding: 10px;
  margin: 10px;
  width: 100%;
  height: 100%;
}

JavaScript

var map = new L.Map('map', {
                center: new L.LatLng(51.86146, 4.1572266),
                zoom: 12
            });

L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {attribution: '&copy; <a href="https://osm.org/copyright">OpenStreetMap</a> contributors'}).addTo(map);

var polyline = L.polyline([
    [51.861397 , 4.157052],
				[51.861299 , 4.157419],
				[51.86487 , 4.171902],
				[51.869115 , 4.179386],
				[51.872673 , 4.184754],
				[51.875703 , 4.188789],
				[51.87909 , 4.191947],
				[51.882143 , 4.193553],
				[51.887436 , 4.195128],
				[51.890161 , 4.196784]
], {edit_with_drag: true, color : '#e87c35'}).addTo(map);


/**
marker.on('dragstart', function(e){
        var opts = {
           iconAnchor: new L.Point(12, 40),
           iconUrl: 'https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.0-beta.2/images/marker-icon.png'
        
        };
        marker.setIcon(new L.Icon(opts));
        
   console.log("a");
});


marker.on('dragend', function(e){
   console.log("1");
});

map.addLayer(marker);
*/