index.943af03c.js 3.4 KB

1
  1. import{d as v,N as y,U as C,bz as c,a as o,g as n}from"./App.03d0734f.js";var e=y({});let f=null;var w=v({name:"VelFlowTest",data(){return{xml:"https://ks3-cn-beijing.ksyuncs.com/cloud-coach/1661242248370\u5C24\u514B\u91CC\u91CC-\u6D4B\u8BD5-\u97F3\u9636.xml"}},computed:{isHidden(){return e&&e.cursor&&e.cursor.Hidden}},async mounted(){e=new C(document.querySelector("#container1"),{backend:"svg",drawTitle:!0,coloringSetCustom:["#00ff00"],cursorsOptions:[{type:0,color:"green",alpha:1,follow:!0}]}),e.EngravingRules.StaffLineColor="rgba(238,128,196,1)",e.EngravingRules.DefaultColorCursor="rgba(238,128,196,1)",this.handleJianpu(this.xml);var r=document.getElementById("glyphs"),t=0,a=0;for(var s in c.Flow.Font.glyphs)c.Flow.Font.glyphs[s]=c.Flow.Font.glyphs[s],a++;var h=(a+1)/(800/(120*2))*60;r.height=h,r.width=800;var l=r.getContext("2d");l.font="14pt Courier";var i=60;for(var s in c.Flow.Font.glyphs){if(l.fillStyle="#222",l.fillText(s,t,i),t+=60,l.fillStyle="green",c.Flow.Font.glyphs[s].o){let u=new c.Flow.Glyph(s,45);u.render(l,t,i),l.save(),l.font="6pt Arial",u.getMetrics(),l.restore()}t+=60,t>=800&&(t=0,i+=120)}},methods:{async handleJianpu(r="",t="staff"){e.EngravingRules.DYMusicScoreType=t,await e.load(r),e.render(),console.log(e),this.getAllNote(),e.cursor.reset()},getAllNote(){var h,l,i;var r=[];e.cursor.reset();const t=e.cursor.Iterator;for(;!t.EndReached;){const m=(h=t.CurrentVoiceEntries)!=null&&h[0]?[(l=t.CurrentVoiceEntries)==null?void 0:l[0]]:[],u=(i=t.CurrentVoiceEntries)==null?void 0:i[1];for(var a=0;a<m.length;a++){const p=m[a].Notes;for(var s=0;s<p.length;s++){const d=p[s];d!=null&&d.halfTone!=0&&!d.isRest()&&r.push({note:d.halfTone+12,time:t.currentTimeStamp.RealValue*4,halfTone1:p.map(g=>g.halfTone+12).filter(Boolean),halfTone2:u&&Array.isArray(u.notes)?u.notes.map(g=>g.halfTone+12).filter(Boolean):[]})}}t.moveToNext()}console.log(r)},onNext(){e.cursor.next(),console.log(e.cursor)},onReset(){e.cursor.reset()},onToggle(){e.cursor.Hidden?e.cursor.show():e.cursor.hide()},autoPlay(){clearTimeout(f);let r=0;f=setInterval(()=>{console.log(e.cursor.cursorElement.style.display),new Date().getTime()-r>2e3&&e.cursor.next(),r=new Date().getTime(),console.log(e.cursor.cursorElement.style.display)},1e3)}},render(){return o("div",null,[o("button",{onClick:()=>this.handleJianpu(this.xml,"jianpu")},[n("\u7B80\u8C31")]),o("button",{onClick:()=>this.handleJianpu("/jianpu/\u56DB\u4E8C\u62CD-\u6848\u4F8B0629.xml","jianpu")},[n("\u56DB\u4E8C")]),o("button",{onClick:()=>this.handleJianpu("/jianpu/\u56DB\u4E09\u62CD-\u6848\u4F8B0629.xml","jianpu")},[n("\u56DB\u4E09")]),o("button",{onClick:()=>this.handleJianpu("/jianpu/\u56DB\u56DB\u62CD-\u6848\u4F8B0629.xml","jianpu")},[n("\u56DB\u56DB")]),o("button",{onClick:()=>this.handleJianpu("/jianpu/\u516B\u4E09\u62CD-\u6848\u4F8B0629_jp.xml","jianpu")},[n("\u516B\u4E09")]),o("button",{onClick:()=>this.handleJianpu("/jianpu/\u516B\u516D\u62CD-\u6848\u4F8B0629.xml","jianpu")},[n("\u516B\u516D")]),o("div",null,[o("button",{onClick:this.onNext},[n("next")]),o("button",{onClick:this.onReset},[n("reset")]),o("button",{onClick:this.onToggle},[n("\u9690\u85CFcursor")]),o("button",{onClick:this.onToggle},[n("\u663E\u793Acursorsh")]),o("button",{onClick:this.autoPlay},[n("\u81EA\u52A8")])]),o("div",{id:"container1"},null),o("canvas",{id:"glyphs",width:"800",height:"1600"},[n("HTML5 Canvas not supported on this browser.")])])}});export{w as default};