@saooti/octopus-sdk 37.0.34 → 37.0.36

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@saooti/octopus-sdk",
3
- "version": "37.0.34",
3
+ "version": "37.0.36",
4
4
  "private": false,
5
5
  "description": "Javascript SDK for using octopus",
6
6
  "author": "Saooti",
@@ -16,34 +16,34 @@
16
16
  "dependencies": {
17
17
  "@popperjs/core": "^2.11.8",
18
18
  "@saooti/octopus-api": "^0.36.0",
19
- "@tiptap/extension-link": "^2.1.6",
20
- "@tiptap/extension-underline": "^2.1.6",
21
- "@tiptap/pm": "^2.1.6",
22
- "@tiptap/starter-kit": "^2.1.6",
23
- "@tiptap/vue-3": "^2.1.6",
19
+ "@tiptap/extension-link": "^2.1.11",
20
+ "@tiptap/extension-underline": "^2.1.11",
21
+ "@tiptap/pm": "^2.1.11",
22
+ "@tiptap/starter-kit": "^2.1.11",
23
+ "@tiptap/vue-3": "^2.1.11",
24
24
  "@vue/cli": "^5.0.8",
25
25
  "@vue/compat": "^3.3.4",
26
- "@vuepic/vue-datepicker": "^6.0.1",
27
- "autoprefixer": "^10.4.15",
28
- "axios": "^1.4.0",
29
- "dayjs": "^1.11.9",
26
+ "@vuepic/vue-datepicker": "^6.1.0",
27
+ "autoprefixer": "^10.4.16",
28
+ "axios": "^1.5.0",
29
+ "dayjs": "^1.11.10",
30
30
  "eslint-config-prettier": "^9.0.0",
31
31
  "eslint-plugin-prettier": "^5.0.0",
32
32
  "express": "^4.18.2",
33
- "hls.js": "^1.4.10",
34
- "humanize-duration": "^3.29.0",
35
- "jest": "^29.6.2",
33
+ "hls.js": "^1.4.12",
34
+ "humanize-duration": "^3.30.0",
35
+ "jest": "^29.7.0",
36
36
  "pinia": "^2.1.6",
37
37
  "qrcode.vue": "^3.4.1",
38
- "sass": "^1.66.1",
39
- "sonarqube-scanner": "^3.0.0",
40
- "swiper": "^10.2.0",
38
+ "sass": "^1.68.0",
39
+ "sonarqube-scanner": "^3.1.0",
40
+ "swiper": "^10.3.0",
41
41
  "video.js": "^7.21.5",
42
42
  "videojs-contrib-quality-levels": "^2.2.1",
43
43
  "videojs-hls-quality-selector": "^1.1.4",
44
44
  "vite": "^4.4.9",
45
45
  "vue": "^3.3.4",
46
- "vue-i18n": "^9.2.2",
46
+ "vue-i18n": "^9.4.1",
47
47
  "vue-recaptcha": "^2.0.3",
48
48
  "vue-router": "^4.2.4",
49
49
  "vue-select": "^4.0.0-beta.6",
@@ -54,12 +54,12 @@
54
54
  "@types/videojs-contrib-quality-levels": "^2.0.1",
55
55
  "@types/videojs-hls-quality-selector": "^1.1.0",
56
56
  "@types/vue-select": "^3.16.2",
57
- "@typescript-eslint/eslint-plugin": "^6.0.0",
58
- "@typescript-eslint/parser": "^6.0.0",
59
- "@vitejs/plugin-vue": "^4.3.2",
57
+ "@typescript-eslint/eslint-plugin": "^6.7.2",
58
+ "@typescript-eslint/parser": "^6.7.2",
59
+ "@vitejs/plugin-vue": "^4.3.4",
60
60
  "@vue/compiler-sfc": "^3.3.4",
61
61
  "@vue/eslint-config-typescript": "^11.0.3",
62
- "eslint": "^8.47.0",
62
+ "eslint": "^8.49.0",
63
63
  "eslint-plugin-vue": "^9.15.1",
64
64
  "typescript": "^5.1.6"
65
65
  },
