stroke looper animation

looper.jsonp

load({"width":687,"height":720.33,"lineData":[{"start":1525164856034,"last":690,"beat":2000,"lifetime":500,"color":"#212121","multiPeriod":1,"strokeWidth":20,"times":[0,68,84,100,118,134,150,166,184,200,218,234,250,266,284,300,318,334,350,368,384,400,416,434,450,466,484,584,600,618,634,650,666,684,690],"segments":[[289,109],[292,112],[296,113],[301,116],[307,120],[313,125],[325,134],[336,147],[354,166],[373,189],[391,211],[409,233],[422,248],[431,259],[435,271],[438,281],[438,292],[438,304],[435,318],[433,326],[432,333],[431,338],[427,346],[422,353],[418,362],[413,367],[411,370],[411,365],[406,357],[403,347],[401,338],[401,323],[407,308],[417,293],[422,281]]},{"start":1525164857546,"last":1592,"beat":2000,"lifetime":500,"color":"#212121","multiPeriod":1,"strokeWidth":20,"times":[0,88,104,122,138,154,172,188,204,222,288,306,322,338,356,372,388,404,422,438,454,472,504,522,538,554,572,588,606,622,638,654,672,688,704,720,738,754,772,788,804,822,838,854,870,888,904,922,954,988,1004,1022,1038,1054,1072,1088,1104,1122,1138,1156,1172,1188,1206,1222,1238,1254,1288,1304,1322,1338,1354,1372,1388,1404,1422,1438,1454,1472,1488,1504,1522,1538,1588],"segments":[[279,112],[275,115],[271,123],[270,131],[273,144],[284,160],[290,170],[307,195],[314,209],[316,216],[315,211],[301,208],[276,208],[245,211],[211,216],[182,224],[153,234],[132,242],[111,253],[98,263],[96,267],[94,272],[98,281],[107,290],[121,301],[150,319],[186,338],[233,359],[276,380],[309,391],[334,400],[354,403],[361,403],[372,399],[388,391],[408,374],[429,353],[445,335],[458,320],[467,310],[471,304],[476,299],[478,288],[479,281],[481,272],[482,261],[486,251],[489,246],[489,243],[497,252],[512,261],[525,273],[534,287],[542,301],[543,308],[546,319],[547,326],[549,337],[549,346],[549,356],[545,372],[541,395],[537,417],[535,428],[532,439],[530,443],[525,444],[522,446],[517,450],[506,452],[488,455],[469,455],[455,455],[434,450],[419,440],[408,430],[401,416],[400,406],[400,398],[400,389],[400,381],[401,378],[402,373]]}]});