stroke looper animation

description.md

http://bouboucle.com?gist=c0407275efcfdf5f9a6d2afa979cee8d

looper.jsonp

load({"width":922,"height":670.33,"speed":1,"lineData":[{"start":1601654672047,"last":1537,"beat":2000,"lifetime":500,"color":"#303F9F","multiPeriod":1,"strokeWidth":20,"times":[1,171,180,187,197,204,214,221,231,238,247,253,264,269,279,287,298,304,313,320,336,346,354,370,386,395,412,429,436,444,452,462,469,478,485,494,502,508,519,527,543,558,575,595,608,624,640,657,674,690,707,715,724,732,740,748,757,765,773,781,790,798,807,814,823,839,848,856,872,889,898,905,914,931,939,955,972,988,1005,1022,1038,1055,1071,1088,1104,1121,1137,1154,1171,1180,1196,1204,1220,1229,1237,1246,1254,1263,1270,1280,1287,1303,1313,1328,1345,1352,1369,1377,1396,1412,1429,1446,1461,1470,1485,1495,1503],"segments":[[122,245],[122,239],[122,233],[122,228],[122,222],[122,217],[122,211],[124,203],[126,195],[128,189],[131,182],[133,176],[137,171],[140,167],[144,162],[148,159],[152,156],[156,154],[161,152],[165,151],[170,150],[173,150],[178,150],[184,150],[189,151],[192,153],[197,157],[202,163],[204,166],[207,170],[209,174],[212,180],[214,184],[216,189],[218,194],[219,199],[221,204],[223,208],[224,213],[226,216],[228,222],[231,227],[233,231],[236,235],[238,239],[241,241],[244,244],[247,247],[251,250],[256,252],[261,253],[264,253],[267,253],[271,253],[274,252],[277,250],[281,247],[284,244],[286,240],[289,237],[291,234],[292,230],[293,226],[294,222],[294,218],[295,213],[295,210],[295,207],[295,202],[295,198],[295,195],[296,192],[296,189],[297,185],[298,182],[300,176],[303,171],[306,166],[309,163],[312,159],[315,155],[318,151],[321,148],[324,145],[329,143],[332,142],[336,141],[340,141],[344,141],[347,141],[351,142],[354,143],[359,148],[362,151],[364,155],[366,158],[369,163],[371,167],[373,172],[374,177],[376,180],[378,185],[380,190],[384,195],[387,199],[390,201],[394,204],[397,206],[402,210],[407,213],[410,216],[414,218],[417,219],[420,220],[424,221],[427,221],[431,220]]},{"start":1601654680534,"last":1657,"beat":2000,"lifetime":500,"color":"#303F9F","multiPeriod":1,"strokeWidth":20,"times":[1,215,224,232,242,249,259,265,276,281,292,298,308,315,324,341,348,357,365,374,382,391,408,416,424,432,441,449,457,466,483,490,499,508,517,529,546,562,579,596,614,621,637,645,653,661,669,677,686,694,702,711,718,727,735,744,751,760,768,777,784,793,801,810,818,827,834,843,851,860,867,876,884,901,918,927,935,943,950,959,967,976,983,993,1000,1009,1017,1026,1034,1042,1050,1059,1067,1075,1083,1092,1100,1109,1117,1125,1134,1141,1151,1157,1168,1174,1183,1192,1200,1207,1218,1224,1234,1241,1251,1257,1267,1276,1284,1292,1300,1310,1316,1325,1333,1341,1350,1359,1366,1375,1383,1391,1400,1409,1417,1423,1433,1442,1450,1458,1467,1475,1483,1492,1500,1508,1516,1525,1533,1550,1567,1583],"segments":[[602,91],[595,91],[590,91],[580,91],[570,91],[560,91],[550,90],[545,90],[536,89],[527,88],[518,88],[511,87],[504,87],[498,86],[492,86],[486,86],[482,86],[477,86],[474,86],[471,86],[468,88],[465,89],[460,91],[457,93],[454,95],[451,97],[448,98],[445,101],[442,103],[439,106],[434,110],[431,113],[429,116],[426,119],[424,122],[421,126],[418,130],[417,134],[417,138],[417,143],[418,147],[420,150],[425,156],[428,158],[431,162],[434,165],[438,167],[442,170],[446,172],[451,174],[456,176],[462,177],[468,178],[474,179],[481,180],[488,181],[496,181],[503,182],[510,183],[516,183],[522,184],[526,184],[530,185],[534,185],[538,186],[542,187],[545,188],[549,189],[552,190],[555,192],[558,193],[561,195],[564,197],[569,202],[574,206],[577,209],[579,213],[582,217],[585,222],[587,226],[590,231],[592,236],[593,241],[594,246],[595,251],[595,256],[595,261],[595,267],[595,273],[592,279],[590,285],[586,290],[583,295],[579,301],[575,305],[571,309],[567,313],[564,316],[561,320],[557,323],[553,326],[550,327],[547,330],[543,331],[540,333],[537,335],[534,337],[531,338],[527,340],[524,341],[519,343],[514,345],[509,347],[504,348],[498,350],[493,351],[488,353],[482,355],[476,356],[470,357],[465,358],[459,360],[453,360],[447,361],[440,363],[433,363],[426,364],[419,364],[412,364],[406,364],[398,364],[391,364],[383,364],[375,364],[369,363],[362,361],[356,359],[349,357],[343,355],[337,353],[332,351],[327,348],[322,345],[318,343],[313,340],[309,337],[305,333],[302,330],[298,327],[295,323],[292,319],[292,316]]},{"start":1601654685043,"last":411,"beat":2000,"lifetime":500,"color":"#303F9F","multiPeriod":1,"strokeWidth":20,"times":[1],"segments":[[190,366]]},{"start":1601654696388,"last":4339,"beat":2000,"lifetime":500,"color":"#FF7043","multiPeriod":1,"strokeWidth":20,"times":[0,983,1066,1206,1248,1289,1314,1347,1364,1397,1430,1463,1496,1522,1539,1555,1572,1589,1605,1629,1655,1695,1729,1762,1786,1803,1820,1837,1854,1870,1895,1995,2029,2062,2104,2137,2162,2188,2211,2237,2270,2312,2362,2394,2425,2444,2502,2603,2632,2766,2791,2807,2832,2857,2898,2932,2966,2989,3013,3039,3063,3090,3113,3140,3164,3190,3212,3238,3263,3280,3297,3313,3330,3347,3363,3380,3405,3446,3638,3712,3753,3779,3803,3827,3852,3877,3911,3961,4000,4050,4110,4158,4198,4206],"segments":[[365,263],[362,262],[359,263],[356,265],[353,268],[351,271],[350,274],[348,277],[347,280],[346,284],[344,287],[343,290],[340,292],[337,294],[334,295],[331,297],[327,297],[324,298],[321,299],[318,299],[315,299],[312,296],[310,293],[308,290],[306,287],[305,284],[304,281],[303,278],[302,275],[301,272],[301,269],[299,266],[296,264],[293,262],[290,259],[287,258],[284,257],[281,257],[278,256],[275,256],[272,255],[269,255],[266,258],[264,262],[262,265],[260,269],[258,272],[258,275],[259,278],[259,281],[259,284],[259,287],[259,291],[258,294],[256,297],[253,300],[250,303],[247,305],[244,306],[241,308],[238,308],[235,308],[232,308],[229,308],[226,308],[223,307],[220,305],[217,302],[215,299],[213,296],[212,293],[210,290],[209,287],[208,284],[207,281],[206,278],[206,275],[205,272],[202,270],[202,273],[202,276],[202,279],[202,283],[202,286],[202,289],[202,292],[202,295],[202,298],[202,301],[202,304],[202,307],[203,310],[206,313],[209,314]]},{"start":1601654704647,"last":4298,"beat":2000,"lifetime":500,"color":"#FF7043","multiPeriod":1,"strokeWidth":20,"times":[0,678,803,877,960,1041,1141,1207,1240,1281,1331,1373,1399,1439,1473,1521,1563,1596,1629,1663,1713,1762,1803,1836,1878,1928,1979,2011,2070,2111,2135,2153,2178,2227,2341,2376,2407,2440,2499,2565,2606,2648,2681,2706,2731,2755,2781,2805,2838,2880,2913,2956,3004,3054,3103,3163,3237,3304,3344,3386,3453,3519,3652,3741,3815,3856,3898,3940,3980,4014,4039,4056,4080,4105,4138,4180,4254],"segments":[[383,172],[383,169],[385,166],[386,163],[389,161],[392,160],[395,160],[398,161],[401,162],[404,163],[407,166],[409,169],[410,172],[411,175],[413,178],[416,181],[419,182],[422,183],[425,183],[428,183],[431,180],[433,177],[435,174],[436,171],[438,168],[439,165],[440,162],[442,159],[445,156],[448,156],[451,156],[454,156],[457,156],[460,156],[461,159],[463,162],[464,165],[466,168],[468,171],[469,174],[471,177],[473,180],[475,183],[478,185],[481,186],[484,187],[487,188],[490,188],[493,188],[495,185],[498,182],[500,179],[503,176],[505,173],[508,170],[510,167],[513,165],[516,163],[519,160],[522,159],[525,158],[528,158],[531,161],[533,164],[534,167],[536,170],[538,173],[541,176],[544,177],[547,178],[550,178],[553,178],[556,178],[559,177],[562,175],[565,173],[567,170]]},{"start":1601654711894,"last":3746,"beat":2000,"lifetime":500,"color":"#FF7043","multiPeriod":1,"strokeWidth":20,"times":[1,422,522,621,701,776,834,892,950,1001,1058,1108,1133,1166,1223,1315,1340,1358,1381,1415,1564,1614,1697,1806,1864,1921,1972,2027,2068,2110,2151,2176,2192,2226,2251,2284,2383,2450,2491,2533,2573,2623,2673,2715,2756,2799,2848,2907,2980,3048,3090,3257,3290,3314,3347,3397,3440,3473,3511,3546,3589],"segments":[[529,316],[528,313],[525,311],[522,310],[519,310],[516,310],[513,310],[510,311],[507,312],[504,314],[502,317],[500,320],[499,323],[498,326],[496,329],[493,329],[490,329],[487,329],[484,329],[481,329],[478,329],[475,328],[472,326],[470,323],[467,320],[465,317],[462,315],[459,314],[456,314],[453,313],[450,313],[447,313],[444,313],[441,313],[438,314],[435,315],[434,318],[433,321],[431,324],[430,327],[428,330],[427,333],[424,335],[421,338],[418,340],[415,342],[412,344],[409,345],[406,345],[403,344],[402,341],[399,338],[396,336],[393,335],[390,334],[387,333],[384,333],[381,333],[378,333],[375,333],[372,333]]},{"start":1601654722068,"last":1728,"beat":2000,"lifetime":500,"color":"#1A237E","multiPeriod":1,"strokeWidth":20,"times":[1,339,349,354,365,370,378,386,396,402,410,418,427,435,443,452,460,468,477,484,494,501,510,518,527,534,543,551,561,568,577,584,593,601,610,617,626,643,658,667,676,684,700,708,725,733,744,749,759,768,775,784,791,801,817,834,851,868,885,901,918,934,952,956,973,985,990,1001,1006,1018,1023,1034,1039,1051,1056,1067,1072,1083,1100,1106,1116,1123,1139,1150,1156,1172,1189,1205,1222,1233,1238,1250,1255,1267,1272,1283,1288,1300,1305,1317,1320,1333,1336,1346,1353,1361,1370,1378,1386,1395,1403,1411,1420,1428,1436,1444,1452,1469,1485,1502,1519,1535,1544,1552,1561,1568,1577,1585,1594,1601,1611,1618,1627,1634,1651,1667,1677,1693,1710],"segments":[[206,399],[209,403],[211,406],[213,409],[215,412],[219,416],[222,420],[225,424],[230,428],[234,432],[239,436],[244,440],[248,443],[254,446],[258,448],[263,451],[267,453],[271,455],[275,456],[279,458],[283,459],[288,460],[291,461],[295,462],[299,463],[303,463],[307,464],[310,464],[314,464],[318,464],[323,464],[327,464],[332,464],[336,463],[340,462],[344,461],[347,460],[354,457],[359,455],[362,454],[365,453],[368,451],[373,448],[376,446],[381,441],[384,439],[387,436],[390,432],[394,430],[396,427],[400,424],[403,421],[406,419],[408,416],[412,413],[416,408],[420,403],[424,399],[428,395],[430,392],[434,389],[438,386],[441,384],[444,383],[449,382],[452,381],[455,381],[459,381],[463,381],[468,381],[473,381],[477,381],[482,381],[486,381],[491,381],[497,381],[501,382],[505,382],[511,383],[516,384],[519,384],[523,385],[527,385],[530,386],[533,387],[539,388],[544,390],[549,391],[554,392],[557,392],[560,393],[563,393],[567,393],[570,393],[574,393],[579,393],[584,393],[589,393],[593,392],[598,391],[604,389],[609,387],[614,385],[619,383],[624,381],[628,379],[633,377],[637,374],[642,372],[646,369],[651,367],[655,364],[660,361],[664,359],[668,356],[672,353],[675,351],[679,348],[684,343],[689,338],[692,334],[695,329],[697,325],[699,322],[700,318],[702,314],[703,310],[704,305],[704,300],[705,294],[705,289],[705,283],[705,278],[705,274],[705,265],[705,260],[705,257],[705,253],[705,248]]}],"backgroundColor":"rgb(255,255,255)"});