Binary file
@@ -71,7 +71,7 @@
71
71
  <glyph unicode="&#xe93d;" glyph-name="amzn" horiz-adv-x="1206" d="M341.49 226.39c19.355-16.609 42.326-28.865 66.771-36.098 20.226-7.032 41.723-9.175 63.021-10.314 31.544 0.067 63.556 0.804 94.296 8.572 28.865 6.764 55.922 19.958 80.299 36.701 22.302 15.872 42.46 34.557 61.949 53.711 9.242-13.193 17.948-26.722 27.592-39.647 13.863-18.149 30.539-33.955 48.086-48.421 5.96-5.291 14.6-7.099 22.369-6.027 7.367 0.938 13.327 5.894 18.752 10.582 33.352 29.535 67.508 58.132 101.529 86.929 9.711 8.238 7.836 23.239 1.205 32.816-8.505 11.988-17.614 23.641-25.851 35.897-11.653 17.011-20.493 36.165-24.311 56.524-4.353 20.694-3.349 41.924-3.483 62.954 0 63.757 0 127.447 0 191.205 0.067 33.687 0.737 67.508-2.411 101.128-2.813 29.468-9.778 59.002-24.177 85.121-16.207 29.736-41.991 53.444-71.191 70.187-19.623 11.586-41.188 19.288-62.82 25.985-43.264 12.189-88.604 16.676-133.408 13.863-27.258-1.005-54.448-4.889-80.902-10.916-49.492-11.72-97.913-33.486-134.613-69.45-35.16-33.687-58.132-79.295-66.302-127.113-1.674-7.903 0.603-16.81 6.965-22.034 4.621-3.616 10.247-6.563 16.274-6.965 40.585-4.42 81.17-9.041 121.822-13.060 4.353-0.469 8.84-1.741 13.126 0 10.916 3.081 17.614 13.796 19.824 24.378 3.75 18.484 12.39 36.098 25.784 49.492 20.493 20.493 49.559 31.075 78.223 31.745 25.315 1.607 52.104-4.956 71.727-21.632 16.609-14.064 24.713-35.562 27.191-56.725 2.947-24.378 1.406-48.956 1.741-73.468-58.667-6.429-117.804-10.515-175.734-22.436-38.174-7.769-76.214-18.752-110.303-37.973-31.544-17.748-59.739-42.125-80.098-72.196-25.114-36.232-37.973-80.031-39.848-123.831-0.469-32.347 1.942-65.231 12.189-96.105 10.314-32.013 28.865-61.614 54.716-83.38zM475.701 429.918c2.009 28.262 12.926 56.658 33.821 76.281 19.958 19.489 46.612 30.338 73.267 37.035 31.879 7.702 64.829 9.51 97.578 9.979-0.134-33.821 1.339-67.776-2.411-101.395-2.88-26.186-11.184-51.702-24.378-74.54-10.849-18.618-25.918-34.825-44.335-46.144-18.417-10.381-39.915-16.274-61.078-13.193-24.445 1.808-46.88 17.011-58.6 38.308-12.591 22.235-15.002 48.555-13.863 73.669zM1205.159 182.256c-0.804 4.353-1.875 9.376-6.027 11.854-12.323 7.769-27.124 10.18-41.322 12.122-21.096 2.813-42.594 3.215-63.757 1.005-31.142-3.014-62.418-10.113-89.876-25.047-7.233-4.152-14.801-8.104-20.56-14.198-3.148-3.215-4.621-9.242-0.737-12.457 3.282-2.009 7.434-1.339 11.117-1.072 27.525 3.282 55.118 6.563 82.911 6.898 15.337 0.804 30.74 0.134 45.943-2.21 6.965-1.473 14.131-3.416 19.891-7.769 6.228-4.889 6.965-13.528 7.032-20.828-0.402-16.81-4.688-33.151-9.309-49.224-7.903-26.521-17.815-52.372-28.128-78.089-1.54-4.353-4.152-9.175-2.076-13.863 1.473-3.215 5.626-3.349 8.639-3.014 5.425 1.005 9.175 5.492 13.060 8.974 20.627 18.819 36.366 42.527 47.952 67.843 11.586 24.646 19.623 50.966 23.909 77.888 2.009 13.595 3.416 27.525 1.339 41.188zM1072.889 117.561c-38.643-15.471-77.553-30.539-117.469-42.393-62.351-18.35-125.84-33.084-190.401-40.987-78.826-10.849-158.79-12.591-238.085-6.831-33.352 2.344-66.503 6.764-99.52 11.586-17.681 2.545-35.227 6.496-52.841 9.778-31.41 5.827-62.217 14.265-93.024 22.57-88.872 26.119-175.265 61.413-255.565 107.758-5.827 3.215-12.457 7.903-19.288 4.688-4.152-2.009-6.094-6.898-4.956-11.184 0.938-5.224 5.693-8.305 9.309-11.653 85.657-76.415 186.249-135.886 294.676-173.658 29.066-10.782 59.136-18.417 89.14-26.186 48.019-11.117 96.908-18.082 146.066-21.766 34.491-1.808 69.115-3.148 103.672-0.804 34.29 1.005 68.378 5.96 102.266 10.983 72.062 12.39 142.985 32.213 210.091 61.413 46.478 19.757 90.814 44.603 131.801 74.138 6.764 4.42 13.193 12.256 10.849 20.895-2.813 11.050-16.743 15.604-26.722 11.653z" />
72
72
  <glyph unicode="&#xe93e;" glyph-name="iheart" d="M745.657 837.066c-97.043 0-183.602-51.782-233.465-127.217-49.736 76.331-135.784 127.217-233.593 127.217-153.811 0-278.599-125.043-278.599-279.366 0-86.814 46.923-171.966 108.805-223.236 2.557-3.068 158.158-147.034 295.348-273.74v204.826c0 139.747 213.136 138.724 213.136 0v-206.616l280.261 264.917c68.658 55.745 126.45 135.911 126.45 233.848 0.256 154.322-124.404 279.366-278.343 279.366zM261.977 337.277c-3.836-4.348-9.078-6.52-14.448-6.52-4.603 0-9.078 1.534-12.786 4.859-83.235 73.901-125.299 151.126-125.299 229.374v0.895c0 67.253 40.914 143.71 95.252 177.976 9.078 5.626 20.968 2.941 26.594-6.137s2.941-20.968-6.137-26.722c-43.215-27.233-77.098-90.906-77.098-145.117v-0.895c0-66.741 37.845-134.121 112.386-200.351 7.8-7.033 8.567-19.306 1.534-27.361zM386.126 409.131c-3.58-6.265-10.101-9.845-16.877-9.845-3.196 0-6.393 0.767-9.461 2.429-56.385 31.709-94.358 93.847-94.614 154.961v0.64c0.256 58.046 32.22 110.852 83.49 137.956 9.461 4.986 21.097 1.407 26.083-8.055s1.278-21.224-8.055-26.083c-38.613-20.457-62.778-60.22-62.778-103.947 0.128-47.563 30.174-96.404 74.795-121.464 9.334-5.37 12.657-17.261 7.416-26.594zM512.832 458.612c-46.156 0-83.618 37.589-83.618 83.873 0 46.412 37.462 83.873 83.618 83.873 46.284 0 83.746-37.462 83.746-83.873 0-46.284-37.462-83.873-83.746-83.873zM664.469 401.716c-2.941-1.662-6.265-2.429-9.461-2.429-6.776 0-13.297 3.58-16.877 9.845-5.242 9.334-1.918 21.097 7.416 26.339 44.622 25.060 74.795 73.901 74.795 121.464-0.128 43.726-24.165 83.618-62.778 103.947-9.461 4.986-13.041 16.749-8.055 26.083 4.986 9.461 16.621 13.041 26.083 8.055 51.27-27.106 83.235-79.91 83.49-137.956v-0.64c-0.256-60.86-38.229-122.998-94.614-154.705zM915.194 565.116v0c-0.128-78.248-42.321-155.474-125.427-229.374-3.708-3.324-8.311-4.859-12.786-4.859-5.37 0-10.612 2.174-14.448 6.52-7.033 7.927-6.393 20.201 1.662 27.361 74.54 66.23 112.386 133.737 112.386 200.351v0.895c0 54.211-33.881 117.883-77.098 145.117-9.078 5.626-11.763 17.645-6.137 26.722s17.516 11.763 26.594 6.137c54.211-34.137 95.252-110.596 95.252-177.976v-0.895z" />
