var pathString = "M0,0c0,0,14,184,157,184V86h173c0,0,105-3,105,93";

var arrayPath = [];

// Snap SVG method to create a set of cubic bezier curves from the path string
var newPath = Snap.path.toCubic(pathString);

function setUpPoint(segment){

	//using +=2 in the loop thanks to GSAP's Geek Ambassador, animation superhero Carl Schooff :D
	for(var i = 0; i < segment.length; i+=2){

		//create a new object for the point so it can be passed into the bezier plugin
		var point = {};

		point.x = segment[i];
		point.y = segment[i+1];

		//add the point to the array
		arrayPath.push(point);

		$("#logDiv").append("{x:" + point.x +"y:" + point.y + "}, ");
	}//loop end
}

// loop through the curves collection
for(var i = 0; i < newPath.length; i++){
	var segment = newPath[i],
			point;

	// the first element returned in the array is a letter, quite useless for the bezier Plugin, so we remove it
	segment.shift();

	//call the function to set up the points based on the segment returned	
	point = setUpPoint(segment);
}





/** STANDARD GSAP STUFF **/

var t = TweenMax.to("#div1", 3, {
	bezier:{
		type:"cubic",
		values:arrayPath
	},
	force3D:true,paused:true,ease:Linear.easeNone
}).reversed(true);


$("#btn1").click(function(e){
	t.reversed() ? t.play() : t.reverse();
});