]> _ Git - fluidbook-toolbox-quiz.git/commitdiff
wait #6194 @1:30 animation des confettis
authorsoufiane <soufiane@cubedesigners.com>
Thu, 28 Sep 2023 14:30:52 +0000 (16:30 +0200)
committersoufiane <soufiane@cubedesigners.com>
Thu, 28 Sep 2023 14:30:52 +0000 (16:30 +0200)
animations/CONFETTI.json [new file with mode: 0644]
js/quiz.screen.outro.js
style/105-outro.sass
views/screens/outro.blade.php

diff --git a/animations/CONFETTI.json b/animations/CONFETTI.json
new file mode 100644 (file)
index 0000000..a66043a
--- /dev/null
@@ -0,0 +1 @@
+{"v":"5.9.0","fr":60,"ip":0,"op":300,"w":330,"h":330,"nm":"CONFETTI","ddd":0,"assets":[],"layers":[{"ddd":0,"ind":1,"ty":4,"nm":"OUTRO_CONFETTI Silhouettes 10","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.333],"y":[0]},"t":0,"s":[0]},{"t":20,"s":[100]}],"ix":11},"r":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.111],"y":[0]},"t":0,"s":[-200]},{"t":180,"s":[0]}],"ix":10},"p":{"a":1,"k":[{"i":{"x":0,"y":0.856},"o":{"x":0.168,"y":0},"t":0,"s":[165,165,0],"to":[0,0,0],"ti":[0.069,0.058,0]},{"i":{"x":0.667,"y":1},"o":{"x":0.167,"y":0.246},"t":60,"s":[77.773,91.639,0],"to":[-14.538,-12.227,0],"ti":[0,0.833,0]},{"t":240,"s":[52.273,70.139,0]}],"ix":2,"l":2},"a":{"a":0,"k":[49.273,9.889,0],"ix":1,"l":2},"s":{"a":1,"k":[{"i":{"x":[0,0,0.667],"y":[1,1,1]},"o":{"x":[0.135,0.135,0.333],"y":[0,0,0]},"t":0,"s":[20,20,100]},{"t":60,"s":[100,100,100]}],"ix":6,"l":2}},"ao":0,"ef":[{"ty":29,"nm":"Flou gaussien","np":5,"mn":"ADBE Gaussian Blur 2","ix":1,"en":1,"ef":[{"ty":0,"nm":"Flou","mn":"ADBE Gaussian Blur 2-0001","ix":1,"v":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":0,"s":[20]},{"t":60,"s":[0]}],"ix":1}},{"ty":7,"nm":"Dimensions de flou","mn":"ADBE Gaussian Blur 2-0002","ix":2,"v":{"a":0,"k":1,"ix":2}},{"ty":7,"nm":"Recopier les pixels du contour","mn":"ADBE Gaussian Blur 2-0003","ix":3,"v":{"a":0,"k":0,"ix":3}}]}],"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,0],[-3.955,1.598],[-1.598,-3.956]],"o":[[-1.598,-3.956],[3.956,-1.598],[0,0]],"v":[[-6.363,5.827],[-2.095,-4.229],[7.961,0.04]],"c":false},"ix":2},"nm":"Tracé 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"st","c":{"a":0,"k":[0.894117706897,1,0.098039223166,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":3,"ix":5},"lc":2,"lj":1,"ml":4,"bm":0,"nm":"Contour 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"tr","p":{"a":0,"k":[48.756,9.372],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformer "}],"nm":"Groupe 1","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":300,"st":-196,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"OUTRO_CONFETTI Silhouettes 9","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.333],"y":[0]},"t":10,"s":[0]},{"t":30,"s":[100]}],"ix":11},"r":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.111],"y":[0]},"t":10,"s":[150]},{"t":190,"s":[0]}],"ix":10},"p":{"a":1,"k":[{"i":{"x":0,"y":0.848},"o":{"x":0.168,"y":0},"t":10,"s":[165,165,0],"to":[0,0,0],"ti":[-0.074,0.044,0]},{"i":{"x":0.667,"y":1},"o":{"x":0.167,"y":0.341},"t":70,"s":[257.51,110.086,0],"to":[15.418,-9.152,0],"ti":[-1.375,1,0]},{"t":250,"s":[278.26,97.836,0]}],"ix":2,"l":2},"a":{"a":0,"k":[229.01,28.336,0],"ix":1,"l":2},"s":{"a":1,"k":[{"i":{"x":[0,0,0.667],"y":[1,1,1]},"o":{"x":[0.135,0.135,0.333],"y":[0,0,0]},"t":10,"s":[20,20,100]},{"t":70,"s":[100,100,100]}],"ix":6,"l":2}},"ao":0,"ef":[{"ty":29,"nm":"Flou gaussien","np":5,"mn":"ADBE Gaussian Blur 2","ix":1,"en":1,"ef":[{"ty":0,"nm":"Flou","mn":"ADBE Gaussian Blur 2-0001","ix":1,"v":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":10,"s":[20]},{"t":70,"s":[0]}],"ix":1}},{"ty":7,"nm":"Dimensions de flou","mn":"ADBE Gaussian Blur 2-0002","ix":2,"v":{"a":0,"k":1,"ix":2}},{"ty":7,"nm":"Recopier les pixels du contour","mn":"ADBE Gaussian Blur 2-0003","ix":3,"v":{"a":0,"k":0,"ix":3}}]}],"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,0],[0,0],[0,0],[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0],[0,0],[0,0],[0,0]],"v":[[6.006,-3.945],[-0.473,-1.295],[-1.511,5.563],[-0.536,-1.302],[-6.006,-5.563],[-0.496,-1.351]],"c":true},"ix":2},"nm":"Tracé 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"st","c":{"a":0,"k":[0.894117706897,1,0.098039223166,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":3,"ix":5},"lc":2,"lj":2,"bm":0,"nm":"Contour 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"tr","p":{"a":0,"k":[229.506,29.687],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformer "}],"nm":"Groupe 2","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":10,"op":300,"st":-186,"bm":0},{"ddd":0,"ind":3,"ty":4,"nm":"OUTRO_CONFETTI Silhouettes 8","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.333],"y":[0]},"t":7,"s":[0]},{"t":27,"s":[100]}],"ix":11},"r":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.111],"y":[0]},"t":7,"s":[-180]},{"t":187,"s":[0]}],"ix":10},"p":{"a":1,"k":[{"i":{"x":0,"y":0.817},"o":{"x":0.168,"y":0},"t":7,"s":[165,165,0],"to":[0,0,0],"ti":[0.069,-0.019,0]},{"i":{"x":0.667,"y":1},"o":{"x":0.167,"y":0.441},"t":67,"s":[78.875,189,0],"to":[-14.354,4,0],"ti":[1.625,-0.25,0]},{"t":247,"s":[60.875,193.75,0]}],"ix":2,"l":2},"a":{"a":0,"k":[50.375,107.25,0],"ix":1,"l":2},"s":{"a":1,"k":[{"i":{"x":[0,0,0.667],"y":[1,1,1]},"o":{"x":[0.135,0.135,0.333],"y":[0,0,0]},"t":7,"s":[20,20,100]},{"t":67,"s":[100,100,100]}],"ix":6,"l":2}},"ao":0,"ef":[{"ty":29,"nm":"Flou gaussien","np":5,"mn":"ADBE Gaussian Blur 2","ix":1,"en":1,"ef":[{"ty":0,"nm":"Flou","mn":"ADBE Gaussian Blur 2-0001","ix":1,"v":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":7,"s":[20]},{"t":67,"s":[0]}],"ix":1}},{"ty":7,"nm":"Dimensions de flou","mn":"ADBE Gaussian Blur 2-0002","ix":2,"v":{"a":0,"k":1,"ix":2}},{"ty":7,"nm":"Recopier les pixels du contour","mn":"ADBE Gaussian Blur 2-0003","ix":3,"v":{"a":0,"k":0,"ix":3}}]}],"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[-1.105,0],[0,-1.105],[1.105,0],[0,1.105]],"o":[[1.105,0],[0,1.105],[-1.105,0],[0,-1.105]],"v":[[0,-2],[2,0],[0,2],[-2,0]],"c":true},"ix":2},"nm":"Tracé 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0.894117706897,1,0.098039223166,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fond 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[50.5,107.25],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformer "}],"nm":"Groupe 3","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":7,"op":300,"st":-189,"bm":0},{"ddd":0,"ind":4,"ty":4,"nm":"OUTRO_CONFETTI Silhouettes 7","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.333],"y":[0]},"t":3,"s":[0]},{"t":23,"s":[100]}],"ix":11},"r":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.111],"y":[0]},"t":3,"s":[120]},{"t":183,"s":[0]}],"ix":10},"p":{"a":1,"k":[{"i":{"x":0,"y":0.886},"o":{"x":0.168,"y":0},"t":3,"s":[165,165,0],"to":[0,0,0],"ti":[-0.095,0.064,0]},{"i":{"x":0.667,"y":1},"o":{"x":0.167,"y":0.29},"t":63,"s":[283.875,84.5,0],"to":[19.812,-13.417,0],"ti":[-0.583,0.708,0]},{"t":243,"s":[307.375,68.75,0]}],"ix":2,"l":2},"a":{"a":0,"k":[255.375,2.75,0],"ix":1,"l":2},"s":{"a":1,"k":[{"i":{"x":[0,0,0.667],"y":[1,1,1]},"o":{"x":[0.135,0.135,0.333],"y":[0,0,0]},"t":3,"s":[20,20,100]},{"t":63,"s":[100,100,100]}],"ix":6,"l":2}},"ao":0,"ef":[{"ty":29,"nm":"Flou gaussien","np":5,"mn":"ADBE Gaussian Blur 2","ix":1,"en":1,"ef":[{"ty":0,"nm":"Flou","mn":"ADBE Gaussian Blur 2-0001","ix":1,"v":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":3,"s":[20]},{"t":63,"s":[0]}],"ix":1}},{"ty":7,"nm":"Dimensions de flou","mn":"ADBE Gaussian Blur 2-0002","ix":2,"v":{"a":0,"k":1,"ix":2}},{"ty":7,"nm":"Recopier les pixels du contour","mn":"ADBE Gaussian Blur 2-0003","ix":3,"v":{"a":0,"k":0,"ix":3}}]}],"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[-1.105,0],[0,-1.105],[1.105,0],[0,1.105]],"o":[[1.105,0],[0,1.105],[-1.105,0],[0,-1.105]],"v":[[0,-2],[2,0],[0,2],[-2,0]],"c":true},"ix":2},"nm":"Tracé 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0.894117706897,1,0.098039223166,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fond 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[255.63,2.25],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformer "}],"nm":"Groupe 4","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":3,"op":300,"st":-193,"bm":0},{"ddd":0,"ind":5,"ty":4,"nm":"OUTRO_CONFETTI Silhouettes 6","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.333],"y":[0]},"t":1,"s":[0]},{"t":21,"s":[100]}],"ix":11},"r":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.111],"y":[0]},"t":1,"s":[100]},{"t":181,"s":[0]}],"ix":10},"p":{"a":1,"k":[{"i":{"x":0,"y":0.875},"o":{"x":0.168,"y":0},"t":1,"s":[165,165,0],"to":[0,0,0],"ti":[-0.104,0.01,0]},{"i":{"x":0.667,"y":1},"o":{"x":0.167,"y":0.303},"t":61,"s":[295.875,152.75,0],"to":[21.812,-2.042,0],"ti":[-0.833,0,0]},{"t":241,"s":[322.875,150.25,0]}],"ix":2,"l":2},"a":{"a":0,"k":[267.375,71,0],"ix":1,"l":2},"s":{"a":1,"k":[{"i":{"x":[0,0,0.667],"y":[1,1,1]},"o":{"x":[0.135,0.135,0.333],"y":[0,0,0]},"t":1,"s":[20,20,100]},{"t":61,"s":[100,100,100]}],"ix":6,"l":2}},"ao":0,"ef":[{"ty":29,"nm":"Flou gaussien","np":5,"mn":"ADBE Gaussian Blur 2","ix":1,"en":1,"ef":[{"ty":0,"nm":"Flou","mn":"ADBE Gaussian Blur 2-0001","ix":1,"v":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":1,"s":[20]},{"t":61,"s":[0]}],"ix":1}},{"ty":7,"nm":"Dimensions de flou","mn":"ADBE Gaussian Blur 2-0002","ix":2,"v":{"a":0,"k":1,"ix":2}},{"ty":7,"nm":"Recopier les pixels du contour","mn":"ADBE Gaussian Blur 2-0003","ix":3,"v":{"a":0,"k":0,"ix":3}}]}],"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[-2.209,0],[0,-2.209],[2.209,0],[0,2.209]],"o":[[2.209,0],[0,2.209],[-2.209,0],[0,-2.209]],"v":[[0,-4],[4,0],[0,4],[-4,0]],"c":true},"ix":2},"nm":"Tracé 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0.894117706897,1,0.098039223166,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fond 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[267.5,71.25],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformer "}],"nm":"Groupe 5","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":1,"op":300,"st":-195,"bm":0},{"ddd":0,"ind":6,"ty":4,"nm":"OUTRO_CONFETTI Silhouettes 5","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.333],"y":[0]},"t":5,"s":[0]},{"t":25,"s":[100]}],"ix":11},"r":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.111],"y":[0]},"t":5,"s":[-90]},{"t":185,"s":[0]}],"ix":10},"p":{"a":1,"k":[{"i":{"x":0,"y":0.847},"o":{"x":0.168,"y":0},"t":5,"s":[165,165,0],"to":[0,0,0],"ti":[-0.085,-0.009,0]},{"i":{"x":0.667,"y":1},"o":{"x":0.167,"y":0.352},"t":65,"s":[271.625,176,0],"to":[17.771,1.833,0],"ti":[-0.875,0.042,0]},{"t":245,"s":[294.875,177.75,0]}],"ix":2,"l":2},"a":{"a":0,"k":[243.125,94.25,0],"ix":1,"l":2},"s":{"a":1,"k":[{"i":{"x":[0,0,0.667],"y":[1,1,1]},"o":{"x":[0.135,0.135,0.333],"y":[0,0,0]},"t":5,"s":[20,20,100]},{"t":65,"s":[100,100,100]}],"ix":6,"l":2}},"ao":0,"ef":[{"ty":29,"nm":"Flou gaussien","np":5,"mn":"ADBE Gaussian Blur 2","ix":1,"en":1,"ef":[{"ty":0,"nm":"Flou","mn":"ADBE Gaussian Blur 2-0001","ix":1,"v":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":5,"s":[20]},{"t":65,"s":[0]}],"ix":1}},{"ty":7,"nm":"Dimensions de flou","mn":"ADBE Gaussian Blur 2-0002","ix":2,"v":{"a":0,"k":1,"ix":2}},{"ty":7,"nm":"Recopier les pixels du contour","mn":"ADBE Gaussian Blur 2-0003","ix":3,"v":{"a":0,"k":0,"ix":3}}]}],"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[-1.105,0],[0,-1.105],[1.105,0],[0,1.105]],"o":[[1.105,0],[0,1.105],[-1.105,0],[0,-1.105]],"v":[[0,-2],[2,0],[0,2],[-2,0]],"c":true},"ix":2},"nm":"Tracé 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0.894117706897,1,0.098039223166,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fond 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[243.5,94.25],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformer "}],"nm":"Groupe 6","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":5,"op":300,"st":-191,"bm":0},{"ddd":0,"ind":7,"ty":4,"nm":"OUTRO_CONFETTI Silhouettes 4","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.333],"y":[0]},"t":9,"s":[0]},{"t":29,"s":[100]}],"ix":11},"r":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.111],"y":[0]},"t":9,"s":[220]},{"t":189,"s":[0]}],"ix":10},"p":{"a":1,"k":[{"i":{"x":0,"y":0.838},"o":{"x":0.168,"y":0},"t":9,"s":[165,165,0],"to":[0,0,0],"ti":[0.076,0.027,0]},{"i":{"x":0.667,"y":1},"o":{"x":0.167,"y":0.403},"t":69,"s":[69.875,131,0],"to":[-15.854,-5.667,0],"ti":[0,0,0]},{"t":249,"s":[50.625,124.25,0]}],"ix":2,"l":2},"a":{"a":0,"k":[41.375,49.25,0],"ix":1,"l":2},"s":{"a":1,"k":[{"i":{"x":[0,0,0.667],"y":[1,1,1]},"o":{"x":[0.135,0.135,0.333],"y":[0,0,0]},"t":9,"s":[20,20,100]},{"t":69,"s":[100,100,100]}],"ix":6,"l":2}},"ao":0,"ef":[{"ty":29,"nm":"Flou gaussien","np":5,"mn":"ADBE Gaussian Blur 2","ix":1,"en":1,"ef":[{"ty":0,"nm":"Flou","mn":"ADBE Gaussian Blur 2-0001","ix":1,"v":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":9,"s":[20]},{"t":69,"s":[0]}],"ix":1}},{"ty":7,"nm":"Dimensions de flou","mn":"ADBE Gaussian Blur 2-0002","ix":2,"v":{"a":0,"k":1,"ix":2}},{"ty":7,"nm":"Recopier les pixels du contour","mn":"ADBE Gaussian Blur 2-0003","ix":3,"v":{"a":0,"k":0,"ix":3}}]}],"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[-1.105,0],[0,-1.105],[1.105,0],[0,1.105]],"o":[[1.105,0],[0,1.105],[-1.105,0],[0,-1.105]],"v":[[0,-2],[2,0],[0,2],[-2,0]],"c":true},"ix":2},"nm":"Tracé 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0.894117706897,1,0.098039223166,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fond 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[41.5,49.25],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformer "}],"nm":"Groupe 7","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":9,"op":300,"st":-187,"bm":0},{"ddd":0,"ind":8,"ty":4,"nm":"OUTRO_CONFETTI Silhouettes 3","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.333],"y":[0]},"t":12,"s":[0]},{"t":32,"s":[100]}],"ix":11},"r":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.111],"y":[0]},"t":12,"s":[90]},{"t":192,"s":[0]}],"ix":10},"p":{"a":1,"k":[{"i":{"x":0,"y":0.862},"o":{"x":0.168,"y":0},"t":12,"s":[165,165,0],"to":[0,0,0],"ti":[0.08,-0.05,0]},{"i":{"x":0.667,"y":1},"o":{"x":0.167,"y":0.29},"t":72,"s":[64,228,0],"to":[-16.833,10.5,0],"ti":[0.667,-0.375,0]},{"t":252,"s":[40.25,243.5,0]}],"ix":2,"l":2},"a":{"a":0,"k":[35.5,146.25,0],"ix":1,"l":2},"s":{"a":1,"k":[{"i":{"x":[0,0,0.667],"y":[1,1,1]},"o":{"x":[0.135,0.135,0.333],"y":[0,0,0]},"t":12,"s":[20,20,100]},{"t":72,"s":[100,100,100]}],"ix":6,"l":2}},"ao":0,"ef":[{"ty":29,"nm":"Flou gaussien","np":5,"mn":"ADBE Gaussian Blur 2","ix":1,"en":1,"ef":[{"ty":0,"nm":"Flou","mn":"ADBE Gaussian Blur 2-0001","ix":1,"v":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":12,"s":[20]},{"t":72,"s":[0]}],"ix":1}},{"ty":7,"nm":"Dimensions de flou","mn":"ADBE Gaussian Blur 2-0002","ix":2,"v":{"a":0,"k":1,"ix":2}},{"ty":7,"nm":"Recopier les pixels du contour","mn":"ADBE Gaussian Blur 2-0003","ix":3,"v":{"a":0,"k":0,"ix":3}}]}],"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[-2.209,0],[0,-2.209],[2.209,0],[0,2.209]],"o":[[2.209,0],[0,2.209],[-2.209,0],[0,-2.209]],"v":[[0,-4],[4,0],[0,4],[-4,0]],"c":true},"ix":2},"nm":"Tracé 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0.894117706897,1,0.098039223166,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fond 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[35.5,146.25],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformer "}],"nm":"Groupe 8","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":12,"op":300,"st":-184,"bm":0},{"ddd":0,"ind":9,"ty":4,"nm":"OUTRO_CONFETTI Silhouettes 2","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.333],"y":[0]},"t":2,"s":[0]},{"t":22,"s":[100]}],"ix":11},"r":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.111],"y":[0]},"t":2,"s":[-120]},{"t":182,"s":[0]}],"ix":10},"p":{"a":1,"k":[{"i":{"x":0,"y":0.853},"o":{"x":0.168,"y":0},"t":2,"s":[165,165,0],"to":[0,0,0],"ti":[-0.075,-0.047,0]},{"i":{"x":0.667,"y":1},"o":{"x":0.167,"y":0.39},"t":62,"s":[259,224.5,0],"to":[15.667,9.917,0],"ti":[-1.333,-1.25,0]},{"t":242,"s":[276.5,236.25,0]}],"ix":2,"l":2},"a":{"a":0,"k":[230.5,142.75,0],"ix":1,"l":2},"s":{"a":1,"k":[{"i":{"x":[0,0,0.667],"y":[1,1,1]},"o":{"x":[0.135,0.135,0.333],"y":[0,0,0]},"t":2,"s":[20,20,100]},{"t":62,"s":[100,100,100]}],"ix":6,"l":2}},"ao":0,"ef":[{"ty":29,"nm":"Flou gaussien","np":5,"mn":"ADBE Gaussian Blur 2","ix":1,"en":1,"ef":[{"ty":0,"nm":"Flou","mn":"ADBE Gaussian Blur 2-0001","ix":1,"v":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":2,"s":[20]},{"t":62,"s":[0]}],"ix":1}},{"ty":7,"nm":"Dimensions de flou","mn":"ADBE Gaussian Blur 2-0002","ix":2,"v":{"a":0,"k":1,"ix":2}},{"ty":7,"nm":"Recopier les pixels du contour","mn":"ADBE Gaussian Blur 2-0003","ix":3,"v":{"a":0,"k":0,"ix":3}}]}],"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,0],[0,0]],"o":[[0,0],[0,0]],"v":[[-7,-3.5],[7,3.5]],"c":false},"ix":2},"nm":"Tracé 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"st","c":{"a":0,"k":[0.894117706897,1,0.098039223166,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":3,"ix":5},"lc":2,"lj":1,"ml":4,"bm":0,"nm":"Contour 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"tr","p":{"a":0,"k":[230.5,142.75],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformer "}],"nm":"Groupe 9","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":2,"op":300,"st":-194,"bm":0},{"ddd":0,"ind":10,"ty":4,"nm":"OUTRO_CONFETTI Silhouettes","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.333],"y":[0]},"t":6,"s":[0]},{"t":26,"s":[100]}],"ix":11},"r":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.111],"y":[0]},"t":6,"s":[150]},{"t":186,"s":[0]}],"ix":10},"p":{"a":1,"k":[{"i":{"x":0,"y":0.869},"o":{"x":0.168,"y":0},"t":6,"s":[165,165,0],"to":[0,0,0],"ti":[0.099,0.004,0]},{"i":{"x":0.667,"y":1},"o":{"x":0.167,"y":0.339},"t":66,"s":[40.5,159.5,0],"to":[-20.75,-0.917,0],"ti":[0,0,0]},{"t":246,"s":[16.25,159,0]}],"ix":2,"l":2},"a":{"a":0,"k":[12,77.75,0],"ix":1,"l":2},"s":{"a":1,"k":[{"i":{"x":[0,0,0.667],"y":[1,1,1]},"o":{"x":[0.135,0.135,0.333],"y":[0,0,0]},"t":6,"s":[20,20,100]},{"t":66,"s":[100,100,100]}],"ix":6,"l":2}},"ao":0,"ef":[{"ty":29,"nm":"Flou gaussien","np":5,"mn":"ADBE Gaussian Blur 2","ix":1,"en":1,"ef":[{"ty":0,"nm":"Flou","mn":"ADBE Gaussian Blur 2-0001","ix":1,"v":{"a":1,"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":6,"s":[20]},{"t":66,"s":[0]}],"ix":1}},{"ty":7,"nm":"Dimensions de flou","mn":"ADBE Gaussian Blur 2-0002","ix":2,"v":{"a":0,"k":1,"ix":2}},{"ty":7,"nm":"Recopier les pixels du contour","mn":"ADBE Gaussian Blur 2-0003","ix":3,"v":{"a":0,"k":0,"ix":3}}]}],"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,0],[0,0]],"o":[[0,0],[0,0]],"v":[[10.5,2.5],[-10.5,-2.5]],"c":false},"ix":2},"nm":"Tracé 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"st","c":{"a":0,"k":[0.894117706897,1,0.098039223166,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":3,"ix":5},"lc":2,"lj":1,"ml":4,"bm":0,"nm":"Contour 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"tr","p":{"a":0,"k":[12,77.75],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformer "}],"nm":"Groupe 10","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":6,"op":300,"st":-190,"bm":0}],"markers":[]}
\ No newline at end of file
index 6db62bf9aa9beab7529daa6e44e9e040080253e5..1026d33212774b77012ade98161598db5bacd8f0 100644 (file)
@@ -14,6 +14,8 @@ function QuizScreenOutro(screens) {
 
 QuizScreenOutro.prototype = {
     initEvents: function () {
+        this.animOk = false
+
         $(document).on("click", ".toggle-answers-review", function () {
             $(".score-answers-review_container").toggleClass("active")
         })
@@ -23,6 +25,7 @@ QuizScreenOutro.prototype = {
         //animer le texte d'intro
         gsap.registerPlugin(DrawSVGPlugin);
         let subtitle = new SplitType(".score-text .subtitle", {types: 'words, chars'})
+        const $this = this
 
         gsap.to(".active-screen #progress-circle", {drawSVG: 0, duration: 0})
         gsap.timeline({delay: .4})
@@ -61,7 +64,7 @@ QuizScreenOutro.prototype = {
                 stagger: {
                     amount: 0.1
                 }
-            })
+            }, ">")
             .to("#score .restart-sentence-mobile", {
                 opacity: 1,
                 y: 0
@@ -73,17 +76,26 @@ QuizScreenOutro.prototype = {
     },
 
     show: function () {
+        const $this = this
+
         let maxScore = this.quiz.score.maxScore,
             score = this.quiz.score.score
 
         let status = this.quiz.score.questionStatus
         let reviewList = this.quiz.question.getAll();
 
+        let absPath = window.location.href
+
         const counter = $("#progress-counter")
+
         if (score < (maxScore / 2)) {
             counter.addClass("nok")
         } else if (score >= (maxScore / 2)) {
             counter.addClass("ok")
+
+            setTimeout(function() {
+                return $this.animationOk()
+            }, 2700)
         }
 
         const percent = (score/maxScore) * 100
@@ -123,6 +135,10 @@ QuizScreenOutro.prototype = {
         // mise en place de la scrollbar personnalisé
         // https://github.com/Grsmto/simplebar/tree/master/packages/simplebar
         const simpleBar = new SimpleBar($ul.get(0))
+    },
+
+    animationOk: function() {
+        this.quiz.animations.load("CONFETTI", "#anime-ok", '', false);
     }
 };
 
index 98c2a1fc8d2c670e8d9f84dd1d6083be75a299c7..9a0079ab8ef8598edd30d78f4eee14b814b689dc 100644 (file)
                 left: 1px
                 right: 1px
 
+    #anime-ok
+        transform: scale(1.7)
 
 .m
     .score
             &-mobile
                 +flex-config(center)
 
+        #anime-ok
+            transform: scale(2)
index dd0a2a089cec04a3c27882539cfd86ee63c783ee..0904563678f1f6abde7b0ab29872e6d4b8bb00ab 100644 (file)
@@ -12,7 +12,7 @@
                              id="SCORE" x="0px" y="0px" viewBox="0 0 148 148" style="enable-background:new 0 0 148 148;"
                              xml:space="preserve">
                             <style type="text/css">
-                                .st0 {
+                                .circle {
                                     opacity: 0.16;
                                     fill: none;
                                     stroke: #FFFFFF;
                                     enable-background: new;
                                 }
 
-                                .st1 {
+                                .progress-circle {
                                     fill: none;
                                     stroke-linecap: round;
                                     stroke-miterlimit: 10;
                                 }
                             </style>
-                            <circle id="circle" class="st0" cx="74" cy="74" r="70"/>
-                            <circle id="progress-circle" class="st1" cx="74" cy="74" r="70" stroke="currentColor"/>
+                            <circle id="circle" class="circle" cx="74" cy="74" r="70"/>
+                            <circle id="progress-circle" class="progress-circle" cx="74" cy="74" r="70" stroke="currentColor"/>
                         </svg>
                     </div>
+                    <div id="anime-ok">
+                    </div>
                 </div>
                 <div class="score-text">
                     <h1>{{$__('Congratulation!')}}</h1>