audio-mixer-ui 0.1.3 → 0.3.0

package/README.md

@@ -5,7 +5,7 @@ Originally developed for a choir practice application, these components provide
 
 ## Features
 
-- **Professional Audio Controls**: Custom sliders, buttons, and level meters with haptic feedback
+- **Audio Controls**: Custom sliders, buttons, and level meters with haptic feedback
 - **Musical Navigation**: Bar/beat input, practice marks, tempo controls with bidirectional time mapping
 - **Responsive Design**: Optimized layouts for mobile, tablet, and desktop
 - **Event-Driven Architecture**: Clean separation between UI and audio engine
@@ -16,7 +16,7 @@ Originally developed for a choir practice application, these components provide
 ## Installation
 
 ```bash
-npm install audio-mixer-ui
+npm install audio-mixer-ui pinia
 ```
 
 ## Quick Start
@@ -25,96 +25,116 @@ npm install audio-mixer-ui
 <template>
   <div class="app">
     <MixerLayout>
-      <template #controls>
-        <MixerControls />
-      </template>
-      <template #parts>
-        <PartControl 
-          v-for="part in parts" 
-          :key="part.name"
-          :name="part.name"
-          v-model:volume="part.volume"
-          v-model:mute="part.mute"
-          v-model:solo="part.solo"
-        />
+      <template #menu>
+        <button @click="selectScore" class="menu-item">Load Score</button>
       </template>
     </MixerLayout>
   </div>
 </template>
 
 <script setup>
-import { 
-  MixerLayout, 
-  MixerControls, 
-  PartControl 
-} from 'audio-mixer-ui'
-import { ref } from 'vue'
-
-const parts = ref([
-  { name: 'Soprano', volume: 0.8, mute: false, solo: false },
-  { name: 'Alto', volume: 0.7, mute: false, solo: false },
-  { name: 'Tenor', volume: 0.75, mute: false, solo: false },
-  { name: 'Bass', volume: 0.8, mute: false, solo: false }
-])
+import { onMounted } from 'vue'
+import { MixerLayout, useMasterAudioControl } from 'audio-mixer-ui'
+import 'audio-mixer-ui/style.css'
+
+const masterAudio = useMasterAudioControl()
+
+const musicData = {
+  title: "Demo Song",
+  parts: [
+    { name: 'Soprano', volume: 0.75 },
+    { name: 'Alto', volume: 0.75 },
+    { name: 'Tenor', volume: 0.75 },
+    { name: 'Bass', volume: 0.75 }
+  ],
+  beats: [
+    { bar: 1, beat: 1, repeat: 0, tempo: 80, time: 0, timeSig: 4 },
+    { bar: 1, beat: 2, repeat: 0, tempo: 80, time: 0.75, timeSig: 4 },
+    // ... more beat data
+  ],
+  marks: { A: 1, B: 5, C: 9 }
+}
+
+onMounted(() => {
+  masterAudio.initialize(musicData)
+})
+
+function selectScore() {
+  console.log('Load different score')
+}
 </script>
 ```
 
+**Setup your app with Pinia:**
+
+```js
+// main.js
+import { createApp } from 'vue'
+import { createPinia } from 'pinia'
+import App from './App.vue'
+
+const app = createApp(App)
+app.use(createPinia())
+app.mount('#app')
+```
+
 ## Core Components
 
+The library exports components that automatically integrate with Pinia stores:
+
 ### Layout Components
-- **`MixerLayout`** - Main responsive container with flexible slot system
-- **`MixerControls`** - Transport controls, master volume, and feature toggles
+- **`MixerLayout`** - Responsive container that auto-renders parts from store data
+- **`MixerControls`** - Transport controls connected to audio state
 
 ### Audio Controls
-- **`AudioSlider`** - Professional audio fader with level indicators
-- **`AudioButton`** - Responsive button with visual feedback
-- **`PartControl`** - Complete part mixer (volume, mute, solo)
-- **`TriState`** - Mute/Solo toggle control
+- **`AudioSlider`** - Professional fader with live level indicators
+- **`AudioButton`** - Button with visual/haptic feedback
+- **`PartControl`** - Complete part mixer (auto-generated from store)
+- **`TriState`** - Mute/Solo toggle
 
 ### Musical Navigation
-- **`BarInput`** - Bar number input with practice mark navigation
-- **`TimeInput`** - Time position display and input
-- **`SpeedInput`** - Playback speed control with percentage display
+- **`BarInput`** - Bar navigation with practice mark integration
+- **`TimeInput`** - Time display synced to playback position
+- **`SpeedInput`** - Playback speed control
 
 ### Utilities
-- **`BaseNumericInput`** - Foundation for all numeric inputs
-- **`TitleText`** - Responsive title display
+- **`BaseNumericInput`** - Foundation for numeric inputs
+- **`TitleText`** - Responsive text display
 
 ## State Management
 
-The library integrates with Pinia stores for reactive state management:
+Components automatically connect to Pinia stores for reactive state management. The library exports three main stores:
 
 ```js