73
73
  <glyph unicode="&#xe93f;" glyph-name="edit-ftp" horiz-adv-x="819" d="M531.563 322.985h-17.719v-21.656h17.719c5.906 0 10.828 4.922 10.828 10.828s-4.922 10.828-10.828 10.828zM819.002 546.439c0 109.266-88.594 197.86-197.86 197.86-72.844 0-135.845-39.375-170.298-98.438-57.095-14.766-104.344-55.125-126.985-112.22-5.906 0.984-11.812 1.968-17.719 1.968-69.891 0-130.923-50.203-146.673-121.079-8.86 1.968-17.719 3.938-26.578 3.938-72.844 0-132.891-60.047-132.891-133.875s57.095-132.891 130.923-132.891c1.968 0 7.876 0 9.844 0h518.768c10.828 0 20.672 1.968 32.485 5.906 64.969 18.703 110.25 79.735 110.25 147.657-0.984 39.375-14.766 75.797-40.359 103.36 35.437 35.437 57.095 84.656 57.095 137.813zM332.718 323.97h-38.391v-14.766h19.688c9.844 0 16.734-6.89 16.734-16.734s-6.89-16.734-16.734-16.734h-19.688v-51.187c0-9.844-6.89-16.734-16.734-16.734s-16.734 6.89-16.734 16.734v115.172c0 9.844 6.89 16.734 16.734 16.734h55.125c7.876 0 16.734-5.906 16.734-15.75s-6.89-16.734-16.734-16.734zM457.735 322.985h-24.609v-99.422c0-9.844-6.89-16.734-16.734-16.734s-16.734 6.89-16.734 16.734v99.422h-24.609c-9.844 0-16.734 6.89-16.734 16.734s6.89 16.734 16.734 16.734h82.688c9.844 0 16.734-6.89 16.734-16.734s-6.89-16.734-16.734-16.734zM531.563 268.845h-17.719v-44.297c0-9.844-6.89-16.734-16.734-16.734s-16.734 6.89-16.734 16.734v115.172c0 9.844 6.89 16.734 16.734 16.734h34.453c23.625 0 44.297-19.688 44.297-43.313 0-24.609-19.688-44.297-44.297-44.297zM620.157 386.97c-87.61 0-158.485 70.875-158.485 158.485s70.875 158.485 158.485 158.485c87.61 0 159.469-69.891 159.469-157.501s-70.875-159.469-159.469-159.469zM541.291 518.392l108.585 108.585 50.115-50.115-108.585-108.585-50.115 50.115zM696.938 658.659c-8.86 0-17.719-2.954-24.609-9.844l-14.766-14.766 49.219-49.219 14.766 14.766c5.906 5.906 9.844 15.75 9.844 24.609s-2.954 17.719-9.844 24.609c-5.906 5.906-15.75 9.844-24.609 9.844zM515.812 448.985c0-2.954 0-3.938 0-4.922 0.984-3.938 2.954-4.922 6.89-3.938l59.063 21.656-46.265 46.265-19.688-59.063z" />
74
- <glyph unicode="&#xe940;" glyph-name="play-video" horiz-adv-x="1067" d="M956.745 857.019h-846.49c-60.463 0-110.257-49.794-110.257-110.257v-597.522c0-60.463 49.794-110.257 110.257-110.257h846.49c60.463 0 110.257 49.794 110.257 110.257v597.522c0 60.463-49.794 110.257-110.257 110.257zM725.561 426.66l-291.648-177.834c-7.113-3.557-21.34-3.557-28.453 0s-14.227 14.227-14.227 21.34v355.669c0 10.67 7.113 17.784 14.227 21.34s17.784 3.557 24.897 0l295.205-177.834c7.113-3.557 14.227-14.227 14.227-21.34 0-10.67-3.557-17.784-14.227-21.34z" />
74
+ <glyph unicode="&#xe940;" glyph-name="play-video" horiz-adv-x="1067" d="M76.212 831.612c154.969 0 711.336 0 711.336 0 20.324 0 40.648-7.621 53.35-22.864 15.243-15.243 22.864-33.026 22.864-53.35v-170.212l160.051 137.186c7.621 7.621 17.783 7.621 27.946 2.54s15.243-12.703 15.243-22.864v-508.098c0-10.162-5.081-17.783-15.243-22.864s-20.324-2.54-27.946 2.54l-160.051 137.186v-170.212c0-20.324-7.621-40.648-22.864-53.35-15.243-15.243-33.026-22.864-53.35-22.864h-711.336c-43.189 0-76.215 33.026-76.215 76.215v609.717c0 48.269 33.026 81.296 76.215 81.296z" />
75
75
  <glyph unicode="&#xe941;" glyph-name="spotify" d="M512 960c-281.6 0-512-230.4-512-512s230.4-512 512-512 512 230.4 512 512-227.84 512-512 512zM747.562 220.16c-10.24-15.318-28.16-20.48-43.562-10.24-120.32 74.24-271.36 89.644-450.604 48.682-17.836-5.206-33.236 7.636-38.356 22.996-5.12 17.962 7.68 33.28 23.040 38.4 194.56 43.562 363.52 25.6 496.64-56.32 17.92-7.68 20.438-28.116 12.842-43.52zM809.004 360.96c-12.842-17.92-35.884-25.6-53.846-12.8-138.198 84.48-348.118 110.080-509.396 58.88-20.438-5.12-43.52 5.12-48.64 25.6s5.12 43.562 25.6 48.682c186.88 56.276 417.28 28.074 576-69.164 15.404-7.722 23.040-33.28 10.284-51.2zM814.124 504.32c-163.884 97.28-437.802 107.52-593.962 58.836-25.6-7.638-51.2 7.724-58.88 30.762-7.68 25.644 7.68 51.2 30.72 58.924 181.76 53.76 481.28 43.52 670.764-69.164 22.996-12.8 30.678-43.52 17.876-66.56-12.756-17.964-43.52-25.558-66.518-12.8z" />
