1import{d as defineStore}from"./chunks/theme.44G75b2n.js";import{j as defineComponent,q as openBlock,k as createElementBlock,u as toDisplayString,y as createCommentVNode,l as renderSlot,_ as _export_sfc,f as computed,r as ref,V as resolveComponent,D as createBaseVNode,p as normalizeClass,ab as withDirectives,ag as vModelCheckbox,S as Fragment,U as renderList,v as createBlock,W as createVNode,x as withCtx,E as unref,w as watch,n as nextTick,s as createTextVNode}from"./chunks/framework.CAxyzSFi.js";import{a as abcjs}from"./chunks/index.DRo0WOk4.js";const setupString=t=>t?'import abcjs from "abcjs"':'<script src="abcjs-basic.js" type="text/javascript"><\/script>',paperString=t=>t?'<div id="paper"></div>':"",editorString=t=>t?`<textarea id="abc" cols="80" rows="12" spellcheck="false">X: 1 2T: Cooley's 3M: 4/4 4L: 1/8 5R: reel 6K: Emin 7|:D2|EB{c}BA B2 EB|~B2 AB dBAG|FDAD BDAD|FDAD dAFD| 8EBBA B2 EB|B2 AB defg|afe^c dBAF|DEFD E2:| 9|:gf|eB B2 efge|eB B2 gedB|A2 FA DAFA|A2 FA defg| 10eB B2 eBgB|eB B2 defg|afe^c dBAF|DEFD E2:| 11</textarea> 12 13<div id="warnings">No errors</div>`:"",audioString=(t,e)=>{let o="";return t&&(e?o='<div id="audio" class="abcjs-large"></div>':o='<div id="audio"></div>',o+='<button class="activate-audio">Activate Audio</button>'),o},midiString=t=>t?'<div id="midi-download"></div>':"",clickListenerHtmlString=t=>t?'<div class="clicked-info"><div class="instructions">Click on a note to see information about that note.</div></div>':"",dragExplanationHtmlString=t=>t?"<p>Drag a note up and down and watch the source code change to match it.</p>":"",dragHtmlString=t=>t?`<h2>Source</h2> 14<div id="source"></div>`:"",startTimerHtmlString=t=>t?'<button class="start">Start</button>':"",preambleString=t=>`<!DOCTYPE html> 15<html lang="en"> 16<head> 17<meta charset="utf-8"> 18<meta http-equiv="x-ua-compatible" content="ie=edge"> 19<meta name="viewport" content="width=device-width, initial-scale=1"> 20 21<title>${t}</title> 22`,preamble2String=t=>`<script src="abcjs-basic.js" type="text/javascript"><\/script> 23<script type="text/javascript"> 24${t?"":`var abcString = "T: Cooley's\\n" + 25"M: 4/4\\n" + 26"L: 1/8\\n" + 27"R: reel\\n" + 28"K: Emin\\n" + 29"|:D2|EB{c}BA B2 EB|~B2 AB dBAG|FDAD BDAD|FDAD dAFD|\\n" + 30"EBBA B2 EB|B2 AB defg|afe^c dBAF|DEFD E2:|\\n" + 31"|:gf|eB B2 efge|eB B2 gedB|A2 FA DAFA|A2 FA defg|\\n" + 32"eB B2 eBgB|eB B2 defg|afe^c dBAF|DEFD E2:|";`} 33 34function load() { 35`,middleString=t=>`} 36<\/script> 37</head> 38<body onload="load()"> 39<header> 40<h1>${t}</h1> 41</header> 42<div class="container"> 43`,postAmbleString=()=>`</div> 44</body> 45</html> 46`,cssString=(t,e,o,n,r)=>{let a=[];return t&&a.push('<link rel="stylesheet" type="text/css" href="abcjs-audio.css">'),e&&a.push(`<style> 47.abcjs-highlight { 48fill: #0a9ecc; 49} 50.abcjs-cursor { 51stroke: red; 52} 53</style> 54`),o&&a.push(`<style> 55.hide-note { 56opacity: 0; 57transition: opacity .5s ease; 58} 59</style> 60`),n&&a.push(`<style> 61#source { 62font-size: 18px; 63max-width: 700px; 64overflow: auto; 65font-family: "Lucida Console", Monaco, monospace; 66white-space: nowrap; 67} 68.select { 69background-color: #FCF9BB; 70box-shadow: 0 0 1px black; 71} 72</style> 73`),r&&a.push(`<style> 74.clicked-info { 75height: 200px; 76} 77.instructions { 78color: red; 79font-size: 2em; 80font-style: italic; 81} 82</style> 83`),a.join(` 84`)};function entryPoint(t){return t?"abcjs":"ABCJS"}function target(t){return t?"paper":"*"}const renderAbcString=(t,e,o,n)=>e?`var visualOptions = ${n}; 85var visualObj = ${entryPoint(t)}.renderAbc("${target(o)}", abcString, visualOptions);`:"",editorJsString=(t,e,o)=>e?`var options = {}; 86var editor = new ${entryPoint(t)}.Editor("abc", { 87 canvas_id: "${target(o)}", 88 warnings_id: "warnings", 89 abcjsParams: options 90});`:"",visualOptionsString=(t,e,o,n,r)=>{let a=[];return t&&a.push("responsive: 'resize'"),e&&a.push("clickListener: clickListener"),(e||n)&&a.push("add_classes: true"),r&&a.push("jazzchords: true"),o&&a.push("drum: 'dddd 76 77 77 77 60 30 30 30'"),"{ "+a.join(", ")+" }"},clickListenerJsString=t=>
90t?`function clickListener(abcelem, tuneNumber, classes, analysis, drag, mouseEvent) { 91var output = "abcelem: [Object]<br>tuneNumber: " + tuneNumber + "<br>classes: " + classes + "<br>analysis: " + JSON.stringify(analysis) + "<br>drag: " + JSON.stringify(drag) + "<br>mouseEvent: { clientX: " + mouseEvent.clientX + ", clientY: " + mouseEvent.clientY + " }"; 92document.querySelector(".clicked-info").innerHTML = "<div class='label'>Clicked info:</div>" + output; 93} 94`:"",cursor1=` 95// This demonstrates two methods of indicating where the music is. 96 // 1) An element is created that is moved along for each note. 97 // 2) The currently being played note is given a class so that it can be transformed. 98 self.cursor = null; // This is the svg element that will move with the music. 99 self.rootSelector = rootSelector; // This is the same selector as the renderAbc call uses. 100 101 self.onStart = function() { 102 // This is called when the timer starts so we know the svg has been drawn by now. 103 // Create the cursor and add it to the sheet music's svg. 104 var svg = document.querySelector(self.rootSelector + " svg"); 105 self.cursor = document.createElementNS("http://www.w3.org/2000/svg", "line"); 106 self.cursor.setAttribute("class", "abcjs-cursor"); 107 self.cursor.setAttributeNS(null, 'x1', 0); 108 self.cursor.setAttributeNS(null, 'y1', 0); 109 self.cursor.setAttributeNS(null, 'x2', 0); 110 self.cursor.setAttributeNS(null, 'y2', 0); 111 svg.appendChild(self.cursor); 112 }; 113 114 self.removeSelection = function() { 115 // Unselect any previously selected notes. 116 var lastSelection = document.querySelectorAll(self.rootSelector + " .abcjs-highlight"); 117 for (var k = 0; k < lastSelection.length; k++) 118 lastSelection[k].classList.remove("abcjs-highlight"); 119 }; 120 121`,cursor2=` 122 // This is called every time a note or a rest is reached and contains the coordinates of it. 123 if (ev.measureStart && ev.left === null) 124 return; // this was the second part of a tie across a measure line. Just ignore it. 125 126 self.removeSelection(); 127 128 // Select the currently selected notes. 129 for (var i = 0; i < ev.elements.length; i++ ) { 130 var note = ev.elements[i]; 131 for (var j = 0; j < note.length; j++) { 132 note[j].classList.add("abcjs-highlight"); 133 } 134 } 135 136 // Move the cursor to the location of the current note. 137 if (self.cursor) { 138 self.cursor.setAttribute("x1", ev.left - 2); 139 self.cursor.setAttribute("x2", ev.left - 2); 140 self.cursor.setAttribute("y1", ev.top); 141 self.cursor.setAttribute("y2", ev.top + ev.height); 142 } 143`,cursor3=` self.removeSelection(); 144 145 if (self.cursor) { 146 self.cursor.setAttribute("x1", 0); 147 self.cursor.setAttribute("x2", 0); 148 self.cursor.setAttribute("y1", 0); 149 self.cursor.setAttribute("y2", 0); 150 } 151`,hide1=` if (ev.measureStart) { 152 var elements = document.querySelectorAll('.abcjs-mm' + ev.measureNumber); 153 for (var j = 0; j < elements.length; j++) { 154 const element = elements[j]; 155 if (!element.classList.contains('abcjs-bar')) 156 element.classList.add('hide-note'); 157 } 158 } 159`,hide2=` 160 var elements = document.querySelectorAll('.hide-note'); 161 for (var j = 0; j < elements.length; j++) { 162 const element = elements[j]; 163 element.classList.remove('hide-note'); 164 } 165`,cursorString=(t,e,o)=>`function CursorControl(rootSelector) { 166 var self = this; 167${e?cursor1:""} 168 self.onEvent = function(ev) { 169${e?cursor2:""} 170 ${o?hide1:""} 171 172 }; 173 self.onFinished = function() { 174 ${e?cursor3:""} 175 ${o?hide2:""} 176 }; 177} 178 179var cursorControl = new CursorControl("#paper"); 180 181document.querySelector(".start").addEventListener("click", startTimer); 182 183function onEvent(ev) { 184if (ev) 185cursorControl.onEvent(ev); 186else 187cursorControl.onFinished(); 188} 189 190function startTimer() { 191 ${e?"cursorControl.onStart();":""} 192 193var timingCallbacks = new ${t?"abcjs":"ABCJS"}.TimingCallbacks(visualObj[0], { 194 eventCallback: onEvent 195}); 196timingCallbacks.start(); 197} 198`,cursorJsString=(t,e,o)=>!e&&!o?"":cursorString(t,e,o),dragJsString=(t,e)=>e?`function sanitize(str) { 199return str.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>'); 200} 201function formatAbc(start, end) { 202var abc; 203if (start < 0 || end < 0) 204abc = sanitize(abcString); 205else { 206abc = sanitize(abcString.substring(0, start)) + 207'<span class="select">' + 208sanitize(abcString.substring(start, end)) + 209'</span>' + 210sanitize(abcString.substring(end)); 211} 212var el = document.getElementById("source");
213el.innerHTML = abc.replace(/\\n/g,"<br>"); 214} 215function draw() { 216var options = { 217add_classes: true, 218selectionColor: "green", 219dragColor: "blue", 220clickListener: clickListener, 221dragging: true, 222selectTypes: [ 'note' ] 223}; 224 225${t?"abcjs":"ABCJS"}.renderAbc("paper", abcString, options); 226} 227 228var allPitches = [ 229'C,,,,', 'D,,,,', 'E,,,,', 'F,,,,', 'G,,,,', 'A,,,,', 'B,,,,', 230'C,,,', 'D,,,', 'E,,,', 'F,,,', 'G,,,', 'A,,,', 'B,,,', 231'C,,', 'D,,', 'E,,', 'F,,', 'G,,', 'A,,', 'B,,', 232'C,', 'D,', 'E,', 'F,', 'G,', 'A,', 'B,', 233'C', 'D', 'E', 'F', 'G', 'A', 'B', 234'c', 'd', 'e', 'f', 'g', 'a', 'b', 235"c'", "d'", "e'", "f'", "g'", "a'", "b'", 236"c''", "d''", "e''", "f''", "g''", "a''", "b''", 237"c'''", "d'''", "e'''", "f'''", "g'''", "a'''", "b'''", 238"c''''", "d''''", "e''''", "f''''", "g''''", "a''''", "b''''" 239]; 240 241function moveNote(note, step) { 242var x =allPitches.indexOf(note); 243if (x >= 0) 244return allPitches[x-step]; 245return note; 246} 247 248function tokenize(str) { 249var arr = str.split(/(!.+?!|".+?")/); 250var output = []; 251for (var i = 0; i < arr.length; i++) { 252var token = arr[i]; 253if (token.length > 0) {
254if (token[0] !== '"' && token[0] !== '!') { 255var arr2 = arr[i].split(/([A-Ga-g][,']*)/); 256output = output.concat(arr2); 257} else 258output.push(token); 259} 260} 261return output; 262} 263 264var selectionCallback; 265var currentIndex = -1; 266var maxIndex = -1; 267 268function clickListener(abcelem, tuneNumber, classes, analysis, drag, mouseEvent) { 269if (drag) { 270selectionCallback = drag.setSelection; 271currentIndex = drag.index; 272maxIndex = drag.max; 273} 274if (abcelem.pitches && drag && drag.step && abcelem.startChar >= 0 && abcelem.endChar >= 0) { 275var originalText = abcString.substring(abcelem.startChar, abcelem.endChar); 276var arr = tokenize(originalText); 277// arr now contains elements that are either a chord, a decoration, a note name, or anything else. It can be put back to its original string with .join(""). 278for (var i = 0; i < arr.length; i++) { 279arr[i] = moveNote(arr[i], drag.step); 280} 281var newText = arr.join(""); 282 283abcString = abcString.substring(0, abcelem.startChar) + newText + abcString.substring(abcelem.endChar); 284formatAbc(abcelem.startChar, abcelem.endChar); 285draw(); 286} else if (abcelem.startChar >= 0 && abcelem.endChar >= 0) 287formatAbc(abcelem.startChar, abcelem.endChar); 288} 289 290formatAbc(-1,-1); 291draw(); 292`:"",soundJsString=((t,e)=>{if(!e.hasSound)return"";const o=t?"abcjs":"ABCJS";let n=`document.querySelector(".activate-audio").addEventListener("click", activate); 293function activate() { 294 if (${o}.synth.supportsAudio()) { 295`;if(e.playbackWidget){let s=[];e.loop&&s.push(" displayLoop: true"),e.restart&&s.push(" displayRestart: true"),e.play&&s.push(" displayPlay: true"),e.progress&&s.push(" displayProgress: true"),e.warp&&s.push(" displayWarp: true"),e.clock&&s.push(" displayClock: true"),n+=` var controlOptions = { 296${s.join(`, 297`)} 298 }; 299`}let r=[],a=[];e.tempo&&r.push("millisecondsPerMeasure: 800"),e.stereo&&a.push("pan: [-.5,.5]"),e.noChords&&r.push("chordsOff: true"),e.noVoice&&r.push("voicesOff: true"),e.midi&&r.push("midi"),e.swingFeel&&r.push("swing"),e.soundfont&&a.push("soundfont: '/path/to/soundfont/'"),r.push(`options: { 300 `+a.join(`, 301 `)+` 302 } 303`),n+=` var synthControl = new ${o}.synth.SynthController(); 304`;var i=e.cursor?"cursorControl":"null";return n+=` synthControl.load("#audio", ${i}, controlOptions); 305`,n+=` synthControl.disable(true); 306 var midiBuffer = new ${o}.synth.CreateSynth(); 307 midiBuffer.init({ 308 visualObj: visualObj[0], 309 ${r.join(`, 310 `)} 311 }).then(function () { 312 synthControl.setTune(visualObj[0], true).then(function (response) { 313 document.querySelector(".abcjs-inline-audio").classList.remove("disabled"); 314 }) 315 }); 316`,n+=` } else { 317 console.log("audio is not supported on this browser"); 318 }; 319} 320`,n}),useExampleGeneratorStore=defineStore("example-generator",{state:()=>({usingNode:!0,soundfont:!1,sheetMusic:!0,cursor:!1,hideMeasures:!1,jazzChords:!1,responsive:!1,changes:"programmatic",hideVoice:!1,preload:!1,loopMeasures:!1,swingFeel:!1,hasSound:!1,playbackWidget:!0,large:!1,loop:!1,restart:!0,play:!0,progress:!0,warp:!1,clock:!0,usingCallbacks:!1,metronome:!1,tempo:!1,stereo:!1,instrument:!1,transpose:!1,noChords:!1,noVoice:!1,tweak:!1,midi:!1,playImmediate:!1,switchTunes:!1,isDownloading:!1}),getters:{declaration(){return setupString(this.usingNode)},sheetMusicHtml(){return`${dragExplanationHtmlString(this.changes==="drag")} 321${editorString(this.hasEditor)} 322${paperString(this.sheetMusic)} 323${audioString(this.playbackWidget&&this.hasSound,this.large)} 324${midiString(this.midi)} 325${clickListenerHtmlString(this.sheetMusic&&this.usingCallbacks)} 326${dragHtmlString(this.changes==="drag")} 327${startTimerHtmlString(this.sheetMusic&&(this.cursor||this.hideMeasures))} 328`},sheetMusicCss(){return cssString(this.playbackWidget&&this.hasSound,this.sheetMusic&&this.cursor,this.sheetMusic&&this.hideMeasures,this.sheetMusic&&this.changes==="drag",this.sheetMusic&&this.usingCallbacks)},sheetMusicJs(){const t=this.isDownloading?!1:this.usingNode;return sheetMusicJsBuilder(t)},sheetMusicJsNode(){return sheetMusicJsBuilder(!0)},hasEditor(){return this.changes==="editor"},title(){let t=[];return this.sheetMusic&&t.push("visual"),this.sheetMusic&&this.responsive&&t.push("responsive"),this.sheetMusic&&this.cursor&&t.push("cursor"),this.sheetMusic&&this.hideMeasures&&t.push("hide"),this.sheetMusic&&this.jazzChords&&t.push("jazz"),t.push(this.changes),this.sheetMusic&&this.usingCallbacks&&t.push("callback"),this.hasSound&&t.pu
328sh("sound"),this.hasSound&&this.playbackWidget&&t.push("playback"),this.hasSound&&this.playbackWidget&&this.large&&t.push("large"),this.hasSound&&this.playbackWidget&&this.loop&&t.push("loop"),this.hasSound&&this.playbackWidget&&this.restart&&t.push("restart"),this.hasSound&&this.playbackWidget&&this.play&&t.push("play"),this.hasSound&&this.playbackWidget&&this.progress&&t.push("progress"),this.hasSound&&this.playbackWidget&&this.warp&&t.push("warp"),this.hasSound&&this.playbackWidget&&this.clock&&t.push("clock"),this.hasSound&&this.metronome&&t.push("metronome"),this.hasSound&&this.tempo&&t.push("tempo"),this.hasSound&&this.stereo&&t.push("stereo"),this.hasSound&&this.instrument&&t.push("instrument"),this.hasSound&&this.transpose&&t.push("transpose"),this.hasSound&&this.noChords&&t.push("nochords"),this.hasSound&&this.noVoice&&t.push("novoice"),this.hasSound&&this.tweak&&t.push("tweak"),this.hasSound&&this.midi&&t.push("midi"),this.hasSound&&this.playImmediate&&t.push("immediate"),this.hasSound&&this.switchTunes&&t.push("switchtunes"),this.hasSound&&this.hideVoice&&t.push("hideVoice"),this.hasSound&&this.preload&&t.push("preload"),this.hasSound&&this.loopMeasures&&t.push("loopmeasures"),this.hasSound&&this.swingFeel&&t.push("swing"),this.hasSound&&this.soundfont&&t.push("soundfont"),t.join(" ")},filename(){return this.title.replace(/ /g,"-")+".html"},fullDemo(){return`${preambleString(this.title)}${this.sheetMusicCss}${preamble2String(this.hasEditor)}${this.sheetMusicJs}${middleString(this.title)}${this.sheetMusicHtml}${postAmbleString()}`}},actions:{setIsDownloading(t){this.isDownloading=t}}});function sheetMusicJsBuilder(t){const e=useExampleGeneratorStore(),o=visualOptionsString(e.responsive,e.sheetMusic&&e.usingCallbacks,e.hasSound&&e.metronome,e.hideMeasures,e.jazzChords);return`var abcString = \`T: Cooley's 329M: 4/4 330L: 1/8 331R: reel 332K: Emin 333|:D2|"Em"EB{c}BA B2 EB|~B2 AB dBAG|"D"FDAD BDAD|FDAD dAFD| 334"Em"EBBA B2 EB|B2 AB defg|"D"afe^c dBAF|"Em"DEFD E2:| 335|:gf|"Em"eB B2 efge|eB B2 gedB|"D"A2 FA DAFA|A2 FA defg| 336"Em"eB B2 eBgB|eB B2 defg|"D"afe^c dBAF|"Em"DEFD E2:|\` 337${renderAbcString(t,!e.hasEditor,e.sheetMusic,o)} 338${editorJsString(t,e.hasEditor,e.sheetMusic)} 339${soundJsString(t,e)} 340${clickListenerJsString(e.sheetMusic&&e.usingCallbacks)} 341${cursorJsString(t,e.sheetMusic&&e.cursor,e.sheetMusic&&e.hideMeasures)} 342${dragJsString(t,e.changes==="drag")} 343`.replace(/\t/g," ")}const _hoisted_1$6={key:0},_sfc_main$7=defineComponent({__name:"FieldSet",props:{label:{}},setup(t){return(e,o)=>(openBlock(),createElementBlock("fieldset",null,[t.label?(openBlock(),createElementBlock("legend",_hoisted_1$6,toDisplayString(t.label),1)):createCommentVNode("",!0),renderSlot(e.$slots,"controls",{},void 0,!0)]))}}),FieldSet=_export_sfc(_sfc_main$7,[["__scopeId","data-v-14a7f8fa"]]),_hoisted_1$5={class:"check-box"},_hoisted_2$3={class:"checkbox__input"},_hoisted_3$3=["disabled","value"],_hoisted_4$2={class:"radio__label"},_hoisted_5$2={key:0,class:"sub-options"},_sfc_main$6=defineComponent({__name:"CheckBox",props:{label:{},value:{},modelValue:{type:Boolean},subOptions:{},disabled:{type:Boolean}},emits:["update:modelValue"],setup(t,{emit:e}){const o=e,n=t,r=computed(()=>{let i=["checkbox"];return n.disabled&&i.push("checkbox--disabled"),i.join(" ")}),a=ref(n.modelValue);return(i,s)=>{const l=resolveComponent("CheckBox",!0);return openBlock(),createElementBlock("div",_hoisted_1$5,[createBaseVNode("label",{class:normalizeClass(r.value)},[createBaseVNode("span",_hoisted_2$3,[withDirectives(createBaseVNode("input",{type:"checkbox",disabled:t.disabled,onInput:s[0]||(s[0]=u=>o("update:modelValue",{id:t.value,value:u.target.checked})),value:t.modelValue,"onUpdate:modelValue":s[1]||(s[1]=u=>a.value=u)},null,40,_hoisted_3$3),[[vModelCheckbox,a.value]]),s[3]||(s[3]=createBaseVNode("span",{class:"checkbox__control"},[createBaseVNode("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24","aria-hidden":"true",focusable:"false"},[createBaseVNode("path",{fill:"none",stroke:"var(--vp-c-neutral)","stroke-width":"3",d:"M1.73 12.91l6.37 6.37L22.79 4.59"})])],-1))]),createBaseVNode("span",_hoisted_4$2,toDisplayString(t.label),1)],2),t.subOptions?(openBlock(),createElementBlock("div",_hoisted_5$2,[(openBlock(!0),createElementBlock(Fragment,null,renderList(t.subOptions,u=>(openBlock(),createBlock(l,{label:u.text,value:u.value,modelValue:u.modelValue,disabled:t.disabled||!a.value||u.todo,class:normalizeClass({todo:u.todo}),"onUpdate:modelValue":s[2]||(s[2]=c=>o("update:modelValue",c))},null,8,["label","value","modelValue","disabled","class"]))),256))])):createCommentVNode("",!0)])}}}),CheckBox=_export_sfc(_sfc_main$6,[["__scopeId","data-v-7e83ff4d"]]),_hoisted_1$4={class:"radio-group"},_hoisted_2$2={class:"radio radio-gradient"},_hoisted_3$2={class:"radio__input"},_hoisted_4$1=["name","value","checked","onInput"],_hoisted_5$1={class:"radio__label"},_sfc_main$5=defineComponent({__name:"RadioGroup",props:{label:{},name:{},modelValue:{},options:{}},emits:["update:modelValue"],setup(t,{emit:e}){const o=e;return(n,r)=>(openBlock(),createElementBlock("div",_hoisted_1$4,[createVNode(FieldSet,{label:t.label},{controls:withCtx(()=>[(openBlock(!0),createElementBlock(Fragment,null,renderList(t.options,a=>(openBlock(),createElementBlock("label",_hoisted_2$2,[createBaseVNode("span",_hoisted_3$2,[createBaseVNode("input",{type:"radio",name:t.name,value:a.value,checked:t.modelValue===a.value,onInput:i=>o("update:modelValue",{id:t.name,value:a.value})},null,40,_hoisted_4$1),r[0]||(r[0]=createBaseVNode("span",{class:"radio__control"},null,-1))]),createBaseVNode("span",_hoisted_5$1,toDisplayString(a.text),1)]))),256))]),_:1},8,["label"])]))}}),RadioGroup=_export_sfc(_sfc_main$5,[["__scopeId","data-v-f5a72989"]]),_hoisted_1$3={class:"sandbox-input"},_sfc_main$4=defineComponent({__name:"SandboxInput",setup(t){const e=useExampleGeneratorStore(),o=computed(()=>e.hasSound),n=computed(()=>e.sheetMusic),r=[{text:"I want a metronome accompaniment",modelValue:e.metronome,value:"metronome"},{text:"I want to control the tempo programmatically",modelValue:e.tempo,value:"tempo"},{text:"I want to create a stereo effect",modelValue:e.stereo,value:"stereo"},{text:"I want to set the instrument(s) that are played back",modelValue:e.instrument,value:"instrument"},{text:"I want to transpose",modelValue:e.transpose,value:"transpose"},{text:"I want to turn off the chord accompaniment",modelValue:e.noChords,value:"noChords"},{text:"I want to turn off a voice",modelValue:e.noVoice,value:"noVoice"},{text:"I want to be able to tweak the audio before it is created.",modelValue:e.tweak,value:"tweak",todo:!0},{text:"I want to download a MIDI file",modelValue:e.midi,value:"midi"}
343,{text:"I want to play an arbitrary note without ABC",modelValue:e.playImmediate,value:"playImmediate"},{text:"I want to switch tunes dynamically",modelValue:e.switchTunes,value:"switchTunes",todo:!0},{text:"I want to hide a voice visually but play it",modelValue:e.hideVoice,value:"hideVoice"},{text:"I want to preload notes",modelValue:e.preload,value:"preload",todo:!0},{text:"I want to loop some measures",modelValue:e.loopMeasures,value:"loopMeasures",todo:!0},{text:"I want to add swing feel",modelValue:e.swingFeel,value:"swingFeel",todo:!0},{text:"I have my own soundfont",modelValue:e.soundfont,value:"soundfont"}];return(a,i)=>(openBlock(),createElementBlock("div",_hoisted_1$3,[createBaseVNode("div",null,[createVNode(FieldSet,{label:"Setup"},{controls:withCtx(()=>[createVNode(CheckBox,{modelValue:unref(e).usingNode,"onUpdate:modelValue":i[0]||(i[0]=s=>unref(e)[s.id]=s.value),label:"I am using the Node ecosystem",value:"usingNode"},null,8,["modelValue"])]),_:1}),createVNode(FieldSet,{label:"Visual"},{controls:withCtx(()=>[createVNode(CheckBox,{modelValue:unref(e).sheetMusic,"onUpdate:modelValue":i[1]||(i[1]=s=>unref(e)[s.id]=s.value),label:"Show sheet music","sub-options":[{text:"The width of the music should change with the width of the display",modelValue:unref(e).responsive,value:"responsive"},{text:"Cursor should follow the playback",modelValue:unref(e).cursor,value:"cursor"},{text:"Measures should hide as they finish playing",modelValue:unref(e).hideMeasures,value:"hideMeasures"},{text:"I want to style the chords like a fake book",modelValue:unref(e).jazzChords,value:"jazzChords"}],value:"sheetMusic"},null,8,["modelValue","sub-options"])]),_:1}),createVNode(RadioGroup,{label:"Changes",name:"changes",options:[{text:"The tune is determined programmatically",value:"programmatic"},{text:"User changes the tune with a visual editor",value:"drag"},{text:"User changes the tune with a text editor",value:"editor"}],modelValue:unref(e).changes,"onUpdate:modelValue":i[2]||(i[2]=s=>unref(e)[s.id]=s.value)},null,8,["modelValue"]),createVNode(FieldSet,{label:"Audio Control"},{controls:withCtx(()=>[createVNode(CheckBox,{modelValue:unref(e).playbackWidget,"onUpdate:modelValue":i[3]||(i[3]=s=>unref(e)[s.id]=s.value),label:"Show playback widget","sub-options":[{text:"I want the large playback widget",modelValue:unref(e).large,value:"large"},{text:"Include Loop",modelValue:unref(e).loop,value:"loop"},{text:"Include Restart",modelValue:unref(e).restart,value:"restart"},{text:"Include Play",modelValue:unref(e).play,value:"play"},{text:"Include Progress",modelValue:unref(e).progress,value:"progress"},{text:"Include Warp",modelValue:unref(e).warp,value:"warp"},{text:"Include Clock",modelValue:unref(e).clock,value:"clock"}],value:"playbackWidget",disabled:!o.value},null,8,["modelValue","sub-options","disabled"])]),_:1})]),createBaseVNode("div",null,[createVNode(FieldSet,{label:"Sound"},{controls:withCtx(()=>[createVNode(CheckBox,{modelValue:unref(e).hasSound,"onUpdate:modelValue":i[4]||(i[4]=s=>
343unref(e)[s.id]=s.value),label:"I want sound",value:"hasSound","sub-options":r},null,8,["modelValue"])]),_:1}),createVNode(FieldSet,{label:"Timing"},{controls:withCtx(()=>[createVNode(CheckBox,{modelValue:unref(e).usingCallbacks,"onUpdate:modelValue":i[5]||(i[5]=s=>unref(e)[s.id]=s.value),label:"Listen for callbacks",value:"usingCallbacks",disabled:!n.value},null,8,["modelValue","disabled"])]),_:1})])]))}}),SandboxInput=_export_sfc(_sfc_main$4,[["__scopeId","data-v-c8324d21"]]),_hoisted_1$2={class:"sandbox-output"},_hoisted_2$1=["innerHTML"],_hoisted_3$1=["innerHTML"],_sfc_main$3=defineComponent({__name:"SandboxOutput",setup(__props){const store=useExampleGeneratorStore(),sheetMusicCss=computed(()=>store.sheetMusicCss),sheetMusicJsNode=computed(()=>store.sheetMusicJsNode),sheetMusicHtml=computed(()=>store.sheetMusicHtml),running=ref(!1);watch(()=>sheetMusicJsNode.value,()=>{running.value=!1});function onloadCode(){running.value=!0,window.abcjs=abcjs,nextTick().then(()=>{const str=sheetMusicJsNode.value;eval(str)})}return(t,e)=>(openBlock(),createElementBlock("div",_hoisted_1$2,[createBaseVNode("div",{innerHTML:sheetMusicCss.value},null,8,_hoisted_2$1),running.value?createCommentVNode("",!0):(openBlock(),createElementBlock("button",{key:0,class:"run-demo",onClick:onloadCode},"Run Demo")),createBaseVNode("div",{class:normalizeClass(`demo ${running.value?"running":""}`),innerHTML:sheetMusicHtml.value},null,10,_hoisted_3$1)]))}}),_hoisted_1$1={class:"sandbox-code"},_sfc_main$2=defineComponent({__name:"SandboxCode",setup(t){const e=useExampleGeneratorStore(),o=computed(()=>e.declaration),n=computed(()=>e.sheetMusicHtml),r=computed(()=>e.sheetMusicJs),a=computed(()=>e.sheetMusicCss);return(i,s)=>(openBlock(),createElementBlock("div",_hoisted_1$1,[s[0]||(s[0]=createBaseVNode("h3",null,"Header",-1)),createBaseVNode("code",null,toDisplayString(o.value),1),s[1]||(s[1]=createBaseVNode("h3",null,"HTML",-1)),createBaseVNode("code",null,toDisplayString(n.value),1),s[2]||(s[2]=createBaseVNode("h3",null,"JavaScript",-1)),createBaseVNode("code",null,toDisplayString(r.value),1),s[3]||(s[3]=createBaseVNode("h3",null,"CSS",-1)),createBaseVNode("code",null,toDisplayString(a.value),1)]))}}),SandboxCode=_export_sfc(_sfc_main$2,[["__scopeId","data-v-d242f736"]]),_hoisted_1={class:"sandbox-container"},_hoisted_2={class:"tab-container"},_hoisted_3={key:0,class:"options"},_hoisted_4={key:1,class:"demo"},_hoisted_5={key:2,class:"source-code"},_sfc_main$1=defineComponent({__name:"SandboxContainer",setup(t){const e=useExampleGeneratorStore();computed(()=>e.fullDemo),computed(()=>e.filename);const o=ref("options"),n=computed(()=>{let s=["tab"];return o.value==="options"&&s.push("selected"),s}),r=computed(()=>{let s=["tab"];return o.value==="demo"&&s.push("selected"),s}),a=computed(()=>{let s=["tab"];return o.value==="source"&&s.push("selected"),s});function i(){e.setIsDownloading(!0);const s="data:application/txt,"+encodeURIComponent(e.fullDemo),l=document.createElement("a");document.body.appendChild(l),l.setAttribute("style","display: none;"),l.href=s,l.download=e.filename,l.click(),window.URL.revokeObjectURL(s),document.body.removeChild(l),e.setIsDownloading(!1)}return(s,l)=>(openBlock(),createElementBlock("div",_hoisted_1,[createBaseVNode("nav",null,[createBaseVNode("div",_hoisted_2,[createBaseVNode("button",{onClick:l[0]||(l[0]=u=>o.value="options"),class:normalizeClass(n.value)},"Options",2),createBaseVNode("button",{onClick:l[1]||(l[1]=u=>o.value="demo"),class:normalizeClass(r.value)},"Demo",2),createBaseVNode("button",{onClick:l[2]||(l[2]=u=>o.value="source"),class:normalizeClass(a.value)},"Source Code",2)]),createBaseVNode("button",{onClick:i,class:"download"},"Download Working Demo")]),o.value==="options"?(openBlock(),createElementBlock("div",_hoisted_3,[createVNode(SandboxInput)])):createCommentVNode("",!0),o.value==="demo"?(openBlock(),createElementBlock("div",_hoisted_4,[createVNode(_sfc_main$3)])):createCommentVNode("",!0),o.value==="source"?(openBlock(),createElementBlock("div",_hoisted_5,[createVNode(SandboxCode,{ref:"code"},null,512)])):createCommentVNode("",!0)]))}}
343),SandboxContainer=_export_sfc(_sfc_main$1,[["__scopeId","data-v-11ab9ee9"]]),__pageData=JSON.parse('{"title":"Example Generator","description":"","frontmatter":{},"headers":[],"relativePath":"overview/example-generator.md","filePath":"overview/example-generator.md"}'),__default__={name:"overview/example-generator.md"},_sfc_main=defineComponent({...__default__,setup(t){return(e,o)=>(openBlock(),createElementBlock("div",null,[o[0]||(o[0]=createBaseVNode("h1",{id:"example-generator",tabindex:"-1"},[createTextVNode("Example Generator "),createBaseVNode("a",{class:"header-anchor",href:"#example-generator","aria-label":"Permalink to âExample Generatorâ"},"â")],-1)),o[1]||(o[1]=createBaseVNode("p",null,"The most common options for using the synthesizer are listed below. Mix and match them to fit your needs, then copy the code produced into your own project.",-1)),o[2]||(o[2]=createBaseVNode("div",{class:"warning custom-block"},[createBaseVNode("p",{class:"custom-block-title"},"In Progress"),createBaseVNode("p",null,"The following is a work in progress. I hope you'll find it useful but there are many improvements planned. If you'd like to contribute to the items that are currently marked out, please do!")],-1)),createVNode(SandboxContainer)]))}});export{__pageData,_sfc_main as default};
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.