-// stores/audioState.js
-export const useAudioStateStore = defineStore('audioState', {
-  state: () => ({
-    isPlaying: false,
-    currentTime: 0,
-    currentBar: 1,
-    currentBeat: 1,
-    masterVolume: 0.8
-  })
-})
-```
+import {
+  useAudioStateStore,     // Current playback state (time, volume, playing)
+  useMusicDataStore,      // Musical structure (beats, parts, marks)
+  usePlaybackStateStore,  // Transport settings (loop, metronome)
+  useMasterAudioControl   // Master composable for audio control
+} from 'audio-mixer-ui'
 
-## Event System
+// Components automatically connect to stores - no manual wiring needed
+const audioState = useAudioStateStore()
+const musicData = useMusicDataStore()
+const masterAudio = useMasterAudioControl()
 
-Components emit semantic events rather than directly manipulating audio:
+// Initialize with your musical data
+masterAudio.initialize(musicData)
+```
 
-```vue
-<template>
-  <MixerControls @play="handlePlay" @stop="handleStop" @set-bar="handleSetBar" />
-</template>
+## Integration Pattern
 
-<script setup>
-const handlePlay = () => {
-  // Start audio playback
-}
+Components handle user interactions via the master audio composable:
 
-const handleSetBar = (barNumber) => {
-  // Navigate to specific bar
-}
-</script>
+```js
+// Inside components, actions are coordinated through the master composable
+const masterAudio = useMasterAudioControl()
+
+// User interactions trigger master audio methods
+masterAudio.play()
+masterAudio.stop()
+masterAudio.setBar(5, 1)  // bar 5, repeat 1
+masterAudio.setPartVolume('Soprano', 0.8)
 ```
 
 ## Musical Data Structure
@@ -185,7 +205,7 @@ The library follows an event-driven layered architecture:
 ## Browser Support
 
 - Modern browsers with ES2020+ support
-- Vue 3.4+
+- Vue 3.4+ and Pinia for state management
 - Web Audio API for audio features
 
 ## Contributing

package/dist/FluidR3Mono_License.md

@@ -0,0 +1,92 @@
+MS_General.sf2
+---
+
+Current version: 0.1 alpha 1st March 2018
+
+This is a fork of FluidR3Mono_GM.sf2, with many samples (eventually) being replaced and/or reprogrammed. This version of the SoundFont is an alpha work-in-progress. Information on all sample sources will be provided upon release.
+
+FluidR3 (original version) by Frank Wen Copyright � 2000-2002
+
+Mono conversion (FluidR3Mono) by Michael Cowgill Copyright � 2014-17
+
+Adaptation for MS_General.sf2 by S. Christian Collins Copyright � 2018
+
+Temple Blocks instrument provided by Ethan Winer Copyright � 2002
+
+Drumline Percussion provided by Michael Schorsch Copyright � 2016
+
+MS_General.sf2 is shared under the MIT license as described in COPYING, as was FluidR3Mono and FluidR3 before it. The licensing for this new collection is currently under discussion and may be subject to change before release.
+
+The COPYING and README files from the original FluidR3GM file are now displayed here for reference.
+
+The acknowledgements and copyright notices above must be included in any derivative work.
+
+
+README
+---
+
+Fluid (R3) SoundFont
+
+Copyright (c) 2000-2002, 2008 Frank Wen <getfrank@gmail.com>
+
+I hereby release Fluid under the MIT license, as described in COPYING.
+
+
+Thanks to Toby Smithe for helping to get Fluid included in Ubuntu.
+
+This package, of course, is the original Release 3 of Fluid.  
+
+
+Fluid was constructed in part from samples found in the public domain that I
+edited/cleaned/remixed/programmed and largely from recordings of my own and
+in conjunction with the people below who helped along the way:
+
+Suren M. Seron
+Scott Hanan
+Steve Aupperle
+Chris Gillman
+Alex Taubr
+Chris Prola
+Andrew Klenk
+Winfried Hubbe 
+Dylan
+Tim
+Gort
+Uros Katic 
+Ethan Winer (http://www.ethanwiner.com) 
+
+
+It's obviously been a few years since the project, but its nice to see that
+people are still enjoying my work and getting good use out of it.  As always,
+I'd like to hear some work done with Fluid so email me, or just email me to
+say hello and tell me what is going on in the computer musician world.
+Who knows, maybe I'll kick start this project again? ;)
+
+
+COPYING
+---
+
+Mono version:  Copyright (c) 2014-16 Michael Cowgill 
+Copyright (c) 2000-2002, 2008 Frank Wen <getfrank@gmail.com>
+
+Permission is hereby granted, free of charge, to any person
+obtaining a copy of this software and associated documentation
+files (the "Software"), to deal in the Software without
+restriction, including without limitation the rights to use,
+copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the
+Software is furnished to do so, subject to the following
+conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
+OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+OTHER DEALINGS IN THE SOFTWARE.
+

package/dist/__vite-browser-external-l0sNRNKZ.js

@@ -0,0 +1 @@
+