76
76
  <glyph unicode="&#xe942;" glyph-name="podcast" d="M509.026-64.001s112.341 0 112.341 332.548c0 61.909-50.347 112.343-112.343 112.343s-112.385-50.433-112.385-112.343c0-332.548 112.385-332.548 112.385-332.548zM646.842 49.323c4.908 19.072 8.746 38.23 11.732 57.645l2.26 15.36c4.908 2.134 9.812 4.182 14.764 6.4 77.997 35.328 143.66 95.703 185.516 170.37 19.072 34.26 33.152 71.255 41.515 109.741 9.684 43.009 12.16 87.851 7.082 131.756-4.48 41.089-15.404 81.237-32.852 118.914-19.84 44.333-47.405 84.737-82.093 118.786-35.328 35.284-77.101 64.213-122.67 84.139-46.849 21.162-98.261 32.084-150.19 33.364-52.053 1.28-104.023-7.082-152.834-25.728-46.849-17.876-89.857-44.247-127.106-78.253-35.284-32.086-65.451-71.253-87.297-114.261-18.646-36.608-31.402-75.777-38.485-116.182-7.082-41.773-7.082-84.737-0.684-127.148 5.76-37.206 16.682-73.813 32.768-108.501 37.888-80.257 102.101-146.946 181.676-187.478 9.644-4.438 19.242-8.96 29.524-13.398 0.64-5.164 1.964-10.924 2.56-16.726 3.2-18.688 7.084-37.932 11.562-56.535-17.322 5.802-34.688 12.246-51.371 19.968-91.821 41.645-169.474 113.579-217.647 202.839-21.844 40.405-37.248 83.415-46.849 128.43-10.966 49.409-12.884 101.419-6.4 152.152 6.4 47.445 19.884 94.337 39.809 137.39 23.722 50.689 57.133 97.537 96.897 136.706 39.083 39.083 87.893 71.851 141.23 94.337 55.597 23.338 115.33 35.84 175.406 36.564 60.247 0.64 120.492-10.24 176.598-32.342 54.017-21.248 103.851-52.821 146.348-92.417 41.175-38.188 75.093-83.713 100.097-133.934 21.164-42.369 35.924-88.577 43.009-135.468 7.68-48.811 7.68-98.859-0.682-147.030-7.082-44.929-21.846-89.217-41.771-130.262-44.929-90.539-119.426-165.036-209.923-210.007-22.486-10.924-46.251-20.524-70.615-28.202l-0.896-0.98zM669.030 232.579l0.428 20.052c0 13.482 0 26.966-1.962 40.237-0.64 5.164-1.92 9.644-3.2 14.764 23.764 19.244 43.649 43.649 58.413 71.255 10.924 20.524 19.244 43.009 23.764 66.177 5.164 25.686 6.4 52.609 2.602 79.573-3.158 23.764-9.684 46.849-19.244 68.693-12.16 26.284-28.884 50.689-49.409 71.253-21.206 20.524-44.973 37.204-71.937 49.451-29.524 12.8-61.655 20.48-93.741 21.164-32.084 0.64-64.855-5.164-95.021-16.724-26.964-10.924-52.013-26.324-73.813-46.209-21.888-19.882-39.851-43.009-52.693-69.291-10.964-21.164-18.604-43.691-23.126-67.415-4.48-24.406-5.076-49.453-1.92-73.813 3.2-23.766 9.642-46.893 19.242-68.653 14.762-32.768 36.564-61.655 63.573-85.419l-3.882-17.322c-2.56-13.482-1.92-26.326-1.92-40.405v-18.004c-44.973 27.562-82.219 67.415-107.223 113.621-14.806 26.326-25.046 54.573-30.848 84.141-7.082 32.768-8.32 66.731-3.84 100.141 3.84 30.166 12.204 59.693 24.406 86.701 14.764 33.322 36.564 64.171 62.251 90.497 26.324 26.324 57.131 47.489 90.497 62.253 37.248 16.682 77.655 25.686 118.146 26.966 41.131 0.682 82.219-6.4 120.022-21.204 34.688-13.44 66.177-33.324 93.741-58.369 26.924-25.046 50.093-54.529 66.731-87.339 13.482-26.964 23.764-55.851 28.928-85.377 5.164-30.848 6.4-62.251 1.92-93.099-3.84-30.166-12.16-59.691-25.088-87.297-25.004-55.895-68.011-104.021-120.662-135.512l4.864 4.524zM509.026 641.117c62.509 0 113.239-50.689 113.239-113.323 0-62.849-50.731-113.581-113.237-113.581-62.593 0-113.281 50.731-113.281 112.981s50.689 113.025 113.281 113.025v0.896z" />
77
77
  <glyph unicode="&#xe943;" glyph-name="deezer" d="M627.925 162.326h186.668v56.534h-186.752v-56.534h0.086zM209.368 162.326h186.582v56.534h-186.624v-56.534h0.17zM0.002 162.326h186.668v56.534h-186.668v-56.534zM418.561 162.326h186.88v56.534h-186.88v-56.534zM837.332 162.326h186.668v56.534h-186.668v-56.534zM837.332 235.883h186.668v56.32h-186.668v-56.746zM418.605 235.883h187.306v56.32h-187.348v-56.746zM0.044 235.883h186.88v56.32h-186.924v-56.746zM209.538 235.883h186.88v56.32h-186.924v-57.174l0.086 0.428zM628.949 235.883h186.88v56.32h-187.732v-57.174l0.726 0.428zM628.949 309.271h186.88v56.32h-187.732v-56.746h0.726zM210.606 309.271h186.026v56.32h-187.136v-56.746h0.682zM1.282 309.271h186.026v56.32h-187.306v-56.746h0.684zM419.841 309.271h186.88v56.32h-187.734v-56.746h0.682zM839.040 309.271h184.96v56.32h-186.668v-56.746h1.152zM839.040 382.657h184.96v56.788h-186.668v-56.576h1.152zM420.481 382.657h186.154v56.788h-187.734v-56.576h1.408zM1.922 382.657h185.812v56.788h-187.734v-56.576h1.28zM630.401 382.657h186.88v56.788h-189.014v-56.576h1.876zM630.401 456.043h186.88v56.748h-189.014v-56.32h1.876zM1.922 456.043h185.812v56.32h-187.734v-56.32h1.28zM420.481 456.043h186.88v56.32h-188.8v-56.32h1.366zM839.040 456.043h184.96v56.748h-186.668v-56.662l1.152 0.084zM418.561 529.899h186.88v56.576h-186.88v-56.576zM837.332 529.983h186.668v56.534h-186.668v-56.534zM418.561 603.499h186.88v56.62h-186.88v-56.62zM837.332 603.499h186.668v56.62h-186.668v-56.62zM837.332 677.099h186.668v56.576h-186.668v-56.576z" />
