stroke looper animation

description.md

http://bouboucle.com?gist=013a23bb1fd2b537f420f32da4c810fe

looper.jsonp

load({"width":1366,"height":561,"speed":1,"lineData":[{"start":1718612345022,"last":765,"beat":2000,"lifetime":500,"color":"#303F9F","multiPeriod":1,"strokeWidth":20,"times":[2,156,173,190,206,227,240,257,273,289,306,323,339,357,373,389,406,423,439,457,473,489,507,523,540,556,573,590,607,623,640,657,672,689,740],"segments":[[259,393],[259,383],[265,320],[268,287],[271,250],[275,218],[279,198],[284,185],[290,175],[294,171],[299,167],[317,161],[335,157],[349,157],[369,161],[378,165],[386,170],[398,183],[407,196],[410,206],[417,236],[418,254],[418,263],[417,271],[414,274],[411,280],[397,291],[378,304],[348,321],[316,335],[304,339],[296,344],[290,346],[287,346],[283,346]]},{"start":1718612348328,"last":3470,"beat":2000,"lifetime":500,"color":"#303F9F","multiPeriod":1,"strokeWidth":20,"times":[1,99,116,132,149,166,182,199,216,232,249,266,282,299,316,332,366,399,416,432,449,466,482,499,516,532,549,565,582,599,615,632,649,665,682,699,715,733,749,765,782,799,816,832,849,865,882,898,915,932,948,965,982,998,1015,1032,1048,1065,1083,1099,1115,1133,1149,1166,1183,1198,1216,1233,1249,1266,1282,1298,1315,1332,1349,1365,1382,1399,1415,1432,1450,1465,1482,1499,1515,1532,1565,1600,1615,1632,1648,1665,1682,1699,1715,1732,1750,1765,1782,1815,1849,1865,1899,1915,1932,1965,1982,2015,2032,2065,2098,2132,2165,2182,2198,2215,2232,2248,2282,2298,2316,2331,2365,2416,2431,2448,2465,2481,2498,2515,2531,2548,2565,2581,2598,2615,2631,2648,2665,2681,2698,2715,2731,2748,2781,2798,2815,2837,2848,2864,2882,2898,2915,2931,2948,2964,2981,2998,3015,3032,3048,3065,3082,3098,3115,3132,3148,3164,3181,3198,3215,3232,3248,3265,3282,3299,3315,3332,3348,3365,3382,3398,3415,3432,3448,3465],"segments":[[409,380],[421,379],[443,375],[490,362],[502,356],[513,347],[519,339],[522,335],[522,331],[518,326],[515,322],[499,317],[466,307],[444,302],[429,300],[420,300],[416,303],[415,310],[418,315],[424,321],[431,326],[437,330],[442,336],[456,347],[468,354],[481,358],[502,364],[518,366],[532,366],[553,366],[569,365],[587,361],[610,349],[622,339],[633,328],[647,309],[653,293],[665,259],[687,183],[691,164],[695,116],[694,92],[690,80],[686,73],[680,66],[676,61],[666,58],[650,55],[644,55],[640,56],[632,62],[627,69],[624,80],[623,89],[624,100],[627,115],[632,139],[632,167],[632,195],[632,235],[632,257],[634,286],[634,305],[636,322],[638,332],[642,339],[647,350],[652,355],[657,360],[666,363],[674,363],[691,363],[716,362],[727,360],[735,358],[741,355],[744,350],[747,346],[749,338],[749,335],[749,315],[746,292],[745,274],[743,260],[739,245],[738,240],[738,236],[739,232],[748,230],[755,230],[774,230],[809,230],[827,231],[840,234],[850,237],[853,238],[857,242],[860,245],[862,249],[863,255],[863,260],[863,264],[863,269],[861,272],[858,277],[856,280],[853,283],[850,286],[847,288],[844,291],[841,294],[838,297],[837,302],[837,306],[837,310],[837,315],[838,320],[839,324],[846,332],[851,335],[854,337],[859,338],[864,338],[870,335],[874,328],[875,323],[878,317],[892,298],[902,282],[912,267],[921,255],[929,248],[938,241],[954,233],[972,227],[995,224],[1028,224],[1049,230],[1067,240],[1090,262],[1115,296],[1125,312],[1129,320],[1130,326],[1130,331],[1125,342],[1116,350],[1092,360],[1080,360],[1069,360],[1058,360],[1030,353],[1011,343],[996,336],[976,322],[964,314],[950,304],[933,288],[924,279],[918,273],[914,266],[911,263],[910,260],[909,254],[911,249],[919,242],[937,235],[959,233],[979,237],[998,248],[1008,256],[1013,261],[1017,266],[1020,270],[1026,278],[1052,311],[1072,330],[1091,343],[1108,351],[1117,352],[1123,352],[1135,346],[1144,341],[1153,331],[1172,305],[1180,290]]}],"backgroundColor":"rgb(255,255,255)"});