aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorlonkaars <loek@pipeframe.xyz>2021-05-24 15:23:04 +0200
committerlonkaars <loek@pipeframe.xyz>2021-05-24 15:23:04 +0200
commit7469afab31ebfdd2d447c351d615b7c1d8e42c2e (patch)
tree3555df0abe4c1e207dc48b3657bf903c220e446e
parent79a7317bf18db757d9b9ec38021635c1b4cf31dc (diff)
tool selection and play/skip animation
Diffstat
-rw-r--r--components/play-skip.shapeshifter83
-rw-r--r--components/play-skip.tsx253
-rw-r--r--components/play-skip_60fps.css30
-rw-r--r--package.json1
-rw-r--r--pages/_app.tsx1
-rw-r--r--pages/editor.tsx52
-rw-r--r--pages/present.tsx14
-rw-r--r--styles/editor.css21
-rw-r--r--styles/keyframes.css7
-rw-r--r--yarn.lock176
10 files changed, 525 insertions, 113 deletions
diff --git a/components/play-skip.shapeshifter b/components/play-skip.shapeshifter
new file mode 100644
index 0000000..2bd84a1
--- /dev/null
+++ b/components/play-skip.shapeshifter
@@ -0,0 +1,83 @@
+{
+ "version": 1,
+ "layers": {
+ "vectorLayer": {
+ "id": "76",
+ "name": "vector",
+ "type": "vector",
+ "width": 24,
+ "height": 24,
+ "children": [
+ {
+ "id": "24",
+ "name": "bottom",
+ "type": "path",
+ "pathData": "M 16.8 11.4 C 17.131 11.842 17.042 12.469 16.6 12.8 L 12.6 15.8 C 12.158 16.131 11.531 16.042 11.2 15.6 C 10.869 15.158 10.958 14.531 11.4 14.2 L 15.4 11.2 C 15.842 10.869 16.469 10.958 16.8 11.4 Z",
+ "fillColor": "#ffffff",
+ "strokeWidth": 1,
+ "fillType": "evenOdd"
+ },
+ {
+ "id": "46",
+ "name": "top",
+ "type": "path",
+ "pathData": "M 11.2 8.4 C 11.531 7.958 12.158 7.869 12.6 8.2 L 16.6 11.2 C 17.042 11.531 17.131 12.158 16.8 12.6 C 16.469 13.042 15.842 13.131 15.4 12.8 L 11.4 9.8 C 10.958 9.469 10.869 8.842 11.2 8.4 Z",
+ "fillColor": "#ffffff",
+ "strokeWidth": 1,
+ "fillType": "evenOdd"
+ },
+ {
+ "id": "74",
+ "name": "triangle",
+ "type": "path",
+ "pathData": "M 9.187 17.886 L 17.573 12.761 C 17.838 12.599 18 12.311 18 12 C 18 11.689 17.838 11.401 17.573 11.239 L 9.187 6.114 C 9.065 6.04 8.924 6 8.78 6 C 8.349 6 8 6.349 8 6.78 L 8 17.22 C 8 17.651 8.349 18 8.78 18 C 8.924 18 9.065 17.96 9.187 17.886 Z",
+ "fillColor": "#ffffff",
+ "strokeWidth": 1
+ }
+ ]
+ },
+ "hiddenLayerIds": []
+ },
+ "timeline": {
+ "animation": {
+ "id": "2",
+ "name": "anim",
+ "duration": 300,
+ "blocks": [
+ {
+ "id": "164",
+ "layerId": "24",
+ "propertyName": "pathData",
+ "startTime": 0,
+ "endTime": 300,
+ "interpolator": "FAST_OUT_SLOW_IN",
+ "type": "path",
+ "fromValue": "M 16.8 11.4 C 17.131 11.842 17.042 12.469 16.6 12.8 L 12.6 15.8 C 12.158 16.131 11.531 16.042 11.2 15.6 C 10.869 15.158 10.958 14.531 11.4 14.2 L 15.4 11.2 C 15.842 10.869 16.469 10.958 16.8 11.4 Z",
+ "toValue": "M 17 11 C 17.552 11 18 11.448 18 12 L 18 17 C 18 17.552 17.552 18 17 18 C 16.448 18 16 17.552 16 17 L 16 12 C 16 11.448 16.448 11 17 11 Z"
+ },
+ {
+ "id": "3557",
+ "layerId": "46",
+ "propertyName": "pathData",
+ "startTime": 0,
+ "endTime": 300,
+ "interpolator": "FAST_OUT_SLOW_IN",
+ "type": "path",
+ "fromValue": "M 11.2 8.4 C 11.531 7.958 12.158 7.869 12.6 8.2 L 16.6 11.2 C 17.042 11.531 17.131 12.158 16.8 12.6 C 16.469 13.042 15.842 13.131 15.4 12.8 L 11.4 9.8 C 10.958 9.469 10.869 8.842 11.2 8.4 Z",
+ "toValue": "M 17 6 C 17.552 6 18 6.448 18 7 L 18 12 C 18 12.552 17.552 13 17 13 C 16.448 13 16 12.552 16 12 L 16 7 C 16 6.448 16.448 6 17 6 Z"
+ },
+ {
+ "id": "6889",
+ "layerId": "74",
+ "propertyName": "pathData",
+ "startTime": 0,
+ "endTime": 300,
+ "interpolator": "FAST_OUT_SLOW_IN",
+ "type": "path",
+ "fromValue": "M 9.187 17.886 L 17.573 12.761 C 17.838 12.599 18 12.311 18 12 C 18 11.689 17.838 11.401 17.573 11.239 L 9.187 6.114 C 9.065 6.04 8.924 6 8.78 6 C 8.349 6 8 6.349 8 6.78 L 8 17.22 C 8 17.651 8.349 18 8.78 18 C 8.924 18 9.065 17.96 9.187 17.886 Z",
+ "toValue": "M 7.191 16.877 L 13.579 12.77 C 13.841 12.602 14 12.312 14 12 C 14 11.688 13.841 11.398 13.579 11.23 L 7.191 7.123 C 7.066 7.043 6.921 7 6.773 7 C 6.346 7 6 7.346 6 7.773 L 6 16.227 C 6 16.654 6.346 17 6.773 17 C 6.921 17 7.066 16.957 7.191 16.877 Z"
+ }
+ ]
+ }
+ }
+} \ No newline at end of file
diff --git a/components/play-skip.tsx b/components/play-skip.tsx
new file mode 100644
index 0000000..8493710
--- /dev/null
+++ b/components/play-skip.tsx
@@ -0,0 +1,253 @@
+export default function PlaySkipIconAni() {
+ return <div className='shapeshifter play-pause ani'>
+ <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 456 24' width='456' height='24'>
+ <g>
+ <path
+ d='M16.8 11.4c.331.442.242 1.069-.2 1.4l-4 3c-.442.331-1.069.242-1.4-.2-.331-.442-.242-1.069.2-1.4l4-3c.442-.331 1.069-.242 1.4.2z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M11.2 8.4c.331-.442.958-.531 1.4-.2l4 3c.442.331.531.958.2 1.4-.331.442-.958.531-1.4.2l-4-3c-.442-.331-.531-.958-.2-1.4z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M9.187 17.886l8.386-5.125c.265-.162.427-.45.427-.761s-.162-.599-.427-.761L9.187 6.114C9.065 6.04 8.924 6 8.78 6c-.431 0-.78.349-.78.78v10.44c0 .431.349.78.78.78.144 0 .285-.04.407-.114z'
+ />
+ </g>
+ <g>
+ <path
+ d='M40.801 11.397c.333.439.248 1.065-.191 1.397l-3.971 3.015c-.439.332-1.065.247-1.397-.192-.333-.439-.248-1.064.191-1.397l3.971-3.014c.439-.333 1.065-.248 1.397.191z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M35.242 8.383c.332-.439.958-.524 1.397-.192l3.971 3.015c.439.332.524.958.191 1.397-.332.439-.958.524-1.397.191L35.433 9.78c-.439-.333-.524-.958-.191-1.397z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M33.173 17.879l8.371-5.118c.265-.162.427-.45.427-.761s-.162-.599-.427-.761l-8.371-5.118c-.122-.074-.263-.114-.407-.114-.431 0-.78.349-.78.78v10.426c0 .431.349.78.78.78.144 0 .285-.04.407-.114z'
+ />
+ </g>
+ <g>
+ <path
+ d='M64.807 11.387c.338.427.266 1.049-.161 1.387l-3.869 3.065c-.427.339-1.049.267-1.387-.16-.338-.428-.267-1.049.161-1.387l3.869-3.066c.427-.338 1.048-.267 1.387.161z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M59.39 8.321c.338-.427.96-.499 1.387-.16l3.869 3.065c.427.338.499.96.161 1.387-.339.428-.96.499-1.387.161l-3.869-3.066c-.428-.338-.499-.959-.161-1.387z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M57.122 17.853l8.32-5.092c.265-.162.427-.45.427-.761s-.162-.599-.427-.761l-8.32-5.092c-.123-.074-.264-.114-.408-.114-.431 0-.78.349-.78.78v10.374c0 .431.349.78.78.78.144 0 .285-.04.408-.114z'
+ />
+ </g>
+ <g>
+ <path
+ d='M88.817 11.366c.35.404.307 1.016-.098 1.366l-3.659 3.17c-.405.35-1.017.307-1.366-.098-.35-.404-.307-1.016.097-1.366l3.66-3.17c.404-.35 1.016-.306 1.366.098z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M83.694 8.196c.349-.405.961-.448 1.366-.098l3.659 3.17c.405.35.448.962.098 1.366-.35.404-.962.448-1.366.098l-3.66-3.17c-.404-.35-.447-.962-.097-1.366z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M81.017 17.8l8.216-5.038c.265-.163.427-.451.427-.762s-.162-.599-.427-.762L81.017 6.2c-.122-.075-.263-.115-.408-.115-.43 0-.779.349-.779.78v10.27c0 .431.349.78.779.78.145 0 .286-.04.408-.115z'
+ />
+ </g>
+ <g>
+ <path
+ d='M112.835 11.33c.37.365.375.96.01 1.33l-3.299 3.35c-.365.37-.96.375-1.33.01-.37-.364-.375-.96-.01-1.33l3.299-3.35c.365-.37.96-.375 1.33-.01z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M108.216 7.98c.37-.365.965-.36 1.33.01l3.299 3.35c.365.37.36.965-.01 1.33-.37.365-.965.36-1.33-.01l-3.299-3.35c-.365-.37-.36-.966.01-1.33z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M104.837 17.709l8.036-4.946c.265-.163.426-.452.426-.763s-.161-.6-.426-.763l-8.036-4.946c-.122-.075-.264-.116-.409-.116-.43 0-.778.349-.778.779v10.092c0 .43.348.779.778.779.145 0 .287-.041.409-.116z'
+ />
+ </g>
+ <g>
+ <path
+ d='M136.861 11.277c.399.306.475.878.169 1.277l-2.771 3.615c-.307.398-.879.474-1.278.168-.398-.306-.474-.878-.168-1.277l2.771-3.614c.307-.399.879-.475 1.277-.169z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M132.981 7.663c.399-.306.971-.23 1.278.168l2.771 3.615c.306.399.23.971-.169 1.277-.398.306-.97.23-1.277-.169l-2.771-3.614c-.306-.399-.23-.971.168-1.277z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M128.574 17.576l7.772-4.812c.264-.164.425-.453.425-.764s-.161-.6-.425-.764l-7.772-4.812c-.123-.076-.265-.117-.41-.117-.43 0-.778.348-.778.778v9.83c0 .43.348.778.778.778.145 0 .287-.041.41-.117z'
+ />
+ </g>
+ <g>
+ <path
+ d='M160.891 11.217c.433.24.589.785.349 1.217l-2.171 3.915c-.24.432-.785.588-1.217.348-.432-.239-.589-.785-.349-1.217l2.171-3.914c.24-.432.785-.589 1.217-.349z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M157.852 7.303c.432-.24.977-.084 1.217.348l2.171 3.915c.24.432.084.977-.349 1.217-.432.24-.977.083-1.217-.349l-2.171-3.914c-.24-.432-.083-.978.349-1.217z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M152.274 17.425l7.473-4.66c.263-.165.424-.454.424-.765s-.161-.6-.424-.765l-7.473-4.66c-.123-.076-.266-.118-.412-.118-.429 0-.777.348-.777.777v9.532c0 .429.348.777.777.777.146 0 .289-.042.412-.118z'
+ />
+ </g>
+ <g>
+ <path
+ d='M184.918 11.164c.462.181.69.702.509 1.164l-1.639 4.18c-.181.462-.702.69-1.164.509-.461-.181-.689-.702-.508-1.164l1.638-4.181c.181-.461.703-.689 1.164-.508z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M182.624 6.983c.462-.181.983.047 1.164.509l1.639 4.18c.181.462-.047.983-.509 1.164-.461.181-.983-.047-1.164-.508l-1.638-4.181c-.181-.462.047-.983.508-1.164z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M176.009 17.29l7.206-4.524c.263-.165.423-.454.423-.766s-.16-.601-.423-.766l-7.206-4.524c-.124-.078-.268-.12-.414-.12-.429 0-.776.348-.776.776v9.268c0 .428.347.776.776.776.146 0 .29-.042.414-.12z'
+ />
+ </g>
+ <g>
+ <path
+ d='M208.939 11.122c.485.135.769.637.634 1.122l-1.219 4.39c-.134.485-.637.769-1.122.635-.484-.135-.769-.638-.634-1.122l1.219-4.391c.135-.484.637-.769 1.122-.634z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M207.232 6.731c.485-.134.988.15 1.122.635l1.219 4.39c.135.485-.149.987-.634 1.122-.485.135-.987-.15-1.122-.634l-1.219-4.391c-.135-.484.15-.987.634-1.122z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M199.799 17.185l6.997-4.418c.263-.166.423-.455.423-.767s-.16-.601-.423-.767l-6.997-4.418c-.124-.078-.268-.12-.414-.12-.429 0-.775.347-.775.775v9.06c0 .428.346.775.775.775.146 0 .29-.042.414-.12z'
+ />
+ </g>
+ <g>
+ <path
+ d='M232.955 11.09c.503.099.83.587.731 1.09l-.898 4.551c-.099.502-.587.83-1.09.73-.502-.099-.83-.587-.73-1.089l.897-4.552c.1-.502.588-.829 1.09-.73z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M231.698 6.539c.503-.1.991.228 1.09.73l.898 4.551c.099.503-.228.991-.731 1.09-.502.099-.99-.228-1.09-.73l-.897-4.552c-.1-.502.228-.99.73-1.089z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M223.639 17.103l6.836-4.335c.263-.167.423-.456.423-.768s-.16-.601-.423-.768l-6.836-4.335c-.124-.079-.268-.121-.416-.121-.427 0-.774.346-.774.774v8.9c0 .428.347.774.774.774.148 0 .292-.042.416-.121z'
+ />
+ </g>
+ <g>
+ <path
+ d='M256.967 11.065c.516.072.877.549.805 1.065l-.651 4.675c-.072.516-.55.876-1.066.804-.516-.072-.876-.549-.804-1.065l.651-4.674c.072-.516.549-.877 1.065-.805z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M256.055 6.391c.516-.072.994.288 1.066.804l.651 4.675c.072.516-.289.993-.805 1.065-.516.072-.993-.289-1.065-.805l-.651-4.674c-.072-.516.288-.993.804-1.065z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M247.516 17.041l6.713-4.272c.263-.167.422-.457.422-.769s-.159-.602-.422-.769l-6.713-4.272c-.124-.079-.269-.122-.416-.122-.428 0-.774.347-.774.774v8.778c0 .427.346.774.774.774.147 0 .292-.043.416-.122z'
+ />
+ </g>
+ <g>
+ <path
+ d='M280.977 11.046c.526.051.912.52.861 1.046l-.462 4.769c-.051.527-.52.913-1.046.862-.527-.051-.913-.52-.861-1.046l.462-4.769c.051-.527.519-.913 1.046-.862z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M280.33 6.277c.526-.051.995.335 1.046.862l.462 4.769c.051.526-.335.995-.861 1.046-.527.051-.995-.335-1.046-.862l-.462-4.769c-.052-.526.334-.995.861-1.046z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M271.422 16.994l6.618-4.225c.263-.167.422-.457.422-.769s-.159-.602-.422-.769l-6.618-4.225c-.125-.079-.27-.122-.417-.122-.428 0-.774.347-.774.774v8.684c0 .427.346.774.774.774.147 0 .292-.043.417-.122z'
+ />
+ </g>
+ <g>
+ <path
+ d='M304.984 11.032c.535.035.94.497.905 1.031l-.317 4.842c-.035.534-.497.94-1.032.905-.534-.035-.939-.497-.904-1.032l.316-4.841c.035-.535.498-.94 1.032-.905z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M304.54 6.19c.535-.035.997.371 1.032.905l.317 4.842c.035.534-.37.996-.905 1.031-.534.035-.997-.37-1.032-.905l-.316-4.841c-.035-.535.37-.997.904-1.032z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M295.349 16.957l6.546-4.188c.263-.167.422-.457.422-.769s-.159-.602-.422-.769l-6.546-4.188c-.125-.079-.269-.122-.417-.122-.427 0-.774.346-.774.773v8.612c0 .427.347.773.774.773.148 0 .292-.043.417-.122z'
+ />
+ </g>
+ <g>
+ <path
+ d='M328.99 11.021c.54.023.961.48.938 1.02l-.207 4.897c-.023.541-.48.961-1.021.938-.54-.023-.96-.48-.938-1.021l.207-4.896c.023-.541.48-.961 1.021-.938z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M328.7 6.124c.541-.023.998.397 1.021.938l.207 4.897c.023.54-.398.997-.938 1.02-.541.023-.998-.397-1.021-.938l-.207-4.896c-.022-.541.398-.998.938-1.021z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M319.294 16.929l6.491-4.159c.262-.168.422-.458.422-.77s-.16-.602-.422-.77l-6.491-4.159c-.125-.08-.27-.123-.417-.123-.428 0-.774.346-.774.774v8.556c0 .428.346.774.774.774.147 0 .292-.043.417-.123z'
+ />
+ </g>
+ <g>
+ <path
+ d='M352.994 11.012c.545.014.976.468.962 1.013l-.125 4.938c-.013.545-.467.976-1.012.962-.545-.014-.976-.467-.963-1.012l.125-4.938c.014-.545.468-.976 1.013-.963z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M352.819 6.075c.545-.014.999.417 1.012.962l.125 4.938c.014.545-.417.999-.962 1.013-.545.013-.999-.418-1.013-.963l-.125-4.938c-.013-.545.418-.998.963-1.012z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M343.253 16.908l6.451-4.138c.262-.168.421-.458.421-.77s-.159-.602-.421-.77l-6.451-4.138c-.125-.08-.269-.123-.417-.123-.427 0-.774.346-.774.773v8.516c0 .427.347.773.774.773.148 0 .292-.043.417-.123z'
+ />
+ </g>
+ <g>
+ <path
+ d='M376.997 11.007c.548.007.987.458.98 1.006l-.067 4.967c-.007.548-.458.987-1.007.98-.548-.007-.987-.458-.98-1.007l.067-4.966c.007-.549.458-.988 1.007-.98z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M376.903 6.04c.549-.007 1 .432 1.007.98l.067 4.967c.007.548-.432.999-.98 1.006-.549.008-1-.431-1.007-.98l-.067-4.966c-.007-.549.432-1 .98-1.007z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M367.224 16.894l6.421-4.124c.263-.168.422-.458.422-.77s-.159-.602-.422-.77l-6.421-4.124c-.125-.08-.27-.123-.418-.123-.427 0-.773.346-.773.773v8.488c0 .427.346.773.773.773.148 0 .293-.043.418-.123z'
+ />
+ </g>
+ <g>
+ <path
+ d='M400.999 11.003c.55.003.994.452.991 1.003l-.028 4.986c-.003.55-.452.994-1.003.991-.55-.003-.994-.452-.991-1.003l.028-4.986c.003-.55.452-.994 1.003-.991z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M400.959 6.017c.551-.003 1 .441 1.003.991l.028 4.986c.003.551-.441 1-.991 1.003-.551.003-1-.441-1.003-.991l-.028-4.986c-.003-.551.441-1 .991-1.003z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M391.205 16.884l6.402-4.114c.262-.168.421-.458.421-.77s-.159-.602-.421-.77l-6.402-4.114c-.125-.08-.27-.123-.418-.123-.427 0-.773.346-.773.773v8.468c0 .427.346.773.773.773.148 0 .293-.043.418-.123z'
+ />
+ </g>
+ <g>
+ <path
+ d='M425 11.001c.551 0 .998.449.998 1l-.007 4.997c-.001.552-.449.999-1.001.998-.551-.001-.998-.449-.998-1.001l.007-4.996c.001-.552.449-.999 1.001-.998z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M424.99 6.004c.552-.001 1 .446 1.001.998l.007 4.997c0 .551-.447 1-.998 1-.552.001-1-.446-1.001-.998l-.007-4.996c0-.552.447-1 .998-1.001z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M415.194 16.879l6.392-4.109c.262-.168.421-.458.421-.77s-.159-.602-.421-.77l-6.392-4.109c-.125-.08-.27-.123-.418-.123-.427 0-.773.346-.773.773v8.458c0 .427.346.773.773.773.148 0 .293-.043.418-.123z'
+ />
+ </g>
+ <g>
+ <path
+ d='M449 11c.552 0 1 .448 1 1v5c0 .552-.448 1-1 1s-1-.448-1-1v-5c0-.552.448-1 1-1z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M449 6c.552 0 1 .448 1 1v5c0 .552-.448 1-1 1s-1-.448-1-1V7c0-.552.448-1 1-1z'
+ fill-rule='evenodd'
+ />
+ <path
+ d='M439.191 16.877l6.388-4.107c.262-.168.421-.458.421-.77s-.159-.602-.421-.77l-6.388-4.107c-.125-.08-.27-.123-.418-.123-.427 0-.773.346-.773.773v8.454c0 .427.346.773.773.773.148 0 .293-.043.418-.123z'
+ />
+ </g>
+ </svg>
+ </div>;
+}
diff --git a/components/play-skip_60fps.css b/components/play-skip_60fps.css
new file mode 100644
index 0000000..aae3a65
--- /dev/null
+++ b/components/play-skip_60fps.css
@@ -0,0 +1,30 @@
+@keyframes skip {
+ 0% { left: 0px; }
+ 100% { left: -432px; }
+}
+
+@keyframes play {
+ 0% { left: -432px; }
+ 100% { left: 0px; }
+}
+
+.shapeshifter {
+ width: 24px;
+ height: 24px;
+ overflow: hidden;
+ position: relative;
+ line-height: 0;
+}
+
+.shapeshifter svg {
+ position: absolute;
+ fill: currentColor;
+ left: 0;
+
+ animation-name: var(--ani-state);
+ animation-fill-mode: both;
+ animation-duration: 200ms;
+ animation-timing-function: steps(18);
+ animation-play-state: running;
+}
+
diff --git a/package.json b/package.json
index e54d8a8..a8438b3 100644
--- a/package.json
+++ b/package.json
@@ -10,6 +10,7 @@
"dependencies": {
"@material-ui/core": "^4.11.4",
"@material-ui/icons": "^4.11.2",
+ "@material-ui/lab": "^4.0.0-alpha.58",
"@mdi/js": "^5.9.55",
"@mdi/react": "^1.5.0",
"ajv": "^8.3.0",
diff --git a/pages/_app.tsx b/pages/_app.tsx
index 7bb0076..96182ab 100644
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@@ -1,5 +1,6 @@
import Head from 'next/head';
+import '../components/play-skip_60fps.css';
import '../styles/colors.css';
import '../styles/editor.css';
import '../styles/globals.css';
diff --git a/pages/editor.tsx b/pages/editor.tsx
index 3313e31..2deb6f5 100644
--- a/pages/editor.tsx
+++ b/pages/editor.tsx
@@ -7,21 +7,22 @@ import { TimedVideoPlayer } from './present';
import AppBar from '@material-ui/core/AppBar';
import Button from '@material-ui/core/Button';
-import ButtonGroup from '@material-ui/core/ButtonGroup';
import Fab from '@material-ui/core/Fab';
import Slider from '@material-ui/core/Slider';
import Toolbar from '@material-ui/core/Toolbar';
import ZoomInRoundedIcon from '@material-ui/icons/ZoomInRounded';
import ZoomOutRoundedIcon from '@material-ui/icons/ZoomOutRounded';
+import ToggleButton from '@material-ui/lab/ToggleButton';
+import ToggleButtonGroup from '@material-ui/lab/ToggleButtonGroup';
import Icon from '@mdi/react';
import FullscreenRoundedIcon from '@material-ui/icons/FullscreenRounded';
import NavigateBeforeRoundedIcon from '@material-ui/icons/NavigateBeforeRounded';
import NavigateNextRoundedIcon from '@material-ui/icons/NavigateNextRounded';
-import PauseRoundedIcon from '@material-ui/icons/PauseRounded';
import SkipPreviousRoundedIcon from '@material-ui/icons/SkipPreviousRounded';
import { mdiCursorDefault } from '@mdi/js';
import { PressureIcon, SlideKeyframe } from '../components/icons';
+import PlaySkipIconAni from '../components/play-skip';
var player = new TimedVideoPlayer();
var useWorkingTimeline = create(set => ({
@@ -187,9 +188,9 @@ function TimelineEditor(props: { player: TimedVideoPlayer; }) {
useEffect(() => {
props.player.addEventListener('TimedVideoPlayerSlide', (event: CustomEvent) => {
- document.querySelectorAll('.keyframes .keyframeWrapper').forEach(el => {
+ document.querySelectorAll('.keyframes .frame').forEach(el => {
el.classList.remove('current');
- if (el.classList.contains(`keyframe-index-${event.detail}`)) {
+ if (event.detail && el.id == 'slide-' + (event.detail as slide).id) {
el.classList.add('current');
}
});
@@ -337,6 +338,10 @@ export default function Index() {
var frame = useFrame((st: any) => st.currentFrame);
+ var [tool, setTool] = useState('cursor');
+
+ var [playing, setPlaying] = useState(false);
+
var mouseX = 0;
// var mouseY = 0;
@@ -400,6 +405,9 @@ export default function Index() {
var reader = new FileReader();
reader.addEventListener('load', ev => {
player.loadVideo(ev.target.result as string);
+
+ player.player.addEventListener('play', () => setPlaying(true));
+ player.player.addEventListener('pause', () => setPlaying(false));
});
reader.readAsDataURL(file);
}}
@@ -462,8 +470,9 @@ export default function Index() {
<Fab
className='playPause'
size='medium'
- children={<PauseRoundedIcon />}
onClick={() => player.next()}
+ children={<PlaySkipIconAni />}
+ style={{ '--ani-state': playing ? 'skip' : 'play' } as CSSProperties}
/>
<Fab size='small' children={<NavigateBeforeRoundedIcon />} onClick={() => player.previous()} />
<Fab size='small' children={<NavigateNextRoundedIcon />} />
@@ -478,22 +487,27 @@ export default function Index() {
<span className='framerate numbers posabs l0 t0'>@{player.framerate}fps</span>
<h2 className='timecode numbers posabs r0 t0'>{player.frameToTimestampString(frame, false)}</h2>
</div>
- <ButtonGroup color='primary' aria-label='outlined primary button group'>
- <Button children={<Icon path={mdiCursorDefault} size={1} />} />
- <Button children={<SlideKeyframe type='default' />} />
- <Button children={<SlideKeyframe type='delay' />} />
- <Button children={<SlideKeyframe type='speedChange' />} />
- <Button>
+ <ToggleButtonGroup
+ color='primary'
+ aria-label='outlined primary button group'
+ value={tool}
+ exclusive
+ onChange={(_event: any, newTool: string | null) => {
+ if (newTool === null) return;
+ setTool(newTool);
+ }}
+ >
+ <ToggleButton value='cursor' children={<Icon path={mdiCursorDefault} size={1} />} />
+ <ToggleButton value='default' children={<SlideKeyframe type='default' />} />
+ <ToggleButton value='delay' children={<SlideKeyframe type='delay' />} />
+ <ToggleButton value='speedChange' children={<SlideKeyframe type='speedChange' />} />
+ <ToggleButton value='loop'>
<div className='loopStartEnd'>
- <span className='posabs start'>
- <SlideKeyframe type='loop' />
- </span>
- <span className='posabs end'>
- <SlideKeyframe type='loop' loopEnd />
- </span>
+ <span className='posabs start' children={<SlideKeyframe type='loop' />} />
+ <span className='posabs end' children={<SlideKeyframe type='loop' loopEnd />} />
</div>
- </Button>
- </ButtonGroup>
+ </ToggleButton>
+ </ToggleButtonGroup>
<div className='zoom'>
<ZoomOutRoundedIcon />
<div className='spacing'>
diff --git a/pages/present.tsx b/pages/present.tsx
index 9769577..2ad8f72 100644
--- a/pages/present.tsx
+++ b/pages/present.tsx
@@ -89,7 +89,7 @@ export class TimedVideoPlayer {
case 'delay': {
this.player.playbackRate = 0;
this.slide++;
- var event = new CustomEvent('TimedVideoPlayerSlide', { detail: this.slide });
+ var event = new CustomEvent('TimedVideoPlayerSlide', { detail: this.timeline.slides[this.slide] });
this.dispatchEvent(event);
setTimeout(() => {
this.player.playbackRate = this.getPlaybackSpeed(this.slide - 1);
@@ -98,7 +98,7 @@ export class TimedVideoPlayer {
}
case 'speedChange': {
this.slide++;
- var event = new CustomEvent('TimedVideoPlayerSlide', { detail: this.slide });
+ var event = new CustomEvent('TimedVideoPlayerSlide', { detail: this.timeline.slides[this.slide] });
this.dispatchEvent(event);
this.player.playbackRate = this.framerate / (slide as speedChangeSlide).newFramerate;
break;
@@ -189,10 +189,10 @@ export class TimedVideoPlayer {
if (!this.registeredEventListeners) return;
this.slide++;
- var event = new CustomEvent('TimedVideoPlayerSlide', { detail: this.slide });
- this.dispatchEvent(event);
var slide = this.timeline.slides[this.slide];
+ var event = new CustomEvent('TimedVideoPlayerSlide', { detail: slide });
+ this.dispatchEvent(event);
if (!this.player.paused && this.frame < slide?.frame) {
this.skip();
@@ -206,12 +206,12 @@ export class TimedVideoPlayer {
this.slide = Math.max(this.slide - 1, -1);
- var event = new CustomEvent('TimedVideoPlayerSlide', { detail: this.slide });
- this.dispatchEvent(event);
-
var slide = this.timeline.slides[this.slide];
if (!slide) return;
+ var event = new CustomEvent('TimedVideoPlayerSlide', { detail: slide });
+ this.dispatchEvent(event);
+
this.jumpToSlide(slide);
}
}
diff --git a/styles/editor.css b/styles/editor.css
index 9f1f8e5..1a1a91f 100644
--- a/styles/editor.css
+++ b/styles/editor.css
@@ -50,7 +50,7 @@
color: var(--gruble);
}
-.appGrid .tools .MuiButtonGroup-root,
+.appGrid .tools .MuiToggleButtonGroup-root,
.appGrid .tools .zoom {
margin-top: 8px;
}
@@ -68,7 +68,7 @@
color: var(--gruble);
}
-.appGrid .tools .MuiButtonGroup-root .MuiButton-root {
+.appGrid .tools .MuiToggleButtonGroup-root .MuiToggleButton-root {
border-width: 2px;
padding: 8px;
color: var(--c800);
@@ -76,15 +76,22 @@
margin-right: -1px;
}
-.appGrid .tools .MuiButtonGroup-root .MuiButton-root:first-child {
+.appGrid .tools .MuiToggleButtonGroup-root .MuiToggleButton-root.Mui-selected {
+ color: var(--gruble);
+ background-color: rgba(93, 233, 174, 0.12);
+ border-top-color: #334A5A;
+ border-bottom-color: #334A5A;
+}
+
+.appGrid .tools .MuiToggleButtonGroup-root .MuiToggleButton-root:first-child {
border-radius: 6px 0 0 6px;
}
-.appGrid .tools .MuiButtonGroup-root .MuiButton-root:last-child {
+.appGrid .tools .MuiToggleButtonGroup-root .MuiToggleButton-root:last-child {
border-radius: 0 6px 6px 0;
}
-.appGrid .tools .MuiButtonGroup-root .MuiButton-root .loopStartEnd {
+.appGrid .tools .MuiToggleButtonGroup-root .MuiToggleButton-root .loopStartEnd {
display: inline-block;
white-space: nowrap;
line-height: 0;
@@ -93,8 +100,8 @@
width: 36px;
}
-.appGrid .tools .MuiButtonGroup-root .MuiButton-root .loopStartEnd .start { left: -3px; }
-.appGrid .tools .MuiButtonGroup-root .MuiButton-root .loopStartEnd .end { right: -3px; }
+.appGrid .tools .MuiToggleButtonGroup-root .MuiToggleButton-root .loopStartEnd .start { left: -3px; }
+.appGrid .tools .MuiToggleButtonGroup-root .MuiToggleButton-root .loopStartEnd .end { right: -3px; }
.appGrid .timeline {
grid-column: 2;
diff --git a/styles/keyframes.css b/styles/keyframes.css
index c02698f..49c8e4e 100644
--- a/styles/keyframes.css
+++ b/styles/keyframes.css
@@ -7,9 +7,10 @@
height: 24px;
}
-.appGrid .timeline .keyframes .frame .keyframeWrapper.current { color: var(--piss); }
-.appGrid .timeline .keyframes .frame .keyframeWrapper.current .loop .connector { background-color: var(--piss); }
-.appGrid .timeline .keyframes .frame .keyframeWrapper ,
+.appGrid .timeline .keyframes .frame.current .keyframeWrapper { color: var(--piss); }
+.appGrid .timeline .keyframes .frame.current .keyframeWrapper .loop .connector { background-color: var(--piss); }
+
+.appGrid .timeline .keyframes .frame .keyframeWrapper,
.appGrid .timeline .keyframes .frame .keyframeWrapper .loop .connector {
transition-property: color, background-color;
transition-duration: .2s;
diff --git a/yarn.lock b/yarn.lock
index 7ea142c..ba785de 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -51,10 +51,10 @@
resolved "https://registry.yarnpkg.com/@emotion/hash/-/hash-0.8.0.tgz#bbbff68978fefdbe68ccb533bc8cbe1d1afb5413"
integrity sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==
-"@hapi/accept@5.0.1":
- version "5.0.1"
- resolved "https://registry.yarnpkg.com/@hapi/accept/-/accept-5.0.1.tgz#068553e867f0f63225a506ed74e899441af53e10"
- integrity sha512-fMr4d7zLzsAXo28PRRQPXR1o2Wmu+6z+VY1UzDp0iFo13Twj8WePakwXBiqn3E1aAlTpSNzCXdnnQXFhst8h8Q==
+"@hapi/accept@5.0.2":
+ version "5.0.2"
+ resolved "https://registry.yarnpkg.com/@hapi/accept/-/accept-5.0.2.tgz#ab7043b037e68b722f93f376afb05e85c0699523"
+ integrity sha512-CmzBx/bXUR8451fnZRuZAJRlzgm0Jgu5dltTX/bszmR2lheb9BpyN47Q1RbaGTsvFzn0PXAEs+lXDKfshccYZw==
dependencies:
"@hapi/boom" "9.x.x"
"@hapi/hoek" "9.x.x"
@@ -96,6 +96,17 @@
dependencies:
"@babel/runtime" "^7.4.4"
+"@material-ui/lab@^4.0.0-alpha.58":
+ version "4.0.0-alpha.58"
+ resolved "https://registry.yarnpkg.com/@material-ui/lab/-/lab-4.0.0-alpha.58.tgz#c7ebb66f49863c5acbb20817163737caa299fafc"
+ integrity sha512-GKHlJqLxUeHH3L3dGQ48ZavYrqGOTXkFkiEiuYMAnAvXAZP4rhMIqeHOPXSUQan4Bd8QnafDcpovOSLnadDmKw==
+ dependencies:
+ "@babel/runtime" "^7.4.4"
+ "@material-ui/utils" "^4.11.2"
+ clsx "^1.0.4"
+ prop-types "^15.7.2"
+ react-is "^16.8.0 || ^17.0.0"
+
"@material-ui/styles@^4.11.4":
version "4.11.4"
resolved "https://registry.yarnpkg.com/@material-ui/styles/-/styles-4.11.4.tgz#eb9dfccfcc2d208243d986457dff025497afa00d"
@@ -152,20 +163,20 @@
resolved "https://registry.yarnpkg.com/@mdi/react/-/react-1.5.0.tgz#461d2064ba12d509723bffc95e2f7169a6ac884a"
integrity sha512-NztRgUxSYD+ImaKN94Tg66VVVqXj4SmlDGzZoz48H9riJ+Awha56sfXH2fegw819NWo7KI3oeS1Es0lNQqwr0w==
-"@next/env@10.2.0":
- version "10.2.0"
- resolved "https://registry.yarnpkg.com/@next/env/-/env-10.2.0.tgz#154dbce2efa3ad067ebd20b7d0aa9aed775e7c97"
- integrity sha512-tsWBsn1Rb6hXRaHc/pWMCpZ4Ipkf3OCbZ54ef5ukgIyEvzzGdGFXQshPP2AF7yb+8yMpunWs7vOMZW3e8oPF6A==
+"@next/env@10.2.2":
+ version "10.2.2"
+ resolved "https://registry.yarnpkg.com/@next/env/-/env-10.2.2.tgz#cb61f6c29f349815108184c2f1926ada65458e28"
+ integrity sha512-m0xOpl4F9z7R7Yt2OtJoo6ZUsFPdx+kuvZeoctH7T6lO66DmZL3W6MQDxso/ArkH8VOlDPZgeQVVBPf+I7wflA==
-"@next/polyfill-module@10.2.0":
- version "10.2.0"
- resolved "https://registry.yarnpkg.com/@next/polyfill-module/-/polyfill-module-10.2.0.tgz#61f41110c4b465cc26d113e2054e205df61c3594"
- integrity sha512-Nl3GexIUXsmuggkUqrRFyE/2k7UI44JaVzSywtXEyHzxpZm2a5bdMaWuC89pgLiFDDOqmbqyLAbtwm5lNxa7Eg==
+"@next/polyfill-module@10.2.2":
+ version "10.2.2"
+ resolved "https://registry.yarnpkg.com/@next/polyfill-module/-/polyfill-module-10.2.2.tgz#48d108dd562ed021dd23510c0ffe96badf5f9c04"
+ integrity sha512-0t5Hw1Dr18TWP65qAnakRa8+jza6SAFOz0b2v67s5AVquAwXXlclR4SfUy3ahrRtjCqlbLEE/oFIzCGbyMYfVA==
-"@next/react-dev-overlay@10.2.0":
- version "10.2.0"
- resolved "https://registry.yarnpkg.com/@next/react-dev-overlay/-/react-dev-overlay-10.2.0.tgz#4220121abac7e3404cbaf467784aeecca8be46cf"
- integrity sha512-PRIAoWog41hLN4iJ8dChKp4ysOX0Q8yiNQ/cwzyqEd3EjugkDV5OiKl3mumGKaApJaIra1MX6j1wgQRuLhuWMA==
+"@next/react-dev-overlay@10.2.2":
+ version "10.2.2"
+ resolved "https://registry.yarnpkg.com/@next/react-dev-overlay/-/react-dev-overlay-10.2.2.tgz#88fb5013d3df70bd37b854234c41d884e108a149"
+ integrity sha512-uPslFPWvvZ8AdadGdK2/834UnJy6F+7071/ere6QpN88Ngzqx9lDIhjslEeFLRtpyBst4s1YUdbm69btVPdE5w==
dependencies:
"@babel/code-frame" "7.12.11"
anser "1.4.9"
@@ -179,10 +190,10 @@
stacktrace-parser "0.1.10"
strip-ansi "6.0.0"
-"@next/react-refresh-utils@10.2.0":
- version "10.2.0"
- resolved "https://registry.yarnpkg.com/@next/react-refresh-utils/-/react-refresh-utils-10.2.0.tgz#55953b697769c6647f371bc6bcd865a24e1a22e9"
- integrity sha512-3I31K9B4hEQRl7yQ44Umyz+szHtuMJrNdwsgJGhoEnUCXSBRHp5wv5Zv8eDa2NewSbe53b2C0oOpivrzmdBakw==
+"@next/react-refresh-utils@10.2.2":
+ version "10.2.2"
+ resolved "https://registry.yarnpkg.com/@next/react-refresh-utils/-/react-refresh-utils-10.2.2.tgz#69dd150e3656aebe63fc828916105f1472810488"
+ integrity sha512-OL7r0iz+SiE9SMWcxZocUtEAHv0/TlBWxIE3KjjO1vWSU1r0gMrE2l2RxHfMLIPsl6CjAkcPxoaXlosFsJ2S5w==
"@opentelemetry/api@0.14.0":
version "0.14.0"
@@ -282,9 +293,9 @@
integrity sha512-cxWFQVseBm6O9Gbw1IWb8r6OS4OhSt3hPZLkFApLjM8TEXROBuQGLAH2i2gZpcXdLBIrpXuTDhH7Vbm1iXmNGA==
"@types/node@*":
- version "15.0.2"
- resolved "https://registry.yarnpkg.com/@types/node/-/node-15.0.2.tgz#51e9c0920d1b45936ea04341aa3e2e58d339fb67"
- integrity sha512-p68+a+KoxpoB47015IeYZYRrdqMUcpbK8re/zpFB8Ld46LHC1lPEbp3EXgkEhAYEcPvjJF6ZO+869SQ0aH1dcA==
+ version "15.6.0"
+ resolved "https://registry.yarnpkg.com/@types/node/-/node-15.6.0.tgz#f0ddca5a61e52627c9dcb771a6039d44694597bc"
+ integrity sha512-gCYSfQpy+LYhOFTKAeE8BkyGqaxmlFxe+n4DKM6DR0wzw/HISUE/hAmkC/KT8Sw5PCJblqg062b3z9gucv3k0A==
"@types/prop-types@*":
version "15.7.3"
@@ -299,9 +310,9 @@
"@types/react" "*"
"@types/react@*":
- version "17.0.5"
- resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.5.tgz#3d887570c4489011f75a3fc8f965bf87d09a1bea"
- integrity sha512-bj4biDB9ZJmGAYTWSKJly6bMr4BLUiBrx9ujiJEoP9XIDY9CTaPGxE5QWN/1WjpPLzYF7/jRNnV2nNxNe970sw==
+ version "17.0.6"
+ resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.6.tgz#0ec564566302c562bf497d73219797a5e0297013"
+ integrity sha512-u/TtPoF/hrvb63LdukET6ncaplYsvCvmkceasx8oG84/ZCsoLxz9Z/raPBP4lTAiWW1Jb889Y9svHmv8R26dWw==
dependencies:
"@types/prop-types" "*"
"@types/scheduler" "*"
@@ -313,9 +324,9 @@
integrity sha512-EaCxbanVeyxDRTQBkdLb3Bvl/HK7PBK6UJjsSixB0iHKoWxE5uu2Q/DgtpOhPIojN0Zl1whvOd7PoHs2P0s5eA==
ajv@^8.3.0:
- version "8.3.0"
- resolved "https://registry.yarnpkg.com/ajv/-/ajv-8.3.0.tgz#25ee7348e32cdc4a1dbb38256bf6bdc451dd577c"
- integrity sha512-RYE7B5An83d7eWnDR8kbdaIFqmKCNsP16ay1hDbJEU+sa0e3H9SebskCt0Uufem6cfAVu7Col6ubcn/W+Sm8/Q==
+ version "8.5.0"
+ resolved "https://registry.yarnpkg.com/ajv/-/ajv-8.5.0.tgz#695528274bcb5afc865446aa275484049a18ae4b"
+ integrity sha512-Y2l399Tt1AguU3BPRP9Fn4eN+Or+StUGWCUpbnFyXSo8NZ9S4uj+AG2pjs5apK+ZMOwYOz1+a+VKvKH7CudXgQ==
dependencies:
fast-deep-equal "^3.1.1"
json-schema-traverse "^1.0.0"
@@ -354,10 +365,16 @@ anymatch@~3.1.1:
normalize-path "^3.0.0"
picomatch "^2.0.4"
-array-filter@^1.0.0:
+array.prototype.filter@^1.0.0:
version "1.0.0"
- resolved "https://registry.yarnpkg.com/array-filter/-/array-filter-1.0.0.tgz#baf79e62e6ef4c2a4c0b831232daffec251f9d83"
- integrity sha1-uveeYubvTCpMC4MSMtr/7CUfnYM=
+ resolved "https://registry.yarnpkg.com/array.prototype.filter/-/array.prototype.filter-1.0.0.tgz#24d63e38983cdc6bf023a3c574b2f2a3f384c301"
+ integrity sha512-TfO1gz+tLm+Bswq0FBOXPqAchtCr2Rn48T8dLJoRFl8NoEosjZmzptmuo1X8aZBzZcqsR1W8U761tjACJtngTQ==
+ dependencies:
+ call-bind "^1.0.2"
+ define-properties "^1.1.3"
+ es-abstract "^1.18.0"
+ es-array-method-boxes-properly "^1.0.0"
+ is-string "^1.0.5"
asn1.js@^5.2.0:
version "5.4.1"
@@ -393,11 +410,11 @@ ast-types@0.13.2:
integrity sha512-uWMHxJxtfj/1oZClOxDEV1sQ1HCDkA4MG8Gr69KKeBjEVH0R84WlejZ0y2DcwyBlpAEMltmVYkVgqfLFb2oyiA==
available-typed-arrays@^1.0.2:
- version "1.0.2"
- resolved "https://registry.yarnpkg.com/available-typed-arrays/-/available-typed-arrays-1.0.2.tgz#6b098ca9d8039079ee3f77f7b783c4480ba513f5"
- integrity sha512-XWX3OX8Onv97LMk/ftVyBibpGwY5a8SmuxZPzeOxqmuEqUCOM9ZE+uIaD1VNJ5QnvU2UQusvmKbuM1FR8QWGfQ==
+ version "1.0.3"
+ resolved "https://registry.yarnpkg.com/available-typed-arrays/-/available-typed-arrays-1.0.3.tgz#fb7d02445bfedefad79fad1fe47931163a227198"
+ integrity sha512-CuPhFULixV/d89POo1UG4GqGbR7dmrefY2ZdmsYakeR4gOSJXoF7tfeaiqMHGOMrlTiJoeEs87fpLsBYmE2BMw==
dependencies:
- array-filter "^1.0.0"
+ array.prototype.filter "^1.0.0"
babel-plugin-syntax-jsx@6.18.0:
version "6.18.0"
@@ -515,16 +532,16 @@ browserify-zlib@0.2.0, browserify-zlib@^0.2.0:
dependencies:
pako "~1.0.5"
-browserslist@4.16.1:
- version "4.16.1"
- resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.16.1.tgz#bf757a2da376b3447b800a16f0f1c96358138766"
- integrity sha512-UXhDrwqsNcpTYJBTZsbGATDxZbiVDsx6UjpmRUmtnP10pr8wAYr5LgFoEFw9ixriQH2mv/NX2SfGzE/o8GndLA==
+browserslist@4.16.6:
+ version "4.16.6"
+ resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.16.6.tgz#d7901277a5a88e554ed305b183ec9b0c08f66fa2"
+ integrity sha512-Wspk/PqO+4W9qp5iUTJsa1B/QrYn1keNCcEP5OvP7WBwT4KaDly0uONYmC6Xa3Z5IqnUgS0KcgLYu1l74x0ZXQ==
dependencies:
- caniuse-lite "^1.0.30001173"
- colorette "^1.2.1"
- electron-to-chromium "^1.3.634"
+ caniuse-lite "^1.0.30001219"
+ colorette "^1.2.2"
+ electron-to-chromium "^1.3.723"
escalade "^3.1.1"
- node-releases "^1.1.69"
+ node-releases "^1.1.71"
buffer-xor@^1.0.3:
version "1.0.3"
@@ -566,10 +583,10 @@ call-bind@^1.0.0, call-bind@^1.0.2:
function-bind "^1.1.1"
get-intrinsic "^1.0.2"
-caniuse-lite@^1.0.30001173, caniuse-lite@^1.0.30001179, caniuse-lite@^1.0.30001202:
- version "1.0.30001223"
- resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001223.tgz#39b49ff0bfb3ee3587000d2f66c47addc6e14443"
- integrity sha512-k/RYs6zc/fjbxTjaWZemeSmOjO0JJV+KguOBA3NwPup8uzxM1cMhR2BD9XmO86GuqaqTCO8CgkgH9Rz//vdDiA==
+caniuse-lite@^1.0.30001202, caniuse-lite@^1.0.30001219, caniuse-lite@^1.0.30001228:
+ version "1.0.30001228"
+ resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001228.tgz#bfdc5942cd3326fa51ee0b42fbef4da9d492a7fa"
+ integrity sha512-QQmLOGJ3DEgokHbMSA8cj2a+geXqmnpyOFT0lhQV6P3/YOJvGDEwoedcwxEQ30gJIwIIunHIicunJ2rzK5gB2A==
chalk@2.4.2, chalk@^2.0.0:
version "2.4.2"
@@ -645,7 +662,7 @@ color-name@~1.1.4:
resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.4.tgz#c2a09a87acbde69543de6f63fa3995c826c536a2"
integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==
-colorette@^1.2.1, colorette@^1.2.2:
+colorette@^1.2.2:
version "1.2.2"
resolved "https://registry.yarnpkg.com/colorette/-/colorette-1.2.2.tgz#cbcc79d5e99caea2dbf10eb3a26fd8b3e6acfa94"
integrity sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==
@@ -831,10 +848,10 @@ domain-browser@^1.1.1:
resolved "https://registry.yarnpkg.com/domain-browser/-/domain-browser-1.2.0.tgz#3d31f50191a6749dd1375a7f522e823d42e54eda"
integrity sha512-jnjyiM6eRyZl2H+W8Q/zLMA481hzi0eszAaBUzIVnmYVDBbnLxVNnfu1HgEBvCbL+71FrxMl3E6lpKH7Ge3OXA==
-electron-to-chromium@^1.3.634:
- version "1.3.727"
- resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.727.tgz#857e310ca00f0b75da4e1db6ff0e073cc4a91ddf"
- integrity sha512-Mfz4FIB4FSvEwBpDfdipRIrwd6uo8gUDoRDF4QEYb4h4tSuI3ov594OrjU6on042UlFHouIJpClDODGkPcBSbg==
+electron-to-chromium@^1.3.723:
+ version "1.3.736"
+ resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.736.tgz#f632d900a1f788dab22fec9c62ec5c9c8f0c4052"
+ integrity sha512-DY8dA7gR51MSo66DqitEQoUMQ0Z+A2DSXFi7tK304bdTVqczCAfUuyQw6Wdg8hIoo5zIxkU1L24RQtUce1Ioig==
elliptic@^6.5.3:
version "6.5.4"
@@ -861,7 +878,7 @@ encoding@0.1.13:
dependencies:
iconv-lite "^0.6.2"
-es-abstract@^1.18.0-next.1, es-abstract@^1.18.0-next.2:
+es-abstract@^1.18.0, es-abstract@^1.18.0-next.1, es-abstract@^1.18.0-next.2:
version "1.18.0"
resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.18.0.tgz#ab80b359eecb7ede4c298000390bc5ac3ec7b5a4"
integrity sha512-LJzK7MrQa8TS0ja2w3YNLzUgJCGPdPOV1yVvezjNnS89D+VR08+Szt2mz3YB2Dck/+w5tfIq/RoUAFqJJGM2yw==
@@ -883,6 +900,11 @@ es-abstract@^1.18.0-next.1, es-abstract@^1.18.0-next.2:
string.prototype.trimstart "^1.0.4"
unbox-primitive "^1.0.0"
+es-array-method-boxes-properly@^1.0.0:
+ version "1.0.0"
+ resolved "https://registry.yarnpkg.com/es-array-method-boxes-properly/-/es-array-method-boxes-properly-1.0.0.tgz#873f3e84418de4ee19c5be752990b2e44718d09e"
+ integrity sha512-wd6JXUmyHmt8T5a2xreUwKcGPq6f1f+WwIJkijUqiGcJz1qqnZgP6XIK+QyIWU5lT7imeNxUll48bziG+TSYcA==
+
es-to-primitive@^1.2.1:
version "1.2.1"
resolved "https://registry.yarnpkg.com/es-to-primitive/-/es-to-primitive-1.2.1.tgz#e55cd4c9cdc188bcefb03b366c736323fc5c898a"
@@ -1123,9 +1145,9 @@ iconv-lite@0.4.24:
safer-buffer ">= 2.1.2 < 3"
iconv-lite@^0.6.2:
- version "0.6.2"
- resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.6.2.tgz#ce13d1875b0c3a674bd6a04b7f76b01b1b6ded01"
- integrity sha512-2y91h5OpQlolefMPmUlivelittSWy0rP+oYVpn6A7GwVHNE8AWzoYOBNmlwks3LobaJxgHCYZAnyNo2GgpNRNQ==
+ version "0.6.3"
+ resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.6.3.tgz#a52f80bf38da1952eb5c681790719871a1a72501"
+ integrity sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==
dependencies:
safer-buffer ">= 2.1.2 < 3.0.0"
@@ -1485,9 +1507,9 @@ ms@2.0.0:
integrity sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=
nanoid@^3.1.22:
- version "3.1.22"
- resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.1.22.tgz#b35f8fb7d151990a8aebd5aa5015c03cf726f844"
- integrity sha512-/2ZUaJX2ANuLtTvqTlgqBQNJoQO398KyJgZloL0PZkC0dpysjncRUPsFe3DUPzz/y3h+u7C46np8RMuvF3jsSQ==
+ version "3.1.23"
+ resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.1.23.tgz#f744086ce7c2bc47ee0a8472574d5c78e4183a81"
+ integrity sha512-FiB0kzdP0FFVGDKlRLEQ1BgDzU87dy5NnzjeW9YZNt+/c3+q82EQDUwniSAUxp/F0gFNI1ZhKU1FqYsMuqZVnw==
native-url@0.3.4:
version "0.3.4"
@@ -1497,23 +1519,23 @@ native-url@0.3.4:
querystring "^0.2.0"
next@^10.2.0:
- version "10.2.0"
- resolved "https://registry.yarnpkg.com/next/-/next-10.2.0.tgz#6654cc925d8abcb15474fa062fc6b3ee527dd6dc"
- integrity sha512-PKDKCSF7s82xudu3kQhOEaokxggpbLEWouEUtzP6OqV0YqKYHF+Ff+BFLycEem8ixtTM2M6ElN0VRJcskJfxPQ==
+ version "10.2.2"
+ resolved "https://registry.yarnpkg.com/next/-/next-10.2.2.tgz#aadcc526e420282b4a735b0595041195d748a91d"
+ integrity sha512-HPGSLrflWPvf3zEZSIk/uj0CZ+YYrpZwZS0PFAgXbEwb894iRuAPzglagqlzcCh7lg12RBEaKNIxhrVa5xgjtQ==
dependencies:
"@babel/runtime" "7.12.5"
- "@hapi/accept" "5.0.1"
- "@next/env" "10.2.0"
- "@next/polyfill-module" "10.2.0"
- "@next/react-dev-overlay" "10.2.0"
- "@next/react-refresh-utils" "10.2.0"
+ "@hapi/accept" "5.0.2"
+ "@next/env" "10.2.2"
+ "@next/polyfill-module" "10.2.2"
+ "@next/react-dev-overlay" "10.2.2"
+ "@next/react-refresh-utils" "10.2.2"
"@opentelemetry/api" "0.14.0"
assert "2.0.0"
ast-types "0.13.2"
browserify-zlib "0.2.0"
- browserslist "4.16.1"
+ browserslist "4.16.6"
buffer "5.6.0"
- caniuse-lite "^1.0.30001179"
+ caniuse-lite "^1.0.30001228"
chalk "2.4.2"
chokidar "3.5.1"
constants-browserify "1.0.0"
@@ -1593,10 +1615,10 @@ node-libs-browser@^2.2.1:
util "^0.11.0"
vm-browserify "^1.0.1"
-node-releases@^1.1.69:
- version "1.1.71"
- resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-1.1.71.tgz#cb1334b179896b1c89ecfdd4b725fb7bbdfc7dbb"
- integrity sha512-zR6HoT6LrLCRBwukmrVbHv0EpEQjksO6GmFcZQQuCAy139BEsoVKPYnf3jongYW83fAa1torLGYwxxky/p28sg==
+node-releases@^1.1.71:
+ version "1.1.72"
+ resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-1.1.72.tgz#14802ab6b1039a79a0c7d662b610a5bbd76eacbe"
+ integrity sha512-LLUo+PpH3dU6XizX3iVoubUNheF/owjXCZZ5yACDxNnPtgFuludV1ZL3ayK1kVep42Rmm0+R9/Y60NQbZ2bifw==
normalize-path@^3.0.0, normalize-path@~3.0.0:
version "3.0.0"
@@ -1722,9 +1744,9 @@ pbkdf2@^3.0.3:
sha.js "^2.4.8"
picomatch@^2.0.4, picomatch@^2.2.1:
- version "2.2.3"
- resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.2.3.tgz#465547f359ccc206d3c48e46a1bcb89bf7ee619d"
- integrity sha512-KpELjfwcCDUb9PeigTs2mBJzXUPzAuP2oPcA989He8Rte0+YUAjw1JVedDhuTKPkHjSYzMN3npC9luThGYEKdg==
+ version "2.3.0"
+ resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.3.0.tgz#f1f061de8f6a4bf022892e2d128234fb98302972"
+ integrity sha512-lY1Q/PiJGC2zOv/z391WOTD+Z02bCgsFfvxoXXf6h7kv9o+WmsmzYqrAwY63sNgOxE4xEdq0WyUnXfKeBrSvYw==
pkg-dir@^4.1.0:
version "4.2.0"