diff --git a/package.json b/package.json index 96e891e9..abfbe9b7 100644 --- a/package.json +++ b/package.json @@ -34,10 +34,12 @@ "axios": "^1.7.2", "dayjs": "^1.11.11", "jotai": "^2.8.4", + "lottie-react": "^2.4.0", "postcss": "^8.4.38", "postcss-scss": "^4.0.9", "react": "^18.3.1", "react-dom": "^18.3.1", + "react-lottie-player": "^2.0.0", "react-router-dom": "^6.24.0", "shelljs": "^0.8.5", "styled-components": "^6.1.11", diff --git a/public/svgs/Icon_checkbox_selected_on.svg b/public/svgs/Icon_checkbox_selected_on.svg new file mode 100644 index 00000000..69f4fe65 --- /dev/null +++ b/public/svgs/Icon_checkbox_selected_on.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/public/svgs/Icon_checkbox_unselected_on.svg b/public/svgs/Icon_checkbox_unselected_on.svg new file mode 100644 index 00000000..0bbb7e17 --- /dev/null +++ b/public/svgs/Icon_checkbox_unselected_on.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/svgs/icon_chevron_back.svg b/public/svgs/icon_chevron_back.svg new file mode 100644 index 00000000..0da9be5d --- /dev/null +++ b/public/svgs/icon_chevron_back.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/svgs/icon_toggle_off.svg b/public/svgs/icon_toggle_off.svg new file mode 100644 index 00000000..4a4197b0 --- /dev/null +++ b/public/svgs/icon_toggle_off.svg @@ -0,0 +1,4 @@ + + + + diff --git a/public/svgs/icon_toggle_on.svg b/public/svgs/icon_toggle_on.svg new file mode 100644 index 00000000..c23c6c7d --- /dev/null +++ b/public/svgs/icon_toggle_on.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/src/assets/lottie/register-complete.json b/src/assets/lottie/register-complete.json new file mode 100644 index 00000000..9f35b3b7 --- /dev/null +++ b/src/assets/lottie/register-complete.json @@ -0,0 +1,2797 @@ +{ + "nm": "공연등록완료", + "ddd": 0, + "h": 150, + "w": 150, + "meta": { "g": "LottieFiles Figma v63" }, + "layers": [ + { + "ty": 0, + "nm": "Group 1171284174", + "sr": 1, + "st": 0, + "op": 211.21, + "ip": 0, + "hd": false, + "ddd": 0, + "bm": 0, + "hasMask": false, + "ao": 0, + "ks": { + "a": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [9.16, 9.16], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [9.16, 9.16], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [9.16, 9.16], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [9.16, 9.16], "t": 90 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [9.16, 9.16], "t": 120 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [9.16, 9.16], "t": 150 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [9.16, 9.16], "t": 180 }, + { "s": [9.16, 9.16], "t": 210 } + ] + }, + "s": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100, 100], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100, 100], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100, 100], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100, 100], "t": 90 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100, 100], "t": 120 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100, 100], "t": 150 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100, 100], "t": 180 }, + { "s": [100, 100], "t": 210 } + ] + }, + "sk": { "a": 0, "k": 0 }, + "p": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [28.16, 81.43], "t": 0 }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [35.78, 81.43], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [49.35, 53.39], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [66.53, 123.84], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [82.81, 28.06], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [96.38, 80.52], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [118.08, 80.52], + "t": 180 + }, + { "s": [118.08, 80.52], "t": 210 } + ] + }, + "r": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 90 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 120 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 150 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 180 }, + { "s": [-180], "t": 210 } + ] + }, + "sa": { "a": 0, "k": 0 }, + "o": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 90 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 120 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 150 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 180 }, + { "s": [100], "t": 210 } + ] + } + }, + "w": 150, + "h": 150, + "refId": "1", + "ind": 1 + }, + { + "ty": 0, + "nm": "Mask group", + "sr": 1, + "st": 0, + "op": 211.21, + "ip": 0, + "hd": false, + "ddd": 0, + "bm": 0, + "hasMask": false, + "ao": 0, + "ks": { + "a": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [52.01, 56.98], "t": 0 }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 180 + }, + { "s": [52.01, 56.98], "t": 210 } + ] + }, + "s": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100, 100], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100, 100], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100, 100], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100, 100], "t": 90 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100, 100], "t": 120 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100, 100], "t": 150 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100, 100], "t": 180 }, + { "s": [100, 100], "t": 210 } + ] + }, + "sk": { "a": 0, "k": 0 }, + "p": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [75.01, 74.98], "t": 0 }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [75.01, 74.98], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [75.01, 74.98], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [75.01, 74.98], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [75.01, 74.98], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [75.01, 74.98], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [75.01, 74.98], + "t": 180 + }, + { "s": [75.01, 74.98], "t": 210 } + ] + }, + "r": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 90 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 120 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 150 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 180 }, + { "s": [0], "t": 210 } + ] + }, + "sa": { "a": 0, "k": 0 }, + "o": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 90 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 120 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 150 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 180 }, + { "s": [100], "t": 210 } + ] + } + }, + "w": 150, + "h": 150, + "refId": "2", + "ind": 2 + } + ], + "v": "5.7.0", + "fr": 60, + "op": 210.21, + "ip": 0, + "assets": [ + { + "nm": "[Asset] Group 1171284174", + "id": "1", + "layers": [ + { + "ty": 4, + "nm": "Star 2", + "sr": 1, + "st": 0, + "op": 211.21, + "ip": 0, + "hd": false, + "ddd": 0, + "bm": 0, + "hasMask": false, + "ao": 0, + "ks": { + "a": { + "a": 1, + "k": [ + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [9.16, 9.16], + "t": 0 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [9.16, 9.16], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [9.16, 9.16], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [9.16, 9.16], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [9.16, 9.16], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [9.16, 9.16], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [9.16, 9.16], + "t": 180 + }, + { "s": [9.16, 9.16], "t": 210 } + ] + }, + "s": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100, 100], "t": 0 }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100, 100], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100, 100], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100, 100], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100, 100], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100, 100], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100, 100], + "t": 180 + }, + { "s": [100, 100], "t": 210 } + ] + }, + "sk": { "a": 0, "k": 0 }, + "p": { + "a": 1, + "k": [ + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [9.16, 9.16], + "t": 0 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [9.16, 9.16], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [9.16, 9.16], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [9.16, 9.16], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [9.16, 9.16], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [9.16, 9.16], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [9.16, 9.16], + "t": 180 + }, + { "s": [9.16, 9.16], "t": 210 } + ] + }, + "r": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 90 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 120 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 150 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 180 }, + { "s": [0], "t": 210 } + ] + }, + "sa": { "a": 0, "k": 0 }, + "o": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 90 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 120 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 150 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 180 }, + { "s": [100], "t": 210 } + ] + } + }, + "ef": [ + { + "ty": 25, + "nm": "", + "en": 1, + "ef": [ + { + "ty": 2, + "nm": "color", + "v": { + "a": 1, + "k": [ + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [0, 0, 0, 0], + "t": 0 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [0, 0, 0, 0], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [0, 0, 0, 0], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [0, 0, 0, 0], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [0, 0, 0, 0], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [0, 0, 0, 0], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [0, 0, 0, 0], + "t": 180 + }, + { "s": [0, 0, 0, 0], "t": 210 } + ] + } + }, + { + "ty": 0, + "nm": "opacity", + "v": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 90 }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [0], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [0], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [0], + "t": 180 + }, + { "s": [0], "t": 210 } + ] + } + }, + { + "ty": 1, + "nm": "angle", + "v": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [90], "t": 0 }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [90], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [90], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [90], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [90], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [90], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [90], + "t": 180 + }, + { "s": [270], "t": 210 } + ] + } + }, + { + "ty": 0, + "nm": "distance", + "v": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 90 }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [0], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [0], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [0], + "t": 180 + }, + { "s": [0], "t": 210 } + ] + } + }, + { + "ty": 0, + "nm": "blur", + "v": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 90 }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [0], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [0], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [0], + "t": 180 + }, + { "s": [0], "t": 210 } + ] + } + } + ] + } + ], + "shapes": [ + { + "ty": "sh", + "bm": 0, + "hd": false, + "nm": "", + "d": 1, + "ks": { + "a": 1, + "k": [ + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [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], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [9.16, 0], + [11.63, 6.69], + [18.32, 9.16], + [11.63, 11.63], + [9.16, 18.32], + [6.69, 11.63], + [0, 9.16], + [6.69, 6.69], + [9.16, 0] + ] + } + ], + "t": 0 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [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], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [9.16, 0], + [11.63, 6.69], + [18.32, 9.16], + [11.63, 11.63], + [9.16, 18.32], + [6.69, 11.63], + [0, 9.16], + [6.69, 6.69], + [9.16, 0] + ] + } + ], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [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], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [9.16, 0], + [11.63, 6.69], + [18.32, 9.16], + [11.63, 11.63], + [9.16, 18.32], + [6.69, 11.63], + [0, 9.16], + [6.69, 6.69], + [9.16, 0] + ] + } + ], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [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], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [9.16, 0], + [11.63, 6.69], + [18.32, 9.16], + [11.63, 11.63], + [9.16, 18.32], + [6.69, 11.63], + [0, 9.16], + [6.69, 6.69], + [9.16, 0] + ] + } + ], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [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], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [9.16, 0], + [11.63, 6.69], + [18.32, 9.16], + [11.63, 11.63], + [9.16, 18.32], + [6.69, 11.63], + [0, 9.16], + [6.69, 6.69], + [9.16, 0] + ] + } + ], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [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], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [9.16, 0], + [11.63, 6.69], + [18.32, 9.16], + [11.63, 11.63], + [9.16, 18.32], + [6.69, 11.63], + [0, 9.16], + [6.69, 6.69], + [9.16, 0] + ] + } + ], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [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], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [9.16, 0], + [11.63, 6.69], + [18.32, 9.16], + [11.63, 11.63], + [9.16, 18.32], + [6.69, 11.63], + [0, 9.16], + [6.69, 6.69], + [9.16, 0] + ] + } + ], + "t": 180 + }, + { + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [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], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [9.16, 0], + [11.63, 6.69], + [18.32, 9.16], + [11.63, 11.63], + [9.16, 18.32], + [6.69, 11.63], + [0, 9.16], + [6.69, 6.69], + [9.16, 0] + ] + } + ], + "t": 210 + } + ] + } + }, + { + "ty": "fl", + "bm": 0, + "hd": false, + "nm": "", + "c": { + "a": 1, + "k": [ + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [1, 1, 1], + "t": 0 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [1, 1, 1], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [1, 1, 1], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [1, 1, 1], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [1, 1, 1], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [1, 1, 1], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [1, 1, 1], + "t": 180 + }, + { "s": [1, 1, 1], "t": 210 } + ] + }, + "r": 1, + "o": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 90 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 120 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 150 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 180 }, + { "s": [100], "t": 210 } + ] + } + } + ], + "ind": 1 + } + ] + }, + { + "nm": "[Asset] Mask group", + "id": "2", + "layers": [ + { + "ty": 4, + "nm": "Rectangle 161125852", + "sr": 1, + "st": 0, + "op": 211.21, + "ip": 0, + "hd": false, + "ddd": 0, + "bm": 0, + "hasMask": false, + "td": 1, + "ao": 0, + "ks": { + "a": { + "a": 1, + "k": [ + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 0 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 180 + }, + { "s": [52.01, 56.98], "t": 210 } + ] + }, + "s": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100, 100], "t": 0 }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100, 100], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100, 100], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100, 100], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100, 100], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100, 100], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100, 100], + "t": 180 + }, + { "s": [100, 100], "t": 210 } + ] + }, + "sk": { "a": 0, "k": 0 }, + "p": { + "a": 1, + "k": [ + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 0 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 180 + }, + { "s": [52.01, 56.98], "t": 210 } + ] + }, + "r": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 90 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 120 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 150 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 180 }, + { "s": [0], "t": 210 } + ] + }, + "sa": { "a": 0, "k": 0 }, + "o": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 90 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 120 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 150 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 180 }, + { "s": [100], "t": 210 } + ] + } + }, + "ef": [], + "shapes": [ + { + "ty": "sh", + "bm": 0, + "hd": false, + "nm": "", + "d": 1, + "ks": { + "a": 1, + "k": [ + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "o": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [104.01, 0], + [104.01, 113.96], + [0, 113.96], + [0, 0] + ] + } + ], + "t": 0 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "o": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [104.01, 0], + [104.01, 113.96], + [0, 113.96], + [0, 0] + ] + } + ], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "o": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [104.01, 0], + [104.01, 113.96], + [0, 113.96], + [0, 0] + ] + } + ], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "o": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [104.01, 0], + [104.01, 113.96], + [0, 113.96], + [0, 0] + ] + } + ], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "o": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [104.01, 0], + [104.01, 113.96], + [0, 113.96], + [0, 0] + ] + } + ], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "o": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [104.01, 0], + [104.01, 113.96], + [0, 113.96], + [0, 0] + ] + } + ], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "o": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [104.01, 0], + [104.01, 113.96], + [0, 113.96], + [0, 0] + ] + } + ], + "t": 180 + }, + { + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "o": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [104.01, 0], + [104.01, 113.96], + [0, 113.96], + [0, 0] + ] + } + ], + "t": 210 + } + ] + } + }, + { + "ty": "gf", + "bm": 0, + "hd": false, + "nm": "", + "e": { + "a": 1, + "k": [ + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100.21, 45.7], + "t": 0 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100.21, 45.7], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100.21, 45.7], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100.21, 45.7], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100.21, 45.7], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100.21, 45.7], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100.21, 45.7], + "t": 180 + }, + { "s": [100.21, 45.7], "t": 210 } + ] + }, + "g": { + "p": 2, + "k": { + "a": 1, + "k": [ + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + 0, 1, 0.000039215686274509805, 0.42003926217789744, 1, 1, + 0.000039215686274509805, 0.4196470636152754, 0, 0, 1, 0 + ], + "t": 0 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + 0, 1, 0.000039215686274509805, 0.42003926217789744, 0.1918984204530716, 1, + 0.000039215686274509805, 0.4196470636152754, 0, 1, 0.1918984204530716, 0 + ], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + 0, 1, 0.000039215686274509805, 0.42003926217789744, 0.44627121090888977, 1, + 0.000039215686274509805, 0.4196470636152754, 0, 1, 0.44627121090888977, 0 + ], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + 0.37187695503234863, 1, 0.000039215686274509805, 0.42003926217789744, + 0.5091227889060974, 1, 0.000039215686274509805, 0.4196470636152754, + 0.37187695503234863, 1, 0.5091227889060974, 0 + ], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + 0.5582160949707031, 1, 0.000039215686274509805, 0.42003926217789744, + 0.7349632382392883, 1, 0.000039215686274509805, 0.4196470636152754, + 0.5582160949707031, 1, 0.7349632382392883, 0 + ], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + 0.6591219305992126, 1, 0.000039215686274509805, 0.42003926217789744, + 0.8563142418861389, 1, 0.000039215686274509805, 0.4196470636152754, + 0.6591219305992126, 1, 0.8563142418861389, 0 + ], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + 0.8785266876220703, 1, 0.000039215686274509805, 0.42003926217789744, 1, 1, + 0.000039215686274509805, 0.4196470636152754, 0.8785266876220703, 1, 1, 0 + ], + "t": 180 + }, + { + "s": [ + 0.8785266876220703, 1, 0.000039215686274509805, 0.42003926217789744, 1, 1, + 0.000039215686274509805, 0.4196470636152754, 0.8785266876220703, 1, 1, 0 + ], + "t": 210 + } + ] + } + }, + "t": 1, + "a": { "a": 0, "k": 0 }, + "h": { "a": 0, "k": 0 }, + "s": { + "a": 1, + "k": [ + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [-1.09, 45.7], + "t": 0 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [-1.09, 45.7], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [-1.09, 45.7], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [-1.09, 45.7], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [-1.09, 45.7], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [-1.09, 45.7], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [-1.09, 45.7], + "t": 180 + }, + { "s": [-1.09, 45.7], "t": 210 } + ] + }, + "r": 1, + "o": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 90 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 120 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 150 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 180 }, + { "s": [100], "t": 210 } + ] + } + } + ], + "ind": 1 + }, + { + "ty": 4, + "nm": "Vector", + "sr": 1, + "st": 0, + "op": 211.21, + "ip": 0, + "hd": false, + "ddd": 0, + "bm": 0, + "tt": 1, + "hasMask": false, + "ao": 0, + "ks": { + "a": { + "a": 1, + "k": [ + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [51.1, 55.17], + "t": 0 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [51.1, 55.17], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [51.1, 55.17], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [51.1, 55.17], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [51.1, 55.17], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [51.1, 55.17], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [51.1, 55.17], + "t": 180 + }, + { "s": [51.1, 55.17], "t": 210 } + ] + }, + "s": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100, 100], "t": 0 }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100, 100], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100, 100], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100, 100], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100, 100], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100, 100], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [100, 100], + "t": 180 + }, + { "s": [100, 100], "t": 210 } + ] + }, + "sk": { "a": 0, "k": 0 }, + "p": { + "a": 1, + "k": [ + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 0 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52, 56.98], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [52.01, 56.98], + "t": 180 + }, + { "s": [52.01, 56.98], "t": 210 } + ] + }, + "r": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 90 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 120 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 150 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 180 }, + { "s": [0], "t": 210 } + ] + }, + "sa": { "a": 0, "k": 0 }, + "o": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [80], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [80], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [80], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [80], "t": 90 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [80], "t": 120 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [80], "t": 150 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [80], "t": 180 }, + { "s": [80], "t": 210 } + ] + } + }, + "ef": [ + { + "ty": 29, + "nm": "", + "en": 1, + "ef": [ + { + "ty": 0, + "nm": "sigma", + "v": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [0], "t": 90 }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [0], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [0], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [0], + "t": 180 + }, + { "s": [0], "t": 210 } + ] + } + }, + { "ty": 0, "nm": "", "v": { "a": 0, "k": 1 } }, + { "ty": 0, "nm": "", "v": { "a": 0, "k": 0 } } + ] + } + ], + "shapes": [ + { + "ty": "sh", + "bm": 0, + "hd": false, + "nm": "", + "d": 1, + "ks": { + "a": 1, + "k": [ + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [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], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [76.96, 56.35], + [65.12, 19.04], + [59.31, 0], + [53.64, 19.31], + [41.03, 69.37], + [31.25, 43.49], + [25.33, 24.6], + [17.66, 43.23], + [11.42, 56.35], + [0, 56.35], + [0, 66.88], + [20.23, 66.88], + [25.19, 57.51], + [36.28, 91.39], + [43.04, 110.34], + [47.72, 91], + [60.08, 41.95], + [67.99, 66.88], + [102.2, 66.88], + [102.2, 56.35], + [76.96, 56.35] + ] + } + ], + "t": 0 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [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], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [76.96, 56.35], + [65.12, 19.04], + [59.31, 0], + [53.64, 19.31], + [41.03, 69.37], + [31.25, 43.49], + [25.33, 24.6], + [17.66, 43.23], + [11.42, 56.35], + [0, 56.35], + [0, 66.88], + [20.23, 66.88], + [25.19, 57.51], + [36.28, 91.39], + [43.04, 110.34], + [47.72, 91], + [60.08, 41.95], + [67.99, 66.88], + [102.2, 66.88], + [102.2, 56.35], + [76.96, 56.35] + ] + } + ], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [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], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [76.96, 56.35], + [65.12, 19.04], + [59.31, 0], + [53.64, 19.31], + [41.03, 69.37], + [31.25, 43.49], + [25.33, 24.6], + [17.66, 43.23], + [11.42, 56.35], + [0, 56.35], + [0, 66.88], + [20.23, 66.88], + [25.19, 57.51], + [36.28, 91.39], + [43.04, 110.34], + [47.72, 91], + [60.08, 41.95], + [67.99, 66.88], + [102.2, 66.88], + [102.2, 56.35], + [76.96, 56.35] + ] + } + ], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [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], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [76.96, 56.35], + [65.12, 19.04], + [59.31, 0], + [53.64, 19.31], + [41.03, 69.37], + [31.25, 43.49], + [25.33, 24.6], + [17.66, 43.23], + [11.42, 56.35], + [0, 56.35], + [0, 66.88], + [20.23, 66.88], + [25.19, 57.51], + [36.28, 91.39], + [43.04, 110.34], + [47.72, 91], + [60.08, 41.95], + [67.99, 66.88], + [102.2, 66.88], + [102.2, 56.35], + [76.96, 56.35] + ] + } + ], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [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], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [76.96, 56.35], + [65.12, 19.04], + [59.31, 0], + [53.64, 19.31], + [41.03, 69.37], + [31.25, 43.49], + [25.33, 24.6], + [17.66, 43.23], + [11.42, 56.35], + [0, 56.35], + [0, 66.88], + [20.23, 66.88], + [25.19, 57.51], + [36.28, 91.39], + [43.04, 110.34], + [47.72, 91], + [60.08, 41.95], + [67.99, 66.88], + [102.2, 66.88], + [102.2, 56.35], + [76.96, 56.35] + ] + } + ], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [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], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [76.96, 56.35], + [65.12, 19.04], + [59.31, 0], + [53.64, 19.31], + [41.03, 69.37], + [31.25, 43.49], + [25.33, 24.6], + [17.66, 43.23], + [11.42, 56.35], + [0, 56.35], + [0, 66.88], + [20.23, 66.88], + [25.19, 57.51], + [36.28, 91.39], + [43.04, 110.34], + [47.72, 91], + [60.08, 41.95], + [67.99, 66.88], + [102.2, 66.88], + [102.2, 56.35], + [76.96, 56.35] + ] + } + ], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [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], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [76.96, 56.35], + [65.12, 19.04], + [59.31, 0], + [53.64, 19.31], + [41.03, 69.37], + [31.25, 43.49], + [25.33, 24.6], + [17.66, 43.23], + [11.42, 56.35], + [0, 56.35], + [0, 66.88], + [20.23, 66.88], + [25.19, 57.51], + [36.28, 91.39], + [43.04, 110.34], + [47.72, 91], + [60.08, 41.95], + [67.99, 66.88], + [102.2, 66.88], + [102.2, 56.35], + [76.96, 56.35] + ] + } + ], + "t": 180 + }, + { + "s": [ + { + "c": true, + "i": [ + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [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], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0], + [0, 0] + ], + "v": [ + [76.96, 56.35], + [65.12, 19.04], + [59.31, 0], + [53.64, 19.31], + [41.03, 69.37], + [31.25, 43.49], + [25.33, 24.6], + [17.66, 43.23], + [11.42, 56.35], + [0, 56.35], + [0, 66.88], + [20.23, 66.88], + [25.19, 57.51], + [36.28, 91.39], + [43.04, 110.34], + [47.72, 91], + [60.08, 41.95], + [67.99, 66.88], + [102.2, 66.88], + [102.2, 56.35], + [76.96, 56.35] + ] + } + ], + "t": 210 + } + ] + } + }, + { + "ty": "gf", + "bm": 0, + "hd": false, + "nm": "", + "e": { + "a": 1, + "k": [ + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [45.05799865722656, 129.24200439453125], + "t": 0 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [45.05799865722656, 129.24200439453125], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [45.05799865722656, 129.24200439453125], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [45.05799865722656, 129.24200439453125], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [45.05799865722656, 129.24200439453125], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [45.05799865722656, 129.24200439453125], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [45.05799865722656, 129.24200439453125], + "t": 180 + }, + { "s": [45.05799865722656, 129.24200439453125], "t": 210 } + ] + }, + "g": { + "p": 3, + "k": { + "a": 1, + "k": [ + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + 0, 1, 1, 1, 0.46324506402015686, 1, 0.000039215686274509805, + 0.42003926217789744, 0.8999999761581421, 1, 0.000039215686274509805, + 0.4196470636152754, 0, 1, 0.46324506402015686, 1, 0.8999999761581421, 0 + ], + "t": 0 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + 0, 1, 1, 1, 0.46324506402015686, 1, 0.000039215686274509805, + 0.42003926217789744, 0.8999999761581421, 1, 0.000039215686274509805, + 0.4196470636152754, 0, 1, 0.46324506402015686, 1, 0.8999999761581421, 0 + ], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + 0, 1, 1, 1, 0.46324506402015686, 1, 0.000039215686274509805, + 0.42003926217789744, 0.8999999761581421, 1, 0.000039215686274509805, + 0.4196470636152754, 0, 1, 0.46324506402015686, 1, 0.8999999761581421, 0 + ], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + 0, 1, 1, 1, 0.46324506402015686, 1, 0.000039215686274509805, + 0.42003926217789744, 0.8999999761581421, 1, 0.000039215686274509805, + 0.4196470636152754, 0, 1, 0.46324506402015686, 1, 0.8999999761581421, 0 + ], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + 0, 1, 1, 1, 0.46324506402015686, 1, 0.000039215686274509805, + 0.42003926217789744, 0.8999999761581421, 1, 0.000039215686274509805, + 0.4196470636152754, 0, 1, 0.46324506402015686, 1, 0.8999999761581421, 0 + ], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + 0, 1, 1, 1, 0.46324506402015686, 1, 0.000039215686274509805, + 0.42003926217789744, 0.8999999761581421, 1, 0.000039215686274509805, + 0.4196470636152754, 0, 1, 0.46324506402015686, 1, 0.8999999761581421, 0 + ], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [ + 0, 1, 1, 1, 0.46324506402015686, 1, 0.000039215686274509805, + 0.42003926217789744, 0.8999999761581421, 1, 0.000039215686274509805, + 0.4196470636152754, 0, 1, 0.46324506402015686, 1, 0.8999999761581421, 0 + ], + "t": 180 + }, + { + "s": [ + 0, 1, 1, 1, 0.46324506402015686, 1, 0.000039215686274509805, + 0.42003926217789744, 0.8999999761581421, 1, 0.000039215686274509805, + 0.4196470636152754, 0, 1, 0.46324506402015686, 1, 0.8999999761581421, 0 + ], + "t": 210 + } + ] + } + }, + "t": 1, + "a": { "a": 0, "k": 0 }, + "h": { "a": 0, "k": 0 }, + "s": { + "a": 1, + "k": [ + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [47.82149887084961, 1.2258900028427888e-7], + "t": 0 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [47.82149887084961, 1.2258900028427888e-7], + "t": 30 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [47.82149887084961, 1.2258900028427888e-7], + "t": 60 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [47.82149887084961, 1.2258900028427888e-7], + "t": 90 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [47.82149887084961, 1.2258900028427888e-7], + "t": 120 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [47.82149887084961, 1.2258900028427888e-7], + "t": 150 + }, + { + "o": { "x": 0.33, "y": 1 }, + "i": { "x": 0.68, "y": 1 }, + "s": [47.82149887084961, 1.2258900028427888e-7], + "t": 180 + }, + { "s": [47.82149887084961, 1.2258900028427888e-7], "t": 210 } + ] + }, + "r": 1, + "o": { + "a": 1, + "k": [ + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 0 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 30 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 60 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 90 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 120 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 150 }, + { "o": { "x": 0.33, "y": 1 }, "i": { "x": 0.68, "y": 1 }, "s": [100], "t": 180 }, + { "s": [100], "t": 210 } + ] + } + } + ], + "ind": 2 + } + ] + } + ] +} diff --git a/src/assets/svgs/IconCheckboxSelectedOn.tsx b/src/assets/svgs/IconCheckboxSelectedOn.tsx new file mode 100644 index 00000000..f026c681 --- /dev/null +++ b/src/assets/svgs/IconCheckboxSelectedOn.tsx @@ -0,0 +1,17 @@ +import * as React from "react"; +import type { SVGProps } from "react"; +const SvgIconCheckboxSelectedOn = (props: SVGProps) => ( + + + + + +); +export default SvgIconCheckboxSelectedOn; diff --git a/src/assets/svgs/IconCheckboxUnselectedOn.tsx b/src/assets/svgs/IconCheckboxUnselectedOn.tsx new file mode 100644 index 00000000..746b0984 --- /dev/null +++ b/src/assets/svgs/IconCheckboxUnselectedOn.tsx @@ -0,0 +1,8 @@ +import * as React from "react"; +import type { SVGProps } from "react"; +const SvgIconCheckboxUnselectedOn = (props: SVGProps) => ( + + + +); +export default SvgIconCheckboxUnselectedOn; diff --git a/src/assets/svgs/IconChevronBack.tsx b/src/assets/svgs/IconChevronBack.tsx new file mode 100644 index 00000000..adc09dff --- /dev/null +++ b/src/assets/svgs/IconChevronBack.tsx @@ -0,0 +1,13 @@ +import * as React from "react"; +import type { SVGProps } from "react"; +const SvgIconChevronBack = (props: SVGProps) => ( + + + +); +export default SvgIconChevronBack; diff --git a/src/assets/svgs/IconToggleOff.tsx b/src/assets/svgs/IconToggleOff.tsx new file mode 100644 index 00000000..d584f216 --- /dev/null +++ b/src/assets/svgs/IconToggleOff.tsx @@ -0,0 +1,9 @@ +import * as React from "react"; +import type { SVGProps } from "react"; +const SvgIconToggleOff = (props: SVGProps) => ( + + + + +); +export default SvgIconToggleOff; diff --git a/src/assets/svgs/IconToggleOn.tsx b/src/assets/svgs/IconToggleOn.tsx new file mode 100644 index 00000000..1f6d2ca4 --- /dev/null +++ b/src/assets/svgs/IconToggleOn.tsx @@ -0,0 +1,9 @@ +import * as React from "react"; +import type { SVGProps } from "react"; +const SvgIconToggleOn = (props: SVGProps) => ( + + + + +); +export default SvgIconToggleOn; diff --git a/src/assets/svgs/index.tsx b/src/assets/svgs/index.tsx index ff587477..3e65db88 100644 --- a/src/assets/svgs/index.tsx +++ b/src/assets/svgs/index.tsx @@ -9,6 +9,9 @@ export { default as IconArrowUp } from "./IconArrowUp"; export { default as IconBnk } from "./IconBnk"; export { default as IconCalendar } from "./IconCalendar"; export { default as IconCheck } from "./IconCheck"; +export { default as IconCheckboxSelectedOn } from "./IconCheckboxSelectedOn"; +export { default as IconCheckboxUnselectedOn } from "./IconCheckboxUnselectedOn"; +export { default as IconChevronBack } from "./IconChevronBack"; export { default as IconEyeOff } from "./IconEyeOff"; export { default as IconEyeOn } from "./IconEyeOn"; export { default as IconFooterLogo } from "./IconFooterLogo"; @@ -32,6 +35,8 @@ export { default as IconSmallMusical } from "./IconSmallMusical"; export { default as IconSoohyup } from "./IconSoohyup"; export { default as IconTextfiedlDelete } from "./IconTextfiedlDelete"; export { default as IconTime } from "./IconTime"; +export { default as IconToggleOff } from "./IconToggleOff"; +export { default as IconToggleOn } from "./IconToggleOn"; export { default as IconToss } from "./IconToss"; export { default as IconWoochaegook } from "./IconWoochaegook"; export { default as IconWoori } from "./IconWoori"; diff --git a/src/components/commons/bottomSheet/BottomSheet.styled.ts b/src/components/commons/bottomSheet/BottomSheet.styled.ts index cc1e8e5c..27f8925f 100644 --- a/src/components/commons/bottomSheet/BottomSheet.styled.ts +++ b/src/components/commons/bottomSheet/BottomSheet.styled.ts @@ -1,10 +1,25 @@ -import styled from "styled-components"; +import styled, { keyframes } from "styled-components"; -export const BottomSheetWrapper = styled.section` - position: fixed; +const bottomSheetUp = keyframes` + 0% { transform: translateY(100%); } + 100% { transform: translateY(0); } +`; + +const bottomSheetDown = keyframes` + 0% { transform: translateY(0); } + 100% { transform: translateY(100%); } +`; + +export const BottomSheetWrapper = styled.section<{ $isOpen: boolean }>` + position: absolute; bottom: 0; - z-index: 1; + left: 0; + z-index: 10; display: flex; + justify-content: center; + width: 100%; + + animation: ${({ $isOpen }) => ($isOpen ? bottomSheetUp : bottomSheetDown)} 250ms ease-in-out; `; export const BottomSheetLayout = styled.section` diff --git a/src/components/commons/bottomSheet/BottomSheet.tsx b/src/components/commons/bottomSheet/BottomSheet.tsx index a7c35d1a..e60969f9 100644 --- a/src/components/commons/bottomSheet/BottomSheet.tsx +++ b/src/components/commons/bottomSheet/BottomSheet.tsx @@ -2,13 +2,14 @@ import { ReactNode } from "react"; import * as S from "./BottomSheet.styled"; export interface BottomSheetPropType { + isOpen: boolean; children?: ReactNode; title?: string; } -const BottomSheet = ({ title, children }: BottomSheetPropType) => { +const BottomSheet = ({ isOpen, title, children }: BottomSheetPropType) => { return ( - e.stopPropagation()}> + {title} {children} diff --git a/src/components/commons/bottomSheet/actionsBottomSheet/ActionBottomSheet.styled.ts b/src/components/commons/bottomSheet/actionsBottomSheet/ActionBottomSheet.styled.ts index 13efa8ef..e9f1e8ee 100644 --- a/src/components/commons/bottomSheet/actionsBottomSheet/ActionBottomSheet.styled.ts +++ b/src/components/commons/bottomSheet/actionsBottomSheet/ActionBottomSheet.styled.ts @@ -2,14 +2,22 @@ import styled from "styled-components"; import { IcomCopy } from "@assets/svgs"; -export const ActionBottomSheetWrapper = styled.section` +export const ActionBottomSheetWrapper = styled.section<{ $isOpen: boolean }>` position: fixed; - top: 0; bottom: 0; - left: auto; + z-index: 30; display: flex; + justify-content: center; width: 100%; height: 100%; + + background-color: rgb(0 0 0 / 50%); + visibility: ${({ $isOpen }) => ($isOpen ? "visible" : "hidden")}; + opacity: ${({ $isOpen }) => ($isOpen ? 1 : 0)}; + + transition: + opacity 250ms ease-in-out, + visibility 250ms ease-in-out; `; export const SubTitle = styled.h2` diff --git a/src/components/commons/bottomSheet/actionsBottomSheet/ActionBottomSheet.tsx b/src/components/commons/bottomSheet/actionsBottomSheet/ActionBottomSheet.tsx index a5710161..6ca94911 100644 --- a/src/components/commons/bottomSheet/actionsBottomSheet/ActionBottomSheet.tsx +++ b/src/components/commons/bottomSheet/actionsBottomSheet/ActionBottomSheet.tsx @@ -5,11 +5,12 @@ import OuterLayout from "@components/commons/bottomSheet/OuterLayout"; import ContextBox from "@components/commons/contextBox/ContextBox"; import { ContextBoxStyle } from "@typings/contextBoxProps"; -import React, { ReactNode, Children, isValidElement } from "react"; +import React, { Children, isValidElement, ReactNode, useEffect } from "react"; interface ActionBottomSheetProps extends React.ButtonHTMLAttributes, ContextBoxStyle { + isOpen: boolean; title?: string; subTitle?: string; children?: ReactNode; @@ -17,6 +18,7 @@ interface ActionBottomSheetProps } const ActionBottomSheet = ({ + isOpen, title, subTitle, onClickOutside, @@ -37,9 +39,20 @@ const ActionBottomSheet = ({ onClickOutside(); }; + useEffect(() => { + if (isOpen) { + document.body.style.overflow = "hidden"; + } else { + document.body.style.overflow = "auto"; + } + return () => { + document.body.style.overflow = "auto"; + }; + }, [isOpen]); + return ( - - + + {subTitle} {innerChildren} diff --git a/src/components/commons/bottomSheet/viewBottomSheet/ViewBottomSheet.styled.ts b/src/components/commons/bottomSheet/viewBottomSheet/ViewBottomSheet.styled.ts index 76f94b06..eab61d16 100644 --- a/src/components/commons/bottomSheet/viewBottomSheet/ViewBottomSheet.styled.ts +++ b/src/components/commons/bottomSheet/viewBottomSheet/ViewBottomSheet.styled.ts @@ -1,15 +1,23 @@ import styled from "styled-components"; -import { BoxTitleStyle, BoxDividerStyle } from "@typings/contextBoxProps"; +import { BoxDividerStyle, BoxTitleStyle } from "@typings/contextBoxProps"; -export const ViewBottomSheetWrapper = styled.section` +export const ViewBottomSheetWrapper = styled.section<{ $isOpen: boolean }>` position: fixed; - top: 0; bottom: 0; - left: auto; + z-index: 30; display: flex; + justify-content: center; width: 100%; height: 100%; + + background-color: rgb(0 0 0 / 50%); + visibility: ${({ $isOpen }) => ($isOpen ? "visible" : "hidden")}; + opacity: ${({ $isOpen }) => ($isOpen ? 1 : 0)}; + + transition: + opacity 250ms ease-in-out, + visibility 250ms ease-in-out; `; export const BoxTitle = styled.h1` diff --git a/src/components/commons/bottomSheet/viewBottomSheet/ViewBottomSheet.tsx b/src/components/commons/bottomSheet/viewBottomSheet/ViewBottomSheet.tsx index 3fbc253c..8d08b216 100644 --- a/src/components/commons/bottomSheet/viewBottomSheet/ViewBottomSheet.tsx +++ b/src/components/commons/bottomSheet/viewBottomSheet/ViewBottomSheet.tsx @@ -1,11 +1,12 @@ -import * as S from "./ViewBottomSheet.styled"; import BottomSheet from "@components/commons/bottomSheet/BottomSheet"; import OuterLayout from "@components/commons/bottomSheet/OuterLayout"; import ContextBox from "@components/commons/contextBox/ContextBox"; +import * as S from "./ViewBottomSheet.styled"; -import { ReactNode, Children, isValidElement } from "react"; +import { Children, isValidElement, ReactNode, useEffect } from "react"; interface ViewBottomSheetProps { + isOpen: boolean; title?: string; boxTitle?: string; boxTitleColor?: string; @@ -14,6 +15,7 @@ interface ViewBottomSheetProps { } const ViewBottomSheet = ({ + isOpen, title, boxTitle, boxTitleColor, @@ -35,9 +37,20 @@ const ViewBottomSheet = ({ onClickOutside(); }; + useEffect(() => { + if (isOpen) { + document.body.style.overflow = "hidden"; + } else { + document.body.style.overflow = "auto"; + } + return () => { + document.body.style.overflow = "auto"; + }; + }, [isOpen]); + return ( - - + + {boxTitle} diff --git a/src/components/commons/input/textField/TextField.tsx b/src/components/commons/input/textField/TextField.tsx index a56446ab..5f9336e0 100644 --- a/src/components/commons/input/textField/TextField.tsx +++ b/src/components/commons/input/textField/TextField.tsx @@ -71,6 +71,7 @@ const TextField = ({ }, } as ChangeEvent; + inputRef.current.focus(); onChange(newEvent); } }; @@ -85,8 +86,8 @@ const TextField = ({ { const [isOpen, setIsOpen] = useState(false); @@ -19,22 +19,22 @@ const ActionBottomSheetTest = () => { return ( - {isOpen && ( - - - - - - - )} + + + + + + + ); }; @@ -42,8 +42,10 @@ const ActionBottomSheetTest = () => { export default ActionBottomSheetTest; const Test = styled.div` - width: 37.5rem; - height: 66.7rem; + display: flex; + flex-direction: column; + align-items: center; + padding: 0 2.4rem; background-color: white; `; diff --git a/src/pages/MyRegisterdShow/MyRegisterdShow.tsx b/src/pages/MyRegisterdShow/MyRegisterdShow.tsx index 14da99c4..99dc86a7 100644 --- a/src/pages/MyRegisterdShow/MyRegisterdShow.tsx +++ b/src/pages/MyRegisterdShow/MyRegisterdShow.tsx @@ -5,7 +5,7 @@ import { useEffect, useState } from "react"; import { useNavigate } from "react-router-dom"; import bannerNarrow from "../../assets/images/banner_narrow.png"; import * as S from "./MyRegisterdShow.styled"; -import RegisteredCard from "./components/RegisteredCard"; +import RegisteredCard from "./components/registeredcard/RegisteredCard"; import { MY_REGISTERED_SHOW, RegisteredObjProps } from "./constants/myRegisterShow"; const MyRegisterdShow = () => { diff --git a/src/pages/MyRegisterdShow/components/RegisteredCard.styled.ts b/src/pages/MyRegisterdShow/components/registeredcard/RegisteredCard.styled.ts similarity index 100% rename from src/pages/MyRegisterdShow/components/RegisteredCard.styled.ts rename to src/pages/MyRegisterdShow/components/registeredcard/RegisteredCard.styled.ts diff --git a/src/pages/MyRegisterdShow/components/RegisteredCard.tsx b/src/pages/MyRegisterdShow/components/registeredcard/RegisteredCard.tsx similarity index 93% rename from src/pages/MyRegisterdShow/components/RegisteredCard.tsx rename to src/pages/MyRegisterdShow/components/registeredcard/RegisteredCard.tsx index ac4655bc..a685957d 100644 --- a/src/pages/MyRegisterdShow/components/RegisteredCard.tsx +++ b/src/pages/MyRegisterdShow/components/registeredcard/RegisteredCard.tsx @@ -1,5 +1,5 @@ import Button from "@components/commons/button/Button"; -import { RegisteredObjProps } from "../constants/myRegisterShow"; +import { RegisteredObjProps } from "../../constants/myRegisterShow"; import * as S from "./RegisteredCard.styled"; const RegisteredCard = ({ title, period, genre, image }: Omit) => { diff --git a/src/pages/MyRegisterdShow/hooks/.gitkeep b/src/pages/MyRegisterdShow/hooks/.gitkeep deleted file mode 100644 index e69de29b..00000000 diff --git a/src/pages/MyRegisterdShow/types/.gitkeep b/src/pages/MyRegisterdShow/types/.gitkeep deleted file mode 100644 index e69de29b..00000000 diff --git a/src/pages/MyRegisterdShow/utils/.gitkeep b/src/pages/MyRegisterdShow/utils/.gitkeep deleted file mode 100644 index e69de29b..00000000 diff --git a/src/pages/ViewBottomSheetTest.tsx b/src/pages/ViewBottomSheetTest.tsx index 97f91d7c..8010ecb4 100644 --- a/src/pages/ViewBottomSheetTest.tsx +++ b/src/pages/ViewBottomSheetTest.tsx @@ -1,9 +1,9 @@ -import styled from "styled-components"; +import OuterLayout from "@components/commons/bottomSheet/OuterLayout"; import ViewBottomSheet from "@components/commons/bottomSheet/viewBottomSheet/ViewBottomSheet"; -import Context from "@components/commons/contextBox/Context"; import Button from "@components/commons/button/Button"; -import OuterLayout from "@components/commons/bottomSheet/OuterLayout"; +import Context from "@components/commons/contextBox/Context"; import { useState } from "react"; +import styled from "styled-components"; const ViewBottomSheetTest = () => { const [isOpen, setIsOpen] = useState(false); @@ -19,26 +19,26 @@ const ViewBottomSheetTest = () => { return ( - {isOpen && ( - - - - - - - - - - )} + + + + + + + + + + ); }; @@ -46,8 +46,10 @@ const ViewBottomSheetTest = () => { export default ViewBottomSheetTest; const Test = styled.div` - width: 37.5rem; - height: 660.7rem; + display: flex; + flex-direction: column; + align-items: center; + padding: 0 2.4rem; background-color: white; `; diff --git a/src/pages/book/Book.styled.ts b/src/pages/book/Book.styled.ts new file mode 100644 index 00000000..6e89ba13 --- /dev/null +++ b/src/pages/book/Book.styled.ts @@ -0,0 +1,26 @@ +import styled from "styled-components"; + +export const ContentWrapper = styled.div` + display: flex; + flex-direction: column; + align-items: center; + padding: 0 2.4rem; +`; + +export const Divider = styled.div` + width: 375px; + height: 8px; + margin-top: 1.6rem; + + background: ${({ theme }) => theme.colors.gray_800}; + opacity: 0.6; + border: 1px s; +`; + +export const FooterContainer = styled.div` + position: sticky; + bottom: 0; + padding: 2.4rem; + + background-color: ${({ theme }) => theme.colors.gray_900}; +`; diff --git a/src/pages/book/Book.tsx b/src/pages/book/Book.tsx new file mode 100644 index 00000000..970e0d2c --- /dev/null +++ b/src/pages/book/Book.tsx @@ -0,0 +1,219 @@ +import OuterLayout from "@components/commons/bottomSheet/OuterLayout"; +import ViewBottomSheet from "@components/commons/bottomSheet/viewBottomSheet/ViewBottomSheet"; +import Button from "@components/commons/button/Button"; +import Context from "@components/commons/contextBox/Context"; +import React, { useEffect, useState } from "react"; +import { useParams } from "react-router-dom"; + +import * as S from "./Book.styled"; +import BookerInfo from "./components/bookerInfo/BookerInfo"; +import Count from "./components/count/Count"; +import EasyPassEntry from "./components/easyPassEntry/EasyPassEntry"; +import Info from "./components/info/Info"; +import Select from "./components/select/Select"; +import TermCheck from "./components/termCheck/TermCheck"; +import { BOOK_DETAIL_INFO } from "./constants/dummy"; +import { FormData } from "./typings/formData"; + +const Book = () => { + const { performanceId } = useParams<{ performanceId: string }>(); + + // TODO: 회원/비회원 여부 + // navigate 할 때 state로 넘기기 ? + const isNonMember = true; + + const [detail, setDetail] = useState(BOOK_DETAIL_INFO); + const [selectedValue, setSelectedValue] = useState(); + const [round, setRound] = useState(1); + const [bookerInfo, setBookerInfo] = useState({ + bookerName: "", + bookerPhoneNumber: "", + birthDate: "", + }); + const [easyPassword, setEasyPassword] = useState({ + password: "", + passwordCheck: "", + }); + const [isTermChecked, setIsTermChecked] = useState({ + term1: false, + term2: false, + }); + const [isOpen, setIsOpen] = useState(false); + const [activeButton, setActiveButton] = useState(false); + + const handleRadioChange = (value: number) => { + setSelectedValue(value); + }; + + const onChangeBookerInfo = (e: React.ChangeEvent) => { + const { name, value } = e.target; + + setBookerInfo((prev) => ({ ...prev, [name]: value })); + }; + + const onChangeEasyPassword = (e: React.ChangeEvent) => { + const { name, value } = e.target; + + setEasyPassword((prev) => ({ ...prev, [name]: value })); + }; + + const onMinusClick = () => { + setRound((prev) => prev - 1); + }; + + const onPlusClick = () => { + setRound((prev) => prev + 1); + }; + + const onChangeTermCheck = (e: React.ChangeEvent) => { + const { name, checked } = e.target; + + setIsTermChecked((prev) => ({ ...prev, [name]: checked })); + }; + + const handleSheetOpen = () => { + setIsOpen(true); + }; + + const handleSheetClose = () => { + setIsOpen(false); + }; + + const handleClickBook = () => { + // TODO: 티켓 매수 요청 GET API 후, true 인 상태일 때 바텀 시트 열기 + + handleSheetOpen(); + }; + + const handleClickBookRequst = () => { + // TODO: 티켓 매수 요청 get 요청 후, true 인 상태이면, 바텀 시트 열기 + + let formData = { + scheduleId: performanceId, + selectedValue, + purchaseTicketCount: round, + totalPaymentAmount: detail.ticketPrice * round, + } as FormData; + + // TODO: 회원, 비회원 여부에 따라서 예매하기 post 요청 + if (isNonMember) { + // 비회원 예매하기 post 요청 + formData = { ...formData, ...bookerInfo, password: easyPassword.password } as FormData; + + console.log(formData); + } else { + // 회원 예매하기 post 요청 + formData = { + ...formData, + bookerName: bookerInfo.bookerName, + bookerPhoneNumber: bookerInfo.bookerPhoneNumber, + } as FormData; + + console.log(formData); + } + + // TODO: 완료 페이지로 navigate + }; + + useEffect(() => { + if ( + selectedValue && + bookerInfo.bookerName && + bookerInfo.bookerPhoneNumber && + isTermChecked.term2 + ) { + if ( + isNonMember && + isTermChecked.term1 && + easyPassword.password === easyPassword.passwordCheck + ) { + setActiveButton(true); + } else { + setActiveButton(false); + } + } else { + setActiveButton(false); + } + }, [isNonMember, selectedValue, bookerInfo, easyPassword, isTermChecked]); + + return ( + + + +