Binary file
Binary file
@@ -1,10 +1,10 @@
1
1
  @font-face {
2
2
  font-family: 'icomoon';
3
- src: url('/css/fonts/icomoon.eot?kq297p');
4
- src: url('/css/fonts/icomoon.eot?kq297p#iefix') format('embedded-opentype'),
5
- url('/css/fonts/icomoon.ttf?kq297p') format('truetype'),
6
- url('/css/fonts/icomoon.woff?kq297p') format('woff'),
7
- url('/css/fonts/icomoon.svg?kq297p#icomoon') format('svg');
3
+ src: url('/css/fonts/icomoon.eot?gdc25d');
4
+ src: url('/css/fonts/icomoon.eot?gdc25d#iefix') format('embedded-opentype'),
5
+ url('/css/fonts/icomoon.ttf?gdc25d') format('truetype'),
6
+ url('/css/fonts/icomoon.woff?gdc25d') format('woff'),
7
+ url('/css/fonts/icomoon.svg?gdc25d#icomoon') format('svg');
8
8
  font-weight: normal;
9
9
  font-style: normal;
10
10
  font-display: block;
@@ -1,3 +1,4 @@
1
+ $newLightenColor:lighten($octopus-primary-color, 55%);
1
2
  .octopus-app{
2
3
  .page-box-absolute{
3
4
  position: absolute;
@@ -271,26 +272,52 @@
271
272
  &:focus{
272
273
  background: rgba(0, 0, 0, 0.09);
273
274
  }
274
- .icon-container {
275
- background: $primaryColorLessTransparent !important;
276
- border-radius: 2rem;
275
+ .multiple-play-buttons-container{
276
+ background-color:rgba(0, 0, 0, 0.7);
277
+ border-radius: $octopus-borderradius;
277
278
  color: white;
278
- padding: 0.5rem;
279
- margin: 0.5rem;
279
+ padding: 0.3rem;
280
+ width: fit-content;
281
+ font-size: 0.9rem;
282
+ margin: 0.2rem;
280
283
  display: flex;
281
284
  align-items: center;
282
- justify-content: center;
283
- z-index: 2;
284
- width: fit-content;
285
-
286
- &:hover {
287
- background: #00000030;
288
- }
289
- .saooti-play {
290
- font-size: 1.4rem;
291
- position: relative;
285
+ .saooti-play, .saooti-play-video{
286
+ font-size: 1.8rem;
292
287
  color: white;
293
288
  }
289
+ &.hover-type-audio, &.hover-type-video{
290
+ color: $newLightenColor;
291
+ .bloc-paddle > span{
292
+ background: $newLightenColor !important;
293
+ }
294
+ }
295
+ &.hover-type-video{
296
+ .saooti-play{
297
+ color: white;
298
+ }
299
+ .saooti-play-video{
300
+ color: $newLightenColor;
301
+ }
302
+ &.has-video{
303
+ .saooti-play-video{
304
+ font-size: 2.5rem;
305
+ }
306
+ }
307
+ }
308
+ &.hover-type-audio{
309
+ .saooti-play{
310
+ color: $newLightenColor;
311
+ }
312
+ .saooti-play-video{
313
+ color: white;
314
+ }
315
+ &.has-video{
316
+ .saooti-play{
317
+ font-size: 2.5rem;
318
+ }
319
+ }
320
+ }
294
321
  }
295
322
  }
296
323
  }
@@ -5,15 +5,15 @@
5
5
  .bloc-paddle{
6
6
  align-items: flex-end;
7
7
  display: flex;
8
- width: 0.9rem;
9
- height: 1.2rem;
8
+ width: 1.4rem;
9
+ height: 1.8rem;
10
10
  justify-content: space-around;
11
11
  align-content: flex-start;
12
12
  border-radius: 50%;
13
13
  background: transparent !important;
14
14
 
15
15
  > span {
16
- width: 0.1rem;
16
+ width: 0.2rem;
17
17
  margin: 0.05rem;
18
18
  background: #fff;
19
19
  }
@@ -15,9 +15,9 @@
15
15
  :alt="$t('Canal name image', { name: radio.name })"
16
16
  />
17
17
  <button class="image-play-button" @click="playRadio">
18
- <div class="icon-container">
18
+ <div class="multiple-play-buttons-container">
19
19
  <div v-if="!playingRadio" :title="$t('Play')" class="saooti-play" />
20
- <div v-else class="bloc-paddle">
20
+ <div v-else class="bloc-paddle" :class="playingRadio && 'PLAYING' === playerStatus ? 'play-animation' : ''">
21
21
  <span class="paddle1" />
22
22
  <span class="paddle2" />
23
23
  <span class="paddle3" />
@@ -28,45 +28,11 @@
28
28
  <div v-if="isRecordedInLive" class="live-image-status recording-bg">
29
29
  {{ $t("Recorded in live") }}
30
30
  </div>
31
- <button
32
- v-if="hidePlay || recordingLive"
33
- class="image-play-button"
34
- :class="classicPodcastPlay ? '' : 'transparent-background'"
35
- @click="play(false)"
36
- >
37
- <div v-if="!isLiveToBeRecorded" class="icon-container">
38
- <div v-if="!playingPodcast" :title="$t('Play')" class="saooti-play" />
39
- <div
40
- v-if="!classicPodcastPlay"
41
- class="special-icon-play-button"
42
- :class="iconName"
43
- />
44
- <div
45
- v-if="playingPodcast"
46
- :class="'PLAYING' === playerStatus ? 'play-animation' : ''"
47
- class="bloc-paddle"
48
- >
49
- <span class="paddle1" />
50
- <span class="paddle2" />
51
- <span class="paddle3" />
52
- </div>
53
- <div class="ms-2">
54
- {{ durationString }}
55
- </div>
56
- </div>
57
- <div v-else class="icon-container play-button-error-icon">
58
- <div :title="textVisible" class="big-icon-error" :class="iconName" />
59
- </div>
60
- <div v-if="!classicPodcastPlay" class="live-image-status bg-dark">
61
- {{ textVisible }}
62
- </div>
63
- </button>
64
- <button
65
- v-if="isVideoPodcast"
66
- :title="$t('Video')"
67
- class="btn admin-button btn-play-video saooti-play-video"
68
- @click="play(true)"
69
- ></button>
31
+ <PodcastPlayButton
32
+ :podcast="podcast"
33
+ :hidePlay="hidePlay"
34
+ :fetchConference="fetchConference"
35
+ />
70
36
  <div
71
37
  v-if="displayDescription && isMobile"
72
38
  class="background-icon bg-primary saooti-arrow-up"
@@ -78,16 +44,17 @@
78
44
  </template>
79
45
 
80
46
  <script lang="ts">
81
- import DurationHelper from "../../../helper/duration";
47
+ import PodcastPlayButton from "./PodcastPlayButton.vue";
82
48
  import { state } from "../../../stores/ParamSdkStore";
83
49
  import { Podcast } from "@/stores/class/general/podcast";
84
50
  import { Conference } from "@/stores/class/conference/conference";
85
51
  import imageProxy from "../../mixins/imageProxy";
86
- import { usePlayerStore } from "@/stores/PlayerStore";
87
- import { mapState, mapActions } from "pinia";
88
52
  import { defineComponent } from "vue";
89
53
  export default defineComponent({
90
54
  name: "PodcastImage",
55
+ components:{
56
+ PodcastPlayButton
57
+ },
91
58
  mixins: [imageProxy],
92
59
  props: {
93
60
  podcast: { default: () => ({}), type: Object as () => Podcast },
@@ -104,26 +71,6 @@ export default defineComponent({
104
71
  };
105
72
  },
106
73
  computed: {
107
- ...mapState(usePlayerStore, [
108
- "playerPodcast",
109
- "playerLive",
110
- "playerStatus",
111
- "playerVideo",
112
- ]),
113
- isVideoPodcast(): boolean {
114
- return (
115
- this.fetchConference?.videoProfile?.includes("video_") ||
116
- undefined !== this.podcast.video?.videoId
117
- );
118
- },
119
- playingPodcast() {
120
- return (
121
- this.playerPodcast?.podcastId === this.podcast.podcastId ||
122
- (this.fetchConference &&
123
- "null" !== this.fetchConference.toString() &&
124
- this.playerLive?.conferenceId === this.fetchConference.conferenceId)
125
- );
126
- },
127
74
  mainRubrique(): boolean {
128
75
  return (
129
76
  undefined !== state.podcastPage.mainRubrique &&
@@ -146,105 +93,6 @@ export default defineComponent({
146
93
  "READY_TO_RECORD" !== this.podcast.processingStatus
147
94
  );
148
95
  },
149
- isLiveToBeRecorded(): boolean {
150
- return (
151
- undefined === this.fetchConference &&
152
- undefined !== this.podcast.conferenceId &&
153
- "READY_TO_RECORD" === this.podcast.processingStatus
154
- );
155
- },
156
- classicPodcastPlay(): boolean {
157
- return (
158
- undefined !== this.podcast &&
159
- false !== this.podcast.valid &&
160
- ("READY_TO_RECORD" === this.podcast.processingStatus ||
161
- "READY" === this.podcast.processingStatus ||
162
- ("PROCESSING" === this.podcast.processingStatus &&
163
- !(state.generalParameters.authenticated as boolean))) &&
164
- !this.isLiveToBeRecorded &&
165
- undefined !== this.podcast.availability.visibility &&
166
- this.podcast.availability.visibility
167
- );
168
- },
169
- iconName(): string {
170
- if (this.isLiveToBeRecorded) return "saooti-clock";
171
- if ("READY" === this.podcast.processingStatus || this.fetchConference) {
172
- if (!this.podcast.valid) return "saooti-checkmark";
173
- if (
174
- !this.podcast.availability.visibility &&
175
- this.podcast.availability.date
176
- )
177
- return "saooti-clock";
178
- return "saooti-eye-blocked";
179
- }
180
- if (
181
- "PLANNED" === this.podcast.processingStatus ||
182
- "PROCESSING" === this.podcast.processingStatus
183
- )
184
- return "saooti-hourglass";
185
- if ("CANCELED" === this.podcast.processingStatus)
186
- return "saooti-cancel-circle";
187
- return "saooti-warning";
188
- },
189
- textVisible(): string {
190
- if (this.isLiveToBeRecorded)
191
- return this.$t("Podcast linked to waiting live");
192
- if ("READY" === this.podcast.processingStatus || this.fetchConference) {
193
- if (!this.podcast.valid) return this.$t("Podcast to validate");
194
- if (
195
- !this.podcast.availability.visibility &&
196
- this.podcast.availability.date
197
- )
198
- return this.$t("Podcast publish in future");
199
- return this.$t("Podcast no visible");
200
- }
201
- if (
202
- "PLANNED" === this.podcast.processingStatus ||
203
- "PROCESSING" === this.podcast.processingStatus
204
- )
205
- return this.$t("Podcast in process");
206
- if ("CANCELED" === this.podcast.processingStatus)
207
- return this.$t("Podcast in cancelled status");
208
- return this.$t("Podcast in error");
209
- },
210
- statusText(): string {
211
- if (!this.fetchConference) return "";
212
- switch (this.fetchConference.status) {
213
- case "PLANNED":
214
- return this.$t("live in few time");
215
- case "PENDING":
216
- if (this.isAnimatorLive) return this.$t("Open studio");
217
- return this.$t("live upcoming");
218
- case "RECORDING":
219
- return this.$t("In live");
220
- case "DEBRIEFING":
221
- if ("READY_TO_RECORD" === this.podcast.processingStatus)
222
- return this.$t("Not recording");
223
- return this.$t("Debriefing");
224
- case "ERROR":
225
- return this.$t("In error");
226
- case "PUBLISHING":
227
- return this.$t("Publishing");
228
- default:
229
- return "";
230
- }
231
- },
232
- recordingLive(): boolean {
233
- return (
234
- undefined !== this.fetchConference &&
235
- -1 !== this.fetchConference.conferenceId &&
236
- ("RECORDING" === this.fetchConference.status ||
237
- "PENDING" === this.fetchConference.status)
238
- );
239
- },
240
- clickPlayGoPage(): boolean {
241
- return state.podcastPage.clickPlayGoPage as boolean;
242
- },
243
- durationString(): string {
244
- return DurationHelper.formatDuration(
245
- Math.round(this.podcast.duration / 1000),
246
- );
247
- },
248
96
  },
249
97
  watch: {
250
98
  arrowDirection(): void {
@@ -259,30 +107,6 @@ export default defineComponent({
259
107
  },
260
108
 
261
109
  methods: {
262
- ...mapActions(usePlayerStore, ["playerChangeStatus", "playerPlay"]),
263
- play(isVideo: boolean): void {
264
- if (this.isLiveToBeRecorded) {
265
- return;
266
- }
267
- if (this.playingPodcast && isVideo === this.playerVideo) {
268
- this.playerChangeStatus("PLAYING" === this.playerStatus);
269
- return;
270
- }
271
- if (!this.recordingLive) {
272
- this.playerPlay(this.podcast, isVideo);
273
- } else {
274
- this.playerPlay(
275
- {
276
- ...this.podcast,
277
- ...{ conferenceId: this.fetchConference?.conferenceId },
278
- },
279
- isVideo,
280
- );
281
- }
282
- if (this.clickPlayGoPage) {
283
- this.$router.push("/main/pub/podcast/" + this.podcast.podcastId);
284
- }
285
- },
286
110
  showDescription(): void {
287
111
  if (this.isDescription) {
288
112
  this.$emit("hideDescription");
@@ -321,43 +145,5 @@ export default defineComponent({
321
145
  cursor: pointer;
322
146
  z-index: 3;
323
147
  }
324
- .transparent-background {
325
- background-color: rgba(255, 255, 255, 0.5);
326
- }
327
-
328
- .btn.btn-play-video {
329
- position: absolute;
330
- bottom: 0;
331
- right: 0;
332
- margin: 0.5rem;
333
- background: $primaryColorLessTransparent !important;
334
- color: white !important;
335
- }
336
-
337
- .image-play-button .play-button-error-icon {
338
- background: #0000009d !important;
339
- cursor: default !important;
340
- /* align-self: center;
341
- margin-bottom: calc(50% - 1rem); */
342
- .big-icon-error {
343
- font-size: 1.5rem;
344
- position: relative;
345
- }
346
- }
347
- .special-icon-play-button {
348
- width: 30px;
349
- height: 30px;
350
- background-color: #ffd663;
351
- color: black;
352
- border-radius: 50%;
353
- position: absolute;
354
- left: 4.4rem;
355
- bottom: 2.2rem;
356
- font-size: 0.9rem;
357
- font-weight: bold;
358
- display: flex;
359
- align-items: center;
360
- justify-content: center;
361
- }
362
148
  }
363
149
  </style>
@@ -7,10 +7,7 @@
7
7
  >
8
8
  <PodcastImage
9
9
  :podcast="podcast"
10
- :hide-play="
11
- !podcastItemDescription ||
12
- (podcastItemDescription && (!hoverDesc || !description))
13
- "
10
+ :hide-play="hoverDesc && 0 !== description.length && podcastItemDescription"
14
11
  :display-description="0 !== description.length && podcastItemDescription"
15
12
  :arrow-direction="arrowDirection"
16
13
  :fetch-conference="fetchConference"
@@ -12,8 +12,8 @@
12
12
  : '',
13
13
  ]"
14
14
  class="me-3"
15
+ :hide-play="isLiveReadyToRecord"
15
16
  :podcast="podcast"
16
- :hide-play="!isLiveReadyToRecord"
17
17
  :playing-podcast="playingPodcast"
18
18
  :fetch-conference="fetchConference"
19
19
  :is-animator-live="isOctopusAndAnimator"
@@ -0,0 +1,237 @@
1
+ <template>
2
+ <button
3
+ v-if="!hidePlay || recordingLive"
4
+ class="image-play-button"
5
+ @mouseenter="hoverType='audio'"
6
+ @mouseleave="hoverType=''"
7
+ @click="play(false)"
8
+ >
9
+ <div
10
+ class="multiple-play-buttons-container"
11
+ :class="[
12
+ hoverType ? 'hover-type-'+hoverType : '',
13
+ isVideoPodcast ? 'has-video' : '',
14
+ ]"
15
+ >
16
+ <template v-if="!isLiveToBeRecorded">
17
+ <div v-if="!playingPodcast || (playingPodcast && playerVideo)" :title="$t('Play')" class="saooti-play me-1" />
18
+ <div
19
+ v-if="playingPodcast"
20
+ :class="'PLAYING' === playerStatus ? 'play-animation' : ''"
21
+ class="bloc-paddle mx-1"
22
+ >
23
+ <span class="paddle1" />
24
+ <span class="paddle2" />
25
+ <span class="paddle3" />
26
+ </div>
27
+ <button
28
+ v-if="isVideoPodcast && !playerVideo"
29
+ :title="$t('Video')"
30
+ class="btn-transparent d-flex align-items-center saooti-play-video"
31
+ @mouseenter="hoverType='video'"
32
+ @mouseleave="hoverType='audio'"
33
+ @click.stop="play(true)"
34
+ />
35
+ <div
36
+ v-if="!classicPodcastPlay"
37
+ class="special-icon-play-button"
38
+ :class="iconName"
39
+ />
40
+ <div class="ms-2">
41
+ {{ durationString }}
42
+ </div>
43
+ </template>
44
+ <div v-else :title="textVisible" class="big-icon-error" :class="iconName" />
45
+ </div>
46
+ <div v-if="!classicPodcastPlay" class="live-image-status bg-dark">
47
+ {{ textVisible }}
48
+ </div>
49
+ </button>
50
+ </template>
51
+
52
+ <script lang="ts">
53
+ import DurationHelper from "../../../helper/duration";
54
+ import { state } from "../../../stores/ParamSdkStore";
55
+ import { Podcast } from "@/stores/class/general/podcast";
56
+ import { Conference } from "@/stores/class/conference/conference";
57
+ import imageProxy from "../../mixins/imageProxy";
58
+ import { usePlayerStore } from "@/stores/PlayerStore";
59
+ import { mapState, mapActions } from "pinia";
60
+ import { defineComponent } from "vue";
61
+ export default defineComponent({
62
+ name: "PodcastPlayButton",
63
+ mixins: [imageProxy],
64
+ props: {
65
+ podcast: { default: () => ({}), type: Object as () => Podcast },
66
+ hidePlay: { default: false, type: Boolean },
67
+ fetchConference: { default: undefined, type: Object as () => Conference },
68
+ },
69
+ data() {
70
+ return {
71
+ hoverType: "" as string,
72
+ };
73
+ },
74
+ computed: {
75
+ ...mapState(usePlayerStore, [
76
+ "playerPodcast",
77
+ "playerLive",
78
+ "playerStatus",
79
+ "playerVideo",
80
+ ]),
81
+ isVideoPodcast(): boolean {
82
+ return (
83
+ this.fetchConference?.videoProfile?.includes("video_") ||
84
+ undefined !== this.podcast.video?.videoId
85
+ );
86
+ },
87
+ playingLive(): boolean{
88
+ return undefined!==this.fetchConference && "null" !== this.fetchConference.toString() &&
89
+ this.playerLive?.conferenceId === this.fetchConference.conferenceId;
90
+ },
91
+ playingPodcast() {
92
+ return this.playerPodcast?.podcastId === this.podcast.podcastId || this.playingLive;
93
+ },
94
+ isLiveToBeRecorded(): boolean {
95
+ return undefined === this.fetchConference && this.isLiveReadyToRecord;
96
+ },
97
+ isLiveReadyToRecord(): boolean {
98
+ return undefined !== this.podcast?.conferenceId && 0 !== this.podcast.conferenceId &&
99
+ "READY_TO_RECORD" === this.podcast.processingStatus;
100
+ },
101
+ isLiveValidAndVisible():boolean{
102
+ return undefined !== this.podcast && false !== this.podcast.valid &&
103
+ undefined !== this.podcast.availability.visibility && this.podcast.availability.visibility;
104
+ },
105
+ classicPodcastPlay(): boolean {
106
+ return (
107
+ this.isLiveValidAndVisible &&
108
+ !this.isLiveToBeRecorded &&
109
+ ("READY_TO_RECORD" === this.podcast.processingStatus ||
110
+ "READY" === this.podcast.processingStatus ||
111
+ ("PROCESSING" === this.podcast.processingStatus && !(state.generalParameters.authenticated as boolean)))
112
+ );
113
+ },
114
+ iconName(): string {
115
+ if (this.isLiveToBeRecorded) return "saooti-clock";
116
+ if ("READY" === this.podcast.processingStatus || this.fetchConference) {
117
+ if (!this.podcast.valid) return "saooti-checkmark";
118
+ if (
119
+ !this.podcast.availability.visibility &&
120
+ this.podcast.availability.date
121
+ )
122
+ return "saooti-clock";
123
+ return "saooti-eye-blocked";
124
+ }
125
+ if (
126
+ "PLANNED" === this.podcast.processingStatus ||
127
+ "PROCESSING" === this.podcast.processingStatus
128
+ )
129
+ return "saooti-hourglass";
130
+ if ("CANCELED" === this.podcast.processingStatus)
131
+ return "saooti-cancel-circle";
132
+ return "saooti-warning";
133
+ },
134
+ textVisible(): string {
135
+ if (this.isLiveToBeRecorded)
136
+ return this.$t("Podcast linked to waiting live");
137
+ if ("READY" === this.podcast.processingStatus || this.fetchConference) {
138
+ if (!this.podcast.valid) return this.$t("Podcast to validate");
139
+ if (
140
+ !this.podcast.availability.visibility &&
141
+ this.podcast.availability.date
142
+ )
143
+ return this.$t("Podcast publish in future");
144
+ return this.$t("Podcast no visible");
145
+ }
146
+ if (
147
+ "PLANNED" === this.podcast.processingStatus ||
148
+ "PROCESSING" === this.podcast.processingStatus
149
+ )
150
+ return this.$t("Podcast in process");
151
+ if ("CANCELED" === this.podcast.processingStatus)
152
+ return this.$t("Podcast in cancelled status");
153
+ return this.$t("Podcast in error");
154
+ },
155
+ recordingLive(): boolean {
156
+ return (
157
+ undefined !== this.fetchConference &&
158
+ -1 !== this.fetchConference.conferenceId &&
159
+ ("RECORDING" === this.fetchConference.status ||
160
+ "PENDING" === this.fetchConference.status)
161
+ );
162
+ },
163
+ clickPlayGoPage(): boolean {
164
+ return state.podcastPage.clickPlayGoPage as boolean;
165
+ },
166
+ durationString(): string {
167
+ return DurationHelper.formatDuration(
168
+ Math.round(this.podcast.duration / 1000),
169
+ );
170
+ },
171
+ },
172
+
173
+ methods: {
174
+ ...mapActions(usePlayerStore, ["playerChangeStatus", "playerPlay"]),
175
+ play(isVideo: boolean): void {
176
+ if (this.isLiveToBeRecorded) {
177
+ return;
178
+ }
179
+ if (this.playingPodcast && isVideo === this.playerVideo) {
180
+ this.playerChangeStatus("PLAYING" === this.playerStatus);
181
+ return;
182
+ }
183
+ if (!this.recordingLive) {
184
+ this.playerPlay(this.podcast, isVideo);
185
+ } else {
186
+ this.playerPlay(
187
+ {
188
+ ...this.podcast,
189
+ ...{ conferenceId: this.fetchConference?.conferenceId },
190
+ },
191
+ isVideo,
192
+ );
193
+ }
194
+ if (this.clickPlayGoPage) {
195
+ this.$router.push("/main/pub/podcast/" + this.podcast.podcastId);
196
+ }
197
+ },
198
+ },
199
+ });
200
+ </script>
201
+
202
+ <style lang="scss">
203
+ .octopus-app {
204
+ .live-image-status {
205
+ text-align: center;
206
+ width: 100%;
207
+ font-size: 0.6rem;
208
+ padding: 0.2rem 0;
209
+ color: white;
210
+ text-transform: uppercase;
211
+ position: absolute;
212
+ top: 0;
213
+ }
214
+
215
+ .big-icon-error {
216
+ font-size: 1.5rem;
217
+ }
218
+ .special-icon-play-button{
219
+ width: 30px;
220
+ height: 30px;
221
+ background-color: #ffd663;
222
+ color: black;
223
+ border-radius: 50%;
224
+ position: absolute;
225
+ left: 4.9rem;
226
+ bottom: 2.3rem;
227
+ font-size: 0.9rem;
228
+ font-weight: bold;
229
+ display: flex;
230
+ align-items: center;
231
+ justify-content: center;
232
+ }
233
+ .has-video .special-icon-play-button{
234
+ left: 7.4rem;
235
+ }
236
+ }
237
+ </style>
@@ -18,7 +18,7 @@
18
18
  id="miniplayerIframe"
19
19
  title="miniplayer"
20
20
  allowfullscreen="true"
21
- allow="autoplay"
21
+ allow="clipboard-read; clipboard-write; autoplay"
22
22
  referrerpolicy="no-referrer-when-downgrade"
23
23
  :src="iFrameSrc"
24
24
  width="100%"