seth
/
jam-cloud
mirror of https://bitbucket.org/jamkazam/jam-cloud.git
1
0
Fork 0
Code Issues Actions Packages Projects Releases Wiki Activity

enhancements to UI and functional issues

This commit is contained in:
Nuwan 2026-02-15 14:10:34 +05:30
parent ae7a745659
commit aa731c96d0
42 changed files with 320 additions and 180 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
jam-ui/src/assets/img/instruments/icon_instrument_accordion45_inverted.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 31 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_acoustic_guitar45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{fill:#5e6e82;stroke:#fff;stroke-miterlimit:10;stroke-width:6px;}.cls-2{fill:#fff;stroke-width:0px;}</style></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><circle class="cls-1" cx="74.82" cy="74.82" r="71.82"/><g id="layer1"><polygon class="cls-2" points="120.91 46.02 121.18 46.31 121.33 46.18 121.06 45.88 120.91 46.02"/><rect class="cls-2" x="129.45" y="38.6" width=".21" height=".4" transform="translate(7.76 97.6) rotate(-42.44)"/><rect class="cls-2" x="125.38" y="42.14" width=".21" height=".4" transform="translate(4.36 95.89) rotate(-42.49)"/><rect class="cls-2" x="111.24" y="34.94" width=".21" height=".4" transform="translate(5.59 84.63) rotate(-42.59)"/><polygon class="cls-2" points="119.22 27.82 118.94 27.53 118.79 27.67 119.06 27.96 119.22 27.82"/><rect class="cls-2" x="115.11" y="31.18" width=".21" height=".4" transform="translate(9.1 86.14) rotate(-42.53)"/><path class="cls-2" d="m132.71,34.85c-1.59-2.25-.93-7.58-1.41-7.99-.66-.38-6.1-.65-7.94-2.09l-3.91,3.81-.16-.17c.05-.03.1-.06.15-.1.17-.16.24-.37.15-.47-.09-.1-.3-.05-.48.11-.05.05-.1.1-.13.16l-.06-.06-1.61,1.59.52.52-2.14,2.08-.19-.19c.05-.03.11-.06.15-.1.17-.16.24-.37.15-.46-.09-.1-.3-.05-.48.1-.05.05-.1.1-.13.16l-.06-.06-1.61,1.59.54.55-2.24,2.19-.19-.2c.05-.03.1-.06.15-.1.17-.16.24-.37.15-.46-.09-.1-.3-.05-.48.1-.05.05-.1.1-.13.16l-.06-.06-1.61,1.59.55.55-1.13,1.1c-.22,1.2-1.35,2.59-3.76,5.14l-.11-.12-34.64,31.71c-.08-.04-.15-.08-.2-.1-6.55-6.9-15.46-14.28-26.47,4.12-4.68,7.19-17.33,5.48-25.7,12.05-7.08,6.03-11.13,18.58,4.01,34.96,15.88,17.31,28.44,14.46,34.49,8.1,7.52-7.58,7.11-21.4,14.4-25.29,20.17-8.67,12.42-19.52,6.39-26.09l34.74-31.8-.12-.13c2.66-2.08,4.17-3.16,5.44-3.31l1.05-.9.5.6,1.73-1.47-.05-.06c.06-.03.12-.06.17-.11.17-.16.24-.37.15-.47-.09-.1-.3-.05-.48.1-.05.05-.09.09-.12.14l-.18-.21,2.65-2.28.51.6,1.73-1.47-.06-.06c.06-.03.12-.06.17-.11.17-.16.24-.37.15-.46-.09-.1-.3-.05-.48.1-.05.05-.09.09-.12.14l-.18-.22,2.37-2.04.49.58,1.73-1.47-.06-.06c.06-.03.12-.06.17-.11.17-.16.24-.37.15-.46-.09-.1-.3-.05-.48.1-.05.04-.09.09-.12.14l-.17-.2,3.96-3.41Zm-21.75,4.62l10.73-9.84c.71-.66,1.83-.61,2.48.11h0c.66.72.61,1.83-.11,2.48l-4.88,4.47-.4-.43,2.75-2.71.44.48.98-.9-.47-.52.14-.14-.19-.19h0s-.13.13-.13.13l-1.64-1.79-.98.9,1.67,1.83-2.75,2.71-.48-.53.16-.14-.16-.18h0l-.17.15-1.08-1.17-.98.9,1.06,1.15-3.07,2.7-.43-.47.09-.06-.06-.08h0l-.06-.08-.11.08-.49-.54-.98.9.39.43-1.83,1.33c.07-.36.25-.71.54-.98Zm-58.63,59.85s0,0,0,0c-.23-.25-.44-.51-.64-.78l11.05-10.13c.25.22.49.45.72.7,0,0,0,0,0,0,.14.16.28.32.41.48l-11.1,10.17c-.15-.14-.29-.29-.43-.44Zm-1.57-2.4l10.45-9.58c.46.25.9.54,1.32.89l-11,10.08c-.3-.45-.56-.91-.77-1.39Zm61.3-54.4c-.44-.02-.88-.21-1.2-.57h0s0,0,0,0l2.21-1.95.74.81-1.74,1.72Zm2.27,3.33c-.3-.44-.38-.99-.22-1.47l1.69-1.39.74.81-2.21,2.06Zm.41-2.35l.83-.76.04.05-.87.72Zm-1.4-1.44c-.25.23-.55.37-.86.43l1.51-1.49.18.2.98-.9-.21-.23,2.92-2.87.36.39-4.87,4.47Zm1.41-2.19l-.69-.75,3.07-2.71.53.58-2.92,2.87Zm-4.05,1.89c-.22-.32-.32-.68-.31-1.05l1.99-1.45.51.56-2.2,1.94Zm-51.32,44.85c.53.14,1.06.34,1.57.6l-10.3,9.44c-.21-.53-.36-1.07-.46-1.61l9.19-8.42Zm4.65,3.19c.34.45.63.93.86,1.42l-10.59,9.7c-.47-.28-.92-.61-1.34-.98l11.07-10.14Zm.98,1.68c.25.56.43,1.14.54,1.72l-9.34,8.56c-.57-.17-1.13-.4-1.66-.69l10.46-9.59Zm50.64-44.91c-.43-.02-.85-.2-1.17-.54l2.22-2.07.66.72-1.72,1.88Zm1.86-3.69l-.68-.74,3.17-2.6.51.55-3,2.79Zm3.33-4.39l-.27-.3-.98.9.23.25-3.17,2.6-.09-.1,6.96-6.38.44.48-3.11,2.55Zm-68.46,49.72c1.83-1.68,4.32-2.22,6.68-1.68l-8.93,8.18c-.33-2.39.42-4.83,2.25-6.5Zm11.01,12c-1.87,1.72-4.45,2.24-6.86,1.64l9.08-8.32c.39,2.45-.35,4.97-2.22,6.69Zm52.54-53.64l1.57-1.73.33.36.98-.9-.41-.44.06-.06-.07-.07h0s-.07-.07-.07-.07l-.05.05-.58-.64,3-2.79,1.17,1.28.98-.9-1.18-1.29.11-.11.03-.04-.2-.13-.11.11-.45-.49,3.11-2.55,1.62,1.77.98-.9-1.57-1.71.02-.02h0s-.18-.22-.18-.22l-.03.03-.49-.54.93-.85c.69-.63,1.76-.58,2.39.1.63.69.58,1.76-.1,2.39l-10.84,9.94c-.27.25-.59.39-.93.43Z"/></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.0 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_banjo45_inverted.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 6.9 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_bass_guitar45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{fill:#5e6e82;stroke:#fff;stroke-miterlimit:10;stroke-width:6px;}.cls-2{fill:#fff;stroke-width:0px;}</style></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><path class="cls-1" d="m3,74.82C3,35.15,35.15,3,74.82,3s71.82,32.15,71.82,71.82-32.16,71.82-71.82,71.82S3,114.48,3,74.82Z"/><path class="cls-2" d="m49.49,131.3c8.11-8.13,4.72-13.64,7.88-16.81,3.16-3.17,7.53-1.91,11.54-5.93,3.91-3.92,3.38-6.59,2.19-8.02-1.19-1.43-4,1.66-5.53,2.13-1.96.6-3.93.52-5.13-.68-1.46-1.46-1.99-2.76-2.17-3.64l48.76-49.9s1.61-1.55,3.41-1.72c1.82-.17,3.23-.58,3.23-.58,0,0,1.49-5.14,6.46-10.11,2.24-2.24,5.06-1.91,5.06-1.91,0,0,0-1.49.5-3.15.5-1.66,1.41-2.4-.41-4.23-1.02-1.02-2.15-1.05-4.41.17l-1.26-1.73c.31-.45.72-1.11.57-1.32l-.58-.83c-.22-.32-1.38-.09-2.3.55-.92.64-1.57,1.68-1.35,1.99l.58.83c.15.22.97.04,1.52-.12l1.18,1.6c-.88.56-1.9,1.25-3.07,2.08l-1.13-1.55c.31-.45.72-1.11.57-1.32l-.58-.83c-.22-.32-1.38-.09-2.3.56-.92.64-1.58,1.68-1.35,1.99l.58.83c.15.22.96.04,1.52-.12l1.14,1.55c-.5.36-1.02.73-1.57,1.13-.6.43-1.15.83-1.69,1.21l-1.15-1.58c.31-.45.72-1.11.57-1.32l-.58-.83c-.22-.32-1.38-.09-2.3.55-.92.64-1.58,1.68-1.35,2l.58.83c.15.22.97.04,1.52-.12l1.16,1.58c-1.52,1.08-2.73,1.95-3.69,2.63l-1.17-1.6c.32-.45.72-1.11.57-1.32l-.58-.83c-.22-.32-1.38-.09-2.3.55-.92.64-1.57,1.68-1.35,1.99l.58.83c.15.22.96.05,1.52-.12l1.17,1.6c-1.34.94-1.78,1.24-1.78,1.24,0,0,.58.91.75,2.24.17,1.33-.75,2.73-.75,2.73-10.4,10.17-32.77,32-43.96,42.9-.21.2-2.89,2.69-5.2-.43-2.4-3.24-1.29-5.89-.52-7.01,1.32-1.91,4.34-4.01,3.57-5.97-.02-.04-.03-.07-.05-.11.03-.03.05-.05.08-.08.5-.52.88-.13,1.2-.47.14-.14-.09-.58-.5-.98-.42-.4-.86-.61-1-.46-.29.31.07.71-.41,1.22-.04.04-.06.06-.09.09-1.72-.83-5.62.19-8.43,3-6.48,6.5-5.04,10.7-9.39,15.07-4.35,4.37-12.6,2.72-18.41,8.54-6.29,6.31-6.72,14.8,3.97,25.98-.5.52-.88.13-1.2.46-.14.14.09.58.5.98.42.4.86.61,1,.46.29-.3-.06-.7.39-1.19.11.11.21.21.31.32,11.73,11.69,18.83,10.56,24.89,4.48Z"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.0 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_cello45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{fill:#5e6e82;stroke:#fff;stroke-miterlimit:10;stroke-width:6px;}.cls-2{fill:#fff;stroke-width:0px;}</style></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><path class="cls-1" d="m3,74.82C3,35.15,35.15,3,74.82,3s71.82,32.15,71.82,71.82-32.15,71.82-71.82,71.82S3,114.48,3,74.82Z"/><polygon class="cls-2" points="113.34 39.2 113.84 38.71 114.29 38.26 114.06 38.46 113.34 39.2"/><path class="cls-2" d="m119.43,40.37l-1.42-1.42-.67.76,1.37,1.4c-.5.59-.63,1.44.09,2.03.49.4,1.61.41,2.41-.33.72-.66.66-1.91.04-2.52-.48-.48-1.2-.49-1.83.08Z"/><path class="cls-2" d="m60.42,91.41c.02.06.04.11.06.17l.96.93.19-.2,51.71-53.12-52.77,52.06-.15.15Z"/><path class="cls-2" d="m62.11,94.46l.07-.07-1.06-1.06-8.23,8.22c.29.28.58.53.88.77l8.33-7.86Z"/><path class="cls-2" d="m62.59,94.78l-.15-.15-.08.08-8.29,7.83c.34.25.68.49,1.03.71l8.15-7.09c-.52-.51-.92-1.01-.66-1.38Z"/><path class="cls-2" d="m52.65,101.3l8.23-8.23-.95-.95c-.06,0-.12-.02-.18-.04l-7.84,8.39c.24.29.49.57.74.82Z"/><path class="cls-2" d="m66.46,121.83c4.21-7.26,5-11.51,8.51-11.37l.34-1.01c-6.41-3.32-1.48-9.88.93-12.39,2.29-2.38,5.38-4.19,8.51-.93l1.01-.34c-.12-2.72,2.17-3.57,3.96-4.8,3.84-2.4,8.3-5.38,9.52-11.88.86-4.57-.07-10.05-4.8-15.59l-.09-.09,6.71-7.24-36.18,38.88-.1.1c.32.3.65.66.97,1.09l-1.1,1.26c-.25-.32-.71-.72-1.14-1.12l-8.09,7.04c.13.08.26.15.39.23-2.08,1.89-4.19,3.64-6.49,4.63-4.14,2.52-5.54,4.39-8.43,7.33-1.13,1.35-3.39,3.71-4.63,4.72l-2.11-2.11c1.73-1.81,3.46-3.62,5.52-5.1,2.4-1.92,4.76-3.96,6.61-7.54,1.3-2.74,3.02-4.48,4.63-6.49.25.39.51.75.77,1.08l7.72-8.27c-.64-.36-1.51-1.19-2.38-1.96l1.31-1.31c.69.76,1.49,1.39,1.95,2.38l.05-.05,53.26-52.55.71-.71.25.25-.27.27,1.81-1.6.23-.23.25.25-.24.24-2.03,1.8-52.42,53.85-.19.19,1.08,1.04.29-.29,51.7-53.85,1.54-2.02.28.22-1.56,2.04-51.71,53.86-.29.29.19.18c.43.11.86.35,1.29.69l.11-.11,51.11-54.93.26.24-2.36,2.54.23.23c2.3-1.79,4.84-4.29,6.29-7.42,0,0,0,0,0,0l-.48.99,1.24,1.27c-.5.59-.63,1.44.09,2.02.49.4,1.61.41,2.41-.33.72-.66.66-1.91.05-2.52-.48-.48-1.2-.49-1.83.08l-1.44-1.56c.43-.77.85-1.47,1.28-2.09.71.42,1.14-.22,1.62-.61.43.36,1.02,1.01,2.25-.46l-.7-.85c.55-.47.69-1.02.45-1.49.36-.52,1.23-.63.13-1.59-.57-.5-.96-1.15-1.68-.14,0,0-.01.01-.02.02-.48-.36-1.33.11-1.53.42-.41-.38-.3-.29-.81-.7-.71.5-1.54.92-.82,2.1-.36.37-.73.72-.63,1.4l-2.82,2.4-1.92-1.95c.24-.41-.29-1.07-.72-1.52-.59-.61-1.5-.78-1.85-.06-.38.79.69,1.68,1.8,2.31l1.91,1.88.35-.3-3.15,2.68-1.91-1.94c.24-.41-.42-.97-.85-1.42-.59-.61-1.65-.96-1.71-.16-.07.84.68,1.68,1.8,2.31l1.9,1.87-1.15.98c-.46.41-.9.83-.43,1.55l.04.04-20.41,19.6c-4.8-3.95-9.94-6.62-17.25-4.6-5.33,1.47-9.03,5.95-10.45,8.93-1.3,2.74-3.42,4.49-5.34,4.45-.35.92-.04.15-.43,1.04,5.02,2.92.9,6.88-.73,8.47-4.99,4.86-9.47,4.77-12.49,1.32l-1.06.23c.41,4.07-7.4,5.32-11.12,8.09-5.24,3.9-7.7,9.6-7.42,15,.32,6.12,4.26,11,9.17,15.93-.34.02-1,.89-.61,1.71l-3.63,3.79-3.53,4.04.72.72,4.67-4.92,2.75-2.83c.76.17,1.46-.38,1.41-.65l-1.52-1.6c.31.31.62.61.94.92,6.2,6.07,9.88,8.43,14.66,9.27,7.59,1.33,14.54-2.75,17.1-7.16Zm-6.36-37.28c-.18-.62.04-1.01.76-1.18-.8-2.05-3.88.5-6.7,3.5-4.3,4.15-5.82,3.23-6.82,2.19-.56-.57-1.05-2,.25-2.7.41-.22,1.29-.03,1.26.76-.01.34-.29.84-1.1.59-.12,2.24,2.18,1.41,3.12.84,2.04-1.37,3.74-3.35,5.64-5.06,1.38-1.23,3.14-2.04,4.51-.88.48.41.7,1.13.34,1.94-.51.35-.98.54-1.26,0Zm5.12,22.65c-1.04-1.01-1.96-2.53,2.19-6.82,3-2.82,5.55-5.9,3.5-6.7-.17.72-.56.94-1.18.76-.54-.29-.35-.75,0-1.26.8-.36,1.53-.15,1.94.34,1.16,1.37.35,3.13-.88,4.51-1.7,1.91-3.69,3.61-5.05,5.65-.56.94-1.4,3.23.84,3.12-.25-.81.25-1.08.59-1.1.78-.03.98.86.76,1.26-.7,1.3-2.12.81-2.7.25Z"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.6 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_clarinet45_inverted.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 5.2 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_computer45_inverted.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 22 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_default45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{fill:#5e6e82;stroke:#fff;stroke-miterlimit:10;stroke-width:6px;}.cls-2{fill:#fff;stroke-width:0px;}</style></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><path class="cls-1" d="m3,74.82C3,35.15,35.15,3,74.82,3s71.82,32.15,71.82,71.82-32.15,71.82-71.82,71.82S3,114.48,3,74.82Z"/><g id="layer1"><path id="path2159" class="cls-2" d="m53.79,98.05c-13.61-25.54-34.51-21.24-41.01-3.38-4.17,11.47,7.5,31.24,34.55,22.94,14.6-18.16,41.84-49.49,56.44-67.65,10.72,36.33.61,41.02-13.66,52.67,12.87,2.22,34.94-3.01,33.95-40.24-.97-16.83.24-18.19,1.21-36.36-2.53-2.25-3.8-3.03-6.33-5.27-18.39,21.77-46.76,55.52-65.15,77.29Z"/></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 788 B

1
jam-ui/src/assets/img/instruments/icon_instrument_double_bass45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{fill:#5e6e82;stroke:#fff;stroke-miterlimit:10;stroke-width:6px;}.cls-2{fill:#fff;stroke-width:0px;}</style></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><path class="cls-1" d="m3,74.82C3,35.15,35.15,3,74.82,3s71.82,32.15,71.82,71.82-32.15,71.82-71.82,71.82S3,114.48,3,74.82Z"/><polygon class="cls-2" points="113.34 39.2 113.84 38.71 114.29 38.26 114.06 38.46 113.34 39.2"/><path class="cls-2" d="m119.43,40.37l-1.42-1.42-.67.76,1.37,1.4c-.5.59-.63,1.44.09,2.03.49.4,1.61.41,2.41-.33.72-.66.66-1.91.04-2.52-.48-.48-1.2-.49-1.83.08Z"/><path class="cls-2" d="m60.42,91.41c.02.06.04.11.06.17l.96.93.19-.2,51.71-53.12-52.77,52.06-.15.15Z"/><path class="cls-2" d="m62.11,94.46l.07-.07-1.06-1.06-8.23,8.22c.29.28.58.53.88.77l8.33-7.86Z"/><path class="cls-2" d="m62.59,94.78l-.15-.15-.08.08-8.29,7.83c.34.25.68.49,1.03.71l8.15-7.09c-.52-.51-.92-1.01-.66-1.38Z"/><path class="cls-2" d="m52.65,101.3l8.23-8.23-.95-.95c-.06,0-.12-.02-.18-.04l-7.84,8.39c.24.29.49.57.74.82Z"/><path class="cls-2" d="m66.46,121.83c4.21-7.26,5-11.51,8.51-11.37l.34-1.01c-6.41-3.32-1.48-9.88.93-12.39,2.29-2.38,5.38-4.19,8.51-.93l1.01-.34c-.12-2.72,2.17-3.57,3.96-4.8,3.84-2.4,8.3-5.38,9.52-11.88.86-4.57-.07-10.05-4.8-15.59l-.09-.09,6.71-7.24-36.18,38.88-.1.1c.32.3.65.66.97,1.09l-1.1,1.26c-.25-.32-.71-.72-1.14-1.12l-8.09,7.04c.13.08.26.15.39.23-2.08,1.89-4.19,3.64-6.49,4.63-4.14,2.52-5.54,4.39-8.43,7.33-1.13,1.35-3.39,3.71-4.63,4.72l-2.11-2.11c1.73-1.81,3.46-3.62,5.52-5.1,2.4-1.92,4.76-3.96,6.61-7.54,1.3-2.74,3.02-4.48,4.63-6.49.25.39.51.75.77,1.08l7.72-8.27c-.64-.36-1.51-1.19-2.38-1.96l1.31-1.31c.69.76,1.49,1.39,1.95,2.38l.05-.05,53.26-52.55.71-.71.25.25-.27.27,1.81-1.6.23-.23.25.25-.24.24-2.03,1.8-52.42,53.85-.19.19,1.08,1.04.29-.29,51.7-53.85,1.54-2.02.28.22-1.56,2.04-51.71,53.86-.29.29.19.18c.43.11.86.35,1.29.69l.11-.11,51.11-54.93.26.24-2.36,2.54.23.23c2.3-1.79,4.84-4.29,6.29-7.42,0,0,0,0,0,0l-.48.99,1.24,1.27c-.5.59-.63,1.44.09,2.02.49.4,1.61.41,2.41-.33.72-.66.66-1.91.05-2.52-.48-.48-1.2-.49-1.83.08l-1.44-1.56c.43-.77.85-1.47,1.28-2.09.71.42,1.14-.22,1.62-.61.43.36,1.02,1.01,2.25-.46l-.7-.85c.55-.47.69-1.02.45-1.49.36-.52,1.23-.63.13-1.59-.57-.5-.96-1.15-1.68-.14,0,0-.01.01-.02.02-.48-.36-1.33.11-1.53.42-.41-.38-.3-.29-.81-.7-.71.5-1.54.92-.82,2.1-.36.37-.73.72-.63,1.4l-2.82,2.4-1.92-1.95c.24-.41-.29-1.07-.72-1.52-.59-.61-1.5-.78-1.85-.06-.38.79.69,1.68,1.8,2.31l1.91,1.88.35-.3-3.15,2.68-1.91-1.94c.24-.41-.42-.97-.85-1.42-.59-.61-1.65-.96-1.71-.16-.07.84.68,1.68,1.8,2.31l1.9,1.87-1.15.98c-.46.41-.9.83-.43,1.55l.04.04-20.41,19.6c-4.8-3.95-9.94-6.62-17.25-4.6-5.33,1.47-9.03,5.95-10.45,8.93-1.3,2.74-3.42,4.49-5.34,4.45-.35.92-.04.15-.43,1.04,5.02,2.92.9,6.88-.73,8.47-4.99,4.86-9.47,4.77-12.49,1.32l-1.06.23c.41,4.07-7.4,5.32-11.12,8.09-5.24,3.9-7.7,9.6-7.41,15,.32,6.12,4.26,11,9.17,15.93-.34.02-1,.89-.61,1.71l-3.63,3.79-3.53,4.04.72.72,4.67-4.92,2.75-2.83c.76.17,1.46-.38,1.41-.65l-1.52-1.6c.31.31.62.61.94.92,6.2,6.07,9.88,8.43,14.66,9.27,7.59,1.33,14.54-2.75,17.1-7.16Zm-6.36-37.28c-.18-.62.04-1.01.76-1.18-.79-2.05-3.88.5-6.7,3.5-4.3,4.15-5.82,3.23-6.82,2.19-.56-.57-1.05-2,.25-2.7.41-.22,1.29-.03,1.26.76-.01.34-.29.84-1.1.59-.12,2.24,2.18,1.41,3.12.84,2.04-1.37,3.74-3.35,5.64-5.06,1.38-1.23,3.14-2.04,4.51-.88.48.41.7,1.13.34,1.94-.51.35-.98.54-1.26,0Zm5.12,22.65c-1.04-1.01-1.96-2.53,2.19-6.82,3-2.82,5.55-5.9,3.5-6.7-.17.72-.56.94-1.18.76-.54-.29-.35-.75,0-1.26.8-.36,1.53-.15,1.94.34,1.16,1.37.35,3.13-.88,4.51-1.7,1.91-3.69,3.61-5.05,5.65-.56.94-1.4,3.23.84,3.12-.25-.81.25-1.08.59-1.1.78-.03.98.86.76,1.26-.7,1.3-2.12.81-2.7.25Z"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.6 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_drums45_inverted.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 16 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_electric_guitar45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{fill:#5e6e82;stroke:#fff;stroke-miterlimit:10;stroke-width:6px;}.cls-2{fill:#fff;stroke-width:0px;}</style></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><path class="cls-1" d="m3,74.82C3,35.15,35.15,3,74.82,3s71.82,32.15,71.82,71.82-32.15,71.82-71.82,71.82S3,114.48,3,74.82Z"/><path class="cls-2" d="m65.18,115.35c3.55-3.56,9.03-2.7,13.54-7.23,4.4-4.41,3.85-7.3,2.3-8.85-1.48-1.48-4.33,1.7-6.05,2.23-2.21.68-4.42.58-5.77-.76-1.65-1.64-2.23-3.1-2.44-4.09l42.52-43.93s3.49-4.32,8.14-.09c0,0,1.89-.66,4.04-5.03,2.16-4.38,2.06-5.6,2.85-6.31,1.75-1.57,3.87,1.8,6.54-.87,1.96-1.97,2.15-4.76.56-6.34-2.05-2.05-4.13-1.81-5.76-.85-.08.05-.2.11-.35.2l-.41-.76c.26-.29.26-.55.17-.72l-.34-.64c-.13-.25-.62-.35-1.34.02-.71.37-.9.85-.77,1.09l.33.64c.09.17.32.32.73.25l.42.77c-.57.31-1.26.68-2.03,1.1l-.4-.74c.27-.29.27-.55.18-.72l-.34-.64c-.13-.25-.62-.35-1.33.02-.71.38-.9.84-.77,1.09l.34.64c.09.17.32.32.72.25l.4.75c-.65.35-1.34.72-2.04,1.1l-.43-.79c.26-.29.26-.55.17-.72l-.33-.63c-.13-.25-.63-.35-1.34.02-.71.37-.9.84-.77,1.09l.34.64c.09.17.32.32.72.25l.43.79c-.69.37-1.39.74-2.09,1.12l-.44-.82c.26-.29.26-.55.18-.72l-.34-.64c-.13-.24-.62-.35-1.33.02-.71.37-.9.84-.77,1.09l.34.64c.09.17.32.32.72.25l.44.82c-.66.36-1.32.71-1.96,1.05l-.45-.83c.26-.29.27-.55.18-.72l-.34-.64c-.13-.25-.62-.35-1.33.02-.71.38-.9.84-.77,1.09l.34.64c.09.17.32.32.72.25l.45.82c-.82.44-1.59.85-2.28,1.22l-.46-.84c.26-.29.27-.55.18-.72l-.34-.64c-.13-.25-.62-.35-1.33.02-.71.37-.9.84-.77,1.09l.34.64c.09.17.32.32.72.25l.45.84c-1.26.67-2.04,1.08-2.04,1.08,0,0,1.09,2.33-.88,4.25-1.35,1.31-21.35,20.45-37.43,36.11-.23.22-3.25,3.02-5.84-.48-2.69-3.65-1.45-6.63-.59-7.88,1.48-2.15,4.32-3.94,3.45-6.15-.04-.09-.09-.18-.14-.27,0,0,0,0,.01-.02.49-.5.85-.12,1.17-.45.13-.14-.09-.56-.49-.95-.4-.39-.83-.59-.97-.45-.29.3.07.69-.4,1.18,0,0-.01.01-.02.02-1.81-1.06-5.81-.3-8.96,2.87-7.29,7.31-6.22,12.59-11.12,17.5-4.89,4.91-15.84,4.73-22.37,11.28-7.08,7.1-6.8,15.9,5.32,28.46-.46.43-.82.09-1.12.4-.13.14.08.56.48.95.4.39.83.59.97.45.27-.28-.03-.65.35-1.11.13.13.27.27.4.4,13.18,13.14,20.37,12.67,27.18,5.84,9.12-9.14,6.99-17.02,10.54-20.58Z"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.2 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_euphonium45_inverted.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_flute45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{fill:#5e6e82;stroke:#fff;stroke-miterlimit:10;stroke-width:6px;}.cls-2{fill:#fff;stroke-width:0px;}</style></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><circle class="cls-1" cx="74.82" cy="74.82" r="71.82"/><path class="cls-2" d="m126.17,27.65c-.24-.54-.88-.72-1.29-.87-.42-.18-.84-.15-1.15-.08-.3.05-.52.25-.64.41-.12.14-.18.3-.12.49l-2.81,2.57c-.6-.22-1.27-.11-2.03.31-.79.43-1.71,1.45-2.54,2.2-.84.71-2,1.66-2.41,2.14-.4.45-.1.52,0,.69.05.18.19.28.39.36l-10.4,9.18c-.24-.12-.49-.14-.78-.05-.31.08-.76.31-.95.55-.19.22-.23.46-.13.75l-3.88,3.63c-.48-.03-.81,0-1.03.13-.23.12-.22.32-.29.56-.08.22-.14.47-.17.77l-3.38,2.93-1.24-1.03c.23-.23.35-.44.29-.63-.06-.21-.36-.65-.61-.58-.28.05-.58.33-.97.88-.53-.12-.91-.08-1.12.09-.22.18-.29.47-.19.93l-1.04.83c-.4-.13-.7-.09-.87.06-.18.17-.24.45-.18.89-1.54,1.24-3.29,2.72-5.34,4.47-2.06,1.77-4.33,3.72-6.92,6l-16.51,14.89c-.37.01-.62.13-.8.31-.16.17-.25.41-.26.72-.67.26-1.22.73-1.59,1.33l-2.25,1.77c-.25-.04-.46-.01-.63.12-.17.13-.32.33-.42.63l-1.31,1.1c-.33-.07-.59-.05-.75.07-.16.09-.24.33-.24.56-.02.22,0,.46.11.75l-2.32,1.93c-.35.04-.62.1-.84.23-.23.12-.42.31-.45.5-.03.18.04.34.25.55l-.56.38c-.52.03-.89.12-1.09.29-.22.18-.27.46-.17.69.07.2.27.38.62.54l1.2,1.15-.66.65c-.75-.62-1.41-1-1.94-1.12-.55-.14-.92.13-1.3.32-.4.16-.83.42-1,.75-.18.32-.14.75.04,1.24-.25-.25-.65-.22-1.2.08-.58.28-1.72,1.26-2.14,1.7-.41.42-.39.6-.35.92.03.3.21.62.55.95-.57.25-.87.54-.96.79-.08.24.17.53.48.77.3.24.73.46,1.31.67l-1.75,1.6c.12-.65.05-1.16-.26-1.5-.31-.36-.88-.72-1.57-.6-.71.12-1.98.67-2.64,1.25-.68.55-1.21,1.44-1.38,2.05-.15.58.11,1.16.43,1.46.3.29.73.38,1.34.27l.32.68-3.26,2.48c.04-.88-.23-1.37-.88-1.5-.65-.12-2.14.24-2.93.69-.82.42-1.5,1.28-1.82,1.85-.31.55-.16,1.13-.06,1.47.07.32.23.41.46.53.21.11.46.15.77.13l.5.57-6.86,6.3c-.17-.04-.31-.04-.49,0-.19.03-.37.13-.51.25-.14.11-.27.26-.36.47.41.92.97,1.77,1.71,2.61.75.83,1.62,1.58,2.71,2.33.32-.18.59-.35.74-.53.15-.19.23-.36.2-.55l20.79-19.06c.72.41,1.33.55,1.86.46.51-.12.88-.6,1.27-1.06.39-.48.85-1.02,1.06-1.65.18-.64.21-1.34.07-2.13.71.07,1.18-.04,1.46-.31.27-.27.33-.7.17-1.3l20.67-18.99c.29.14.61.13,1.02.03.39-.12,1.07-.28,1.37-.72.28-.46.43-1.16.39-2.07.33.66.81,1.17,1.42,1.46.62.29,1.54.43,2.24.32.66-.16,1.58-.68,1.77-1.11.15-.43-.33-1.08-.72-1.37-.38-.29-1.02-.4-1.54-.36-.51.03-1.18.55-1.56.55-.39-.04-.66-.23-.78-.67.72-.07,1.29-.18,1.71-.34.4-.18.59-.37.79-.64.21-.28.32-.61.4-1l21.68-19.92c-.02.14.08.16.32.06.23-.12.82-.41,1.04-.67.2-.25.27-.51.22-.81l3.7-3.48c.55-.11.99-.28,1.24-.54.24-.27.37-.56.31-.96l1.81-1.68,18.38-16.84c.22-1.03.25-1.81.04-2.34ZM47.53,96.25l-.57-1.04c.11-.25.12-.51.02-.85-.11-.35-.7-.8-.64-1.12.06-.33.36-.57.94-.78l.15.18c.14.08.2.25.21.53-.03.27-.26.62-.2,1.07.06.43.28.91.62,1.49l-.52.53Zm2.43-4.84c-.29.01-.57.08-.86.22l-.44-.67,1.37-1.15c-.13.37-.12.69,0,1,.14.29.37.54.75.77-.29-.13-.54-.19-.83-.18Zm2.8-3.33c-.14.25-.26.52-.38.85l-.17-.89.9-.82c.02.08.04.16.06.24-.14.17-.27.36-.41.62Zm9.35-5.65c-.21-.09-.47-.14-.79-.17-.31-.03-.7-.03-1.12,0l-.76-.58,1.59-1.49c.16.2.32.4.48.6-.56.33-.91.57-1.02.73-.12.15-.02.22.31.22.36-.19.62-.32.83-.38.18-.05.11-.03.36.03.24.02.64.06,1.16.12l-1.03.93Zm5.54-4.17c-.45-.24-1.04-.35-1.79-.35l1.84-1.81c.24.24.48.46.71.69-.12.29-.18.63-.15,1.07.02.43.12.9.29,1.46-.14-.49-.47-.83-.9-1.07Zm4.36-4.08l-1.31.25.03.94c-.21-.05-.41-.06-.56-.07-.17-.01-.32,0-.44.04-.2-.3-.39-.61-.6-.92l2.68-2.29.55.51c-.26.44-.4.78-.46,1.04-.07.27-.02.41.11.5Zm2.72-2.72c-.26-.06-.63-.12-1.07-.15-.32-.48-.63-.96-.95-1.44l1.15-1,1.31,1.2c-.07.2-.09.44-.08.71.01.27.06.56.16.89-.08-.08-.27-.16-.53-.21Zm3.68-3.45c-.39-.09-.77-.15-1.17-.13-.4,0-.81.06-1.22.16-.24-.2-.49-.39-.74-.59l2.28-1.78.89.9c-.07.17-.12.38-.12.63-.01.25,0,.5.07.81Zm3.05-3.25c-.44,0-1.03.03-1.77.09-.08-.18-.17-.37-.25-.55l1.48-1.22,1.37,1.76c-.12-.05-.4-.1-.83-.09Zm.95-1.01c-.03.1-.04.18-.04.29l-1.52-1.75.34-.32c.25.24.48.49.71.74.23.24.42.5.63.75-.05.09-.09.19-.12.29Zm.31-.94l-1.13-1.01,1.49-1.27.95,1.22-1.31,1.06Zm1.81-1.66l-.83-1.02,1.87-1.51.86.97-1.9,1.56Zm4.47-3.25l-.95-.07-.95-.8.9-.68,1.26,1.25-.27.3Zm.33-.86s-.04.04-.05.05c0,0,.01.01.02.02.09.07-.05.05-.02-.02-.14-.11-.37-.34-.71-.67.26-.26.51-.52.76-.78l.93.75c-.46.3-.76.52-.93.64Zm1.65-1.52l-.52-.67.12-.24.71-.66.68.71-.99.86Z"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.3 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_french_horn45_inverted.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 10 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_harmonica45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{fill:none;}.cls-1,.cls-2{stroke-width:0px;}.cls-3{fill:#fff;stroke:#5e6e82;stroke-miterlimit:10;stroke-width:6px;}.cls-2{fill:#fff;}</style></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><path class="cls-3" d="m3,74.82C3,35.15,35.16,3,74.82,3s71.82,32.15,71.82,71.82-32.16,71.82-71.82,71.82S3,114.48,3,74.82Z"/><path id="path3005" class="cls-1" d="m22.1,98s15.47,3.68,17.79,4.08c2.33.4,8.05-1.39,13.74-6.34,5.7-4.94,68.66-58.99,69.15-59.9.5-.91,2.7-3.21-3.69-4.24-6.4-1.03-15.04-2.02-15.04-2.02"/><path class="cls-2" d="m121.7,31.86c.87-5.68-2.82-6.79-7.93-7.11-5.12-.32-12.02,4.08-12.02,4.08l-1.78.14c-7.91-1.29-11.36,3.78-11.36,3.78,0,0-61.76,52.31-65.55,55.63-3.78,3.32-3.56,7.57-1.88,9.57-2.71,3.78-3,7.47,5.94,10.7,8.94,3.23,18.91-4.98,18.91-4.98,0,0,73.03-65.58,75.39-67.71,2.36-2.13.53-3.62.27-4.11ZM26.09,103.52c.97-1.52,4.52-2.47,4.42.37-.1,2.84-5.12,3.46-4.42-.37ZM114.6,28.29c-1.46,2.12-4.25.85-3.34-.79,1.65-2.06,4.81-1.32,3.34.79Z"/><path class="cls-2" d="m133.66,38.27c-1.02-1.94-3.57-6.79-3.57-6.79,0,0-.87-2.84-3.34-3.61-.4-.12-1.1-.29-1.98-.49.12.04.22.08.31.12,2.92,1.23,3.47,2.89,2.41,4.59-1.06,1.69-76.61,68.69-80.47,72.18-3.86,3.49-8.37,6.67-11.77,7.32-3.4.65-22.84-5.4-22.84-5.4-3.43-.96,4.46-5.43,4.46-5.43,0,0,2.85-2.43,7.51-6.4l-5.76,4.34-6.2,4.7s-2.76,1.04-1.23,3.95c1.53,2.91,3.48,6.63,3.48,6.63,0,0,1.25,1.2,2.73,1.66,1.48.46,12.12,3.85,16.44,4.58,4.31.73,6,.84,8.74-1.2.55-.41,1.73-1.38,3.41-2.79,1.17-.2,2.77-.9,4.93-2.62,5.96-4.76,68.12-58.54,71.03-61.04,2.48-2.14,6.72-4.97,5.6-7.47,3.11-2.73,4.92-4.33,4.91-4.33,0,0,2.2-.53,1.18-2.48Zm-11.08-.26l1.46,3.29-5.6,5.02-1.67-3.17,5.8-5.14Zm-6.35,5.95l1.48,3.2-6.41,5.59-1.56-3.22,6.49-5.57Zm-7.41,6.38l1.51,3.26-6.3,5.78-1.74-3.12,6.53-5.92Zm-6.99,6.51l1.7,3.16-6.86,5.94-1.72-3.28,6.87-5.82Zm-7.5,6.5l1.69,3.16-6.87,5.92-1.94-3.02,7.12-6.07Zm-7.88,6.84l1.68,3.17-6.89,5.91-1.93-3.02,7.14-6.05Zm-8.06,7.06l1.72,3.14-6.81,5.99-1.97-3,7.06-6.14Zm-7.95,6.96l1.8,3.1-6.68,6.13-2.04-2.95,6.92-6.28Zm-7.53,6.72l1.78,3.11-6.7,6.1-2.03-2.96,6.95-6.25Zm-14.95,13.26l6.99-6.21,1.76,3.12-6.74,6.06-2.01-2.97Zm3.94,6.01l-1.78-2.53,7.14-5.93,1.53,2.68-6.89,5.79Zm8.4-6.57l-2.03-2.96,6.95-6.25,1.78,3.11-6.7,6.1Zm7.48-6.72l-1.97-2.99,6.97-6.31,1.73,3.14-6.72,6.16Zm7.81-6.95l-1.97-2.99,7.06-6.14,1.72,3.14-6.81,5.99Zm7.89-6.79l-1.93-3.02,7.14-6.05,1.68,3.17-6.89,5.91Zm7.87-6.88l-1.94-3.02,7.12-6.07,1.69,3.16-6.87,5.93Zm7.38-6.49l-1.74-3.05,7.1-6.08,1.7,3.01-7.06,6.12Zm7.42-6.74l-1.65-2.95,6.42-5.71,1.39,2.89-6.15,5.78Zm7.18-6.66l-1.38-3.02,6.34-5.56,1.49,3.34-6.45,5.23Zm7.1-5.95l-1.67-3.17,5.8-5.14,1.46,3.28-5.6,5.02Z"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.7 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_keyboard45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{clip-path:url(#clippath);}.cls-2{fill:none;}.cls-2,.cls-3{stroke-width:0px;}.cls-4{fill:#fff;stroke:#5e6e82;stroke-miterlimit:10;stroke-width:6px;}.cls-3{fill:#5e6e82;}</style><clipPath id="clippath"><path class="cls-2" d="m3,74.82C3,35.15,35.15,3,74.82,3s71.82,32.15,71.82,71.82-32.16,71.82-71.82,71.82S3,114.48,3,74.82Z"/></clipPath></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><path class="cls-4" d="m3,74.82C3,35.15,35.15,3,74.82,3s71.82,32.15,71.82,71.82-32.16,71.82-71.82,71.82S3,114.48,3,74.82Z"/><g class="cls-1"><path class="cls-3" d="m61.24,97.73V32.7h3.25v-4.34c0-1.79-1.46-3.25-3.25-3.25h-10.84c-1.79,0-3.25,1.46-3.25,3.25v4.34h4.33v65.03h-4.33v30.35c0,1.79,1.46,3.25,3.25,3.25h10.84c1.79,0,3.25-1.46,3.25-3.25v-30.35h-3.25Z"/><path class="cls-3" d="m40.65,97.73V32.7h4.33v-4.34c0-1.79-1.46-3.25-3.25-3.25h-10.84c-1.79,0-3.25,1.46-3.25,3.25v4.34h3.25v65.03h-3.25v30.35c0,1.79,1.46,3.25,3.25,3.25h10.84c1.79,0,3.25-1.46,3.25-3.25v-30.35h-4.33Z"/><path class="cls-3" d="m18.5,97.73V32.7h6.98v-4.34c0-1.79-1.88-3.25-4.19-3.25H7.33c-2.31,0-4.19,1.46-4.19,3.25v99.72c0,1.79,1.88,3.25,4.19,3.25h13.95c2.31,0,4.19-1.46,4.19-3.25v-30.35h-6.98Z"/><path class="cls-3" d="m80.75,25.11h-10.84c-1.79,0-3.25,1.46-3.25,3.25v4.34h5.42v65.03h-5.42v30.35c0,1.79,1.46,3.25,3.25,3.25h10.84c1.79,0,3.25-1.46,3.25-3.25V28.36c0-1.79-1.46-3.25-3.25-3.25Z"/><path class="cls-3" d="m142.55,25.11h-13.35c-2.21,0-4.01,1.46-4.01,3.25v4.34h6.68v65.03h-6.68v30.35c0,1.79,1.8,3.25,4.01,3.25h13.35c2.21,0,4-1.46,4-3.25V28.36c0-1.79-1.8-3.25-4-3.25Z"/><path class="cls-3" d="m98.09,97.73V32.7h5.42v-4.34c0-1.79-1.46-3.25-3.25-3.25h-10.84c-1.79,0-3.25,1.46-3.25,3.25v99.72c0,1.79,1.46,3.25,3.25,3.25h10.84c1.79,0,3.25-1.46,3.25-3.25v-30.35h-5.42Z"/><path class="cls-3" d="m119.77,97.73V32.7h3.25v-4.34c0-1.79-1.46-3.25-3.25-3.25h-10.84c-1.79,0-3.25,1.46-3.25,3.25v4.34h3.25v65.03h-3.25v30.35c0,1.79,1.46,3.25,3.25,3.25h10.84c1.79,0,3.25-1.46,3.25-3.25v-30.35h-3.25Z"/></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_mandolin45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{fill:#5e6e82;stroke:#fff;stroke-miterlimit:10;stroke-width:6px;}.cls-2{fill:#fff;stroke-width:0px;}</style></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><path class="cls-1" d="m3,74.82C3,35.15,35.15,3,74.82,3s71.82,32.15,71.82,71.82-32.15,71.82-71.82,71.82S3,114.48,3,74.82Z"/><path class="cls-2" d="m126.83,33.02c-.64-.68-1.51-1.16-2.26-1.74-.51-.39-.99-.81-1.73-1.42,1.16-1.16,2.2-2.2,3.24-3.24-1.19-1.19-2.38-2.38-3.57-3.57-.82.82-1.63,1.63-2.74,2.73-.94-1.31-1.74-2.44-2.56-3.56-.39-.52-.74-1.15-1.27-1.46-.62-.37-1.4-.45-2.12-.66-.12.64-.23,1.29-.35,1.93-.37-.09-.92-.23-1.62-.4.03.62.06,1.06.08,1.49-1.5-.08-2.85,1.15-2.93,2.72-.92.02-2.04-.25-2.21,1.17-.13,1.05,1.01,2.84,2.19,2.91,1.69.1,2.21,1.47,3.37,2.4-.62.53-1.13.97-1.89,1.61-.81-1.19-1.48-2.33-2.31-3.34-.64-.77-1.45-1.42-2.27-2-.26-.18-.97-.15-1.13.06-.24.29-.37.97-.19,1.25.52.8,1.15,1.57,1.87,2.19,1.01.84,2.15,1.53,3.32,2.34-1.52,1.52-2.79,2.86-4.13,4.12-7.05,6.61-14.12,13.19-21.16,19.81-.69.65-1.38.9-2.33.96-6.89.47-13.8.77-20.65,1.6-8.1.98-15.4,4.38-22.25,8.66-3.62,2.27-6.96,4.99-10.43,7.49-.26.19-.55.32-.83.47-2.25,2.25-4.49,4.49-6.74,6.74-1.52,2.06-3.14,4.04-4.53,6.18-2.85,4.38-4.73,9.08-4.36,14.46.23,3.29,1.32,6.27,3.2,8.97.15.21.23.48.34.72,6.14,6.14,12.29,12.29,18.43,18.43,1.98,1,3.87,2.29,5.96,2.96,6.23,2,11.97.31,17.33-2.94,2.14-1.3,4.07-2.94,6.1-4.42.29-.21.62-.37.93-.56,2.31-2.31,4.62-4.62,6.94-6.94,1.65-2.18,3.38-4.31,4.94-6.56,5.52-7.96,10.15-16.42,11.53-26.11,1.03-7.19,1.22-14.49,1.82-21.74.05-.59.25-1.3.63-1.72,7.9-8.51,15.85-16.99,23.78-25.48.44-.47.91-.91,1.64-1.64.51.96.79,1.82,1.34,2.46.75.88,1.6,1.79,2.6,2.3.85.44,1.81-.56,1.35-1.41-.54-.99-1.45-1.84-2.35-2.57-.68-.55-1.58-.83-2.57-1.33.65-.73,1.01-1.13,1.6-1.79.67.98,1.2,1.87,1.85,2.66.58.71,1.22,1.41,1.97,1.92.35.24,1.11.2,1.49-.02.22-.13.14-.92.04-1.37-.1-.41-.41-.76-.64-1.15,1.74.77,3.3-.35,3.3-2.22.51-.25,1.28-.41,1.35-.72.11-.51-.06-1.27-.42-1.65ZM43.3,114.22c-4.97,0-9-4.03-9-9s4.03-9,9-9,9,4.03,9,9-4.03,9-9,9ZM112.99,31.18c-.98-.28-2.06-2.13-1.79-3.36,1.07.93,2.01,1.74,3.25,2.82-.68.27-1.14.63-1.46.54Zm1.29-5.79c.92.92,1.81,1.81,2.7,2.7-1.49-.2-2.72-1.6-2.7-2.7Zm4.2,1.32c-.21.13-.66.21-.8.08-.94-.86-1.83-1.78-2.73-2.69.12-.13.23-.26.35-.39,1.59.03,2.27,1.39,3.24,2.31.11.11.07.61-.05.69Zm.23,8.3q.89-1.23,2.76,1.96c-.92-.65-1.84-1.31-2.76-1.96Z"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.4 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_oboe45_inverted.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 5.0 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_other45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{fill:#5e6e82;stroke:#fff;stroke-miterlimit:10;stroke-width:6px;}.cls-2{fill:#fff;stroke-width:0px;}</style></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><path class="cls-1" d="m3,74.82C3,35.15,35.15,3,74.82,3s71.82,32.15,71.82,71.82-32.15,71.82-71.82,71.82S3,114.48,3,74.82Z"/><g id="layer1"><path id="path2159" class="cls-2" d="m53.79,98.05c-13.61-25.54-34.51-21.24-41.01-3.38-4.17,11.47,7.5,31.24,34.55,22.94,14.6-18.16,41.84-49.49,56.44-67.65,10.72,36.33.61,41.02-13.66,52.67,12.87,2.22,34.94-3.01,33.95-40.24-.97-16.83.24-18.19,1.21-36.36-2.53-2.25-3.8-3.03-6.33-5.27-18.39,21.77-46.76,55.52-65.15,77.29Z"/></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 788 B

1
jam-ui/src/assets/img/instruments/icon_instrument_piano45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{clip-path:url(#clippath);}.cls-2{fill:none;}.cls-2,.cls-3{stroke-width:0px;}.cls-4{fill:#fff;stroke:#5e6e82;stroke-miterlimit:10;stroke-width:6px;}.cls-3{fill:#5e6e82;}</style><clipPath id="clippath"><path class="cls-2" d="m3,74.82C3,35.15,35.15,3,74.82,3s71.82,32.15,71.82,71.82-32.16,71.82-71.82,71.82S3,114.48,3,74.82Z"/></clipPath></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><path class="cls-4" d="m3,74.82C3,35.15,35.15,3,74.82,3s71.82,32.15,71.82,71.82-32.16,71.82-71.82,71.82S3,114.48,3,74.82Z"/><g class="cls-1"><path class="cls-3" d="m61.24,97.73V32.7h3.25v-4.34c0-1.79-1.46-3.25-3.25-3.25h-10.84c-1.79,0-3.25,1.46-3.25,3.25v4.34h4.33v65.03h-4.33v30.35c0,1.79,1.46,3.25,3.25,3.25h10.84c1.79,0,3.25-1.46,3.25-3.25v-30.35h-3.25Z"/><path class="cls-3" d="m40.65,97.73V32.7h4.34v-4.34c0-1.79-1.46-3.25-3.25-3.25h-10.84c-1.79,0-3.25,1.46-3.25,3.25v4.34h3.25v65.03h-3.25v30.35c0,1.79,1.46,3.25,3.25,3.25h10.84c1.79,0,3.25-1.46,3.25-3.25v-30.35h-4.34Z"/><path class="cls-3" d="m18.5,97.73V32.7h6.98v-4.34c0-1.79-1.88-3.25-4.19-3.25H7.33c-2.31,0-4.19,1.46-4.19,3.25v99.72c0,1.79,1.88,3.25,4.19,3.25h13.95c2.31,0,4.19-1.46,4.19-3.25v-30.35h-6.98Z"/><path class="cls-3" d="m80.75,25.11h-10.84c-1.79,0-3.25,1.46-3.25,3.25v4.34h5.42v65.03h-5.42v30.35c0,1.79,1.46,3.25,3.25,3.25h10.84c1.79,0,3.25-1.46,3.25-3.25V28.36c0-1.79-1.46-3.25-3.25-3.25Z"/><path class="cls-3" d="m142.55,25.11h-13.35c-2.21,0-4.01,1.46-4.01,3.25v4.34h6.68v65.03h-6.68v30.35c0,1.79,1.8,3.25,4.01,3.25h13.35c2.21,0,4-1.46,4-3.25V28.36c0-1.79-1.8-3.25-4-3.25Z"/><path class="cls-3" d="m98.09,97.73V32.7h5.42v-4.34c0-1.79-1.46-3.25-3.25-3.25h-10.84c-1.79,0-3.25,1.46-3.25,3.25v99.72c0,1.79,1.46,3.25,3.25,3.25h10.84c1.79,0,3.25-1.46,3.25-3.25v-30.35h-5.42Z"/><path class="cls-3" d="m119.77,97.73V32.7h3.25v-4.34c0-1.79-1.46-3.25-3.25-3.25h-10.84c-1.79,0-3.25,1.46-3.25,3.25v4.34h3.25v65.03h-3.25v30.35c0,1.79,1.46,3.25,3.25,3.25h10.84c1.79,0,3.25-1.46,3.25-3.25v-30.35h-3.25Z"/></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_saxophone45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{fill:#5e6e82;stroke:#fff;stroke-miterlimit:10;stroke-width:6px;}.cls-2{fill:#fff;stroke-width:0px;}</style></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><path class="cls-1" d="m3,74.82C3,35.15,35.16,3,74.82,3s71.82,32.15,71.82,71.82-32.15,71.82-71.82,71.82S3,114.48,3,74.82Z"/><path class="cls-2" d="m43.81,98.48c-.41-.17-.71.13-.83.32-.22.33-.01.83.13.93.1.08.25.1.37.08.46.03.69.77.69.77-.08.26.15,1.14.15,1.14l-.61.46-1.94-1.31c.03-.65-.6-.74-.86-.67-.17.05-.31.16-.37.24-.16.19-.15.49-.15.49,0,0-.03.29-.36.31-.69-.06-.72.33-.68.53.04.2-.1.26-.1.26l-1.23,1.03s-.19.23-.36.22c-.67-.07-.29.44-.29.44,0,0-2.47,2.2-2.57,2.22-.88-.81-1.31.45-1.31.45-.5,1.19-1.08,1.71-1.08,1.71l-1.44,1.23s-.07.08-.14.06c-.69-.21-.58.46-.56.55.02.1-.1.14-.1.14,0,0-.34.24-.68.54-.69-.33-.48.47-.48.47l-.44.37c-.27-.18-.56.05-.68.21-.13.19-.14.45-.11.58.06.26.38.45.5.45.13,0,.27-.06.27-.06l.34.23s-.05.16.79,1.3c.85,1.14.34,1.76.34,1.76-.78,1.51-1.15,3.13-1.15,3.13-1.48,4.19.54,8.91.54,8.91l1.26,2.59c2.28,4.99,7.45,4.17,8,4.06.55-.11,1.75-.34,1.75-.34,1.18-.17,2.3-.58,3.33-1.09,1.67-.82,3.08-1.88,4.08-2.59,1.61-1.14,1.74-1.16,1.74-1.16,0,0,.36-.1.61-.5.32-.06.6-.54.6-.54.46-.23.71-.87.71-.87.5-.34,10.91-8.68,10.91-8.68,9.45-7.16,15.13-8.23,15.13-8.23,4.64,8.9,11.49,4.77,14.03.98,2.06-3.07,2.88-6.93,2.88-6.93,1.64-8.79-1.65-13.87-4.31-15.69-2.51-1.72-5.49-1.1-7.21-.07-2.48,1.49-4.29,4.49-4.29,4.49,0,0-3.95.83-9.35,4-1.56.91-3.37,2.22-5.02,3.45,0,0,0-.33-.16-.6,0,0,.24-.49.57-.46.33.04.46-.41.46-.41,0,0,.07-.26.33-.49.26-.23,12.71-11.85,12.71-11.85l4.4-4.18s.95.72,1.26.84c0,.03.34,1.05,1.21,1.63.8.54,2.88.74,3.92-.59l1.64-2.43s.17-.29.17-.43c0-.17-.04-.4-.25-.59,0,0,.24-.49-.5-.63-.37.03-.25.11-.48-.04,0,0,.86-.22,1.04-.66.11-.29.04-1.09-1.62-1.17,0,0-.21,0-.26-.24-.05-.25-.07-.21,0-.33.02-.02.37-.21.56-.56.25-.46.36-1.72-1.23-2.08,0,0,.65-.2.85-.59,0,0,.86.01,1.26-.64.21-.34.46-.92.04-1.65,0,0,.21-.42.35-.45,0,0,.46.32.94.28.41-.04,1.15-.52.98-1.4,0,0,.16.13.45-.09.16-.12.77-.24,1.26.01.38.2.79.59.65,1.42,0,0,.08.52-1.23,2.47-1.17,1.44-.23,1.06-.23,1.06,0,0,1.67-.42,2.6-3.29.55-.11,1-.4,1.36-.77.89-.92,1.3-1.82,1.21-2.28,0,0-.73-1.17-.69-1.73.27-.4.7-.68.7-.68,0,0,1.13,1.43.34,2.9-.79,1.47-1.38,1.86-.7,1.92,0,0,.83-.13,1.46-1.1.39-.59.87-1.75.7-2.89,0,0-.16-1.27.18-1.78,0,0,1.37.06,2.11-2.3,0,0,.39-1.18,1.72-2.26l6.6-6.18s1.21-1.04,1.9-2.06c.37-.55.93-1.27,1.23-1.88.26-.54.4-.58-.1-1.18,0,0-.28.03-.37.17l-.13-.08s-.13-.02.49-.56c.62-.54,2.96-2.73,2.96-2.73,0,0,.18.08.33-.06.15-.14,2.03-1.82,2.03-1.82,0,0,.18.18.26.05.13.09.29.19.29.19,0,0-.03,0,.12-.02.14-.03.4-.14.4-.14,0,0,.09-.04.11.08,0,.04.04.18.12.34.19.36,1.2,1.08,1.41,0,0,0,.02-.53-.3-.86-.32-.33-.55-.33-.62-.69,0,0-.07-.05-.14-.09-.07-.05.12-.34-.04-.52.55-.49,1.83-1.89,1.83-1.89,0,0,.08-.01.15-.03.04,0,.88.04,1.92-.6,1.08-.66,2.9-2.47,3.19-5.01,0,0,.04-.51.53-1.37.2-.35.47-1.3.42-2.5-.03-.86-.03-1.29-.41-2-.25-.46-.71-1.31-1.4-2.21-.37-.48-.8-.98-1.29-1.44,0,0-.67-.58-1.29-1.01.29-.87-.51-.73-.51-.73,0,0,0-.72-.82-.42-.11.16-.21.26-.21.26,0,0,.02.12-.37-.06-.39-.18-1.67-.83-1.67-.83,0,0-.17-.04-.33,0-.22.05-.71.43-.21.89,0,0-.22.05-.27.24-.03.12-1.7-.67-2.97-1.62-.78-.58-1.04-1.19-1.42-1.76,0,0,0-.54-.21-.99-.21-.44-.7-2.57-.71-3.08,0-.51.24-.68-.16-1.42,0,0-.8-1.89-.84-2.01-.03-.12-.39-1.02-1.34-2.3-.27-.37-.71-.45-.71-.45,0,0-.58-.2-.91-.07l-2.95-1.99s-.11-.08-.23-.09c-.13-.01-.38.04-.37.33,0,0,.75,3.34,1.21,4.54.09.3-.01.53-.01.53,0,0-.02.3-.02.35l-.42-.13s.03-.18.03-.35c0-.14-.11-.34-.26-.45-.12-.08-.41-.15-.67-.06-.28.09-.68.53-.63,1.04.02.18.05.36.25.52,0,0,.36.29.79-.09,0,0,.24.12.32.33-.01.02-.41.2-.6.46-.12.16-.27.62-.12.92.12.24.63.5,1.1.14,0,0,.26.21.28.39.03.14.51.43.51.43l.82.56s.17.09.35,0c.18-.08.5.32.5.32l1.41,2.3s.06.13.33.34c.13.23.4.78.4.78,0,0,.12.23.52.45,0,0,.25.81.99,1.84.77,1.08,1.74,2.25,4.17,3.35,0,0,.96.49,2.03,1.27,2.12,1.54,2.67,2.42.97,6.3,0,0-.71,1.05-1.35,1.66-.34-.36-.51-.11-.51-.11,0,0-.2.3-.46.34-.12.02-.23-.04-.4-.16l-.65-.44s-.41-.2-.42.49c0,.38.66.86.66.86l-1.73,1.5-.74-.51s0-.22-.09-.4c-.08-.14-.37-.35-.67-.33-.22.02-.51.2-.6.62l-.22.22s-.65-.33-.51.43c-.25.25-2.84,2.41-2.84,2.41l-.07-.05s-.03-.12-.11-.23c-.08-.11-.34-.32-.62-.3-.24.01-.71.4-.64.75,0,0,0,.05-.11.04-.11,0-.51-.19-.47.44-.02.15-.3.32-.3.32l-28.84,24.89s-.31-.33-.68-.23c-.18.05-.6.19-.85.52-.19.25-.35.67-.06,1.12l-18.35,15.96s-.37-.53-.72-.21c-.35.32-.21.31-.56.38-.35.07-.6.06-.37.55.05.08.13.09.13.09,0,0,.08.05.09.13.02.08.15.23-.03.18,0,0-.3-.26-.76-.25-.29,0-.61.22-1.04.48,0,0-.58.41-1.04.42,0,0-.13-1-.63-.27,0,0-.55.98-1.2,1.49-.65.5-.89.81-.83,1.16-.37-.36-.67.21-.67.21,0,0-.9,1.01-1.31,1.29-.41.27-.28.7-.15.95.13.25-.05.05-.05.05,0,0-.2-.66-.63-.39-.25.17-.6.6-.6.6,0,0-.3.35-.74.67s-.91.82-.46,1.71l-3.5,2.92s-.16-.09-.31-.09c-.17,0-.47.19-.29.64l-.52.41Z"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.8 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_trombone45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{fill:none;}.cls-1,.cls-2{stroke-width:0px;}.cls-2{fill:#fff;}</style></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><path class="cls-2" d="m74.82,149.64C33.56,149.64,0,116.07,0,74.82S33.56,0,74.82,0s74.82,33.56,74.82,74.82-33.56,74.82-74.82,74.82Zm0-143.64C36.87,6,6,36.87,6,74.82s30.87,68.82,68.82,68.82,68.82-30.87,68.82-68.82S112.77,6,74.82,6Z"/><circle class="cls-1" cx="74.82" cy="74.82" r="71.82" transform="translate(-14.55 18.17) rotate(-12.63)"/><path class="cls-2" d="m140.94,46.75c-10.63,7.91-24.18,17.99-31.49,23.41-10.36,7.67-12.91,9.6-18.91,13.97-2.79,2.03-5.46,3.96-8.06,5.83.03-.05.07-.1.11-.15-.06-.15-.14-.2-.37-.14-.2.07-.26,0-.89.46-.67.49-1.73,1.32-3.08,2.35-.39.28-.81.59-1.26.91l-.97-4.86c1.12-.82,2.34-1.72,3.13-2.3,1.18-.9,1.94-1.52,2.25-1.81-.09-.01-.2-.07-.3-.12.16-.12.31-.23.47-.35.16,1.18.36,2.26.51,3.16.16,1.07.39,1.99.55,2.68.53-.39,1.07-.78,1.6-1.16l-1.04-5.89c.6-.45,1.22-.92,1.89-1.42,9.76-7.36,32.26-24.16,41-30.76,8.63-6.49,4.96-3.94,10.65-8.21.47-.35.99-.75,1.54-1.16-.4-.75-.82-1.49-1.24-2.23-.71.54-1.42,1.08-2.11,1.62-6.36,4.84-13.13,9.89-19.76,14.89-6.64,5.02-12.72,9.58-19.75,14.83-4.73,3.49-10.81,7.88-15.84,11.56,0-.04,0-.07.02-.11-.05-.14-.17-.16-.3-.14-.15.03.02-.16-.59.32-.69.49-1.86,1.47-3.26,2.56-1.45,1.11-3.14,2.4-5.2,3.95-.13.19-.22.39-.26.6-1.12.9-1.76,1.48-2.45,2.09l-2.65-1.81-.52.08-5.82-4.01-.27-.64-2.34-1.6c.12-.11.25-.22.37-.33,4.96-4.36,10.01-8.83,14.22-12.31,4.12-3.42,7.38-5.88,10.65-8.21,3.27-2.34,6.51-4.48,8.87-5.69,2.28-1.18,3.61-1.26,4.91-1.36,1.28-.08,1.9.56,2.77.91.81.36,1.03.7,2.21,1.25,1.15.59,3.62,1.96,4.66,2.07.97.07,1.34-.35,1.33-1.52-.05-1.15-.53-3.2-1.53-5.3-1.07-2.1-3.02-5-4.58-7.1-1.58-2.06-2.83-3.43-4.74-5.31-1.97-1.92-4.99-4.51-6.8-5.95-1.84-1.39-2.89-2.09-4-2.49-1.15-.4-2.09-.22-2.68-.05-.64.17-.91.45-1,1.02-.13.64.11,1.67.38,2.54.26.86.72,1.61,1.18,2.47.4.86.85,1.75,1.3,2.71.18,1.02,0,2.33-.6,3.92-.61,1.62-1.5,3.41-2.97,5.63-1.51,2.25-2.03,3.19-6.03,7.69-4.11,4.56-12.91,13.77-18.15,19.14-5.21,5.35-8.43,8.14-13.04,12.65-4.73,4.53-10.85,10.4-14.88,14.2-4.07,3.77-7.24,6.08-9.12,8.35-1.73,2.11-2.04,3.42-2.03,4.86,1.58,2.19,3.28,4.29,5.1,6.28,1.15.48,2.41.84,3.58.93,2.25.2,4.67-.47,6.92-1.49,2.14-1.06,3.15-2.29,6.06-4.68,2.88-2.38,6.32-5.44,11.33-9.46,4.99-4.03,12.52-9.77,18.5-14.37,1.31-1.01,2.4-1.85,3.4-2.61.08.03.16.06.24.08.37-.27,1.14-.79,2.28-1.63.11.64.27,1.46.39,2.1.12.95.31,1.87.44,2.81-.6.42-1.21.85-1.88,1.32-.2.29-.3.61-.28.94l-.92.76c-.01.12-.05.3-.18.43-.16.14-.34.33-.62.5-.22-.17-.35-.23-.47-.17-.12.08-.21.25-.22.55l-.91.54c-.38-.3-.83-.42-1.36-.32-.56.08-1.19.35-1.88.8l-.15-.1c-.16-.33-.4-.43-.69-.34-.29.08-.65.4-1.07.89-.21.76-.28,1.4-.16,2.06.1.66.25,1.21.81,1.77.52.56,1.27,1.07,2.29,1.56l1.14-.57-.03-.46c.42-.08.79-.4,1.14-1,.31-.6.58-1.45.83-2.56l.91-.6c.21.08.29.11.44.04.07-.07.17-.17.19-.4.18-.2.33-.35.53-.45.15-.1.32-.14.5-.1l1.3-.79c.13.06.25.13.4.17.41-.29,1.19-.86,2.45-1.77,1.25-.92,3.69-2.66,4.92-3.61,1.18-.93,1.85-1.56,2.09-1.96-.03,0-.08-.02-.12-.02,2.09-1.52,4.42-3.23,7.01-5.14,7.27-5.39,17.27-12.92,27.09-20.21,7.25-5.4,16.27-12.06,23.85-17.7-.29-.74-.57-1.49-.88-2.22ZM28.54,121.66c-1.62.49-2.84.34-4.02.07-1.26-.25-2.3-.9-3.11-1.54-.84-.6-1.45-1.26-1.68-2.12-.28-.83-.61-1.6.23-2.9.68-1.09,1.14-1.54,3.27-3.44.67.47,1.16.83,1.56,1.1.41.3.64.46.74.49h.43s5.29,3.7,5.29,3.7l.31.83,1.72,1.22c-1.93,1.38-3.33,2.11-4.74,2.57Zm6.22-3.71l-1.87-1.28-.52.08-5.82-4.01-.27-.64-1.94-1.34c.15-.13.29-.26.45-.41,1.15-1.03,2.69-2.37,4.43-3.87.96.65,1.66,1.11,2.17,1.43.49.34.73.5.73.48h.44s5.29,3.7,5.29,3.7l.31.83,1.28.86c-1.85,1.65-3.3,3.01-4.68,4.16Zm30.54-24.96c-2.98,2.35-6.06,4.58-9.95,7.7-3.96,3.15-9.86,7.96-13.46,10.97-.41.35-.81.69-1.19,1.02l-1.23-.95-.51.09-5.81-4.02-.28-.64-2.46-1.7c3.38-2.89,7.28-6.2,10.5-9.01,4.74-4.14,9.32-8.31,13.84-12.28.88.59,1.54,1.03,2.02,1.33.51.35.74.51.74.49l.43-.02,5.3,3.71.31.83,2.56,1.82c-.24.2-.5.41-.81.65Z"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.0 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_trumpet45_inverted.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 9.1 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_tuba45_inverted.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 6.8 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_ukelele45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{fill:#5e6e82;stroke:#fff;stroke-miterlimit:10;stroke-width:6px;}.cls-2{fill:#fff;stroke-width:0px;}</style></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><path class="cls-1" d="m3,74.82C3,35.15,35.15,3,74.82,3s71.82,32.15,71.82,71.82-32.15,71.82-71.82,71.82S3,114.48,3,74.82Z"/><path class="cls-2" d="m59.24,114.82c-.1-1.93.86-4.31,1.56-6.72.31-.95,1.06-1.68,2.03-2.29.22-.21.3-.34.29-.42,1.09-.37,2.7-.95,5.05-1.84,13.25-5,13.54-19.4,8.27-25.25l-1.08-1.07,29.96-30.95-7.15-7.1-31.18,29.71-1.54-1.54c-6.06-4.95-18.55-5.46-24.18,7.02-1.96,4.35-2.71,6.18-2.91,6.81-.61.75-1.16,1.43-2.16,1.9-3.15,1.21-4.97,1.6-8.21,2.11-16.7,2.59-28.68,22.06-8.74,40.09,19.05,20.62,37.27,7.11,39.99-10.46Zm2.6-32.09c2.92,2.9,2.81,7.75-.25,10.83-3.06,3.08-7.91,3.22-10.83.32-2.92-2.9-2.81-7.75.25-10.83,3.06-3.08,7.91-3.22,10.83-.32Zm-26.23,37.46c-.49-.38-.99-.15-.99-.15l-10.55-10.49s.23-.51-.1-.94c-.33-.43-1.68-1.28-1.68-1.28l.1-.1h0s3.14-3.18,3.14-3.18l.13.09,14.51,14.41-.1.1h0s-3.14,3.17-3.14,3.17c0,0-.84-1.26-1.33-1.63Z"/><path class="cls-2" d="m123.38,21.52c-2.68-.41-6.03-1.52-7.47-3.59,0,0,0,0-.3.02l-14.13,15.07c.03,1.56-.81,3.14-2.31,4.96-.16.22-.29.43-.34.62l7.54,6.6c1.61-1.42,3.32-2.4,4.98-2.37l15.39-13.82c-2.08-2.5-3.18-5.01-3.36-7.48Zm-6.05.71c.64.64.62,1.71-.05,2.38-.67.67-1.74.69-2.38.05-.64-.64-.62-1.71.05-2.38s1.74-.69,2.38-.05Zm-10.36,10.55c-.64-.64-.62-1.71.05-2.38.67-.67,1.74-.69,2.38-.05.64.64.62,1.71-.05,2.38-.67.67-1.74.69-2.38.05Zm15.3-5.43c.64.64.62,1.71-.05,2.38-.67.67-1.74.69-2.38.05-.64-.64-.62-1.71.05-2.38.67-.67,1.74-.7,2.38-.05Zm-10.34,10.42c-.64-.64-.62-1.71.05-2.38.67-.67,1.74-.69,2.38-.05.64.64.62,1.71-.05,2.38-.67.67-1.74.69-2.38.05Z"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

22
jam-ui/src/assets/img/instruments/icon_instrument_unknown45_inverted.svg Normal file
View File

@ -0,0 +1,22 @@
<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
<svg height="800px" width="800px" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
viewBox="0 0 422.686 422.686" xml:space="preserve">
<g>
<g>
<path style="fill:#010002;" d="M211.343,422.686C94.812,422.686,0,327.882,0,211.343C0,94.812,94.812,0,211.343,0
s211.343,94.812,211.343,211.343C422.694,327.882,327.882,422.686,211.343,422.686z M211.343,16.257
c-107.565,0-195.086,87.52-195.086,195.086s87.52,195.086,195.086,195.086c107.574,0,195.086-87.52,195.086-195.086
S318.917,16.257,211.343,16.257z"/>
</g>
<g>
<g>
<path style="fill:#010002;" d="M192.85,252.88l-0.569-7.397c-1.707-15.371,3.414-32.149,17.647-49.227
c12.811-15.078,19.923-26.182,19.923-38.985c0-14.51-9.112-24.182-27.044-24.467c-10.242,0-21.622,3.414-28.735,8.819
l-6.828-17.924c9.388-6.828,25.605-11.38,40.692-11.38c32.726,0,47.52,20.2,47.52,41.83c0,19.346-10.811,33.295-24.483,49.511
c-12.51,14.794-17.07,27.312-16.216,41.83l0.284,7.397H192.85V252.88z M186.583,292.718c0-10.526,7.121-17.923,17.078-17.923
c9.966,0,16.785,7.397,16.785,17.924c0,9.957-6.544,17.639-17.07,17.639C193.419,310.349,186.583,302.667,186.583,292.718z"/>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_upright_bass45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{fill:#5e6e82;stroke:#fff;stroke-miterlimit:10;stroke-width:6px;}.cls-2{fill:#fff;stroke-width:0px;}</style></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><path class="cls-1" d="m3,74.82C3,35.15,35.15,3,74.82,3s71.82,32.15,71.82,71.82-32.15,71.82-71.82,71.82S3,114.48,3,74.82Z"/><polygon class="cls-2" points="113.34 39.2 113.84 38.71 114.29 38.26 114.06 38.46 113.34 39.2"/><path class="cls-2" d="m119.43,40.37l-1.42-1.42-.67.76,1.37,1.4c-.5.59-.63,1.44.09,2.03.49.4,1.61.41,2.41-.33.72-.66.66-1.91.04-2.52-.48-.48-1.2-.49-1.83.08Z"/><path class="cls-2" d="m60.42,91.41c.02.06.04.11.06.17l.96.93.19-.2,51.71-53.12-52.77,52.06-.15.15Z"/><path class="cls-2" d="m62.11,94.46l.07-.07-1.06-1.06-8.23,8.22c.29.28.58.53.88.77l8.33-7.86Z"/><path class="cls-2" d="m62.59,94.78l-.15-.15-.08.08-8.29,7.83c.34.25.68.49,1.03.71l8.15-7.09c-.52-.51-.92-1.01-.66-1.38Z"/><path class="cls-2" d="m52.65,101.3l8.23-8.23-.95-.95c-.06,0-.12-.02-.18-.04l-7.84,8.39c.24.29.49.57.74.82Z"/><path class="cls-2" d="m66.46,121.83c4.21-7.26,5-11.51,8.51-11.37l.34-1.01c-6.41-3.32-1.48-9.88.93-12.39,2.29-2.38,5.38-4.19,8.51-.93l1.01-.34c-.12-2.72,2.17-3.57,3.96-4.8,3.84-2.4,8.3-5.38,9.52-11.88.86-4.57-.07-10.05-4.8-15.59l-.09-.09,6.71-7.24-36.18,38.88-.1.1c.32.3.65.66.97,1.09l-1.1,1.26c-.25-.32-.71-.72-1.14-1.12l-8.09,7.04c.13.08.26.15.39.23-2.08,1.89-4.19,3.64-6.49,4.63-4.14,2.52-5.54,4.39-8.43,7.33-1.13,1.35-3.39,3.71-4.63,4.72l-2.11-2.11c1.73-1.81,3.46-3.62,5.52-5.1,2.4-1.92,4.76-3.96,6.61-7.54,1.3-2.74,3.02-4.48,4.63-6.49.25.39.51.75.77,1.08l7.72-8.27c-.64-.36-1.51-1.19-2.38-1.96l1.31-1.31c.69.76,1.49,1.39,1.95,2.38l.05-.05,53.26-52.55.71-.71.25.25-.27.27,1.81-1.6.23-.23.25.25-.24.24-2.03,1.8-52.42,53.85-.19.19,1.08,1.04.29-.29,51.7-53.85,1.54-2.02.28.22-1.56,2.04-51.71,53.86-.29.29.19.18c.43.11.86.35,1.29.69l.11-.11,51.11-54.93.26.24-2.36,2.54.23.23c2.3-1.79,4.84-4.29,6.29-7.42,0,0,0,0,0,0l-.48.99,1.24,1.27c-.5.59-.63,1.44.09,2.02.49.4,1.61.41,2.41-.33.72-.66.66-1.91.05-2.52-.48-.48-1.2-.49-1.83.08l-1.44-1.56c.43-.77.85-1.47,1.28-2.09.71.42,1.14-.22,1.62-.61.43.36,1.02,1.01,2.25-.46l-.7-.85c.55-.47.69-1.02.45-1.49.36-.52,1.23-.63.13-1.59-.57-.5-.96-1.15-1.68-.14,0,0-.01.01-.02.02-.48-.36-1.33.11-1.53.42-.41-.38-.3-.29-.81-.7-.71.5-1.54.92-.82,2.1-.36.37-.73.72-.63,1.4l-2.82,2.4-1.92-1.95c.24-.41-.29-1.07-.72-1.52-.59-.61-1.5-.78-1.85-.06-.38.79.69,1.68,1.8,2.31l1.91,1.88.35-.3-3.15,2.68-1.91-1.94c.24-.41-.42-.97-.85-1.42-.59-.61-1.65-.96-1.71-.16-.07.84.68,1.68,1.8,2.31l1.9,1.87-1.15.98c-.46.41-.9.83-.43,1.55l.04.04-20.41,19.6c-4.8-3.95-9.94-6.62-17.25-4.6-5.33,1.47-9.03,5.95-10.45,8.93-1.3,2.74-3.42,4.49-5.34,4.45-.35.92-.04.15-.43,1.04,5.02,2.92.9,6.88-.73,8.47-4.99,4.86-9.47,4.77-12.49,1.32l-1.06.23c.41,4.07-7.4,5.32-11.12,8.09-5.24,3.9-7.7,9.6-7.41,15,.32,6.12,4.26,11,9.17,15.93-.34.02-1,.89-.61,1.71l-3.63,3.79-3.53,4.04.72.72,4.67-4.92,2.75-2.83c.76.17,1.46-.38,1.41-.65l-1.52-1.6c.31.31.62.61.94.92,6.2,6.07,9.88,8.43,14.66,9.27,7.59,1.33,14.54-2.75,17.1-7.16Zm-6.36-37.28c-.18-.62.04-1.01.76-1.18-.79-2.05-3.88.5-6.7,3.5-4.3,4.15-5.82,3.23-6.82,2.19-.56-.57-1.05-2,.25-2.7.41-.22,1.29-.03,1.26.76-.01.34-.29.84-1.1.59-.12,2.24,2.18,1.41,3.12.84,2.04-1.37,3.74-3.35,5.64-5.06,1.38-1.23,3.14-2.04,4.51-.88.48.41.7,1.13.34,1.94-.51.35-.98.54-1.26,0Zm5.12,22.65c-1.04-1.01-1.96-2.53,2.19-6.82,3-2.82,5.55-5.9,3.5-6.7-.17.72-.56.94-1.18.76-.54-.29-.35-.75,0-1.26.8-.36,1.53-.15,1.94.34,1.16,1.37.35,3.13-.88,4.51-1.7,1.91-3.69,3.61-5.05,5.65-.56.94-1.4,3.23.84,3.12-.25-.81.25-1.08.59-1.1.78-.03.98.86.76,1.26-.7,1.3-2.12.81-2.7.25Z"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.6 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_viola45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{fill:#5e6e82;stroke:#fff;stroke-miterlimit:10;stroke-width:6px;}.cls-2{fill:#fff;stroke-width:0px;}</style></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><path class="cls-1" d="m3,74.82C3,35.15,35.16,3,74.82,3s71.82,32.15,71.82,71.82-32.15,71.82-71.82,71.82S3,114.48,3,74.82Z"/><path class="cls-2" d="m109.91,42.18s-1.57,1.47-1.55,2.69l-22.93,21.11s-5.42-4.95-12.5-4.74c-2.79.08-6.57.89-10.17,3.9-2.31,1.92-4.4,4.86-6.4,8.85,0,0-.79,1.51-2.85,2.05-.83.19-.91.58-.91.58l-.33.82s-.24.29.26.64c.49.35,3.9,1.87,1.1,6.18-2.79,4.31-12.94,11-15.2,3.8,0,0-1.37-.3-2.37,1.57-.93,1.69-3.94,2.63-3.94,2.63,0,0-11.2,3.26-13.46,13.8-1.08,5.04.43,9.28,2.49,12.62,2.25,3.65,4.45,6.02,6.05,7.61,0,0-.3.31.06.86.23.35,1.15,1.51,1.73,1.35,0,0,.24.54.64.32.39-.22.08-.08.08-.08,0,0,2.75,3.32,7.42,5.78,3.17,1.67,7.35,3.08,11.89,2.51,0,0,2.5-.22,5.6-1.93,2.12-1.18,4.38-3.14,6.42-6.14,1.36-2,1.55-2.76,2.86-5.58,0,0,.17-.47.48-1.08.5-.99.6-1.87,2.56-2.84,0,0,1.33-.82,1.49-1.99,0,0-6.28-1.51-1.67-9.15,0,0,1.27-2.12,3.15-3.94,2.26-2.18,6.32-4.69,8.25-1.04,0,0,.12.79.74.42l.79-.32s.41,0,.59-.66c.07-.28.2-.84.47-1.43.38-.81.75-1,2.28-1.96,0,0,2.33-1.02,4.88-2.96,3.06-2.33,6.17-6.06,6.49-10.8,0,0,.38-3.04.07-4.83-.4-2.38-1.12-5.86-3.31-8.57l21.76-22.92s.82-.8.92-1.11c.25-.16,3.56-3.69,3.56-3.69l.66.71s-.11.39.26.44c0,.25.41.42.41.42,0,0,.21.13.04.33-.17.21-.11.52.43.94.29.23,1.2,1.04,2.08,1.49.72.37,1.26.33,1.72-.16,0,0,.67-.78-.17-1.89-.84-1.11-1.72-2.09-1.72-2.09,0,0-.22-.35-.45-.17-.23.18-.46-.09-.46-.09,0,0-.06-.31-.27-.31-.21,0-.06-.44-.43-.27l-.8-.78,3.52-4.23,1.6,1.59s-.19.16.1.42c0,0-.03.37.39.33l.16.19s-1.26.95.21,2.16c.62.51,1.41.89,2.13.88.99-.01,2.32-1.08,1.99-2.91-.54-2.2-1.72-2.11-1.72-2.11,0,0-.59.07-1.01.52l-.19-.18s.08-.45-.36-.39c-.14-.25-.39-.13-.39-.13l-1.7-1.75s.83-.9.96-1.17c0,0,.13.1.21.34.07.23.6.49,1.14-.13.53-.62.58-.69.58-.69l.65.69s.49.53,1.37-.08c0,0,.21.25.6-.04.23-.18.87-.91.88-1.28,0,0,.02-.14-.12-.28-.14-.14-.86-.97-.86-.97,0,0,.57-.74.77-1.19.21-.45-.03-.53-.03-.53l-.37-.31s2.1-2.74,1.09-2.78c-.76-.04-.89-.66-.89-.66,0,0,.05-.34-.28-.39-.33-.05-.85-.43-.75-.86.06-.41-.58-.17-.58-.17l-2.09,1.23-.41-.41s-.12-.15-.38,0c0,0-.66.42-1.26,1.01l-.94-.91s-.22-.21-.76.13c-.54.34-.83.75-.83.75,0,0-.27.31-.08.68,0,0-.32.9-.04,1.19,0,0,.22.22.25.24.02.01-.35.37-.62.71-.12.14-.24.34-.18.67,0,0-.38.22-3.08,2.82-.04.02-1.54-1.67-1.54-1.67,0,0,.21-.35-.18-.48.02-.07.03-.12.02-.17-.05-.27-.39-.33-.5-.24l-.21-.2s-.08-.08.07-.23c.08-.07.41-.34.45-.75.04-.4-.07-1.04-1.15-1.59,0,0-.96-.51-1.93-.43-.9.07-2.18,1.08-1.96,2.63,0,0,.77,3.36,2.71,2.02.3-.21.45.02.45.02,0,0-.2.2-.09.32.11.12.22.23.22.23,0,0,.07.11.29.01-.05.09.11.25.11.25,0,0,.13.15.21.07.08-.08.1-.1.1-.1l1.62,1.63-2.17,2.14-.49-.48s-.67.46-1,.98c.41.47.45.52.45.52l-1.55,1.48s-.88-.87-1.33-1.42c-.18-.22-.34-.35-.26-.42,0,0,.08-.12-.17-.28.04-.06.01-.11-.04-.16-.11-.12-.26-.28-.38-.18l-.23-.19s-.06-.09.07-.21c.14-.12.51-.52-.21-.99-.71-.47-2.11-1.41-2.11-1.41,0,0-.51-.26-.99-.15-.46.11-1.37.62-.87,1.87l1.47,2.36s.33.65.72.26c.39-.39.3-.29.3-.29l.24.23s-.11.12-.01.22c.09.09.21.22.21.22,0,0,.07.06.14,0l.16.19s.08.06.24,0c.13,0,1.65,1.55,1.65,1.55Z"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.2 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_violin45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{fill:#5e6e82;stroke:#fff;stroke-miterlimit:10;stroke-width:6px;}.cls-2{fill:#fff;stroke-width:0px;}</style></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><path class="cls-1" d="m3,74.82C3,35.15,35.16,3,74.82,3s71.82,32.15,71.82,71.82-32.15,71.82-71.82,71.82S3,114.48,3,74.82Z"/><path class="cls-2" d="m109.92,42.19s-1.57,1.47-1.55,2.69l-22.93,21.11s-5.42-4.95-12.5-4.74c-2.79.08-6.57.89-10.17,3.9-2.31,1.92-4.4,4.86-6.4,8.85,0,0-.79,1.51-2.85,2.05-.83.19-.91.58-.91.58l-.33.82s-.24.29.26.64c.49.35,3.9,1.88,1.1,6.18-2.79,4.31-12.94,11-15.2,3.8,0,0-1.37-.3-2.37,1.57-.93,1.69-3.94,2.63-3.94,2.63,0,0-11.2,3.26-13.46,13.8-1.08,5.04.43,9.28,2.49,12.62,2.25,3.65,4.45,6.02,6.05,7.61,0,0-.3.31.06.86.23.35,1.15,1.51,1.73,1.35,0,0,.24.54.64.32.39-.22.08-.08.08-.08,0,0,2.75,3.32,7.42,5.78,3.17,1.67,7.35,3.08,11.89,2.51,0,0,2.5-.22,5.6-1.93,2.12-1.18,4.38-3.14,6.42-6.14,1.36-2,1.55-2.76,2.86-5.58,0,0,.17-.47.48-1.09.5-.99.6-1.87,2.56-2.84,0,0,1.33-.81,1.49-1.99,0,0-6.28-1.51-1.67-9.15,0,0,1.27-2.12,3.15-3.94,2.26-2.18,6.32-4.69,8.25-1.04,0,0,.12.79.74.42l.79-.32s.41,0,.59-.66c.07-.28.2-.84.47-1.43.38-.81.75-1,2.28-1.96,0,0,2.33-1.02,4.88-2.96,3.06-2.33,6.17-6.06,6.49-10.8,0,0,.38-3.04.07-4.83-.4-2.38-1.12-5.86-3.31-8.57l21.76-22.92s.82-.8.92-1.11c.25-.16,3.56-3.69,3.56-3.69l.66.71s-.11.39.26.44c0,.25.41.42.41.42,0,0,.21.13.04.33-.17.21-.11.52.43.94.29.23,1.2,1.04,2.08,1.49.72.37,1.26.33,1.72-.16,0,0,.67-.78-.17-1.89-.84-1.11-1.72-2.09-1.72-2.09,0,0-.22-.35-.45-.17-.23.19-.46-.09-.46-.09,0,0-.06-.31-.27-.31-.21,0-.06-.44-.43-.27l-.8-.78,3.52-4.23,1.6,1.59s-.19.16.1.42c0,0-.03.37.39.33l.17.19s-1.26.95.21,2.16c.62.51,1.41.89,2.13.88.99-.01,2.32-1.08,1.99-2.91-.54-2.2-1.72-2.11-1.72-2.11,0,0-.59.07-1.01.52l-.19-.18s.08-.45-.36-.39c-.14-.25-.39-.13-.39-.13l-1.7-1.75s.83-.9.96-1.17c0,0,.13.1.21.34.07.23.6.49,1.14-.13.53-.62.58-.69.58-.69l.65.69s.49.53,1.37-.08c0,0,.21.25.6-.04.23-.18.87-.91.88-1.28,0,0,.02-.14-.12-.28-.14-.14-.86-.97-.86-.97,0,0,.57-.74.77-1.19.21-.45-.03-.53-.03-.53l-.37-.31s2.1-2.74,1.09-2.78c-.76-.04-.89-.66-.89-.66,0,0,.05-.34-.28-.39-.33-.05-.85-.43-.75-.86.06-.41-.58-.17-.58-.17l-2.09,1.23-.41-.41s-.12-.15-.38,0c0,0-.66.42-1.26,1.01l-.94-.91s-.22-.21-.76.13c-.54.34-.83.75-.83.75,0,0-.27.31-.08.68,0,0-.32.9-.04,1.19,0,0,.22.22.25.24.02.01-.35.37-.62.71-.12.14-.24.34-.18.67,0,0-.38.22-3.08,2.82-.04.02-1.54-1.67-1.54-1.67,0,0,.21-.35-.18-.48.02-.07.03-.12.02-.17-.05-.27-.39-.34-.5-.24l-.21-.2s-.08-.08.07-.23c.08-.07.41-.34.45-.75.04-.4-.07-1.04-1.15-1.59,0,0-.96-.51-1.93-.43-.9.07-2.18,1.08-1.96,2.63,0,0,.77,3.36,2.71,2.03.3-.21.45.02.45.02,0,0-.2.2-.09.32.11.12.22.23.22.23,0,0,.07.11.29.01-.05.09.11.25.11.25,0,0,.13.15.21.07.08-.08.1-.1.1-.1l1.62,1.63-2.17,2.14-.49-.48s-.67.46-1,.98c.41.47.45.52.45.52l-1.55,1.47s-.88-.87-1.33-1.42c-.18-.22-.34-.35-.26-.42,0,0,.08-.12-.17-.28.04-.06.01-.12-.04-.16-.11-.12-.26-.28-.38-.19l-.23-.19s-.06-.09.07-.21c.14-.12.51-.52-.21-.99-.71-.47-2.11-1.41-2.11-1.41,0,0-.51-.26-.99-.15-.46.11-1.38.62-.87,1.87l1.47,2.36s.33.65.72.26c.39-.39.3-.29.3-.29l.24.23s-.11.12-.01.22c.09.09.21.22.21.22,0,0,.07.06.14,0l.16.19s.08.06.24,0c.13,0,1.65,1.55,1.65,1.55Z"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.2 KiB

1
jam-ui/src/assets/img/instruments/icon_instrument_vocal45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{fill:#5e6e82;stroke:#fff;stroke-miterlimit:10;stroke-width:6px;}.cls-2{fill:#fff;stroke-width:0px;}</style></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><circle class="cls-1" cx="74.82" cy="74.82" r="71.82" transform="translate(-15.6 129.77) rotate(-76.29)"/><path class="cls-2" d="m100.66,67.68v16.67c0,13.74-11.59,24.91-25.83,24.91s-25.84-11.17-25.84-24.91v-16.67h-11.91v16.67c0,18.04,13.37,33.08,30.95,36.21v12.43h-17.49v12.27h48.58v-12.27h-17.99v-12.34c17.83-2.93,31.45-18.09,31.45-36.3v-16.67h-11.91Z"/><path class="cls-2" d="m89.56,28.17v35.42h-5.54V24.01c-2.1-1.09-4.39-1.84-6.8-2.17v34.51h-5.54V21.85c-2.41.33-4.7,1.07-6.8,2.17v39.58h-5.55V28.17c-4.01,4.15-6.51,9.93-6.51,16.34v38.17c0,12.62,9.68,22.85,21.63,22.85s21.63-10.23,21.63-22.85v-38.17c0-6.4-2.5-12.19-6.51-16.34Z"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 957 B

1
jam-ui/src/assets/img/instruments/icon_instrument_voice45_inverted.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 149.64 149.64"><defs><style>.cls-1{fill:#5e6e82;stroke:#fff;stroke-miterlimit:10;stroke-width:6px;}.cls-2{fill:#fff;stroke-width:0px;}</style></defs><rect width="149.64" height="149.64" fill="#fff"/><g id="svg2"><circle class="cls-1" cx="74.82" cy="74.82" r="71.82" transform="translate(-15.6 129.77) rotate(-76.29)"/><path class="cls-2" d="m100.66,67.68v16.67c0,13.74-11.59,24.91-25.83,24.91s-25.84-11.17-25.84-24.91v-16.67h-11.91v16.67c0,18.04,13.37,33.08,30.95,36.21v12.43h-17.49v12.27h48.58v-12.27h-17.99v-12.34c17.83-2.93,31.45-18.09,31.45-36.3v-16.67h-11.91Z"/><path class="cls-2" d="m89.56,28.17v35.42h-5.54V24.01c-2.1-1.09-4.39-1.84-6.8-2.17v34.51h-5.54V21.85c-2.41.33-4.7,1.07-6.8,2.17v39.58h-5.55V28.17c-4.01,4.15-6.51,9.93-6.51,16.34v38.17c0,12.62,9.68,22.85,21.63,22.85s21.63-10.23,21.63-22.85v-38.17c0-6.4-2.5-12.19-6.51-16.34Z"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 957 B

2
jam-ui/src/components/client/JKSessionChatButton.js
View File

@ -52,7 +52,7 @@ const JKSessionChatButton = ({ sessionId }) => {
<img <img
src={chatIcon} src={chatIcon}
alt="Chat" alt="Chat"
style={{ width: '16px', height: '16px', marginRight: '0.2rem' }} style={{ width: '20px', height: '20px', marginRight: '0.3rem' }}
/> />
Chat Chat
</Button> </Button>

31
jam-ui/src/components/client/JKSessionInstrumentModal.js
View File

@ -8,7 +8,7 @@ import {
Table, Table,
Input, Input,
} from 'reactstrap'; } from 'reactstrap';
import { listInstruments, getInstrumentIcon45, convertClientInstrumentToServer } from '../../helpers/utils'; import { listInstruments, getInstrumentIcon45, convertClientInstrumentToServer, getInstrumentIcon45_inverted } from '../../helpers/utils';
import { server_to_client_instrument_map, ASSIGNMENT } from '../../helpers/globals'; import { server_to_client_instrument_map, ASSIGNMENT } from '../../helpers/globals';
import { useJamClient } from '../../context/JamClientContext'; import { useJamClient } from '../../context/JamClientContext';
@ -58,13 +58,6 @@ const JKSessionInstrumentModal = ({ isOpen, toggle, onSave }) => {
</ModalHeader> </ModalHeader>
<ModalBody style={{ maxHeight: '400px', overflowY: 'auto' }}> <ModalBody style={{ maxHeight: '400px', overflowY: 'auto' }}>
<Table striped hover className="fs--1"> <Table striped hover className="fs--1">
{/* <thead className="bg-200 text-900">
<tr>
<th scope="col" style={{ width: '60px' }}>Icon</th>
<th scope="col">Instrument</th>
<th scope="col" style={{ width: '80px', textAlign: 'center' }}>Select</th>
</tr>
</thead> */}
<tbody> <tbody>
{instruments.map((instrument) => ( {instruments.map((instrument) => (
<tr <tr
@ -73,37 +66,37 @@ const JKSessionInstrumentModal = ({ isOpen, toggle, onSave }) => {
className={selectedInstrumentId === instrument.id ? 'table-active' : ''} className={selectedInstrumentId === instrument.id ? 'table-active' : ''}
style={{ cursor: 'pointer' }} style={{ cursor: 'pointer' }}
> >
<td style={{ textAlign: 'center', width: '20px' }}> <td width={8} align='center'>
<Input <Input
type="radio" type="radio"
name="instrument" name="instrument"
value={instrument.id} value={instrument.id}
checked={selectedInstrumentId === instrument.id} checked={selectedInstrumentId === instrument.id}
onChange={() => setSelectedInstrumentId(instrument.id)} onChange={() => setSelectedInstrumentId(instrument.id)}
style={{ margin: 0 }} style={{ marginLeft: 3, marginRight: 6 }}
/> />
</td> </td>
<td> <td width={32}>
<img <img
height="32" height="32"
width="32" width="32"
src={getInstrumentIcon45(convertClientInstrumentToServer(instrument.id))} src={getInstrumentIcon45_inverted(convertClientInstrumentToServer(instrument.id))}
alt={instrument.description} alt={instrument.description}
/> />
<span className="ml-4">
&nbsp;
{instrument.description}
</span>
</td> </td>
<td>
{instrument.description}
</td>
</tr> </tr>
))} ))}
</tbody> </tbody>
</Table> </Table>
</ModalBody> </ModalBody>
<ModalFooter> <ModalFooter>
<Button color="secondary" onClick={handleCancel}> <Button
variant="outline-info"
outline
onClick={handleCancel}>
Cancel Cancel
</Button> </Button>
<Button color="primary" onClick={handleSave} disabled={selectedInstrumentId === null}> <Button color="primary" onClick={handleSave} disabled={selectedInstrumentId === null}>

32
jam-ui/src/components/client/JKSessionMyTrack.css
View File

@ -54,8 +54,8 @@
} }
.track-avatar img { .track-avatar img {
width: 40px; width: 50px;
height: 40px; height: 50px;
border-radius: 50%; border-radius: 50%;
} }
@ -64,14 +64,14 @@
justify-content: center; justify-content: center;
align-items: center; align-items: center;
margin-bottom: 8px; margin-bottom: 8px;
background-color: #f8f9fa; /* background-color: #f8f9fa; */
border-radius: 4px; border-radius: 4px;
padding: 4px; padding: 4px;
} }
.track-instrument img { .track-instrument img {
width: 45px; width: 50px;
height: 45px; height: 50px;
} }
.track-controls { .track-controls {
@ -141,21 +141,37 @@
} }
.track-connection-state.excellent { .track-connection-state.excellent {
background-color: #28a745; background-color: rgb(52, 116, 26)
} }
.track-connection-state.good { .track-connection-state.good {
background-color: #ffc107; background-color: rgb(249, 197, 44)
} }
.track-connection-state.poor { .track-connection-state.poor {
background-color: #fd7e14; background-color: rgb(167, 0, 0);
} }
.track-connection-state.unknown { .track-connection-state.unknown {
background-color: #6c757d; background-color: #6c757d;
} }
.vu-bg-secondary {
background-color: #fdfeff;
}
.vu-bg-danger {
background-color: rgb(167, 0, 0);
}
.vu-bg-warning {
background-color: rgb(249, 197, 44);
}
.vu-bg-success {
background-color: rgb(52, 116, 26);
}
.track-menu-container { .track-menu-container {
position: relative; position: relative;
} }

2
jam-ui/src/components/client/JKSessionMyTrack.js
View File

@ -189,7 +189,7 @@ const JKSessionMyTrack = ({
onClick={!isRemote ? handleInstrumentClick : undefined} onClick={!isRemote ? handleInstrumentClick : undefined}
style={!isRemote ? { cursor: 'pointer' } : {}} style={!isRemote ? { cursor: 'pointer' } : {}}
> >
<img src={instrumentIcon} alt="instrument" /> <img src={instrumentIcon} alt="instrument" />
{!isRemote && track?.hasVst && ( {!isRemote && track?.hasVst && (
<img <img
src={pluginIcon} src={pluginIcon}

2
jam-ui/src/components/client/JKSessionOpenMenu.js
View File

@ -104,7 +104,7 @@ const JKSessionOpenMenu = ({ onBackingTrackSelected, onJamTrackSelected, onMetro
onClick={toggle} onClick={toggle}
type="button" type="button"
> >
<img src={openIcon} alt="Open" style={{ width: '16px', height: '16px', marginRight: '0.2rem' }} /> <img src={openIcon} alt="Open" style={{ width: '20px', height: '20px', marginRight: '0.3rem' }} />
Open Open
</button> </button>

4
jam-ui/src/components/client/JKSessionRemoteTracks.js
View File

@ -3,7 +3,7 @@ import { useSelector } from 'react-redux';
import { selectActiveSession } from '../../store/features/activeSessionSlice'; import { selectActiveSession } from '../../store/features/activeSessionSlice';
import { useAuth } from '../../context/UserAuth'; import { useAuth } from '../../context/UserAuth';
import JKSessionAudioInputs from './JKSessionAudioInputs'; import JKSessionAudioInputs from './JKSessionAudioInputs';
import { getAvatarUrl, getInstrumentIcon45 } from '../../helpers/utils'; import { getAvatarUrl, getInstrumentIcon45_inverted } from '../../helpers/utils';
const JKSessionRemoteTracks = ({ mixerHelper, sessionModel }) => { const JKSessionRemoteTracks = ({ mixerHelper, sessionModel }) => {
// Phase 4: Replace CurrentSessionContext with Redux // Phase 4: Replace CurrentSessionContext with Redux
@ -35,7 +35,7 @@ const JKSessionRemoteTracks = ({ mixerHelper, sessionModel }) => {
const mixerData = mixerHelper.findMixerForTrack(participant.client_id, track, false, mixerHelper.mixMode); const mixerData = mixerHelper.findMixerForTrack(participant.client_id, track, false, mixerHelper.mixMode);
const hasMixer = !!mixerData.mixer; const hasMixer = !!mixerData.mixer;
const instrumentIcon = getInstrumentIcon45(track.instrument_id || track.instrument); const instrumentIcon = getInstrumentIcon45_inverted(track.instrument_id || track.instrument);
const trackName = name; const trackName = name;
tracks.push({ tracks.push({

266
jam-ui/src/components/client/JKSessionScreen.js
View File

@ -3,7 +3,6 @@ import React, { useEffect, useRef, useState, memo, useMemo, useCallback } from '
import { useParams, useHistory } from 'react-router-dom'; import { useParams, useHistory } from 'react-router-dom';
import { useDispatch, useSelector } from 'react-redux'; import { useDispatch, useSelector } from 'react-redux';
//import useJamServer, { ConnectionStatus } from '../../hooks/useJamServer'
import useGearUtils from '../../hooks/useGearUtils' import useGearUtils from '../../hooks/useGearUtils'
import useSessionUtils from '../../hooks/useSessionUtils.js'; import useSessionUtils from '../../hooks/useSessionUtils.js';
import useSessionModel from '../../hooks/useSessionModel.js'; import useSessionModel from '../../hooks/useSessionModel.js';
@ -63,8 +62,8 @@ import { MessageType } from '../../helpers/MessageFactory.js';
import { Alert, Col, Row, Button, Card, CardBody, Modal, ModalHeader, ModalBody, ModalFooter, CardHeader, Badge, UncontrolledTooltip, Spinner } from 'reactstrap'; import { Alert, Col, Row, Button, Card, CardBody, Modal, ModalHeader, ModalBody, ModalFooter, CardHeader, Badge, UncontrolledTooltip, Spinner } from 'reactstrap';
import FalconCardHeader from '../common/FalconCardHeader'; import FalconCardHeader from '../common/FalconCardHeader';
import SessionTrackVU from './SessionTrackVU.js'; //import SessionTrackVU from './SessionTrackVU.js';
import JKSessionMyTrack from './JKSessionMyTrack.js'; //import JKSessionMyTrack from './JKSessionMyTrack.js';
import JKSessionAudioInputs from './JKSessionAudioInputs.js'; import JKSessionAudioInputs from './JKSessionAudioInputs.js';
import JKSessionRemoteTracks from './JKSessionRemoteTracks.js'; import JKSessionRemoteTracks from './JKSessionRemoteTracks.js';
import JKSessionSettingsModal from './JKSessionSettingsModal.js'; import JKSessionSettingsModal from './JKSessionSettingsModal.js';
@ -99,6 +98,7 @@ import openIcon from '../../assets/img/client/open.svg';
import chatIcon from '../../assets/img/client/chat.svg'; import chatIcon from '../../assets/img/client/chat.svg';
import attachIcon from '../../assets/img/client/attach.svg'; import attachIcon from '../../assets/img/client/attach.svg';
import resyncIcon from '../../assets/img/client/resync.svg'; import resyncIcon from '../../assets/img/client/resync.svg';
import helpIcon from '../../assets/img/client/help.svg';
const JKSessionScreen = () => { const JKSessionScreen = () => {
const logger = console; // Replace with another logging mechanism if needed const logger = console; // Replace with another logging mechanism if needed
@ -215,14 +215,14 @@ const JKSessionScreen = () => {
// Stable callback for backing track popup close // Stable callback for backing track popup close
const handleBackingTrackClose = useCallback(() => { const handleBackingTrackClose = useCallback(() => {
console.log('JKSessionScreen: Backing Track Popup closing'); // console.log('JKSessionScreen: Backing Track Popup closing');
dispatch(closeModal('backingTrack')); dispatch(closeModal('backingTrack'));
dispatch(clearBackingTrackData()); dispatch(clearBackingTrackData());
}, [dispatch]); }, [dispatch]);
// Stable callback for backing track close in main screen // Stable callback for backing track close in main screen
const handleBackingTrackMainClose = useCallback(async () => { const handleBackingTrackMainClose = useCallback(async () => {
console.log('JKSessionScreen: Backing Track main screen close requested'); // console.log('JKSessionScreen: Backing Track main screen close requested');
await closeMedia(); await closeMedia();
// Also clear the backing track popup data // Also clear the backing track popup data
dispatch(clearBackingTrackData()); dispatch(clearBackingTrackData());
@ -240,7 +240,7 @@ const JKSessionScreen = () => {
// JamTrack close handler (used by both player and session screen) // JamTrack close handler (used by both player and session screen)
const handleJamTrackClose = useCallback(async () => { const handleJamTrackClose = useCallback(async () => {
console.log('Closing jam track'); // console.log('Closing jam track');
try { try {
// Call the close jam track API // Call the close jam track API
await closeJamTrack({ id: currentSession.id }); await closeJamTrack({ id: currentSession.id });
@ -254,14 +254,14 @@ const JKSessionScreen = () => {
toast.success('JamTrack closed successfully'); toast.success('JamTrack closed successfully');
} catch (error) { } catch (error) {
console.error('Error closing jam track:', error); // console.error('Error closing jam track:', error);
toast.error('Failed to close JamTrack'); toast.error('Failed to close JamTrack');
} }
}, [currentSession, dispatch]); }, [currentSession, dispatch]);
// Metronome close handler (used by both popup and session track) // Metronome close handler (used by both popup and session track)
const handleMetronomeClose = useCallback(async () => { const handleMetronomeClose = useCallback(async () => {
console.log('JKSessionScreen: Closing metronome'); // console.log('JKSessionScreen: Closing metronome');
try { try {
// Call jamClient to close metronome // Call jamClient to close metronome
await jamClient.SessionCloseMetronome(); await jamClient.SessionCloseMetronome();
@ -273,14 +273,14 @@ const JKSessionScreen = () => {
toast.success('Metronome closed successfully'); toast.success('Metronome closed successfully');
} catch (error) { } catch (error) {
console.error('Error closing metronome:', error); // console.error('Error closing metronome:', error);
toast.error('Failed to close metronome'); toast.error('Failed to close metronome');
} }
}, [jamClient, closeMetronome]); }, [jamClient, closeMetronome]);
// Stable callback for JamTrack player popup close (WindowPortal X button or ESC) // Stable callback for JamTrack player popup close (WindowPortal X button or ESC)
const handleJamTrackPlayerClose = useCallback(async () => { const handleJamTrackPlayerClose = useCallback(async () => {
console.log('JKSessionScreen: JamTrack Player Popup closing'); // console.log('JKSessionScreen: JamTrack Player Popup closing');
// Call the full close handler to clean up everything // Call the full close handler to clean up everything
await handleJamTrackClose(); await handleJamTrackClose();
}, [handleJamTrackClose]); }, [handleJamTrackClose]);
@ -307,7 +307,7 @@ const JKSessionScreen = () => {
// Fetch session data when URL sessionId changes // Fetch session data when URL sessionId changes
useEffect(() => { useEffect(() => {
if (sessionIdFromUrl && sessionIdFromUrl !== sessionId) { if (sessionIdFromUrl && sessionIdFromUrl !== sessionId) {
console.log('Fetching active session:', sessionIdFromUrl); // console.log('Fetching active session:', sessionIdFromUrl);
dispatch(fetchActiveSession(sessionIdFromUrl)); dispatch(fetchActiveSession(sessionIdFromUrl));
} }
}, [sessionIdFromUrl, sessionId, dispatch]); }, [sessionIdFromUrl, sessionId, dispatch]);
@ -318,17 +318,17 @@ const JKSessionScreen = () => {
// Alert callback handler - routes backend alerts to appropriate handlers // Alert callback handler - routes backend alerts to appropriate handlers
const alertCallbackHandler = (type, text) => { const alertCallbackHandler = (type, text) => {
console.log('[AlertCallback] type:', type, 'text:', text); // console.log('[AlertCallback] type:', type, 'text:', text);
// BACKEND_MIXER_CHANGE = 2 // BACKEND_MIXER_CHANGE = 2
if (type === 2) { if (type === 2) {
console.log('[AlertCallback] BACKEND_MIXER_CHANGE:', text); // console.log('[AlertCallback] BACKEND_MIXER_CHANGE:', text);
if (sessionModel && sessionModel.onBackendMixerChanged) { if (sessionModel && sessionModel.onBackendMixerChanged) {
sessionModel.onBackendMixerChanged(type, text); sessionModel.onBackendMixerChanged(type, text);
} }
} }
// Alert code 40: Audio profile issues (common with built-in audio) // Alert code 40: Audio profile issues (common with built-in audio)
if (type === 40) { if (type === 40) {
console.warn('[AlertCallback] Audio profile alert (40):', text); // console.warn('[AlertCallback] Audio profile alert (40):', text);
} }
// Handle other alert types as needed // Handle other alert types as needed
}; };
@ -346,29 +346,29 @@ const JKSessionScreen = () => {
useEffect(() => { useEffect(() => {
if (!isConnected || !jamClient) return; if (!isConnected || !jamClient) return;
console.debug("-DEBUG- JKSessionScreen: isConnected changed to true"); // console.debug("-DEBUG- JKSessionScreen: isConnected changed to true");
guardOnJoinSession(); guardOnJoinSession();
}, [isConnected, jamClient]); // Added jamClient to dependencies for stability }, [isConnected, jamClient]); // Added jamClient to dependencies for stability
const guardOnJoinSession = async () => { const guardOnJoinSession = async () => {
console.log("-DEBUG- JKSessionScreen: guardOnJoinSession") // console.log("-DEBUG- JKSessionScreen: guardOnJoinSession")
try { try {
const musicSessionResp = await getSessionHistory(sessionIdFromUrl); const musicSessionResp = await getSessionHistory(sessionIdFromUrl);
const musicSession = await musicSessionResp.json(); const musicSession = await musicSessionResp.json();
logger.log("-DEBUG- JKSessionScreen: fetched session history: ", musicSession); // logger.log("-DEBUG- JKSessionScreen: fetched session history: ", musicSession);
dispatch(setSessionId(musicSession.id)); // Phase 4: dispatch to Redux dispatch(setSessionId(musicSession.id)); // Phase 4: dispatch to Redux
const musicianAccessOnJoin = musicSession.musician_access; const musicianAccessOnJoin = musicSession.musician_access;
const shouldVerifyNetwork = musicSession.musician_access; const shouldVerifyNetwork = musicSession.musician_access;
const clientRole = await jamClient.getClientParentChildRole(); const clientRole = await jamClient.getClientParentChildRole();
logger.log("-DEBUG- JKSessionScreen: musicianAccessOnJoin when joining session: " + musicianAccessOnJoin); // logger.log("-DEBUG- JKSessionScreen: musicianAccessOnJoin when joining session: " + musicianAccessOnJoin);
logger.log("-DEBUG- JKSessionScreen: clientRole when joining session: " + clientRole); // logger.log("-DEBUG- JKSessionScreen: clientRole when joining session: " + clientRole);
logger.log("-DEBUG- JKSessionScreen: currentSessionId when joining session: " + currentSessionIdRef.current); // logger.log("-DEBUG- JKSessionScreen: currentSessionId when joining session: " + currentSessionIdRef.current);
if (clientRole === CLIENT_ROLE.CHILD) { if (clientRole === CLIENT_ROLE.CHILD) {
logger.debug("-DEBUG- JKSessionScreen: client is configured to act as child. skipping all checks. assuming 0 tracks"); // logger.debug("-DEBUG- JKSessionScreen: client is configured to act as child. skipping all checks. assuming 0 tracks");
dispatch(setUserTracks([])); dispatch(setUserTracks([]));
//skipping all checks. assuming 0 tracks //skipping all checks. assuming 0 tracks
@ -379,26 +379,26 @@ const JKSessionScreen = () => {
try { try {
await guardAgainstInvalidConfiguration(app, shouldVerifyNetwork); await guardAgainstInvalidConfiguration(app, shouldVerifyNetwork);
const result = await SessionPageEnter(); const result = await SessionPageEnter();
logger.log("-DEBUG- JKSessionScreen: SessionPageEnter result: ", result); // logger.log("-DEBUG- JKSessionScreen: SessionPageEnter result: ", result);
try { try {
await guardAgainstActiveProfileMissing(app, result); await guardAgainstActiveProfileMissing(app, result);
logger.log("-DEBUG- JKSessionScreen: user has an active profile"); // logger.log("-DEBUG- JKSessionScreen: user has an active profile");
try { try {
const tracks = await sessionModel.waitForSessionPageEnterDone(); const tracks = await sessionModel.waitForSessionPageEnterDone();
dispatch(setUserTracks(tracks)); dispatch(setUserTracks(tracks));
logger.log("-DEBUG- JKSessionScreen: userTracks: ", tracks); // logger.log("-DEBUG- JKSessionScreen: userTracks: ", tracks);
try { try {
await ensureAppropriateProfile(musicianAccessOnJoin) await ensureAppropriateProfile(musicianAccessOnJoin)
logger.log("-DEBUG- JKSessionScreen: user has passed all session guards") // logger.log("-DEBUG- JKSessionScreen: user has passed all session guards")
dispatch(setGuardsPassed(true)) dispatch(setGuardsPassed(true))
} catch (error) { } catch (error) {
logger.error("-DEBUG- JKSessionScreen: User profile is not appropriate for session:", error); // logger.error("-DEBUG- JKSessionScreen: User profile is not appropriate for session:", error);
// If error doesn't control navigation, show alert (legacy behavior shows dialog) // If error doesn't control navigation, show alert (legacy behavior shows dialog)
if (!error?.controlled_location) { if (!error?.controlled_location) {
logger.debug("-DEBUG- JKSessionScreen: Profile guard failed, showing alert"); // logger.debug("-DEBUG- JKSessionScreen: Profile guard failed, showing alert");
// TODO: Replace with proper JKSessionProfileDialog component // TODO: Replace with proper JKSessionProfileDialog component
alert( alert(
'Your current audio profile is not suitable for multi-user sessions.\n\n' + 'Your current audio profile is not suitable for multi-user sessions.\n\n' +
@ -412,12 +412,12 @@ const JKSessionScreen = () => {
// If controlled_location is true, the error handler already redirected // If controlled_location is true, the error handler already redirected
} }
} catch (error) { } catch (error) {
logger.error("-DEBUG- JKSessionScreen: Error: waiting for session page enter to complete:", error); // logger.error("-DEBUG- JKSessionScreen: Error: waiting for session page enter to complete:", error);
if (error === "timeout") { if (error === "timeout") {
//TODO: show some error //TODO: show some error
} else if (error === 'session_over') { } else if (error === 'session_over') {
// do nothing; session ended before we got the user track info. just bail // do nothing; session ended before we got the user track info. just bail
logger.debug("-DEBUG- JKSessionScreen: Error:: session is over; bailing"); // logger.debug("-DEBUG- JKSessionScreen: Error:: session is over; bailing");
} else { } else {
//TODO: show some error //TODO: show some error
} }
@ -426,16 +426,16 @@ const JKSessionScreen = () => {
} }
} catch (error) { } catch (error) {
// Active profile is missing, redirect to home or if the error has a location, redirect there // Active profile is missing, redirect to home or if the error has a location, redirect there
logger.error("-DEBUG- JKSessionScreen: Error: Active profile is missing or invalid:", error); // logger.error("-DEBUG- JKSessionScreen: Error: Active profile is missing or invalid:", error);
} }
} catch (error) { } catch (error) {
// Invalid configuration, redirect to home // Invalid configuration, redirect to home
await sessionModel.handleLeaveSession(); //TODO: handle redirection await sessionModel.handleLeaveSession(); //TODO: handle redirection
logger.error("-DEBUG- JKSessionScreen: Error: Invalid configuration:", error); // logger.error("-DEBUG- JKSessionScreen: Error: Invalid configuration:", error);
} }
} catch (error) { } catch (error) {
logger.error("-DEBUG- JKSessionScreen: Error: Error fetching session history:", error); // logger.error("-DEBUG- JKSessionScreen: Error: Error fetching session history:", error);
//TODO: Show some error //TODO: Show some error
} }
}; };
@ -452,7 +452,7 @@ const JKSessionScreen = () => {
return; return;
} }
console.log('[Track Sync] Mixers ready, scheduling track sync calls'); // console.log('[Track Sync] Mixers ready, scheduling track sync calls');
// First sync: Initial setup (~1s after join) // First sync: Initial setup (~1s after join)
const timer1 = setTimeout(() => { const timer1 = setTimeout(() => {
@ -503,7 +503,7 @@ const JKSessionScreen = () => {
let clientRole = await jamClient.getClientParentChildRole(); let clientRole = await jamClient.getClientParentChildRole();
const parentClientId = await jamClient.getParentClientId(); const parentClientId = await jamClient.getParentClientId();
console.debug('role when joining session: ' + clientRole + ', parentClientId: ' + parentClientId); // console.debug('role when joining session: ' + clientRole + ', parentClientId: ' + parentClientId);
@ -526,20 +526,20 @@ const JKSessionScreen = () => {
//const clientId = await jamClient.clientID(); //const clientId = await jamClient.clientID();
const clientId = server.clientId; const clientId = server.clientId;
console.log("joining session " + sessionId + " as client " + JSON.stringify(clientId) + " with role " + clientRole + " and parent client " + parentClientId); // console.log("joining session " + sessionId + " as client " + JSON.stringify(clientId) + " with role " + clientRole + " and parent client " + parentClientId);
const latency = await jamClient.FTUEGetExpectedLatency().latency const latency = await jamClient.FTUEGetExpectedLatency().latency
console.log("joinSession parameters: ", { // console.log("joinSession parameters: ", {
client_id: clientId, // client_id: clientId,
ip_address: server.publicIP, // ip_address: server.publicIP,
as_musician: true, // as_musician: true,
tracks: userTracks, // tracks: userTracks,
session_id: sessionId, // session_id: sessionId,
client_role: clientRole, // client_role: clientRole,
parent_client_id: parentClientId, // parent_client_id: parentClientId,
audio_latency: latency, // audio_latency: latency,
}); // });
joinSessionRest({ joinSessionRest({
client_id: clientId, client_id: clientId,
@ -551,20 +551,20 @@ const JKSessionScreen = () => {
parent_client_id: parentClientId, parent_client_id: parentClientId,
audio_latency: latency, audio_latency: latency,
}).then(async (response) => { }).then(async (response) => {
console.debug("joinSessionRest response received", response.errors); // console.debug("joinSessionRest response received", response.errors);
if (response.errors) { if (response.errors) {
throw new Error("Unable to join session: " + JSON.stringify(response.errors)); throw new Error("Unable to join session: " + JSON.stringify(response.errors));
} else { } else {
const data = await response.json(); const data = await response.json();
console.debug("join session response xxx: ", data); // console.debug("join session response xxx: ", data);
// Update Redux state - user has successfully joined // Update Redux state - user has successfully joined
dispatch(joinActiveSession.fulfilled(data, '', { sessionId, options: {} })); dispatch(joinActiveSession.fulfilled(data, '', { sessionId, options: {} }));
if (!inSession()) { if (!inSession()) {
// the user has left the session before they got joined. We need to issue a leave again to the server to make sure they are out // the user has left the session before they got joined. We need to issue a leave again to the server to make sure they are out
logger.debug("user left before fully joined to session. telling server again that they have left"); // logger.debug("user left before fully joined to session. telling server again that they have left");
sessionModel.leaveSessionRest(); sessionModel.leaveSessionRest();
} }
@ -647,7 +647,7 @@ const JKSessionScreen = () => {
} }
}).catch((xhr) => { }).catch((xhr) => {
console.error("joinSessionRest error: ", xhr); // console.error("joinSessionRest error: ", xhr);
let leaveBehavior; let leaveBehavior;
sessionModel.updateCurrentSession(null); sessionModel.updateCurrentSession(null);
@ -874,15 +874,15 @@ const JKSessionScreen = () => {
const doStartRecording = (params) => { const doStartRecording = (params) => {
startRecording({ music_session_id: currentSession.id, recordVideo: params.recordVideo }).then(async (recording) => { startRecording({ music_session_id: currentSession.id, recordVideo: params.recordVideo }).then(async (recording) => {
const currentRecordingId = recording.id; const currentRecordingId = recording.id;
console.debug("Recording started with ID: ", currentRecordingId); // console.debug("Recording started with ID: ", currentRecordingId);
const groupedTracks = groupTracksToClient(recording); const groupedTracks = groupTracksToClient(recording);
try { try {
await jamClient.StartMediaRecording(currentRecordingId, groupedTracks, params); await jamClient.StartMediaRecording(currentRecordingId, groupedTracks, params);
} catch (error) { } catch (error) {
console.error("Error starting media recording:", error); // console.error("Error starting media recording:", error);
} }
}).catch((error) => { }).catch((error) => {
console.error("Error starting recording:", error); // console.error("Error starting recording:", error);
}); });
} }
@ -900,7 +900,7 @@ const JKSessionScreen = () => {
// Close metronome if open before leaving // Close metronome if open before leaving
if (metronomeState.isOpen) { if (metronomeState.isOpen) {
console.log('Closing metronome before leaving session'); // console.log('Closing metronome before leaving session');
closeMetronome(); closeMetronome();
} }
@ -929,7 +929,7 @@ const JKSessionScreen = () => {
// Navigate to sessions page using React Router // Navigate to sessions page using React Router
history.push('/sessions'); history.push('/sessions');
} catch (error) { } catch (error) {
console.error('Error submitting feedback or leaving session:', error); // console.error('Error submitting feedback or leaving session:', error);
toast.error('Failed to submit feedback or leave session'); toast.error('Failed to submit feedback or leave session');
} finally { } finally {
setLeaveLoading(false); setLeaveLoading(false);
@ -944,7 +944,7 @@ const JKSessionScreen = () => {
// Reset metronome state when component unmounts (session ends) // Reset metronome state when component unmounts (session ends)
if (metronomeState.isOpen) { if (metronomeState.isOpen) {
console.log('Resetting metronome state on session cleanup'); // console.log('Resetting metronome state on session cleanup');
resetMetronome(); resetMetronome();
} }
@ -959,7 +959,7 @@ const JKSessionScreen = () => {
// Check if user can use video (subscription/permission check) // Check if user can use video (subscription/permission check)
const canVideo = () => { const canVideo = () => {
// This would need to be implemented based on user subscription logic // This would need to be implemented based on user subscription logic
console.debug("JKSessionScreen: Checking video permission for user", currentSession); // console.debug("JKSessionScreen: Checking video permission for user", currentSession);
return currentSession?.can_use_video || false; return currentSession?.can_use_video || false;
}; };
@ -984,11 +984,11 @@ const JKSessionScreen = () => {
const videoUrl = `${response.url}&audiooff=true`; const videoUrl = `${response.url}&audiooff=true`;
// Open video URL in new browser window/tab // Open video URL in new browser window/tab
console.debug("JKSessionScreen: Opening video conferencing URL", videoUrl); // console.debug("JKSessionScreen: Opening video conferencing URL", videoUrl);
openExternalLink(videoUrl); openExternalLink(videoUrl);
} catch (error) { } catch (error) {
console.error('Failed to get video room URL:', error); // console.error('Failed to get video room URL:', error);
// Handle error - could show error message to user // Handle error - could show error message to user
toast.error('Failed to start video session'); toast.error('Failed to start video session');
} finally { } finally {
@ -1001,7 +1001,7 @@ const JKSessionScreen = () => {
const showVideoUpgradePrompt = () => { const showVideoUpgradePrompt = () => {
// Implementation for showing upgrade modal/banner // Implementation for showing upgrade modal/banner
// This could use a modal context or toast notification // This could use a modal context or toast notification
console.log('Show video upgrade prompt'); // console.log('Show video upgrade prompt');
toast.warning(<VideoUpgradeContent />, { autoClose: false }); toast.warning(<VideoUpgradeContent />, { autoClose: false });
}; };
@ -1023,7 +1023,7 @@ const JKSessionScreen = () => {
try { try {
await jamClient.LaunchBroadcastSettings(); await jamClient.LaunchBroadcastSettings();
} catch (e) { } catch (e) {
console.error(e); // console.error(e);
} }
}; };
@ -1037,7 +1037,7 @@ const JKSessionScreen = () => {
await resyncAudio(); await resyncAudio();
// Silent success (matches legacy behavior) // Silent success (matches legacy behavior)
} catch (error) { } catch (error) {
console.error('Audio resync failed:', error); // console.error('Audio resync failed:', error);
if (error.message === 'timeout') { if (error.message === 'timeout') {
toast.error('Audio resync timed out. Please try again.'); toast.error('Audio resync timed out. Please try again.');
} else { } else {
@ -1073,7 +1073,7 @@ const JKSessionScreen = () => {
// Show warnings if any (e.g., backend may not fully support this type) // Show warnings if any (e.g., backend may not fully support this type)
if (validation.warnings) { if (validation.warnings) {
validation.warnings.forEach(warning => { validation.warnings.forEach(warning => {
console.warn('Attachment warning:', warning); // console.warn('Attachment warning:', warning);
}); });
} }
@ -1109,17 +1109,17 @@ const JKSessionScreen = () => {
}, [uploadStatus]); }, [uploadStatus]);
const handleBackingTrackSelected = async (result) => { const handleBackingTrackSelected = async (result) => {
console.log('JKSessionScreen: handleBackingTrackSelected called with:', result); // console.log('JKSessionScreen: handleBackingTrackSelected called with:', result);
console.log('JKSessionScreen: Current state - showBackingTrackPopup:', showBackingTrackPopup, 'popupGuard:', popupGuard); // console.log('JKSessionScreen: Current state - showBackingTrackPopup:', showBackingTrackPopup, 'popupGuard:', popupGuard);
try { try {
console.log('JKSessionScreen: Calling jamClient.SessionOpenBackingTrackFile...'); // console.log('JKSessionScreen: Calling jamClient.SessionOpenBackingTrackFile...');
// Open the backing track file // Open the backing track file
await jamClient.SessionOpenBackingTrackFile(result.file, false); await jamClient.SessionOpenBackingTrackFile(result.file, false);
console.log('JKSessionScreen: jamClient.SessionOpenBackingTrackFile completed'); // console.log('JKSessionScreen: jamClient.SessionOpenBackingTrackFile completed');
// Set up data for the popup (don't store jamClient in Redux - it's not serializable) // Set up data for the popup (don't store jamClient in Redux - it's not serializable)
console.log('JKSessionScreen: Setting backing track data...'); // console.log('JKSessionScreen: Setting backing track data...');
dispatch(setBackingTrackData({ dispatch(setBackingTrackData({
backingTrack: result.file, backingTrack: result.file,
session: currentSession, session: currentSession,
@ -1127,24 +1127,24 @@ const JKSessionScreen = () => {
})); }));
// Show the popup // Show the popup
console.log('JKSessionScreen: Setting showBackingTrackPopup to true...'); // console.log('JKSessionScreen: Setting showBackingTrackPopup to true...');
dispatch(openModal('backingTrack')); dispatch(openModal('backingTrack'));
console.log('JKSessionScreen: handleBackingTrackSelected completed successfully'); // console.log('JKSessionScreen: handleBackingTrackSelected completed successfully');
//TODO: In the legacy client, the popup window was opened as a native window through the client. decide whether we need to replicate that behavior here or do it through the browser only //TODO: In the legacy client, the popup window was opened as a native window through the client. decide whether we need to replicate that behavior here or do it through the browser only
} catch (error) { } catch (error) {
console.error('JKSessionScreen: Error opening backing track:', error); // console.error('JKSessionScreen: Error opening backing track:', error);
toast.error('Failed to open backing track'); toast.error('Failed to open backing track');
} }
}; };
const handleJamTrackSelect = async (jamTrack) => { const handleJamTrackSelect = async (jamTrack) => {
console.log('Jam track selected:', jamTrack); // console.log('Jam track selected:', jamTrack);
try { try {
// Fetch jam track details with stems // Fetch jam track details with stems
const response = await getJamTrack({ id: jamTrack.id }); const response = await getJamTrack({ id: jamTrack.id });
const jamTrackWithStems = await response.json(); const jamTrackWithStems = await response.json();
console.log('Jam track data:', jamTrackWithStems); // console.log('Jam track data:', jamTrackWithStems);
// Set the selected jam track and stems (for display on session screen) // Set the selected jam track and stems (for display on session screen)
dispatch(setSelectedJamTrack(jamTrackWithStems)); dispatch(setSelectedJamTrack(jamTrackWithStems));
@ -1159,13 +1159,13 @@ const JKSessionScreen = () => {
toast.success(`Loaded JamTrack: ${jamTrackWithStems.name}`); toast.success(`Loaded JamTrack: ${jamTrackWithStems.name}`);
} catch (error) { } catch (error) {
console.error('Error loading jam track:', error); // console.error('Error loading jam track:', error);
toast.error('Failed to load JamTrack'); toast.error('Failed to load JamTrack');
} }
}; };
const handleMetronomeSelected = async () => { const handleMetronomeSelected = async () => {
console.log('Opening metronome'); // console.log('Opening metronome');
try { try {
// Check if currently recording - can't open metronome while recording // Check if currently recording - can't open metronome while recording
if (currentlyRecording) { if (currentlyRecording) {
@ -1202,7 +1202,7 @@ const JKSessionScreen = () => {
const meter = 1; const meter = 1;
const cricket = false; const cricket = false;
console.log(`Opening metronome controls with default settings: bpm=${bpm}, sound=${soundName}, meter=${meter}`); // console.log(`Opening metronome controls with default settings: bpm=${bpm}, sound=${soundName}, meter=${meter}`);
// Inform server about metronome opening (like legacy SessionStore) // Inform server about metronome opening (like legacy SessionStore)
await openMetronome({ id: currentSession.id }); await openMetronome({ id: currentSession.id });
@ -1227,7 +1227,7 @@ const JKSessionScreen = () => {
toast.success('Metronome opened successfully'); toast.success('Metronome opened successfully');
} catch (error) { } catch (error) {
console.error('Error opening metronome:', error); // console.error('Error opening metronome:', error);
toast.error('Failed to open metronome'); toast.error('Failed to open metronome');
} }
}; };
@ -1260,11 +1260,18 @@ const JKSessionScreen = () => {
return unstable; return unstable;
} catch (error) { } catch (error) {
console.error('Error checking NTP stability:', error); // console.error('Error checking NTP stability:', error);
return []; return [];
} }
}; };
const handleAudioConfigClick = () => {
//dispatch(openModal('audioConfig'));
// console.log('Audio configuration options coming soon');
alert('Audio configuration modal is not implemented yet');
}
return ( return (
<Card> <Card>
{!isConnected && <div className='d-flex align-items-center'>Connecting to backend...</div>} {!isConnected && <div className='d-flex align-items-center'>Connecting to backend...</div>}
@ -1275,24 +1282,24 @@ const JKSessionScreen = () => {
<CardHeader className="bg-light border-bottom border-top py-2 border-3"> <CardHeader className="bg-light border-bottom border-top py-2 border-3">
<div className="d-flex flex-nowrap overflow-auto" style={{ gap: '0.5rem', zIndex: 1100 }}> <div className="d-flex flex-nowrap overflow-auto" style={{ gap: '0.5rem', zIndex: 1100 }}>
<Button className='btn-custom-outline' outline size="md" onClick={() => dispatch(openModal('settings'))}> <Button className='btn-custom-outline' outline size="md" onClick={() => dispatch(openModal('settings'))}>
<img src={gearIcon} alt="Settings" style={{ width: '16px', height: '16px', marginRight: '0.2rem' }} /> <img src={gearIcon} alt="Settings" style={{ width: '20px', height: '20px', marginRight: '0.3rem' }} />
Settings</Button> Settings</Button>
<Button className='btn-custom-outline' outline size="md" onClick={() => dispatch(openModal('invite'))}> <Button className='btn-custom-outline' outline size="md" onClick={() => dispatch(openModal('invite'))}>
<img src={inviteIcon} alt="Invite" style={{ width: '16px', height: '16px', marginRight: '0.2rem' }} /> <img src={inviteIcon} alt="Invite" style={{ width: '19px', height: '19px', marginRight: '0.3rem' }} />
Invite</Button> Invite</Button>
<Button className='btn-custom-outline' outline size="md" onClick={() => dispatch(openModal('volume'))}> <Button className='btn-custom-outline' outline size="md" onClick={() => dispatch(openModal('volume'))}>
<img src={volumeIcon} alt="Volume" style={{ width: '16px', height: '16px', marginRight: '0.2rem' }} /> <img src={volumeIcon} alt="Volume" style={{ width: '20px', height: '20px', marginRight: '0.3rem' }} />
Volume</Button> Volume</Button>
<Button className='btn-custom-outline' outline size="md" onClick={handleVideoClick} disabled={videoLoading}> <Button className='btn-custom-outline' outline size="md" onClick={handleVideoClick} disabled={videoLoading}>
<img src={videoIcon} alt="Video" style={{ width: '16px', height: '16px', marginRight: '0.2rem' }} /> <img src={videoIcon} alt="Video" style={{ width: '20px', height: '20px', marginRight: '0.3rem' }} />
{videoLoading && (<Spinner size="sm" />)} {videoLoading && (<Spinner size="sm" />)}
&nbsp;Video &nbsp;Video
</Button> </Button>
<Button className='btn-custom-outline' outline size="md" onClick={() => dispatch(openModal('recording'))}> <Button className='btn-custom-outline' outline size="md" onClick={() => dispatch(openModal('recording'))}>
<img src={recordIcon} alt="Record" style={{ width: '16px', height: '16px', marginRight: '0.2rem' }} /> <img src={recordIcon} alt="Record" style={{ width: '20px', height: '20px', marginRight: '0.3rem' }} />
Record</Button> Record</Button>
<Button className='btn-custom-outline' outline size="md" onClick={ handleBroadcast}> <Button className='btn-custom-outline' outline size="md" onClick={handleBroadcast}>
<img src={broadcastIcon} alt="Broadcast" style={{ width: '16px', height: '16px', marginRight: '0.2rem' }} /> <img src={broadcastIcon} alt="Broadcast" style={{ width: '21px', height: '21px', marginRight: '0.3rem' }} />
Broadcast</Button> Broadcast</Button>
<JKSessionOpenMenu onBackingTrackSelected={handleBackingTrackSelected} onJamTrackSelected={() => dispatch(openModal('jamTrack'))} onMetronomeSelected={handleMetronomeSelected} /> <JKSessionOpenMenu onBackingTrackSelected={handleBackingTrackSelected} onJamTrackSelected={() => dispatch(openModal('jamTrack'))} onMetronomeSelected={handleMetronomeSelected} />
<JKSessionChatButton sessionId={sessionId} /> <JKSessionChatButton sessionId={sessionId} />
@ -1310,11 +1317,11 @@ const JKSessionScreen = () => {
onClick={handleAttachClick} onClick={handleAttachClick}
disabled={isUploading} disabled={isUploading}
> >
<img src={attachIcon} alt="Attach" style={{ width: '16px', height: '16px', marginRight: '0.2rem' }} /> <img src={attachIcon} alt="Attach" style={{ width: '20px', height: '20px', marginRight: '0.3rem' }} />
{isUploading ? 'Uploading...' : 'Attach'} {isUploading ? 'Uploading...' : 'Attach'}
</Button> </Button>
<Button className='btn-custom-outline' outline size="md" onClick={handleResync} disabled={resyncLoading}> <Button className='btn-custom-outline' outline size="md" onClick={handleResync} disabled={resyncLoading}>
<img src={resyncIcon} alt="Resync" style={{ width: '16px', height: '16px', marginRight: '0.2rem' }} /> <img src={resyncIcon} alt="Resync" style={{ width: '20px', height: '20px', marginRight: '0.3rem' }} />
{resyncLoading ? <><Spinner size="sm" /> Resyncing...</> : 'Resync'} {resyncLoading ? <><Spinner size="sm" /> Resyncing...</> : 'Resync'}
</Button> </Button>
</div> </div>
@ -1323,7 +1330,12 @@ const JKSessionScreen = () => {
<CardBody className="pl-4" style={{ backgroundColor: '#edf2f9f5', overflowX: 'auto', width: '100%' }}> <CardBody className="pl-4" style={{ backgroundColor: '#edf2f9f5', overflowX: 'auto', width: '100%' }}>
<div className='d-flex' style={{ gap: '1rem' }}> <div className='d-flex' style={{ gap: '1rem' }}>
<div className='audioInputs'> <div className='audioInputs'>
<h5>Audio Inputs <FontAwesomeIcon icon="question-circle" id="audioInputsTooltip" className="ml-2" style={{ cursor: 'pointer' }} /></h5> <h5>Audio Inputs
{/* <FontAwesomeIcon icon="question-circle" id="audioInputsTooltip" className="ml-2" style={{ cursor: 'pointer' }} /> */}
<img src={helpIcon} alt="Help" id="audioInputsTooltip" className="ml-2" style={{ cursor: 'pointer', width: '18px', height: '18px' }} />
<img src={gearIcon} alt="Settings" id="audioInputsSettings" className="ml-2" style={{ cursor: 'pointer', width: '18px', height: '18px' }} onClick={handleAudioConfigClick} />
</h5>
<div style={{ borderRight: '1px #ddd solid', paddingRight: '1rem' }}> <div style={{ borderRight: '1px #ddd solid', paddingRight: '1rem' }}>
<JKSessionAudioInputs <JKSessionAudioInputs
myTracks={mixerHelper.myTracks} myTracks={mixerHelper.myTracks}
@ -1335,7 +1347,11 @@ const JKSessionScreen = () => {
</div> </div>
<div className='sessionMix'> <div className='sessionMix'>
<h5>Session Mix <FontAwesomeIcon icon="question-circle" id="sessionMixTooltip" className="ml-2" style={{ cursor: 'pointer' }} /></h5> <h5>Session Mix
<a id="sessionMixTooltip" style={{ height: 18, width: 18}}>
<img src={helpIcon} alt="Help" className="ml-2" style={{ cursor: 'pointer', width: '18px', height: '18px' }} />
</a>
</h5>
<div className='d-flex' style={{ gap: '1rem' }}> <div className='d-flex' style={{ gap: '1rem' }}>
<JKSessionAudioInputs <JKSessionAudioInputs
myTracks={mixerHelper.myTracks} myTracks={mixerHelper.myTracks}
@ -1352,32 +1368,32 @@ const JKSessionScreen = () => {
{/* JamTrack Section - Show stems when player is ready */} {/* JamTrack Section - Show stems when player is ready */}
{selectedJamTrack && jamTrackStems.length > 0 && {selectedJamTrack && jamTrackStems.length > 0 &&
(jamTrackDownloadState.state === 'synchronized' || jamTrackDownloadState.state === 'idle') && ( (jamTrackDownloadState.state === 'synchronized' || jamTrackDownloadState.state === 'idle') && (
<> <>
<div style={{ borderLeft: '1px solid #ddd', paddingLeft: '1rem' }}></div> <div style={{ borderLeft: '1px solid #ddd', paddingLeft: '1rem' }}></div>
<div className='jamTrack'> <div className='jamTrack'>
<h5> <h5>
JamTrack: {selectedJamTrack.name} JamTrack: {selectedJamTrack.name}
<a <a
href="#" href="#"
className="text-muted ml-2" className="text-muted ml-2"
onClick={(e) => { onClick={(e) => {
e.preventDefault(); e.preventDefault();
handleJamTrackClose(); handleJamTrackClose();
}} }}
style={{ fontSize: '1.2em', textDecoration: 'none' }} style={{ fontSize: '1.2em', textDecoration: 'none' }}
title="Close JamTrack" title="Close JamTrack"
> >
<FontAwesomeIcon icon="times" /> Close <FontAwesomeIcon icon="times" /> Close
</a> </a>
</h5> </h5>
<JKSessionJamTrackStems <JKSessionJamTrackStems
jamTrackStems={jamTrackStems} jamTrackStems={jamTrackStems}
mixerHelper={mixerHelper} mixerHelper={mixerHelper}
/> />
</div> </div>
</> </>
)} )}
{/* Backing Track Section - Show track when player is open */} {/* Backing Track Section - Show track when player is open */}
{showBackingTrackPlayer && mixerHelper.backingTracks && mixerHelper.backingTracks.length > 0 && ( {showBackingTrackPlayer && mixerHelper.backingTracks && mixerHelper.backingTracks.length > 0 && (
@ -1543,7 +1559,7 @@ const JKSessionScreen = () => {
currentSession={{ ...currentSession, privacy: musicianAccess }} currentSession={{ ...currentSession, privacy: musicianAccess }}
loading={settingsLoading} loading={settingsLoading}
onSave={async (payload) => { onSave={async (payload) => {
console.log('Session settings :', payload); // console.log('Session settings :', payload);
try { try {
setSettingsLoading(true); setSettingsLoading(true);
@ -1569,12 +1585,12 @@ const JKSessionScreen = () => {
...payload ...payload
}); });
const data = await response.json(); const data = await response.json();
console.log('Updated session settings response:', data); // console.log('Updated session settings response:', data);
dispatch(updateSessionData(data)); // Phase 4: dispatch to Redux dispatch(updateSessionData(data)); // Phase 4: dispatch to Redux
dispatch(closeModal('settings')); dispatch(closeModal('settings'));
toast.success('Session settings updated successfully'); toast.success('Session settings updated successfully');
} catch (error) { } catch (error) {
console.error('Error updating session settings:', error); // console.error('Error updating session settings:', error);
toast.error('Failed to update session settings'); toast.error('Failed to update session settings');
} finally { } finally {
setSettingsLoading(false); setSettingsLoading(false);
@ -1593,7 +1609,7 @@ const JKSessionScreen = () => {
loading={inviteLoading} loading={inviteLoading}
onSubmit={async (invitees) => { onSubmit={async (invitees) => {
setSessionInvitees(invitees); setSessionInvitees(invitees);
console.log('Submitted invitees:', invitees); // console.log('Submitted invitees:', invitees);
const inviteeIds = invitees.map(i => i.id) const inviteeIds = invitees.map(i => i.id)
const payload = { const payload = {
inviteeIds: inviteeIds.join() inviteeIds: inviteeIds.join()
@ -1605,12 +1621,12 @@ const JKSessionScreen = () => {
...payload ...payload
}); });
const data = await response.json(); const data = await response.json();
console.log('Updated session settings response:', data); // console.log('Updated session settings response:', data);
dispatch(updateSessionData(data)); // Phase 4: dispatch to Redux dispatch(updateSessionData(data)); // Phase 4: dispatch to Redux
dispatch(closeModal('invite')); dispatch(closeModal('invite'));
toast.success('Invitations sent successfully'); toast.success('Invitations sent successfully');
} catch (error) { } catch (error) {
console.error('Error updating session settings:', error); // console.error('Error updating session settings:', error);
toast.error('Failed to send invitations'); toast.error('Failed to send invitations');
} finally { } finally {
setInviteLoading(false); setInviteLoading(false);
@ -1643,7 +1659,7 @@ const JKSessionScreen = () => {
</div> </div>
</UncontrolledTooltip> </UncontrolledTooltip>
<UncontrolledTooltip target="sessionMixTooltip" trigger="hover click"> <UncontrolledTooltip target="sessionMixTooltip" trigger="hover click">
<div> <div>
<p>Adjust the volume of each audio track (yours and others) in the Session Mix to get the mix where you want it (i.e. where it sounds good and well balanced to you). Any volume changes you make will affect only what you hear. They don’t affect the volume of what others hear in the session. Everyone has their own customizable session mix.</p> <p>Adjust the volume of each audio track (yours and others) in the Session Mix to get the mix where you want it (i.e. where it sounds good and well balanced to you). Any volume changes you make will affect only what you hear. They don’t affect the volume of what others hear in the session. Everyone has their own customizable session mix.</p>
<p>Note that your session mix is the mix that will be used for any recordings you make and for any broadcasts you stream. If another musician in your session makes a recording or streams a broadcast, it will use that musician’s session mix, not yours.</p> <p>Note that your session mix is the mix that will be used for any recordings you make and for any broadcasts you stream. If another musician in your session makes a recording or streams a broadcast, it will use that musician’s session mix, not yours.</p>
@ -1664,7 +1680,7 @@ const JKSessionScreen = () => {
currentUser={backingTrackData.currentUser} currentUser={backingTrackData.currentUser}
isPopup={true} isPopup={true}
onClose={() => { onClose={() => {
console.log('JKSessionScreen: JKSessionBackingTrackPlayer onClose called'); // console.log('JKSessionScreen: JKSessionBackingTrackPlayer onClose called');
dispatch(closeModal('backingTrack')); dispatch(closeModal('backingTrack'));
dispatch(clearBackingTrackData()); dispatch(clearBackingTrackData());
}} }}
@ -1720,12 +1736,12 @@ const JKSessionScreen = () => {
{/* Media Controls Popup - Only show when explicitly opened */} {/* Media Controls Popup - Only show when explicitly opened */}
{showMediaControlsPopup && !popupGuard && (() => { {showMediaControlsPopup && !popupGuard && (() => {
console.log('JKSessionScreen: RENDERING Media Controls Popup - showMediaControlsPopup:', showMediaControlsPopup, 'popupGuard:', popupGuard); // console.log('JKSessionScreen: RENDERING Media Controls Popup - showMediaControlsPopup:', showMediaControlsPopup, 'popupGuard:', popupGuard);
setPopupGuard(true); // Set guard immediately to prevent re-renders setPopupGuard(true); // Set guard immediately to prevent re-renders
return ( return (
<WindowPortal <WindowPortal
onClose={() => { onClose={() => {
console.log('JKSessionScreen: Media Controls Popup closing'); // console.log('JKSessionScreen: Media Controls Popup closing');
dispatch(closeModal('mediaControls')); dispatch(closeModal('mediaControls'));
setMediaControlsOpened(false); setMediaControlsOpened(false);
setPopupGuard(false); // Reset guard when closing setPopupGuard(false); // Reset guard when closing
@ -1735,7 +1751,7 @@ const JKSessionScreen = () => {
windowId="media-controls" windowId="media-controls"
> >
<JKPopupMediaControls onClose={() => { <JKPopupMediaControls onClose={() => {
console.log('JKSessionScreen: JKPopupMediaControls onClose called'); // console.log('JKSessionScreen: JKPopupMediaControls onClose called');
dispatch(closeModal('mediaControls')); dispatch(closeModal('mediaControls'));
setMediaControlsOpened(false); setMediaControlsOpened(false);
setPopupGuard(false); // Reset guard when closing setPopupGuard(false); // Reset guard when closing

15
jam-ui/src/components/common/WindowPortal.js
View File

@ -68,21 +68,6 @@ const WindowPortal = ({
newWindow.document.body.style.backgroundColor = '#f8f9fa'; newWindow.document.body.style.backgroundColor = '#f8f9fa';
newWindow.document.body.style.overflow = 'hidden'; newWindow.document.body.style.overflow = 'hidden';
// Copy all stylesheets from parent window to popup
const stylesheets = Array.from(document.querySelectorAll('link[rel="stylesheet"], style'));
stylesheets.forEach(sheet => {
if (sheet.tagName === 'LINK') {
const newLink = newWindow.document.createElement('link');
newLink.rel = 'stylesheet';
newLink.href = sheet.href;
newWindow.document.head.appendChild(newLink);
} else if (sheet.tagName === 'STYLE') {
const newStyle = newWindow.document.createElement('style');
newStyle.textContent = sheet.textContent;
newWindow.document.head.appendChild(newStyle);
}
});
// Add window ID for identification // Add window ID for identification
if (windowId) { if (windowId) {
newWindow.windowId = windowId; newWindow.windowId = windowId;

77
jam-ui/src/helpers/utils.js
View File

@ -64,6 +64,36 @@ import viola45 from '../assets/img/instruments/icon_instrument_viola45.png';
import violin45 from '../assets/img/instruments/icon_instrument_violin45.png'; import violin45 from '../assets/img/instruments/icon_instrument_violin45.png';
import voice45 from '../assets/img/instruments/icon_instrument_voice45.png'; import voice45 from '../assets/img/instruments/icon_instrument_voice45.png';
import accordion45_inverted from '../assets/img/instruments/icon_instrument_accordion45_inverted.svg';
import acoustic_guitar45_inverted from '../assets/img/instruments/icon_instrument_acoustic_guitar45_inverted.svg';
import banjo45_inverted from '../assets/img/instruments/icon_instrument_banjo45_inverted.svg';
import bass_guitar45_inverted from '../assets/img/instruments/icon_instrument_bass_guitar45_inverted.svg';
import cello45_inverted from '../assets/img/instruments/icon_instrument_cello45_inverted.svg';
import clarinet45_inverted from '../assets/img/instruments/icon_instrument_clarinet45_inverted.svg';
import computer45_inverted from '../assets/img/instruments/icon_instrument_computer45_inverted.svg';
import default45_inverted from '../assets/img/instruments/icon_instrument_default45_inverted.svg';
import drums45_inverted from '../assets/img/instruments/icon_instrument_drums45_inverted.svg';
import electric_guitar45_inverted from '../assets/img/instruments/icon_instrument_electric_guitar45_inverted.svg';
import euphonium45_inverted from '../assets/img/instruments/icon_instrument_euphonium45_inverted.svg';
import flute45_inverted from '../assets/img/instruments/icon_instrument_flute45_inverted.svg';
import french_horn45_inverted from '../assets/img/instruments/icon_instrument_french_horn45_inverted.svg';
import harmonica45_inverted from '../assets/img/instruments/icon_instrument_harmonica45_inverted.svg';
import keyboard45_inverted from '../assets/img/instruments/icon_instrument_keyboard45_inverted.svg';
import mandolin45_inverted from '../assets/img/instruments/icon_instrument_mandolin45_inverted.svg';
import oboe45_inverted from '../assets/img/instruments/icon_instrument_oboe45_inverted.svg';
import other45_inverted from '../assets/img/instruments/icon_instrument_other45_inverted.svg';
import piano45_inverted from '../assets/img/instruments/icon_instrument_piano45_inverted.svg';
import saxophone45_inverted from '../assets/img/instruments/icon_instrument_saxophone45_inverted.svg';
import trombone45_inverted from '../assets/img/instruments/icon_instrument_trombone45_inverted.svg';
import trumpet45_inverted from '../assets/img/instruments/icon_instrument_trumpet45_inverted.svg';
import tuba45_inverted from '../assets/img/instruments/icon_instrument_tuba45_inverted.svg';
import ukulele45_inverted from '../assets/img/instruments/icon_instrument_ukelele45_inverted.svg';
import upright_bass45_inverted from '../assets/img/instruments/icon_instrument_upright_bass45_inverted.svg';
import double_bass45_inverted from '../assets/img/instruments/icon_instrument_double_bass45_inverted.svg';
import viola45_inverted from '../assets/img/instruments/icon_instrument_viola45_inverted.svg';
import violin45_inverted from '../assets/img/instruments/icon_instrument_violin45_inverted.svg';
import voice45_inverted from '../assets/img/instruments/icon_instrument_voice45_inverted.svg';
import accordion256 from '../assets/img/instruments/icon_instrument_accordion256.png'; import accordion256 from '../assets/img/instruments/icon_instrument_accordion256.png';
import acoustic_guitar256 from '../assets/img/instruments/icon_instrument_acoustic_guitar256.png'; import acoustic_guitar256 from '../assets/img/instruments/icon_instrument_acoustic_guitar256.png';
import banjo256 from '../assets/img/instruments/icon_instrument_banjo256.png'; import banjo256 from '../assets/img/instruments/icon_instrument_banjo256.png';
@ -95,6 +125,9 @@ import violin256 from '../assets/img/instruments/icon_instrument_violin256.png';
import voice256 from '../assets/img/instruments/icon_instrument_voice256.png'; import voice256 from '../assets/img/instruments/icon_instrument_voice256.png';
export const isIterableArray = array => Array.isArray(array) && !!array.length; export const isIterableArray = array => Array.isArray(array) && !!array.length;
//=============================== //===============================
@ -737,6 +770,39 @@ const instrumentIconMap45 = {
"voice": { asset: voice45, name: "voice" } "voice": { asset: voice45, name: "voice" }
}; };
const instrumentIconMap45_inverted = {
"accordion": { asset: accordion45_inverted, name: "accordion" },
"acoustic guitar": { asset: acoustic_guitar45_inverted, name: "acoustic guitar" },
"banjo": { asset: banjo45_inverted, name: "banjo" },
"bass guitar": { asset: bass_guitar45_inverted, name: "bass guitar" },
"cello": { asset: cello45_inverted, name: "cello" },
"clarinet": { asset: clarinet45_inverted, name: "clarinet" },
"computer": { asset: computer45_inverted, name: "computer" },
"_default": { asset: default45_inverted, name: "_default" },
"drums": { asset: drums45_inverted, name: "drums" },
"percussion": { asset: drums45_inverted, name: "percussion" },
"electric guitar": { asset: electric_guitar45_inverted, name: "electric guitar" },
"euphonium": { asset: euphonium45_inverted, name: "euphonium" },
"flute": { asset: flute45_inverted, name: "flute" },
"french horn": { asset: french_horn45_inverted, name: "french horn" },
"harmonica": { asset: harmonica45_inverted, name: "harmonica" },
"keyboard": { asset: keyboard45_inverted, name: "keyboard" },
"mandolin": { asset: mandolin45_inverted, name: "mandolin" },
"oboe": { asset: oboe45_inverted, name: "oboe" },
"other": { asset: other45_inverted, name: "other" },
"piano": { asset: piano45_inverted, name: "piano" },
"saxophone": { asset: saxophone45_inverted, name: "saxophone" },
"trombone": { asset: trombone45_inverted, name: "trombone" },
"trumpet": { asset: trumpet45_inverted, name: "trumpet" },
"tuba": { asset: tuba45_inverted, name: "tuba" },
"ukulele": { asset: ukulele45_inverted, name: "ukulele" },
"upright bass": { asset: upright_bass45_inverted, name: "upright bass" },
"double bass": { asset: double_bass45_inverted, name: "double bass" },
"viola": { asset: viola45_inverted, name: "viola" },
"violin": { asset: violin45_inverted, name: "violin" },
"voice": { asset: voice45_inverted, name: "voice" }
};
const instrumentIconMap256 = { const instrumentIconMap256 = {
"accordion": { asset: accordion256, name: "accordion" }, "accordion": { asset: accordion256, name: "accordion" },
"acoustic guitar": { asset: acoustic_guitar256, name: "acoustic guitar" }, "acoustic guitar": { asset: acoustic_guitar256, name: "acoustic guitar" },
@ -780,6 +846,10 @@ export const getInstrumentIconMap45 = () => {
return instrumentIconMap45; return instrumentIconMap45;
}; };
export const getInstrumentIconMap45_inverted = () => {
return instrumentIconMap45_inverted;
};
export const getInstrumentIconMap256 = () => { export const getInstrumentIconMap256 = () => {
return instrumentIconMap256; return instrumentIconMap256;
}; };
@ -798,6 +868,13 @@ export const getInstrumentIcon45 = (instrument) => {
return instrumentIconMap45["_default"].asset; return instrumentIconMap45["_default"].asset;
}; };
export const getInstrumentIcon45_inverted = (instrument) => {
if (instrument in instrumentIconMap45_inverted) {
return instrumentIconMap45_inverted[instrument].asset;
}
return instrumentIconMap45_inverted["_default"].asset;
};
export const getInstrumentName = (instrument) => { export const getInstrumentName = (instrument) => {
if (instrument in instrumentIconMap45) { if (instrument in instrumentIconMap45) {
return instrumentIconMap45[instrument].name; return instrumentIconMap45[instrument].name;

15
jam-ui/src/hooks/useVuHelpers.js
View File

@ -140,18 +140,18 @@ export default function useVuHelpers() {
const lightThreshold = (lightCount - i) / lightCount; const lightThreshold = (lightCount - i) / lightCount;
const isOn = level >= lightThreshold; const isOn = level >= lightThreshold;
let bgClass = 'bg-secondary'; // Default off state let bgClass = 'vu-bg-secondary'; // Default off state
if (isOn) { if (isOn) {
if (clipping) { if (clipping) {
bgClass = 'bg-danger'; // Red for clipping bgClass = 'vu-bg-danger'; // Red for clipping
} else { } else {
const positionFromBottom = lightCount - 1 - i; const positionFromBottom = lightCount - 1 - i;
if (positionFromBottom >= Math.floor(lightCount * 0.75)) { // Red zone (top 25%) if (positionFromBottom >= Math.floor(lightCount * 0.75)) { // Red zone (top 25%)
bgClass = 'bg-danger'; bgClass = 'vu-bg-danger';
} else if (positionFromBottom >= Math.floor(lightCount * 0.5)) { // Yellow zone (middle 25%) } else if (positionFromBottom >= Math.floor(lightCount * 0.5)) { // Yellow zone (middle 25%)
bgClass = 'bg-warning'; bgClass = 'vu-bg-warning';
} else { // Green zone (bottom 50%) } else { // Green zone (bottom 50%)
bgClass = 'bg-success'; bgClass = 'vu-bg-success';
} }
} }
} }
@ -162,9 +162,10 @@ export default function useVuHelpers() {
className={bgClass} className={bgClass}
style={{ style={{
height: `${lightHeight}px`, height: `${lightHeight}px`,
width: `${lightWidth}px`, width: `25px`,
marginTop: '1px', marginTop: '1px',
borderRadius: '2px' borderRadius: '2px',
border: '1px solid #eee'
}} }}
/> />
); );

2
web/app/views/api_music_sessions/show.rabl
View File

@ -63,7 +63,7 @@ else
attributes :ip_address, :client_id, :joined_session_at, :audio_latency, :id, :metronome_open, :is_jamblaster, :client_role, :parent_client_id, :client_id_int attributes :ip_address, :client_id, :joined_session_at, :audio_latency, :id, :metronome_open, :is_jamblaster, :client_role, :parent_client_id, :client_id_int
node :user do |connection| node :user do |connection|
{ :id => connection.user.id, :photo_url => connection.user.photo_url, :name => connection.user.name, :is_friend => connection.user.friends?(current_user), :connection_state => connection.aasm_state, :subscription => connection.user.subscription_plan_code } { :id => connection.user.id, :photo_url => connection.user.photo_url, :v2_photo_url => connection.user.v2_photo_url, :name => connection.user.name, :is_friend => connection.user.friends?(current_user), :connection_state => connection.aasm_state, :subscription => connection.user.subscription_plan_code }
end end
child(:tracks => :tracks) { child(:tracks => :tracks) {