jianpurender 1.2.3 → 1.2.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/jianpurender.js +1 -1
- package/es5/svg_tools.d.ts +1 -1
- package/es6/index.js +1 -1
- package/es6/jianpu_svg_render.js +1 -1
- package/es6/lib.js +1 -1
- package/es6/svg_tools.d.ts +1 -1
- package/es6/svg_tools.js +1 -1
- package/node/index.js +1 -1
- package/node/jianpu_svg_render.js +1 -1
- package/node/lib.js +1 -1
- package/node/svg_tools.d.ts +1 -1
- package/node/svg_tools.js +1 -1
- package/package.json +1 -1
package/dist/jianpurender.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(()=>{"use strict";var t={229(t,e,i){var n=this&&this.__createBinding||(Object.create?function(t,e,i,n){void 0===n&&(n=i);var r=Object.getOwnPropertyDescriptor(e,i);r&&!("get"in r?!e.__esModule:r.writable||r.configurable)||(r={enumerable:!0,get:function(){return e[i]}}),Object.defineProperty(t,n,r)}:function(t,e,i,n){void 0===n&&(n=i),t[n]=e[i]}),r=this&&this.__exportStar||function(t,e){for(var i in t)"default"===i||Object.prototype.hasOwnProperty.call(e,i)||n(e,t,i)};Object.defineProperty(e,"__esModule",{value:!0}),r(i(88),e),r(i(186),e),r(i(826),e),r(i(567),e)},826(t,e,i){Object.defineProperty(e,"__esModule",{value:!0}),e.JianpuBlock=e.splitJianpuNote=void 0;var n=i(214);function r(t){return Math.abs(t)<1e-6}function a(t,e){var i=t.start+t.length;if(e<=t.start||e>=i||r(i-e))return null;var n=i-e;t.length=e-t.start;var a={start:e,length:n,pitch:t.pitch,intensity:t.intensity,jianpuNumber:t.jianpuNumber,octaveDot:t.octaveDot,accidental:0,tiedFrom:t};return t.tiedTo&&(a.tiedTo=t.tiedTo,t.tiedTo.tiedFrom=a),t.tiedTo=a,a}e.splitJianpuNote=a;var o=function(){function t(t,e,i,n){void 0===t&&(t=0),void 0===e&&(e=0),void 0===i&&(i=[]),void 0===n&&(n=1),this.start=t,this.length=e,this.notes=i,this.measureNumber=n}return t.prototype.addNote=function(t){if(0===this.notes.length)return this.start=t.start,this.length=t.length,this.notes.push(t),!0;if(!r(this.start-t.start))return console.warn("JianpuBlock: Attempted to add note at ".concat(t.start," to block starting at ").concat(this.start,". Ignoring.")),!1;for(var e=!1,i=!1,n=0;n<this.notes.length;n++)if(this.notes[n].pitch===t.pitch){i=!0,t.length<this.notes[n].length&&(this.notes[n].tiedFrom&&(t.tiedFrom=this.notes[n].tiedFrom,t.tiedFrom&&(t.tiedFrom.tiedTo=t)),this.notes[n].tiedTo&&(t.tiedTo=this.notes[n].tiedTo,t.tiedTo&&(t.tiedTo.tiedFrom=t)),this.notes[n]=t,e=!0);break}i||this.notes.push(t);for(var a=1/0,o=0,s=this.notes;o<s.length;o++){var h=s[o];a=Math.min(a,h.length)}return this.length=a,!i||e},t.prototype.split=function(e,i){var n=this.start+this.length;if(e<=this.start||e>=n||r(n-e))return null;for(var o=n-e,s=e-this.start,h=new t(e,o,[],i.measureNumberAtQ(e)),u=[],l=0,c=this.notes;l<c.length;l++){var d=c[l],g=d.start+d.length;if(g>e+1e-6){var f=a(d,e);f?u.push(f):console.warn("Split failed for note, unexpected state.")}else r(g-e)}return u.forEach(function(t){return h.addNote(t)}),this.length=s,delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash,this.beatEnd&&(h.beatEnd=!0,delete this.beatEnd),this.isTieEnd&&(h.isTieStart=!0,delete this.isTieEnd),h},t.prototype.splitToBeat=function(t){var e=t.timeSignatureAtQ(this.start);if(!e)return null;var i=t.measureLengthAtQ(this.start),n=t.measureNumberAtQ(this.start),a=this.start-(n-Math.floor(n))*i,o=this.start-a,s=4/e.denominator,h=o/s;this.beatBegin=r(h-Math.round(h));var u=a+(Math.floor(h+1e-6)+1)*s,l=a+i,c=this.start+this.length,d=null;u<c-1e-6&&u>this.start+1e-6&&(d=u),l<c-1e-6&&l>this.start+1e-6&&(null===d||l<d)&&(d=l);var g=null;if(null!==d)(g=this.split(d,t))&&(this.beatEnd=!0);else{var f=(o+this.length)/s;this.beatEnd=r(f-Math.round(f)),this.beatEnd||(this.beatEnd=r(c-l))}return this.isTieStart=this.notes.some(function(t){return t.tiedFrom}),this.isTieEnd=this.notes.some(function(t){return t.tiedTo}),g&&(g.isTieStart=g.notes.some(function(t){return t.tiedFrom}),g.isTieEnd=g.notes.some(function(t){return t.tiedTo}),this.notes.some(function(t){return t.tiedTo&&t.start+t.length>d})&&delete this.isTieEnd),g},t.prototype.calculateRenderProperties=function(t){delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash;var e=this.length;if(!(r(e)||e<0)){if(t.allowDottedRests||this.notes.length>0){if(r(e-1.5))return void(this.augmentationDots=1);if(r(e-.75))return this.durationLines=1,void(this.augmentationDots=1);if(r(e-.375))return this.durationLines=2,void(this.augmentationDots=1);r(e-3)&&(this.augmentationDots=1)}if(this.durationLines=e>=3.999999||e>=1.999999||e>=.999999?0:e>=.499999?1:e>=.249999?2:e>=.124999?3:4,this.augmentationDash=!1,1===this.notes.length){var i=this.notes[0],n=t.timeSignatureAtQ(this.start);if(!n)return;var a=Math.max(4/n.denominator,1);if(!(this.measureNumber%1<=1e-6)&&i.tiedFrom&&r(i.tiedFrom.length-a)&&i.tiedFrom.pitch===i.pitch&&i.length>=1){var o=!0;if(i.tiedTo){var s=i.start+i.length;o=Math.floor(t.measureNumberAtQ(this.start))===Math.floor(t.measureNumberAtQ(s))&&i.tiedTo.length>=1}o&&(this.augmentationDash=!0)}}}},t.prototype.splitToStandardSymbol=function(t){var e=this.length;if(r(e)||e<n.MIN_RESOLUTION-1e-6)return null;var i=[];t.allowDottedRests||this.notes.length>0?(i.push(6),i.push(4),i.push(3),i.push(2),i.push(1.5),i.push(1),i.push(.75),i.push(.5),i.push(.375),i.push(.25),i.push(.125),i.push(.0625)):(i.push(4),i.push(2),i.push(1),i.push(.5),i.push(.25),i.push(.125),i.push(.0625));for(var a=0,o=0,s=i;o<s.length;o++){var h=s[o];if(e>=h-1e-6){a=h;break}}r(a)&&e<(a=n.MIN_RESOLUTION)-1e-6&&e>1e-6&&console.warn("Block length ".concat(e," is too small, rendering as ").concat(a));var u=null;return e>a+1e-6?(u=this.split(this.start+a,t),this.length!==a&&(console.warn("Adjusting block length after split from ".concat(this.length," to ").concat(a)),this.length=a)):this.length=a,u},t.prototype.mergeToMap=function(t){var e=t.get(this.start);e?(this.notes.forEach(function(t){return e.addNote(t)}),0!==this.measureNumber&&(e.measureNumber=this.measureNumber)):t.set(this.start,this)},t.prototype.isMeasureBeginning=function(){return r(this.measureNumber-Math.floor(this.measureNumber))},t}();e.JianpuBlock=o},567(t,e){Object.defineProperty(e,"__esModule",{value:!0}),e.getMeasureLength=e.DEFAULT_TIME_SIGNATURE=e.DEFAULT_KEY_SIGNATURE=e.DEFAULT_TEMPO=void 0,e.DEFAULT_TEMPO={start:0,qpm:60},e.DEFAULT_KEY_SIGNATURE={start:0,key:0},e.DEFAULT_TIME_SIGNATURE={start:0,numerator:4,denominator:4},e.getMeasureLength=function(t){return t.numerator*(4/t.denominator)}},186(t,e,i){var n=this&&this.__assign||function(){return n=Object.assign||function(t){for(var e,i=1,n=arguments.length;i<n;i++)for(var r in e=arguments[i])Object.prototype.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t},n.apply(this,arguments)};Object.defineProperty(e,"__esModule",{value:!0}),e.mapMidiToJianpu=e.JianpuModel=void 0;var r=i(567),a=i(980),o=i(826),s=i(214),h=function(){function t(t,e){this.jianpuInfo=t,this.jianpuBlockMap=new Map,this.lastQ=0,this.update(t,e)}return t.prototype.isLastMeasureAtQ=function(t){return t>=this.lastQ-1e-6},t.prototype.getTotalDuration=function(){return this.lastQ},t.prototype.update=function(t,e){var i=this;this.jianpuInfo=t,t.notes.sort(function(t,e){return t.start-e.start}),this.lastQ=0,t.notes.forEach(function(t){i.lastQ=Math.max(i.lastQ,t.start+t.length)}),this.lastQ+=1e-6,t.tempos=t.tempos&&t.tempos.length?t.tempos:[r.DEFAULT_TEMPO],t.tempos.sort(function(t,e){return t.start-e.start}),t.tempos[0].start>1e-6&&t.tempos.unshift(n(n({},r.DEFAULT_TEMPO),{start:0}));var o=void 0!==e?{start:0,key:e}:n({},r.DEFAULT_KEY_SIGNATURE);t.keySignatures=t.keySignatures&&t.keySignatures.length?t.keySignatures:[o],t.keySignatures.sort(function(t,e){return t.start-e.start}),t.keySignatures[0].start>1e-6&&t.keySignatures.unshift(n(n({},o),{start:0})),t.timeSignatures=t.timeSignatures&&t.timeSignatures.length?t.timeSignatures:[r.DEFAULT_TIME_SIGNATURE],t.timeSignatures.sort(function(t,e){return t.start-e.start}),t.timeSignatures[0].start>1e-6&&t.timeSignatures.unshift(n(n({},r.DEFAULT_TIME_SIGNATURE),{start:0})),this.measuresInfo=new a.MeasuresInfo(t,this.lastQ),this.infoToBlocks()},t.prototype.infoToBlocks=function(){var t=this,e=new Map,i=0;if(this.jianpuInfo.notes.forEach(function(n){var r=n.start,a=t.measuresInfo.measureNumberAtQ(r);if(r>i+1e-6){var s=i,h=r-s,u=t.measuresInfo.measureNumberAtQ(s),l=new o.JianpuBlock(s,h,[],u);e.set(s,l)}var c=t.measuresInfo.keySignatureAtQ(r),d=t.createJianpuNote(n,c),g=e.get(r);g||(g=new o.JianpuBlock(r,0,[],a),e.set(r,g)),g.addNote(d),i=Math.max(i,r+g.length)}),this.lastQ>i+1e-6){var n=i,r=this.lastQ-1e-6-n;if(r>1e-6){var a=this.measuresInfo.measureNumberAtQ(n),s=new o.JianpuBlock(n,r,[],a);e.set(n,s)}}this.jianpuBlockMap=new Map;var h=Array.from(e.keys()).sort(function(t,e){return t-e}),u=[];h.forEach(function(t){u.push(e.get(t))});for(var l=new Set;u.length>0;){var c=u.shift();l.has(c.start)&&this.jianpuBlockMap.has(c.start);var d=c.splitToBeat(this.measuresInfo);if(d)c.mergeToMap(this.jianpuBlockMap),l.add(c.start),u.unshift(d);else{var g=c,f=null;do{f=g.splitToStandardSymbol(this.measuresInfo),g.mergeToMap(this.jianpuBlockMap),l.add(g.start),f&&(g=f)}while(f)}}this.jianpuBlockMap.forEach(function(e){e.calculateRenderProperties(t.measuresInfo)})},t.prototype.createJianpuNote=function(t,e){var i=u(t.pitch,e);return n(n({},t),{jianpuNumber:i.jianpuNumber,octaveDot:i.octaveDot,accidental:i.accidental})},t}();function u(t,e){var i=e%12,n=s.MIDDLE_C_MIDI+i;i>s.MIDDLE_C_MIDI%12&&(n-=12);var r=(t-(n+12*Math.round((t-n)/12))+12)%12,a=s.MAJOR_SCALE_INTERVALS[r],o=0;if(void 0===a){switch(r){case 1:a=s.MAJOR_SCALE_INTERVALS[0],o=1;break;case 3:a=s.MAJOR_SCALE_INTERVALS[4],o=2;break;case 6:a=s.MAJOR_SCALE_INTERVALS[5],o=1;break;case 8:a=s.MAJOR_SCALE_INTERVALS[9],o=2;break;case 10:a=s.MAJOR_SCALE_INTERVALS[11],o=2;break;default:console.warn("Unexpected chromatic interval ".concat(r," in mapMidiToJianpu. Defaulting to sharp of lower valid degree."));var h=(r-1+12)%12,u=(r+1+12)%12,l=s.MAJOR_SCALE_INTERVALS[h],c=s.MAJOR_SCALE_INTERVALS[u];void 0!==l?(a=l,o=1):void 0!==c?(a=c,o=2):(a=1,o=1,console.error("Could not determine Jianpu number components for MIDI ".concat(t,", interval ").concat(r," from tonic in key ").concat(e,".")))}void 0===a&&(console.error("Jianpu number became undefined for MIDI ".concat(t," (interval ").concat(r,", key ").concat(e,") after chromatic processing. This indicates a logic error or misconfigured MAJOR_SCALE_INTERVALS.")),a=1,o=1)}return{jianpuNumber:a,octaveDot:Math.floor((t-n)/12),accidental:o}}e.JianpuModel=h,e.mapMidiToJianpu=u},88(t,e,i){Object.defineProperty(e,"__esModule",{value:!0}),e.JianpuSVGRender=e.ScrollType=void 0;var n,r=i(75),a=i(811),o=i(388),s=i(567),h=i(186),u=i(214);!function(t){t[t.PAGE=0]="PAGE",t[t.NOTE=1]="NOTE",t[t.BAR=2]="BAR"}(n||(e.ScrollType=n={}));var l=function(){function t(t,e,i){var a,o,u,l,c,d,g,f,m,p,S,T=this;this.handleScrollEvent=function(t){T.lastKnownScrollLeft=T.parentElement.scrollLeft,T.isScrolling||window.requestAnimationFrame(function(){T.updateOverlaySignaturesForScroll(T.lastKnownScrollLeft),T.isScrolling=!1}),T.isScrolling=!0},this.jianpuInfo=t,this.div=i,this.config={noteHeight:null!==(a=e.noteHeight)&&void 0!==a?a:20,noteSpacingFactor:null!==(o=e.noteSpacingFactor)&&void 0!==o?o:r.COMPACT_SPACING_FACTOR,pixelsPerTimeStep:null!==(u=e.pixelsPerTimeStep)&&void 0!==u?u:0,noteColor:this.parseColorString(null!==(l=e.noteColor)&&void 0!==l?l:"black"),activeNoteColor:this.parseColorString(null!==(c=e.activeNoteColor)&&void 0!==c?c:"red"),defaultKey:null!==(d=e.defaultKey)&&void 0!==d?d:0,scrollType:null!==(g=e.scrollType)&&void 0!==g?g:n.PAGE,fontFamily:null!==(f=e.fontFamily)&&void 0!==f?f:"sans-serif",width:null!==(m=e.width)&&void 0!==m?m:0,height:null!==(p=e.height)&&void 0!==p?p:0},this.jianpuModel=new h.JianpuModel(this.jianpuInfo,this.config.defaultKey),this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=null!==(S=this.jianpuModel.measuresInfo.timeSignatureAtQ(0))&&void 0!==S?S:s.DEFAULT_TIME_SIGNATURE,this.playingNotes=new Map,this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.numberFontSize=this.config.noteHeight*r.FONT_SIZE_MULTIPLIER,this.smallFontSize=this.config.noteHeight*r.SMALL_FONT_SIZE_MULTIPLIER,this.estimatedNoteWidth=.6*this.numberFontSize,this.yBaseline=1.5*this.config.noteHeight,this.height=0,this.width=0,this.clear(),this.redraw()}return t.prototype.parseColorString=function(t){return/^[a-z]+$/i.test(t)||t.startsWith("rgb(")?t:/^\d+,\s*\d+,\s*\d+$/.test(t)?"rgb(".concat(t,")"):t},t.prototype.clear=function(){for(var t;this.div.lastChild;)this.div.removeChild(this.div.lastChild);this.div.style.position="relative",this.div.style.overflow="hidden",this.overlaySVG=document.createElementNS(a.SVGNS,"svg"),this.overlaySVG.style.position="absolute",this.overlaySVG.style.left="0",this.overlaySVG.style.top="0",this.overlaySVG.style.pointerEvents="none",this.div.appendChild(this.overlaySVG),this.overlayG=(0,a.createSVGGroupChild)(this.overlaySVG,"overlay"),this.parentElement=document.createElement("div"),this.parentElement.style.overflowX="auto",this.parentElement.style.overflowY="hidden",this.parentElement.style.width="100%",this.parentElement.style.height="100%",this.div.appendChild(this.parentElement),this.parentElement.addEventListener("scroll",this.handleScrollEvent),this.mainSVG=document.createElementNS(a.SVGNS,"svg"),this.mainSVG.style.display="block",this.parentElement.appendChild(this.mainSVG),this.mainG=(0,a.createSVGGroupChild)(this.mainSVG,"main-content"),this.signaturesG=(0,a.createSVGGroupChild)(this.mainG,"signatures"),this.musicG=(0,a.createSVGGroupChild)(this.mainG,"music"),this.playingNotes.clear(),this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.height=this.config.height>0?this.config.height:5*this.config.noteHeight,this.width=this.config.width>0?this.config.width:0,this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=null!==(t=this.jianpuModel.measuresInfo.timeSignatureAtQ(0))&&void 0!==t?t:s.DEFAULT_TIME_SIGNATURE,this.drawSignatures(this.overlayG,0,!0,!0),this.updateLayout()},t.prototype.updateLayout=function(t){this.width=null!=t?t:this.width,this.config.width>0&&(this.width=this.config.width),this.height=Math.max(this.height,6*this.config.noteHeight),this.config.height>0&&(this.height=this.config.height);var e=1.65*this.config.noteHeight;this.mainSVG.setAttribute("width","".concat(this.width)),this.mainSVG.setAttribute("height","".concat(this.height)),this.mainG.setAttribute("transform","translate(0, ".concat(this.yBaseline+e,")")),this.overlaySVG.setAttribute("width","200"),this.overlaySVG.setAttribute("height","".concat(this.height)),this.overlayG.setAttribute("transform","translate(0, ".concat(this.yBaseline,")"))},t.prototype.redraw=function(t,e){var i=this,r=-1,o=this.config.pixelsPerTimeStep<=0;if(t){var s="".concat(t.start,"-").concat(t.pitch);if(this.playingNotes.forEach(function(t,e){if(e!==s){var n=i.mainSVG.querySelector('g[data-id="'.concat(e,'"]'));n&&(0,a.resetElementHighlight)(n,i.config.noteColor),i.playingNotes.delete(e)}}),!this.playingNotes.has(s)){var h=this.mainSVG.querySelector('g[data-id="'.concat(s,'"]'));if(h){(0,a.highlightElement)(h,this.config.activeNoteColor),this.playingNotes.set(s,t);var u=h.getBoundingClientRect(),l=this.mainSVG.getBoundingClientRect();r=u.left-l.left+this.parentElement.scrollLeft;var c=h.hasAttribute("data-is-measure-start");e&&(this.config.scrollType!==n.BAR||c)&&this.scrollIntoViewIfNeeded(r)}}if(!o&&this.signaturesBlinking){var d=this.overlayG.getBoundingClientRect().width;this.jianpuModel.measuresInfo.quartersToTime(t.start,t.start)*this.config.pixelsPerTimeStep>d&&(this.signaturesBlinking=!1,(0,a.setBlinkAnimation)(this.overlayG,!1))}}else{this.jianpuModel.update(this.jianpuInfo,this.config.defaultKey);var g=this.width,f=this.width,m=this.height>0?this.height-this.yBaseline:3*this.config.noteHeight,p=0,S=new Map;this.jianpuModel.jianpuBlockMap.forEach(function(t,e){if(e>=i.lastRenderedQ-1e-9){g=o?f:i.jianpuModel.measuresInfo.quartersToTime(e,e)*i.config.pixelsPerTimeStep;var n=i.drawJianpuBlock(t,g,S);o?f+=n:f=Math.max(f,g+n);var r=i.mainSVG.querySelector('g[data-block-start="'.concat(t.start,'"]'));if(r)try{var a=r.getBBox(),s=a.y,h=a.y+a.height;p=Math.min(p,s),m=Math.max(m,h)}catch(t){}i.lastRenderedQ=e+t.length}}),this.height=Math.max(this.height,m-p+this.config.noteHeight),this.updateLayout(f)}return r},t.prototype.drawJianpuBlock=function(t,e,i){var n=0,s=this.config.pixelsPerTimeStep<=0,h=t.isMeasureBeginning(),u=(0,a.createSVGGroupChild)(this.musicG,"block-".concat(t.start));if(u.setAttribute("data-block-start","".concat(t.start)),h&&t.start>1e-6){var l=e-(s?.6*this.estimatedNoteWidth:4),c=2*this.config.noteHeight,d=0,g=(0,a.drawSVGPath)(this.musicG,o.barPath,l,d,1,c/o.PATH_SCALE);(0,a.setStroke)(g,this.config.noteColor,r.LINE_STROKE_WIDTH),s&&(n+=r.LINE_STROKE_WIDTH)}var f=this.updateCurrentKey(t.start),m=this.updateCurrentTimeSignature(t.start),p=0;if((f||m)&&t.start>1e-6){var S=e+n;p=this.drawSignatures(this.signaturesG,S,f,m),s&&(n+=p+.2*this.estimatedNoteWidth)}var T=e+n,v=0;if(t.notes.length>0?v=this.drawNotes(t,T,i,u):t.length>1e-6&&(v=this.drawRest(t,T,u)),s){n+=v;var A=this.estimatedNoteWidth*this.config.noteSpacingFactor;t.beatEnd?A*=1:t.length<.0625?A*=.05:t.length<.125?A*=.1:t.length<.25?A*=.2:t.length<.5?A*=.4:t.length<1&&(A*=.5),n+=A}else n=Math.max(p,v);return this.jianpuModel.isLastMeasureAtQ(t.start+t.length)&&(l=e+n,c=2*this.config.noteHeight,d=0,g=(0,a.drawSVGPath)(this.musicG,o.barPath,l,d,1,c/o.PATH_SCALE),(0,a.setStroke)(g,this.config.noteColor,r.LINE_STROKE_WIDTH),s&&(n+=r.LINE_STROKE_WIDTH)),n},t.prototype.drawNotes=function(t,e,i,n){var s=this,h=e,u=e,l=.1*this.estimatedNoteWidth,c="".concat(this.numberFontSize,"px"),d="".concat(this.smallFontSize,"px"),g=t.durationLines,f=void 0===g?0:g,m=t.augmentationDots,p=void 0===m?0:m,S=t.augmentationDash,T=void 0!==S&&S;return t.notes.forEach(function(e){var g,m,S,v="".concat(e.start,"-").concat(e.pitch),A=(0,a.createSVGGroupChild)(n,v);t.isMeasureBeginning()&&A.setAttribute("data-is-measure-start","true");var E=h,_=E;if(0!==e.accidental){var I=o.ACCIDENTAL_TEXT[e.accidental];(0,a.drawSVGText)(A,I,E+l,0,d,"normal","end","text-top",s.config.noteColor)}var N=0;if(T){var y=s.config.noteHeight*r.AUGMENTATION_DASH_FACTOR,M=y/50,C=(0,a.drawSVGPath)(A,o.augmentationDashPath,E,0,M,1);(0,a.setStroke)(C,s.config.noteColor,r.LINE_STROKE_WIDTH),_=E+(N=y)}else{var L="".concat(e.jianpuNumber);_=E+(N=(0,a.drawSVGText)(A,L,E,0,c,"normal","start","middle",s.config.noteColor).getBBox().width)}if(0!==e.octaveDot&&!1===T)for(var b=(H=s.config.noteHeight*r.DOT_SIZE_FACTOR)/(.15*o.PATH_SCALE),O=E+N/2,G=2.8*H,R=s.config.noteHeight*r.OCTAVE_DOT_OFFSET_FACTOR,D=0;D<Math.abs(e.octaveDot);D++){var P=(e.octaveDot>0?-R:.6*R)-D*G*(e.octaveDot>0?1:-1);(0,a.drawSVGPath)(A,o.dotPath,O,P,b,b)}if(f>0)for(var w=s.config.noteHeight*r.UNDERLINE_SPACING_FACTOR*2.5,F=s.config.noteHeight*r.UNDERLINE_SPACING_FACTOR,k=N/o.PATH_SCALE*(null!==(g=r.DURATION_LINE_SCALES.get(f))&&void 0!==g?g:1),V=0;V<f;V++){var U=w+V*F,x=(0,a.drawSVGPath)(A,o.underlinePath,E,U,k,1);(0,a.setStroke)(x,s.config.noteColor,r.LINE_STROKE_WIDTH)}var B=_+l;if(p>0){var H;for(b=(H=s.config.noteHeight*r.DOT_SIZE_FACTOR)/(.15*o.PATH_SCALE),D=0;D<p;D++)(0,a.drawSVGPath)(A,o.dotPath,B,0,b,b),B+=H+l;_=B+l}var j=_;if(e.tiedTo&&!T)i.set(e,{g:A,xNoteRight:j,yNoteBaseline:0});else if(e.tiedFrom){for(var Q=e.tiedFrom;Q.tiedFrom;)Q=Q.tiedFrom;var J=i.get(Q);if(J){var K=1*J.xNoteRight,W=(T?E-2.2*s.estimatedNoteWidth:E-l)-K,q=1.2*-s.config.noteHeight,Z=W/o.PATH_SCALE*1.3,z=s.config.noteHeight/o.PATH_SCALE*1.6;W>1&&(0,a.drawSVGPath)(J.g,o.tiePath,K-(null!==(S=null===(m=J.g.getCTM())||void 0===m?void 0:m.e)&&void 0!==S?S:0),q,Z,z);for(var X=Q;X&&X!==e;){i.delete(X);var Y=X.tiedTo;Y&&(X=Y)}}else console.warn("Missing linked SVG details for first tied note:",Q)}u=Math.max(u,_)}),u-e},t.prototype.drawRest=function(t,e,i){var n,s="".concat(this.numberFontSize,"px"),h=.1*this.estimatedNoteWidth,u=t.durationLines,l=void 0===u?0:u,c=t.augmentationDots,d=void 0===c?0:c,g=e,f=g,m=(0,a.drawSVGText)(i,"0",g,0,s,"normal","start","middle",this.config.noteColor).getBBox().width;if(f=g+m,l>0)for(var p=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR*2.5,S=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR,T=m/o.PATH_SCALE*(null!==(n=r.DURATION_LINE_SCALES.get(l))&&void 0!==n?n:1),v=0;v<l;v++){var A=p+v*S,E=(0,a.drawSVGPath)(i,o.underlinePath,g,A,T,1);(0,a.setStroke)(E,this.config.noteColor,r.LINE_STROKE_WIDTH)}var _=f+h;if(d>0){for(var I=this.config.noteHeight*r.DOT_SIZE_FACTOR,N=I/(.15*o.PATH_SCALE),y=0;y<d;y++)(0,a.drawSVGPath)(i,o.dotPath,_,0,N,N),_+=I+h;f=_+h}return f-e},t.prototype.drawSignatures=function(t,e,i,n){var r,o=e,s=.3*this.estimatedNoteWidth,h="".concat(this.smallFontSize,"px"),l="".concat(this.numberFontSize,"px");if(i){var c=null!==(r=u.PITCH_CLASS_NAMES[this.currentKey%12])&&void 0!==r?r:"C",d="1=".concat(c);o+=(0,a.drawSVGText)(t,d,o,0,l,"normal","start","middle",this.config.noteColor).getBBox().width+2*s}if(n){var g="".concat(this.currentTimeSignature.numerator,"/").concat(this.currentTimeSignature.denominator);o+=(0,a.drawSVGText)(t,g,o,0,h,"normal","start","middle",this.config.noteColor).getBBox().width+s}var f=o-e;try{var m=t.getBBox(),p=m.y,S=m.y+m.height,T=Math.max(this.yBaseline+S,this.yBaseline-p)+.5*this.config.noteHeight;this.height=Math.max(this.height,T)}catch(t){}return t===this.overlayG&&this.config.pixelsPerTimeStep>0&&(this.signaturesBlinking=!0,(0,a.setBlinkAnimation)(this.overlayG,!0)),f},t.prototype.updateCurrentKey=function(t){var e=this.jianpuModel.measuresInfo.keySignatureAtQ(t,!0);return-1!==e&&e!==this.currentKey&&(this.currentKey=e,!0)},t.prototype.updateCurrentTimeSignature=function(t){var e=this.jianpuModel.measuresInfo.timeSignatureAtQ(t,!0);return!(!e||e.numerator===this.currentTimeSignature.numerator&&e.denominator===this.currentTimeSignature.denominator||(this.currentTimeSignature=e,0))},t.prototype.scrollIntoViewIfNeeded=function(t){var e=this.parentElement.getBoundingClientRect().width,i=this.parentElement.scrollLeft,r=i;this.config.scrollType===n.PAGE?t<i+20?r=t-20:t>i+e-20&&(r=t-e+20):r=t-.5*e,r=Math.max(0,Math.min(r,this.parentElement.scrollWidth-e)),Math.abs(r-i)>1&&(this.parentElement.scrollTo({left:r,behavior:"smooth"}),this.updateOverlaySignaturesForScroll(r))},t.prototype.updateOverlaySignaturesForScroll=function(t){var e,i=this.pixelsToTime(t),n=this.jianpuModel.measuresInfo.keySignatureAtQ(i),r=null!==(e=this.jianpuModel.measuresInfo.timeSignatureAtQ(i))&&void 0!==e?e:this.currentTimeSignature,o=!1;if(n!==this.currentKey&&(this.currentKey=n,o=!0),r.numerator===this.currentTimeSignature.numerator&&r.denominator===this.currentTimeSignature.denominator||(this.currentTimeSignature=r,o=!0),o){for(;this.overlayG.lastChild;)this.overlayG.removeChild(this.overlayG.lastChild);this.drawSignatures(this.overlayG,0,!0,!0),t<10&&this.config.pixelsPerTimeStep>0?((0,a.setBlinkAnimation)(this.overlayG,!0),this.signaturesBlinking=!0):this.config.pixelsPerTimeStep>0&&((0,a.setBlinkAnimation)(this.overlayG,!1),this.signaturesBlinking=!1)}},t.prototype.pixelsToTime=function(t){return this.config.pixelsPerTimeStep<=0?0:this.jianpuModel.measuresInfo.timeToQuarters(t/this.config.pixelsPerTimeStep,0)},t}();e.JianpuSVGRender=l},980(t,e,i){Object.defineProperty(e,"__esModule",{value:!0}),e.MeasuresInfo=void 0;var n=i(567),r=i(214),a=function(){function t(e,i){if(this.allowDottedRests=!0,this.measuresInfo=[],i>0){var r=t.getSortedChanges(e.tempos,n.DEFAULT_TEMPO),a=t.getSortedChanges(e.keySignatures,n.DEFAULT_KEY_SIGNATURE),o=t.getSortedChanges(e.timeSignatures,n.DEFAULT_TIME_SIGNATURE),s=0,h=0,u=0,l=r[0].event,c=a[0].event,d=o[0].event,g=1,f=(0,n.getMeasureLength)(d),m=d.start,p=[0];r.forEach(function(t){return p.push(t.start)}),a.forEach(function(t){return p.push(t.start)}),o.forEach(function(t){return p.push(t.start)}),p.sort(function(t,e){return t-e});for(var S=-1,T=0;T<p.length;T++){var v=p[T];if(v>=i)break;if(v!==S){S=v;for(var A=!1,E=!1,_=!1;s<r.length&&r[s].start<=v;)l=r[s++].event,A=!0;for(;h<a.length&&a[h].start<=v;)c=a[h++].event,E=!0;for(;u<o.length&&o[u].start<=v;)g+=(o[u].event.start-m)/f,g=Math.round(1e3*g)/1e3,d=o[u++].event,f=(0,n.getMeasureLength)(d),m=v,_=!0;var I={start:v,measureNumber:g+(v-m)/f,measureLength:f,tempo:l,keySignature:c,timeSignature:d};A&&(I.tempoChange=!0),E&&(I.keyChange=!0),_&&(I.timeChange=!0),this.measuresInfo.push(I)}}}}return t.getSortedChanges=function(t,e){var i=t&&t.length?t.slice():[e];return i.sort(function(t,e){return t.start-e.start}),i.map(function(t){return{start:Math.max(0,Math.round(t.start/r.MIN_RESOLUTION)*r.MIN_RESOLUTION),event:t}})},t.prototype.findIndex=function(t){for(var e=0,i=this.measuresInfo.length-1,n=0;e<=i;){var r=Math.floor((e+i)/2);this.measuresInfo[r].start<=t?(n=r,e=r+1):i=r-1}return n},t.prototype.measureNumberAtQ=function(t){if(0===this.measuresInfo.length)return 1;var e=this.findIndex(t),i=this.measuresInfo[e],n=(t-i.start)/i.measureLength;return i.measureNumber+n+1e-9},t.prototype.measureLengthAtQ=function(t){if(0===this.measuresInfo.length)return(0,n.getMeasureLength)(n.DEFAULT_TIME_SIGNATURE);var e=this.findIndex(t);return this.measuresInfo[e].measureLength},t.prototype.tempoAtQ=function(t,e){if(void 0===e&&(e=!1),0===this.measuresInfo.length)return n.DEFAULT_TEMPO.qpm;var i=this.findIndex(t),a=this.measuresInfo[i],o=Math.abs(a.start-t)<r.MIN_RESOLUTION/2;return!e||a.tempoChange&&o?a.tempo.qpm:-1},t.prototype.keySignatureAtQ=function(t,e){if(void 0===e&&(e=!1),0===this.measuresInfo.length)return n.DEFAULT_KEY_SIGNATURE.key;var i=this.findIndex(t),a=this.measuresInfo[i],o=Math.abs(a.start-t)<r.MIN_RESOLUTION/2;return!e||a.keyChange&&o?a.keySignature.key:-1},t.prototype.timeSignatureAtQ=function(t,e){if(void 0===e&&(e=!1),0===this.measuresInfo.length)return n.DEFAULT_TIME_SIGNATURE;var i=this.findIndex(t),a=this.measuresInfo[i],o=Math.abs(a.start-t)<r.MIN_RESOLUTION/2;return!e||a.timeChange&&o?a.timeSignature:null},t.prototype.quartersToTime=function(t,e){var i=this.tempoAtQ(e);return i<=0?0:t/i*60},t.prototype.timeToQuarters=function(t,e){var i=this.tempoAtQ(e);if(i<=0)return 0;var n=t*i/60;return Math.round(n*r.MAX_QUARTER_DIVISION)/r.MAX_QUARTER_DIVISION},t.prototype.isBeatStart=function(t){if(0===this.measuresInfo.length)return!1;var e=this.findIndex(t),i=this.measuresInfo[e],n=i.timeSignature,a=(t-(i.start-(i.measureNumber-Math.floor(i.measureNumber))*i.measureLength))/(4/n.denominator);return Math.abs(a-Math.round(a))<r.MIN_RESOLUTION/2},t}();e.MeasuresInfo=a},214(t,e){Object.defineProperty(e,"__esModule",{value:!0}),e.MIDDLE_C_MIDI=e.MAJOR_SCALE_INTERVALS=e.PITCH_CLASS_NAMES=e.MAX_QUARTER_DIVISION=e.MIN_RESOLUTION=void 0,e.MIN_RESOLUTION=.0625,e.MAX_QUARTER_DIVISION=240,e.PITCH_CLASS_NAMES=["C","C#","D","D#","E","F","F#","G","G#","A","A#","B"],e.MAJOR_SCALE_INTERVALS={0:1,2:2,4:3,5:4,7:5,9:6,11:7},e.MIDDLE_C_MIDI=60},75(t,e){Object.defineProperty(e,"__esModule",{value:!0}),e.DURATION_LINE_SCALES=e.SMALL_FONT_SIZE_MULTIPLIER=e.FONT_SIZE_MULTIPLIER=e.AUGMENTATION_SPACING_FACTOR=e.ACCIDENTAL_SPACING_FACTOR=e.AUGMENTATION_DASH_FACTOR=e.DOT_SIZE_FACTOR=e.OCTAVE_DOT_OFFSET_FACTOR=e.UNDERLINE_SPACING_FACTOR=e.COMPACT_SPACING_FACTOR=e.LINE_STROKE_WIDTH=void 0,e.LINE_STROKE_WIDTH=1,e.COMPACT_SPACING_FACTOR=1.5,e.UNDERLINE_SPACING_FACTOR=.2,e.OCTAVE_DOT_OFFSET_FACTOR=1,e.DOT_SIZE_FACTOR=.1,e.AUGMENTATION_DASH_FACTOR=.8,e.ACCIDENTAL_SPACING_FACTOR=.1,e.AUGMENTATION_SPACING_FACTOR=.2,e.FONT_SIZE_MULTIPLIER=1.2,e.SMALL_FONT_SIZE_MULTIPLIER=.75,e.DURATION_LINE_SCALES=new Map([[1,1.78],[2,1.6],[3,1.3],[4,1.15]])},388(t,e){Object.defineProperty(e,"__esModule",{value:!0}),e.dotPath=e.tiePath=e.augmentationDashPath=e.underlinePath=e.barPath=e.ACCIDENTAL_TEXT=e.ACCIDENTAL_PATHS=e.PATH_SCALE=void 0,e.PATH_SCALE=100,e.ACCIDENTAL_PATHS=[null,"m 30,15 h 40 m -35,20 h 40 M 50,0 v 50 M 70,5 v 50","m 45,5 v 40 c 0,15 20,15 20,0 V 20 C 65,5 45,5 45,5 Z","M 45,5 v 45 M 65,0 v 45 H 45 m 20,10 H 45"],e.ACCIDENTAL_TEXT=["","#","b"],e.barPath="m 0,-50 v 100",e.underlinePath="m 0,0 h 100",e.augmentationDashPath="m 0,0 h 50",e.tiePath="M -13,5 C 15,-15 65,-15 90,5 C 65,-25 15,-25 -13,5 Z",e.dotPath="M 0 0 a 15 15 0 1 0 0.0001 0 z"},811(t,e){Object.defineProperty(e,"__esModule",{value:!0}),e.resetElementHighlight=e.highlightElement=e.setStroke=e.setFill=e.setBlinkAnimation=e.createSVGGroupChild=e.drawSVGText=e.drawSVGPath=e.SVGNS=void 0,e.SVGNS="http://www.w3.org/2000/svg",e.drawSVGPath=function(t,i,n,r,a,o,s){void 0===s&&(s=1);var h=document.createElementNS(e.SVGNS,"path");return h.setAttributeNS(null,"d",i),h.setAttributeNS(null,"transform","translate(".concat(n,", ").concat(r,") scale(").concat(a,", ").concat(o,")")),s<1&&h.setAttributeNS(null,"opacity","".concat(s)),t.appendChild(h),h},e.drawSVGText=function(t,i,n,r,a,o,s,h,u,l){void 0===o&&(o="normal"),void 0===s&&(s="middle"),void 0===h&&(h="middle"),void 0===u&&(u="currentColor"),void 0===l&&(l=1);var c=document.createElementNS(e.SVGNS,"text");c.setAttributeNS(null,"font-family","sans-serif"),c.setAttributeNS(null,"font-size",a),c.setAttributeNS(null,"font-weight",o),c.setAttributeNS(null,"x","".concat(n)),c.setAttributeNS(null,"y","".concat(r)),c.setAttributeNS(null,"text-anchor",s),c.setAttributeNS(null,"dominant-baseline",h),"currentColor"!==u&&c.setAttributeNS(null,"fill",u),l<1&&c.setAttributeNS(null,"opacity","".concat(l));var d=document.createTextNode(i);return c.appendChild(d),t.appendChild(c),c},e.createSVGGroupChild=function(t,i){var n=document.createElementNS(e.SVGNS,"g");return i&&n.setAttribute("data-id",i),t.appendChild(n),n},e.setBlinkAnimation=function(t,i,n){void 0===i&&(i=!0),void 0===n&&(n="1s");var r=t.querySelector('animate[attributeName="opacity"]');return i?r?(r.setAttributeNS(null,"repeatCount","indefinite"),r.beginElement()):((r=document.createElementNS(e.SVGNS,"animate")).setAttributeNS(null,"attributeName","opacity"),r.setAttributeNS(null,"values","1;0.2;1"),r.setAttributeNS(null,"keyTimes","0;0.5;1"),r.setAttributeNS(null,"dur",n),r.setAttributeNS(null,"repeatCount","indefinite"),t.appendChild(r)):(r&&(r.endElement(),r.setAttributeNS(null,"repeatCount","0"),t.style.opacity="1"),t.style.opacity="1"),t},e.setFill=function(t,e){t.setAttributeNS(null,"fill",e)},e.setStroke=function(t,e,i){t.setAttributeNS(null,"stroke",e),t.setAttributeNS(null,"stroke-width","".concat(i))},e.highlightElement=function(t,e){var i=[];return t.matches("text, path")&&i.push(t),t.querySelectorAll("text, path").forEach(function(t){i.push(t)}),i.forEach(function(t){"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e)}),t},e.resetElementHighlight=function(t,e){t.querySelectorAll("text, path").forEach(function(t){"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e)})}}};const e={};var i;i=function i(n){const r=e[n];if(void 0!==r)return r.exports;const a=e[n]={exports:{}};return t[n].call(a.exports,a,a.exports,i),a.exports}(229),window.jr=i})();
|
|
1
|
+
(()=>{"use strict";var t={229(t,e,i){var n=this&&this.__createBinding||(Object.create?function(t,e,i,n){void 0===n&&(n=i);var r=Object.getOwnPropertyDescriptor(e,i);r&&!("get"in r?!e.__esModule:r.writable||r.configurable)||(r={enumerable:!0,get:function(){return e[i]}}),Object.defineProperty(t,n,r)}:function(t,e,i,n){void 0===n&&(n=i),t[n]=e[i]}),r=this&&this.__exportStar||function(t,e){for(var i in t)"default"===i||Object.prototype.hasOwnProperty.call(e,i)||n(e,t,i)};Object.defineProperty(e,"__esModule",{value:!0}),r(i(88),e),r(i(186),e),r(i(826),e),r(i(567),e)},826(t,e,i){Object.defineProperty(e,"__esModule",{value:!0}),e.JianpuBlock=e.splitJianpuNote=void 0;var n=i(214);function r(t){return Math.abs(t)<1e-6}function a(t,e){var i=t.start+t.length;if(e<=t.start||e>=i||r(i-e))return null;var n=i-e;t.length=e-t.start;var a={start:e,length:n,pitch:t.pitch,intensity:t.intensity,jianpuNumber:t.jianpuNumber,octaveDot:t.octaveDot,accidental:0,tiedFrom:t};return t.tiedTo&&(a.tiedTo=t.tiedTo,t.tiedTo.tiedFrom=a),t.tiedTo=a,a}e.splitJianpuNote=a;var o=function(){function t(t,e,i,n){void 0===t&&(t=0),void 0===e&&(e=0),void 0===i&&(i=[]),void 0===n&&(n=1),this.start=t,this.length=e,this.notes=i,this.measureNumber=n}return t.prototype.addNote=function(t){if(0===this.notes.length)return this.start=t.start,this.length=t.length,this.notes.push(t),!0;if(!r(this.start-t.start))return console.warn("JianpuBlock: Attempted to add note at ".concat(t.start," to block starting at ").concat(this.start,". Ignoring.")),!1;for(var e=!1,i=!1,n=0;n<this.notes.length;n++)if(this.notes[n].pitch===t.pitch){i=!0,t.length<this.notes[n].length&&(this.notes[n].tiedFrom&&(t.tiedFrom=this.notes[n].tiedFrom,t.tiedFrom&&(t.tiedFrom.tiedTo=t)),this.notes[n].tiedTo&&(t.tiedTo=this.notes[n].tiedTo,t.tiedTo&&(t.tiedTo.tiedFrom=t)),this.notes[n]=t,e=!0);break}i||this.notes.push(t);for(var a=1/0,o=0,s=this.notes;o<s.length;o++){var h=s[o];a=Math.min(a,h.length)}return this.length=a,!i||e},t.prototype.split=function(e,i){var n=this.start+this.length;if(e<=this.start||e>=n||r(n-e))return null;for(var o=n-e,s=e-this.start,h=new t(e,o,[],i.measureNumberAtQ(e)),u=[],l=0,c=this.notes;l<c.length;l++){var d=c[l],g=d.start+d.length;if(g>e+1e-6){var f=a(d,e);f?u.push(f):console.warn("Split failed for note, unexpected state.")}else r(g-e)}return u.forEach(function(t){return h.addNote(t)}),this.length=s,delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash,this.beatEnd&&(h.beatEnd=!0,delete this.beatEnd),this.isTieEnd&&(h.isTieStart=!0,delete this.isTieEnd),h},t.prototype.splitToBeat=function(t){var e=t.timeSignatureAtQ(this.start);if(!e)return null;var i=t.measureLengthAtQ(this.start),n=t.measureNumberAtQ(this.start),a=this.start-(n-Math.floor(n))*i,o=this.start-a,s=4/e.denominator,h=o/s;this.beatBegin=r(h-Math.round(h));var u=a+(Math.floor(h+1e-6)+1)*s,l=a+i,c=this.start+this.length,d=null;u<c-1e-6&&u>this.start+1e-6&&(d=u),l<c-1e-6&&l>this.start+1e-6&&(null===d||l<d)&&(d=l);var g=null;if(null!==d)(g=this.split(d,t))&&(this.beatEnd=!0);else{var f=(o+this.length)/s;this.beatEnd=r(f-Math.round(f)),this.beatEnd||(this.beatEnd=r(c-l))}return this.isTieStart=this.notes.some(function(t){return t.tiedFrom}),this.isTieEnd=this.notes.some(function(t){return t.tiedTo}),g&&(g.isTieStart=g.notes.some(function(t){return t.tiedFrom}),g.isTieEnd=g.notes.some(function(t){return t.tiedTo}),this.notes.some(function(t){return t.tiedTo&&t.start+t.length>d})&&delete this.isTieEnd),g},t.prototype.calculateRenderProperties=function(t){delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash;var e=this.length;if(!(r(e)||e<0)){if(t.allowDottedRests||this.notes.length>0){if(r(e-1.5))return void(this.augmentationDots=1);if(r(e-.75))return this.durationLines=1,void(this.augmentationDots=1);if(r(e-.375))return this.durationLines=2,void(this.augmentationDots=1);r(e-3)&&(this.augmentationDots=1)}if(this.durationLines=e>=3.999999||e>=1.999999||e>=.999999?0:e>=.499999?1:e>=.249999?2:e>=.124999?3:4,this.augmentationDash=!1,1===this.notes.length){var i=this.notes[0],n=t.timeSignatureAtQ(this.start);if(!n)return;var a=Math.max(4/n.denominator,1);if(!(this.measureNumber%1<=1e-6)&&i.tiedFrom&&r(i.tiedFrom.length-a)&&i.tiedFrom.pitch===i.pitch&&i.length>=1){var o=!0;if(i.tiedTo){var s=i.start+i.length;o=Math.floor(t.measureNumberAtQ(this.start))===Math.floor(t.measureNumberAtQ(s))&&i.tiedTo.length>=1}o&&(this.augmentationDash=!0)}}}},t.prototype.splitToStandardSymbol=function(t){var e=this.length;if(r(e)||e<n.MIN_RESOLUTION-1e-6)return null;var i=[];t.allowDottedRests||this.notes.length>0?(i.push(6),i.push(4),i.push(3),i.push(2),i.push(1.5),i.push(1),i.push(.75),i.push(.5),i.push(.375),i.push(.25),i.push(.125),i.push(.0625)):(i.push(4),i.push(2),i.push(1),i.push(.5),i.push(.25),i.push(.125),i.push(.0625));for(var a=0,o=0,s=i;o<s.length;o++){var h=s[o];if(e>=h-1e-6){a=h;break}}r(a)&&e<(a=n.MIN_RESOLUTION)-1e-6&&e>1e-6&&console.warn("Block length ".concat(e," is too small, rendering as ").concat(a));var u=null;return e>a+1e-6?(u=this.split(this.start+a,t),this.length!==a&&(console.warn("Adjusting block length after split from ".concat(this.length," to ").concat(a)),this.length=a)):this.length=a,u},t.prototype.mergeToMap=function(t){var e=t.get(this.start);e?(this.notes.forEach(function(t){return e.addNote(t)}),0!==this.measureNumber&&(e.measureNumber=this.measureNumber)):t.set(this.start,this)},t.prototype.isMeasureBeginning=function(){return r(this.measureNumber-Math.floor(this.measureNumber))},t}();e.JianpuBlock=o},567(t,e){Object.defineProperty(e,"__esModule",{value:!0}),e.getMeasureLength=e.DEFAULT_TIME_SIGNATURE=e.DEFAULT_KEY_SIGNATURE=e.DEFAULT_TEMPO=void 0,e.DEFAULT_TEMPO={start:0,qpm:60},e.DEFAULT_KEY_SIGNATURE={start:0,key:0},e.DEFAULT_TIME_SIGNATURE={start:0,numerator:4,denominator:4},e.getMeasureLength=function(t){return t.numerator*(4/t.denominator)}},186(t,e,i){var n=this&&this.__assign||function(){return n=Object.assign||function(t){for(var e,i=1,n=arguments.length;i<n;i++)for(var r in e=arguments[i])Object.prototype.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t},n.apply(this,arguments)};Object.defineProperty(e,"__esModule",{value:!0}),e.mapMidiToJianpu=e.JianpuModel=void 0;var r=i(567),a=i(980),o=i(826),s=i(214),h=function(){function t(t,e){this.jianpuInfo=t,this.jianpuBlockMap=new Map,this.lastQ=0,this.update(t,e)}return t.prototype.isLastMeasureAtQ=function(t){return t>=this.lastQ-1e-6},t.prototype.getTotalDuration=function(){return this.lastQ},t.prototype.update=function(t,e){var i=this;this.jianpuInfo=t,t.notes.sort(function(t,e){return t.start-e.start}),this.lastQ=0,t.notes.forEach(function(t){i.lastQ=Math.max(i.lastQ,t.start+t.length)}),this.lastQ+=1e-6,t.tempos=t.tempos&&t.tempos.length?t.tempos:[r.DEFAULT_TEMPO],t.tempos.sort(function(t,e){return t.start-e.start}),t.tempos[0].start>1e-6&&t.tempos.unshift(n(n({},r.DEFAULT_TEMPO),{start:0}));var o=void 0!==e?{start:0,key:e}:n({},r.DEFAULT_KEY_SIGNATURE);t.keySignatures=t.keySignatures&&t.keySignatures.length?t.keySignatures:[o],t.keySignatures.sort(function(t,e){return t.start-e.start}),t.keySignatures[0].start>1e-6&&t.keySignatures.unshift(n(n({},o),{start:0})),t.timeSignatures=t.timeSignatures&&t.timeSignatures.length?t.timeSignatures:[r.DEFAULT_TIME_SIGNATURE],t.timeSignatures.sort(function(t,e){return t.start-e.start}),t.timeSignatures[0].start>1e-6&&t.timeSignatures.unshift(n(n({},r.DEFAULT_TIME_SIGNATURE),{start:0})),this.measuresInfo=new a.MeasuresInfo(t,this.lastQ),this.infoToBlocks()},t.prototype.infoToBlocks=function(){var t=this,e=new Map,i=0;if(this.jianpuInfo.notes.forEach(function(n){var r=n.start,a=t.measuresInfo.measureNumberAtQ(r);if(r>i+1e-6){var s=i,h=r-s,u=t.measuresInfo.measureNumberAtQ(s),l=new o.JianpuBlock(s,h,[],u);e.set(s,l)}var c=t.measuresInfo.keySignatureAtQ(r),d=t.createJianpuNote(n,c),g=e.get(r);g||(g=new o.JianpuBlock(r,0,[],a),e.set(r,g)),g.addNote(d),i=Math.max(i,r+g.length)}),this.lastQ>i+1e-6){var n=i,r=this.lastQ-1e-6-n;if(r>1e-6){var a=this.measuresInfo.measureNumberAtQ(n),s=new o.JianpuBlock(n,r,[],a);e.set(n,s)}}this.jianpuBlockMap=new Map;var h=Array.from(e.keys()).sort(function(t,e){return t-e}),u=[];h.forEach(function(t){u.push(e.get(t))});for(var l=new Set;u.length>0;){var c=u.shift();l.has(c.start)&&this.jianpuBlockMap.has(c.start);var d=c.splitToBeat(this.measuresInfo);if(d)c.mergeToMap(this.jianpuBlockMap),l.add(c.start),u.unshift(d);else{var g=c,f=null;do{f=g.splitToStandardSymbol(this.measuresInfo),g.mergeToMap(this.jianpuBlockMap),l.add(g.start),f&&(g=f)}while(f)}}this.jianpuBlockMap.forEach(function(e){e.calculateRenderProperties(t.measuresInfo)})},t.prototype.createJianpuNote=function(t,e){var i=u(t.pitch,e);return n(n({},t),{jianpuNumber:i.jianpuNumber,octaveDot:i.octaveDot,accidental:i.accidental})},t}();function u(t,e){var i=e%12,n=s.MIDDLE_C_MIDI+i;i>s.MIDDLE_C_MIDI%12&&(n-=12);var r=(t-(n+12*Math.round((t-n)/12))+12)%12,a=s.MAJOR_SCALE_INTERVALS[r],o=0;if(void 0===a){switch(r){case 1:a=s.MAJOR_SCALE_INTERVALS[0],o=1;break;case 3:a=s.MAJOR_SCALE_INTERVALS[4],o=2;break;case 6:a=s.MAJOR_SCALE_INTERVALS[5],o=1;break;case 8:a=s.MAJOR_SCALE_INTERVALS[9],o=2;break;case 10:a=s.MAJOR_SCALE_INTERVALS[11],o=2;break;default:console.warn("Unexpected chromatic interval ".concat(r," in mapMidiToJianpu. Defaulting to sharp of lower valid degree."));var h=(r-1+12)%12,u=(r+1+12)%12,l=s.MAJOR_SCALE_INTERVALS[h],c=s.MAJOR_SCALE_INTERVALS[u];void 0!==l?(a=l,o=1):void 0!==c?(a=c,o=2):(a=1,o=1,console.error("Could not determine Jianpu number components for MIDI ".concat(t,", interval ").concat(r," from tonic in key ").concat(e,".")))}void 0===a&&(console.error("Jianpu number became undefined for MIDI ".concat(t," (interval ").concat(r,", key ").concat(e,") after chromatic processing. This indicates a logic error or misconfigured MAJOR_SCALE_INTERVALS.")),a=1,o=1)}return{jianpuNumber:a,octaveDot:Math.floor((t-n)/12),accidental:o}}e.JianpuModel=h,e.mapMidiToJianpu=u},88(t,e,i){Object.defineProperty(e,"__esModule",{value:!0}),e.JianpuSVGRender=e.ScrollType=void 0;var n,r=i(75),a=i(811),o=i(388),s=i(567),h=i(186),u=i(214);!function(t){t[t.PAGE=0]="PAGE",t[t.NOTE=1]="NOTE",t[t.BAR=2]="BAR"}(n||(e.ScrollType=n={}));var l=function(){function t(t,e,i){var a,o,u,l,c,d,g,f,m,p,S,v=this;this.handleScrollEvent=function(t){v.lastKnownScrollLeft=v.parentElement.scrollLeft,v.isScrolling||window.requestAnimationFrame(function(){v.updateOverlaySignaturesForScroll(v.lastKnownScrollLeft),v.isScrolling=!1}),v.isScrolling=!0},this.jianpuInfo=t,this.div=i,this.config={noteHeight:null!==(a=e.noteHeight)&&void 0!==a?a:20,noteSpacingFactor:null!==(o=e.noteSpacingFactor)&&void 0!==o?o:r.COMPACT_SPACING_FACTOR,pixelsPerTimeStep:null!==(u=e.pixelsPerTimeStep)&&void 0!==u?u:0,noteColor:this.parseColorString(null!==(l=e.noteColor)&&void 0!==l?l:"black"),activeNoteColor:this.parseColorString(null!==(c=e.activeNoteColor)&&void 0!==c?c:"red"),defaultKey:null!==(d=e.defaultKey)&&void 0!==d?d:0,scrollType:null!==(g=e.scrollType)&&void 0!==g?g:n.PAGE,fontFamily:null!==(f=e.fontFamily)&&void 0!==f?f:"sans-serif",width:null!==(m=e.width)&&void 0!==m?m:0,height:null!==(p=e.height)&&void 0!==p?p:0},this.jianpuModel=new h.JianpuModel(this.jianpuInfo,this.config.defaultKey),this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=null!==(S=this.jianpuModel.measuresInfo.timeSignatureAtQ(0))&&void 0!==S?S:s.DEFAULT_TIME_SIGNATURE,this.playingNotes=new Map,this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.numberFontSize=this.config.noteHeight*r.FONT_SIZE_MULTIPLIER,this.smallFontSize=this.config.noteHeight*r.SMALL_FONT_SIZE_MULTIPLIER,this.estimatedNoteWidth=.6*this.numberFontSize,this.yBaseline=1.5*this.config.noteHeight,this.height=0,this.width=0,this.clear(),this.redraw()}return t.prototype.parseColorString=function(t){return/^[a-z]+$/i.test(t)||t.startsWith("rgb(")?t:/^\d+,\s*\d+,\s*\d+$/.test(t)?"rgb(".concat(t,")"):t},t.prototype.clear=function(){for(var t;this.div.lastChild;)this.div.removeChild(this.div.lastChild);this.div.style.position="relative",this.div.style.overflow="hidden",this.overlaySVG=document.createElementNS(a.SVGNS,"svg"),this.overlaySVG.style.position="absolute",this.overlaySVG.style.left="0",this.overlaySVG.style.top="0",this.overlaySVG.style.pointerEvents="none",this.div.appendChild(this.overlaySVG),this.overlayG=(0,a.createSVGGroupChild)(this.overlaySVG,"overlay"),this.parentElement=document.createElement("div"),this.parentElement.style.overflowX="auto",this.parentElement.style.overflowY="hidden",this.parentElement.style.width="100%",this.parentElement.style.height="100%",this.div.appendChild(this.parentElement),this.parentElement.addEventListener("scroll",this.handleScrollEvent),this.mainSVG=document.createElementNS(a.SVGNS,"svg"),this.mainSVG.style.display="block",this.parentElement.appendChild(this.mainSVG),this.mainG=(0,a.createSVGGroupChild)(this.mainSVG,"main-content"),this.signaturesG=(0,a.createSVGGroupChild)(this.mainG,"signatures"),this.musicG=(0,a.createSVGGroupChild)(this.mainG,"music"),this.playingNotes.clear(),this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.height=this.config.height>0?this.config.height:5*this.config.noteHeight,this.width=this.config.width>0?this.config.width:0,this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=null!==(t=this.jianpuModel.measuresInfo.timeSignatureAtQ(0))&&void 0!==t?t:s.DEFAULT_TIME_SIGNATURE,this.drawSignatures(this.overlayG,0,!0,!0),this.updateLayout()},t.prototype.updateLayout=function(t){this.width=null!=t?t:this.width,this.config.width>0&&(this.width=this.config.width),this.height=Math.max(this.height,6*this.config.noteHeight),this.config.height>0&&(this.height=this.config.height);var e=1.65*this.config.noteHeight;this.mainSVG.setAttribute("width","".concat(this.width)),this.mainSVG.setAttribute("height","".concat(this.height)),this.mainG.setAttribute("transform","translate(0, ".concat(this.yBaseline+e,")")),this.overlaySVG.setAttribute("width","200"),this.overlaySVG.setAttribute("height","".concat(this.height)),this.overlayG.setAttribute("transform","translate(0, ".concat(this.yBaseline,")"))},t.prototype.redraw=function(t,e){var i=this,r=-1,o=this.config.pixelsPerTimeStep<=0;if(t){var s="".concat(t.start,"-").concat(t.pitch);if(this.playingNotes.forEach(function(t,e){if(e!==s){var n=i.mainSVG.querySelector('g[data-id="'.concat(e,'"]'));n&&(0,a.resetElementHighlight)(n,i.config.noteColor),i.playingNotes.delete(e)}}),!this.playingNotes.has(s)){var h=this.mainSVG.querySelector('g[data-id="'.concat(s,'"]'));if(h){(0,a.highlightElement)(h,this.config.activeNoteColor),this.playingNotes.set(s,t);var u=h.getBoundingClientRect(),l=this.mainSVG.getBoundingClientRect();r=u.left-l.left+this.parentElement.scrollLeft;var c=h.hasAttribute("data-is-measure-start");e&&(this.config.scrollType!==n.BAR||c)&&this.scrollIntoViewIfNeeded(r)}}if(!o&&this.signaturesBlinking){var d=this.overlayG.getBoundingClientRect().width;this.jianpuModel.measuresInfo.quartersToTime(t.start,t.start)*this.config.pixelsPerTimeStep>d&&(this.signaturesBlinking=!1,(0,a.setBlinkAnimation)(this.overlayG,!1))}}else{this.jianpuModel.update(this.jianpuInfo,this.config.defaultKey);var g=this.width,f=this.width,m=this.height>0?this.height-this.yBaseline:3*this.config.noteHeight,p=0,S=new Map;this.jianpuModel.jianpuBlockMap.forEach(function(t,e){if(e>=i.lastRenderedQ-1e-9){g=o?f:i.jianpuModel.measuresInfo.quartersToTime(e,e)*i.config.pixelsPerTimeStep;var n=i.drawJianpuBlock(t,g,S);o?f+=n:f=Math.max(f,g+n);var r=i.mainSVG.querySelector('g[data-block-start="'.concat(t.start,'"]'));if(r)try{var a=r.getBBox(),s=a.y,h=a.y+a.height;p=Math.min(p,s),m=Math.max(m,h)}catch(t){}i.lastRenderedQ=e+t.length}}),this.height=Math.max(this.height,m-p+this.config.noteHeight),this.updateLayout(f)}return r},t.prototype.drawJianpuBlock=function(t,e,i){var n=0,s=this.config.pixelsPerTimeStep<=0,h=t.isMeasureBeginning(),u=(0,a.createSVGGroupChild)(this.musicG,"block-".concat(t.start));if(u.setAttribute("data-block-start","".concat(t.start)),h&&t.start>1e-6){var l=e-(s?.6*this.estimatedNoteWidth:4),c=2*this.config.noteHeight,d=0,g=(0,a.drawSVGPath)(this.musicG,o.barPath,l,d,1,c/o.PATH_SCALE);(0,a.setStroke)(g,this.config.noteColor,r.LINE_STROKE_WIDTH),s&&(n+=r.LINE_STROKE_WIDTH)}var f=this.updateCurrentKey(t.start),m=this.updateCurrentTimeSignature(t.start),p=0;if((f||m)&&t.start>1e-6){var S=e+n;p=this.drawSignatures(this.signaturesG,S,f,m),s&&(n+=p+.2*this.estimatedNoteWidth)}var v=e+n,T=0;if(t.notes.length>0?T=this.drawNotes(t,v,i,u):t.length>1e-6&&(T=this.drawRest(t,v,u)),s){n+=T;var A=this.estimatedNoteWidth*this.config.noteSpacingFactor;t.beatEnd?A*=1:t.length<.0625?A*=.05:t.length<.125?A*=.1:t.length<.25?A*=.2:t.length<.5?A*=.4:t.length<1&&(A*=.5),n+=A}else n=Math.max(p,T);return this.jianpuModel.isLastMeasureAtQ(t.start+t.length)&&(l=e+n,c=2*this.config.noteHeight,d=0,g=(0,a.drawSVGPath)(this.musicG,o.barPath,l,d,1,c/o.PATH_SCALE),(0,a.setStroke)(g,this.config.noteColor,r.LINE_STROKE_WIDTH),s&&(n+=r.LINE_STROKE_WIDTH)),n},t.prototype.drawNotes=function(t,e,i,n){var s=this,h=e,u=e,l=.1*this.estimatedNoteWidth,c="".concat(this.numberFontSize,"px"),d="".concat(this.smallFontSize,"px"),g=t.durationLines,f=void 0===g?0:g,m=t.augmentationDots,p=void 0===m?0:m,S=t.augmentationDash,v=void 0!==S&&S;return t.notes.forEach(function(e){var g,m,S,T="".concat(e.start,"-").concat(e.pitch),A=(0,a.createSVGGroupChild)(n,T);t.isMeasureBeginning()&&A.setAttribute("data-is-measure-start","true");var E=h,_=E;if(0!==e.accidental){var I=o.ACCIDENTAL_TEXT[e.accidental];(0,a.drawSVGText)(A,I,E+l,0,d,"normal","end","text-top",s.config.noteColor,1,s.config.fontFamily)}var N=0;if(v){var y=s.config.noteHeight*r.AUGMENTATION_DASH_FACTOR,M=y/50,C=(0,a.drawSVGPath)(A,o.augmentationDashPath,E,0,M,1);(0,a.setStroke)(C,s.config.noteColor,r.LINE_STROKE_WIDTH),_=E+(N=y)}else{var L="".concat(e.jianpuNumber);_=E+(N=(0,a.drawSVGText)(A,L,E,0,c,"normal","start","middle",s.config.noteColor,1,s.config.fontFamily).getBBox().width)}if(0!==e.octaveDot&&!1===v)for(var b=(H=s.config.noteHeight*r.DOT_SIZE_FACTOR)/(.15*o.PATH_SCALE),O=E+N/2,G=2.8*H,R=s.config.noteHeight*r.OCTAVE_DOT_OFFSET_FACTOR,D=0;D<Math.abs(e.octaveDot);D++){var P=(e.octaveDot>0?-R:.6*R)-D*G*(e.octaveDot>0?1:-1);(0,a.drawSVGPath)(A,o.dotPath,O,P,b,b)}if(f>0)for(var w=s.config.noteHeight*r.UNDERLINE_SPACING_FACTOR*2.5,F=s.config.noteHeight*r.UNDERLINE_SPACING_FACTOR,k=N/o.PATH_SCALE*(null!==(g=r.DURATION_LINE_SCALES.get(f))&&void 0!==g?g:1),V=0;V<f;V++){var U=w+V*F,x=(0,a.drawSVGPath)(A,o.underlinePath,E,U,k,1);(0,a.setStroke)(x,s.config.noteColor,r.LINE_STROKE_WIDTH)}var B=_+l;if(p>0){var H;for(b=(H=s.config.noteHeight*r.DOT_SIZE_FACTOR)/(.15*o.PATH_SCALE),D=0;D<p;D++)(0,a.drawSVGPath)(A,o.dotPath,B,0,b,b),B+=H+l;_=B+l}var j=_;if(e.tiedTo&&!v)i.set(e,{g:A,xNoteRight:j,yNoteBaseline:0});else if(e.tiedFrom){for(var Q=e.tiedFrom;Q.tiedFrom;)Q=Q.tiedFrom;var J=i.get(Q);if(J){var K=1*J.xNoteRight,W=(v?E-2.2*s.estimatedNoteWidth:E-l)-K,q=1.2*-s.config.noteHeight,Z=W/o.PATH_SCALE*1.3,z=s.config.noteHeight/o.PATH_SCALE*1.6;W>1&&(0,a.drawSVGPath)(J.g,o.tiePath,K-(null!==(S=null===(m=J.g.getCTM())||void 0===m?void 0:m.e)&&void 0!==S?S:0),q,Z,z);for(var X=Q;X&&X!==e;){i.delete(X);var Y=X.tiedTo;Y&&(X=Y)}}else console.warn("Missing linked SVG details for first tied note:",Q)}u=Math.max(u,_)}),u-e},t.prototype.drawRest=function(t,e,i){var n,s="".concat(this.numberFontSize,"px"),h=.1*this.estimatedNoteWidth,u=t.durationLines,l=void 0===u?0:u,c=t.augmentationDots,d=void 0===c?0:c,g=e,f=g,m=(0,a.drawSVGText)(i,"0",g,0,s,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width;if(f=g+m,l>0)for(var p=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR*2.5,S=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR,v=m/o.PATH_SCALE*(null!==(n=r.DURATION_LINE_SCALES.get(l))&&void 0!==n?n:1),T=0;T<l;T++){var A=p+T*S,E=(0,a.drawSVGPath)(i,o.underlinePath,g,A,v,1);(0,a.setStroke)(E,this.config.noteColor,r.LINE_STROKE_WIDTH)}var _=f+h;if(d>0){for(var I=this.config.noteHeight*r.DOT_SIZE_FACTOR,N=I/(.15*o.PATH_SCALE),y=0;y<d;y++)(0,a.drawSVGPath)(i,o.dotPath,_,0,N,N),_+=I+h;f=_+h}return f-e},t.prototype.drawSignatures=function(t,e,i,n){var r,o=e,s=.3*this.estimatedNoteWidth,h="".concat(this.smallFontSize,"px"),l="".concat(this.numberFontSize,"px");if(i){var c=null!==(r=u.PITCH_CLASS_NAMES[this.currentKey%12])&&void 0!==r?r:"C",d="1=".concat(c);o+=(0,a.drawSVGText)(t,d,o,0,l,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width+2*s}if(n){var g="".concat(this.currentTimeSignature.numerator,"/").concat(this.currentTimeSignature.denominator);o+=(0,a.drawSVGText)(t,g,o,0,h,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width+s}var f=o-e;try{var m=t.getBBox(),p=m.y,S=m.y+m.height,v=Math.max(this.yBaseline+S,this.yBaseline-p)+.5*this.config.noteHeight;this.height=Math.max(this.height,v)}catch(t){}return t===this.overlayG&&this.config.pixelsPerTimeStep>0&&(this.signaturesBlinking=!0,(0,a.setBlinkAnimation)(this.overlayG,!0)),f},t.prototype.updateCurrentKey=function(t){var e=this.jianpuModel.measuresInfo.keySignatureAtQ(t,!0);return-1!==e&&e!==this.currentKey&&(this.currentKey=e,!0)},t.prototype.updateCurrentTimeSignature=function(t){var e=this.jianpuModel.measuresInfo.timeSignatureAtQ(t,!0);return!(!e||e.numerator===this.currentTimeSignature.numerator&&e.denominator===this.currentTimeSignature.denominator||(this.currentTimeSignature=e,0))},t.prototype.scrollIntoViewIfNeeded=function(t){var e=this.parentElement.getBoundingClientRect().width,i=this.parentElement.scrollLeft,r=i;this.config.scrollType===n.PAGE?t<i+20?r=t-20:t>i+e-20&&(r=t-e+20):r=t-.5*e,r=Math.max(0,Math.min(r,this.parentElement.scrollWidth-e)),Math.abs(r-i)>1&&(this.parentElement.scrollTo({left:r,behavior:"smooth"}),this.updateOverlaySignaturesForScroll(r))},t.prototype.updateOverlaySignaturesForScroll=function(t){var e,i=this.pixelsToTime(t),n=this.jianpuModel.measuresInfo.keySignatureAtQ(i),r=null!==(e=this.jianpuModel.measuresInfo.timeSignatureAtQ(i))&&void 0!==e?e:this.currentTimeSignature,o=!1;if(n!==this.currentKey&&(this.currentKey=n,o=!0),r.numerator===this.currentTimeSignature.numerator&&r.denominator===this.currentTimeSignature.denominator||(this.currentTimeSignature=r,o=!0),o){for(;this.overlayG.lastChild;)this.overlayG.removeChild(this.overlayG.lastChild);this.drawSignatures(this.overlayG,0,!0,!0),t<10&&this.config.pixelsPerTimeStep>0?((0,a.setBlinkAnimation)(this.overlayG,!0),this.signaturesBlinking=!0):this.config.pixelsPerTimeStep>0&&((0,a.setBlinkAnimation)(this.overlayG,!1),this.signaturesBlinking=!1)}},t.prototype.pixelsToTime=function(t){return this.config.pixelsPerTimeStep<=0?0:this.jianpuModel.measuresInfo.timeToQuarters(t/this.config.pixelsPerTimeStep,0)},t}();e.JianpuSVGRender=l},980(t,e,i){Object.defineProperty(e,"__esModule",{value:!0}),e.MeasuresInfo=void 0;var n=i(567),r=i(214),a=function(){function t(e,i){if(this.allowDottedRests=!0,this.measuresInfo=[],i>0){var r=t.getSortedChanges(e.tempos,n.DEFAULT_TEMPO),a=t.getSortedChanges(e.keySignatures,n.DEFAULT_KEY_SIGNATURE),o=t.getSortedChanges(e.timeSignatures,n.DEFAULT_TIME_SIGNATURE),s=0,h=0,u=0,l=r[0].event,c=a[0].event,d=o[0].event,g=1,f=(0,n.getMeasureLength)(d),m=d.start,p=[0];r.forEach(function(t){return p.push(t.start)}),a.forEach(function(t){return p.push(t.start)}),o.forEach(function(t){return p.push(t.start)}),p.sort(function(t,e){return t-e});for(var S=-1,v=0;v<p.length;v++){var T=p[v];if(T>=i)break;if(T!==S){S=T;for(var A=!1,E=!1,_=!1;s<r.length&&r[s].start<=T;)l=r[s++].event,A=!0;for(;h<a.length&&a[h].start<=T;)c=a[h++].event,E=!0;for(;u<o.length&&o[u].start<=T;)g+=(o[u].event.start-m)/f,g=Math.round(1e3*g)/1e3,d=o[u++].event,f=(0,n.getMeasureLength)(d),m=T,_=!0;var I={start:T,measureNumber:g+(T-m)/f,measureLength:f,tempo:l,keySignature:c,timeSignature:d};A&&(I.tempoChange=!0),E&&(I.keyChange=!0),_&&(I.timeChange=!0),this.measuresInfo.push(I)}}}}return t.getSortedChanges=function(t,e){var i=t&&t.length?t.slice():[e];return i.sort(function(t,e){return t.start-e.start}),i.map(function(t){return{start:Math.max(0,Math.round(t.start/r.MIN_RESOLUTION)*r.MIN_RESOLUTION),event:t}})},t.prototype.findIndex=function(t){for(var e=0,i=this.measuresInfo.length-1,n=0;e<=i;){var r=Math.floor((e+i)/2);this.measuresInfo[r].start<=t?(n=r,e=r+1):i=r-1}return n},t.prototype.measureNumberAtQ=function(t){if(0===this.measuresInfo.length)return 1;var e=this.findIndex(t),i=this.measuresInfo[e],n=(t-i.start)/i.measureLength;return i.measureNumber+n+1e-9},t.prototype.measureLengthAtQ=function(t){if(0===this.measuresInfo.length)return(0,n.getMeasureLength)(n.DEFAULT_TIME_SIGNATURE);var e=this.findIndex(t);return this.measuresInfo[e].measureLength},t.prototype.tempoAtQ=function(t,e){if(void 0===e&&(e=!1),0===this.measuresInfo.length)return n.DEFAULT_TEMPO.qpm;var i=this.findIndex(t),a=this.measuresInfo[i],o=Math.abs(a.start-t)<r.MIN_RESOLUTION/2;return!e||a.tempoChange&&o?a.tempo.qpm:-1},t.prototype.keySignatureAtQ=function(t,e){if(void 0===e&&(e=!1),0===this.measuresInfo.length)return n.DEFAULT_KEY_SIGNATURE.key;var i=this.findIndex(t),a=this.measuresInfo[i],o=Math.abs(a.start-t)<r.MIN_RESOLUTION/2;return!e||a.keyChange&&o?a.keySignature.key:-1},t.prototype.timeSignatureAtQ=function(t,e){if(void 0===e&&(e=!1),0===this.measuresInfo.length)return n.DEFAULT_TIME_SIGNATURE;var i=this.findIndex(t),a=this.measuresInfo[i],o=Math.abs(a.start-t)<r.MIN_RESOLUTION/2;return!e||a.timeChange&&o?a.timeSignature:null},t.prototype.quartersToTime=function(t,e){var i=this.tempoAtQ(e);return i<=0?0:t/i*60},t.prototype.timeToQuarters=function(t,e){var i=this.tempoAtQ(e);if(i<=0)return 0;var n=t*i/60;return Math.round(n*r.MAX_QUARTER_DIVISION)/r.MAX_QUARTER_DIVISION},t.prototype.isBeatStart=function(t){if(0===this.measuresInfo.length)return!1;var e=this.findIndex(t),i=this.measuresInfo[e],n=i.timeSignature,a=(t-(i.start-(i.measureNumber-Math.floor(i.measureNumber))*i.measureLength))/(4/n.denominator);return Math.abs(a-Math.round(a))<r.MIN_RESOLUTION/2},t}();e.MeasuresInfo=a},214(t,e){Object.defineProperty(e,"__esModule",{value:!0}),e.MIDDLE_C_MIDI=e.MAJOR_SCALE_INTERVALS=e.PITCH_CLASS_NAMES=e.MAX_QUARTER_DIVISION=e.MIN_RESOLUTION=void 0,e.MIN_RESOLUTION=.0625,e.MAX_QUARTER_DIVISION=240,e.PITCH_CLASS_NAMES=["C","C#","D","D#","E","F","F#","G","G#","A","A#","B"],e.MAJOR_SCALE_INTERVALS={0:1,2:2,4:3,5:4,7:5,9:6,11:7},e.MIDDLE_C_MIDI=60},75(t,e){Object.defineProperty(e,"__esModule",{value:!0}),e.DURATION_LINE_SCALES=e.SMALL_FONT_SIZE_MULTIPLIER=e.FONT_SIZE_MULTIPLIER=e.AUGMENTATION_SPACING_FACTOR=e.ACCIDENTAL_SPACING_FACTOR=e.AUGMENTATION_DASH_FACTOR=e.DOT_SIZE_FACTOR=e.OCTAVE_DOT_OFFSET_FACTOR=e.UNDERLINE_SPACING_FACTOR=e.COMPACT_SPACING_FACTOR=e.LINE_STROKE_WIDTH=void 0,e.LINE_STROKE_WIDTH=1,e.COMPACT_SPACING_FACTOR=1.5,e.UNDERLINE_SPACING_FACTOR=.2,e.OCTAVE_DOT_OFFSET_FACTOR=1,e.DOT_SIZE_FACTOR=.1,e.AUGMENTATION_DASH_FACTOR=.8,e.ACCIDENTAL_SPACING_FACTOR=.1,e.AUGMENTATION_SPACING_FACTOR=.2,e.FONT_SIZE_MULTIPLIER=1.2,e.SMALL_FONT_SIZE_MULTIPLIER=.75,e.DURATION_LINE_SCALES=new Map([[1,1.78],[2,1.6],[3,1.3],[4,1.15]])},388(t,e){Object.defineProperty(e,"__esModule",{value:!0}),e.dotPath=e.tiePath=e.augmentationDashPath=e.underlinePath=e.barPath=e.ACCIDENTAL_TEXT=e.ACCIDENTAL_PATHS=e.PATH_SCALE=void 0,e.PATH_SCALE=100,e.ACCIDENTAL_PATHS=[null,"m 30,15 h 40 m -35,20 h 40 M 50,0 v 50 M 70,5 v 50","m 45,5 v 40 c 0,15 20,15 20,0 V 20 C 65,5 45,5 45,5 Z","M 45,5 v 45 M 65,0 v 45 H 45 m 20,10 H 45"],e.ACCIDENTAL_TEXT=["","#","b"],e.barPath="m 0,-50 v 100",e.underlinePath="m 0,0 h 100",e.augmentationDashPath="m 0,0 h 50",e.tiePath="M -13,5 C 15,-15 65,-15 90,5 C 65,-25 15,-25 -13,5 Z",e.dotPath="M 0 0 a 15 15 0 1 0 0.0001 0 z"},811(t,e){Object.defineProperty(e,"__esModule",{value:!0}),e.resetElementHighlight=e.highlightElement=e.setStroke=e.setFill=e.setBlinkAnimation=e.createSVGGroupChild=e.drawSVGText=e.drawSVGPath=e.SVGNS=void 0,e.SVGNS="http://www.w3.org/2000/svg",e.drawSVGPath=function(t,i,n,r,a,o,s){void 0===s&&(s=1);var h=document.createElementNS(e.SVGNS,"path");return h.setAttributeNS(null,"d",i),h.setAttributeNS(null,"transform","translate(".concat(n,", ").concat(r,") scale(").concat(a,", ").concat(o,")")),s<1&&h.setAttributeNS(null,"opacity","".concat(s)),t.appendChild(h),h},e.drawSVGText=function(t,i,n,r,a,o,s,h,u,l,c){void 0===o&&(o="normal"),void 0===s&&(s="middle"),void 0===h&&(h="middle"),void 0===u&&(u="currentColor"),void 0===l&&(l=1),void 0===c&&(c="sans-serif");var d=document.createElementNS(e.SVGNS,"text");d.setAttributeNS(null,"font-family",c),d.setAttributeNS(null,"font-size",a),d.setAttributeNS(null,"font-weight",o),d.setAttributeNS(null,"x","".concat(n)),d.setAttributeNS(null,"y","".concat(r)),d.setAttributeNS(null,"text-anchor",s),d.setAttributeNS(null,"dominant-baseline",h),"currentColor"!==u&&d.setAttributeNS(null,"fill",u),l<1&&d.setAttributeNS(null,"opacity","".concat(l));var g=document.createTextNode(i);return d.appendChild(g),t.appendChild(d),d},e.createSVGGroupChild=function(t,i){var n=document.createElementNS(e.SVGNS,"g");return i&&n.setAttribute("data-id",i),t.appendChild(n),n},e.setBlinkAnimation=function(t,i,n){void 0===i&&(i=!0),void 0===n&&(n="1s");var r=t.querySelector('animate[attributeName="opacity"]');return i?r?(r.setAttributeNS(null,"repeatCount","indefinite"),r.beginElement()):((r=document.createElementNS(e.SVGNS,"animate")).setAttributeNS(null,"attributeName","opacity"),r.setAttributeNS(null,"values","1;0.2;1"),r.setAttributeNS(null,"keyTimes","0;0.5;1"),r.setAttributeNS(null,"dur",n),r.setAttributeNS(null,"repeatCount","indefinite"),t.appendChild(r)):(r&&(r.endElement(),r.setAttributeNS(null,"repeatCount","0"),t.style.opacity="1"),t.style.opacity="1"),t},e.setFill=function(t,e){t.setAttributeNS(null,"fill",e)},e.setStroke=function(t,e,i){t.setAttributeNS(null,"stroke",e),t.setAttributeNS(null,"stroke-width","".concat(i))},e.highlightElement=function(t,e){var i=[];return t.matches("text, path")&&i.push(t),t.querySelectorAll("text, path").forEach(function(t){i.push(t)}),i.forEach(function(t){"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e);var i=t.getAttribute("stroke");null!==i&&"none"!==i&&t.setAttribute("stroke",e)}),t},e.resetElementHighlight=function(t,e){t.querySelectorAll("text, path").forEach(function(t){"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e);var i=t.getAttribute("stroke");null!==i&&"none"!==i&&t.setAttribute("stroke",e)})}}};const e={};var i;i=function i(n){const r=e[n];if(void 0!==r)return r.exports;const a=e[n]={exports:{}};return t[n].call(a.exports,a,a.exports,i),a.exports}(229),window.jr=i})();
|
package/es5/svg_tools.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export declare const SVGNS = "http://www.w3.org/2000/svg";
|
|
2
2
|
export declare function drawSVGPath(e: SVGElement, path: string, x: number, y: number, scaleX: number, scaleY: number, opacity?: number): SVGPathElement;
|
|
3
|
-
export declare function drawSVGText(e: SVGElement, text: string, x: number, y: number, fontSize: string, fontWeight?: string, textAnchor?: 'start' | 'middle' | 'end', dominantBaseline?: string, fill?: string, opacity?: number): SVGTextElement;
|
|
3
|
+
export declare function drawSVGText(e: SVGElement, text: string, x: number, y: number, fontSize: string, fontWeight?: string, textAnchor?: 'start' | 'middle' | 'end', dominantBaseline?: string, fill?: string, opacity?: number, fontFamily?: string): SVGTextElement;
|
|
4
4
|
export declare function createSVGGroupChild(parent: SVGElement, id?: string): SVGGElement;
|
|
5
5
|
export declare function setBlinkAnimation(e: SVGElement, enable?: boolean, duration?: string): SVGElement;
|
|
6
6
|
export declare function setFill(e: SVGElement, color: string): void;
|
package/es6/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.index=e():t.index=e()}(self,()=>(()=>{"use strict";var t={765(t,e,i){i.d(e,{JianpuBlock:()=>o,splitJianpuNote:()=>r});var s=i(559);function n(t){return Math.abs(t)<1e-6}function r(t,e){const i=t.start+t.length;if(e<=t.start||e>=i||n(i-e))return null;const s=i-e;t.length=e-t.start;const r={start:e,length:s,pitch:t.pitch,intensity:t.intensity,jianpuNumber:t.jianpuNumber,octaveDot:t.octaveDot,accidental:0,tiedFrom:t};return t.tiedTo&&(r.tiedTo=t.tiedTo,t.tiedTo.tiedFrom=r),t.tiedTo=r,r}class o{start;length;notes;measureNumber;durationLines;augmentationDots;augmentationDash;beatBegin;beatEnd;isTieStart;isTieEnd;constructor(t=0,e=0,i=[],s=1){this.start=t,this.length=e,this.notes=i,this.measureNumber=s}addNote(t){if(0===this.notes.length)return this.start=t.start,this.length=t.length,this.notes.push(t),!0;if(!n(this.start-t.start))return console.warn(`JianpuBlock: Attempted to add note at ${t.start} to block starting at ${this.start}. Ignoring.`),!1;let e=!1,i=!1;for(let s=0;s<this.notes.length;s++)if(this.notes[s].pitch===t.pitch){i=!0,t.length<this.notes[s].length&&(this.notes[s].tiedFrom&&(t.tiedFrom=this.notes[s].tiedFrom,t.tiedFrom&&(t.tiedFrom.tiedTo=t)),this.notes[s].tiedTo&&(t.tiedTo=this.notes[s].tiedTo,t.tiedTo&&(t.tiedTo.tiedFrom=t)),this.notes[s]=t,e=!0);break}i||this.notes.push(t);let s=1/0;for(const t of this.notes)s=Math.min(s,t.length);return this.length=s,!i||e}split(t,e){const i=this.start+this.length;if(t<=this.start||t>=i||n(i-t))return null;const s=i-t,a=t-this.start,h=new o(t,s,[],e.measureNumberAtQ(t)),l=[];for(const e of this.notes){const i=e.start+e.length;if(i>t+1e-6){const i=r(e,t);i?l.push(i):console.warn("Split failed for note, unexpected state.")}else n(i-t)}return l.forEach(t=>h.addNote(t)),this.length=a,delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash,this.beatEnd&&(h.beatEnd=!0,delete this.beatEnd),this.isTieEnd&&(h.isTieStart=!0,delete this.isTieEnd),h}splitToBeat(t){const e=t.timeSignatureAtQ(this.start);if(!e)return null;const i=t.measureLengthAtQ(this.start),s=t.measureNumberAtQ(this.start),r=this.start-(s-Math.floor(s))*i,o=this.start-r,a=4/e.denominator,h=o/a;this.beatBegin=n(h-Math.round(h));const l=r+(Math.floor(h+1e-6)+1)*a,u=r+i,c=this.start+this.length;let d=null;l<c-1e-6&&l>this.start+1e-6&&(d=l),u<c-1e-6&&u>this.start+1e-6&&(null===d||u<d)&&(d=u);let g=null;if(null!==d)g=this.split(d,t),g&&(this.beatEnd=!0);else{const t=(o+this.length)/a;this.beatEnd=n(t-Math.round(t)),this.beatEnd||(this.beatEnd=n(c-u))}return this.isTieStart=this.notes.some(t=>t.tiedFrom),this.isTieEnd=this.notes.some(t=>t.tiedTo),g&&(g.isTieStart=g.notes.some(t=>t.tiedFrom),g.isTieEnd=g.notes.some(t=>t.tiedTo),this.notes.some(t=>t.tiedTo&&t.start+t.length>d)&&delete this.isTieEnd),g}calculateRenderProperties(t){delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash;const e=this.length;if(n(e)||e<0)return;if(t.allowDottedRests||this.notes.length>0){if(n(e-1.5))return void(this.augmentationDots=1);if(n(e-.75))return this.durationLines=1,void(this.augmentationDots=1);if(n(e-.375))return this.durationLines=2,void(this.augmentationDots=1);n(e-3)&&(this.augmentationDots=1)}if(this.durationLines=e>=3.999999||e>=1.999999||e>=.999999?0:e>=.499999?1:e>=.249999?2:e>=.124999?3:4,this.augmentationDash=!1,1===this.notes.length){const e=this.notes[0],i=t.timeSignatureAtQ(this.start);if(!i)return;const s=Math.max(4/i.denominator,1);if(!(this.measureNumber%1<=1e-6)&&e.tiedFrom&&n(e.tiedFrom.length-s)&&e.tiedFrom.pitch===e.pitch&&e.length>=1){let i=!0;if(e.tiedTo){const s=e.start+e.length;i=Math.floor(t.measureNumberAtQ(this.start))===Math.floor(t.measureNumberAtQ(s))&&e.tiedTo.length>=1}i&&(this.augmentationDash=!0)}}}splitToStandardSymbol(t){const e=this.length;if(n(e)||e<s.MIN_RESOLUTION-1e-6)return null;const i=[];t.allowDottedRests||this.notes.length>0?(i.push(6),i.push(4),i.push(3),i.push(2),i.push(1.5),i.push(1),i.push(.75),i.push(.5),i.push(.375),i.push(.25),i.push(.125),i.push(.0625)):(i.push(4),i.push(2),i.push(1),i.push(.5),i.push(.25),i.push(.125),i.push(.0625));let r=0;for(const t of i)if(e>=t-1e-6){r=t;break}n(r)&&(r=s.MIN_RESOLUTION,e<r-1e-6&&e>1e-6&&console.warn(`Block length ${e} is too small, rendering as ${r}`));let o=null;return e>r+1e-6?(o=this.split(this.start+r,t),this.length!==r&&(console.warn(`Adjusting block length after split from ${this.length} to ${r}`),this.length=r)):this.length=r,o}mergeToMap(t){const e=t.get(this.start);e?(this.notes.forEach(t=>e.addNote(t)),0!==this.measureNumber&&(e.measureNumber=this.measureNumber)):t.set(this.start,this)}isMeasureBeginning(){return n(this.measureNumber-Math.floor(this.measureNumber))}}},830(t,e,i){i.d(e,{getMeasureLength:()=>s});function s(t){return t.numerator*(4/t.denominator)}i.d(e,["DEFAULT_KEY_SIGNATURE",0,{start:0,key:0},"DEFAULT_TEMPO",0,{start:0,qpm:60},"DEFAULT_TIME_SIGNATURE",0,{start:0,numerator:4,denominator:4}])},849(t,e,i){i.d(e,{JianpuModel:()=>a,mapMidiToJianpu:()=>h});var s=i(830),n=i(775),r=i(765),o=i(559);class a{jianpuInfo;measuresInfo;jianpuBlockMap;lastQ;constructor(t,e){this.jianpuInfo=t,this.jianpuBlockMap=new Map,this.lastQ=0,this.update(t,e)}isLastMeasureAtQ(t){return t>=this.lastQ-1e-6}getTotalDuration(){return this.lastQ}update(t,e){this.jianpuInfo=t,t.notes.sort((t,e)=>t.start-e.start),this.lastQ=0,t.notes.forEach(t=>{this.lastQ=Math.max(this.lastQ,t.start+t.length)}),this.lastQ+=1e-6,t.tempos=t.tempos&&t.tempos.length?t.tempos:[s.DEFAULT_TEMPO],t.tempos.sort((t,e)=>t.start-e.start),t.tempos[0].start>1e-6&&t.tempos.unshift({...s.DEFAULT_TEMPO,start:0});const i=void 0!==e?{start:0,key:e}:{...s.DEFAULT_KEY_SIGNATURE};t.keySignatures=t.keySignatures&&t.keySignatures.length?t.keySignatures:[i],t.keySignatures.sort((t,e)=>t.start-e.start),t.keySignatures[0].start>1e-6&&t.keySignatures.unshift({...i,start:0}),t.timeSignatures=t.timeSignatures&&t.timeSignatures.length?t.timeSignatures:[s.DEFAULT_TIME_SIGNATURE],t.timeSignatures.sort((t,e)=>t.start-e.start),t.timeSignatures[0].start>1e-6&&t.timeSignatures.unshift({...s.DEFAULT_TIME_SIGNATURE,start:0}),this.measuresInfo=new n.MeasuresInfo(t,this.lastQ),this.infoToBlocks()}infoToBlocks(){const t=new Map;let e=0;if(this.jianpuInfo.notes.forEach(i=>{const s=i.start,n=this.measuresInfo.measureNumberAtQ(s);if(s>e+1e-6){const i=e,n=s-i,o=this.measuresInfo.measureNumberAtQ(i),a=new r.JianpuBlock(i,n,[],o);t.set(i,a)}const o=this.measuresInfo.keySignatureAtQ(s),a=this.createJianpuNote(i,o);let h=t.get(s);h||(h=new r.JianpuBlock(s,0,[],n),t.set(s,h)),h.addNote(a),e=Math.max(e,s+h.length)}),this.lastQ>e+1e-6){const i=e,s=this.lastQ-1e-6-i;if(s>1e-6){const e=this.measuresInfo.measureNumberAtQ(i),n=new r.JianpuBlock(i,s,[],e);t.set(i,n)}}this.jianpuBlockMap=new Map;const i=Array.from(t.keys()).sort((t,e)=>t-e);let s=[];i.forEach(e=>{s.push(t.get(e))});const n=new Set;for(;s.length>0;){let t=s.shift();n.has(t.start)&&this.jianpuBlockMap.has(t.start);let e=t.splitToBeat(this.measuresInfo);if(e){t.mergeToMap(this.jianpuBlockMap),n.add(t.start),s.unshift(e);continue}let i=t,r=null;do{r=i.splitToStandardSymbol(this.measuresInfo),i.mergeToMap(this.jianpuBlockMap),n.add(i.start),r&&(i=r)}while(r)}this.jianpuBlockMap.forEach(t=>{t.calculateRenderProperties(this.measuresInfo)})}createJianpuNote(t,e){const i=h(t.pitch,e);return{...t,jianpuNumber:i.jianpuNumber,octaveDot:i.octaveDot,accidental:i.accidental}}}function h(t,e){const i=e%12;let s=o.MIDDLE_C_MIDI+i;i>o.MIDDLE_C_MIDI%12&&(s-=12);const n=(t-(s+12*Math.round((t-s)/12))+12)%12;let r=o.MAJOR_SCALE_INTERVALS[n],a=0;if(void 0===r){switch(n){case 1:r=o.MAJOR_SCALE_INTERVALS[0],a=1;break;case 3:r=o.MAJOR_SCALE_INTERVALS[4],a=2;break;case 6:r=o.MAJOR_SCALE_INTERVALS[5],a=1;break;case 8:r=o.MAJOR_SCALE_INTERVALS[9],a=2;break;case 10:r=o.MAJOR_SCALE_INTERVALS[11],a=2;break;default:{console.warn(`Unexpected chromatic interval ${n} in mapMidiToJianpu. Defaulting to sharp of lower valid degree.`);const i=(n-1+12)%12,s=(n+1+12)%12,h=o.MAJOR_SCALE_INTERVALS[i],l=o.MAJOR_SCALE_INTERVALS[s];void 0!==h?(r=h,a=1):void 0!==l?(r=l,a=2):(r=1,a=1,console.error(`Could not determine Jianpu number components for MIDI ${t}, interval ${n} from tonic in key ${e}.`));break}}void 0===r&&(console.error(`Jianpu number became undefined for MIDI ${t} (interval ${n}, key ${e}) after chromatic processing. This indicates a logic error or misconfigured MAJOR_SCALE_INTERVALS.`),r=1,a=1)}return{jianpuNumber:r,octaveDot:Math.floor((t-s)/12),accidental:a}}},313(t,e,i){i.d(e,{JianpuSVGRender:()=>u,ScrollType:()=>s});var s,n=i(240),r=i(134),o=i(961),a=i(830),h=i(849),l=i(559);!function(t){t[t.PAGE=0]="PAGE",t[t.NOTE=1]="NOTE",t[t.BAR=2]="BAR"}(s||(s={}));class u{jianpuInfo;jianpuModel;config;height;width;parentElement;div;mainSVG;mainG;musicG;signaturesG;overlaySVG;overlayG;signaturesBlinking;lastKnownScrollLeft;isScrolling;currentKey;currentTimeSignature;playingNotes;lastRenderedQ;estimatedNoteWidth;numberFontSize;smallFontSize;yBaseline;parseColorString(t){return/^[a-z]+$/i.test(t)||t.startsWith("rgb(")?t:/^\d+,\s*\d+,\s*\d+$/.test(t)?`rgb(${t})`:t}constructor(t,e,i){this.jianpuInfo=t,this.div=i;this.config={noteHeight:e.noteHeight??20,noteSpacingFactor:e.noteSpacingFactor??n.COMPACT_SPACING_FACTOR,pixelsPerTimeStep:e.pixelsPerTimeStep??0,noteColor:this.parseColorString(e.noteColor??"black"),activeNoteColor:this.parseColorString(e.activeNoteColor??"red"),defaultKey:e.defaultKey??0,scrollType:e.scrollType??s.PAGE,fontFamily:e.fontFamily??"sans-serif",width:e.width??0,height:e.height??0},this.jianpuModel=new h.JianpuModel(this.jianpuInfo,this.config.defaultKey),this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??a.DEFAULT_TIME_SIGNATURE,this.playingNotes=new Map,this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.numberFontSize=this.config.noteHeight*n.FONT_SIZE_MULTIPLIER,this.smallFontSize=this.config.noteHeight*n.SMALL_FONT_SIZE_MULTIPLIER,this.estimatedNoteWidth=.6*this.numberFontSize,this.yBaseline=1.5*this.config.noteHeight,this.height=0,this.width=0,this.clear(),this.redraw()}clear(){for(;this.div.lastChild;)this.div.removeChild(this.div.lastChild);this.div.style.position="relative",this.div.style.overflow="hidden",this.overlaySVG=document.createElementNS(r.SVGNS,"svg"),this.overlaySVG.style.position="absolute",this.overlaySVG.style.left="0",this.overlaySVG.style.top="0",this.overlaySVG.style.pointerEvents="none",this.div.appendChild(this.overlaySVG),this.overlayG=(0,r.createSVGGroupChild)(this.overlaySVG,"overlay"),this.parentElement=document.createElement("div"),this.parentElement.style.overflowX="auto",this.parentElement.style.overflowY="hidden",this.parentElement.style.width="100%",this.parentElement.style.height="100%",this.div.appendChild(this.parentElement),this.parentElement.addEventListener("scroll",this.handleScrollEvent),this.mainSVG=document.createElementNS(r.SVGNS,"svg"),this.mainSVG.style.display="block",this.parentElement.appendChild(this.mainSVG),this.mainG=(0,r.createSVGGroupChild)(this.mainSVG,"main-content"),this.signaturesG=(0,r.createSVGGroupChild)(this.mainG,"signatures"),this.musicG=(0,r.createSVGGroupChild)(this.mainG,"music"),this.playingNotes.clear(),this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.height=this.config.height>0?this.config.height:5*this.config.noteHeight,this.width=this.config.width>0?this.config.width:0,this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??a.DEFAULT_TIME_SIGNATURE,this.drawSignatures(this.overlayG,0,!0,!0),this.updateLayout()}updateLayout(t){this.width=t??this.width,this.config.width>0&&(this.width=this.config.width),this.height=Math.max(this.height,6*this.config.noteHeight),this.config.height>0&&(this.height=this.config.height);const e=1.65*this.config.noteHeight;this.mainSVG.setAttribute("width",`${this.width}`),this.mainSVG.setAttribute("height",`${this.height}`),this.mainG.setAttribute("transform",`translate(0, ${this.yBaseline+e})`),this.overlaySVG.setAttribute("width","200"),this.overlaySVG.setAttribute("height",`${this.height}`),this.overlayG.setAttribute("transform",`translate(0, ${this.yBaseline})`)}redraw(t,e){let i=-1;const n=this.config.pixelsPerTimeStep<=0;if(t){const o=`${t.start}-${t.pitch}`;if(this.playingNotes.forEach((t,e)=>{if(e!==o){const t=this.mainSVG.querySelector(`g[data-id="${e}"]`);t&&(0,r.resetElementHighlight)(t,this.config.noteColor),this.playingNotes.delete(e)}}),!this.playingNotes.has(o)){const n=this.mainSVG.querySelector(`g[data-id="${o}"]`);if(n){(0,r.highlightElement)(n,this.config.activeNoteColor),this.playingNotes.set(o,t);const a=n.getBoundingClientRect(),h=this.mainSVG.getBoundingClientRect();i=a.left-h.left+this.parentElement.scrollLeft;const l=n.hasAttribute("data-is-measure-start");e&&(this.config.scrollType!==s.BAR||l)&&this.scrollIntoViewIfNeeded(i)}}if(!n&&this.signaturesBlinking){const e=this.overlayG.getBoundingClientRect().width;this.jianpuModel.measuresInfo.quartersToTime(t.start,t.start)*this.config.pixelsPerTimeStep>e&&(this.signaturesBlinking=!1,(0,r.setBlinkAnimation)(this.overlayG,!1))}}else{this.jianpuModel.update(this.jianpuInfo,this.config.defaultKey);let t=this.width,e=this.width,i=this.height>0?this.height-this.yBaseline:3*this.config.noteHeight,s=0;const r=new Map;this.jianpuModel.jianpuBlockMap.forEach((o,a)=>{if(a>=this.lastRenderedQ-1e-9){t=n?e:this.jianpuModel.measuresInfo.quartersToTime(a,a)*this.config.pixelsPerTimeStep;const h=this.drawJianpuBlock(o,t,r);n?e+=h:e=Math.max(e,t+h);const l=this.mainSVG.querySelector(`g[data-block-start="${o.start}"]`);if(l)try{const t=l.getBBox(),e=t.y,n=t.y+t.height;s=Math.min(s,e),i=Math.max(i,n)}catch(t){}this.lastRenderedQ=a+o.length}}),this.height=Math.max(this.height,i-s+this.config.noteHeight),this.updateLayout(e)}return i}drawJianpuBlock(t,e,i){let s=0;const a=this.config.pixelsPerTimeStep<=0,h=t.isMeasureBeginning(),l=(0,r.createSVGGroupChild)(this.musicG,`block-${t.start}`);if(l.setAttribute("data-block-start",`${t.start}`),h&&t.start>1e-6){const t=e-(a?.6*this.estimatedNoteWidth:4),i=2*this.config.noteHeight,h=0,l=(0,r.drawSVGPath)(this.musicG,o.barPath,t,h,1,i/o.PATH_SCALE);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH),a&&(s+=n.LINE_STROKE_WIDTH)}const u=this.updateCurrentKey(t.start),c=this.updateCurrentTimeSignature(t.start);let d=0;if((u||c)&&t.start>1e-6){const t=e+s;d=this.drawSignatures(this.signaturesG,t,u,c),a&&(s+=d+.2*this.estimatedNoteWidth)}const g=e+s;let m=0;if(t.notes.length>0?m=this.drawNotes(t,g,i,l):t.length>1e-6&&(m=this.drawRest(t,g,l)),a){s+=m;let e=this.estimatedNoteWidth*this.config.noteSpacingFactor;t.beatEnd?e*=1:t.length<.0625?e*=.05:t.length<.125?e*=.1:t.length<.25?e*=.2:t.length<.5?e*=.4:t.length<1&&(e*=.5),s+=e}else s=Math.max(d,m);if(this.jianpuModel.isLastMeasureAtQ(t.start+t.length)){const t=e+s,i=2*this.config.noteHeight,h=0,l=(0,r.drawSVGPath)(this.musicG,o.barPath,t,h,1,i/o.PATH_SCALE);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH),a&&(s+=n.LINE_STROKE_WIDTH)}return s}drawNotes(t,e,i,s){let a=e,h=e;const l=.1*this.estimatedNoteWidth,u=`${this.numberFontSize}px`,c=`${this.smallFontSize}px`,{durationLines:d=0,augmentationDots:g=0,augmentationDash:m=!1}=t;return t.notes.forEach(e=>{const S=`${e.start}-${e.pitch}`,f=(0,r.createSVGGroupChild)(s,S);t.isMeasureBeginning()&&f.setAttribute("data-is-measure-start","true");let p=a,T=p;if(0!==e.accidental){const t=o.ACCIDENTAL_TEXT[e.accidental];(0,r.drawSVGText)(f,t,p+l,0,c,"normal","end","text-top",this.config.noteColor)}let E=0;if(m){const t=this.config.noteHeight*n.AUGMENTATION_DASH_FACTOR,e=t/50,i=(0,r.drawSVGPath)(f,o.augmentationDashPath,p,0,e,1);(0,r.setStroke)(i,this.config.noteColor,n.LINE_STROKE_WIDTH),E=t,T=p+E}else{const t=`${e.jianpuNumber}`;E=(0,r.drawSVGText)(f,t,p,0,u,"normal","start","middle",this.config.noteColor).getBBox().width,T=p+E}if(0!==e.octaveDot&&!1===m){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,i=t/(.15*o.PATH_SCALE),s=p+E/2,a=2.8*t,h=this.config.noteHeight*n.OCTAVE_DOT_OFFSET_FACTOR;for(let t=0;t<Math.abs(e.octaveDot);t++){const n=(e.octaveDot>0?-h:.6*h)-t*a*(e.octaveDot>0?1:-1);(0,r.drawSVGPath)(f,o.dotPath,s,n,i,i)}}if(d>0){const t=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR,i=E/o.PATH_SCALE*(n.DURATION_LINE_SCALES.get(d)??1);for(let s=0;s<d;s++){const a=t+s*e,h=(0,r.drawSVGPath)(f,o.underlinePath,p,a,i,1);(0,r.setStroke)(h,this.config.noteColor,n.LINE_STROKE_WIDTH)}}let A=T+l;if(g>0){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,e=t/(.15*o.PATH_SCALE);for(let i=0;i<g;i++)(0,r.drawSVGPath)(f,o.dotPath,A,0,e,e),A+=t+l;T=A+l}const I=T;if(e.tiedTo&&!m)i.set(e,{g:f,xNoteRight:I,yNoteBaseline:0});else if(e.tiedFrom){let t=e.tiedFrom;for(;t.tiedFrom;)t=t.tiedFrom;const s=i.get(t);if(s){const n=1*s.xNoteRight,a=(m?p-2.2*this.estimatedNoteWidth:p-l)-n,h=1.2*-this.config.noteHeight,u=a/o.PATH_SCALE*1.3,c=this.config.noteHeight/o.PATH_SCALE*1.6;a>1&&(0,r.drawSVGPath)(s.g,o.tiePath,n-(s.g.getCTM()?.e??0),h,u,c);let d=t;for(;d&&d!==e;){i.delete(d);const t=d.tiedTo;t&&(d=t)}}else console.warn("Missing linked SVG details for first tied note:",t)}h=Math.max(h,T)}),h-e}drawRest(t,e,i){const s=`${this.numberFontSize}px`,a=.1*this.estimatedNoteWidth,{durationLines:h=0,augmentationDots:l=0}=t;let u=e,c=u;const d=(0,r.drawSVGText)(i,"0",u,0,s,"normal","start","middle",this.config.noteColor).getBBox().width;if(c=u+d,h>0){const t=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR,s=d/o.PATH_SCALE*(n.DURATION_LINE_SCALES.get(h)??1);for(let a=0;a<h;a++){const h=t+a*e,l=(0,r.drawSVGPath)(i,o.underlinePath,u,h,s,1);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH)}}let g=c+a;if(l>0){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,e=t/(.15*o.PATH_SCALE);for(let s=0;s<l;s++)(0,r.drawSVGPath)(i,o.dotPath,g,0,e,e),g+=t+a;c=g+a}return c-e}drawSignatures(t,e,i,s){let n=e;const o=.3*this.estimatedNoteWidth,a=`${this.smallFontSize}px`,h=`${this.numberFontSize}px`;if(i){const e=`1=${l.PITCH_CLASS_NAMES[this.currentKey%12]??"C"}`;n+=(0,r.drawSVGText)(t,e,n,0,h,"normal","start","middle",this.config.noteColor).getBBox().width+2*o}if(s){const e=`${this.currentTimeSignature.numerator}/${this.currentTimeSignature.denominator}`;n+=(0,r.drawSVGText)(t,e,n,0,a,"normal","start","middle",this.config.noteColor).getBBox().width+o}const u=n-e;try{const e=t.getBBox(),i=e.y,s=e.y+e.height,n=Math.max(this.yBaseline+s,this.yBaseline-i)+.5*this.config.noteHeight;this.height=Math.max(this.height,n)}catch(t){}return t===this.overlayG&&this.config.pixelsPerTimeStep>0&&(this.signaturesBlinking=!0,(0,r.setBlinkAnimation)(this.overlayG,!0)),u}updateCurrentKey(t){const e=this.jianpuModel.measuresInfo.keySignatureAtQ(t,!0);return-1!==e&&e!==this.currentKey&&(this.currentKey=e,!0)}updateCurrentTimeSignature(t){const e=this.jianpuModel.measuresInfo.timeSignatureAtQ(t,!0);return!(!e||e.numerator===this.currentTimeSignature.numerator&&e.denominator===this.currentTimeSignature.denominator)&&(this.currentTimeSignature=e,!0)}handleScrollEvent=t=>{this.lastKnownScrollLeft=this.parentElement.scrollLeft,this.isScrolling||window.requestAnimationFrame(()=>{this.updateOverlaySignaturesForScroll(this.lastKnownScrollLeft),this.isScrolling=!1}),this.isScrolling=!0};scrollIntoViewIfNeeded(t){const e=this.parentElement.getBoundingClientRect().width,i=this.parentElement.scrollLeft;let n=i;if(this.config.scrollType===s.PAGE){const s=20;t<i+s?n=t-s:t>i+e-s&&(n=t-e+s)}else{n=t-.5*e}n=Math.max(0,Math.min(n,this.parentElement.scrollWidth-e)),Math.abs(n-i)>1&&(this.parentElement.scrollTo({left:n,behavior:"smooth"}),this.updateOverlaySignaturesForScroll(n))}updateOverlaySignaturesForScroll(t){const e=this.pixelsToTime(t),i=this.jianpuModel.measuresInfo.keySignatureAtQ(e),s=this.jianpuModel.measuresInfo.timeSignatureAtQ(e)??this.currentTimeSignature;let n=!1;if(i!==this.currentKey&&(this.currentKey=i,n=!0),s.numerator===this.currentTimeSignature.numerator&&s.denominator===this.currentTimeSignature.denominator||(this.currentTimeSignature=s,n=!0),n){for(;this.overlayG.lastChild;)this.overlayG.removeChild(this.overlayG.lastChild);this.drawSignatures(this.overlayG,0,!0,!0),t<10&&this.config.pixelsPerTimeStep>0?((0,r.setBlinkAnimation)(this.overlayG,!0),this.signaturesBlinking=!0):this.config.pixelsPerTimeStep>0&&((0,r.setBlinkAnimation)(this.overlayG,!1),this.signaturesBlinking=!1)}}pixelsToTime(t){return this.config.pixelsPerTimeStep<=0?0:this.jianpuModel.measuresInfo.timeToQuarters(t/this.config.pixelsPerTimeStep,0)}}},775(t,e,i){i.d(e,{MeasuresInfo:()=>r});var s=i(830),n=i(559);class r{measuresInfo;allowDottedRests=!0;constructor(t,e){if(this.measuresInfo=[],!(e>0))return;const i=r.getSortedChanges(t.tempos,s.DEFAULT_TEMPO),n=r.getSortedChanges(t.keySignatures,s.DEFAULT_KEY_SIGNATURE),o=r.getSortedChanges(t.timeSignatures,s.DEFAULT_TIME_SIGNATURE);let a=0,h=0,l=0,u=i[0].event,c=n[0].event,d=o[0].event,g=1,m=(0,s.getMeasureLength)(d),S=d.start;const f=[0];i.forEach(t=>f.push(t.start)),n.forEach(t=>f.push(t.start)),o.forEach(t=>f.push(t.start)),f.sort((t,e)=>t-e);let p=-1;for(let t=0;t<f.length;t++){const r=f[t];if(r>=e)break;if(r===p)continue;p=r;let T=!1,E=!1,A=!1;for(;a<i.length&&i[a].start<=r;)u=i[a++].event,T=!0;for(;h<n.length&&n[h].start<=r;)c=n[h++].event,E=!0;for(;l<o.length&&o[l].start<=r;){g+=(o[l].event.start-S)/m,g=Math.round(1e3*g)/1e3,d=o[l++].event,m=(0,s.getMeasureLength)(d),S=r,A=!0}const I={start:r,measureNumber:g+(r-S)/m,measureLength:m,tempo:u,keySignature:c,timeSignature:d};T&&(I.tempoChange=!0),E&&(I.keyChange=!0),A&&(I.timeChange=!0),this.measuresInfo.push(I)}}static getSortedChanges(t,e){const i=t&&t.length?t.slice():[e];return i.sort((t,e)=>t.start-e.start),i.map(t=>({start:Math.max(0,Math.round(t.start/n.MIN_RESOLUTION)*n.MIN_RESOLUTION),event:t}))}findIndex(t){let e=0,i=this.measuresInfo.length-1,s=0;for(;e<=i;){const n=Math.floor((e+i)/2);this.measuresInfo[n].start<=t?(s=n,e=n+1):i=n-1}return s}measureNumberAtQ(t){if(0===this.measuresInfo.length)return 1;const e=this.findIndex(t),i=this.measuresInfo[e],s=(t-i.start)/i.measureLength;return i.measureNumber+s+1e-9}measureLengthAtQ(t){if(0===this.measuresInfo.length)return(0,s.getMeasureLength)(s.DEFAULT_TIME_SIGNATURE);const e=this.findIndex(t);return this.measuresInfo[e].measureLength}tempoAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TEMPO.qpm;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.tempoChange&&o?r.tempo.qpm:-1}keySignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_KEY_SIGNATURE.key;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.keyChange&&o?r.keySignature.key:-1}timeSignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TIME_SIGNATURE;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.timeChange&&o?r.timeSignature:null}quartersToTime(t,e){const i=this.tempoAtQ(e);return i<=0?0:t/i*60}timeToQuarters(t,e){const i=this.tempoAtQ(e);if(i<=0)return 0;const s=t*i/60;return Math.round(s*n.MAX_QUARTER_DIVISION)/n.MAX_QUARTER_DIVISION}isBeatStart(t){if(0===this.measuresInfo.length)return!1;const e=this.findIndex(t),i=this.measuresInfo[e],s=i.timeSignature,r=(t-(i.start-(i.measureNumber-Math.floor(i.measureNumber))*i.measureLength))/(4/s.denominator);return Math.abs(r-Math.round(r))<n.MIN_RESOLUTION/2}}},559(t,e,i){i.d(e,["MAJOR_SCALE_INTERVALS",0,{0:1,2:2,4:3,5:4,7:5,9:6,11:7},"MAX_QUARTER_DIVISION",0,240,"MIDDLE_C_MIDI",0,60,"MIN_RESOLUTION",0,.0625,"PITCH_CLASS_NAMES",0,["C","C#","D","D#","E","F","F#","G","G#","A","A#","B"]])},240(t,e,i){const s=new Map([[1,1.78],[2,1.6],[3,1.3],[4,1.15]]);i.d(e,["AUGMENTATION_DASH_FACTOR",0,.8,"COMPACT_SPACING_FACTOR",0,1.5,"DOT_SIZE_FACTOR",0,.1,"DURATION_LINE_SCALES",0,s,"FONT_SIZE_MULTIPLIER",0,1.2,"LINE_STROKE_WIDTH",0,1,"OCTAVE_DOT_OFFSET_FACTOR",0,1,"SMALL_FONT_SIZE_MULTIPLIER",0,.75,"UNDERLINE_SPACING_FACTOR",0,.2])},961(t,e,i){i.d(e,["ACCIDENTAL_TEXT",0,["","#","b"],"PATH_SCALE",0,100,"augmentationDashPath",0,"m 0,0 h 50","barPath",0,"m 0,-50 v 100","dotPath",0,"M 0 0 a 15 15 0 1 0 0.0001 0 z","tiePath",0,"M -13,5 C 15,-15 65,-15 90,5 C 65,-25 15,-25 -13,5 Z","underlinePath",0,"m 0,0 h 100"])},134(t,e,i){i.d(e,{createSVGGroupChild:()=>o,drawSVGPath:()=>n,drawSVGText:()=>r,highlightElement:()=>l,resetElementHighlight:()=>u,setBlinkAnimation:()=>a,setStroke:()=>h});const s="http://www.w3.org/2000/svg";function n(t,e,i,n,r,o,a=1){const h=document.createElementNS(s,"path");return h.setAttributeNS(null,"d",e),h.setAttributeNS(null,"transform",`translate(${i}, ${n}) scale(${r}, ${o})`),a<1&&h.setAttributeNS(null,"opacity",`${a}`),t.appendChild(h),h}function r(t,e,i,n,r,o="normal",a="middle",h="middle",l="currentColor",u=1){const c=document.createElementNS(s,"text");c.setAttributeNS(null,"font-family","sans-serif"),c.setAttributeNS(null,"font-size",r),c.setAttributeNS(null,"font-weight",o),c.setAttributeNS(null,"x",`${i}`),c.setAttributeNS(null,"y",`${n}`),c.setAttributeNS(null,"text-anchor",a),c.setAttributeNS(null,"dominant-baseline",h),"currentColor"!==l&&c.setAttributeNS(null,"fill",l),u<1&&c.setAttributeNS(null,"opacity",`${u}`);const d=document.createTextNode(e);return c.appendChild(d),t.appendChild(c),c}function o(t,e){const i=document.createElementNS(s,"g");return e&&i.setAttribute("data-id",e),t.appendChild(i),i}function a(t,e=!0,i="1s"){let n=t.querySelector('animate[attributeName="opacity"]');return e?n?(n.setAttributeNS(null,"repeatCount","indefinite"),n.beginElement()):(n=document.createElementNS(s,"animate"),n.setAttributeNS(null,"attributeName","opacity"),n.setAttributeNS(null,"values","1;0.2;1"),n.setAttributeNS(null,"keyTimes","0;0.5;1"),n.setAttributeNS(null,"dur",i),n.setAttributeNS(null,"repeatCount","indefinite"),t.appendChild(n)):(n&&(n.endElement(),n.setAttributeNS(null,"repeatCount","0"),t.style.opacity="1"),t.style.opacity="1"),t}function h(t,e,i){t.setAttributeNS(null,"stroke",e),t.setAttributeNS(null,"stroke-width",`${i}`)}function l(t,e){const i=[];return t.matches("text, path")&&i.push(t),t.querySelectorAll("text, path").forEach(t=>{i.push(t)}),i.forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e)}),t}function u(t,e){t.querySelectorAll("text, path").forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e)})}i.d(e,["SVGNS",0,s])}};const e={};function i(s){const n=e[s];if(void 0!==n)return n.exports;const r=e[s]={exports:{}};return t[s](r,r.exports,i),r.exports}i.d=(t,e)=>{if(Array.isArray(e))for(var s=0;s<e.length;){var n=e[s++],r=e[s++],o=0===r?{enumerable:!0,value:e[s++]}:{enumerable:!0,get:r};i.o(t,n)||Object.defineProperty(t,n,o)}else for(var n in e)i.o(e,n)&&!i.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},i.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),i.r=t=>{Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};let s={};i.r(s),i.d(s,{DEFAULT_KEY_SIGNATURE:()=>a.DEFAULT_KEY_SIGNATURE,DEFAULT_TEMPO:()=>a.DEFAULT_TEMPO,DEFAULT_TIME_SIGNATURE:()=>a.DEFAULT_TIME_SIGNATURE,JianpuBlock:()=>o.JianpuBlock,JianpuModel:()=>r.JianpuModel,JianpuSVGRender:()=>n.JianpuSVGRender,ScrollType:()=>n.ScrollType,getMeasureLength:()=>a.getMeasureLength,mapMidiToJianpu:()=>r.mapMidiToJianpu,splitJianpuNote:()=>o.splitJianpuNote});var n=i(313),r=i(849),o=i(765),a=i(830);return s})());
|
|
1
|
+
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.index=e():t.index=e()}(self,()=>(()=>{"use strict";var t={765(t,e,i){i.d(e,{JianpuBlock:()=>o,splitJianpuNote:()=>r});var s=i(559);function n(t){return Math.abs(t)<1e-6}function r(t,e){const i=t.start+t.length;if(e<=t.start||e>=i||n(i-e))return null;const s=i-e;t.length=e-t.start;const r={start:e,length:s,pitch:t.pitch,intensity:t.intensity,jianpuNumber:t.jianpuNumber,octaveDot:t.octaveDot,accidental:0,tiedFrom:t};return t.tiedTo&&(r.tiedTo=t.tiedTo,t.tiedTo.tiedFrom=r),t.tiedTo=r,r}class o{start;length;notes;measureNumber;durationLines;augmentationDots;augmentationDash;beatBegin;beatEnd;isTieStart;isTieEnd;constructor(t=0,e=0,i=[],s=1){this.start=t,this.length=e,this.notes=i,this.measureNumber=s}addNote(t){if(0===this.notes.length)return this.start=t.start,this.length=t.length,this.notes.push(t),!0;if(!n(this.start-t.start))return console.warn(`JianpuBlock: Attempted to add note at ${t.start} to block starting at ${this.start}. Ignoring.`),!1;let e=!1,i=!1;for(let s=0;s<this.notes.length;s++)if(this.notes[s].pitch===t.pitch){i=!0,t.length<this.notes[s].length&&(this.notes[s].tiedFrom&&(t.tiedFrom=this.notes[s].tiedFrom,t.tiedFrom&&(t.tiedFrom.tiedTo=t)),this.notes[s].tiedTo&&(t.tiedTo=this.notes[s].tiedTo,t.tiedTo&&(t.tiedTo.tiedFrom=t)),this.notes[s]=t,e=!0);break}i||this.notes.push(t);let s=1/0;for(const t of this.notes)s=Math.min(s,t.length);return this.length=s,!i||e}split(t,e){const i=this.start+this.length;if(t<=this.start||t>=i||n(i-t))return null;const s=i-t,a=t-this.start,h=new o(t,s,[],e.measureNumberAtQ(t)),l=[];for(const e of this.notes){const i=e.start+e.length;if(i>t+1e-6){const i=r(e,t);i?l.push(i):console.warn("Split failed for note, unexpected state.")}else n(i-t)}return l.forEach(t=>h.addNote(t)),this.length=a,delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash,this.beatEnd&&(h.beatEnd=!0,delete this.beatEnd),this.isTieEnd&&(h.isTieStart=!0,delete this.isTieEnd),h}splitToBeat(t){const e=t.timeSignatureAtQ(this.start);if(!e)return null;const i=t.measureLengthAtQ(this.start),s=t.measureNumberAtQ(this.start),r=this.start-(s-Math.floor(s))*i,o=this.start-r,a=4/e.denominator,h=o/a;this.beatBegin=n(h-Math.round(h));const l=r+(Math.floor(h+1e-6)+1)*a,u=r+i,c=this.start+this.length;let d=null;l<c-1e-6&&l>this.start+1e-6&&(d=l),u<c-1e-6&&u>this.start+1e-6&&(null===d||u<d)&&(d=u);let g=null;if(null!==d)g=this.split(d,t),g&&(this.beatEnd=!0);else{const t=(o+this.length)/a;this.beatEnd=n(t-Math.round(t)),this.beatEnd||(this.beatEnd=n(c-u))}return this.isTieStart=this.notes.some(t=>t.tiedFrom),this.isTieEnd=this.notes.some(t=>t.tiedTo),g&&(g.isTieStart=g.notes.some(t=>t.tiedFrom),g.isTieEnd=g.notes.some(t=>t.tiedTo),this.notes.some(t=>t.tiedTo&&t.start+t.length>d)&&delete this.isTieEnd),g}calculateRenderProperties(t){delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash;const e=this.length;if(n(e)||e<0)return;if(t.allowDottedRests||this.notes.length>0){if(n(e-1.5))return void(this.augmentationDots=1);if(n(e-.75))return this.durationLines=1,void(this.augmentationDots=1);if(n(e-.375))return this.durationLines=2,void(this.augmentationDots=1);n(e-3)&&(this.augmentationDots=1)}if(this.durationLines=e>=3.999999||e>=1.999999||e>=.999999?0:e>=.499999?1:e>=.249999?2:e>=.124999?3:4,this.augmentationDash=!1,1===this.notes.length){const e=this.notes[0],i=t.timeSignatureAtQ(this.start);if(!i)return;const s=Math.max(4/i.denominator,1);if(!(this.measureNumber%1<=1e-6)&&e.tiedFrom&&n(e.tiedFrom.length-s)&&e.tiedFrom.pitch===e.pitch&&e.length>=1){let i=!0;if(e.tiedTo){const s=e.start+e.length;i=Math.floor(t.measureNumberAtQ(this.start))===Math.floor(t.measureNumberAtQ(s))&&e.tiedTo.length>=1}i&&(this.augmentationDash=!0)}}}splitToStandardSymbol(t){const e=this.length;if(n(e)||e<s.MIN_RESOLUTION-1e-6)return null;const i=[];t.allowDottedRests||this.notes.length>0?(i.push(6),i.push(4),i.push(3),i.push(2),i.push(1.5),i.push(1),i.push(.75),i.push(.5),i.push(.375),i.push(.25),i.push(.125),i.push(.0625)):(i.push(4),i.push(2),i.push(1),i.push(.5),i.push(.25),i.push(.125),i.push(.0625));let r=0;for(const t of i)if(e>=t-1e-6){r=t;break}n(r)&&(r=s.MIN_RESOLUTION,e<r-1e-6&&e>1e-6&&console.warn(`Block length ${e} is too small, rendering as ${r}`));let o=null;return e>r+1e-6?(o=this.split(this.start+r,t),this.length!==r&&(console.warn(`Adjusting block length after split from ${this.length} to ${r}`),this.length=r)):this.length=r,o}mergeToMap(t){const e=t.get(this.start);e?(this.notes.forEach(t=>e.addNote(t)),0!==this.measureNumber&&(e.measureNumber=this.measureNumber)):t.set(this.start,this)}isMeasureBeginning(){return n(this.measureNumber-Math.floor(this.measureNumber))}}},830(t,e,i){i.d(e,{getMeasureLength:()=>s});function s(t){return t.numerator*(4/t.denominator)}i.d(e,["DEFAULT_KEY_SIGNATURE",0,{start:0,key:0},"DEFAULT_TEMPO",0,{start:0,qpm:60},"DEFAULT_TIME_SIGNATURE",0,{start:0,numerator:4,denominator:4}])},849(t,e,i){i.d(e,{JianpuModel:()=>a,mapMidiToJianpu:()=>h});var s=i(830),n=i(775),r=i(765),o=i(559);class a{jianpuInfo;measuresInfo;jianpuBlockMap;lastQ;constructor(t,e){this.jianpuInfo=t,this.jianpuBlockMap=new Map,this.lastQ=0,this.update(t,e)}isLastMeasureAtQ(t){return t>=this.lastQ-1e-6}getTotalDuration(){return this.lastQ}update(t,e){this.jianpuInfo=t,t.notes.sort((t,e)=>t.start-e.start),this.lastQ=0,t.notes.forEach(t=>{this.lastQ=Math.max(this.lastQ,t.start+t.length)}),this.lastQ+=1e-6,t.tempos=t.tempos&&t.tempos.length?t.tempos:[s.DEFAULT_TEMPO],t.tempos.sort((t,e)=>t.start-e.start),t.tempos[0].start>1e-6&&t.tempos.unshift({...s.DEFAULT_TEMPO,start:0});const i=void 0!==e?{start:0,key:e}:{...s.DEFAULT_KEY_SIGNATURE};t.keySignatures=t.keySignatures&&t.keySignatures.length?t.keySignatures:[i],t.keySignatures.sort((t,e)=>t.start-e.start),t.keySignatures[0].start>1e-6&&t.keySignatures.unshift({...i,start:0}),t.timeSignatures=t.timeSignatures&&t.timeSignatures.length?t.timeSignatures:[s.DEFAULT_TIME_SIGNATURE],t.timeSignatures.sort((t,e)=>t.start-e.start),t.timeSignatures[0].start>1e-6&&t.timeSignatures.unshift({...s.DEFAULT_TIME_SIGNATURE,start:0}),this.measuresInfo=new n.MeasuresInfo(t,this.lastQ),this.infoToBlocks()}infoToBlocks(){const t=new Map;let e=0;if(this.jianpuInfo.notes.forEach(i=>{const s=i.start,n=this.measuresInfo.measureNumberAtQ(s);if(s>e+1e-6){const i=e,n=s-i,o=this.measuresInfo.measureNumberAtQ(i),a=new r.JianpuBlock(i,n,[],o);t.set(i,a)}const o=this.measuresInfo.keySignatureAtQ(s),a=this.createJianpuNote(i,o);let h=t.get(s);h||(h=new r.JianpuBlock(s,0,[],n),t.set(s,h)),h.addNote(a),e=Math.max(e,s+h.length)}),this.lastQ>e+1e-6){const i=e,s=this.lastQ-1e-6-i;if(s>1e-6){const e=this.measuresInfo.measureNumberAtQ(i),n=new r.JianpuBlock(i,s,[],e);t.set(i,n)}}this.jianpuBlockMap=new Map;const i=Array.from(t.keys()).sort((t,e)=>t-e);let s=[];i.forEach(e=>{s.push(t.get(e))});const n=new Set;for(;s.length>0;){let t=s.shift();n.has(t.start)&&this.jianpuBlockMap.has(t.start);let e=t.splitToBeat(this.measuresInfo);if(e){t.mergeToMap(this.jianpuBlockMap),n.add(t.start),s.unshift(e);continue}let i=t,r=null;do{r=i.splitToStandardSymbol(this.measuresInfo),i.mergeToMap(this.jianpuBlockMap),n.add(i.start),r&&(i=r)}while(r)}this.jianpuBlockMap.forEach(t=>{t.calculateRenderProperties(this.measuresInfo)})}createJianpuNote(t,e){const i=h(t.pitch,e);return{...t,jianpuNumber:i.jianpuNumber,octaveDot:i.octaveDot,accidental:i.accidental}}}function h(t,e){const i=e%12;let s=o.MIDDLE_C_MIDI+i;i>o.MIDDLE_C_MIDI%12&&(s-=12);const n=(t-(s+12*Math.round((t-s)/12))+12)%12;let r=o.MAJOR_SCALE_INTERVALS[n],a=0;if(void 0===r){switch(n){case 1:r=o.MAJOR_SCALE_INTERVALS[0],a=1;break;case 3:r=o.MAJOR_SCALE_INTERVALS[4],a=2;break;case 6:r=o.MAJOR_SCALE_INTERVALS[5],a=1;break;case 8:r=o.MAJOR_SCALE_INTERVALS[9],a=2;break;case 10:r=o.MAJOR_SCALE_INTERVALS[11],a=2;break;default:{console.warn(`Unexpected chromatic interval ${n} in mapMidiToJianpu. Defaulting to sharp of lower valid degree.`);const i=(n-1+12)%12,s=(n+1+12)%12,h=o.MAJOR_SCALE_INTERVALS[i],l=o.MAJOR_SCALE_INTERVALS[s];void 0!==h?(r=h,a=1):void 0!==l?(r=l,a=2):(r=1,a=1,console.error(`Could not determine Jianpu number components for MIDI ${t}, interval ${n} from tonic in key ${e}.`));break}}void 0===r&&(console.error(`Jianpu number became undefined for MIDI ${t} (interval ${n}, key ${e}) after chromatic processing. This indicates a logic error or misconfigured MAJOR_SCALE_INTERVALS.`),r=1,a=1)}return{jianpuNumber:r,octaveDot:Math.floor((t-s)/12),accidental:a}}},313(t,e,i){i.d(e,{JianpuSVGRender:()=>u,ScrollType:()=>s});var s,n=i(240),r=i(134),o=i(961),a=i(830),h=i(849),l=i(559);!function(t){t[t.PAGE=0]="PAGE",t[t.NOTE=1]="NOTE",t[t.BAR=2]="BAR"}(s||(s={}));class u{jianpuInfo;jianpuModel;config;height;width;parentElement;div;mainSVG;mainG;musicG;signaturesG;overlaySVG;overlayG;signaturesBlinking;lastKnownScrollLeft;isScrolling;currentKey;currentTimeSignature;playingNotes;lastRenderedQ;estimatedNoteWidth;numberFontSize;smallFontSize;yBaseline;parseColorString(t){return/^[a-z]+$/i.test(t)||t.startsWith("rgb(")?t:/^\d+,\s*\d+,\s*\d+$/.test(t)?`rgb(${t})`:t}constructor(t,e,i){this.jianpuInfo=t,this.div=i;this.config={noteHeight:e.noteHeight??20,noteSpacingFactor:e.noteSpacingFactor??n.COMPACT_SPACING_FACTOR,pixelsPerTimeStep:e.pixelsPerTimeStep??0,noteColor:this.parseColorString(e.noteColor??"black"),activeNoteColor:this.parseColorString(e.activeNoteColor??"red"),defaultKey:e.defaultKey??0,scrollType:e.scrollType??s.PAGE,fontFamily:e.fontFamily??"sans-serif",width:e.width??0,height:e.height??0},this.jianpuModel=new h.JianpuModel(this.jianpuInfo,this.config.defaultKey),this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??a.DEFAULT_TIME_SIGNATURE,this.playingNotes=new Map,this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.numberFontSize=this.config.noteHeight*n.FONT_SIZE_MULTIPLIER,this.smallFontSize=this.config.noteHeight*n.SMALL_FONT_SIZE_MULTIPLIER,this.estimatedNoteWidth=.6*this.numberFontSize,this.yBaseline=1.5*this.config.noteHeight,this.height=0,this.width=0,this.clear(),this.redraw()}clear(){for(;this.div.lastChild;)this.div.removeChild(this.div.lastChild);this.div.style.position="relative",this.div.style.overflow="hidden",this.overlaySVG=document.createElementNS(r.SVGNS,"svg"),this.overlaySVG.style.position="absolute",this.overlaySVG.style.left="0",this.overlaySVG.style.top="0",this.overlaySVG.style.pointerEvents="none",this.div.appendChild(this.overlaySVG),this.overlayG=(0,r.createSVGGroupChild)(this.overlaySVG,"overlay"),this.parentElement=document.createElement("div"),this.parentElement.style.overflowX="auto",this.parentElement.style.overflowY="hidden",this.parentElement.style.width="100%",this.parentElement.style.height="100%",this.div.appendChild(this.parentElement),this.parentElement.addEventListener("scroll",this.handleScrollEvent),this.mainSVG=document.createElementNS(r.SVGNS,"svg"),this.mainSVG.style.display="block",this.parentElement.appendChild(this.mainSVG),this.mainG=(0,r.createSVGGroupChild)(this.mainSVG,"main-content"),this.signaturesG=(0,r.createSVGGroupChild)(this.mainG,"signatures"),this.musicG=(0,r.createSVGGroupChild)(this.mainG,"music"),this.playingNotes.clear(),this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.height=this.config.height>0?this.config.height:5*this.config.noteHeight,this.width=this.config.width>0?this.config.width:0,this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??a.DEFAULT_TIME_SIGNATURE,this.drawSignatures(this.overlayG,0,!0,!0),this.updateLayout()}updateLayout(t){this.width=t??this.width,this.config.width>0&&(this.width=this.config.width),this.height=Math.max(this.height,6*this.config.noteHeight),this.config.height>0&&(this.height=this.config.height);const e=1.65*this.config.noteHeight;this.mainSVG.setAttribute("width",`${this.width}`),this.mainSVG.setAttribute("height",`${this.height}`),this.mainG.setAttribute("transform",`translate(0, ${this.yBaseline+e})`),this.overlaySVG.setAttribute("width","200"),this.overlaySVG.setAttribute("height",`${this.height}`),this.overlayG.setAttribute("transform",`translate(0, ${this.yBaseline})`)}redraw(t,e){let i=-1;const n=this.config.pixelsPerTimeStep<=0;if(t){const o=`${t.start}-${t.pitch}`;if(this.playingNotes.forEach((t,e)=>{if(e!==o){const t=this.mainSVG.querySelector(`g[data-id="${e}"]`);t&&(0,r.resetElementHighlight)(t,this.config.noteColor),this.playingNotes.delete(e)}}),!this.playingNotes.has(o)){const n=this.mainSVG.querySelector(`g[data-id="${o}"]`);if(n){(0,r.highlightElement)(n,this.config.activeNoteColor),this.playingNotes.set(o,t);const a=n.getBoundingClientRect(),h=this.mainSVG.getBoundingClientRect();i=a.left-h.left+this.parentElement.scrollLeft;const l=n.hasAttribute("data-is-measure-start");e&&(this.config.scrollType!==s.BAR||l)&&this.scrollIntoViewIfNeeded(i)}}if(!n&&this.signaturesBlinking){const e=this.overlayG.getBoundingClientRect().width;this.jianpuModel.measuresInfo.quartersToTime(t.start,t.start)*this.config.pixelsPerTimeStep>e&&(this.signaturesBlinking=!1,(0,r.setBlinkAnimation)(this.overlayG,!1))}}else{this.jianpuModel.update(this.jianpuInfo,this.config.defaultKey);let t=this.width,e=this.width,i=this.height>0?this.height-this.yBaseline:3*this.config.noteHeight,s=0;const r=new Map;this.jianpuModel.jianpuBlockMap.forEach((o,a)=>{if(a>=this.lastRenderedQ-1e-9){t=n?e:this.jianpuModel.measuresInfo.quartersToTime(a,a)*this.config.pixelsPerTimeStep;const h=this.drawJianpuBlock(o,t,r);n?e+=h:e=Math.max(e,t+h);const l=this.mainSVG.querySelector(`g[data-block-start="${o.start}"]`);if(l)try{const t=l.getBBox(),e=t.y,n=t.y+t.height;s=Math.min(s,e),i=Math.max(i,n)}catch(t){}this.lastRenderedQ=a+o.length}}),this.height=Math.max(this.height,i-s+this.config.noteHeight),this.updateLayout(e)}return i}drawJianpuBlock(t,e,i){let s=0;const a=this.config.pixelsPerTimeStep<=0,h=t.isMeasureBeginning(),l=(0,r.createSVGGroupChild)(this.musicG,`block-${t.start}`);if(l.setAttribute("data-block-start",`${t.start}`),h&&t.start>1e-6){const t=e-(a?.6*this.estimatedNoteWidth:4),i=2*this.config.noteHeight,h=0,l=(0,r.drawSVGPath)(this.musicG,o.barPath,t,h,1,i/o.PATH_SCALE);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH),a&&(s+=n.LINE_STROKE_WIDTH)}const u=this.updateCurrentKey(t.start),c=this.updateCurrentTimeSignature(t.start);let d=0;if((u||c)&&t.start>1e-6){const t=e+s;d=this.drawSignatures(this.signaturesG,t,u,c),a&&(s+=d+.2*this.estimatedNoteWidth)}const g=e+s;let m=0;if(t.notes.length>0?m=this.drawNotes(t,g,i,l):t.length>1e-6&&(m=this.drawRest(t,g,l)),a){s+=m;let e=this.estimatedNoteWidth*this.config.noteSpacingFactor;t.beatEnd?e*=1:t.length<.0625?e*=.05:t.length<.125?e*=.1:t.length<.25?e*=.2:t.length<.5?e*=.4:t.length<1&&(e*=.5),s+=e}else s=Math.max(d,m);if(this.jianpuModel.isLastMeasureAtQ(t.start+t.length)){const t=e+s,i=2*this.config.noteHeight,h=0,l=(0,r.drawSVGPath)(this.musicG,o.barPath,t,h,1,i/o.PATH_SCALE);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH),a&&(s+=n.LINE_STROKE_WIDTH)}return s}drawNotes(t,e,i,s){let a=e,h=e;const l=.1*this.estimatedNoteWidth,u=`${this.numberFontSize}px`,c=`${this.smallFontSize}px`,{durationLines:d=0,augmentationDots:g=0,augmentationDash:m=!1}=t;return t.notes.forEach(e=>{const f=`${e.start}-${e.pitch}`,S=(0,r.createSVGGroupChild)(s,f);t.isMeasureBeginning()&&S.setAttribute("data-is-measure-start","true");let p=a,T=p;if(0!==e.accidental){const t=o.ACCIDENTAL_TEXT[e.accidental];(0,r.drawSVGText)(S,t,p+l,0,c,"normal","end","text-top",this.config.noteColor,1,this.config.fontFamily)}let A=0;if(m){const t=this.config.noteHeight*n.AUGMENTATION_DASH_FACTOR,e=t/50,i=(0,r.drawSVGPath)(S,o.augmentationDashPath,p,0,e,1);(0,r.setStroke)(i,this.config.noteColor,n.LINE_STROKE_WIDTH),A=t,T=p+A}else{const t=`${e.jianpuNumber}`;A=(0,r.drawSVGText)(S,t,p,0,u,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width,T=p+A}if(0!==e.octaveDot&&!1===m){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,i=t/(.15*o.PATH_SCALE),s=p+A/2,a=2.8*t,h=this.config.noteHeight*n.OCTAVE_DOT_OFFSET_FACTOR;for(let t=0;t<Math.abs(e.octaveDot);t++){const n=(e.octaveDot>0?-h:.6*h)-t*a*(e.octaveDot>0?1:-1);(0,r.drawSVGPath)(S,o.dotPath,s,n,i,i)}}if(d>0){const t=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR,i=A/o.PATH_SCALE*(n.DURATION_LINE_SCALES.get(d)??1);for(let s=0;s<d;s++){const a=t+s*e,h=(0,r.drawSVGPath)(S,o.underlinePath,p,a,i,1);(0,r.setStroke)(h,this.config.noteColor,n.LINE_STROKE_WIDTH)}}let E=T+l;if(g>0){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,e=t/(.15*o.PATH_SCALE);for(let i=0;i<g;i++)(0,r.drawSVGPath)(S,o.dotPath,E,0,e,e),E+=t+l;T=E+l}const I=T;if(e.tiedTo&&!m)i.set(e,{g:S,xNoteRight:I,yNoteBaseline:0});else if(e.tiedFrom){let t=e.tiedFrom;for(;t.tiedFrom;)t=t.tiedFrom;const s=i.get(t);if(s){const n=1*s.xNoteRight,a=(m?p-2.2*this.estimatedNoteWidth:p-l)-n,h=1.2*-this.config.noteHeight,u=a/o.PATH_SCALE*1.3,c=this.config.noteHeight/o.PATH_SCALE*1.6;a>1&&(0,r.drawSVGPath)(s.g,o.tiePath,n-(s.g.getCTM()?.e??0),h,u,c);let d=t;for(;d&&d!==e;){i.delete(d);const t=d.tiedTo;t&&(d=t)}}else console.warn("Missing linked SVG details for first tied note:",t)}h=Math.max(h,T)}),h-e}drawRest(t,e,i){const s=`${this.numberFontSize}px`,a=.1*this.estimatedNoteWidth,{durationLines:h=0,augmentationDots:l=0}=t;let u=e,c=u;const d=(0,r.drawSVGText)(i,"0",u,0,s,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width;if(c=u+d,h>0){const t=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR,s=d/o.PATH_SCALE*(n.DURATION_LINE_SCALES.get(h)??1);for(let a=0;a<h;a++){const h=t+a*e,l=(0,r.drawSVGPath)(i,o.underlinePath,u,h,s,1);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH)}}let g=c+a;if(l>0){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,e=t/(.15*o.PATH_SCALE);for(let s=0;s<l;s++)(0,r.drawSVGPath)(i,o.dotPath,g,0,e,e),g+=t+a;c=g+a}return c-e}drawSignatures(t,e,i,s){let n=e;const o=.3*this.estimatedNoteWidth,a=`${this.smallFontSize}px`,h=`${this.numberFontSize}px`;if(i){const e=`1=${l.PITCH_CLASS_NAMES[this.currentKey%12]??"C"}`;n+=(0,r.drawSVGText)(t,e,n,0,h,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width+2*o}if(s){const e=`${this.currentTimeSignature.numerator}/${this.currentTimeSignature.denominator}`;n+=(0,r.drawSVGText)(t,e,n,0,a,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width+o}const u=n-e;try{const e=t.getBBox(),i=e.y,s=e.y+e.height,n=Math.max(this.yBaseline+s,this.yBaseline-i)+.5*this.config.noteHeight;this.height=Math.max(this.height,n)}catch(t){}return t===this.overlayG&&this.config.pixelsPerTimeStep>0&&(this.signaturesBlinking=!0,(0,r.setBlinkAnimation)(this.overlayG,!0)),u}updateCurrentKey(t){const e=this.jianpuModel.measuresInfo.keySignatureAtQ(t,!0);return-1!==e&&e!==this.currentKey&&(this.currentKey=e,!0)}updateCurrentTimeSignature(t){const e=this.jianpuModel.measuresInfo.timeSignatureAtQ(t,!0);return!(!e||e.numerator===this.currentTimeSignature.numerator&&e.denominator===this.currentTimeSignature.denominator)&&(this.currentTimeSignature=e,!0)}handleScrollEvent=t=>{this.lastKnownScrollLeft=this.parentElement.scrollLeft,this.isScrolling||window.requestAnimationFrame(()=>{this.updateOverlaySignaturesForScroll(this.lastKnownScrollLeft),this.isScrolling=!1}),this.isScrolling=!0};scrollIntoViewIfNeeded(t){const e=this.parentElement.getBoundingClientRect().width,i=this.parentElement.scrollLeft;let n=i;if(this.config.scrollType===s.PAGE){const s=20;t<i+s?n=t-s:t>i+e-s&&(n=t-e+s)}else{n=t-.5*e}n=Math.max(0,Math.min(n,this.parentElement.scrollWidth-e)),Math.abs(n-i)>1&&(this.parentElement.scrollTo({left:n,behavior:"smooth"}),this.updateOverlaySignaturesForScroll(n))}updateOverlaySignaturesForScroll(t){const e=this.pixelsToTime(t),i=this.jianpuModel.measuresInfo.keySignatureAtQ(e),s=this.jianpuModel.measuresInfo.timeSignatureAtQ(e)??this.currentTimeSignature;let n=!1;if(i!==this.currentKey&&(this.currentKey=i,n=!0),s.numerator===this.currentTimeSignature.numerator&&s.denominator===this.currentTimeSignature.denominator||(this.currentTimeSignature=s,n=!0),n){for(;this.overlayG.lastChild;)this.overlayG.removeChild(this.overlayG.lastChild);this.drawSignatures(this.overlayG,0,!0,!0),t<10&&this.config.pixelsPerTimeStep>0?((0,r.setBlinkAnimation)(this.overlayG,!0),this.signaturesBlinking=!0):this.config.pixelsPerTimeStep>0&&((0,r.setBlinkAnimation)(this.overlayG,!1),this.signaturesBlinking=!1)}}pixelsToTime(t){return this.config.pixelsPerTimeStep<=0?0:this.jianpuModel.measuresInfo.timeToQuarters(t/this.config.pixelsPerTimeStep,0)}}},775(t,e,i){i.d(e,{MeasuresInfo:()=>r});var s=i(830),n=i(559);class r{measuresInfo;allowDottedRests=!0;constructor(t,e){if(this.measuresInfo=[],!(e>0))return;const i=r.getSortedChanges(t.tempos,s.DEFAULT_TEMPO),n=r.getSortedChanges(t.keySignatures,s.DEFAULT_KEY_SIGNATURE),o=r.getSortedChanges(t.timeSignatures,s.DEFAULT_TIME_SIGNATURE);let a=0,h=0,l=0,u=i[0].event,c=n[0].event,d=o[0].event,g=1,m=(0,s.getMeasureLength)(d),f=d.start;const S=[0];i.forEach(t=>S.push(t.start)),n.forEach(t=>S.push(t.start)),o.forEach(t=>S.push(t.start)),S.sort((t,e)=>t-e);let p=-1;for(let t=0;t<S.length;t++){const r=S[t];if(r>=e)break;if(r===p)continue;p=r;let T=!1,A=!1,E=!1;for(;a<i.length&&i[a].start<=r;)u=i[a++].event,T=!0;for(;h<n.length&&n[h].start<=r;)c=n[h++].event,A=!0;for(;l<o.length&&o[l].start<=r;){g+=(o[l].event.start-f)/m,g=Math.round(1e3*g)/1e3,d=o[l++].event,m=(0,s.getMeasureLength)(d),f=r,E=!0}const I={start:r,measureNumber:g+(r-f)/m,measureLength:m,tempo:u,keySignature:c,timeSignature:d};T&&(I.tempoChange=!0),A&&(I.keyChange=!0),E&&(I.timeChange=!0),this.measuresInfo.push(I)}}static getSortedChanges(t,e){const i=t&&t.length?t.slice():[e];return i.sort((t,e)=>t.start-e.start),i.map(t=>({start:Math.max(0,Math.round(t.start/n.MIN_RESOLUTION)*n.MIN_RESOLUTION),event:t}))}findIndex(t){let e=0,i=this.measuresInfo.length-1,s=0;for(;e<=i;){const n=Math.floor((e+i)/2);this.measuresInfo[n].start<=t?(s=n,e=n+1):i=n-1}return s}measureNumberAtQ(t){if(0===this.measuresInfo.length)return 1;const e=this.findIndex(t),i=this.measuresInfo[e],s=(t-i.start)/i.measureLength;return i.measureNumber+s+1e-9}measureLengthAtQ(t){if(0===this.measuresInfo.length)return(0,s.getMeasureLength)(s.DEFAULT_TIME_SIGNATURE);const e=this.findIndex(t);return this.measuresInfo[e].measureLength}tempoAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TEMPO.qpm;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.tempoChange&&o?r.tempo.qpm:-1}keySignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_KEY_SIGNATURE.key;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.keyChange&&o?r.keySignature.key:-1}timeSignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TIME_SIGNATURE;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.timeChange&&o?r.timeSignature:null}quartersToTime(t,e){const i=this.tempoAtQ(e);return i<=0?0:t/i*60}timeToQuarters(t,e){const i=this.tempoAtQ(e);if(i<=0)return 0;const s=t*i/60;return Math.round(s*n.MAX_QUARTER_DIVISION)/n.MAX_QUARTER_DIVISION}isBeatStart(t){if(0===this.measuresInfo.length)return!1;const e=this.findIndex(t),i=this.measuresInfo[e],s=i.timeSignature,r=(t-(i.start-(i.measureNumber-Math.floor(i.measureNumber))*i.measureLength))/(4/s.denominator);return Math.abs(r-Math.round(r))<n.MIN_RESOLUTION/2}}},559(t,e,i){i.d(e,["MAJOR_SCALE_INTERVALS",0,{0:1,2:2,4:3,5:4,7:5,9:6,11:7},"MAX_QUARTER_DIVISION",0,240,"MIDDLE_C_MIDI",0,60,"MIN_RESOLUTION",0,.0625,"PITCH_CLASS_NAMES",0,["C","C#","D","D#","E","F","F#","G","G#","A","A#","B"]])},240(t,e,i){const s=new Map([[1,1.78],[2,1.6],[3,1.3],[4,1.15]]);i.d(e,["AUGMENTATION_DASH_FACTOR",0,.8,"COMPACT_SPACING_FACTOR",0,1.5,"DOT_SIZE_FACTOR",0,.1,"DURATION_LINE_SCALES",0,s,"FONT_SIZE_MULTIPLIER",0,1.2,"LINE_STROKE_WIDTH",0,1,"OCTAVE_DOT_OFFSET_FACTOR",0,1,"SMALL_FONT_SIZE_MULTIPLIER",0,.75,"UNDERLINE_SPACING_FACTOR",0,.2])},961(t,e,i){i.d(e,["ACCIDENTAL_TEXT",0,["","#","b"],"PATH_SCALE",0,100,"augmentationDashPath",0,"m 0,0 h 50","barPath",0,"m 0,-50 v 100","dotPath",0,"M 0 0 a 15 15 0 1 0 0.0001 0 z","tiePath",0,"M -13,5 C 15,-15 65,-15 90,5 C 65,-25 15,-25 -13,5 Z","underlinePath",0,"m 0,0 h 100"])},134(t,e,i){i.d(e,{createSVGGroupChild:()=>o,drawSVGPath:()=>n,drawSVGText:()=>r,highlightElement:()=>l,resetElementHighlight:()=>u,setBlinkAnimation:()=>a,setStroke:()=>h});const s="http://www.w3.org/2000/svg";function n(t,e,i,n,r,o,a=1){const h=document.createElementNS(s,"path");return h.setAttributeNS(null,"d",e),h.setAttributeNS(null,"transform",`translate(${i}, ${n}) scale(${r}, ${o})`),a<1&&h.setAttributeNS(null,"opacity",`${a}`),t.appendChild(h),h}function r(t,e,i,n,r,o="normal",a="middle",h="middle",l="currentColor",u=1,c="sans-serif"){const d=document.createElementNS(s,"text");d.setAttributeNS(null,"font-family",c),d.setAttributeNS(null,"font-size",r),d.setAttributeNS(null,"font-weight",o),d.setAttributeNS(null,"x",`${i}`),d.setAttributeNS(null,"y",`${n}`),d.setAttributeNS(null,"text-anchor",a),d.setAttributeNS(null,"dominant-baseline",h),"currentColor"!==l&&d.setAttributeNS(null,"fill",l),u<1&&d.setAttributeNS(null,"opacity",`${u}`);const g=document.createTextNode(e);return d.appendChild(g),t.appendChild(d),d}function o(t,e){const i=document.createElementNS(s,"g");return e&&i.setAttribute("data-id",e),t.appendChild(i),i}function a(t,e=!0,i="1s"){let n=t.querySelector('animate[attributeName="opacity"]');return e?n?(n.setAttributeNS(null,"repeatCount","indefinite"),n.beginElement()):(n=document.createElementNS(s,"animate"),n.setAttributeNS(null,"attributeName","opacity"),n.setAttributeNS(null,"values","1;0.2;1"),n.setAttributeNS(null,"keyTimes","0;0.5;1"),n.setAttributeNS(null,"dur",i),n.setAttributeNS(null,"repeatCount","indefinite"),t.appendChild(n)):(n&&(n.endElement(),n.setAttributeNS(null,"repeatCount","0"),t.style.opacity="1"),t.style.opacity="1"),t}function h(t,e,i){t.setAttributeNS(null,"stroke",e),t.setAttributeNS(null,"stroke-width",`${i}`)}function l(t,e){const i=[];return t.matches("text, path")&&i.push(t),t.querySelectorAll("text, path").forEach(t=>{i.push(t)}),i.forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e);const i=t.getAttribute("stroke");null!==i&&"none"!==i&&t.setAttribute("stroke",e)}),t}function u(t,e){t.querySelectorAll("text, path").forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e);const i=t.getAttribute("stroke");null!==i&&"none"!==i&&t.setAttribute("stroke",e)})}i.d(e,["SVGNS",0,s])}};const e={};function i(s){const n=e[s];if(void 0!==n)return n.exports;const r=e[s]={exports:{}};return t[s](r,r.exports,i),r.exports}i.d=(t,e)=>{if(Array.isArray(e))for(var s=0;s<e.length;){var n=e[s++],r=e[s++],o=0===r?{enumerable:!0,value:e[s++]}:{enumerable:!0,get:r};i.o(t,n)||Object.defineProperty(t,n,o)}else for(var n in e)i.o(e,n)&&!i.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},i.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),i.r=t=>{Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};let s={};i.r(s),i.d(s,{DEFAULT_KEY_SIGNATURE:()=>a.DEFAULT_KEY_SIGNATURE,DEFAULT_TEMPO:()=>a.DEFAULT_TEMPO,DEFAULT_TIME_SIGNATURE:()=>a.DEFAULT_TIME_SIGNATURE,JianpuBlock:()=>o.JianpuBlock,JianpuModel:()=>r.JianpuModel,JianpuSVGRender:()=>n.JianpuSVGRender,ScrollType:()=>n.ScrollType,getMeasureLength:()=>a.getMeasureLength,mapMidiToJianpu:()=>r.mapMidiToJianpu,splitJianpuNote:()=>o.splitJianpuNote});var n=i(313),r=i(849),o=i(765),a=i(830);return s})());
|
package/es6/jianpu_svg_render.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.jianpu_svg_render=e():t.jianpu_svg_render=e()}(self,()=>(()=>{"use strict";var t={765(t,e,i){i.d(e,{JianpuBlock:()=>o});var s=i(559);function n(t){return Math.abs(t)<1e-6}function r(t,e){const i=t.start+t.length;if(e<=t.start||e>=i||n(i-e))return null;const s=i-e;t.length=e-t.start;const r={start:e,length:s,pitch:t.pitch,intensity:t.intensity,jianpuNumber:t.jianpuNumber,octaveDot:t.octaveDot,accidental:0,tiedFrom:t};return t.tiedTo&&(r.tiedTo=t.tiedTo,t.tiedTo.tiedFrom=r),t.tiedTo=r,r}class o{start;length;notes;measureNumber;durationLines;augmentationDots;augmentationDash;beatBegin;beatEnd;isTieStart;isTieEnd;constructor(t=0,e=0,i=[],s=1){this.start=t,this.length=e,this.notes=i,this.measureNumber=s}addNote(t){if(0===this.notes.length)return this.start=t.start,this.length=t.length,this.notes.push(t),!0;if(!n(this.start-t.start))return console.warn(`JianpuBlock: Attempted to add note at ${t.start} to block starting at ${this.start}. Ignoring.`),!1;let e=!1,i=!1;for(let s=0;s<this.notes.length;s++)if(this.notes[s].pitch===t.pitch){i=!0,t.length<this.notes[s].length&&(this.notes[s].tiedFrom&&(t.tiedFrom=this.notes[s].tiedFrom,t.tiedFrom&&(t.tiedFrom.tiedTo=t)),this.notes[s].tiedTo&&(t.tiedTo=this.notes[s].tiedTo,t.tiedTo&&(t.tiedTo.tiedFrom=t)),this.notes[s]=t,e=!0);break}i||this.notes.push(t);let s=1/0;for(const t of this.notes)s=Math.min(s,t.length);return this.length=s,!i||e}split(t,e){const i=this.start+this.length;if(t<=this.start||t>=i||n(i-t))return null;const s=i-t,a=t-this.start,h=new o(t,s,[],e.measureNumberAtQ(t)),l=[];for(const e of this.notes){const i=e.start+e.length;if(i>t+1e-6){const i=r(e,t);i?l.push(i):console.warn("Split failed for note, unexpected state.")}else n(i-t)}return l.forEach(t=>h.addNote(t)),this.length=a,delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash,this.beatEnd&&(h.beatEnd=!0,delete this.beatEnd),this.isTieEnd&&(h.isTieStart=!0,delete this.isTieEnd),h}splitToBeat(t){const e=t.timeSignatureAtQ(this.start);if(!e)return null;const i=t.measureLengthAtQ(this.start),s=t.measureNumberAtQ(this.start),r=this.start-(s-Math.floor(s))*i,o=this.start-r,a=4/e.denominator,h=o/a;this.beatBegin=n(h-Math.round(h));const l=r+(Math.floor(h+1e-6)+1)*a,u=r+i,c=this.start+this.length;let d=null;l<c-1e-6&&l>this.start+1e-6&&(d=l),u<c-1e-6&&u>this.start+1e-6&&(null===d||u<d)&&(d=u);let g=null;if(null!==d)g=this.split(d,t),g&&(this.beatEnd=!0);else{const t=(o+this.length)/a;this.beatEnd=n(t-Math.round(t)),this.beatEnd||(this.beatEnd=n(c-u))}return this.isTieStart=this.notes.some(t=>t.tiedFrom),this.isTieEnd=this.notes.some(t=>t.tiedTo),g&&(g.isTieStart=g.notes.some(t=>t.tiedFrom),g.isTieEnd=g.notes.some(t=>t.tiedTo),this.notes.some(t=>t.tiedTo&&t.start+t.length>d)&&delete this.isTieEnd),g}calculateRenderProperties(t){delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash;const e=this.length;if(n(e)||e<0)return;if(t.allowDottedRests||this.notes.length>0){if(n(e-1.5))return void(this.augmentationDots=1);if(n(e-.75))return this.durationLines=1,void(this.augmentationDots=1);if(n(e-.375))return this.durationLines=2,void(this.augmentationDots=1);n(e-3)&&(this.augmentationDots=1)}if(this.durationLines=e>=3.999999||e>=1.999999||e>=.999999?0:e>=.499999?1:e>=.249999?2:e>=.124999?3:4,this.augmentationDash=!1,1===this.notes.length){const e=this.notes[0],i=t.timeSignatureAtQ(this.start);if(!i)return;const s=Math.max(4/i.denominator,1);if(!(this.measureNumber%1<=1e-6)&&e.tiedFrom&&n(e.tiedFrom.length-s)&&e.tiedFrom.pitch===e.pitch&&e.length>=1){let i=!0;if(e.tiedTo){const s=e.start+e.length;i=Math.floor(t.measureNumberAtQ(this.start))===Math.floor(t.measureNumberAtQ(s))&&e.tiedTo.length>=1}i&&(this.augmentationDash=!0)}}}splitToStandardSymbol(t){const e=this.length;if(n(e)||e<s.MIN_RESOLUTION-1e-6)return null;const i=[];t.allowDottedRests||this.notes.length>0?(i.push(6),i.push(4),i.push(3),i.push(2),i.push(1.5),i.push(1),i.push(.75),i.push(.5),i.push(.375),i.push(.25),i.push(.125),i.push(.0625)):(i.push(4),i.push(2),i.push(1),i.push(.5),i.push(.25),i.push(.125),i.push(.0625));let r=0;for(const t of i)if(e>=t-1e-6){r=t;break}n(r)&&(r=s.MIN_RESOLUTION,e<r-1e-6&&e>1e-6&&console.warn(`Block length ${e} is too small, rendering as ${r}`));let o=null;return e>r+1e-6?(o=this.split(this.start+r,t),this.length!==r&&(console.warn(`Adjusting block length after split from ${this.length} to ${r}`),this.length=r)):this.length=r,o}mergeToMap(t){const e=t.get(this.start);e?(this.notes.forEach(t=>e.addNote(t)),0!==this.measureNumber&&(e.measureNumber=this.measureNumber)):t.set(this.start,this)}isMeasureBeginning(){return n(this.measureNumber-Math.floor(this.measureNumber))}}},830(t,e,i){i.d(e,{getMeasureLength:()=>s});function s(t){return t.numerator*(4/t.denominator)}i.d(e,["DEFAULT_KEY_SIGNATURE",0,{start:0,key:0},"DEFAULT_TEMPO",0,{start:0,qpm:60},"DEFAULT_TIME_SIGNATURE",0,{start:0,numerator:4,denominator:4}])},849(t,e,i){i.d(e,{JianpuModel:()=>a});var s=i(830),n=i(775),r=i(765),o=i(559);class a{jianpuInfo;measuresInfo;jianpuBlockMap;lastQ;constructor(t,e){this.jianpuInfo=t,this.jianpuBlockMap=new Map,this.lastQ=0,this.update(t,e)}isLastMeasureAtQ(t){return t>=this.lastQ-1e-6}getTotalDuration(){return this.lastQ}update(t,e){this.jianpuInfo=t,t.notes.sort((t,e)=>t.start-e.start),this.lastQ=0,t.notes.forEach(t=>{this.lastQ=Math.max(this.lastQ,t.start+t.length)}),this.lastQ+=1e-6,t.tempos=t.tempos&&t.tempos.length?t.tempos:[s.DEFAULT_TEMPO],t.tempos.sort((t,e)=>t.start-e.start),t.tempos[0].start>1e-6&&t.tempos.unshift({...s.DEFAULT_TEMPO,start:0});const i=void 0!==e?{start:0,key:e}:{...s.DEFAULT_KEY_SIGNATURE};t.keySignatures=t.keySignatures&&t.keySignatures.length?t.keySignatures:[i],t.keySignatures.sort((t,e)=>t.start-e.start),t.keySignatures[0].start>1e-6&&t.keySignatures.unshift({...i,start:0}),t.timeSignatures=t.timeSignatures&&t.timeSignatures.length?t.timeSignatures:[s.DEFAULT_TIME_SIGNATURE],t.timeSignatures.sort((t,e)=>t.start-e.start),t.timeSignatures[0].start>1e-6&&t.timeSignatures.unshift({...s.DEFAULT_TIME_SIGNATURE,start:0}),this.measuresInfo=new n.MeasuresInfo(t,this.lastQ),this.infoToBlocks()}infoToBlocks(){const t=new Map;let e=0;if(this.jianpuInfo.notes.forEach(i=>{const s=i.start,n=this.measuresInfo.measureNumberAtQ(s);if(s>e+1e-6){const i=e,n=s-i,o=this.measuresInfo.measureNumberAtQ(i),a=new r.JianpuBlock(i,n,[],o);t.set(i,a)}const o=this.measuresInfo.keySignatureAtQ(s),a=this.createJianpuNote(i,o);let h=t.get(s);h||(h=new r.JianpuBlock(s,0,[],n),t.set(s,h)),h.addNote(a),e=Math.max(e,s+h.length)}),this.lastQ>e+1e-6){const i=e,s=this.lastQ-1e-6-i;if(s>1e-6){const e=this.measuresInfo.measureNumberAtQ(i),n=new r.JianpuBlock(i,s,[],e);t.set(i,n)}}this.jianpuBlockMap=new Map;const i=Array.from(t.keys()).sort((t,e)=>t-e);let s=[];i.forEach(e=>{s.push(t.get(e))});const n=new Set;for(;s.length>0;){let t=s.shift();n.has(t.start)&&this.jianpuBlockMap.has(t.start);let e=t.splitToBeat(this.measuresInfo);if(e){t.mergeToMap(this.jianpuBlockMap),n.add(t.start),s.unshift(e);continue}let i=t,r=null;do{r=i.splitToStandardSymbol(this.measuresInfo),i.mergeToMap(this.jianpuBlockMap),n.add(i.start),r&&(i=r)}while(r)}this.jianpuBlockMap.forEach(t=>{t.calculateRenderProperties(this.measuresInfo)})}createJianpuNote(t,e){const i=function(t,e){const i=e%12;let s=o.MIDDLE_C_MIDI+i;i>o.MIDDLE_C_MIDI%12&&(s-=12);const n=Math.round((t-s)/12),r=(t-(s+12*n)+12)%12;let a=o.MAJOR_SCALE_INTERVALS[r],h=0;if(void 0===a){switch(r){case 1:a=o.MAJOR_SCALE_INTERVALS[0],h=1;break;case 3:a=o.MAJOR_SCALE_INTERVALS[4],h=2;break;case 6:a=o.MAJOR_SCALE_INTERVALS[5],h=1;break;case 8:a=o.MAJOR_SCALE_INTERVALS[9],h=2;break;case 10:a=o.MAJOR_SCALE_INTERVALS[11],h=2;break;default:{console.warn(`Unexpected chromatic interval ${r} in mapMidiToJianpu. Defaulting to sharp of lower valid degree.`);const i=(r-1+12)%12,s=(r+1+12)%12,n=o.MAJOR_SCALE_INTERVALS[i],l=o.MAJOR_SCALE_INTERVALS[s];void 0!==n?(a=n,h=1):void 0!==l?(a=l,h=2):(a=1,h=1,console.error(`Could not determine Jianpu number components for MIDI ${t}, interval ${r} from tonic in key ${e}.`));break}}void 0===a&&(console.error(`Jianpu number became undefined for MIDI ${t} (interval ${r}, key ${e}) after chromatic processing. This indicates a logic error or misconfigured MAJOR_SCALE_INTERVALS.`),a=1,h=1)}const l=Math.floor((t-s)/12);return{jianpuNumber:a,octaveDot:l,accidental:h}}(t.pitch,e);return{...t,jianpuNumber:i.jianpuNumber,octaveDot:i.octaveDot,accidental:i.accidental}}}},775(t,e,i){i.d(e,{MeasuresInfo:()=>r});var s=i(830),n=i(559);class r{measuresInfo;allowDottedRests=!0;constructor(t,e){if(this.measuresInfo=[],!(e>0))return;const i=r.getSortedChanges(t.tempos,s.DEFAULT_TEMPO),n=r.getSortedChanges(t.keySignatures,s.DEFAULT_KEY_SIGNATURE),o=r.getSortedChanges(t.timeSignatures,s.DEFAULT_TIME_SIGNATURE);let a=0,h=0,l=0,u=i[0].event,c=n[0].event,d=o[0].event,g=1,m=(0,s.getMeasureLength)(d),f=d.start;const S=[0];i.forEach(t=>S.push(t.start)),n.forEach(t=>S.push(t.start)),o.forEach(t=>S.push(t.start)),S.sort((t,e)=>t-e);let p=-1;for(let t=0;t<S.length;t++){const r=S[t];if(r>=e)break;if(r===p)continue;p=r;let T=!1,A=!1,E=!1;for(;a<i.length&&i[a].start<=r;)u=i[a++].event,T=!0;for(;h<n.length&&n[h].start<=r;)c=n[h++].event,A=!0;for(;l<o.length&&o[l].start<=r;){g+=(o[l].event.start-f)/m,g=Math.round(1e3*g)/1e3,d=o[l++].event,m=(0,s.getMeasureLength)(d),f=r,E=!0}const I={start:r,measureNumber:g+(r-f)/m,measureLength:m,tempo:u,keySignature:c,timeSignature:d};T&&(I.tempoChange=!0),A&&(I.keyChange=!0),E&&(I.timeChange=!0),this.measuresInfo.push(I)}}static getSortedChanges(t,e){const i=t&&t.length?t.slice():[e];return i.sort((t,e)=>t.start-e.start),i.map(t=>({start:Math.max(0,Math.round(t.start/n.MIN_RESOLUTION)*n.MIN_RESOLUTION),event:t}))}findIndex(t){let e=0,i=this.measuresInfo.length-1,s=0;for(;e<=i;){const n=Math.floor((e+i)/2);this.measuresInfo[n].start<=t?(s=n,e=n+1):i=n-1}return s}measureNumberAtQ(t){if(0===this.measuresInfo.length)return 1;const e=this.findIndex(t),i=this.measuresInfo[e],s=(t-i.start)/i.measureLength;return i.measureNumber+s+1e-9}measureLengthAtQ(t){if(0===this.measuresInfo.length)return(0,s.getMeasureLength)(s.DEFAULT_TIME_SIGNATURE);const e=this.findIndex(t);return this.measuresInfo[e].measureLength}tempoAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TEMPO.qpm;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.tempoChange&&o?r.tempo.qpm:-1}keySignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_KEY_SIGNATURE.key;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.keyChange&&o?r.keySignature.key:-1}timeSignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TIME_SIGNATURE;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.timeChange&&o?r.timeSignature:null}quartersToTime(t,e){const i=this.tempoAtQ(e);return i<=0?0:t/i*60}timeToQuarters(t,e){const i=this.tempoAtQ(e);if(i<=0)return 0;const s=t*i/60;return Math.round(s*n.MAX_QUARTER_DIVISION)/n.MAX_QUARTER_DIVISION}isBeatStart(t){if(0===this.measuresInfo.length)return!1;const e=this.findIndex(t),i=this.measuresInfo[e],s=i.timeSignature,r=(t-(i.start-(i.measureNumber-Math.floor(i.measureNumber))*i.measureLength))/(4/s.denominator);return Math.abs(r-Math.round(r))<n.MIN_RESOLUTION/2}}},559(t,e,i){i.d(e,["MAJOR_SCALE_INTERVALS",0,{0:1,2:2,4:3,5:4,7:5,9:6,11:7},"MAX_QUARTER_DIVISION",0,240,"MIDDLE_C_MIDI",0,60,"MIN_RESOLUTION",0,.0625,"PITCH_CLASS_NAMES",0,["C","C#","D","D#","E","F","F#","G","G#","A","A#","B"]])},240(t,e,i){const s=new Map([[1,1.78],[2,1.6],[3,1.3],[4,1.15]]);i.d(e,["AUGMENTATION_DASH_FACTOR",0,.8,"COMPACT_SPACING_FACTOR",0,1.5,"DOT_SIZE_FACTOR",0,.1,"DURATION_LINE_SCALES",0,s,"FONT_SIZE_MULTIPLIER",0,1.2,"LINE_STROKE_WIDTH",0,1,"OCTAVE_DOT_OFFSET_FACTOR",0,1,"SMALL_FONT_SIZE_MULTIPLIER",0,.75,"UNDERLINE_SPACING_FACTOR",0,.2])},961(t,e,i){i.d(e,["ACCIDENTAL_TEXT",0,["","#","b"],"PATH_SCALE",0,100,"augmentationDashPath",0,"m 0,0 h 50","barPath",0,"m 0,-50 v 100","dotPath",0,"M 0 0 a 15 15 0 1 0 0.0001 0 z","tiePath",0,"M -13,5 C 15,-15 65,-15 90,5 C 65,-25 15,-25 -13,5 Z","underlinePath",0,"m 0,0 h 100"])},134(t,e,i){i.d(e,{createSVGGroupChild:()=>o,drawSVGPath:()=>n,drawSVGText:()=>r,highlightElement:()=>l,resetElementHighlight:()=>u,setBlinkAnimation:()=>a,setStroke:()=>h});const s="http://www.w3.org/2000/svg";function n(t,e,i,n,r,o,a=1){const h=document.createElementNS(s,"path");return h.setAttributeNS(null,"d",e),h.setAttributeNS(null,"transform",`translate(${i}, ${n}) scale(${r}, ${o})`),a<1&&h.setAttributeNS(null,"opacity",`${a}`),t.appendChild(h),h}function r(t,e,i,n,r,o="normal",a="middle",h="middle",l="currentColor",u=1){const c=document.createElementNS(s,"text");c.setAttributeNS(null,"font-family","sans-serif"),c.setAttributeNS(null,"font-size",r),c.setAttributeNS(null,"font-weight",o),c.setAttributeNS(null,"x",`${i}`),c.setAttributeNS(null,"y",`${n}`),c.setAttributeNS(null,"text-anchor",a),c.setAttributeNS(null,"dominant-baseline",h),"currentColor"!==l&&c.setAttributeNS(null,"fill",l),u<1&&c.setAttributeNS(null,"opacity",`${u}`);const d=document.createTextNode(e);return c.appendChild(d),t.appendChild(c),c}function o(t,e){const i=document.createElementNS(s,"g");return e&&i.setAttribute("data-id",e),t.appendChild(i),i}function a(t,e=!0,i="1s"){let n=t.querySelector('animate[attributeName="opacity"]');return e?n?(n.setAttributeNS(null,"repeatCount","indefinite"),n.beginElement()):(n=document.createElementNS(s,"animate"),n.setAttributeNS(null,"attributeName","opacity"),n.setAttributeNS(null,"values","1;0.2;1"),n.setAttributeNS(null,"keyTimes","0;0.5;1"),n.setAttributeNS(null,"dur",i),n.setAttributeNS(null,"repeatCount","indefinite"),t.appendChild(n)):(n&&(n.endElement(),n.setAttributeNS(null,"repeatCount","0"),t.style.opacity="1"),t.style.opacity="1"),t}function h(t,e,i){t.setAttributeNS(null,"stroke",e),t.setAttributeNS(null,"stroke-width",`${i}`)}function l(t,e){const i=[];return t.matches("text, path")&&i.push(t),t.querySelectorAll("text, path").forEach(t=>{i.push(t)}),i.forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e)}),t}function u(t,e){t.querySelectorAll("text, path").forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e)})}i.d(e,["SVGNS",0,s])}};const e={};function i(s){const n=e[s];if(void 0!==n)return n.exports;const r=e[s]={exports:{}};return t[s](r,r.exports,i),r.exports}i.d=(t,e)=>{if(Array.isArray(e))for(var s=0;s<e.length;){var n=e[s++],r=e[s++],o=0===r?{enumerable:!0,value:e[s++]}:{enumerable:!0,get:r};i.o(t,n)||Object.defineProperty(t,n,o)}else for(var n in e)i.o(e,n)&&!i.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},i.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),i.r=t=>{Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};let s={};i.r(s),i.d(s,{JianpuSVGRender:()=>c,ScrollType:()=>n});var n,r=i(240),o=i(134),a=i(961),h=i(830),l=i(849),u=i(559);!function(t){t[t.PAGE=0]="PAGE",t[t.NOTE=1]="NOTE",t[t.BAR=2]="BAR"}(n||(n={}));class c{jianpuInfo;jianpuModel;config;height;width;parentElement;div;mainSVG;mainG;musicG;signaturesG;overlaySVG;overlayG;signaturesBlinking;lastKnownScrollLeft;isScrolling;currentKey;currentTimeSignature;playingNotes;lastRenderedQ;estimatedNoteWidth;numberFontSize;smallFontSize;yBaseline;parseColorString(t){return/^[a-z]+$/i.test(t)||t.startsWith("rgb(")?t:/^\d+,\s*\d+,\s*\d+$/.test(t)?`rgb(${t})`:t}constructor(t,e,i){this.jianpuInfo=t,this.div=i;this.config={noteHeight:e.noteHeight??20,noteSpacingFactor:e.noteSpacingFactor??r.COMPACT_SPACING_FACTOR,pixelsPerTimeStep:e.pixelsPerTimeStep??0,noteColor:this.parseColorString(e.noteColor??"black"),activeNoteColor:this.parseColorString(e.activeNoteColor??"red"),defaultKey:e.defaultKey??0,scrollType:e.scrollType??n.PAGE,fontFamily:e.fontFamily??"sans-serif",width:e.width??0,height:e.height??0},this.jianpuModel=new l.JianpuModel(this.jianpuInfo,this.config.defaultKey),this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??h.DEFAULT_TIME_SIGNATURE,this.playingNotes=new Map,this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.numberFontSize=this.config.noteHeight*r.FONT_SIZE_MULTIPLIER,this.smallFontSize=this.config.noteHeight*r.SMALL_FONT_SIZE_MULTIPLIER,this.estimatedNoteWidth=.6*this.numberFontSize,this.yBaseline=1.5*this.config.noteHeight,this.height=0,this.width=0,this.clear(),this.redraw()}clear(){for(;this.div.lastChild;)this.div.removeChild(this.div.lastChild);this.div.style.position="relative",this.div.style.overflow="hidden",this.overlaySVG=document.createElementNS(o.SVGNS,"svg"),this.overlaySVG.style.position="absolute",this.overlaySVG.style.left="0",this.overlaySVG.style.top="0",this.overlaySVG.style.pointerEvents="none",this.div.appendChild(this.overlaySVG),this.overlayG=(0,o.createSVGGroupChild)(this.overlaySVG,"overlay"),this.parentElement=document.createElement("div"),this.parentElement.style.overflowX="auto",this.parentElement.style.overflowY="hidden",this.parentElement.style.width="100%",this.parentElement.style.height="100%",this.div.appendChild(this.parentElement),this.parentElement.addEventListener("scroll",this.handleScrollEvent),this.mainSVG=document.createElementNS(o.SVGNS,"svg"),this.mainSVG.style.display="block",this.parentElement.appendChild(this.mainSVG),this.mainG=(0,o.createSVGGroupChild)(this.mainSVG,"main-content"),this.signaturesG=(0,o.createSVGGroupChild)(this.mainG,"signatures"),this.musicG=(0,o.createSVGGroupChild)(this.mainG,"music"),this.playingNotes.clear(),this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.height=this.config.height>0?this.config.height:5*this.config.noteHeight,this.width=this.config.width>0?this.config.width:0,this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??h.DEFAULT_TIME_SIGNATURE,this.drawSignatures(this.overlayG,0,!0,!0),this.updateLayout()}updateLayout(t){this.width=t??this.width,this.config.width>0&&(this.width=this.config.width),this.height=Math.max(this.height,6*this.config.noteHeight),this.config.height>0&&(this.height=this.config.height);const e=1.65*this.config.noteHeight;this.mainSVG.setAttribute("width",`${this.width}`),this.mainSVG.setAttribute("height",`${this.height}`),this.mainG.setAttribute("transform",`translate(0, ${this.yBaseline+e})`),this.overlaySVG.setAttribute("width","200"),this.overlaySVG.setAttribute("height",`${this.height}`),this.overlayG.setAttribute("transform",`translate(0, ${this.yBaseline})`)}redraw(t,e){let i=-1;const s=this.config.pixelsPerTimeStep<=0;if(t){const r=`${t.start}-${t.pitch}`;if(this.playingNotes.forEach((t,e)=>{if(e!==r){const t=this.mainSVG.querySelector(`g[data-id="${e}"]`);t&&(0,o.resetElementHighlight)(t,this.config.noteColor),this.playingNotes.delete(e)}}),!this.playingNotes.has(r)){const s=this.mainSVG.querySelector(`g[data-id="${r}"]`);if(s){(0,o.highlightElement)(s,this.config.activeNoteColor),this.playingNotes.set(r,t);const a=s.getBoundingClientRect(),h=this.mainSVG.getBoundingClientRect();i=a.left-h.left+this.parentElement.scrollLeft;const l=s.hasAttribute("data-is-measure-start");e&&(this.config.scrollType!==n.BAR||l)&&this.scrollIntoViewIfNeeded(i)}}if(!s&&this.signaturesBlinking){const e=this.overlayG.getBoundingClientRect().width;this.jianpuModel.measuresInfo.quartersToTime(t.start,t.start)*this.config.pixelsPerTimeStep>e&&(this.signaturesBlinking=!1,(0,o.setBlinkAnimation)(this.overlayG,!1))}}else{this.jianpuModel.update(this.jianpuInfo,this.config.defaultKey);let t=this.width,e=this.width,i=this.height>0?this.height-this.yBaseline:3*this.config.noteHeight,n=0;const r=new Map;this.jianpuModel.jianpuBlockMap.forEach((o,a)=>{if(a>=this.lastRenderedQ-1e-9){t=s?e:this.jianpuModel.measuresInfo.quartersToTime(a,a)*this.config.pixelsPerTimeStep;const h=this.drawJianpuBlock(o,t,r);s?e+=h:e=Math.max(e,t+h);const l=this.mainSVG.querySelector(`g[data-block-start="${o.start}"]`);if(l)try{const t=l.getBBox(),e=t.y,s=t.y+t.height;n=Math.min(n,e),i=Math.max(i,s)}catch(t){}this.lastRenderedQ=a+o.length}}),this.height=Math.max(this.height,i-n+this.config.noteHeight),this.updateLayout(e)}return i}drawJianpuBlock(t,e,i){let s=0;const n=this.config.pixelsPerTimeStep<=0,h=t.isMeasureBeginning(),l=(0,o.createSVGGroupChild)(this.musicG,`block-${t.start}`);if(l.setAttribute("data-block-start",`${t.start}`),h&&t.start>1e-6){const t=e-(n?.6*this.estimatedNoteWidth:4),i=2*this.config.noteHeight,h=0,l=(0,o.drawSVGPath)(this.musicG,a.barPath,t,h,1,i/a.PATH_SCALE);(0,o.setStroke)(l,this.config.noteColor,r.LINE_STROKE_WIDTH),n&&(s+=r.LINE_STROKE_WIDTH)}const u=this.updateCurrentKey(t.start),c=this.updateCurrentTimeSignature(t.start);let d=0;if((u||c)&&t.start>1e-6){const t=e+s;d=this.drawSignatures(this.signaturesG,t,u,c),n&&(s+=d+.2*this.estimatedNoteWidth)}const g=e+s;let m=0;if(t.notes.length>0?m=this.drawNotes(t,g,i,l):t.length>1e-6&&(m=this.drawRest(t,g,l)),n){s+=m;let e=this.estimatedNoteWidth*this.config.noteSpacingFactor;t.beatEnd?e*=1:t.length<.0625?e*=.05:t.length<.125?e*=.1:t.length<.25?e*=.2:t.length<.5?e*=.4:t.length<1&&(e*=.5),s+=e}else s=Math.max(d,m);if(this.jianpuModel.isLastMeasureAtQ(t.start+t.length)){const t=e+s,i=2*this.config.noteHeight,h=0,l=(0,o.drawSVGPath)(this.musicG,a.barPath,t,h,1,i/a.PATH_SCALE);(0,o.setStroke)(l,this.config.noteColor,r.LINE_STROKE_WIDTH),n&&(s+=r.LINE_STROKE_WIDTH)}return s}drawNotes(t,e,i,s){let n=e,h=e;const l=.1*this.estimatedNoteWidth,u=`${this.numberFontSize}px`,c=`${this.smallFontSize}px`,{durationLines:d=0,augmentationDots:g=0,augmentationDash:m=!1}=t;return t.notes.forEach(e=>{const f=`${e.start}-${e.pitch}`,S=(0,o.createSVGGroupChild)(s,f);t.isMeasureBeginning()&&S.setAttribute("data-is-measure-start","true");let p=n,T=p;if(0!==e.accidental){const t=a.ACCIDENTAL_TEXT[e.accidental];(0,o.drawSVGText)(S,t,p+l,0,c,"normal","end","text-top",this.config.noteColor)}let A=0;if(m){const t=this.config.noteHeight*r.AUGMENTATION_DASH_FACTOR,e=t/50,i=(0,o.drawSVGPath)(S,a.augmentationDashPath,p,0,e,1);(0,o.setStroke)(i,this.config.noteColor,r.LINE_STROKE_WIDTH),A=t,T=p+A}else{const t=`${e.jianpuNumber}`;A=(0,o.drawSVGText)(S,t,p,0,u,"normal","start","middle",this.config.noteColor).getBBox().width,T=p+A}if(0!==e.octaveDot&&!1===m){const t=this.config.noteHeight*r.DOT_SIZE_FACTOR,i=t/(.15*a.PATH_SCALE),s=p+A/2,n=2.8*t,h=this.config.noteHeight*r.OCTAVE_DOT_OFFSET_FACTOR;for(let t=0;t<Math.abs(e.octaveDot);t++){const r=(e.octaveDot>0?-h:.6*h)-t*n*(e.octaveDot>0?1:-1);(0,o.drawSVGPath)(S,a.dotPath,s,r,i,i)}}if(d>0){const t=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR,i=A/a.PATH_SCALE*(r.DURATION_LINE_SCALES.get(d)??1);for(let s=0;s<d;s++){const n=t+s*e,h=(0,o.drawSVGPath)(S,a.underlinePath,p,n,i,1);(0,o.setStroke)(h,this.config.noteColor,r.LINE_STROKE_WIDTH)}}let E=T+l;if(g>0){const t=this.config.noteHeight*r.DOT_SIZE_FACTOR,e=t/(.15*a.PATH_SCALE);for(let i=0;i<g;i++)(0,o.drawSVGPath)(S,a.dotPath,E,0,e,e),E+=t+l;T=E+l}const I=T;if(e.tiedTo&&!m)i.set(e,{g:S,xNoteRight:I,yNoteBaseline:0});else if(e.tiedFrom){let t=e.tiedFrom;for(;t.tiedFrom;)t=t.tiedFrom;const s=i.get(t);if(s){const n=1*s.xNoteRight,r=(m?p-2.2*this.estimatedNoteWidth:p-l)-n,h=1.2*-this.config.noteHeight,u=r/a.PATH_SCALE*1.3,c=this.config.noteHeight/a.PATH_SCALE*1.6;r>1&&(0,o.drawSVGPath)(s.g,a.tiePath,n-(s.g.getCTM()?.e??0),h,u,c);let d=t;for(;d&&d!==e;){i.delete(d);const t=d.tiedTo;t&&(d=t)}}else console.warn("Missing linked SVG details for first tied note:",t)}h=Math.max(h,T)}),h-e}drawRest(t,e,i){const s=`${this.numberFontSize}px`,n=.1*this.estimatedNoteWidth,{durationLines:h=0,augmentationDots:l=0}=t;let u=e,c=u;const d=(0,o.drawSVGText)(i,"0",u,0,s,"normal","start","middle",this.config.noteColor).getBBox().width;if(c=u+d,h>0){const t=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR,s=d/a.PATH_SCALE*(r.DURATION_LINE_SCALES.get(h)??1);for(let n=0;n<h;n++){const h=t+n*e,l=(0,o.drawSVGPath)(i,a.underlinePath,u,h,s,1);(0,o.setStroke)(l,this.config.noteColor,r.LINE_STROKE_WIDTH)}}let g=c+n;if(l>0){const t=this.config.noteHeight*r.DOT_SIZE_FACTOR,e=t/(.15*a.PATH_SCALE);for(let s=0;s<l;s++)(0,o.drawSVGPath)(i,a.dotPath,g,0,e,e),g+=t+n;c=g+n}return c-e}drawSignatures(t,e,i,s){let n=e;const r=.3*this.estimatedNoteWidth,a=`${this.smallFontSize}px`,h=`${this.numberFontSize}px`;if(i){const e=`1=${u.PITCH_CLASS_NAMES[this.currentKey%12]??"C"}`;n+=(0,o.drawSVGText)(t,e,n,0,h,"normal","start","middle",this.config.noteColor).getBBox().width+2*r}if(s){const e=`${this.currentTimeSignature.numerator}/${this.currentTimeSignature.denominator}`;n+=(0,o.drawSVGText)(t,e,n,0,a,"normal","start","middle",this.config.noteColor).getBBox().width+r}const l=n-e;try{const e=t.getBBox(),i=e.y,s=e.y+e.height,n=Math.max(this.yBaseline+s,this.yBaseline-i)+.5*this.config.noteHeight;this.height=Math.max(this.height,n)}catch(t){}return t===this.overlayG&&this.config.pixelsPerTimeStep>0&&(this.signaturesBlinking=!0,(0,o.setBlinkAnimation)(this.overlayG,!0)),l}updateCurrentKey(t){const e=this.jianpuModel.measuresInfo.keySignatureAtQ(t,!0);return-1!==e&&e!==this.currentKey&&(this.currentKey=e,!0)}updateCurrentTimeSignature(t){const e=this.jianpuModel.measuresInfo.timeSignatureAtQ(t,!0);return!(!e||e.numerator===this.currentTimeSignature.numerator&&e.denominator===this.currentTimeSignature.denominator)&&(this.currentTimeSignature=e,!0)}handleScrollEvent=t=>{this.lastKnownScrollLeft=this.parentElement.scrollLeft,this.isScrolling||window.requestAnimationFrame(()=>{this.updateOverlaySignaturesForScroll(this.lastKnownScrollLeft),this.isScrolling=!1}),this.isScrolling=!0};scrollIntoViewIfNeeded(t){const e=this.parentElement.getBoundingClientRect().width,i=this.parentElement.scrollLeft;let s=i;if(this.config.scrollType===n.PAGE){const n=20;t<i+n?s=t-n:t>i+e-n&&(s=t-e+n)}else{s=t-.5*e}s=Math.max(0,Math.min(s,this.parentElement.scrollWidth-e)),Math.abs(s-i)>1&&(this.parentElement.scrollTo({left:s,behavior:"smooth"}),this.updateOverlaySignaturesForScroll(s))}updateOverlaySignaturesForScroll(t){const e=this.pixelsToTime(t),i=this.jianpuModel.measuresInfo.keySignatureAtQ(e),s=this.jianpuModel.measuresInfo.timeSignatureAtQ(e)??this.currentTimeSignature;let n=!1;if(i!==this.currentKey&&(this.currentKey=i,n=!0),s.numerator===this.currentTimeSignature.numerator&&s.denominator===this.currentTimeSignature.denominator||(this.currentTimeSignature=s,n=!0),n){for(;this.overlayG.lastChild;)this.overlayG.removeChild(this.overlayG.lastChild);this.drawSignatures(this.overlayG,0,!0,!0),t<10&&this.config.pixelsPerTimeStep>0?((0,o.setBlinkAnimation)(this.overlayG,!0),this.signaturesBlinking=!0):this.config.pixelsPerTimeStep>0&&((0,o.setBlinkAnimation)(this.overlayG,!1),this.signaturesBlinking=!1)}}pixelsToTime(t){return this.config.pixelsPerTimeStep<=0?0:this.jianpuModel.measuresInfo.timeToQuarters(t/this.config.pixelsPerTimeStep,0)}}return s})());
|
|
1
|
+
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.jianpu_svg_render=e():t.jianpu_svg_render=e()}(self,()=>(()=>{"use strict";var t={765(t,e,i){i.d(e,{JianpuBlock:()=>o});var s=i(559);function n(t){return Math.abs(t)<1e-6}function r(t,e){const i=t.start+t.length;if(e<=t.start||e>=i||n(i-e))return null;const s=i-e;t.length=e-t.start;const r={start:e,length:s,pitch:t.pitch,intensity:t.intensity,jianpuNumber:t.jianpuNumber,octaveDot:t.octaveDot,accidental:0,tiedFrom:t};return t.tiedTo&&(r.tiedTo=t.tiedTo,t.tiedTo.tiedFrom=r),t.tiedTo=r,r}class o{start;length;notes;measureNumber;durationLines;augmentationDots;augmentationDash;beatBegin;beatEnd;isTieStart;isTieEnd;constructor(t=0,e=0,i=[],s=1){this.start=t,this.length=e,this.notes=i,this.measureNumber=s}addNote(t){if(0===this.notes.length)return this.start=t.start,this.length=t.length,this.notes.push(t),!0;if(!n(this.start-t.start))return console.warn(`JianpuBlock: Attempted to add note at ${t.start} to block starting at ${this.start}. Ignoring.`),!1;let e=!1,i=!1;for(let s=0;s<this.notes.length;s++)if(this.notes[s].pitch===t.pitch){i=!0,t.length<this.notes[s].length&&(this.notes[s].tiedFrom&&(t.tiedFrom=this.notes[s].tiedFrom,t.tiedFrom&&(t.tiedFrom.tiedTo=t)),this.notes[s].tiedTo&&(t.tiedTo=this.notes[s].tiedTo,t.tiedTo&&(t.tiedTo.tiedFrom=t)),this.notes[s]=t,e=!0);break}i||this.notes.push(t);let s=1/0;for(const t of this.notes)s=Math.min(s,t.length);return this.length=s,!i||e}split(t,e){const i=this.start+this.length;if(t<=this.start||t>=i||n(i-t))return null;const s=i-t,a=t-this.start,h=new o(t,s,[],e.measureNumberAtQ(t)),l=[];for(const e of this.notes){const i=e.start+e.length;if(i>t+1e-6){const i=r(e,t);i?l.push(i):console.warn("Split failed for note, unexpected state.")}else n(i-t)}return l.forEach(t=>h.addNote(t)),this.length=a,delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash,this.beatEnd&&(h.beatEnd=!0,delete this.beatEnd),this.isTieEnd&&(h.isTieStart=!0,delete this.isTieEnd),h}splitToBeat(t){const e=t.timeSignatureAtQ(this.start);if(!e)return null;const i=t.measureLengthAtQ(this.start),s=t.measureNumberAtQ(this.start),r=this.start-(s-Math.floor(s))*i,o=this.start-r,a=4/e.denominator,h=o/a;this.beatBegin=n(h-Math.round(h));const l=r+(Math.floor(h+1e-6)+1)*a,u=r+i,c=this.start+this.length;let d=null;l<c-1e-6&&l>this.start+1e-6&&(d=l),u<c-1e-6&&u>this.start+1e-6&&(null===d||u<d)&&(d=u);let g=null;if(null!==d)g=this.split(d,t),g&&(this.beatEnd=!0);else{const t=(o+this.length)/a;this.beatEnd=n(t-Math.round(t)),this.beatEnd||(this.beatEnd=n(c-u))}return this.isTieStart=this.notes.some(t=>t.tiedFrom),this.isTieEnd=this.notes.some(t=>t.tiedTo),g&&(g.isTieStart=g.notes.some(t=>t.tiedFrom),g.isTieEnd=g.notes.some(t=>t.tiedTo),this.notes.some(t=>t.tiedTo&&t.start+t.length>d)&&delete this.isTieEnd),g}calculateRenderProperties(t){delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash;const e=this.length;if(n(e)||e<0)return;if(t.allowDottedRests||this.notes.length>0){if(n(e-1.5))return void(this.augmentationDots=1);if(n(e-.75))return this.durationLines=1,void(this.augmentationDots=1);if(n(e-.375))return this.durationLines=2,void(this.augmentationDots=1);n(e-3)&&(this.augmentationDots=1)}if(this.durationLines=e>=3.999999||e>=1.999999||e>=.999999?0:e>=.499999?1:e>=.249999?2:e>=.124999?3:4,this.augmentationDash=!1,1===this.notes.length){const e=this.notes[0],i=t.timeSignatureAtQ(this.start);if(!i)return;const s=Math.max(4/i.denominator,1);if(!(this.measureNumber%1<=1e-6)&&e.tiedFrom&&n(e.tiedFrom.length-s)&&e.tiedFrom.pitch===e.pitch&&e.length>=1){let i=!0;if(e.tiedTo){const s=e.start+e.length;i=Math.floor(t.measureNumberAtQ(this.start))===Math.floor(t.measureNumberAtQ(s))&&e.tiedTo.length>=1}i&&(this.augmentationDash=!0)}}}splitToStandardSymbol(t){const e=this.length;if(n(e)||e<s.MIN_RESOLUTION-1e-6)return null;const i=[];t.allowDottedRests||this.notes.length>0?(i.push(6),i.push(4),i.push(3),i.push(2),i.push(1.5),i.push(1),i.push(.75),i.push(.5),i.push(.375),i.push(.25),i.push(.125),i.push(.0625)):(i.push(4),i.push(2),i.push(1),i.push(.5),i.push(.25),i.push(.125),i.push(.0625));let r=0;for(const t of i)if(e>=t-1e-6){r=t;break}n(r)&&(r=s.MIN_RESOLUTION,e<r-1e-6&&e>1e-6&&console.warn(`Block length ${e} is too small, rendering as ${r}`));let o=null;return e>r+1e-6?(o=this.split(this.start+r,t),this.length!==r&&(console.warn(`Adjusting block length after split from ${this.length} to ${r}`),this.length=r)):this.length=r,o}mergeToMap(t){const e=t.get(this.start);e?(this.notes.forEach(t=>e.addNote(t)),0!==this.measureNumber&&(e.measureNumber=this.measureNumber)):t.set(this.start,this)}isMeasureBeginning(){return n(this.measureNumber-Math.floor(this.measureNumber))}}},830(t,e,i){i.d(e,{getMeasureLength:()=>s});function s(t){return t.numerator*(4/t.denominator)}i.d(e,["DEFAULT_KEY_SIGNATURE",0,{start:0,key:0},"DEFAULT_TEMPO",0,{start:0,qpm:60},"DEFAULT_TIME_SIGNATURE",0,{start:0,numerator:4,denominator:4}])},849(t,e,i){i.d(e,{JianpuModel:()=>a});var s=i(830),n=i(775),r=i(765),o=i(559);class a{jianpuInfo;measuresInfo;jianpuBlockMap;lastQ;constructor(t,e){this.jianpuInfo=t,this.jianpuBlockMap=new Map,this.lastQ=0,this.update(t,e)}isLastMeasureAtQ(t){return t>=this.lastQ-1e-6}getTotalDuration(){return this.lastQ}update(t,e){this.jianpuInfo=t,t.notes.sort((t,e)=>t.start-e.start),this.lastQ=0,t.notes.forEach(t=>{this.lastQ=Math.max(this.lastQ,t.start+t.length)}),this.lastQ+=1e-6,t.tempos=t.tempos&&t.tempos.length?t.tempos:[s.DEFAULT_TEMPO],t.tempos.sort((t,e)=>t.start-e.start),t.tempos[0].start>1e-6&&t.tempos.unshift({...s.DEFAULT_TEMPO,start:0});const i=void 0!==e?{start:0,key:e}:{...s.DEFAULT_KEY_SIGNATURE};t.keySignatures=t.keySignatures&&t.keySignatures.length?t.keySignatures:[i],t.keySignatures.sort((t,e)=>t.start-e.start),t.keySignatures[0].start>1e-6&&t.keySignatures.unshift({...i,start:0}),t.timeSignatures=t.timeSignatures&&t.timeSignatures.length?t.timeSignatures:[s.DEFAULT_TIME_SIGNATURE],t.timeSignatures.sort((t,e)=>t.start-e.start),t.timeSignatures[0].start>1e-6&&t.timeSignatures.unshift({...s.DEFAULT_TIME_SIGNATURE,start:0}),this.measuresInfo=new n.MeasuresInfo(t,this.lastQ),this.infoToBlocks()}infoToBlocks(){const t=new Map;let e=0;if(this.jianpuInfo.notes.forEach(i=>{const s=i.start,n=this.measuresInfo.measureNumberAtQ(s);if(s>e+1e-6){const i=e,n=s-i,o=this.measuresInfo.measureNumberAtQ(i),a=new r.JianpuBlock(i,n,[],o);t.set(i,a)}const o=this.measuresInfo.keySignatureAtQ(s),a=this.createJianpuNote(i,o);let h=t.get(s);h||(h=new r.JianpuBlock(s,0,[],n),t.set(s,h)),h.addNote(a),e=Math.max(e,s+h.length)}),this.lastQ>e+1e-6){const i=e,s=this.lastQ-1e-6-i;if(s>1e-6){const e=this.measuresInfo.measureNumberAtQ(i),n=new r.JianpuBlock(i,s,[],e);t.set(i,n)}}this.jianpuBlockMap=new Map;const i=Array.from(t.keys()).sort((t,e)=>t-e);let s=[];i.forEach(e=>{s.push(t.get(e))});const n=new Set;for(;s.length>0;){let t=s.shift();n.has(t.start)&&this.jianpuBlockMap.has(t.start);let e=t.splitToBeat(this.measuresInfo);if(e){t.mergeToMap(this.jianpuBlockMap),n.add(t.start),s.unshift(e);continue}let i=t,r=null;do{r=i.splitToStandardSymbol(this.measuresInfo),i.mergeToMap(this.jianpuBlockMap),n.add(i.start),r&&(i=r)}while(r)}this.jianpuBlockMap.forEach(t=>{t.calculateRenderProperties(this.measuresInfo)})}createJianpuNote(t,e){const i=function(t,e){const i=e%12;let s=o.MIDDLE_C_MIDI+i;i>o.MIDDLE_C_MIDI%12&&(s-=12);const n=Math.round((t-s)/12),r=(t-(s+12*n)+12)%12;let a=o.MAJOR_SCALE_INTERVALS[r],h=0;if(void 0===a){switch(r){case 1:a=o.MAJOR_SCALE_INTERVALS[0],h=1;break;case 3:a=o.MAJOR_SCALE_INTERVALS[4],h=2;break;case 6:a=o.MAJOR_SCALE_INTERVALS[5],h=1;break;case 8:a=o.MAJOR_SCALE_INTERVALS[9],h=2;break;case 10:a=o.MAJOR_SCALE_INTERVALS[11],h=2;break;default:{console.warn(`Unexpected chromatic interval ${r} in mapMidiToJianpu. Defaulting to sharp of lower valid degree.`);const i=(r-1+12)%12,s=(r+1+12)%12,n=o.MAJOR_SCALE_INTERVALS[i],l=o.MAJOR_SCALE_INTERVALS[s];void 0!==n?(a=n,h=1):void 0!==l?(a=l,h=2):(a=1,h=1,console.error(`Could not determine Jianpu number components for MIDI ${t}, interval ${r} from tonic in key ${e}.`));break}}void 0===a&&(console.error(`Jianpu number became undefined for MIDI ${t} (interval ${r}, key ${e}) after chromatic processing. This indicates a logic error or misconfigured MAJOR_SCALE_INTERVALS.`),a=1,h=1)}const l=Math.floor((t-s)/12);return{jianpuNumber:a,octaveDot:l,accidental:h}}(t.pitch,e);return{...t,jianpuNumber:i.jianpuNumber,octaveDot:i.octaveDot,accidental:i.accidental}}}},775(t,e,i){i.d(e,{MeasuresInfo:()=>r});var s=i(830),n=i(559);class r{measuresInfo;allowDottedRests=!0;constructor(t,e){if(this.measuresInfo=[],!(e>0))return;const i=r.getSortedChanges(t.tempos,s.DEFAULT_TEMPO),n=r.getSortedChanges(t.keySignatures,s.DEFAULT_KEY_SIGNATURE),o=r.getSortedChanges(t.timeSignatures,s.DEFAULT_TIME_SIGNATURE);let a=0,h=0,l=0,u=i[0].event,c=n[0].event,d=o[0].event,g=1,m=(0,s.getMeasureLength)(d),f=d.start;const S=[0];i.forEach(t=>S.push(t.start)),n.forEach(t=>S.push(t.start)),o.forEach(t=>S.push(t.start)),S.sort((t,e)=>t-e);let p=-1;for(let t=0;t<S.length;t++){const r=S[t];if(r>=e)break;if(r===p)continue;p=r;let T=!1,A=!1,E=!1;for(;a<i.length&&i[a].start<=r;)u=i[a++].event,T=!0;for(;h<n.length&&n[h].start<=r;)c=n[h++].event,A=!0;for(;l<o.length&&o[l].start<=r;){g+=(o[l].event.start-f)/m,g=Math.round(1e3*g)/1e3,d=o[l++].event,m=(0,s.getMeasureLength)(d),f=r,E=!0}const I={start:r,measureNumber:g+(r-f)/m,measureLength:m,tempo:u,keySignature:c,timeSignature:d};T&&(I.tempoChange=!0),A&&(I.keyChange=!0),E&&(I.timeChange=!0),this.measuresInfo.push(I)}}static getSortedChanges(t,e){const i=t&&t.length?t.slice():[e];return i.sort((t,e)=>t.start-e.start),i.map(t=>({start:Math.max(0,Math.round(t.start/n.MIN_RESOLUTION)*n.MIN_RESOLUTION),event:t}))}findIndex(t){let e=0,i=this.measuresInfo.length-1,s=0;for(;e<=i;){const n=Math.floor((e+i)/2);this.measuresInfo[n].start<=t?(s=n,e=n+1):i=n-1}return s}measureNumberAtQ(t){if(0===this.measuresInfo.length)return 1;const e=this.findIndex(t),i=this.measuresInfo[e],s=(t-i.start)/i.measureLength;return i.measureNumber+s+1e-9}measureLengthAtQ(t){if(0===this.measuresInfo.length)return(0,s.getMeasureLength)(s.DEFAULT_TIME_SIGNATURE);const e=this.findIndex(t);return this.measuresInfo[e].measureLength}tempoAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TEMPO.qpm;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.tempoChange&&o?r.tempo.qpm:-1}keySignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_KEY_SIGNATURE.key;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.keyChange&&o?r.keySignature.key:-1}timeSignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TIME_SIGNATURE;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.timeChange&&o?r.timeSignature:null}quartersToTime(t,e){const i=this.tempoAtQ(e);return i<=0?0:t/i*60}timeToQuarters(t,e){const i=this.tempoAtQ(e);if(i<=0)return 0;const s=t*i/60;return Math.round(s*n.MAX_QUARTER_DIVISION)/n.MAX_QUARTER_DIVISION}isBeatStart(t){if(0===this.measuresInfo.length)return!1;const e=this.findIndex(t),i=this.measuresInfo[e],s=i.timeSignature,r=(t-(i.start-(i.measureNumber-Math.floor(i.measureNumber))*i.measureLength))/(4/s.denominator);return Math.abs(r-Math.round(r))<n.MIN_RESOLUTION/2}}},559(t,e,i){i.d(e,["MAJOR_SCALE_INTERVALS",0,{0:1,2:2,4:3,5:4,7:5,9:6,11:7},"MAX_QUARTER_DIVISION",0,240,"MIDDLE_C_MIDI",0,60,"MIN_RESOLUTION",0,.0625,"PITCH_CLASS_NAMES",0,["C","C#","D","D#","E","F","F#","G","G#","A","A#","B"]])},240(t,e,i){const s=new Map([[1,1.78],[2,1.6],[3,1.3],[4,1.15]]);i.d(e,["AUGMENTATION_DASH_FACTOR",0,.8,"COMPACT_SPACING_FACTOR",0,1.5,"DOT_SIZE_FACTOR",0,.1,"DURATION_LINE_SCALES",0,s,"FONT_SIZE_MULTIPLIER",0,1.2,"LINE_STROKE_WIDTH",0,1,"OCTAVE_DOT_OFFSET_FACTOR",0,1,"SMALL_FONT_SIZE_MULTIPLIER",0,.75,"UNDERLINE_SPACING_FACTOR",0,.2])},961(t,e,i){i.d(e,["ACCIDENTAL_TEXT",0,["","#","b"],"PATH_SCALE",0,100,"augmentationDashPath",0,"m 0,0 h 50","barPath",0,"m 0,-50 v 100","dotPath",0,"M 0 0 a 15 15 0 1 0 0.0001 0 z","tiePath",0,"M -13,5 C 15,-15 65,-15 90,5 C 65,-25 15,-25 -13,5 Z","underlinePath",0,"m 0,0 h 100"])},134(t,e,i){i.d(e,{createSVGGroupChild:()=>o,drawSVGPath:()=>n,drawSVGText:()=>r,highlightElement:()=>l,resetElementHighlight:()=>u,setBlinkAnimation:()=>a,setStroke:()=>h});const s="http://www.w3.org/2000/svg";function n(t,e,i,n,r,o,a=1){const h=document.createElementNS(s,"path");return h.setAttributeNS(null,"d",e),h.setAttributeNS(null,"transform",`translate(${i}, ${n}) scale(${r}, ${o})`),a<1&&h.setAttributeNS(null,"opacity",`${a}`),t.appendChild(h),h}function r(t,e,i,n,r,o="normal",a="middle",h="middle",l="currentColor",u=1,c="sans-serif"){const d=document.createElementNS(s,"text");d.setAttributeNS(null,"font-family",c),d.setAttributeNS(null,"font-size",r),d.setAttributeNS(null,"font-weight",o),d.setAttributeNS(null,"x",`${i}`),d.setAttributeNS(null,"y",`${n}`),d.setAttributeNS(null,"text-anchor",a),d.setAttributeNS(null,"dominant-baseline",h),"currentColor"!==l&&d.setAttributeNS(null,"fill",l),u<1&&d.setAttributeNS(null,"opacity",`${u}`);const g=document.createTextNode(e);return d.appendChild(g),t.appendChild(d),d}function o(t,e){const i=document.createElementNS(s,"g");return e&&i.setAttribute("data-id",e),t.appendChild(i),i}function a(t,e=!0,i="1s"){let n=t.querySelector('animate[attributeName="opacity"]');return e?n?(n.setAttributeNS(null,"repeatCount","indefinite"),n.beginElement()):(n=document.createElementNS(s,"animate"),n.setAttributeNS(null,"attributeName","opacity"),n.setAttributeNS(null,"values","1;0.2;1"),n.setAttributeNS(null,"keyTimes","0;0.5;1"),n.setAttributeNS(null,"dur",i),n.setAttributeNS(null,"repeatCount","indefinite"),t.appendChild(n)):(n&&(n.endElement(),n.setAttributeNS(null,"repeatCount","0"),t.style.opacity="1"),t.style.opacity="1"),t}function h(t,e,i){t.setAttributeNS(null,"stroke",e),t.setAttributeNS(null,"stroke-width",`${i}`)}function l(t,e){const i=[];return t.matches("text, path")&&i.push(t),t.querySelectorAll("text, path").forEach(t=>{i.push(t)}),i.forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e);const i=t.getAttribute("stroke");null!==i&&"none"!==i&&t.setAttribute("stroke",e)}),t}function u(t,e){t.querySelectorAll("text, path").forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e);const i=t.getAttribute("stroke");null!==i&&"none"!==i&&t.setAttribute("stroke",e)})}i.d(e,["SVGNS",0,s])}};const e={};function i(s){const n=e[s];if(void 0!==n)return n.exports;const r=e[s]={exports:{}};return t[s](r,r.exports,i),r.exports}i.d=(t,e)=>{if(Array.isArray(e))for(var s=0;s<e.length;){var n=e[s++],r=e[s++],o=0===r?{enumerable:!0,value:e[s++]}:{enumerable:!0,get:r};i.o(t,n)||Object.defineProperty(t,n,o)}else for(var n in e)i.o(e,n)&&!i.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},i.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),i.r=t=>{Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};let s={};i.r(s),i.d(s,{JianpuSVGRender:()=>c,ScrollType:()=>n});var n,r=i(240),o=i(134),a=i(961),h=i(830),l=i(849),u=i(559);!function(t){t[t.PAGE=0]="PAGE",t[t.NOTE=1]="NOTE",t[t.BAR=2]="BAR"}(n||(n={}));class c{jianpuInfo;jianpuModel;config;height;width;parentElement;div;mainSVG;mainG;musicG;signaturesG;overlaySVG;overlayG;signaturesBlinking;lastKnownScrollLeft;isScrolling;currentKey;currentTimeSignature;playingNotes;lastRenderedQ;estimatedNoteWidth;numberFontSize;smallFontSize;yBaseline;parseColorString(t){return/^[a-z]+$/i.test(t)||t.startsWith("rgb(")?t:/^\d+,\s*\d+,\s*\d+$/.test(t)?`rgb(${t})`:t}constructor(t,e,i){this.jianpuInfo=t,this.div=i;this.config={noteHeight:e.noteHeight??20,noteSpacingFactor:e.noteSpacingFactor??r.COMPACT_SPACING_FACTOR,pixelsPerTimeStep:e.pixelsPerTimeStep??0,noteColor:this.parseColorString(e.noteColor??"black"),activeNoteColor:this.parseColorString(e.activeNoteColor??"red"),defaultKey:e.defaultKey??0,scrollType:e.scrollType??n.PAGE,fontFamily:e.fontFamily??"sans-serif",width:e.width??0,height:e.height??0},this.jianpuModel=new l.JianpuModel(this.jianpuInfo,this.config.defaultKey),this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??h.DEFAULT_TIME_SIGNATURE,this.playingNotes=new Map,this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.numberFontSize=this.config.noteHeight*r.FONT_SIZE_MULTIPLIER,this.smallFontSize=this.config.noteHeight*r.SMALL_FONT_SIZE_MULTIPLIER,this.estimatedNoteWidth=.6*this.numberFontSize,this.yBaseline=1.5*this.config.noteHeight,this.height=0,this.width=0,this.clear(),this.redraw()}clear(){for(;this.div.lastChild;)this.div.removeChild(this.div.lastChild);this.div.style.position="relative",this.div.style.overflow="hidden",this.overlaySVG=document.createElementNS(o.SVGNS,"svg"),this.overlaySVG.style.position="absolute",this.overlaySVG.style.left="0",this.overlaySVG.style.top="0",this.overlaySVG.style.pointerEvents="none",this.div.appendChild(this.overlaySVG),this.overlayG=(0,o.createSVGGroupChild)(this.overlaySVG,"overlay"),this.parentElement=document.createElement("div"),this.parentElement.style.overflowX="auto",this.parentElement.style.overflowY="hidden",this.parentElement.style.width="100%",this.parentElement.style.height="100%",this.div.appendChild(this.parentElement),this.parentElement.addEventListener("scroll",this.handleScrollEvent),this.mainSVG=document.createElementNS(o.SVGNS,"svg"),this.mainSVG.style.display="block",this.parentElement.appendChild(this.mainSVG),this.mainG=(0,o.createSVGGroupChild)(this.mainSVG,"main-content"),this.signaturesG=(0,o.createSVGGroupChild)(this.mainG,"signatures"),this.musicG=(0,o.createSVGGroupChild)(this.mainG,"music"),this.playingNotes.clear(),this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.height=this.config.height>0?this.config.height:5*this.config.noteHeight,this.width=this.config.width>0?this.config.width:0,this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??h.DEFAULT_TIME_SIGNATURE,this.drawSignatures(this.overlayG,0,!0,!0),this.updateLayout()}updateLayout(t){this.width=t??this.width,this.config.width>0&&(this.width=this.config.width),this.height=Math.max(this.height,6*this.config.noteHeight),this.config.height>0&&(this.height=this.config.height);const e=1.65*this.config.noteHeight;this.mainSVG.setAttribute("width",`${this.width}`),this.mainSVG.setAttribute("height",`${this.height}`),this.mainG.setAttribute("transform",`translate(0, ${this.yBaseline+e})`),this.overlaySVG.setAttribute("width","200"),this.overlaySVG.setAttribute("height",`${this.height}`),this.overlayG.setAttribute("transform",`translate(0, ${this.yBaseline})`)}redraw(t,e){let i=-1;const s=this.config.pixelsPerTimeStep<=0;if(t){const r=`${t.start}-${t.pitch}`;if(this.playingNotes.forEach((t,e)=>{if(e!==r){const t=this.mainSVG.querySelector(`g[data-id="${e}"]`);t&&(0,o.resetElementHighlight)(t,this.config.noteColor),this.playingNotes.delete(e)}}),!this.playingNotes.has(r)){const s=this.mainSVG.querySelector(`g[data-id="${r}"]`);if(s){(0,o.highlightElement)(s,this.config.activeNoteColor),this.playingNotes.set(r,t);const a=s.getBoundingClientRect(),h=this.mainSVG.getBoundingClientRect();i=a.left-h.left+this.parentElement.scrollLeft;const l=s.hasAttribute("data-is-measure-start");e&&(this.config.scrollType!==n.BAR||l)&&this.scrollIntoViewIfNeeded(i)}}if(!s&&this.signaturesBlinking){const e=this.overlayG.getBoundingClientRect().width;this.jianpuModel.measuresInfo.quartersToTime(t.start,t.start)*this.config.pixelsPerTimeStep>e&&(this.signaturesBlinking=!1,(0,o.setBlinkAnimation)(this.overlayG,!1))}}else{this.jianpuModel.update(this.jianpuInfo,this.config.defaultKey);let t=this.width,e=this.width,i=this.height>0?this.height-this.yBaseline:3*this.config.noteHeight,n=0;const r=new Map;this.jianpuModel.jianpuBlockMap.forEach((o,a)=>{if(a>=this.lastRenderedQ-1e-9){t=s?e:this.jianpuModel.measuresInfo.quartersToTime(a,a)*this.config.pixelsPerTimeStep;const h=this.drawJianpuBlock(o,t,r);s?e+=h:e=Math.max(e,t+h);const l=this.mainSVG.querySelector(`g[data-block-start="${o.start}"]`);if(l)try{const t=l.getBBox(),e=t.y,s=t.y+t.height;n=Math.min(n,e),i=Math.max(i,s)}catch(t){}this.lastRenderedQ=a+o.length}}),this.height=Math.max(this.height,i-n+this.config.noteHeight),this.updateLayout(e)}return i}drawJianpuBlock(t,e,i){let s=0;const n=this.config.pixelsPerTimeStep<=0,h=t.isMeasureBeginning(),l=(0,o.createSVGGroupChild)(this.musicG,`block-${t.start}`);if(l.setAttribute("data-block-start",`${t.start}`),h&&t.start>1e-6){const t=e-(n?.6*this.estimatedNoteWidth:4),i=2*this.config.noteHeight,h=0,l=(0,o.drawSVGPath)(this.musicG,a.barPath,t,h,1,i/a.PATH_SCALE);(0,o.setStroke)(l,this.config.noteColor,r.LINE_STROKE_WIDTH),n&&(s+=r.LINE_STROKE_WIDTH)}const u=this.updateCurrentKey(t.start),c=this.updateCurrentTimeSignature(t.start);let d=0;if((u||c)&&t.start>1e-6){const t=e+s;d=this.drawSignatures(this.signaturesG,t,u,c),n&&(s+=d+.2*this.estimatedNoteWidth)}const g=e+s;let m=0;if(t.notes.length>0?m=this.drawNotes(t,g,i,l):t.length>1e-6&&(m=this.drawRest(t,g,l)),n){s+=m;let e=this.estimatedNoteWidth*this.config.noteSpacingFactor;t.beatEnd?e*=1:t.length<.0625?e*=.05:t.length<.125?e*=.1:t.length<.25?e*=.2:t.length<.5?e*=.4:t.length<1&&(e*=.5),s+=e}else s=Math.max(d,m);if(this.jianpuModel.isLastMeasureAtQ(t.start+t.length)){const t=e+s,i=2*this.config.noteHeight,h=0,l=(0,o.drawSVGPath)(this.musicG,a.barPath,t,h,1,i/a.PATH_SCALE);(0,o.setStroke)(l,this.config.noteColor,r.LINE_STROKE_WIDTH),n&&(s+=r.LINE_STROKE_WIDTH)}return s}drawNotes(t,e,i,s){let n=e,h=e;const l=.1*this.estimatedNoteWidth,u=`${this.numberFontSize}px`,c=`${this.smallFontSize}px`,{durationLines:d=0,augmentationDots:g=0,augmentationDash:m=!1}=t;return t.notes.forEach(e=>{const f=`${e.start}-${e.pitch}`,S=(0,o.createSVGGroupChild)(s,f);t.isMeasureBeginning()&&S.setAttribute("data-is-measure-start","true");let p=n,T=p;if(0!==e.accidental){const t=a.ACCIDENTAL_TEXT[e.accidental];(0,o.drawSVGText)(S,t,p+l,0,c,"normal","end","text-top",this.config.noteColor,1,this.config.fontFamily)}let A=0;if(m){const t=this.config.noteHeight*r.AUGMENTATION_DASH_FACTOR,e=t/50,i=(0,o.drawSVGPath)(S,a.augmentationDashPath,p,0,e,1);(0,o.setStroke)(i,this.config.noteColor,r.LINE_STROKE_WIDTH),A=t,T=p+A}else{const t=`${e.jianpuNumber}`;A=(0,o.drawSVGText)(S,t,p,0,u,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width,T=p+A}if(0!==e.octaveDot&&!1===m){const t=this.config.noteHeight*r.DOT_SIZE_FACTOR,i=t/(.15*a.PATH_SCALE),s=p+A/2,n=2.8*t,h=this.config.noteHeight*r.OCTAVE_DOT_OFFSET_FACTOR;for(let t=0;t<Math.abs(e.octaveDot);t++){const r=(e.octaveDot>0?-h:.6*h)-t*n*(e.octaveDot>0?1:-1);(0,o.drawSVGPath)(S,a.dotPath,s,r,i,i)}}if(d>0){const t=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR,i=A/a.PATH_SCALE*(r.DURATION_LINE_SCALES.get(d)??1);for(let s=0;s<d;s++){const n=t+s*e,h=(0,o.drawSVGPath)(S,a.underlinePath,p,n,i,1);(0,o.setStroke)(h,this.config.noteColor,r.LINE_STROKE_WIDTH)}}let E=T+l;if(g>0){const t=this.config.noteHeight*r.DOT_SIZE_FACTOR,e=t/(.15*a.PATH_SCALE);for(let i=0;i<g;i++)(0,o.drawSVGPath)(S,a.dotPath,E,0,e,e),E+=t+l;T=E+l}const I=T;if(e.tiedTo&&!m)i.set(e,{g:S,xNoteRight:I,yNoteBaseline:0});else if(e.tiedFrom){let t=e.tiedFrom;for(;t.tiedFrom;)t=t.tiedFrom;const s=i.get(t);if(s){const n=1*s.xNoteRight,r=(m?p-2.2*this.estimatedNoteWidth:p-l)-n,h=1.2*-this.config.noteHeight,u=r/a.PATH_SCALE*1.3,c=this.config.noteHeight/a.PATH_SCALE*1.6;r>1&&(0,o.drawSVGPath)(s.g,a.tiePath,n-(s.g.getCTM()?.e??0),h,u,c);let d=t;for(;d&&d!==e;){i.delete(d);const t=d.tiedTo;t&&(d=t)}}else console.warn("Missing linked SVG details for first tied note:",t)}h=Math.max(h,T)}),h-e}drawRest(t,e,i){const s=`${this.numberFontSize}px`,n=.1*this.estimatedNoteWidth,{durationLines:h=0,augmentationDots:l=0}=t;let u=e,c=u;const d=(0,o.drawSVGText)(i,"0",u,0,s,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width;if(c=u+d,h>0){const t=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR,s=d/a.PATH_SCALE*(r.DURATION_LINE_SCALES.get(h)??1);for(let n=0;n<h;n++){const h=t+n*e,l=(0,o.drawSVGPath)(i,a.underlinePath,u,h,s,1);(0,o.setStroke)(l,this.config.noteColor,r.LINE_STROKE_WIDTH)}}let g=c+n;if(l>0){const t=this.config.noteHeight*r.DOT_SIZE_FACTOR,e=t/(.15*a.PATH_SCALE);for(let s=0;s<l;s++)(0,o.drawSVGPath)(i,a.dotPath,g,0,e,e),g+=t+n;c=g+n}return c-e}drawSignatures(t,e,i,s){let n=e;const r=.3*this.estimatedNoteWidth,a=`${this.smallFontSize}px`,h=`${this.numberFontSize}px`;if(i){const e=`1=${u.PITCH_CLASS_NAMES[this.currentKey%12]??"C"}`;n+=(0,o.drawSVGText)(t,e,n,0,h,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width+2*r}if(s){const e=`${this.currentTimeSignature.numerator}/${this.currentTimeSignature.denominator}`;n+=(0,o.drawSVGText)(t,e,n,0,a,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width+r}const l=n-e;try{const e=t.getBBox(),i=e.y,s=e.y+e.height,n=Math.max(this.yBaseline+s,this.yBaseline-i)+.5*this.config.noteHeight;this.height=Math.max(this.height,n)}catch(t){}return t===this.overlayG&&this.config.pixelsPerTimeStep>0&&(this.signaturesBlinking=!0,(0,o.setBlinkAnimation)(this.overlayG,!0)),l}updateCurrentKey(t){const e=this.jianpuModel.measuresInfo.keySignatureAtQ(t,!0);return-1!==e&&e!==this.currentKey&&(this.currentKey=e,!0)}updateCurrentTimeSignature(t){const e=this.jianpuModel.measuresInfo.timeSignatureAtQ(t,!0);return!(!e||e.numerator===this.currentTimeSignature.numerator&&e.denominator===this.currentTimeSignature.denominator)&&(this.currentTimeSignature=e,!0)}handleScrollEvent=t=>{this.lastKnownScrollLeft=this.parentElement.scrollLeft,this.isScrolling||window.requestAnimationFrame(()=>{this.updateOverlaySignaturesForScroll(this.lastKnownScrollLeft),this.isScrolling=!1}),this.isScrolling=!0};scrollIntoViewIfNeeded(t){const e=this.parentElement.getBoundingClientRect().width,i=this.parentElement.scrollLeft;let s=i;if(this.config.scrollType===n.PAGE){const n=20;t<i+n?s=t-n:t>i+e-n&&(s=t-e+n)}else{s=t-.5*e}s=Math.max(0,Math.min(s,this.parentElement.scrollWidth-e)),Math.abs(s-i)>1&&(this.parentElement.scrollTo({left:s,behavior:"smooth"}),this.updateOverlaySignaturesForScroll(s))}updateOverlaySignaturesForScroll(t){const e=this.pixelsToTime(t),i=this.jianpuModel.measuresInfo.keySignatureAtQ(e),s=this.jianpuModel.measuresInfo.timeSignatureAtQ(e)??this.currentTimeSignature;let n=!1;if(i!==this.currentKey&&(this.currentKey=i,n=!0),s.numerator===this.currentTimeSignature.numerator&&s.denominator===this.currentTimeSignature.denominator||(this.currentTimeSignature=s,n=!0),n){for(;this.overlayG.lastChild;)this.overlayG.removeChild(this.overlayG.lastChild);this.drawSignatures(this.overlayG,0,!0,!0),t<10&&this.config.pixelsPerTimeStep>0?((0,o.setBlinkAnimation)(this.overlayG,!0),this.signaturesBlinking=!0):this.config.pixelsPerTimeStep>0&&((0,o.setBlinkAnimation)(this.overlayG,!1),this.signaturesBlinking=!1)}}pixelsToTime(t){return this.config.pixelsPerTimeStep<=0?0:this.jianpuModel.measuresInfo.timeToQuarters(t/this.config.pixelsPerTimeStep,0)}}return s})());
|
package/es6/lib.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.lib=e():t.lib=e()}(self,()=>(()=>{"use strict";var t={644(t,e,i){i.r(e),i.d(e,{DEFAULT_KEY_SIGNATURE:()=>o.DEFAULT_KEY_SIGNATURE,DEFAULT_TEMPO:()=>o.DEFAULT_TEMPO,DEFAULT_TIME_SIGNATURE:()=>o.DEFAULT_TIME_SIGNATURE,JianpuBlock:()=>r.JianpuBlock,JianpuModel:()=>n.JianpuModel,JianpuSVGRender:()=>s.JianpuSVGRender,ScrollType:()=>s.ScrollType,getMeasureLength:()=>o.getMeasureLength,mapMidiToJianpu:()=>n.mapMidiToJianpu,splitJianpuNote:()=>r.splitJianpuNote});var s=i(313),n=i(849),r=i(765),o=i(830)},765(t,e,i){i.d(e,{JianpuBlock:()=>o,splitJianpuNote:()=>r});var s=i(559);function n(t){return Math.abs(t)<1e-6}function r(t,e){const i=t.start+t.length;if(e<=t.start||e>=i||n(i-e))return null;const s=i-e;t.length=e-t.start;const r={start:e,length:s,pitch:t.pitch,intensity:t.intensity,jianpuNumber:t.jianpuNumber,octaveDot:t.octaveDot,accidental:0,tiedFrom:t};return t.tiedTo&&(r.tiedTo=t.tiedTo,t.tiedTo.tiedFrom=r),t.tiedTo=r,r}class o{start;length;notes;measureNumber;durationLines;augmentationDots;augmentationDash;beatBegin;beatEnd;isTieStart;isTieEnd;constructor(t=0,e=0,i=[],s=1){this.start=t,this.length=e,this.notes=i,this.measureNumber=s}addNote(t){if(0===this.notes.length)return this.start=t.start,this.length=t.length,this.notes.push(t),!0;if(!n(this.start-t.start))return console.warn(`JianpuBlock: Attempted to add note at ${t.start} to block starting at ${this.start}. Ignoring.`),!1;let e=!1,i=!1;for(let s=0;s<this.notes.length;s++)if(this.notes[s].pitch===t.pitch){i=!0,t.length<this.notes[s].length&&(this.notes[s].tiedFrom&&(t.tiedFrom=this.notes[s].tiedFrom,t.tiedFrom&&(t.tiedFrom.tiedTo=t)),this.notes[s].tiedTo&&(t.tiedTo=this.notes[s].tiedTo,t.tiedTo&&(t.tiedTo.tiedFrom=t)),this.notes[s]=t,e=!0);break}i||this.notes.push(t);let s=1/0;for(const t of this.notes)s=Math.min(s,t.length);return this.length=s,!i||e}split(t,e){const i=this.start+this.length;if(t<=this.start||t>=i||n(i-t))return null;const s=i-t,a=t-this.start,h=new o(t,s,[],e.measureNumberAtQ(t)),l=[];for(const e of this.notes){const i=e.start+e.length;if(i>t+1e-6){const i=r(e,t);i?l.push(i):console.warn("Split failed for note, unexpected state.")}else n(i-t)}return l.forEach(t=>h.addNote(t)),this.length=a,delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash,this.beatEnd&&(h.beatEnd=!0,delete this.beatEnd),this.isTieEnd&&(h.isTieStart=!0,delete this.isTieEnd),h}splitToBeat(t){const e=t.timeSignatureAtQ(this.start);if(!e)return null;const i=t.measureLengthAtQ(this.start),s=t.measureNumberAtQ(this.start),r=this.start-(s-Math.floor(s))*i,o=this.start-r,a=4/e.denominator,h=o/a;this.beatBegin=n(h-Math.round(h));const l=r+(Math.floor(h+1e-6)+1)*a,u=r+i,c=this.start+this.length;let d=null;l<c-1e-6&&l>this.start+1e-6&&(d=l),u<c-1e-6&&u>this.start+1e-6&&(null===d||u<d)&&(d=u);let g=null;if(null!==d)g=this.split(d,t),g&&(this.beatEnd=!0);else{const t=(o+this.length)/a;this.beatEnd=n(t-Math.round(t)),this.beatEnd||(this.beatEnd=n(c-u))}return this.isTieStart=this.notes.some(t=>t.tiedFrom),this.isTieEnd=this.notes.some(t=>t.tiedTo),g&&(g.isTieStart=g.notes.some(t=>t.tiedFrom),g.isTieEnd=g.notes.some(t=>t.tiedTo),this.notes.some(t=>t.tiedTo&&t.start+t.length>d)&&delete this.isTieEnd),g}calculateRenderProperties(t){delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash;const e=this.length;if(n(e)||e<0)return;if(t.allowDottedRests||this.notes.length>0){if(n(e-1.5))return void(this.augmentationDots=1);if(n(e-.75))return this.durationLines=1,void(this.augmentationDots=1);if(n(e-.375))return this.durationLines=2,void(this.augmentationDots=1);n(e-3)&&(this.augmentationDots=1)}if(this.durationLines=e>=3.999999||e>=1.999999||e>=.999999?0:e>=.499999?1:e>=.249999?2:e>=.124999?3:4,this.augmentationDash=!1,1===this.notes.length){const e=this.notes[0],i=t.timeSignatureAtQ(this.start);if(!i)return;const s=Math.max(4/i.denominator,1);if(!(this.measureNumber%1<=1e-6)&&e.tiedFrom&&n(e.tiedFrom.length-s)&&e.tiedFrom.pitch===e.pitch&&e.length>=1){let i=!0;if(e.tiedTo){const s=e.start+e.length;i=Math.floor(t.measureNumberAtQ(this.start))===Math.floor(t.measureNumberAtQ(s))&&e.tiedTo.length>=1}i&&(this.augmentationDash=!0)}}}splitToStandardSymbol(t){const e=this.length;if(n(e)||e<s.MIN_RESOLUTION-1e-6)return null;const i=[];t.allowDottedRests||this.notes.length>0?(i.push(6),i.push(4),i.push(3),i.push(2),i.push(1.5),i.push(1),i.push(.75),i.push(.5),i.push(.375),i.push(.25),i.push(.125),i.push(.0625)):(i.push(4),i.push(2),i.push(1),i.push(.5),i.push(.25),i.push(.125),i.push(.0625));let r=0;for(const t of i)if(e>=t-1e-6){r=t;break}n(r)&&(r=s.MIN_RESOLUTION,e<r-1e-6&&e>1e-6&&console.warn(`Block length ${e} is too small, rendering as ${r}`));let o=null;return e>r+1e-6?(o=this.split(this.start+r,t),this.length!==r&&(console.warn(`Adjusting block length after split from ${this.length} to ${r}`),this.length=r)):this.length=r,o}mergeToMap(t){const e=t.get(this.start);e?(this.notes.forEach(t=>e.addNote(t)),0!==this.measureNumber&&(e.measureNumber=this.measureNumber)):t.set(this.start,this)}isMeasureBeginning(){return n(this.measureNumber-Math.floor(this.measureNumber))}}},830(t,e,i){i.d(e,{getMeasureLength:()=>s});function s(t){return t.numerator*(4/t.denominator)}i.d(e,["DEFAULT_KEY_SIGNATURE",0,{start:0,key:0},"DEFAULT_TEMPO",0,{start:0,qpm:60},"DEFAULT_TIME_SIGNATURE",0,{start:0,numerator:4,denominator:4}])},849(t,e,i){i.d(e,{JianpuModel:()=>a,mapMidiToJianpu:()=>h});var s=i(830),n=i(775),r=i(765),o=i(559);class a{jianpuInfo;measuresInfo;jianpuBlockMap;lastQ;constructor(t,e){this.jianpuInfo=t,this.jianpuBlockMap=new Map,this.lastQ=0,this.update(t,e)}isLastMeasureAtQ(t){return t>=this.lastQ-1e-6}getTotalDuration(){return this.lastQ}update(t,e){this.jianpuInfo=t,t.notes.sort((t,e)=>t.start-e.start),this.lastQ=0,t.notes.forEach(t=>{this.lastQ=Math.max(this.lastQ,t.start+t.length)}),this.lastQ+=1e-6,t.tempos=t.tempos&&t.tempos.length?t.tempos:[s.DEFAULT_TEMPO],t.tempos.sort((t,e)=>t.start-e.start),t.tempos[0].start>1e-6&&t.tempos.unshift({...s.DEFAULT_TEMPO,start:0});const i=void 0!==e?{start:0,key:e}:{...s.DEFAULT_KEY_SIGNATURE};t.keySignatures=t.keySignatures&&t.keySignatures.length?t.keySignatures:[i],t.keySignatures.sort((t,e)=>t.start-e.start),t.keySignatures[0].start>1e-6&&t.keySignatures.unshift({...i,start:0}),t.timeSignatures=t.timeSignatures&&t.timeSignatures.length?t.timeSignatures:[s.DEFAULT_TIME_SIGNATURE],t.timeSignatures.sort((t,e)=>t.start-e.start),t.timeSignatures[0].start>1e-6&&t.timeSignatures.unshift({...s.DEFAULT_TIME_SIGNATURE,start:0}),this.measuresInfo=new n.MeasuresInfo(t,this.lastQ),this.infoToBlocks()}infoToBlocks(){const t=new Map;let e=0;if(this.jianpuInfo.notes.forEach(i=>{const s=i.start,n=this.measuresInfo.measureNumberAtQ(s);if(s>e+1e-6){const i=e,n=s-i,o=this.measuresInfo.measureNumberAtQ(i),a=new r.JianpuBlock(i,n,[],o);t.set(i,a)}const o=this.measuresInfo.keySignatureAtQ(s),a=this.createJianpuNote(i,o);let h=t.get(s);h||(h=new r.JianpuBlock(s,0,[],n),t.set(s,h)),h.addNote(a),e=Math.max(e,s+h.length)}),this.lastQ>e+1e-6){const i=e,s=this.lastQ-1e-6-i;if(s>1e-6){const e=this.measuresInfo.measureNumberAtQ(i),n=new r.JianpuBlock(i,s,[],e);t.set(i,n)}}this.jianpuBlockMap=new Map;const i=Array.from(t.keys()).sort((t,e)=>t-e);let s=[];i.forEach(e=>{s.push(t.get(e))});const n=new Set;for(;s.length>0;){let t=s.shift();n.has(t.start)&&this.jianpuBlockMap.has(t.start);let e=t.splitToBeat(this.measuresInfo);if(e){t.mergeToMap(this.jianpuBlockMap),n.add(t.start),s.unshift(e);continue}let i=t,r=null;do{r=i.splitToStandardSymbol(this.measuresInfo),i.mergeToMap(this.jianpuBlockMap),n.add(i.start),r&&(i=r)}while(r)}this.jianpuBlockMap.forEach(t=>{t.calculateRenderProperties(this.measuresInfo)})}createJianpuNote(t,e){const i=h(t.pitch,e);return{...t,jianpuNumber:i.jianpuNumber,octaveDot:i.octaveDot,accidental:i.accidental}}}function h(t,e){const i=e%12;let s=o.MIDDLE_C_MIDI+i;i>o.MIDDLE_C_MIDI%12&&(s-=12);const n=(t-(s+12*Math.round((t-s)/12))+12)%12;let r=o.MAJOR_SCALE_INTERVALS[n],a=0;if(void 0===r){switch(n){case 1:r=o.MAJOR_SCALE_INTERVALS[0],a=1;break;case 3:r=o.MAJOR_SCALE_INTERVALS[4],a=2;break;case 6:r=o.MAJOR_SCALE_INTERVALS[5],a=1;break;case 8:r=o.MAJOR_SCALE_INTERVALS[9],a=2;break;case 10:r=o.MAJOR_SCALE_INTERVALS[11],a=2;break;default:{console.warn(`Unexpected chromatic interval ${n} in mapMidiToJianpu. Defaulting to sharp of lower valid degree.`);const i=(n-1+12)%12,s=(n+1+12)%12,h=o.MAJOR_SCALE_INTERVALS[i],l=o.MAJOR_SCALE_INTERVALS[s];void 0!==h?(r=h,a=1):void 0!==l?(r=l,a=2):(r=1,a=1,console.error(`Could not determine Jianpu number components for MIDI ${t}, interval ${n} from tonic in key ${e}.`));break}}void 0===r&&(console.error(`Jianpu number became undefined for MIDI ${t} (interval ${n}, key ${e}) after chromatic processing. This indicates a logic error or misconfigured MAJOR_SCALE_INTERVALS.`),r=1,a=1)}return{jianpuNumber:r,octaveDot:Math.floor((t-s)/12),accidental:a}}},313(t,e,i){i.d(e,{JianpuSVGRender:()=>u,ScrollType:()=>s});var s,n=i(240),r=i(134),o=i(961),a=i(830),h=i(849),l=i(559);!function(t){t[t.PAGE=0]="PAGE",t[t.NOTE=1]="NOTE",t[t.BAR=2]="BAR"}(s||(s={}));class u{jianpuInfo;jianpuModel;config;height;width;parentElement;div;mainSVG;mainG;musicG;signaturesG;overlaySVG;overlayG;signaturesBlinking;lastKnownScrollLeft;isScrolling;currentKey;currentTimeSignature;playingNotes;lastRenderedQ;estimatedNoteWidth;numberFontSize;smallFontSize;yBaseline;parseColorString(t){return/^[a-z]+$/i.test(t)||t.startsWith("rgb(")?t:/^\d+,\s*\d+,\s*\d+$/.test(t)?`rgb(${t})`:t}constructor(t,e,i){this.jianpuInfo=t,this.div=i;this.config={noteHeight:e.noteHeight??20,noteSpacingFactor:e.noteSpacingFactor??n.COMPACT_SPACING_FACTOR,pixelsPerTimeStep:e.pixelsPerTimeStep??0,noteColor:this.parseColorString(e.noteColor??"black"),activeNoteColor:this.parseColorString(e.activeNoteColor??"red"),defaultKey:e.defaultKey??0,scrollType:e.scrollType??s.PAGE,fontFamily:e.fontFamily??"sans-serif",width:e.width??0,height:e.height??0},this.jianpuModel=new h.JianpuModel(this.jianpuInfo,this.config.defaultKey),this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??a.DEFAULT_TIME_SIGNATURE,this.playingNotes=new Map,this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.numberFontSize=this.config.noteHeight*n.FONT_SIZE_MULTIPLIER,this.smallFontSize=this.config.noteHeight*n.SMALL_FONT_SIZE_MULTIPLIER,this.estimatedNoteWidth=.6*this.numberFontSize,this.yBaseline=1.5*this.config.noteHeight,this.height=0,this.width=0,this.clear(),this.redraw()}clear(){for(;this.div.lastChild;)this.div.removeChild(this.div.lastChild);this.div.style.position="relative",this.div.style.overflow="hidden",this.overlaySVG=document.createElementNS(r.SVGNS,"svg"),this.overlaySVG.style.position="absolute",this.overlaySVG.style.left="0",this.overlaySVG.style.top="0",this.overlaySVG.style.pointerEvents="none",this.div.appendChild(this.overlaySVG),this.overlayG=(0,r.createSVGGroupChild)(this.overlaySVG,"overlay"),this.parentElement=document.createElement("div"),this.parentElement.style.overflowX="auto",this.parentElement.style.overflowY="hidden",this.parentElement.style.width="100%",this.parentElement.style.height="100%",this.div.appendChild(this.parentElement),this.parentElement.addEventListener("scroll",this.handleScrollEvent),this.mainSVG=document.createElementNS(r.SVGNS,"svg"),this.mainSVG.style.display="block",this.parentElement.appendChild(this.mainSVG),this.mainG=(0,r.createSVGGroupChild)(this.mainSVG,"main-content"),this.signaturesG=(0,r.createSVGGroupChild)(this.mainG,"signatures"),this.musicG=(0,r.createSVGGroupChild)(this.mainG,"music"),this.playingNotes.clear(),this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.height=this.config.height>0?this.config.height:5*this.config.noteHeight,this.width=this.config.width>0?this.config.width:0,this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??a.DEFAULT_TIME_SIGNATURE,this.drawSignatures(this.overlayG,0,!0,!0),this.updateLayout()}updateLayout(t){this.width=t??this.width,this.config.width>0&&(this.width=this.config.width),this.height=Math.max(this.height,6*this.config.noteHeight),this.config.height>0&&(this.height=this.config.height);const e=1.65*this.config.noteHeight;this.mainSVG.setAttribute("width",`${this.width}`),this.mainSVG.setAttribute("height",`${this.height}`),this.mainG.setAttribute("transform",`translate(0, ${this.yBaseline+e})`),this.overlaySVG.setAttribute("width","200"),this.overlaySVG.setAttribute("height",`${this.height}`),this.overlayG.setAttribute("transform",`translate(0, ${this.yBaseline})`)}redraw(t,e){let i=-1;const n=this.config.pixelsPerTimeStep<=0;if(t){const o=`${t.start}-${t.pitch}`;if(this.playingNotes.forEach((t,e)=>{if(e!==o){const t=this.mainSVG.querySelector(`g[data-id="${e}"]`);t&&(0,r.resetElementHighlight)(t,this.config.noteColor),this.playingNotes.delete(e)}}),!this.playingNotes.has(o)){const n=this.mainSVG.querySelector(`g[data-id="${o}"]`);if(n){(0,r.highlightElement)(n,this.config.activeNoteColor),this.playingNotes.set(o,t);const a=n.getBoundingClientRect(),h=this.mainSVG.getBoundingClientRect();i=a.left-h.left+this.parentElement.scrollLeft;const l=n.hasAttribute("data-is-measure-start");e&&(this.config.scrollType!==s.BAR||l)&&this.scrollIntoViewIfNeeded(i)}}if(!n&&this.signaturesBlinking){const e=this.overlayG.getBoundingClientRect().width;this.jianpuModel.measuresInfo.quartersToTime(t.start,t.start)*this.config.pixelsPerTimeStep>e&&(this.signaturesBlinking=!1,(0,r.setBlinkAnimation)(this.overlayG,!1))}}else{this.jianpuModel.update(this.jianpuInfo,this.config.defaultKey);let t=this.width,e=this.width,i=this.height>0?this.height-this.yBaseline:3*this.config.noteHeight,s=0;const r=new Map;this.jianpuModel.jianpuBlockMap.forEach((o,a)=>{if(a>=this.lastRenderedQ-1e-9){t=n?e:this.jianpuModel.measuresInfo.quartersToTime(a,a)*this.config.pixelsPerTimeStep;const h=this.drawJianpuBlock(o,t,r);n?e+=h:e=Math.max(e,t+h);const l=this.mainSVG.querySelector(`g[data-block-start="${o.start}"]`);if(l)try{const t=l.getBBox(),e=t.y,n=t.y+t.height;s=Math.min(s,e),i=Math.max(i,n)}catch(t){}this.lastRenderedQ=a+o.length}}),this.height=Math.max(this.height,i-s+this.config.noteHeight),this.updateLayout(e)}return i}drawJianpuBlock(t,e,i){let s=0;const a=this.config.pixelsPerTimeStep<=0,h=t.isMeasureBeginning(),l=(0,r.createSVGGroupChild)(this.musicG,`block-${t.start}`);if(l.setAttribute("data-block-start",`${t.start}`),h&&t.start>1e-6){const t=e-(a?.6*this.estimatedNoteWidth:4),i=2*this.config.noteHeight,h=0,l=(0,r.drawSVGPath)(this.musicG,o.barPath,t,h,1,i/o.PATH_SCALE);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH),a&&(s+=n.LINE_STROKE_WIDTH)}const u=this.updateCurrentKey(t.start),c=this.updateCurrentTimeSignature(t.start);let d=0;if((u||c)&&t.start>1e-6){const t=e+s;d=this.drawSignatures(this.signaturesG,t,u,c),a&&(s+=d+.2*this.estimatedNoteWidth)}const g=e+s;let m=0;if(t.notes.length>0?m=this.drawNotes(t,g,i,l):t.length>1e-6&&(m=this.drawRest(t,g,l)),a){s+=m;let e=this.estimatedNoteWidth*this.config.noteSpacingFactor;t.beatEnd?e*=1:t.length<.0625?e*=.05:t.length<.125?e*=.1:t.length<.25?e*=.2:t.length<.5?e*=.4:t.length<1&&(e*=.5),s+=e}else s=Math.max(d,m);if(this.jianpuModel.isLastMeasureAtQ(t.start+t.length)){const t=e+s,i=2*this.config.noteHeight,h=0,l=(0,r.drawSVGPath)(this.musicG,o.barPath,t,h,1,i/o.PATH_SCALE);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH),a&&(s+=n.LINE_STROKE_WIDTH)}return s}drawNotes(t,e,i,s){let a=e,h=e;const l=.1*this.estimatedNoteWidth,u=`${this.numberFontSize}px`,c=`${this.smallFontSize}px`,{durationLines:d=0,augmentationDots:g=0,augmentationDash:m=!1}=t;return t.notes.forEach(e=>{const S=`${e.start}-${e.pitch}`,f=(0,r.createSVGGroupChild)(s,S);t.isMeasureBeginning()&&f.setAttribute("data-is-measure-start","true");let p=a,T=p;if(0!==e.accidental){const t=o.ACCIDENTAL_TEXT[e.accidental];(0,r.drawSVGText)(f,t,p+l,0,c,"normal","end","text-top",this.config.noteColor)}let E=0;if(m){const t=this.config.noteHeight*n.AUGMENTATION_DASH_FACTOR,e=t/50,i=(0,r.drawSVGPath)(f,o.augmentationDashPath,p,0,e,1);(0,r.setStroke)(i,this.config.noteColor,n.LINE_STROKE_WIDTH),E=t,T=p+E}else{const t=`${e.jianpuNumber}`;E=(0,r.drawSVGText)(f,t,p,0,u,"normal","start","middle",this.config.noteColor).getBBox().width,T=p+E}if(0!==e.octaveDot&&!1===m){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,i=t/(.15*o.PATH_SCALE),s=p+E/2,a=2.8*t,h=this.config.noteHeight*n.OCTAVE_DOT_OFFSET_FACTOR;for(let t=0;t<Math.abs(e.octaveDot);t++){const n=(e.octaveDot>0?-h:.6*h)-t*a*(e.octaveDot>0?1:-1);(0,r.drawSVGPath)(f,o.dotPath,s,n,i,i)}}if(d>0){const t=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR,i=E/o.PATH_SCALE*(n.DURATION_LINE_SCALES.get(d)??1);for(let s=0;s<d;s++){const a=t+s*e,h=(0,r.drawSVGPath)(f,o.underlinePath,p,a,i,1);(0,r.setStroke)(h,this.config.noteColor,n.LINE_STROKE_WIDTH)}}let A=T+l;if(g>0){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,e=t/(.15*o.PATH_SCALE);for(let i=0;i<g;i++)(0,r.drawSVGPath)(f,o.dotPath,A,0,e,e),A+=t+l;T=A+l}const I=T;if(e.tiedTo&&!m)i.set(e,{g:f,xNoteRight:I,yNoteBaseline:0});else if(e.tiedFrom){let t=e.tiedFrom;for(;t.tiedFrom;)t=t.tiedFrom;const s=i.get(t);if(s){const n=1*s.xNoteRight,a=(m?p-2.2*this.estimatedNoteWidth:p-l)-n,h=1.2*-this.config.noteHeight,u=a/o.PATH_SCALE*1.3,c=this.config.noteHeight/o.PATH_SCALE*1.6;a>1&&(0,r.drawSVGPath)(s.g,o.tiePath,n-(s.g.getCTM()?.e??0),h,u,c);let d=t;for(;d&&d!==e;){i.delete(d);const t=d.tiedTo;t&&(d=t)}}else console.warn("Missing linked SVG details for first tied note:",t)}h=Math.max(h,T)}),h-e}drawRest(t,e,i){const s=`${this.numberFontSize}px`,a=.1*this.estimatedNoteWidth,{durationLines:h=0,augmentationDots:l=0}=t;let u=e,c=u;const d=(0,r.drawSVGText)(i,"0",u,0,s,"normal","start","middle",this.config.noteColor).getBBox().width;if(c=u+d,h>0){const t=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR,s=d/o.PATH_SCALE*(n.DURATION_LINE_SCALES.get(h)??1);for(let a=0;a<h;a++){const h=t+a*e,l=(0,r.drawSVGPath)(i,o.underlinePath,u,h,s,1);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH)}}let g=c+a;if(l>0){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,e=t/(.15*o.PATH_SCALE);for(let s=0;s<l;s++)(0,r.drawSVGPath)(i,o.dotPath,g,0,e,e),g+=t+a;c=g+a}return c-e}drawSignatures(t,e,i,s){let n=e;const o=.3*this.estimatedNoteWidth,a=`${this.smallFontSize}px`,h=`${this.numberFontSize}px`;if(i){const e=`1=${l.PITCH_CLASS_NAMES[this.currentKey%12]??"C"}`;n+=(0,r.drawSVGText)(t,e,n,0,h,"normal","start","middle",this.config.noteColor).getBBox().width+2*o}if(s){const e=`${this.currentTimeSignature.numerator}/${this.currentTimeSignature.denominator}`;n+=(0,r.drawSVGText)(t,e,n,0,a,"normal","start","middle",this.config.noteColor).getBBox().width+o}const u=n-e;try{const e=t.getBBox(),i=e.y,s=e.y+e.height,n=Math.max(this.yBaseline+s,this.yBaseline-i)+.5*this.config.noteHeight;this.height=Math.max(this.height,n)}catch(t){}return t===this.overlayG&&this.config.pixelsPerTimeStep>0&&(this.signaturesBlinking=!0,(0,r.setBlinkAnimation)(this.overlayG,!0)),u}updateCurrentKey(t){const e=this.jianpuModel.measuresInfo.keySignatureAtQ(t,!0);return-1!==e&&e!==this.currentKey&&(this.currentKey=e,!0)}updateCurrentTimeSignature(t){const e=this.jianpuModel.measuresInfo.timeSignatureAtQ(t,!0);return!(!e||e.numerator===this.currentTimeSignature.numerator&&e.denominator===this.currentTimeSignature.denominator)&&(this.currentTimeSignature=e,!0)}handleScrollEvent=t=>{this.lastKnownScrollLeft=this.parentElement.scrollLeft,this.isScrolling||window.requestAnimationFrame(()=>{this.updateOverlaySignaturesForScroll(this.lastKnownScrollLeft),this.isScrolling=!1}),this.isScrolling=!0};scrollIntoViewIfNeeded(t){const e=this.parentElement.getBoundingClientRect().width,i=this.parentElement.scrollLeft;let n=i;if(this.config.scrollType===s.PAGE){const s=20;t<i+s?n=t-s:t>i+e-s&&(n=t-e+s)}else{n=t-.5*e}n=Math.max(0,Math.min(n,this.parentElement.scrollWidth-e)),Math.abs(n-i)>1&&(this.parentElement.scrollTo({left:n,behavior:"smooth"}),this.updateOverlaySignaturesForScroll(n))}updateOverlaySignaturesForScroll(t){const e=this.pixelsToTime(t),i=this.jianpuModel.measuresInfo.keySignatureAtQ(e),s=this.jianpuModel.measuresInfo.timeSignatureAtQ(e)??this.currentTimeSignature;let n=!1;if(i!==this.currentKey&&(this.currentKey=i,n=!0),s.numerator===this.currentTimeSignature.numerator&&s.denominator===this.currentTimeSignature.denominator||(this.currentTimeSignature=s,n=!0),n){for(;this.overlayG.lastChild;)this.overlayG.removeChild(this.overlayG.lastChild);this.drawSignatures(this.overlayG,0,!0,!0),t<10&&this.config.pixelsPerTimeStep>0?((0,r.setBlinkAnimation)(this.overlayG,!0),this.signaturesBlinking=!0):this.config.pixelsPerTimeStep>0&&((0,r.setBlinkAnimation)(this.overlayG,!1),this.signaturesBlinking=!1)}}pixelsToTime(t){return this.config.pixelsPerTimeStep<=0?0:this.jianpuModel.measuresInfo.timeToQuarters(t/this.config.pixelsPerTimeStep,0)}}},775(t,e,i){i.d(e,{MeasuresInfo:()=>r});var s=i(830),n=i(559);class r{measuresInfo;allowDottedRests=!0;constructor(t,e){if(this.measuresInfo=[],!(e>0))return;const i=r.getSortedChanges(t.tempos,s.DEFAULT_TEMPO),n=r.getSortedChanges(t.keySignatures,s.DEFAULT_KEY_SIGNATURE),o=r.getSortedChanges(t.timeSignatures,s.DEFAULT_TIME_SIGNATURE);let a=0,h=0,l=0,u=i[0].event,c=n[0].event,d=o[0].event,g=1,m=(0,s.getMeasureLength)(d),S=d.start;const f=[0];i.forEach(t=>f.push(t.start)),n.forEach(t=>f.push(t.start)),o.forEach(t=>f.push(t.start)),f.sort((t,e)=>t-e);let p=-1;for(let t=0;t<f.length;t++){const r=f[t];if(r>=e)break;if(r===p)continue;p=r;let T=!1,E=!1,A=!1;for(;a<i.length&&i[a].start<=r;)u=i[a++].event,T=!0;for(;h<n.length&&n[h].start<=r;)c=n[h++].event,E=!0;for(;l<o.length&&o[l].start<=r;){g+=(o[l].event.start-S)/m,g=Math.round(1e3*g)/1e3,d=o[l++].event,m=(0,s.getMeasureLength)(d),S=r,A=!0}const I={start:r,measureNumber:g+(r-S)/m,measureLength:m,tempo:u,keySignature:c,timeSignature:d};T&&(I.tempoChange=!0),E&&(I.keyChange=!0),A&&(I.timeChange=!0),this.measuresInfo.push(I)}}static getSortedChanges(t,e){const i=t&&t.length?t.slice():[e];return i.sort((t,e)=>t.start-e.start),i.map(t=>({start:Math.max(0,Math.round(t.start/n.MIN_RESOLUTION)*n.MIN_RESOLUTION),event:t}))}findIndex(t){let e=0,i=this.measuresInfo.length-1,s=0;for(;e<=i;){const n=Math.floor((e+i)/2);this.measuresInfo[n].start<=t?(s=n,e=n+1):i=n-1}return s}measureNumberAtQ(t){if(0===this.measuresInfo.length)return 1;const e=this.findIndex(t),i=this.measuresInfo[e],s=(t-i.start)/i.measureLength;return i.measureNumber+s+1e-9}measureLengthAtQ(t){if(0===this.measuresInfo.length)return(0,s.getMeasureLength)(s.DEFAULT_TIME_SIGNATURE);const e=this.findIndex(t);return this.measuresInfo[e].measureLength}tempoAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TEMPO.qpm;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.tempoChange&&o?r.tempo.qpm:-1}keySignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_KEY_SIGNATURE.key;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.keyChange&&o?r.keySignature.key:-1}timeSignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TIME_SIGNATURE;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.timeChange&&o?r.timeSignature:null}quartersToTime(t,e){const i=this.tempoAtQ(e);return i<=0?0:t/i*60}timeToQuarters(t,e){const i=this.tempoAtQ(e);if(i<=0)return 0;const s=t*i/60;return Math.round(s*n.MAX_QUARTER_DIVISION)/n.MAX_QUARTER_DIVISION}isBeatStart(t){if(0===this.measuresInfo.length)return!1;const e=this.findIndex(t),i=this.measuresInfo[e],s=i.timeSignature,r=(t-(i.start-(i.measureNumber-Math.floor(i.measureNumber))*i.measureLength))/(4/s.denominator);return Math.abs(r-Math.round(r))<n.MIN_RESOLUTION/2}}},559(t,e,i){i.d(e,["MAJOR_SCALE_INTERVALS",0,{0:1,2:2,4:3,5:4,7:5,9:6,11:7},"MAX_QUARTER_DIVISION",0,240,"MIDDLE_C_MIDI",0,60,"MIN_RESOLUTION",0,.0625,"PITCH_CLASS_NAMES",0,["C","C#","D","D#","E","F","F#","G","G#","A","A#","B"]])},240(t,e,i){const s=new Map([[1,1.78],[2,1.6],[3,1.3],[4,1.15]]);i.d(e,["AUGMENTATION_DASH_FACTOR",0,.8,"COMPACT_SPACING_FACTOR",0,1.5,"DOT_SIZE_FACTOR",0,.1,"DURATION_LINE_SCALES",0,s,"FONT_SIZE_MULTIPLIER",0,1.2,"LINE_STROKE_WIDTH",0,1,"OCTAVE_DOT_OFFSET_FACTOR",0,1,"SMALL_FONT_SIZE_MULTIPLIER",0,.75,"UNDERLINE_SPACING_FACTOR",0,.2])},961(t,e,i){i.d(e,["ACCIDENTAL_TEXT",0,["","#","b"],"PATH_SCALE",0,100,"augmentationDashPath",0,"m 0,0 h 50","barPath",0,"m 0,-50 v 100","dotPath",0,"M 0 0 a 15 15 0 1 0 0.0001 0 z","tiePath",0,"M -13,5 C 15,-15 65,-15 90,5 C 65,-25 15,-25 -13,5 Z","underlinePath",0,"m 0,0 h 100"])},134(t,e,i){i.d(e,{createSVGGroupChild:()=>o,drawSVGPath:()=>n,drawSVGText:()=>r,highlightElement:()=>l,resetElementHighlight:()=>u,setBlinkAnimation:()=>a,setStroke:()=>h});const s="http://www.w3.org/2000/svg";function n(t,e,i,n,r,o,a=1){const h=document.createElementNS(s,"path");return h.setAttributeNS(null,"d",e),h.setAttributeNS(null,"transform",`translate(${i}, ${n}) scale(${r}, ${o})`),a<1&&h.setAttributeNS(null,"opacity",`${a}`),t.appendChild(h),h}function r(t,e,i,n,r,o="normal",a="middle",h="middle",l="currentColor",u=1){const c=document.createElementNS(s,"text");c.setAttributeNS(null,"font-family","sans-serif"),c.setAttributeNS(null,"font-size",r),c.setAttributeNS(null,"font-weight",o),c.setAttributeNS(null,"x",`${i}`),c.setAttributeNS(null,"y",`${n}`),c.setAttributeNS(null,"text-anchor",a),c.setAttributeNS(null,"dominant-baseline",h),"currentColor"!==l&&c.setAttributeNS(null,"fill",l),u<1&&c.setAttributeNS(null,"opacity",`${u}`);const d=document.createTextNode(e);return c.appendChild(d),t.appendChild(c),c}function o(t,e){const i=document.createElementNS(s,"g");return e&&i.setAttribute("data-id",e),t.appendChild(i),i}function a(t,e=!0,i="1s"){let n=t.querySelector('animate[attributeName="opacity"]');return e?n?(n.setAttributeNS(null,"repeatCount","indefinite"),n.beginElement()):(n=document.createElementNS(s,"animate"),n.setAttributeNS(null,"attributeName","opacity"),n.setAttributeNS(null,"values","1;0.2;1"),n.setAttributeNS(null,"keyTimes","0;0.5;1"),n.setAttributeNS(null,"dur",i),n.setAttributeNS(null,"repeatCount","indefinite"),t.appendChild(n)):(n&&(n.endElement(),n.setAttributeNS(null,"repeatCount","0"),t.style.opacity="1"),t.style.opacity="1"),t}function h(t,e,i){t.setAttributeNS(null,"stroke",e),t.setAttributeNS(null,"stroke-width",`${i}`)}function l(t,e){const i=[];return t.matches("text, path")&&i.push(t),t.querySelectorAll("text, path").forEach(t=>{i.push(t)}),i.forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e)}),t}function u(t,e){t.querySelectorAll("text, path").forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e)})}i.d(e,["SVGNS",0,s])}};const e={};function i(s){const n=e[s];if(void 0!==n)return n.exports;const r=e[s]={exports:{}};return t[s](r,r.exports,i),r.exports}i.d=(t,e)=>{if(Array.isArray(e))for(var s=0;s<e.length;){var n=e[s++],r=e[s++],o=0===r?{enumerable:!0,value:e[s++]}:{enumerable:!0,get:r};i.o(t,n)||Object.defineProperty(t,n,o)}else for(var n in e)i.o(e,n)&&!i.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},i.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),i.r=t=>{Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};let s={};i.r(s);var n=i(644);return window.jr=n,s})());
|
|
1
|
+
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.lib=e():t.lib=e()}(self,()=>(()=>{"use strict";var t={644(t,e,i){i.r(e),i.d(e,{DEFAULT_KEY_SIGNATURE:()=>o.DEFAULT_KEY_SIGNATURE,DEFAULT_TEMPO:()=>o.DEFAULT_TEMPO,DEFAULT_TIME_SIGNATURE:()=>o.DEFAULT_TIME_SIGNATURE,JianpuBlock:()=>r.JianpuBlock,JianpuModel:()=>n.JianpuModel,JianpuSVGRender:()=>s.JianpuSVGRender,ScrollType:()=>s.ScrollType,getMeasureLength:()=>o.getMeasureLength,mapMidiToJianpu:()=>n.mapMidiToJianpu,splitJianpuNote:()=>r.splitJianpuNote});var s=i(313),n=i(849),r=i(765),o=i(830)},765(t,e,i){i.d(e,{JianpuBlock:()=>o,splitJianpuNote:()=>r});var s=i(559);function n(t){return Math.abs(t)<1e-6}function r(t,e){const i=t.start+t.length;if(e<=t.start||e>=i||n(i-e))return null;const s=i-e;t.length=e-t.start;const r={start:e,length:s,pitch:t.pitch,intensity:t.intensity,jianpuNumber:t.jianpuNumber,octaveDot:t.octaveDot,accidental:0,tiedFrom:t};return t.tiedTo&&(r.tiedTo=t.tiedTo,t.tiedTo.tiedFrom=r),t.tiedTo=r,r}class o{start;length;notes;measureNumber;durationLines;augmentationDots;augmentationDash;beatBegin;beatEnd;isTieStart;isTieEnd;constructor(t=0,e=0,i=[],s=1){this.start=t,this.length=e,this.notes=i,this.measureNumber=s}addNote(t){if(0===this.notes.length)return this.start=t.start,this.length=t.length,this.notes.push(t),!0;if(!n(this.start-t.start))return console.warn(`JianpuBlock: Attempted to add note at ${t.start} to block starting at ${this.start}. Ignoring.`),!1;let e=!1,i=!1;for(let s=0;s<this.notes.length;s++)if(this.notes[s].pitch===t.pitch){i=!0,t.length<this.notes[s].length&&(this.notes[s].tiedFrom&&(t.tiedFrom=this.notes[s].tiedFrom,t.tiedFrom&&(t.tiedFrom.tiedTo=t)),this.notes[s].tiedTo&&(t.tiedTo=this.notes[s].tiedTo,t.tiedTo&&(t.tiedTo.tiedFrom=t)),this.notes[s]=t,e=!0);break}i||this.notes.push(t);let s=1/0;for(const t of this.notes)s=Math.min(s,t.length);return this.length=s,!i||e}split(t,e){const i=this.start+this.length;if(t<=this.start||t>=i||n(i-t))return null;const s=i-t,a=t-this.start,h=new o(t,s,[],e.measureNumberAtQ(t)),l=[];for(const e of this.notes){const i=e.start+e.length;if(i>t+1e-6){const i=r(e,t);i?l.push(i):console.warn("Split failed for note, unexpected state.")}else n(i-t)}return l.forEach(t=>h.addNote(t)),this.length=a,delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash,this.beatEnd&&(h.beatEnd=!0,delete this.beatEnd),this.isTieEnd&&(h.isTieStart=!0,delete this.isTieEnd),h}splitToBeat(t){const e=t.timeSignatureAtQ(this.start);if(!e)return null;const i=t.measureLengthAtQ(this.start),s=t.measureNumberAtQ(this.start),r=this.start-(s-Math.floor(s))*i,o=this.start-r,a=4/e.denominator,h=o/a;this.beatBegin=n(h-Math.round(h));const l=r+(Math.floor(h+1e-6)+1)*a,u=r+i,c=this.start+this.length;let d=null;l<c-1e-6&&l>this.start+1e-6&&(d=l),u<c-1e-6&&u>this.start+1e-6&&(null===d||u<d)&&(d=u);let g=null;if(null!==d)g=this.split(d,t),g&&(this.beatEnd=!0);else{const t=(o+this.length)/a;this.beatEnd=n(t-Math.round(t)),this.beatEnd||(this.beatEnd=n(c-u))}return this.isTieStart=this.notes.some(t=>t.tiedFrom),this.isTieEnd=this.notes.some(t=>t.tiedTo),g&&(g.isTieStart=g.notes.some(t=>t.tiedFrom),g.isTieEnd=g.notes.some(t=>t.tiedTo),this.notes.some(t=>t.tiedTo&&t.start+t.length>d)&&delete this.isTieEnd),g}calculateRenderProperties(t){delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash;const e=this.length;if(n(e)||e<0)return;if(t.allowDottedRests||this.notes.length>0){if(n(e-1.5))return void(this.augmentationDots=1);if(n(e-.75))return this.durationLines=1,void(this.augmentationDots=1);if(n(e-.375))return this.durationLines=2,void(this.augmentationDots=1);n(e-3)&&(this.augmentationDots=1)}if(this.durationLines=e>=3.999999||e>=1.999999||e>=.999999?0:e>=.499999?1:e>=.249999?2:e>=.124999?3:4,this.augmentationDash=!1,1===this.notes.length){const e=this.notes[0],i=t.timeSignatureAtQ(this.start);if(!i)return;const s=Math.max(4/i.denominator,1);if(!(this.measureNumber%1<=1e-6)&&e.tiedFrom&&n(e.tiedFrom.length-s)&&e.tiedFrom.pitch===e.pitch&&e.length>=1){let i=!0;if(e.tiedTo){const s=e.start+e.length;i=Math.floor(t.measureNumberAtQ(this.start))===Math.floor(t.measureNumberAtQ(s))&&e.tiedTo.length>=1}i&&(this.augmentationDash=!0)}}}splitToStandardSymbol(t){const e=this.length;if(n(e)||e<s.MIN_RESOLUTION-1e-6)return null;const i=[];t.allowDottedRests||this.notes.length>0?(i.push(6),i.push(4),i.push(3),i.push(2),i.push(1.5),i.push(1),i.push(.75),i.push(.5),i.push(.375),i.push(.25),i.push(.125),i.push(.0625)):(i.push(4),i.push(2),i.push(1),i.push(.5),i.push(.25),i.push(.125),i.push(.0625));let r=0;for(const t of i)if(e>=t-1e-6){r=t;break}n(r)&&(r=s.MIN_RESOLUTION,e<r-1e-6&&e>1e-6&&console.warn(`Block length ${e} is too small, rendering as ${r}`));let o=null;return e>r+1e-6?(o=this.split(this.start+r,t),this.length!==r&&(console.warn(`Adjusting block length after split from ${this.length} to ${r}`),this.length=r)):this.length=r,o}mergeToMap(t){const e=t.get(this.start);e?(this.notes.forEach(t=>e.addNote(t)),0!==this.measureNumber&&(e.measureNumber=this.measureNumber)):t.set(this.start,this)}isMeasureBeginning(){return n(this.measureNumber-Math.floor(this.measureNumber))}}},830(t,e,i){i.d(e,{getMeasureLength:()=>s});function s(t){return t.numerator*(4/t.denominator)}i.d(e,["DEFAULT_KEY_SIGNATURE",0,{start:0,key:0},"DEFAULT_TEMPO",0,{start:0,qpm:60},"DEFAULT_TIME_SIGNATURE",0,{start:0,numerator:4,denominator:4}])},849(t,e,i){i.d(e,{JianpuModel:()=>a,mapMidiToJianpu:()=>h});var s=i(830),n=i(775),r=i(765),o=i(559);class a{jianpuInfo;measuresInfo;jianpuBlockMap;lastQ;constructor(t,e){this.jianpuInfo=t,this.jianpuBlockMap=new Map,this.lastQ=0,this.update(t,e)}isLastMeasureAtQ(t){return t>=this.lastQ-1e-6}getTotalDuration(){return this.lastQ}update(t,e){this.jianpuInfo=t,t.notes.sort((t,e)=>t.start-e.start),this.lastQ=0,t.notes.forEach(t=>{this.lastQ=Math.max(this.lastQ,t.start+t.length)}),this.lastQ+=1e-6,t.tempos=t.tempos&&t.tempos.length?t.tempos:[s.DEFAULT_TEMPO],t.tempos.sort((t,e)=>t.start-e.start),t.tempos[0].start>1e-6&&t.tempos.unshift({...s.DEFAULT_TEMPO,start:0});const i=void 0!==e?{start:0,key:e}:{...s.DEFAULT_KEY_SIGNATURE};t.keySignatures=t.keySignatures&&t.keySignatures.length?t.keySignatures:[i],t.keySignatures.sort((t,e)=>t.start-e.start),t.keySignatures[0].start>1e-6&&t.keySignatures.unshift({...i,start:0}),t.timeSignatures=t.timeSignatures&&t.timeSignatures.length?t.timeSignatures:[s.DEFAULT_TIME_SIGNATURE],t.timeSignatures.sort((t,e)=>t.start-e.start),t.timeSignatures[0].start>1e-6&&t.timeSignatures.unshift({...s.DEFAULT_TIME_SIGNATURE,start:0}),this.measuresInfo=new n.MeasuresInfo(t,this.lastQ),this.infoToBlocks()}infoToBlocks(){const t=new Map;let e=0;if(this.jianpuInfo.notes.forEach(i=>{const s=i.start,n=this.measuresInfo.measureNumberAtQ(s);if(s>e+1e-6){const i=e,n=s-i,o=this.measuresInfo.measureNumberAtQ(i),a=new r.JianpuBlock(i,n,[],o);t.set(i,a)}const o=this.measuresInfo.keySignatureAtQ(s),a=this.createJianpuNote(i,o);let h=t.get(s);h||(h=new r.JianpuBlock(s,0,[],n),t.set(s,h)),h.addNote(a),e=Math.max(e,s+h.length)}),this.lastQ>e+1e-6){const i=e,s=this.lastQ-1e-6-i;if(s>1e-6){const e=this.measuresInfo.measureNumberAtQ(i),n=new r.JianpuBlock(i,s,[],e);t.set(i,n)}}this.jianpuBlockMap=new Map;const i=Array.from(t.keys()).sort((t,e)=>t-e);let s=[];i.forEach(e=>{s.push(t.get(e))});const n=new Set;for(;s.length>0;){let t=s.shift();n.has(t.start)&&this.jianpuBlockMap.has(t.start);let e=t.splitToBeat(this.measuresInfo);if(e){t.mergeToMap(this.jianpuBlockMap),n.add(t.start),s.unshift(e);continue}let i=t,r=null;do{r=i.splitToStandardSymbol(this.measuresInfo),i.mergeToMap(this.jianpuBlockMap),n.add(i.start),r&&(i=r)}while(r)}this.jianpuBlockMap.forEach(t=>{t.calculateRenderProperties(this.measuresInfo)})}createJianpuNote(t,e){const i=h(t.pitch,e);return{...t,jianpuNumber:i.jianpuNumber,octaveDot:i.octaveDot,accidental:i.accidental}}}function h(t,e){const i=e%12;let s=o.MIDDLE_C_MIDI+i;i>o.MIDDLE_C_MIDI%12&&(s-=12);const n=(t-(s+12*Math.round((t-s)/12))+12)%12;let r=o.MAJOR_SCALE_INTERVALS[n],a=0;if(void 0===r){switch(n){case 1:r=o.MAJOR_SCALE_INTERVALS[0],a=1;break;case 3:r=o.MAJOR_SCALE_INTERVALS[4],a=2;break;case 6:r=o.MAJOR_SCALE_INTERVALS[5],a=1;break;case 8:r=o.MAJOR_SCALE_INTERVALS[9],a=2;break;case 10:r=o.MAJOR_SCALE_INTERVALS[11],a=2;break;default:{console.warn(`Unexpected chromatic interval ${n} in mapMidiToJianpu. Defaulting to sharp of lower valid degree.`);const i=(n-1+12)%12,s=(n+1+12)%12,h=o.MAJOR_SCALE_INTERVALS[i],l=o.MAJOR_SCALE_INTERVALS[s];void 0!==h?(r=h,a=1):void 0!==l?(r=l,a=2):(r=1,a=1,console.error(`Could not determine Jianpu number components for MIDI ${t}, interval ${n} from tonic in key ${e}.`));break}}void 0===r&&(console.error(`Jianpu number became undefined for MIDI ${t} (interval ${n}, key ${e}) after chromatic processing. This indicates a logic error or misconfigured MAJOR_SCALE_INTERVALS.`),r=1,a=1)}return{jianpuNumber:r,octaveDot:Math.floor((t-s)/12),accidental:a}}},313(t,e,i){i.d(e,{JianpuSVGRender:()=>u,ScrollType:()=>s});var s,n=i(240),r=i(134),o=i(961),a=i(830),h=i(849),l=i(559);!function(t){t[t.PAGE=0]="PAGE",t[t.NOTE=1]="NOTE",t[t.BAR=2]="BAR"}(s||(s={}));class u{jianpuInfo;jianpuModel;config;height;width;parentElement;div;mainSVG;mainG;musicG;signaturesG;overlaySVG;overlayG;signaturesBlinking;lastKnownScrollLeft;isScrolling;currentKey;currentTimeSignature;playingNotes;lastRenderedQ;estimatedNoteWidth;numberFontSize;smallFontSize;yBaseline;parseColorString(t){return/^[a-z]+$/i.test(t)||t.startsWith("rgb(")?t:/^\d+,\s*\d+,\s*\d+$/.test(t)?`rgb(${t})`:t}constructor(t,e,i){this.jianpuInfo=t,this.div=i;this.config={noteHeight:e.noteHeight??20,noteSpacingFactor:e.noteSpacingFactor??n.COMPACT_SPACING_FACTOR,pixelsPerTimeStep:e.pixelsPerTimeStep??0,noteColor:this.parseColorString(e.noteColor??"black"),activeNoteColor:this.parseColorString(e.activeNoteColor??"red"),defaultKey:e.defaultKey??0,scrollType:e.scrollType??s.PAGE,fontFamily:e.fontFamily??"sans-serif",width:e.width??0,height:e.height??0},this.jianpuModel=new h.JianpuModel(this.jianpuInfo,this.config.defaultKey),this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??a.DEFAULT_TIME_SIGNATURE,this.playingNotes=new Map,this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.numberFontSize=this.config.noteHeight*n.FONT_SIZE_MULTIPLIER,this.smallFontSize=this.config.noteHeight*n.SMALL_FONT_SIZE_MULTIPLIER,this.estimatedNoteWidth=.6*this.numberFontSize,this.yBaseline=1.5*this.config.noteHeight,this.height=0,this.width=0,this.clear(),this.redraw()}clear(){for(;this.div.lastChild;)this.div.removeChild(this.div.lastChild);this.div.style.position="relative",this.div.style.overflow="hidden",this.overlaySVG=document.createElementNS(r.SVGNS,"svg"),this.overlaySVG.style.position="absolute",this.overlaySVG.style.left="0",this.overlaySVG.style.top="0",this.overlaySVG.style.pointerEvents="none",this.div.appendChild(this.overlaySVG),this.overlayG=(0,r.createSVGGroupChild)(this.overlaySVG,"overlay"),this.parentElement=document.createElement("div"),this.parentElement.style.overflowX="auto",this.parentElement.style.overflowY="hidden",this.parentElement.style.width="100%",this.parentElement.style.height="100%",this.div.appendChild(this.parentElement),this.parentElement.addEventListener("scroll",this.handleScrollEvent),this.mainSVG=document.createElementNS(r.SVGNS,"svg"),this.mainSVG.style.display="block",this.parentElement.appendChild(this.mainSVG),this.mainG=(0,r.createSVGGroupChild)(this.mainSVG,"main-content"),this.signaturesG=(0,r.createSVGGroupChild)(this.mainG,"signatures"),this.musicG=(0,r.createSVGGroupChild)(this.mainG,"music"),this.playingNotes.clear(),this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.height=this.config.height>0?this.config.height:5*this.config.noteHeight,this.width=this.config.width>0?this.config.width:0,this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??a.DEFAULT_TIME_SIGNATURE,this.drawSignatures(this.overlayG,0,!0,!0),this.updateLayout()}updateLayout(t){this.width=t??this.width,this.config.width>0&&(this.width=this.config.width),this.height=Math.max(this.height,6*this.config.noteHeight),this.config.height>0&&(this.height=this.config.height);const e=1.65*this.config.noteHeight;this.mainSVG.setAttribute("width",`${this.width}`),this.mainSVG.setAttribute("height",`${this.height}`),this.mainG.setAttribute("transform",`translate(0, ${this.yBaseline+e})`),this.overlaySVG.setAttribute("width","200"),this.overlaySVG.setAttribute("height",`${this.height}`),this.overlayG.setAttribute("transform",`translate(0, ${this.yBaseline})`)}redraw(t,e){let i=-1;const n=this.config.pixelsPerTimeStep<=0;if(t){const o=`${t.start}-${t.pitch}`;if(this.playingNotes.forEach((t,e)=>{if(e!==o){const t=this.mainSVG.querySelector(`g[data-id="${e}"]`);t&&(0,r.resetElementHighlight)(t,this.config.noteColor),this.playingNotes.delete(e)}}),!this.playingNotes.has(o)){const n=this.mainSVG.querySelector(`g[data-id="${o}"]`);if(n){(0,r.highlightElement)(n,this.config.activeNoteColor),this.playingNotes.set(o,t);const a=n.getBoundingClientRect(),h=this.mainSVG.getBoundingClientRect();i=a.left-h.left+this.parentElement.scrollLeft;const l=n.hasAttribute("data-is-measure-start");e&&(this.config.scrollType!==s.BAR||l)&&this.scrollIntoViewIfNeeded(i)}}if(!n&&this.signaturesBlinking){const e=this.overlayG.getBoundingClientRect().width;this.jianpuModel.measuresInfo.quartersToTime(t.start,t.start)*this.config.pixelsPerTimeStep>e&&(this.signaturesBlinking=!1,(0,r.setBlinkAnimation)(this.overlayG,!1))}}else{this.jianpuModel.update(this.jianpuInfo,this.config.defaultKey);let t=this.width,e=this.width,i=this.height>0?this.height-this.yBaseline:3*this.config.noteHeight,s=0;const r=new Map;this.jianpuModel.jianpuBlockMap.forEach((o,a)=>{if(a>=this.lastRenderedQ-1e-9){t=n?e:this.jianpuModel.measuresInfo.quartersToTime(a,a)*this.config.pixelsPerTimeStep;const h=this.drawJianpuBlock(o,t,r);n?e+=h:e=Math.max(e,t+h);const l=this.mainSVG.querySelector(`g[data-block-start="${o.start}"]`);if(l)try{const t=l.getBBox(),e=t.y,n=t.y+t.height;s=Math.min(s,e),i=Math.max(i,n)}catch(t){}this.lastRenderedQ=a+o.length}}),this.height=Math.max(this.height,i-s+this.config.noteHeight),this.updateLayout(e)}return i}drawJianpuBlock(t,e,i){let s=0;const a=this.config.pixelsPerTimeStep<=0,h=t.isMeasureBeginning(),l=(0,r.createSVGGroupChild)(this.musicG,`block-${t.start}`);if(l.setAttribute("data-block-start",`${t.start}`),h&&t.start>1e-6){const t=e-(a?.6*this.estimatedNoteWidth:4),i=2*this.config.noteHeight,h=0,l=(0,r.drawSVGPath)(this.musicG,o.barPath,t,h,1,i/o.PATH_SCALE);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH),a&&(s+=n.LINE_STROKE_WIDTH)}const u=this.updateCurrentKey(t.start),c=this.updateCurrentTimeSignature(t.start);let d=0;if((u||c)&&t.start>1e-6){const t=e+s;d=this.drawSignatures(this.signaturesG,t,u,c),a&&(s+=d+.2*this.estimatedNoteWidth)}const g=e+s;let m=0;if(t.notes.length>0?m=this.drawNotes(t,g,i,l):t.length>1e-6&&(m=this.drawRest(t,g,l)),a){s+=m;let e=this.estimatedNoteWidth*this.config.noteSpacingFactor;t.beatEnd?e*=1:t.length<.0625?e*=.05:t.length<.125?e*=.1:t.length<.25?e*=.2:t.length<.5?e*=.4:t.length<1&&(e*=.5),s+=e}else s=Math.max(d,m);if(this.jianpuModel.isLastMeasureAtQ(t.start+t.length)){const t=e+s,i=2*this.config.noteHeight,h=0,l=(0,r.drawSVGPath)(this.musicG,o.barPath,t,h,1,i/o.PATH_SCALE);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH),a&&(s+=n.LINE_STROKE_WIDTH)}return s}drawNotes(t,e,i,s){let a=e,h=e;const l=.1*this.estimatedNoteWidth,u=`${this.numberFontSize}px`,c=`${this.smallFontSize}px`,{durationLines:d=0,augmentationDots:g=0,augmentationDash:m=!1}=t;return t.notes.forEach(e=>{const f=`${e.start}-${e.pitch}`,S=(0,r.createSVGGroupChild)(s,f);t.isMeasureBeginning()&&S.setAttribute("data-is-measure-start","true");let p=a,T=p;if(0!==e.accidental){const t=o.ACCIDENTAL_TEXT[e.accidental];(0,r.drawSVGText)(S,t,p+l,0,c,"normal","end","text-top",this.config.noteColor,1,this.config.fontFamily)}let A=0;if(m){const t=this.config.noteHeight*n.AUGMENTATION_DASH_FACTOR,e=t/50,i=(0,r.drawSVGPath)(S,o.augmentationDashPath,p,0,e,1);(0,r.setStroke)(i,this.config.noteColor,n.LINE_STROKE_WIDTH),A=t,T=p+A}else{const t=`${e.jianpuNumber}`;A=(0,r.drawSVGText)(S,t,p,0,u,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width,T=p+A}if(0!==e.octaveDot&&!1===m){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,i=t/(.15*o.PATH_SCALE),s=p+A/2,a=2.8*t,h=this.config.noteHeight*n.OCTAVE_DOT_OFFSET_FACTOR;for(let t=0;t<Math.abs(e.octaveDot);t++){const n=(e.octaveDot>0?-h:.6*h)-t*a*(e.octaveDot>0?1:-1);(0,r.drawSVGPath)(S,o.dotPath,s,n,i,i)}}if(d>0){const t=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR,i=A/o.PATH_SCALE*(n.DURATION_LINE_SCALES.get(d)??1);for(let s=0;s<d;s++){const a=t+s*e,h=(0,r.drawSVGPath)(S,o.underlinePath,p,a,i,1);(0,r.setStroke)(h,this.config.noteColor,n.LINE_STROKE_WIDTH)}}let E=T+l;if(g>0){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,e=t/(.15*o.PATH_SCALE);for(let i=0;i<g;i++)(0,r.drawSVGPath)(S,o.dotPath,E,0,e,e),E+=t+l;T=E+l}const I=T;if(e.tiedTo&&!m)i.set(e,{g:S,xNoteRight:I,yNoteBaseline:0});else if(e.tiedFrom){let t=e.tiedFrom;for(;t.tiedFrom;)t=t.tiedFrom;const s=i.get(t);if(s){const n=1*s.xNoteRight,a=(m?p-2.2*this.estimatedNoteWidth:p-l)-n,h=1.2*-this.config.noteHeight,u=a/o.PATH_SCALE*1.3,c=this.config.noteHeight/o.PATH_SCALE*1.6;a>1&&(0,r.drawSVGPath)(s.g,o.tiePath,n-(s.g.getCTM()?.e??0),h,u,c);let d=t;for(;d&&d!==e;){i.delete(d);const t=d.tiedTo;t&&(d=t)}}else console.warn("Missing linked SVG details for first tied note:",t)}h=Math.max(h,T)}),h-e}drawRest(t,e,i){const s=`${this.numberFontSize}px`,a=.1*this.estimatedNoteWidth,{durationLines:h=0,augmentationDots:l=0}=t;let u=e,c=u;const d=(0,r.drawSVGText)(i,"0",u,0,s,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width;if(c=u+d,h>0){const t=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR,s=d/o.PATH_SCALE*(n.DURATION_LINE_SCALES.get(h)??1);for(let a=0;a<h;a++){const h=t+a*e,l=(0,r.drawSVGPath)(i,o.underlinePath,u,h,s,1);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH)}}let g=c+a;if(l>0){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,e=t/(.15*o.PATH_SCALE);for(let s=0;s<l;s++)(0,r.drawSVGPath)(i,o.dotPath,g,0,e,e),g+=t+a;c=g+a}return c-e}drawSignatures(t,e,i,s){let n=e;const o=.3*this.estimatedNoteWidth,a=`${this.smallFontSize}px`,h=`${this.numberFontSize}px`;if(i){const e=`1=${l.PITCH_CLASS_NAMES[this.currentKey%12]??"C"}`;n+=(0,r.drawSVGText)(t,e,n,0,h,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width+2*o}if(s){const e=`${this.currentTimeSignature.numerator}/${this.currentTimeSignature.denominator}`;n+=(0,r.drawSVGText)(t,e,n,0,a,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width+o}const u=n-e;try{const e=t.getBBox(),i=e.y,s=e.y+e.height,n=Math.max(this.yBaseline+s,this.yBaseline-i)+.5*this.config.noteHeight;this.height=Math.max(this.height,n)}catch(t){}return t===this.overlayG&&this.config.pixelsPerTimeStep>0&&(this.signaturesBlinking=!0,(0,r.setBlinkAnimation)(this.overlayG,!0)),u}updateCurrentKey(t){const e=this.jianpuModel.measuresInfo.keySignatureAtQ(t,!0);return-1!==e&&e!==this.currentKey&&(this.currentKey=e,!0)}updateCurrentTimeSignature(t){const e=this.jianpuModel.measuresInfo.timeSignatureAtQ(t,!0);return!(!e||e.numerator===this.currentTimeSignature.numerator&&e.denominator===this.currentTimeSignature.denominator)&&(this.currentTimeSignature=e,!0)}handleScrollEvent=t=>{this.lastKnownScrollLeft=this.parentElement.scrollLeft,this.isScrolling||window.requestAnimationFrame(()=>{this.updateOverlaySignaturesForScroll(this.lastKnownScrollLeft),this.isScrolling=!1}),this.isScrolling=!0};scrollIntoViewIfNeeded(t){const e=this.parentElement.getBoundingClientRect().width,i=this.parentElement.scrollLeft;let n=i;if(this.config.scrollType===s.PAGE){const s=20;t<i+s?n=t-s:t>i+e-s&&(n=t-e+s)}else{n=t-.5*e}n=Math.max(0,Math.min(n,this.parentElement.scrollWidth-e)),Math.abs(n-i)>1&&(this.parentElement.scrollTo({left:n,behavior:"smooth"}),this.updateOverlaySignaturesForScroll(n))}updateOverlaySignaturesForScroll(t){const e=this.pixelsToTime(t),i=this.jianpuModel.measuresInfo.keySignatureAtQ(e),s=this.jianpuModel.measuresInfo.timeSignatureAtQ(e)??this.currentTimeSignature;let n=!1;if(i!==this.currentKey&&(this.currentKey=i,n=!0),s.numerator===this.currentTimeSignature.numerator&&s.denominator===this.currentTimeSignature.denominator||(this.currentTimeSignature=s,n=!0),n){for(;this.overlayG.lastChild;)this.overlayG.removeChild(this.overlayG.lastChild);this.drawSignatures(this.overlayG,0,!0,!0),t<10&&this.config.pixelsPerTimeStep>0?((0,r.setBlinkAnimation)(this.overlayG,!0),this.signaturesBlinking=!0):this.config.pixelsPerTimeStep>0&&((0,r.setBlinkAnimation)(this.overlayG,!1),this.signaturesBlinking=!1)}}pixelsToTime(t){return this.config.pixelsPerTimeStep<=0?0:this.jianpuModel.measuresInfo.timeToQuarters(t/this.config.pixelsPerTimeStep,0)}}},775(t,e,i){i.d(e,{MeasuresInfo:()=>r});var s=i(830),n=i(559);class r{measuresInfo;allowDottedRests=!0;constructor(t,e){if(this.measuresInfo=[],!(e>0))return;const i=r.getSortedChanges(t.tempos,s.DEFAULT_TEMPO),n=r.getSortedChanges(t.keySignatures,s.DEFAULT_KEY_SIGNATURE),o=r.getSortedChanges(t.timeSignatures,s.DEFAULT_TIME_SIGNATURE);let a=0,h=0,l=0,u=i[0].event,c=n[0].event,d=o[0].event,g=1,m=(0,s.getMeasureLength)(d),f=d.start;const S=[0];i.forEach(t=>S.push(t.start)),n.forEach(t=>S.push(t.start)),o.forEach(t=>S.push(t.start)),S.sort((t,e)=>t-e);let p=-1;for(let t=0;t<S.length;t++){const r=S[t];if(r>=e)break;if(r===p)continue;p=r;let T=!1,A=!1,E=!1;for(;a<i.length&&i[a].start<=r;)u=i[a++].event,T=!0;for(;h<n.length&&n[h].start<=r;)c=n[h++].event,A=!0;for(;l<o.length&&o[l].start<=r;){g+=(o[l].event.start-f)/m,g=Math.round(1e3*g)/1e3,d=o[l++].event,m=(0,s.getMeasureLength)(d),f=r,E=!0}const I={start:r,measureNumber:g+(r-f)/m,measureLength:m,tempo:u,keySignature:c,timeSignature:d};T&&(I.tempoChange=!0),A&&(I.keyChange=!0),E&&(I.timeChange=!0),this.measuresInfo.push(I)}}static getSortedChanges(t,e){const i=t&&t.length?t.slice():[e];return i.sort((t,e)=>t.start-e.start),i.map(t=>({start:Math.max(0,Math.round(t.start/n.MIN_RESOLUTION)*n.MIN_RESOLUTION),event:t}))}findIndex(t){let e=0,i=this.measuresInfo.length-1,s=0;for(;e<=i;){const n=Math.floor((e+i)/2);this.measuresInfo[n].start<=t?(s=n,e=n+1):i=n-1}return s}measureNumberAtQ(t){if(0===this.measuresInfo.length)return 1;const e=this.findIndex(t),i=this.measuresInfo[e],s=(t-i.start)/i.measureLength;return i.measureNumber+s+1e-9}measureLengthAtQ(t){if(0===this.measuresInfo.length)return(0,s.getMeasureLength)(s.DEFAULT_TIME_SIGNATURE);const e=this.findIndex(t);return this.measuresInfo[e].measureLength}tempoAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TEMPO.qpm;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.tempoChange&&o?r.tempo.qpm:-1}keySignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_KEY_SIGNATURE.key;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.keyChange&&o?r.keySignature.key:-1}timeSignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TIME_SIGNATURE;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.timeChange&&o?r.timeSignature:null}quartersToTime(t,e){const i=this.tempoAtQ(e);return i<=0?0:t/i*60}timeToQuarters(t,e){const i=this.tempoAtQ(e);if(i<=0)return 0;const s=t*i/60;return Math.round(s*n.MAX_QUARTER_DIVISION)/n.MAX_QUARTER_DIVISION}isBeatStart(t){if(0===this.measuresInfo.length)return!1;const e=this.findIndex(t),i=this.measuresInfo[e],s=i.timeSignature,r=(t-(i.start-(i.measureNumber-Math.floor(i.measureNumber))*i.measureLength))/(4/s.denominator);return Math.abs(r-Math.round(r))<n.MIN_RESOLUTION/2}}},559(t,e,i){i.d(e,["MAJOR_SCALE_INTERVALS",0,{0:1,2:2,4:3,5:4,7:5,9:6,11:7},"MAX_QUARTER_DIVISION",0,240,"MIDDLE_C_MIDI",0,60,"MIN_RESOLUTION",0,.0625,"PITCH_CLASS_NAMES",0,["C","C#","D","D#","E","F","F#","G","G#","A","A#","B"]])},240(t,e,i){const s=new Map([[1,1.78],[2,1.6],[3,1.3],[4,1.15]]);i.d(e,["AUGMENTATION_DASH_FACTOR",0,.8,"COMPACT_SPACING_FACTOR",0,1.5,"DOT_SIZE_FACTOR",0,.1,"DURATION_LINE_SCALES",0,s,"FONT_SIZE_MULTIPLIER",0,1.2,"LINE_STROKE_WIDTH",0,1,"OCTAVE_DOT_OFFSET_FACTOR",0,1,"SMALL_FONT_SIZE_MULTIPLIER",0,.75,"UNDERLINE_SPACING_FACTOR",0,.2])},961(t,e,i){i.d(e,["ACCIDENTAL_TEXT",0,["","#","b"],"PATH_SCALE",0,100,"augmentationDashPath",0,"m 0,0 h 50","barPath",0,"m 0,-50 v 100","dotPath",0,"M 0 0 a 15 15 0 1 0 0.0001 0 z","tiePath",0,"M -13,5 C 15,-15 65,-15 90,5 C 65,-25 15,-25 -13,5 Z","underlinePath",0,"m 0,0 h 100"])},134(t,e,i){i.d(e,{createSVGGroupChild:()=>o,drawSVGPath:()=>n,drawSVGText:()=>r,highlightElement:()=>l,resetElementHighlight:()=>u,setBlinkAnimation:()=>a,setStroke:()=>h});const s="http://www.w3.org/2000/svg";function n(t,e,i,n,r,o,a=1){const h=document.createElementNS(s,"path");return h.setAttributeNS(null,"d",e),h.setAttributeNS(null,"transform",`translate(${i}, ${n}) scale(${r}, ${o})`),a<1&&h.setAttributeNS(null,"opacity",`${a}`),t.appendChild(h),h}function r(t,e,i,n,r,o="normal",a="middle",h="middle",l="currentColor",u=1,c="sans-serif"){const d=document.createElementNS(s,"text");d.setAttributeNS(null,"font-family",c),d.setAttributeNS(null,"font-size",r),d.setAttributeNS(null,"font-weight",o),d.setAttributeNS(null,"x",`${i}`),d.setAttributeNS(null,"y",`${n}`),d.setAttributeNS(null,"text-anchor",a),d.setAttributeNS(null,"dominant-baseline",h),"currentColor"!==l&&d.setAttributeNS(null,"fill",l),u<1&&d.setAttributeNS(null,"opacity",`${u}`);const g=document.createTextNode(e);return d.appendChild(g),t.appendChild(d),d}function o(t,e){const i=document.createElementNS(s,"g");return e&&i.setAttribute("data-id",e),t.appendChild(i),i}function a(t,e=!0,i="1s"){let n=t.querySelector('animate[attributeName="opacity"]');return e?n?(n.setAttributeNS(null,"repeatCount","indefinite"),n.beginElement()):(n=document.createElementNS(s,"animate"),n.setAttributeNS(null,"attributeName","opacity"),n.setAttributeNS(null,"values","1;0.2;1"),n.setAttributeNS(null,"keyTimes","0;0.5;1"),n.setAttributeNS(null,"dur",i),n.setAttributeNS(null,"repeatCount","indefinite"),t.appendChild(n)):(n&&(n.endElement(),n.setAttributeNS(null,"repeatCount","0"),t.style.opacity="1"),t.style.opacity="1"),t}function h(t,e,i){t.setAttributeNS(null,"stroke",e),t.setAttributeNS(null,"stroke-width",`${i}`)}function l(t,e){const i=[];return t.matches("text, path")&&i.push(t),t.querySelectorAll("text, path").forEach(t=>{i.push(t)}),i.forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e);const i=t.getAttribute("stroke");null!==i&&"none"!==i&&t.setAttribute("stroke",e)}),t}function u(t,e){t.querySelectorAll("text, path").forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e);const i=t.getAttribute("stroke");null!==i&&"none"!==i&&t.setAttribute("stroke",e)})}i.d(e,["SVGNS",0,s])}};const e={};function i(s){const n=e[s];if(void 0!==n)return n.exports;const r=e[s]={exports:{}};return t[s](r,r.exports,i),r.exports}i.d=(t,e)=>{if(Array.isArray(e))for(var s=0;s<e.length;){var n=e[s++],r=e[s++],o=0===r?{enumerable:!0,value:e[s++]}:{enumerable:!0,get:r};i.o(t,n)||Object.defineProperty(t,n,o)}else for(var n in e)i.o(e,n)&&!i.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},i.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),i.r=t=>{Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};let s={};i.r(s);var n=i(644);return window.jr=n,s})());
|
package/es6/svg_tools.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export declare const SVGNS = "http://www.w3.org/2000/svg";
|
|
2
2
|
export declare function drawSVGPath(e: SVGElement, path: string, x: number, y: number, scaleX: number, scaleY: number, opacity?: number): SVGPathElement;
|
|
3
|
-
export declare function drawSVGText(e: SVGElement, text: string, x: number, y: number, fontSize: string, fontWeight?: string, textAnchor?: 'start' | 'middle' | 'end', dominantBaseline?: string, fill?: string, opacity?: number): SVGTextElement;
|
|
3
|
+
export declare function drawSVGText(e: SVGElement, text: string, x: number, y: number, fontSize: string, fontWeight?: string, textAnchor?: 'start' | 'middle' | 'end', dominantBaseline?: string, fill?: string, opacity?: number, fontFamily?: string): SVGTextElement;
|
|
4
4
|
export declare function createSVGGroupChild(parent: SVGElement, id?: string): SVGGElement;
|
|
5
5
|
export declare function setBlinkAnimation(e: SVGElement, enable?: boolean, duration?: string): SVGElement;
|
|
6
6
|
export declare function setFill(e: SVGElement, color: string): void;
|
package/es6/svg_tools.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.svg_tools=e():t.svg_tools=e()}(self,()=>(()=>{"use strict";const t={d:(e,n)=>{if(Array.isArray(n))for(var
|
|
1
|
+
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.svg_tools=e():t.svg_tools=e()}(self,()=>(()=>{"use strict";const t={d:(e,n)=>{if(Array.isArray(n))for(var r=0;r<n.length;){var l=n[r++],u=n[r++],i=0===u?{enumerable:!0,value:n[r++]}:{enumerable:!0,get:u};t.o(e,l)||Object.defineProperty(e,l,i)}else for(var l in n)t.o(n,l)&&!t.o(e,l)&&Object.defineProperty(e,l,{enumerable:!0,get:n[l]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}};let e={};t.r(e),t.d(e,{createSVGGroupChild:()=>u,drawSVGPath:()=>r,drawSVGText:()=>l,highlightElement:()=>a,resetElementHighlight:()=>c,setBlinkAnimation:()=>i,setFill:()=>o,setStroke:()=>s});const n="http://www.w3.org/2000/svg";function r(t,e,r,l,u,i,o=1){const s=document.createElementNS(n,"path");return s.setAttributeNS(null,"d",e),s.setAttributeNS(null,"transform",`translate(${r}, ${l}) scale(${u}, ${i})`),o<1&&s.setAttributeNS(null,"opacity",`${o}`),t.appendChild(s),s}function l(t,e,r,l,u,i="normal",o="middle",s="middle",a="currentColor",c=1,b="sans-serif"){const d=document.createElementNS(n,"text");d.setAttributeNS(null,"font-family",b),d.setAttributeNS(null,"font-size",u),d.setAttributeNS(null,"font-weight",i),d.setAttributeNS(null,"x",`${r}`),d.setAttributeNS(null,"y",`${l}`),d.setAttributeNS(null,"text-anchor",o),d.setAttributeNS(null,"dominant-baseline",s),"currentColor"!==a&&d.setAttributeNS(null,"fill",a),c<1&&d.setAttributeNS(null,"opacity",`${c}`);const f=document.createTextNode(e);return d.appendChild(f),t.appendChild(d),d}function u(t,e){const r=document.createElementNS(n,"g");return e&&r.setAttribute("data-id",e),t.appendChild(r),r}function i(t,e=!0,r="1s"){let l=t.querySelector('animate[attributeName="opacity"]');return e?l?(l.setAttributeNS(null,"repeatCount","indefinite"),l.beginElement()):(l=document.createElementNS(n,"animate"),l.setAttributeNS(null,"attributeName","opacity"),l.setAttributeNS(null,"values","1;0.2;1"),l.setAttributeNS(null,"keyTimes","0;0.5;1"),l.setAttributeNS(null,"dur",r),l.setAttributeNS(null,"repeatCount","indefinite"),t.appendChild(l)):(l&&(l.endElement(),l.setAttributeNS(null,"repeatCount","0"),t.style.opacity="1"),t.style.opacity="1"),t}function o(t,e){t.setAttributeNS(null,"fill",e)}function s(t,e,n){t.setAttributeNS(null,"stroke",e),t.setAttributeNS(null,"stroke-width",`${n}`)}function a(t,e){const n=[];return t.matches("text, path")&&n.push(t),t.querySelectorAll("text, path").forEach(t=>{n.push(t)}),n.forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e);const n=t.getAttribute("stroke");null!==n&&"none"!==n&&t.setAttribute("stroke",e)}),t}function c(t,e){t.querySelectorAll("text, path").forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e);const n=t.getAttribute("stroke");null!==n&&"none"!==n&&t.setAttribute("stroke",e)})}return t.d(e,["SVGNS",0,n]),e})());
|
package/node/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.mm=e():t.mm=e()}(global,()=>(()=>{"use strict";var t={765(t,e,i){i.d(e,{JianpuBlock:()=>o,splitJianpuNote:()=>r});var s=i(559);function n(t){return Math.abs(t)<1e-6}function r(t,e){const i=t.start+t.length;if(e<=t.start||e>=i||n(i-e))return null;const s=i-e;t.length=e-t.start;const r={start:e,length:s,pitch:t.pitch,intensity:t.intensity,jianpuNumber:t.jianpuNumber,octaveDot:t.octaveDot,accidental:0,tiedFrom:t};return t.tiedTo&&(r.tiedTo=t.tiedTo,t.tiedTo.tiedFrom=r),t.tiedTo=r,r}class o{start;length;notes;measureNumber;durationLines;augmentationDots;augmentationDash;beatBegin;beatEnd;isTieStart;isTieEnd;constructor(t=0,e=0,i=[],s=1){this.start=t,this.length=e,this.notes=i,this.measureNumber=s}addNote(t){if(0===this.notes.length)return this.start=t.start,this.length=t.length,this.notes.push(t),!0;if(!n(this.start-t.start))return console.warn(`JianpuBlock: Attempted to add note at ${t.start} to block starting at ${this.start}. Ignoring.`),!1;let e=!1,i=!1;for(let s=0;s<this.notes.length;s++)if(this.notes[s].pitch===t.pitch){i=!0,t.length<this.notes[s].length&&(this.notes[s].tiedFrom&&(t.tiedFrom=this.notes[s].tiedFrom,t.tiedFrom&&(t.tiedFrom.tiedTo=t)),this.notes[s].tiedTo&&(t.tiedTo=this.notes[s].tiedTo,t.tiedTo&&(t.tiedTo.tiedFrom=t)),this.notes[s]=t,e=!0);break}i||this.notes.push(t);let s=1/0;for(const t of this.notes)s=Math.min(s,t.length);return this.length=s,!i||e}split(t,e){const i=this.start+this.length;if(t<=this.start||t>=i||n(i-t))return null;const s=i-t,a=t-this.start,h=new o(t,s,[],e.measureNumberAtQ(t)),l=[];for(const e of this.notes){const i=e.start+e.length;if(i>t+1e-6){const i=r(e,t);i?l.push(i):console.warn("Split failed for note, unexpected state.")}else n(i-t)}return l.forEach(t=>h.addNote(t)),this.length=a,delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash,this.beatEnd&&(h.beatEnd=!0,delete this.beatEnd),this.isTieEnd&&(h.isTieStart=!0,delete this.isTieEnd),h}splitToBeat(t){const e=t.timeSignatureAtQ(this.start);if(!e)return null;const i=t.measureLengthAtQ(this.start),s=t.measureNumberAtQ(this.start),r=this.start-(s-Math.floor(s))*i,o=this.start-r,a=4/e.denominator,h=o/a;this.beatBegin=n(h-Math.round(h));const l=r+(Math.floor(h+1e-6)+1)*a,u=r+i,c=this.start+this.length;let d=null;l<c-1e-6&&l>this.start+1e-6&&(d=l),u<c-1e-6&&u>this.start+1e-6&&(null===d||u<d)&&(d=u);let g=null;if(null!==d)g=this.split(d,t),g&&(this.beatEnd=!0);else{const t=(o+this.length)/a;this.beatEnd=n(t-Math.round(t)),this.beatEnd||(this.beatEnd=n(c-u))}return this.isTieStart=this.notes.some(t=>t.tiedFrom),this.isTieEnd=this.notes.some(t=>t.tiedTo),g&&(g.isTieStart=g.notes.some(t=>t.tiedFrom),g.isTieEnd=g.notes.some(t=>t.tiedTo),this.notes.some(t=>t.tiedTo&&t.start+t.length>d)&&delete this.isTieEnd),g}calculateRenderProperties(t){delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash;const e=this.length;if(n(e)||e<0)return;if(t.allowDottedRests||this.notes.length>0){if(n(e-1.5))return void(this.augmentationDots=1);if(n(e-.75))return this.durationLines=1,void(this.augmentationDots=1);if(n(e-.375))return this.durationLines=2,void(this.augmentationDots=1);n(e-3)&&(this.augmentationDots=1)}if(this.durationLines=e>=3.999999||e>=1.999999||e>=.999999?0:e>=.499999?1:e>=.249999?2:e>=.124999?3:4,this.augmentationDash=!1,1===this.notes.length){const e=this.notes[0],i=t.timeSignatureAtQ(this.start);if(!i)return;const s=Math.max(4/i.denominator,1);if(!(this.measureNumber%1<=1e-6)&&e.tiedFrom&&n(e.tiedFrom.length-s)&&e.tiedFrom.pitch===e.pitch&&e.length>=1){let i=!0;if(e.tiedTo){const s=e.start+e.length;i=Math.floor(t.measureNumberAtQ(this.start))===Math.floor(t.measureNumberAtQ(s))&&e.tiedTo.length>=1}i&&(this.augmentationDash=!0)}}}splitToStandardSymbol(t){const e=this.length;if(n(e)||e<s.MIN_RESOLUTION-1e-6)return null;const i=[];t.allowDottedRests||this.notes.length>0?(i.push(6),i.push(4),i.push(3),i.push(2),i.push(1.5),i.push(1),i.push(.75),i.push(.5),i.push(.375),i.push(.25),i.push(.125),i.push(.0625)):(i.push(4),i.push(2),i.push(1),i.push(.5),i.push(.25),i.push(.125),i.push(.0625));let r=0;for(const t of i)if(e>=t-1e-6){r=t;break}n(r)&&(r=s.MIN_RESOLUTION,e<r-1e-6&&e>1e-6&&console.warn(`Block length ${e} is too small, rendering as ${r}`));let o=null;return e>r+1e-6?(o=this.split(this.start+r,t),this.length!==r&&(console.warn(`Adjusting block length after split from ${this.length} to ${r}`),this.length=r)):this.length=r,o}mergeToMap(t){const e=t.get(this.start);e?(this.notes.forEach(t=>e.addNote(t)),0!==this.measureNumber&&(e.measureNumber=this.measureNumber)):t.set(this.start,this)}isMeasureBeginning(){return n(this.measureNumber-Math.floor(this.measureNumber))}}},830(t,e,i){i.d(e,{getMeasureLength:()=>s});function s(t){return t.numerator*(4/t.denominator)}i.d(e,["DEFAULT_KEY_SIGNATURE",0,{start:0,key:0},"DEFAULT_TEMPO",0,{start:0,qpm:60},"DEFAULT_TIME_SIGNATURE",0,{start:0,numerator:4,denominator:4}])},849(t,e,i){i.d(e,{JianpuModel:()=>a,mapMidiToJianpu:()=>h});var s=i(830),n=i(775),r=i(765),o=i(559);class a{jianpuInfo;measuresInfo;jianpuBlockMap;lastQ;constructor(t,e){this.jianpuInfo=t,this.jianpuBlockMap=new Map,this.lastQ=0,this.update(t,e)}isLastMeasureAtQ(t){return t>=this.lastQ-1e-6}getTotalDuration(){return this.lastQ}update(t,e){this.jianpuInfo=t,t.notes.sort((t,e)=>t.start-e.start),this.lastQ=0,t.notes.forEach(t=>{this.lastQ=Math.max(this.lastQ,t.start+t.length)}),this.lastQ+=1e-6,t.tempos=t.tempos&&t.tempos.length?t.tempos:[s.DEFAULT_TEMPO],t.tempos.sort((t,e)=>t.start-e.start),t.tempos[0].start>1e-6&&t.tempos.unshift({...s.DEFAULT_TEMPO,start:0});const i=void 0!==e?{start:0,key:e}:{...s.DEFAULT_KEY_SIGNATURE};t.keySignatures=t.keySignatures&&t.keySignatures.length?t.keySignatures:[i],t.keySignatures.sort((t,e)=>t.start-e.start),t.keySignatures[0].start>1e-6&&t.keySignatures.unshift({...i,start:0}),t.timeSignatures=t.timeSignatures&&t.timeSignatures.length?t.timeSignatures:[s.DEFAULT_TIME_SIGNATURE],t.timeSignatures.sort((t,e)=>t.start-e.start),t.timeSignatures[0].start>1e-6&&t.timeSignatures.unshift({...s.DEFAULT_TIME_SIGNATURE,start:0}),this.measuresInfo=new n.MeasuresInfo(t,this.lastQ),this.infoToBlocks()}infoToBlocks(){const t=new Map;let e=0;if(this.jianpuInfo.notes.forEach(i=>{const s=i.start,n=this.measuresInfo.measureNumberAtQ(s);if(s>e+1e-6){const i=e,n=s-i,o=this.measuresInfo.measureNumberAtQ(i),a=new r.JianpuBlock(i,n,[],o);t.set(i,a)}const o=this.measuresInfo.keySignatureAtQ(s),a=this.createJianpuNote(i,o);let h=t.get(s);h||(h=new r.JianpuBlock(s,0,[],n),t.set(s,h)),h.addNote(a),e=Math.max(e,s+h.length)}),this.lastQ>e+1e-6){const i=e,s=this.lastQ-1e-6-i;if(s>1e-6){const e=this.measuresInfo.measureNumberAtQ(i),n=new r.JianpuBlock(i,s,[],e);t.set(i,n)}}this.jianpuBlockMap=new Map;const i=Array.from(t.keys()).sort((t,e)=>t-e);let s=[];i.forEach(e=>{s.push(t.get(e))});const n=new Set;for(;s.length>0;){let t=s.shift();n.has(t.start)&&this.jianpuBlockMap.has(t.start);let e=t.splitToBeat(this.measuresInfo);if(e){t.mergeToMap(this.jianpuBlockMap),n.add(t.start),s.unshift(e);continue}let i=t,r=null;do{r=i.splitToStandardSymbol(this.measuresInfo),i.mergeToMap(this.jianpuBlockMap),n.add(i.start),r&&(i=r)}while(r)}this.jianpuBlockMap.forEach(t=>{t.calculateRenderProperties(this.measuresInfo)})}createJianpuNote(t,e){const i=h(t.pitch,e);return{...t,jianpuNumber:i.jianpuNumber,octaveDot:i.octaveDot,accidental:i.accidental}}}function h(t,e){const i=e%12;let s=o.MIDDLE_C_MIDI+i;i>o.MIDDLE_C_MIDI%12&&(s-=12);const n=(t-(s+12*Math.round((t-s)/12))+12)%12;let r=o.MAJOR_SCALE_INTERVALS[n],a=0;if(void 0===r){switch(n){case 1:r=o.MAJOR_SCALE_INTERVALS[0],a=1;break;case 3:r=o.MAJOR_SCALE_INTERVALS[4],a=2;break;case 6:r=o.MAJOR_SCALE_INTERVALS[5],a=1;break;case 8:r=o.MAJOR_SCALE_INTERVALS[9],a=2;break;case 10:r=o.MAJOR_SCALE_INTERVALS[11],a=2;break;default:{console.warn(`Unexpected chromatic interval ${n} in mapMidiToJianpu. Defaulting to sharp of lower valid degree.`);const i=(n-1+12)%12,s=(n+1+12)%12,h=o.MAJOR_SCALE_INTERVALS[i],l=o.MAJOR_SCALE_INTERVALS[s];void 0!==h?(r=h,a=1):void 0!==l?(r=l,a=2):(r=1,a=1,console.error(`Could not determine Jianpu number components for MIDI ${t}, interval ${n} from tonic in key ${e}.`));break}}void 0===r&&(console.error(`Jianpu number became undefined for MIDI ${t} (interval ${n}, key ${e}) after chromatic processing. This indicates a logic error or misconfigured MAJOR_SCALE_INTERVALS.`),r=1,a=1)}return{jianpuNumber:r,octaveDot:Math.floor((t-s)/12),accidental:a}}},313(t,e,i){i.d(e,{JianpuSVGRender:()=>u,ScrollType:()=>s});var s,n=i(240),r=i(134),o=i(961),a=i(830),h=i(849),l=i(559);!function(t){t[t.PAGE=0]="PAGE",t[t.NOTE=1]="NOTE",t[t.BAR=2]="BAR"}(s||(s={}));class u{jianpuInfo;jianpuModel;config;height;width;parentElement;div;mainSVG;mainG;musicG;signaturesG;overlaySVG;overlayG;signaturesBlinking;lastKnownScrollLeft;isScrolling;currentKey;currentTimeSignature;playingNotes;lastRenderedQ;estimatedNoteWidth;numberFontSize;smallFontSize;yBaseline;parseColorString(t){return/^[a-z]+$/i.test(t)||t.startsWith("rgb(")?t:/^\d+,\s*\d+,\s*\d+$/.test(t)?`rgb(${t})`:t}constructor(t,e,i){this.jianpuInfo=t,this.div=i;this.config={noteHeight:e.noteHeight??20,noteSpacingFactor:e.noteSpacingFactor??n.COMPACT_SPACING_FACTOR,pixelsPerTimeStep:e.pixelsPerTimeStep??0,noteColor:this.parseColorString(e.noteColor??"black"),activeNoteColor:this.parseColorString(e.activeNoteColor??"red"),defaultKey:e.defaultKey??0,scrollType:e.scrollType??s.PAGE,fontFamily:e.fontFamily??"sans-serif",width:e.width??0,height:e.height??0},this.jianpuModel=new h.JianpuModel(this.jianpuInfo,this.config.defaultKey),this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??a.DEFAULT_TIME_SIGNATURE,this.playingNotes=new Map,this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.numberFontSize=this.config.noteHeight*n.FONT_SIZE_MULTIPLIER,this.smallFontSize=this.config.noteHeight*n.SMALL_FONT_SIZE_MULTIPLIER,this.estimatedNoteWidth=.6*this.numberFontSize,this.yBaseline=1.5*this.config.noteHeight,this.height=0,this.width=0,this.clear(),this.redraw()}clear(){for(;this.div.lastChild;)this.div.removeChild(this.div.lastChild);this.div.style.position="relative",this.div.style.overflow="hidden",this.overlaySVG=document.createElementNS(r.SVGNS,"svg"),this.overlaySVG.style.position="absolute",this.overlaySVG.style.left="0",this.overlaySVG.style.top="0",this.overlaySVG.style.pointerEvents="none",this.div.appendChild(this.overlaySVG),this.overlayG=(0,r.createSVGGroupChild)(this.overlaySVG,"overlay"),this.parentElement=document.createElement("div"),this.parentElement.style.overflowX="auto",this.parentElement.style.overflowY="hidden",this.parentElement.style.width="100%",this.parentElement.style.height="100%",this.div.appendChild(this.parentElement),this.parentElement.addEventListener("scroll",this.handleScrollEvent),this.mainSVG=document.createElementNS(r.SVGNS,"svg"),this.mainSVG.style.display="block",this.parentElement.appendChild(this.mainSVG),this.mainG=(0,r.createSVGGroupChild)(this.mainSVG,"main-content"),this.signaturesG=(0,r.createSVGGroupChild)(this.mainG,"signatures"),this.musicG=(0,r.createSVGGroupChild)(this.mainG,"music"),this.playingNotes.clear(),this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.height=this.config.height>0?this.config.height:5*this.config.noteHeight,this.width=this.config.width>0?this.config.width:0,this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??a.DEFAULT_TIME_SIGNATURE,this.drawSignatures(this.overlayG,0,!0,!0),this.updateLayout()}updateLayout(t){this.width=t??this.width,this.config.width>0&&(this.width=this.config.width),this.height=Math.max(this.height,6*this.config.noteHeight),this.config.height>0&&(this.height=this.config.height);const e=1.65*this.config.noteHeight;this.mainSVG.setAttribute("width",`${this.width}`),this.mainSVG.setAttribute("height",`${this.height}`),this.mainG.setAttribute("transform",`translate(0, ${this.yBaseline+e})`),this.overlaySVG.setAttribute("width","200"),this.overlaySVG.setAttribute("height",`${this.height}`),this.overlayG.setAttribute("transform",`translate(0, ${this.yBaseline})`)}redraw(t,e){let i=-1;const n=this.config.pixelsPerTimeStep<=0;if(t){const o=`${t.start}-${t.pitch}`;if(this.playingNotes.forEach((t,e)=>{if(e!==o){const t=this.mainSVG.querySelector(`g[data-id="${e}"]`);t&&(0,r.resetElementHighlight)(t,this.config.noteColor),this.playingNotes.delete(e)}}),!this.playingNotes.has(o)){const n=this.mainSVG.querySelector(`g[data-id="${o}"]`);if(n){(0,r.highlightElement)(n,this.config.activeNoteColor),this.playingNotes.set(o,t);const a=n.getBoundingClientRect(),h=this.mainSVG.getBoundingClientRect();i=a.left-h.left+this.parentElement.scrollLeft;const l=n.hasAttribute("data-is-measure-start");e&&(this.config.scrollType!==s.BAR||l)&&this.scrollIntoViewIfNeeded(i)}}if(!n&&this.signaturesBlinking){const e=this.overlayG.getBoundingClientRect().width;this.jianpuModel.measuresInfo.quartersToTime(t.start,t.start)*this.config.pixelsPerTimeStep>e&&(this.signaturesBlinking=!1,(0,r.setBlinkAnimation)(this.overlayG,!1))}}else{this.jianpuModel.update(this.jianpuInfo,this.config.defaultKey);let t=this.width,e=this.width,i=this.height>0?this.height-this.yBaseline:3*this.config.noteHeight,s=0;const r=new Map;this.jianpuModel.jianpuBlockMap.forEach((o,a)=>{if(a>=this.lastRenderedQ-1e-9){t=n?e:this.jianpuModel.measuresInfo.quartersToTime(a,a)*this.config.pixelsPerTimeStep;const h=this.drawJianpuBlock(o,t,r);n?e+=h:e=Math.max(e,t+h);const l=this.mainSVG.querySelector(`g[data-block-start="${o.start}"]`);if(l)try{const t=l.getBBox(),e=t.y,n=t.y+t.height;s=Math.min(s,e),i=Math.max(i,n)}catch(t){}this.lastRenderedQ=a+o.length}}),this.height=Math.max(this.height,i-s+this.config.noteHeight),this.updateLayout(e)}return i}drawJianpuBlock(t,e,i){let s=0;const a=this.config.pixelsPerTimeStep<=0,h=t.isMeasureBeginning(),l=(0,r.createSVGGroupChild)(this.musicG,`block-${t.start}`);if(l.setAttribute("data-block-start",`${t.start}`),h&&t.start>1e-6){const t=e-(a?.6*this.estimatedNoteWidth:4),i=2*this.config.noteHeight,h=0,l=(0,r.drawSVGPath)(this.musicG,o.barPath,t,h,1,i/o.PATH_SCALE);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH),a&&(s+=n.LINE_STROKE_WIDTH)}const u=this.updateCurrentKey(t.start),c=this.updateCurrentTimeSignature(t.start);let d=0;if((u||c)&&t.start>1e-6){const t=e+s;d=this.drawSignatures(this.signaturesG,t,u,c),a&&(s+=d+.2*this.estimatedNoteWidth)}const g=e+s;let m=0;if(t.notes.length>0?m=this.drawNotes(t,g,i,l):t.length>1e-6&&(m=this.drawRest(t,g,l)),a){s+=m;let e=this.estimatedNoteWidth*this.config.noteSpacingFactor;t.beatEnd?e*=1:t.length<.0625?e*=.05:t.length<.125?e*=.1:t.length<.25?e*=.2:t.length<.5?e*=.4:t.length<1&&(e*=.5),s+=e}else s=Math.max(d,m);if(this.jianpuModel.isLastMeasureAtQ(t.start+t.length)){const t=e+s,i=2*this.config.noteHeight,h=0,l=(0,r.drawSVGPath)(this.musicG,o.barPath,t,h,1,i/o.PATH_SCALE);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH),a&&(s+=n.LINE_STROKE_WIDTH)}return s}drawNotes(t,e,i,s){let a=e,h=e;const l=.1*this.estimatedNoteWidth,u=`${this.numberFontSize}px`,c=`${this.smallFontSize}px`,{durationLines:d=0,augmentationDots:g=0,augmentationDash:m=!1}=t;return t.notes.forEach(e=>{const S=`${e.start}-${e.pitch}`,f=(0,r.createSVGGroupChild)(s,S);t.isMeasureBeginning()&&f.setAttribute("data-is-measure-start","true");let p=a,T=p;if(0!==e.accidental){const t=o.ACCIDENTAL_TEXT[e.accidental];(0,r.drawSVGText)(f,t,p+l,0,c,"normal","end","text-top",this.config.noteColor)}let E=0;if(m){const t=this.config.noteHeight*n.AUGMENTATION_DASH_FACTOR,e=t/50,i=(0,r.drawSVGPath)(f,o.augmentationDashPath,p,0,e,1);(0,r.setStroke)(i,this.config.noteColor,n.LINE_STROKE_WIDTH),E=t,T=p+E}else{const t=`${e.jianpuNumber}`;E=(0,r.drawSVGText)(f,t,p,0,u,"normal","start","middle",this.config.noteColor).getBBox().width,T=p+E}if(0!==e.octaveDot&&!1===m){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,i=t/(.15*o.PATH_SCALE),s=p+E/2,a=2.8*t,h=this.config.noteHeight*n.OCTAVE_DOT_OFFSET_FACTOR;for(let t=0;t<Math.abs(e.octaveDot);t++){const n=(e.octaveDot>0?-h:.6*h)-t*a*(e.octaveDot>0?1:-1);(0,r.drawSVGPath)(f,o.dotPath,s,n,i,i)}}if(d>0){const t=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR,i=E/o.PATH_SCALE*(n.DURATION_LINE_SCALES.get(d)??1);for(let s=0;s<d;s++){const a=t+s*e,h=(0,r.drawSVGPath)(f,o.underlinePath,p,a,i,1);(0,r.setStroke)(h,this.config.noteColor,n.LINE_STROKE_WIDTH)}}let A=T+l;if(g>0){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,e=t/(.15*o.PATH_SCALE);for(let i=0;i<g;i++)(0,r.drawSVGPath)(f,o.dotPath,A,0,e,e),A+=t+l;T=A+l}const I=T;if(e.tiedTo&&!m)i.set(e,{g:f,xNoteRight:I,yNoteBaseline:0});else if(e.tiedFrom){let t=e.tiedFrom;for(;t.tiedFrom;)t=t.tiedFrom;const s=i.get(t);if(s){const n=1*s.xNoteRight,a=(m?p-2.2*this.estimatedNoteWidth:p-l)-n,h=1.2*-this.config.noteHeight,u=a/o.PATH_SCALE*1.3,c=this.config.noteHeight/o.PATH_SCALE*1.6;a>1&&(0,r.drawSVGPath)(s.g,o.tiePath,n-(s.g.getCTM()?.e??0),h,u,c);let d=t;for(;d&&d!==e;){i.delete(d);const t=d.tiedTo;t&&(d=t)}}else console.warn("Missing linked SVG details for first tied note:",t)}h=Math.max(h,T)}),h-e}drawRest(t,e,i){const s=`${this.numberFontSize}px`,a=.1*this.estimatedNoteWidth,{durationLines:h=0,augmentationDots:l=0}=t;let u=e,c=u;const d=(0,r.drawSVGText)(i,"0",u,0,s,"normal","start","middle",this.config.noteColor).getBBox().width;if(c=u+d,h>0){const t=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR,s=d/o.PATH_SCALE*(n.DURATION_LINE_SCALES.get(h)??1);for(let a=0;a<h;a++){const h=t+a*e,l=(0,r.drawSVGPath)(i,o.underlinePath,u,h,s,1);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH)}}let g=c+a;if(l>0){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,e=t/(.15*o.PATH_SCALE);for(let s=0;s<l;s++)(0,r.drawSVGPath)(i,o.dotPath,g,0,e,e),g+=t+a;c=g+a}return c-e}drawSignatures(t,e,i,s){let n=e;const o=.3*this.estimatedNoteWidth,a=`${this.smallFontSize}px`,h=`${this.numberFontSize}px`;if(i){const e=`1=${l.PITCH_CLASS_NAMES[this.currentKey%12]??"C"}`;n+=(0,r.drawSVGText)(t,e,n,0,h,"normal","start","middle",this.config.noteColor).getBBox().width+2*o}if(s){const e=`${this.currentTimeSignature.numerator}/${this.currentTimeSignature.denominator}`;n+=(0,r.drawSVGText)(t,e,n,0,a,"normal","start","middle",this.config.noteColor).getBBox().width+o}const u=n-e;try{const e=t.getBBox(),i=e.y,s=e.y+e.height,n=Math.max(this.yBaseline+s,this.yBaseline-i)+.5*this.config.noteHeight;this.height=Math.max(this.height,n)}catch(t){}return t===this.overlayG&&this.config.pixelsPerTimeStep>0&&(this.signaturesBlinking=!0,(0,r.setBlinkAnimation)(this.overlayG,!0)),u}updateCurrentKey(t){const e=this.jianpuModel.measuresInfo.keySignatureAtQ(t,!0);return-1!==e&&e!==this.currentKey&&(this.currentKey=e,!0)}updateCurrentTimeSignature(t){const e=this.jianpuModel.measuresInfo.timeSignatureAtQ(t,!0);return!(!e||e.numerator===this.currentTimeSignature.numerator&&e.denominator===this.currentTimeSignature.denominator)&&(this.currentTimeSignature=e,!0)}handleScrollEvent=t=>{this.lastKnownScrollLeft=this.parentElement.scrollLeft,this.isScrolling||window.requestAnimationFrame(()=>{this.updateOverlaySignaturesForScroll(this.lastKnownScrollLeft),this.isScrolling=!1}),this.isScrolling=!0};scrollIntoViewIfNeeded(t){const e=this.parentElement.getBoundingClientRect().width,i=this.parentElement.scrollLeft;let n=i;if(this.config.scrollType===s.PAGE){const s=20;t<i+s?n=t-s:t>i+e-s&&(n=t-e+s)}else{n=t-.5*e}n=Math.max(0,Math.min(n,this.parentElement.scrollWidth-e)),Math.abs(n-i)>1&&(this.parentElement.scrollTo({left:n,behavior:"smooth"}),this.updateOverlaySignaturesForScroll(n))}updateOverlaySignaturesForScroll(t){const e=this.pixelsToTime(t),i=this.jianpuModel.measuresInfo.keySignatureAtQ(e),s=this.jianpuModel.measuresInfo.timeSignatureAtQ(e)??this.currentTimeSignature;let n=!1;if(i!==this.currentKey&&(this.currentKey=i,n=!0),s.numerator===this.currentTimeSignature.numerator&&s.denominator===this.currentTimeSignature.denominator||(this.currentTimeSignature=s,n=!0),n){for(;this.overlayG.lastChild;)this.overlayG.removeChild(this.overlayG.lastChild);this.drawSignatures(this.overlayG,0,!0,!0),t<10&&this.config.pixelsPerTimeStep>0?((0,r.setBlinkAnimation)(this.overlayG,!0),this.signaturesBlinking=!0):this.config.pixelsPerTimeStep>0&&((0,r.setBlinkAnimation)(this.overlayG,!1),this.signaturesBlinking=!1)}}pixelsToTime(t){return this.config.pixelsPerTimeStep<=0?0:this.jianpuModel.measuresInfo.timeToQuarters(t/this.config.pixelsPerTimeStep,0)}}},775(t,e,i){i.d(e,{MeasuresInfo:()=>r});var s=i(830),n=i(559);class r{measuresInfo;allowDottedRests=!0;constructor(t,e){if(this.measuresInfo=[],!(e>0))return;const i=r.getSortedChanges(t.tempos,s.DEFAULT_TEMPO),n=r.getSortedChanges(t.keySignatures,s.DEFAULT_KEY_SIGNATURE),o=r.getSortedChanges(t.timeSignatures,s.DEFAULT_TIME_SIGNATURE);let a=0,h=0,l=0,u=i[0].event,c=n[0].event,d=o[0].event,g=1,m=(0,s.getMeasureLength)(d),S=d.start;const f=[0];i.forEach(t=>f.push(t.start)),n.forEach(t=>f.push(t.start)),o.forEach(t=>f.push(t.start)),f.sort((t,e)=>t-e);let p=-1;for(let t=0;t<f.length;t++){const r=f[t];if(r>=e)break;if(r===p)continue;p=r;let T=!1,E=!1,A=!1;for(;a<i.length&&i[a].start<=r;)u=i[a++].event,T=!0;for(;h<n.length&&n[h].start<=r;)c=n[h++].event,E=!0;for(;l<o.length&&o[l].start<=r;){g+=(o[l].event.start-S)/m,g=Math.round(1e3*g)/1e3,d=o[l++].event,m=(0,s.getMeasureLength)(d),S=r,A=!0}const I={start:r,measureNumber:g+(r-S)/m,measureLength:m,tempo:u,keySignature:c,timeSignature:d};T&&(I.tempoChange=!0),E&&(I.keyChange=!0),A&&(I.timeChange=!0),this.measuresInfo.push(I)}}static getSortedChanges(t,e){const i=t&&t.length?t.slice():[e];return i.sort((t,e)=>t.start-e.start),i.map(t=>({start:Math.max(0,Math.round(t.start/n.MIN_RESOLUTION)*n.MIN_RESOLUTION),event:t}))}findIndex(t){let e=0,i=this.measuresInfo.length-1,s=0;for(;e<=i;){const n=Math.floor((e+i)/2);this.measuresInfo[n].start<=t?(s=n,e=n+1):i=n-1}return s}measureNumberAtQ(t){if(0===this.measuresInfo.length)return 1;const e=this.findIndex(t),i=this.measuresInfo[e],s=(t-i.start)/i.measureLength;return i.measureNumber+s+1e-9}measureLengthAtQ(t){if(0===this.measuresInfo.length)return(0,s.getMeasureLength)(s.DEFAULT_TIME_SIGNATURE);const e=this.findIndex(t);return this.measuresInfo[e].measureLength}tempoAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TEMPO.qpm;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.tempoChange&&o?r.tempo.qpm:-1}keySignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_KEY_SIGNATURE.key;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.keyChange&&o?r.keySignature.key:-1}timeSignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TIME_SIGNATURE;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.timeChange&&o?r.timeSignature:null}quartersToTime(t,e){const i=this.tempoAtQ(e);return i<=0?0:t/i*60}timeToQuarters(t,e){const i=this.tempoAtQ(e);if(i<=0)return 0;const s=t*i/60;return Math.round(s*n.MAX_QUARTER_DIVISION)/n.MAX_QUARTER_DIVISION}isBeatStart(t){if(0===this.measuresInfo.length)return!1;const e=this.findIndex(t),i=this.measuresInfo[e],s=i.timeSignature,r=(t-(i.start-(i.measureNumber-Math.floor(i.measureNumber))*i.measureLength))/(4/s.denominator);return Math.abs(r-Math.round(r))<n.MIN_RESOLUTION/2}}},559(t,e,i){i.d(e,["MAJOR_SCALE_INTERVALS",0,{0:1,2:2,4:3,5:4,7:5,9:6,11:7},"MAX_QUARTER_DIVISION",0,240,"MIDDLE_C_MIDI",0,60,"MIN_RESOLUTION",0,.0625,"PITCH_CLASS_NAMES",0,["C","C#","D","D#","E","F","F#","G","G#","A","A#","B"]])},240(t,e,i){const s=new Map([[1,1.78],[2,1.6],[3,1.3],[4,1.15]]);i.d(e,["AUGMENTATION_DASH_FACTOR",0,.8,"COMPACT_SPACING_FACTOR",0,1.5,"DOT_SIZE_FACTOR",0,.1,"DURATION_LINE_SCALES",0,s,"FONT_SIZE_MULTIPLIER",0,1.2,"LINE_STROKE_WIDTH",0,1,"OCTAVE_DOT_OFFSET_FACTOR",0,1,"SMALL_FONT_SIZE_MULTIPLIER",0,.75,"UNDERLINE_SPACING_FACTOR",0,.2])},961(t,e,i){i.d(e,["ACCIDENTAL_TEXT",0,["","#","b"],"PATH_SCALE",0,100,"augmentationDashPath",0,"m 0,0 h 50","barPath",0,"m 0,-50 v 100","dotPath",0,"M 0 0 a 15 15 0 1 0 0.0001 0 z","tiePath",0,"M -13,5 C 15,-15 65,-15 90,5 C 65,-25 15,-25 -13,5 Z","underlinePath",0,"m 0,0 h 100"])},134(t,e,i){i.d(e,{createSVGGroupChild:()=>o,drawSVGPath:()=>n,drawSVGText:()=>r,highlightElement:()=>l,resetElementHighlight:()=>u,setBlinkAnimation:()=>a,setStroke:()=>h});const s="http://www.w3.org/2000/svg";function n(t,e,i,n,r,o,a=1){const h=document.createElementNS(s,"path");return h.setAttributeNS(null,"d",e),h.setAttributeNS(null,"transform",`translate(${i}, ${n}) scale(${r}, ${o})`),a<1&&h.setAttributeNS(null,"opacity",`${a}`),t.appendChild(h),h}function r(t,e,i,n,r,o="normal",a="middle",h="middle",l="currentColor",u=1){const c=document.createElementNS(s,"text");c.setAttributeNS(null,"font-family","sans-serif"),c.setAttributeNS(null,"font-size",r),c.setAttributeNS(null,"font-weight",o),c.setAttributeNS(null,"x",`${i}`),c.setAttributeNS(null,"y",`${n}`),c.setAttributeNS(null,"text-anchor",a),c.setAttributeNS(null,"dominant-baseline",h),"currentColor"!==l&&c.setAttributeNS(null,"fill",l),u<1&&c.setAttributeNS(null,"opacity",`${u}`);const d=document.createTextNode(e);return c.appendChild(d),t.appendChild(c),c}function o(t,e){const i=document.createElementNS(s,"g");return e&&i.setAttribute("data-id",e),t.appendChild(i),i}function a(t,e=!0,i="1s"){let n=t.querySelector('animate[attributeName="opacity"]');return e?n?(n.setAttributeNS(null,"repeatCount","indefinite"),n.beginElement()):(n=document.createElementNS(s,"animate"),n.setAttributeNS(null,"attributeName","opacity"),n.setAttributeNS(null,"values","1;0.2;1"),n.setAttributeNS(null,"keyTimes","0;0.5;1"),n.setAttributeNS(null,"dur",i),n.setAttributeNS(null,"repeatCount","indefinite"),t.appendChild(n)):(n&&(n.endElement(),n.setAttributeNS(null,"repeatCount","0"),t.style.opacity="1"),t.style.opacity="1"),t}function h(t,e,i){t.setAttributeNS(null,"stroke",e),t.setAttributeNS(null,"stroke-width",`${i}`)}function l(t,e){const i=[];return t.matches("text, path")&&i.push(t),t.querySelectorAll("text, path").forEach(t=>{i.push(t)}),i.forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e)}),t}function u(t,e){t.querySelectorAll("text, path").forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e)})}i.d(e,["SVGNS",0,s])}};const e={};function i(s){const n=e[s];if(void 0!==n)return n.exports;const r=e[s]={exports:{}};return t[s](r,r.exports,i),r.exports}i.d=(t,e)=>{if(Array.isArray(e))for(var s=0;s<e.length;){var n=e[s++],r=e[s++],o=0===r?{enumerable:!0,value:e[s++]}:{enumerable:!0,get:r};i.o(t,n)||Object.defineProperty(t,n,o)}else for(var n in e)i.o(e,n)&&!i.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},i.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),i.r=t=>{Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};let s={};i.r(s),i.d(s,{DEFAULT_KEY_SIGNATURE:()=>a.DEFAULT_KEY_SIGNATURE,DEFAULT_TEMPO:()=>a.DEFAULT_TEMPO,DEFAULT_TIME_SIGNATURE:()=>a.DEFAULT_TIME_SIGNATURE,JianpuBlock:()=>o.JianpuBlock,JianpuModel:()=>r.JianpuModel,JianpuSVGRender:()=>n.JianpuSVGRender,ScrollType:()=>n.ScrollType,getMeasureLength:()=>a.getMeasureLength,mapMidiToJianpu:()=>r.mapMidiToJianpu,splitJianpuNote:()=>o.splitJianpuNote});var n=i(313),r=i(849),o=i(765),a=i(830);return s})());
|
|
1
|
+
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.mm=e():t.mm=e()}(global,()=>(()=>{"use strict";var t={765(t,e,i){i.d(e,{JianpuBlock:()=>o,splitJianpuNote:()=>r});var s=i(559);function n(t){return Math.abs(t)<1e-6}function r(t,e){const i=t.start+t.length;if(e<=t.start||e>=i||n(i-e))return null;const s=i-e;t.length=e-t.start;const r={start:e,length:s,pitch:t.pitch,intensity:t.intensity,jianpuNumber:t.jianpuNumber,octaveDot:t.octaveDot,accidental:0,tiedFrom:t};return t.tiedTo&&(r.tiedTo=t.tiedTo,t.tiedTo.tiedFrom=r),t.tiedTo=r,r}class o{start;length;notes;measureNumber;durationLines;augmentationDots;augmentationDash;beatBegin;beatEnd;isTieStart;isTieEnd;constructor(t=0,e=0,i=[],s=1){this.start=t,this.length=e,this.notes=i,this.measureNumber=s}addNote(t){if(0===this.notes.length)return this.start=t.start,this.length=t.length,this.notes.push(t),!0;if(!n(this.start-t.start))return console.warn(`JianpuBlock: Attempted to add note at ${t.start} to block starting at ${this.start}. Ignoring.`),!1;let e=!1,i=!1;for(let s=0;s<this.notes.length;s++)if(this.notes[s].pitch===t.pitch){i=!0,t.length<this.notes[s].length&&(this.notes[s].tiedFrom&&(t.tiedFrom=this.notes[s].tiedFrom,t.tiedFrom&&(t.tiedFrom.tiedTo=t)),this.notes[s].tiedTo&&(t.tiedTo=this.notes[s].tiedTo,t.tiedTo&&(t.tiedTo.tiedFrom=t)),this.notes[s]=t,e=!0);break}i||this.notes.push(t);let s=1/0;for(const t of this.notes)s=Math.min(s,t.length);return this.length=s,!i||e}split(t,e){const i=this.start+this.length;if(t<=this.start||t>=i||n(i-t))return null;const s=i-t,a=t-this.start,h=new o(t,s,[],e.measureNumberAtQ(t)),l=[];for(const e of this.notes){const i=e.start+e.length;if(i>t+1e-6){const i=r(e,t);i?l.push(i):console.warn("Split failed for note, unexpected state.")}else n(i-t)}return l.forEach(t=>h.addNote(t)),this.length=a,delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash,this.beatEnd&&(h.beatEnd=!0,delete this.beatEnd),this.isTieEnd&&(h.isTieStart=!0,delete this.isTieEnd),h}splitToBeat(t){const e=t.timeSignatureAtQ(this.start);if(!e)return null;const i=t.measureLengthAtQ(this.start),s=t.measureNumberAtQ(this.start),r=this.start-(s-Math.floor(s))*i,o=this.start-r,a=4/e.denominator,h=o/a;this.beatBegin=n(h-Math.round(h));const l=r+(Math.floor(h+1e-6)+1)*a,u=r+i,c=this.start+this.length;let d=null;l<c-1e-6&&l>this.start+1e-6&&(d=l),u<c-1e-6&&u>this.start+1e-6&&(null===d||u<d)&&(d=u);let g=null;if(null!==d)g=this.split(d,t),g&&(this.beatEnd=!0);else{const t=(o+this.length)/a;this.beatEnd=n(t-Math.round(t)),this.beatEnd||(this.beatEnd=n(c-u))}return this.isTieStart=this.notes.some(t=>t.tiedFrom),this.isTieEnd=this.notes.some(t=>t.tiedTo),g&&(g.isTieStart=g.notes.some(t=>t.tiedFrom),g.isTieEnd=g.notes.some(t=>t.tiedTo),this.notes.some(t=>t.tiedTo&&t.start+t.length>d)&&delete this.isTieEnd),g}calculateRenderProperties(t){delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash;const e=this.length;if(n(e)||e<0)return;if(t.allowDottedRests||this.notes.length>0){if(n(e-1.5))return void(this.augmentationDots=1);if(n(e-.75))return this.durationLines=1,void(this.augmentationDots=1);if(n(e-.375))return this.durationLines=2,void(this.augmentationDots=1);n(e-3)&&(this.augmentationDots=1)}if(this.durationLines=e>=3.999999||e>=1.999999||e>=.999999?0:e>=.499999?1:e>=.249999?2:e>=.124999?3:4,this.augmentationDash=!1,1===this.notes.length){const e=this.notes[0],i=t.timeSignatureAtQ(this.start);if(!i)return;const s=Math.max(4/i.denominator,1);if(!(this.measureNumber%1<=1e-6)&&e.tiedFrom&&n(e.tiedFrom.length-s)&&e.tiedFrom.pitch===e.pitch&&e.length>=1){let i=!0;if(e.tiedTo){const s=e.start+e.length;i=Math.floor(t.measureNumberAtQ(this.start))===Math.floor(t.measureNumberAtQ(s))&&e.tiedTo.length>=1}i&&(this.augmentationDash=!0)}}}splitToStandardSymbol(t){const e=this.length;if(n(e)||e<s.MIN_RESOLUTION-1e-6)return null;const i=[];t.allowDottedRests||this.notes.length>0?(i.push(6),i.push(4),i.push(3),i.push(2),i.push(1.5),i.push(1),i.push(.75),i.push(.5),i.push(.375),i.push(.25),i.push(.125),i.push(.0625)):(i.push(4),i.push(2),i.push(1),i.push(.5),i.push(.25),i.push(.125),i.push(.0625));let r=0;for(const t of i)if(e>=t-1e-6){r=t;break}n(r)&&(r=s.MIN_RESOLUTION,e<r-1e-6&&e>1e-6&&console.warn(`Block length ${e} is too small, rendering as ${r}`));let o=null;return e>r+1e-6?(o=this.split(this.start+r,t),this.length!==r&&(console.warn(`Adjusting block length after split from ${this.length} to ${r}`),this.length=r)):this.length=r,o}mergeToMap(t){const e=t.get(this.start);e?(this.notes.forEach(t=>e.addNote(t)),0!==this.measureNumber&&(e.measureNumber=this.measureNumber)):t.set(this.start,this)}isMeasureBeginning(){return n(this.measureNumber-Math.floor(this.measureNumber))}}},830(t,e,i){i.d(e,{getMeasureLength:()=>s});function s(t){return t.numerator*(4/t.denominator)}i.d(e,["DEFAULT_KEY_SIGNATURE",0,{start:0,key:0},"DEFAULT_TEMPO",0,{start:0,qpm:60},"DEFAULT_TIME_SIGNATURE",0,{start:0,numerator:4,denominator:4}])},849(t,e,i){i.d(e,{JianpuModel:()=>a,mapMidiToJianpu:()=>h});var s=i(830),n=i(775),r=i(765),o=i(559);class a{jianpuInfo;measuresInfo;jianpuBlockMap;lastQ;constructor(t,e){this.jianpuInfo=t,this.jianpuBlockMap=new Map,this.lastQ=0,this.update(t,e)}isLastMeasureAtQ(t){return t>=this.lastQ-1e-6}getTotalDuration(){return this.lastQ}update(t,e){this.jianpuInfo=t,t.notes.sort((t,e)=>t.start-e.start),this.lastQ=0,t.notes.forEach(t=>{this.lastQ=Math.max(this.lastQ,t.start+t.length)}),this.lastQ+=1e-6,t.tempos=t.tempos&&t.tempos.length?t.tempos:[s.DEFAULT_TEMPO],t.tempos.sort((t,e)=>t.start-e.start),t.tempos[0].start>1e-6&&t.tempos.unshift({...s.DEFAULT_TEMPO,start:0});const i=void 0!==e?{start:0,key:e}:{...s.DEFAULT_KEY_SIGNATURE};t.keySignatures=t.keySignatures&&t.keySignatures.length?t.keySignatures:[i],t.keySignatures.sort((t,e)=>t.start-e.start),t.keySignatures[0].start>1e-6&&t.keySignatures.unshift({...i,start:0}),t.timeSignatures=t.timeSignatures&&t.timeSignatures.length?t.timeSignatures:[s.DEFAULT_TIME_SIGNATURE],t.timeSignatures.sort((t,e)=>t.start-e.start),t.timeSignatures[0].start>1e-6&&t.timeSignatures.unshift({...s.DEFAULT_TIME_SIGNATURE,start:0}),this.measuresInfo=new n.MeasuresInfo(t,this.lastQ),this.infoToBlocks()}infoToBlocks(){const t=new Map;let e=0;if(this.jianpuInfo.notes.forEach(i=>{const s=i.start,n=this.measuresInfo.measureNumberAtQ(s);if(s>e+1e-6){const i=e,n=s-i,o=this.measuresInfo.measureNumberAtQ(i),a=new r.JianpuBlock(i,n,[],o);t.set(i,a)}const o=this.measuresInfo.keySignatureAtQ(s),a=this.createJianpuNote(i,o);let h=t.get(s);h||(h=new r.JianpuBlock(s,0,[],n),t.set(s,h)),h.addNote(a),e=Math.max(e,s+h.length)}),this.lastQ>e+1e-6){const i=e,s=this.lastQ-1e-6-i;if(s>1e-6){const e=this.measuresInfo.measureNumberAtQ(i),n=new r.JianpuBlock(i,s,[],e);t.set(i,n)}}this.jianpuBlockMap=new Map;const i=Array.from(t.keys()).sort((t,e)=>t-e);let s=[];i.forEach(e=>{s.push(t.get(e))});const n=new Set;for(;s.length>0;){let t=s.shift();n.has(t.start)&&this.jianpuBlockMap.has(t.start);let e=t.splitToBeat(this.measuresInfo);if(e){t.mergeToMap(this.jianpuBlockMap),n.add(t.start),s.unshift(e);continue}let i=t,r=null;do{r=i.splitToStandardSymbol(this.measuresInfo),i.mergeToMap(this.jianpuBlockMap),n.add(i.start),r&&(i=r)}while(r)}this.jianpuBlockMap.forEach(t=>{t.calculateRenderProperties(this.measuresInfo)})}createJianpuNote(t,e){const i=h(t.pitch,e);return{...t,jianpuNumber:i.jianpuNumber,octaveDot:i.octaveDot,accidental:i.accidental}}}function h(t,e){const i=e%12;let s=o.MIDDLE_C_MIDI+i;i>o.MIDDLE_C_MIDI%12&&(s-=12);const n=(t-(s+12*Math.round((t-s)/12))+12)%12;let r=o.MAJOR_SCALE_INTERVALS[n],a=0;if(void 0===r){switch(n){case 1:r=o.MAJOR_SCALE_INTERVALS[0],a=1;break;case 3:r=o.MAJOR_SCALE_INTERVALS[4],a=2;break;case 6:r=o.MAJOR_SCALE_INTERVALS[5],a=1;break;case 8:r=o.MAJOR_SCALE_INTERVALS[9],a=2;break;case 10:r=o.MAJOR_SCALE_INTERVALS[11],a=2;break;default:{console.warn(`Unexpected chromatic interval ${n} in mapMidiToJianpu. Defaulting to sharp of lower valid degree.`);const i=(n-1+12)%12,s=(n+1+12)%12,h=o.MAJOR_SCALE_INTERVALS[i],l=o.MAJOR_SCALE_INTERVALS[s];void 0!==h?(r=h,a=1):void 0!==l?(r=l,a=2):(r=1,a=1,console.error(`Could not determine Jianpu number components for MIDI ${t}, interval ${n} from tonic in key ${e}.`));break}}void 0===r&&(console.error(`Jianpu number became undefined for MIDI ${t} (interval ${n}, key ${e}) after chromatic processing. This indicates a logic error or misconfigured MAJOR_SCALE_INTERVALS.`),r=1,a=1)}return{jianpuNumber:r,octaveDot:Math.floor((t-s)/12),accidental:a}}},313(t,e,i){i.d(e,{JianpuSVGRender:()=>u,ScrollType:()=>s});var s,n=i(240),r=i(134),o=i(961),a=i(830),h=i(849),l=i(559);!function(t){t[t.PAGE=0]="PAGE",t[t.NOTE=1]="NOTE",t[t.BAR=2]="BAR"}(s||(s={}));class u{jianpuInfo;jianpuModel;config;height;width;parentElement;div;mainSVG;mainG;musicG;signaturesG;overlaySVG;overlayG;signaturesBlinking;lastKnownScrollLeft;isScrolling;currentKey;currentTimeSignature;playingNotes;lastRenderedQ;estimatedNoteWidth;numberFontSize;smallFontSize;yBaseline;parseColorString(t){return/^[a-z]+$/i.test(t)||t.startsWith("rgb(")?t:/^\d+,\s*\d+,\s*\d+$/.test(t)?`rgb(${t})`:t}constructor(t,e,i){this.jianpuInfo=t,this.div=i;this.config={noteHeight:e.noteHeight??20,noteSpacingFactor:e.noteSpacingFactor??n.COMPACT_SPACING_FACTOR,pixelsPerTimeStep:e.pixelsPerTimeStep??0,noteColor:this.parseColorString(e.noteColor??"black"),activeNoteColor:this.parseColorString(e.activeNoteColor??"red"),defaultKey:e.defaultKey??0,scrollType:e.scrollType??s.PAGE,fontFamily:e.fontFamily??"sans-serif",width:e.width??0,height:e.height??0},this.jianpuModel=new h.JianpuModel(this.jianpuInfo,this.config.defaultKey),this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??a.DEFAULT_TIME_SIGNATURE,this.playingNotes=new Map,this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.numberFontSize=this.config.noteHeight*n.FONT_SIZE_MULTIPLIER,this.smallFontSize=this.config.noteHeight*n.SMALL_FONT_SIZE_MULTIPLIER,this.estimatedNoteWidth=.6*this.numberFontSize,this.yBaseline=1.5*this.config.noteHeight,this.height=0,this.width=0,this.clear(),this.redraw()}clear(){for(;this.div.lastChild;)this.div.removeChild(this.div.lastChild);this.div.style.position="relative",this.div.style.overflow="hidden",this.overlaySVG=document.createElementNS(r.SVGNS,"svg"),this.overlaySVG.style.position="absolute",this.overlaySVG.style.left="0",this.overlaySVG.style.top="0",this.overlaySVG.style.pointerEvents="none",this.div.appendChild(this.overlaySVG),this.overlayG=(0,r.createSVGGroupChild)(this.overlaySVG,"overlay"),this.parentElement=document.createElement("div"),this.parentElement.style.overflowX="auto",this.parentElement.style.overflowY="hidden",this.parentElement.style.width="100%",this.parentElement.style.height="100%",this.div.appendChild(this.parentElement),this.parentElement.addEventListener("scroll",this.handleScrollEvent),this.mainSVG=document.createElementNS(r.SVGNS,"svg"),this.mainSVG.style.display="block",this.parentElement.appendChild(this.mainSVG),this.mainG=(0,r.createSVGGroupChild)(this.mainSVG,"main-content"),this.signaturesG=(0,r.createSVGGroupChild)(this.mainG,"signatures"),this.musicG=(0,r.createSVGGroupChild)(this.mainG,"music"),this.playingNotes.clear(),this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.height=this.config.height>0?this.config.height:5*this.config.noteHeight,this.width=this.config.width>0?this.config.width:0,this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??a.DEFAULT_TIME_SIGNATURE,this.drawSignatures(this.overlayG,0,!0,!0),this.updateLayout()}updateLayout(t){this.width=t??this.width,this.config.width>0&&(this.width=this.config.width),this.height=Math.max(this.height,6*this.config.noteHeight),this.config.height>0&&(this.height=this.config.height);const e=1.65*this.config.noteHeight;this.mainSVG.setAttribute("width",`${this.width}`),this.mainSVG.setAttribute("height",`${this.height}`),this.mainG.setAttribute("transform",`translate(0, ${this.yBaseline+e})`),this.overlaySVG.setAttribute("width","200"),this.overlaySVG.setAttribute("height",`${this.height}`),this.overlayG.setAttribute("transform",`translate(0, ${this.yBaseline})`)}redraw(t,e){let i=-1;const n=this.config.pixelsPerTimeStep<=0;if(t){const o=`${t.start}-${t.pitch}`;if(this.playingNotes.forEach((t,e)=>{if(e!==o){const t=this.mainSVG.querySelector(`g[data-id="${e}"]`);t&&(0,r.resetElementHighlight)(t,this.config.noteColor),this.playingNotes.delete(e)}}),!this.playingNotes.has(o)){const n=this.mainSVG.querySelector(`g[data-id="${o}"]`);if(n){(0,r.highlightElement)(n,this.config.activeNoteColor),this.playingNotes.set(o,t);const a=n.getBoundingClientRect(),h=this.mainSVG.getBoundingClientRect();i=a.left-h.left+this.parentElement.scrollLeft;const l=n.hasAttribute("data-is-measure-start");e&&(this.config.scrollType!==s.BAR||l)&&this.scrollIntoViewIfNeeded(i)}}if(!n&&this.signaturesBlinking){const e=this.overlayG.getBoundingClientRect().width;this.jianpuModel.measuresInfo.quartersToTime(t.start,t.start)*this.config.pixelsPerTimeStep>e&&(this.signaturesBlinking=!1,(0,r.setBlinkAnimation)(this.overlayG,!1))}}else{this.jianpuModel.update(this.jianpuInfo,this.config.defaultKey);let t=this.width,e=this.width,i=this.height>0?this.height-this.yBaseline:3*this.config.noteHeight,s=0;const r=new Map;this.jianpuModel.jianpuBlockMap.forEach((o,a)=>{if(a>=this.lastRenderedQ-1e-9){t=n?e:this.jianpuModel.measuresInfo.quartersToTime(a,a)*this.config.pixelsPerTimeStep;const h=this.drawJianpuBlock(o,t,r);n?e+=h:e=Math.max(e,t+h);const l=this.mainSVG.querySelector(`g[data-block-start="${o.start}"]`);if(l)try{const t=l.getBBox(),e=t.y,n=t.y+t.height;s=Math.min(s,e),i=Math.max(i,n)}catch(t){}this.lastRenderedQ=a+o.length}}),this.height=Math.max(this.height,i-s+this.config.noteHeight),this.updateLayout(e)}return i}drawJianpuBlock(t,e,i){let s=0;const a=this.config.pixelsPerTimeStep<=0,h=t.isMeasureBeginning(),l=(0,r.createSVGGroupChild)(this.musicG,`block-${t.start}`);if(l.setAttribute("data-block-start",`${t.start}`),h&&t.start>1e-6){const t=e-(a?.6*this.estimatedNoteWidth:4),i=2*this.config.noteHeight,h=0,l=(0,r.drawSVGPath)(this.musicG,o.barPath,t,h,1,i/o.PATH_SCALE);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH),a&&(s+=n.LINE_STROKE_WIDTH)}const u=this.updateCurrentKey(t.start),c=this.updateCurrentTimeSignature(t.start);let d=0;if((u||c)&&t.start>1e-6){const t=e+s;d=this.drawSignatures(this.signaturesG,t,u,c),a&&(s+=d+.2*this.estimatedNoteWidth)}const g=e+s;let m=0;if(t.notes.length>0?m=this.drawNotes(t,g,i,l):t.length>1e-6&&(m=this.drawRest(t,g,l)),a){s+=m;let e=this.estimatedNoteWidth*this.config.noteSpacingFactor;t.beatEnd?e*=1:t.length<.0625?e*=.05:t.length<.125?e*=.1:t.length<.25?e*=.2:t.length<.5?e*=.4:t.length<1&&(e*=.5),s+=e}else s=Math.max(d,m);if(this.jianpuModel.isLastMeasureAtQ(t.start+t.length)){const t=e+s,i=2*this.config.noteHeight,h=0,l=(0,r.drawSVGPath)(this.musicG,o.barPath,t,h,1,i/o.PATH_SCALE);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH),a&&(s+=n.LINE_STROKE_WIDTH)}return s}drawNotes(t,e,i,s){let a=e,h=e;const l=.1*this.estimatedNoteWidth,u=`${this.numberFontSize}px`,c=`${this.smallFontSize}px`,{durationLines:d=0,augmentationDots:g=0,augmentationDash:m=!1}=t;return t.notes.forEach(e=>{const f=`${e.start}-${e.pitch}`,S=(0,r.createSVGGroupChild)(s,f);t.isMeasureBeginning()&&S.setAttribute("data-is-measure-start","true");let p=a,T=p;if(0!==e.accidental){const t=o.ACCIDENTAL_TEXT[e.accidental];(0,r.drawSVGText)(S,t,p+l,0,c,"normal","end","text-top",this.config.noteColor,1,this.config.fontFamily)}let A=0;if(m){const t=this.config.noteHeight*n.AUGMENTATION_DASH_FACTOR,e=t/50,i=(0,r.drawSVGPath)(S,o.augmentationDashPath,p,0,e,1);(0,r.setStroke)(i,this.config.noteColor,n.LINE_STROKE_WIDTH),A=t,T=p+A}else{const t=`${e.jianpuNumber}`;A=(0,r.drawSVGText)(S,t,p,0,u,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width,T=p+A}if(0!==e.octaveDot&&!1===m){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,i=t/(.15*o.PATH_SCALE),s=p+A/2,a=2.8*t,h=this.config.noteHeight*n.OCTAVE_DOT_OFFSET_FACTOR;for(let t=0;t<Math.abs(e.octaveDot);t++){const n=(e.octaveDot>0?-h:.6*h)-t*a*(e.octaveDot>0?1:-1);(0,r.drawSVGPath)(S,o.dotPath,s,n,i,i)}}if(d>0){const t=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR,i=A/o.PATH_SCALE*(n.DURATION_LINE_SCALES.get(d)??1);for(let s=0;s<d;s++){const a=t+s*e,h=(0,r.drawSVGPath)(S,o.underlinePath,p,a,i,1);(0,r.setStroke)(h,this.config.noteColor,n.LINE_STROKE_WIDTH)}}let E=T+l;if(g>0){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,e=t/(.15*o.PATH_SCALE);for(let i=0;i<g;i++)(0,r.drawSVGPath)(S,o.dotPath,E,0,e,e),E+=t+l;T=E+l}const I=T;if(e.tiedTo&&!m)i.set(e,{g:S,xNoteRight:I,yNoteBaseline:0});else if(e.tiedFrom){let t=e.tiedFrom;for(;t.tiedFrom;)t=t.tiedFrom;const s=i.get(t);if(s){const n=1*s.xNoteRight,a=(m?p-2.2*this.estimatedNoteWidth:p-l)-n,h=1.2*-this.config.noteHeight,u=a/o.PATH_SCALE*1.3,c=this.config.noteHeight/o.PATH_SCALE*1.6;a>1&&(0,r.drawSVGPath)(s.g,o.tiePath,n-(s.g.getCTM()?.e??0),h,u,c);let d=t;for(;d&&d!==e;){i.delete(d);const t=d.tiedTo;t&&(d=t)}}else console.warn("Missing linked SVG details for first tied note:",t)}h=Math.max(h,T)}),h-e}drawRest(t,e,i){const s=`${this.numberFontSize}px`,a=.1*this.estimatedNoteWidth,{durationLines:h=0,augmentationDots:l=0}=t;let u=e,c=u;const d=(0,r.drawSVGText)(i,"0",u,0,s,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width;if(c=u+d,h>0){const t=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR,s=d/o.PATH_SCALE*(n.DURATION_LINE_SCALES.get(h)??1);for(let a=0;a<h;a++){const h=t+a*e,l=(0,r.drawSVGPath)(i,o.underlinePath,u,h,s,1);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH)}}let g=c+a;if(l>0){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,e=t/(.15*o.PATH_SCALE);for(let s=0;s<l;s++)(0,r.drawSVGPath)(i,o.dotPath,g,0,e,e),g+=t+a;c=g+a}return c-e}drawSignatures(t,e,i,s){let n=e;const o=.3*this.estimatedNoteWidth,a=`${this.smallFontSize}px`,h=`${this.numberFontSize}px`;if(i){const e=`1=${l.PITCH_CLASS_NAMES[this.currentKey%12]??"C"}`;n+=(0,r.drawSVGText)(t,e,n,0,h,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width+2*o}if(s){const e=`${this.currentTimeSignature.numerator}/${this.currentTimeSignature.denominator}`;n+=(0,r.drawSVGText)(t,e,n,0,a,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width+o}const u=n-e;try{const e=t.getBBox(),i=e.y,s=e.y+e.height,n=Math.max(this.yBaseline+s,this.yBaseline-i)+.5*this.config.noteHeight;this.height=Math.max(this.height,n)}catch(t){}return t===this.overlayG&&this.config.pixelsPerTimeStep>0&&(this.signaturesBlinking=!0,(0,r.setBlinkAnimation)(this.overlayG,!0)),u}updateCurrentKey(t){const e=this.jianpuModel.measuresInfo.keySignatureAtQ(t,!0);return-1!==e&&e!==this.currentKey&&(this.currentKey=e,!0)}updateCurrentTimeSignature(t){const e=this.jianpuModel.measuresInfo.timeSignatureAtQ(t,!0);return!(!e||e.numerator===this.currentTimeSignature.numerator&&e.denominator===this.currentTimeSignature.denominator)&&(this.currentTimeSignature=e,!0)}handleScrollEvent=t=>{this.lastKnownScrollLeft=this.parentElement.scrollLeft,this.isScrolling||window.requestAnimationFrame(()=>{this.updateOverlaySignaturesForScroll(this.lastKnownScrollLeft),this.isScrolling=!1}),this.isScrolling=!0};scrollIntoViewIfNeeded(t){const e=this.parentElement.getBoundingClientRect().width,i=this.parentElement.scrollLeft;let n=i;if(this.config.scrollType===s.PAGE){const s=20;t<i+s?n=t-s:t>i+e-s&&(n=t-e+s)}else{n=t-.5*e}n=Math.max(0,Math.min(n,this.parentElement.scrollWidth-e)),Math.abs(n-i)>1&&(this.parentElement.scrollTo({left:n,behavior:"smooth"}),this.updateOverlaySignaturesForScroll(n))}updateOverlaySignaturesForScroll(t){const e=this.pixelsToTime(t),i=this.jianpuModel.measuresInfo.keySignatureAtQ(e),s=this.jianpuModel.measuresInfo.timeSignatureAtQ(e)??this.currentTimeSignature;let n=!1;if(i!==this.currentKey&&(this.currentKey=i,n=!0),s.numerator===this.currentTimeSignature.numerator&&s.denominator===this.currentTimeSignature.denominator||(this.currentTimeSignature=s,n=!0),n){for(;this.overlayG.lastChild;)this.overlayG.removeChild(this.overlayG.lastChild);this.drawSignatures(this.overlayG,0,!0,!0),t<10&&this.config.pixelsPerTimeStep>0?((0,r.setBlinkAnimation)(this.overlayG,!0),this.signaturesBlinking=!0):this.config.pixelsPerTimeStep>0&&((0,r.setBlinkAnimation)(this.overlayG,!1),this.signaturesBlinking=!1)}}pixelsToTime(t){return this.config.pixelsPerTimeStep<=0?0:this.jianpuModel.measuresInfo.timeToQuarters(t/this.config.pixelsPerTimeStep,0)}}},775(t,e,i){i.d(e,{MeasuresInfo:()=>r});var s=i(830),n=i(559);class r{measuresInfo;allowDottedRests=!0;constructor(t,e){if(this.measuresInfo=[],!(e>0))return;const i=r.getSortedChanges(t.tempos,s.DEFAULT_TEMPO),n=r.getSortedChanges(t.keySignatures,s.DEFAULT_KEY_SIGNATURE),o=r.getSortedChanges(t.timeSignatures,s.DEFAULT_TIME_SIGNATURE);let a=0,h=0,l=0,u=i[0].event,c=n[0].event,d=o[0].event,g=1,m=(0,s.getMeasureLength)(d),f=d.start;const S=[0];i.forEach(t=>S.push(t.start)),n.forEach(t=>S.push(t.start)),o.forEach(t=>S.push(t.start)),S.sort((t,e)=>t-e);let p=-1;for(let t=0;t<S.length;t++){const r=S[t];if(r>=e)break;if(r===p)continue;p=r;let T=!1,A=!1,E=!1;for(;a<i.length&&i[a].start<=r;)u=i[a++].event,T=!0;for(;h<n.length&&n[h].start<=r;)c=n[h++].event,A=!0;for(;l<o.length&&o[l].start<=r;){g+=(o[l].event.start-f)/m,g=Math.round(1e3*g)/1e3,d=o[l++].event,m=(0,s.getMeasureLength)(d),f=r,E=!0}const I={start:r,measureNumber:g+(r-f)/m,measureLength:m,tempo:u,keySignature:c,timeSignature:d};T&&(I.tempoChange=!0),A&&(I.keyChange=!0),E&&(I.timeChange=!0),this.measuresInfo.push(I)}}static getSortedChanges(t,e){const i=t&&t.length?t.slice():[e];return i.sort((t,e)=>t.start-e.start),i.map(t=>({start:Math.max(0,Math.round(t.start/n.MIN_RESOLUTION)*n.MIN_RESOLUTION),event:t}))}findIndex(t){let e=0,i=this.measuresInfo.length-1,s=0;for(;e<=i;){const n=Math.floor((e+i)/2);this.measuresInfo[n].start<=t?(s=n,e=n+1):i=n-1}return s}measureNumberAtQ(t){if(0===this.measuresInfo.length)return 1;const e=this.findIndex(t),i=this.measuresInfo[e],s=(t-i.start)/i.measureLength;return i.measureNumber+s+1e-9}measureLengthAtQ(t){if(0===this.measuresInfo.length)return(0,s.getMeasureLength)(s.DEFAULT_TIME_SIGNATURE);const e=this.findIndex(t);return this.measuresInfo[e].measureLength}tempoAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TEMPO.qpm;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.tempoChange&&o?r.tempo.qpm:-1}keySignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_KEY_SIGNATURE.key;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.keyChange&&o?r.keySignature.key:-1}timeSignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TIME_SIGNATURE;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.timeChange&&o?r.timeSignature:null}quartersToTime(t,e){const i=this.tempoAtQ(e);return i<=0?0:t/i*60}timeToQuarters(t,e){const i=this.tempoAtQ(e);if(i<=0)return 0;const s=t*i/60;return Math.round(s*n.MAX_QUARTER_DIVISION)/n.MAX_QUARTER_DIVISION}isBeatStart(t){if(0===this.measuresInfo.length)return!1;const e=this.findIndex(t),i=this.measuresInfo[e],s=i.timeSignature,r=(t-(i.start-(i.measureNumber-Math.floor(i.measureNumber))*i.measureLength))/(4/s.denominator);return Math.abs(r-Math.round(r))<n.MIN_RESOLUTION/2}}},559(t,e,i){i.d(e,["MAJOR_SCALE_INTERVALS",0,{0:1,2:2,4:3,5:4,7:5,9:6,11:7},"MAX_QUARTER_DIVISION",0,240,"MIDDLE_C_MIDI",0,60,"MIN_RESOLUTION",0,.0625,"PITCH_CLASS_NAMES",0,["C","C#","D","D#","E","F","F#","G","G#","A","A#","B"]])},240(t,e,i){const s=new Map([[1,1.78],[2,1.6],[3,1.3],[4,1.15]]);i.d(e,["AUGMENTATION_DASH_FACTOR",0,.8,"COMPACT_SPACING_FACTOR",0,1.5,"DOT_SIZE_FACTOR",0,.1,"DURATION_LINE_SCALES",0,s,"FONT_SIZE_MULTIPLIER",0,1.2,"LINE_STROKE_WIDTH",0,1,"OCTAVE_DOT_OFFSET_FACTOR",0,1,"SMALL_FONT_SIZE_MULTIPLIER",0,.75,"UNDERLINE_SPACING_FACTOR",0,.2])},961(t,e,i){i.d(e,["ACCIDENTAL_TEXT",0,["","#","b"],"PATH_SCALE",0,100,"augmentationDashPath",0,"m 0,0 h 50","barPath",0,"m 0,-50 v 100","dotPath",0,"M 0 0 a 15 15 0 1 0 0.0001 0 z","tiePath",0,"M -13,5 C 15,-15 65,-15 90,5 C 65,-25 15,-25 -13,5 Z","underlinePath",0,"m 0,0 h 100"])},134(t,e,i){i.d(e,{createSVGGroupChild:()=>o,drawSVGPath:()=>n,drawSVGText:()=>r,highlightElement:()=>l,resetElementHighlight:()=>u,setBlinkAnimation:()=>a,setStroke:()=>h});const s="http://www.w3.org/2000/svg";function n(t,e,i,n,r,o,a=1){const h=document.createElementNS(s,"path");return h.setAttributeNS(null,"d",e),h.setAttributeNS(null,"transform",`translate(${i}, ${n}) scale(${r}, ${o})`),a<1&&h.setAttributeNS(null,"opacity",`${a}`),t.appendChild(h),h}function r(t,e,i,n,r,o="normal",a="middle",h="middle",l="currentColor",u=1,c="sans-serif"){const d=document.createElementNS(s,"text");d.setAttributeNS(null,"font-family",c),d.setAttributeNS(null,"font-size",r),d.setAttributeNS(null,"font-weight",o),d.setAttributeNS(null,"x",`${i}`),d.setAttributeNS(null,"y",`${n}`),d.setAttributeNS(null,"text-anchor",a),d.setAttributeNS(null,"dominant-baseline",h),"currentColor"!==l&&d.setAttributeNS(null,"fill",l),u<1&&d.setAttributeNS(null,"opacity",`${u}`);const g=document.createTextNode(e);return d.appendChild(g),t.appendChild(d),d}function o(t,e){const i=document.createElementNS(s,"g");return e&&i.setAttribute("data-id",e),t.appendChild(i),i}function a(t,e=!0,i="1s"){let n=t.querySelector('animate[attributeName="opacity"]');return e?n?(n.setAttributeNS(null,"repeatCount","indefinite"),n.beginElement()):(n=document.createElementNS(s,"animate"),n.setAttributeNS(null,"attributeName","opacity"),n.setAttributeNS(null,"values","1;0.2;1"),n.setAttributeNS(null,"keyTimes","0;0.5;1"),n.setAttributeNS(null,"dur",i),n.setAttributeNS(null,"repeatCount","indefinite"),t.appendChild(n)):(n&&(n.endElement(),n.setAttributeNS(null,"repeatCount","0"),t.style.opacity="1"),t.style.opacity="1"),t}function h(t,e,i){t.setAttributeNS(null,"stroke",e),t.setAttributeNS(null,"stroke-width",`${i}`)}function l(t,e){const i=[];return t.matches("text, path")&&i.push(t),t.querySelectorAll("text, path").forEach(t=>{i.push(t)}),i.forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e);const i=t.getAttribute("stroke");null!==i&&"none"!==i&&t.setAttribute("stroke",e)}),t}function u(t,e){t.querySelectorAll("text, path").forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e);const i=t.getAttribute("stroke");null!==i&&"none"!==i&&t.setAttribute("stroke",e)})}i.d(e,["SVGNS",0,s])}};const e={};function i(s){const n=e[s];if(void 0!==n)return n.exports;const r=e[s]={exports:{}};return t[s](r,r.exports,i),r.exports}i.d=(t,e)=>{if(Array.isArray(e))for(var s=0;s<e.length;){var n=e[s++],r=e[s++],o=0===r?{enumerable:!0,value:e[s++]}:{enumerable:!0,get:r};i.o(t,n)||Object.defineProperty(t,n,o)}else for(var n in e)i.o(e,n)&&!i.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},i.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),i.r=t=>{Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};let s={};i.r(s),i.d(s,{DEFAULT_KEY_SIGNATURE:()=>a.DEFAULT_KEY_SIGNATURE,DEFAULT_TEMPO:()=>a.DEFAULT_TEMPO,DEFAULT_TIME_SIGNATURE:()=>a.DEFAULT_TIME_SIGNATURE,JianpuBlock:()=>o.JianpuBlock,JianpuModel:()=>r.JianpuModel,JianpuSVGRender:()=>n.JianpuSVGRender,ScrollType:()=>n.ScrollType,getMeasureLength:()=>a.getMeasureLength,mapMidiToJianpu:()=>r.mapMidiToJianpu,splitJianpuNote:()=>o.splitJianpuNote});var n=i(313),r=i(849),o=i(765),a=i(830);return s})());
|
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.mm=e():t.mm=e()}(global,()=>(()=>{"use strict";var t={765(t,e,i){i.d(e,{JianpuBlock:()=>o});var s=i(559);function n(t){return Math.abs(t)<1e-6}function r(t,e){const i=t.start+t.length;if(e<=t.start||e>=i||n(i-e))return null;const s=i-e;t.length=e-t.start;const r={start:e,length:s,pitch:t.pitch,intensity:t.intensity,jianpuNumber:t.jianpuNumber,octaveDot:t.octaveDot,accidental:0,tiedFrom:t};return t.tiedTo&&(r.tiedTo=t.tiedTo,t.tiedTo.tiedFrom=r),t.tiedTo=r,r}class o{start;length;notes;measureNumber;durationLines;augmentationDots;augmentationDash;beatBegin;beatEnd;isTieStart;isTieEnd;constructor(t=0,e=0,i=[],s=1){this.start=t,this.length=e,this.notes=i,this.measureNumber=s}addNote(t){if(0===this.notes.length)return this.start=t.start,this.length=t.length,this.notes.push(t),!0;if(!n(this.start-t.start))return console.warn(`JianpuBlock: Attempted to add note at ${t.start} to block starting at ${this.start}. Ignoring.`),!1;let e=!1,i=!1;for(let s=0;s<this.notes.length;s++)if(this.notes[s].pitch===t.pitch){i=!0,t.length<this.notes[s].length&&(this.notes[s].tiedFrom&&(t.tiedFrom=this.notes[s].tiedFrom,t.tiedFrom&&(t.tiedFrom.tiedTo=t)),this.notes[s].tiedTo&&(t.tiedTo=this.notes[s].tiedTo,t.tiedTo&&(t.tiedTo.tiedFrom=t)),this.notes[s]=t,e=!0);break}i||this.notes.push(t);let s=1/0;for(const t of this.notes)s=Math.min(s,t.length);return this.length=s,!i||e}split(t,e){const i=this.start+this.length;if(t<=this.start||t>=i||n(i-t))return null;const s=i-t,a=t-this.start,h=new o(t,s,[],e.measureNumberAtQ(t)),l=[];for(const e of this.notes){const i=e.start+e.length;if(i>t+1e-6){const i=r(e,t);i?l.push(i):console.warn("Split failed for note, unexpected state.")}else n(i-t)}return l.forEach(t=>h.addNote(t)),this.length=a,delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash,this.beatEnd&&(h.beatEnd=!0,delete this.beatEnd),this.isTieEnd&&(h.isTieStart=!0,delete this.isTieEnd),h}splitToBeat(t){const e=t.timeSignatureAtQ(this.start);if(!e)return null;const i=t.measureLengthAtQ(this.start),s=t.measureNumberAtQ(this.start),r=this.start-(s-Math.floor(s))*i,o=this.start-r,a=4/e.denominator,h=o/a;this.beatBegin=n(h-Math.round(h));const l=r+(Math.floor(h+1e-6)+1)*a,u=r+i,c=this.start+this.length;let d=null;l<c-1e-6&&l>this.start+1e-6&&(d=l),u<c-1e-6&&u>this.start+1e-6&&(null===d||u<d)&&(d=u);let g=null;if(null!==d)g=this.split(d,t),g&&(this.beatEnd=!0);else{const t=(o+this.length)/a;this.beatEnd=n(t-Math.round(t)),this.beatEnd||(this.beatEnd=n(c-u))}return this.isTieStart=this.notes.some(t=>t.tiedFrom),this.isTieEnd=this.notes.some(t=>t.tiedTo),g&&(g.isTieStart=g.notes.some(t=>t.tiedFrom),g.isTieEnd=g.notes.some(t=>t.tiedTo),this.notes.some(t=>t.tiedTo&&t.start+t.length>d)&&delete this.isTieEnd),g}calculateRenderProperties(t){delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash;const e=this.length;if(n(e)||e<0)return;if(t.allowDottedRests||this.notes.length>0){if(n(e-1.5))return void(this.augmentationDots=1);if(n(e-.75))return this.durationLines=1,void(this.augmentationDots=1);if(n(e-.375))return this.durationLines=2,void(this.augmentationDots=1);n(e-3)&&(this.augmentationDots=1)}if(this.durationLines=e>=3.999999||e>=1.999999||e>=.999999?0:e>=.499999?1:e>=.249999?2:e>=.124999?3:4,this.augmentationDash=!1,1===this.notes.length){const e=this.notes[0],i=t.timeSignatureAtQ(this.start);if(!i)return;const s=Math.max(4/i.denominator,1);if(!(this.measureNumber%1<=1e-6)&&e.tiedFrom&&n(e.tiedFrom.length-s)&&e.tiedFrom.pitch===e.pitch&&e.length>=1){let i=!0;if(e.tiedTo){const s=e.start+e.length;i=Math.floor(t.measureNumberAtQ(this.start))===Math.floor(t.measureNumberAtQ(s))&&e.tiedTo.length>=1}i&&(this.augmentationDash=!0)}}}splitToStandardSymbol(t){const e=this.length;if(n(e)||e<s.MIN_RESOLUTION-1e-6)return null;const i=[];t.allowDottedRests||this.notes.length>0?(i.push(6),i.push(4),i.push(3),i.push(2),i.push(1.5),i.push(1),i.push(.75),i.push(.5),i.push(.375),i.push(.25),i.push(.125),i.push(.0625)):(i.push(4),i.push(2),i.push(1),i.push(.5),i.push(.25),i.push(.125),i.push(.0625));let r=0;for(const t of i)if(e>=t-1e-6){r=t;break}n(r)&&(r=s.MIN_RESOLUTION,e<r-1e-6&&e>1e-6&&console.warn(`Block length ${e} is too small, rendering as ${r}`));let o=null;return e>r+1e-6?(o=this.split(this.start+r,t),this.length!==r&&(console.warn(`Adjusting block length after split from ${this.length} to ${r}`),this.length=r)):this.length=r,o}mergeToMap(t){const e=t.get(this.start);e?(this.notes.forEach(t=>e.addNote(t)),0!==this.measureNumber&&(e.measureNumber=this.measureNumber)):t.set(this.start,this)}isMeasureBeginning(){return n(this.measureNumber-Math.floor(this.measureNumber))}}},830(t,e,i){i.d(e,{getMeasureLength:()=>s});function s(t){return t.numerator*(4/t.denominator)}i.d(e,["DEFAULT_KEY_SIGNATURE",0,{start:0,key:0},"DEFAULT_TEMPO",0,{start:0,qpm:60},"DEFAULT_TIME_SIGNATURE",0,{start:0,numerator:4,denominator:4}])},849(t,e,i){i.d(e,{JianpuModel:()=>a});var s=i(830),n=i(775),r=i(765),o=i(559);class a{jianpuInfo;measuresInfo;jianpuBlockMap;lastQ;constructor(t,e){this.jianpuInfo=t,this.jianpuBlockMap=new Map,this.lastQ=0,this.update(t,e)}isLastMeasureAtQ(t){return t>=this.lastQ-1e-6}getTotalDuration(){return this.lastQ}update(t,e){this.jianpuInfo=t,t.notes.sort((t,e)=>t.start-e.start),this.lastQ=0,t.notes.forEach(t=>{this.lastQ=Math.max(this.lastQ,t.start+t.length)}),this.lastQ+=1e-6,t.tempos=t.tempos&&t.tempos.length?t.tempos:[s.DEFAULT_TEMPO],t.tempos.sort((t,e)=>t.start-e.start),t.tempos[0].start>1e-6&&t.tempos.unshift({...s.DEFAULT_TEMPO,start:0});const i=void 0!==e?{start:0,key:e}:{...s.DEFAULT_KEY_SIGNATURE};t.keySignatures=t.keySignatures&&t.keySignatures.length?t.keySignatures:[i],t.keySignatures.sort((t,e)=>t.start-e.start),t.keySignatures[0].start>1e-6&&t.keySignatures.unshift({...i,start:0}),t.timeSignatures=t.timeSignatures&&t.timeSignatures.length?t.timeSignatures:[s.DEFAULT_TIME_SIGNATURE],t.timeSignatures.sort((t,e)=>t.start-e.start),t.timeSignatures[0].start>1e-6&&t.timeSignatures.unshift({...s.DEFAULT_TIME_SIGNATURE,start:0}),this.measuresInfo=new n.MeasuresInfo(t,this.lastQ),this.infoToBlocks()}infoToBlocks(){const t=new Map;let e=0;if(this.jianpuInfo.notes.forEach(i=>{const s=i.start,n=this.measuresInfo.measureNumberAtQ(s);if(s>e+1e-6){const i=e,n=s-i,o=this.measuresInfo.measureNumberAtQ(i),a=new r.JianpuBlock(i,n,[],o);t.set(i,a)}const o=this.measuresInfo.keySignatureAtQ(s),a=this.createJianpuNote(i,o);let h=t.get(s);h||(h=new r.JianpuBlock(s,0,[],n),t.set(s,h)),h.addNote(a),e=Math.max(e,s+h.length)}),this.lastQ>e+1e-6){const i=e,s=this.lastQ-1e-6-i;if(s>1e-6){const e=this.measuresInfo.measureNumberAtQ(i),n=new r.JianpuBlock(i,s,[],e);t.set(i,n)}}this.jianpuBlockMap=new Map;const i=Array.from(t.keys()).sort((t,e)=>t-e);let s=[];i.forEach(e=>{s.push(t.get(e))});const n=new Set;for(;s.length>0;){let t=s.shift();n.has(t.start)&&this.jianpuBlockMap.has(t.start);let e=t.splitToBeat(this.measuresInfo);if(e){t.mergeToMap(this.jianpuBlockMap),n.add(t.start),s.unshift(e);continue}let i=t,r=null;do{r=i.splitToStandardSymbol(this.measuresInfo),i.mergeToMap(this.jianpuBlockMap),n.add(i.start),r&&(i=r)}while(r)}this.jianpuBlockMap.forEach(t=>{t.calculateRenderProperties(this.measuresInfo)})}createJianpuNote(t,e){const i=function(t,e){const i=e%12;let s=o.MIDDLE_C_MIDI+i;i>o.MIDDLE_C_MIDI%12&&(s-=12);const n=Math.round((t-s)/12),r=(t-(s+12*n)+12)%12;let a=o.MAJOR_SCALE_INTERVALS[r],h=0;if(void 0===a){switch(r){case 1:a=o.MAJOR_SCALE_INTERVALS[0],h=1;break;case 3:a=o.MAJOR_SCALE_INTERVALS[4],h=2;break;case 6:a=o.MAJOR_SCALE_INTERVALS[5],h=1;break;case 8:a=o.MAJOR_SCALE_INTERVALS[9],h=2;break;case 10:a=o.MAJOR_SCALE_INTERVALS[11],h=2;break;default:{console.warn(`Unexpected chromatic interval ${r} in mapMidiToJianpu. Defaulting to sharp of lower valid degree.`);const i=(r-1+12)%12,s=(r+1+12)%12,n=o.MAJOR_SCALE_INTERVALS[i],l=o.MAJOR_SCALE_INTERVALS[s];void 0!==n?(a=n,h=1):void 0!==l?(a=l,h=2):(a=1,h=1,console.error(`Could not determine Jianpu number components for MIDI ${t}, interval ${r} from tonic in key ${e}.`));break}}void 0===a&&(console.error(`Jianpu number became undefined for MIDI ${t} (interval ${r}, key ${e}) after chromatic processing. This indicates a logic error or misconfigured MAJOR_SCALE_INTERVALS.`),a=1,h=1)}const l=Math.floor((t-s)/12);return{jianpuNumber:a,octaveDot:l,accidental:h}}(t.pitch,e);return{...t,jianpuNumber:i.jianpuNumber,octaveDot:i.octaveDot,accidental:i.accidental}}}},775(t,e,i){i.d(e,{MeasuresInfo:()=>r});var s=i(830),n=i(559);class r{measuresInfo;allowDottedRests=!0;constructor(t,e){if(this.measuresInfo=[],!(e>0))return;const i=r.getSortedChanges(t.tempos,s.DEFAULT_TEMPO),n=r.getSortedChanges(t.keySignatures,s.DEFAULT_KEY_SIGNATURE),o=r.getSortedChanges(t.timeSignatures,s.DEFAULT_TIME_SIGNATURE);let a=0,h=0,l=0,u=i[0].event,c=n[0].event,d=o[0].event,g=1,m=(0,s.getMeasureLength)(d),f=d.start;const S=[0];i.forEach(t=>S.push(t.start)),n.forEach(t=>S.push(t.start)),o.forEach(t=>S.push(t.start)),S.sort((t,e)=>t-e);let p=-1;for(let t=0;t<S.length;t++){const r=S[t];if(r>=e)break;if(r===p)continue;p=r;let T=!1,A=!1,E=!1;for(;a<i.length&&i[a].start<=r;)u=i[a++].event,T=!0;for(;h<n.length&&n[h].start<=r;)c=n[h++].event,A=!0;for(;l<o.length&&o[l].start<=r;){g+=(o[l].event.start-f)/m,g=Math.round(1e3*g)/1e3,d=o[l++].event,m=(0,s.getMeasureLength)(d),f=r,E=!0}const I={start:r,measureNumber:g+(r-f)/m,measureLength:m,tempo:u,keySignature:c,timeSignature:d};T&&(I.tempoChange=!0),A&&(I.keyChange=!0),E&&(I.timeChange=!0),this.measuresInfo.push(I)}}static getSortedChanges(t,e){const i=t&&t.length?t.slice():[e];return i.sort((t,e)=>t.start-e.start),i.map(t=>({start:Math.max(0,Math.round(t.start/n.MIN_RESOLUTION)*n.MIN_RESOLUTION),event:t}))}findIndex(t){let e=0,i=this.measuresInfo.length-1,s=0;for(;e<=i;){const n=Math.floor((e+i)/2);this.measuresInfo[n].start<=t?(s=n,e=n+1):i=n-1}return s}measureNumberAtQ(t){if(0===this.measuresInfo.length)return 1;const e=this.findIndex(t),i=this.measuresInfo[e],s=(t-i.start)/i.measureLength;return i.measureNumber+s+1e-9}measureLengthAtQ(t){if(0===this.measuresInfo.length)return(0,s.getMeasureLength)(s.DEFAULT_TIME_SIGNATURE);const e=this.findIndex(t);return this.measuresInfo[e].measureLength}tempoAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TEMPO.qpm;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.tempoChange&&o?r.tempo.qpm:-1}keySignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_KEY_SIGNATURE.key;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.keyChange&&o?r.keySignature.key:-1}timeSignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TIME_SIGNATURE;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.timeChange&&o?r.timeSignature:null}quartersToTime(t,e){const i=this.tempoAtQ(e);return i<=0?0:t/i*60}timeToQuarters(t,e){const i=this.tempoAtQ(e);if(i<=0)return 0;const s=t*i/60;return Math.round(s*n.MAX_QUARTER_DIVISION)/n.MAX_QUARTER_DIVISION}isBeatStart(t){if(0===this.measuresInfo.length)return!1;const e=this.findIndex(t),i=this.measuresInfo[e],s=i.timeSignature,r=(t-(i.start-(i.measureNumber-Math.floor(i.measureNumber))*i.measureLength))/(4/s.denominator);return Math.abs(r-Math.round(r))<n.MIN_RESOLUTION/2}}},559(t,e,i){i.d(e,["MAJOR_SCALE_INTERVALS",0,{0:1,2:2,4:3,5:4,7:5,9:6,11:7},"MAX_QUARTER_DIVISION",0,240,"MIDDLE_C_MIDI",0,60,"MIN_RESOLUTION",0,.0625,"PITCH_CLASS_NAMES",0,["C","C#","D","D#","E","F","F#","G","G#","A","A#","B"]])},240(t,e,i){const s=new Map([[1,1.78],[2,1.6],[3,1.3],[4,1.15]]);i.d(e,["AUGMENTATION_DASH_FACTOR",0,.8,"COMPACT_SPACING_FACTOR",0,1.5,"DOT_SIZE_FACTOR",0,.1,"DURATION_LINE_SCALES",0,s,"FONT_SIZE_MULTIPLIER",0,1.2,"LINE_STROKE_WIDTH",0,1,"OCTAVE_DOT_OFFSET_FACTOR",0,1,"SMALL_FONT_SIZE_MULTIPLIER",0,.75,"UNDERLINE_SPACING_FACTOR",0,.2])},961(t,e,i){i.d(e,["ACCIDENTAL_TEXT",0,["","#","b"],"PATH_SCALE",0,100,"augmentationDashPath",0,"m 0,0 h 50","barPath",0,"m 0,-50 v 100","dotPath",0,"M 0 0 a 15 15 0 1 0 0.0001 0 z","tiePath",0,"M -13,5 C 15,-15 65,-15 90,5 C 65,-25 15,-25 -13,5 Z","underlinePath",0,"m 0,0 h 100"])},134(t,e,i){i.d(e,{createSVGGroupChild:()=>o,drawSVGPath:()=>n,drawSVGText:()=>r,highlightElement:()=>l,resetElementHighlight:()=>u,setBlinkAnimation:()=>a,setStroke:()=>h});const s="http://www.w3.org/2000/svg";function n(t,e,i,n,r,o,a=1){const h=document.createElementNS(s,"path");return h.setAttributeNS(null,"d",e),h.setAttributeNS(null,"transform",`translate(${i}, ${n}) scale(${r}, ${o})`),a<1&&h.setAttributeNS(null,"opacity",`${a}`),t.appendChild(h),h}function r(t,e,i,n,r,o="normal",a="middle",h="middle",l="currentColor",u=1){const c=document.createElementNS(s,"text");c.setAttributeNS(null,"font-family","sans-serif"),c.setAttributeNS(null,"font-size",r),c.setAttributeNS(null,"font-weight",o),c.setAttributeNS(null,"x",`${i}`),c.setAttributeNS(null,"y",`${n}`),c.setAttributeNS(null,"text-anchor",a),c.setAttributeNS(null,"dominant-baseline",h),"currentColor"!==l&&c.setAttributeNS(null,"fill",l),u<1&&c.setAttributeNS(null,"opacity",`${u}`);const d=document.createTextNode(e);return c.appendChild(d),t.appendChild(c),c}function o(t,e){const i=document.createElementNS(s,"g");return e&&i.setAttribute("data-id",e),t.appendChild(i),i}function a(t,e=!0,i="1s"){let n=t.querySelector('animate[attributeName="opacity"]');return e?n?(n.setAttributeNS(null,"repeatCount","indefinite"),n.beginElement()):(n=document.createElementNS(s,"animate"),n.setAttributeNS(null,"attributeName","opacity"),n.setAttributeNS(null,"values","1;0.2;1"),n.setAttributeNS(null,"keyTimes","0;0.5;1"),n.setAttributeNS(null,"dur",i),n.setAttributeNS(null,"repeatCount","indefinite"),t.appendChild(n)):(n&&(n.endElement(),n.setAttributeNS(null,"repeatCount","0"),t.style.opacity="1"),t.style.opacity="1"),t}function h(t,e,i){t.setAttributeNS(null,"stroke",e),t.setAttributeNS(null,"stroke-width",`${i}`)}function l(t,e){const i=[];return t.matches("text, path")&&i.push(t),t.querySelectorAll("text, path").forEach(t=>{i.push(t)}),i.forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e)}),t}function u(t,e){t.querySelectorAll("text, path").forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e)})}i.d(e,["SVGNS",0,s])}};const e={};function i(s){const n=e[s];if(void 0!==n)return n.exports;const r=e[s]={exports:{}};return t[s](r,r.exports,i),r.exports}i.d=(t,e)=>{if(Array.isArray(e))for(var s=0;s<e.length;){var n=e[s++],r=e[s++],o=0===r?{enumerable:!0,value:e[s++]}:{enumerable:!0,get:r};i.o(t,n)||Object.defineProperty(t,n,o)}else for(var n in e)i.o(e,n)&&!i.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},i.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),i.r=t=>{Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};let s={};i.r(s),i.d(s,{JianpuSVGRender:()=>c,ScrollType:()=>n});var n,r=i(240),o=i(134),a=i(961),h=i(830),l=i(849),u=i(559);!function(t){t[t.PAGE=0]="PAGE",t[t.NOTE=1]="NOTE",t[t.BAR=2]="BAR"}(n||(n={}));class c{jianpuInfo;jianpuModel;config;height;width;parentElement;div;mainSVG;mainG;musicG;signaturesG;overlaySVG;overlayG;signaturesBlinking;lastKnownScrollLeft;isScrolling;currentKey;currentTimeSignature;playingNotes;lastRenderedQ;estimatedNoteWidth;numberFontSize;smallFontSize;yBaseline;parseColorString(t){return/^[a-z]+$/i.test(t)||t.startsWith("rgb(")?t:/^\d+,\s*\d+,\s*\d+$/.test(t)?`rgb(${t})`:t}constructor(t,e,i){this.jianpuInfo=t,this.div=i;this.config={noteHeight:e.noteHeight??20,noteSpacingFactor:e.noteSpacingFactor??r.COMPACT_SPACING_FACTOR,pixelsPerTimeStep:e.pixelsPerTimeStep??0,noteColor:this.parseColorString(e.noteColor??"black"),activeNoteColor:this.parseColorString(e.activeNoteColor??"red"),defaultKey:e.defaultKey??0,scrollType:e.scrollType??n.PAGE,fontFamily:e.fontFamily??"sans-serif",width:e.width??0,height:e.height??0},this.jianpuModel=new l.JianpuModel(this.jianpuInfo,this.config.defaultKey),this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??h.DEFAULT_TIME_SIGNATURE,this.playingNotes=new Map,this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.numberFontSize=this.config.noteHeight*r.FONT_SIZE_MULTIPLIER,this.smallFontSize=this.config.noteHeight*r.SMALL_FONT_SIZE_MULTIPLIER,this.estimatedNoteWidth=.6*this.numberFontSize,this.yBaseline=1.5*this.config.noteHeight,this.height=0,this.width=0,this.clear(),this.redraw()}clear(){for(;this.div.lastChild;)this.div.removeChild(this.div.lastChild);this.div.style.position="relative",this.div.style.overflow="hidden",this.overlaySVG=document.createElementNS(o.SVGNS,"svg"),this.overlaySVG.style.position="absolute",this.overlaySVG.style.left="0",this.overlaySVG.style.top="0",this.overlaySVG.style.pointerEvents="none",this.div.appendChild(this.overlaySVG),this.overlayG=(0,o.createSVGGroupChild)(this.overlaySVG,"overlay"),this.parentElement=document.createElement("div"),this.parentElement.style.overflowX="auto",this.parentElement.style.overflowY="hidden",this.parentElement.style.width="100%",this.parentElement.style.height="100%",this.div.appendChild(this.parentElement),this.parentElement.addEventListener("scroll",this.handleScrollEvent),this.mainSVG=document.createElementNS(o.SVGNS,"svg"),this.mainSVG.style.display="block",this.parentElement.appendChild(this.mainSVG),this.mainG=(0,o.createSVGGroupChild)(this.mainSVG,"main-content"),this.signaturesG=(0,o.createSVGGroupChild)(this.mainG,"signatures"),this.musicG=(0,o.createSVGGroupChild)(this.mainG,"music"),this.playingNotes.clear(),this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.height=this.config.height>0?this.config.height:5*this.config.noteHeight,this.width=this.config.width>0?this.config.width:0,this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??h.DEFAULT_TIME_SIGNATURE,this.drawSignatures(this.overlayG,0,!0,!0),this.updateLayout()}updateLayout(t){this.width=t??this.width,this.config.width>0&&(this.width=this.config.width),this.height=Math.max(this.height,6*this.config.noteHeight),this.config.height>0&&(this.height=this.config.height);const e=1.65*this.config.noteHeight;this.mainSVG.setAttribute("width",`${this.width}`),this.mainSVG.setAttribute("height",`${this.height}`),this.mainG.setAttribute("transform",`translate(0, ${this.yBaseline+e})`),this.overlaySVG.setAttribute("width","200"),this.overlaySVG.setAttribute("height",`${this.height}`),this.overlayG.setAttribute("transform",`translate(0, ${this.yBaseline})`)}redraw(t,e){let i=-1;const s=this.config.pixelsPerTimeStep<=0;if(t){const r=`${t.start}-${t.pitch}`;if(this.playingNotes.forEach((t,e)=>{if(e!==r){const t=this.mainSVG.querySelector(`g[data-id="${e}"]`);t&&(0,o.resetElementHighlight)(t,this.config.noteColor),this.playingNotes.delete(e)}}),!this.playingNotes.has(r)){const s=this.mainSVG.querySelector(`g[data-id="${r}"]`);if(s){(0,o.highlightElement)(s,this.config.activeNoteColor),this.playingNotes.set(r,t);const a=s.getBoundingClientRect(),h=this.mainSVG.getBoundingClientRect();i=a.left-h.left+this.parentElement.scrollLeft;const l=s.hasAttribute("data-is-measure-start");e&&(this.config.scrollType!==n.BAR||l)&&this.scrollIntoViewIfNeeded(i)}}if(!s&&this.signaturesBlinking){const e=this.overlayG.getBoundingClientRect().width;this.jianpuModel.measuresInfo.quartersToTime(t.start,t.start)*this.config.pixelsPerTimeStep>e&&(this.signaturesBlinking=!1,(0,o.setBlinkAnimation)(this.overlayG,!1))}}else{this.jianpuModel.update(this.jianpuInfo,this.config.defaultKey);let t=this.width,e=this.width,i=this.height>0?this.height-this.yBaseline:3*this.config.noteHeight,n=0;const r=new Map;this.jianpuModel.jianpuBlockMap.forEach((o,a)=>{if(a>=this.lastRenderedQ-1e-9){t=s?e:this.jianpuModel.measuresInfo.quartersToTime(a,a)*this.config.pixelsPerTimeStep;const h=this.drawJianpuBlock(o,t,r);s?e+=h:e=Math.max(e,t+h);const l=this.mainSVG.querySelector(`g[data-block-start="${o.start}"]`);if(l)try{const t=l.getBBox(),e=t.y,s=t.y+t.height;n=Math.min(n,e),i=Math.max(i,s)}catch(t){}this.lastRenderedQ=a+o.length}}),this.height=Math.max(this.height,i-n+this.config.noteHeight),this.updateLayout(e)}return i}drawJianpuBlock(t,e,i){let s=0;const n=this.config.pixelsPerTimeStep<=0,h=t.isMeasureBeginning(),l=(0,o.createSVGGroupChild)(this.musicG,`block-${t.start}`);if(l.setAttribute("data-block-start",`${t.start}`),h&&t.start>1e-6){const t=e-(n?.6*this.estimatedNoteWidth:4),i=2*this.config.noteHeight,h=0,l=(0,o.drawSVGPath)(this.musicG,a.barPath,t,h,1,i/a.PATH_SCALE);(0,o.setStroke)(l,this.config.noteColor,r.LINE_STROKE_WIDTH),n&&(s+=r.LINE_STROKE_WIDTH)}const u=this.updateCurrentKey(t.start),c=this.updateCurrentTimeSignature(t.start);let d=0;if((u||c)&&t.start>1e-6){const t=e+s;d=this.drawSignatures(this.signaturesG,t,u,c),n&&(s+=d+.2*this.estimatedNoteWidth)}const g=e+s;let m=0;if(t.notes.length>0?m=this.drawNotes(t,g,i,l):t.length>1e-6&&(m=this.drawRest(t,g,l)),n){s+=m;let e=this.estimatedNoteWidth*this.config.noteSpacingFactor;t.beatEnd?e*=1:t.length<.0625?e*=.05:t.length<.125?e*=.1:t.length<.25?e*=.2:t.length<.5?e*=.4:t.length<1&&(e*=.5),s+=e}else s=Math.max(d,m);if(this.jianpuModel.isLastMeasureAtQ(t.start+t.length)){const t=e+s,i=2*this.config.noteHeight,h=0,l=(0,o.drawSVGPath)(this.musicG,a.barPath,t,h,1,i/a.PATH_SCALE);(0,o.setStroke)(l,this.config.noteColor,r.LINE_STROKE_WIDTH),n&&(s+=r.LINE_STROKE_WIDTH)}return s}drawNotes(t,e,i,s){let n=e,h=e;const l=.1*this.estimatedNoteWidth,u=`${this.numberFontSize}px`,c=`${this.smallFontSize}px`,{durationLines:d=0,augmentationDots:g=0,augmentationDash:m=!1}=t;return t.notes.forEach(e=>{const f=`${e.start}-${e.pitch}`,S=(0,o.createSVGGroupChild)(s,f);t.isMeasureBeginning()&&S.setAttribute("data-is-measure-start","true");let p=n,T=p;if(0!==e.accidental){const t=a.ACCIDENTAL_TEXT[e.accidental];(0,o.drawSVGText)(S,t,p+l,0,c,"normal","end","text-top",this.config.noteColor)}let A=0;if(m){const t=this.config.noteHeight*r.AUGMENTATION_DASH_FACTOR,e=t/50,i=(0,o.drawSVGPath)(S,a.augmentationDashPath,p,0,e,1);(0,o.setStroke)(i,this.config.noteColor,r.LINE_STROKE_WIDTH),A=t,T=p+A}else{const t=`${e.jianpuNumber}`;A=(0,o.drawSVGText)(S,t,p,0,u,"normal","start","middle",this.config.noteColor).getBBox().width,T=p+A}if(0!==e.octaveDot&&!1===m){const t=this.config.noteHeight*r.DOT_SIZE_FACTOR,i=t/(.15*a.PATH_SCALE),s=p+A/2,n=2.8*t,h=this.config.noteHeight*r.OCTAVE_DOT_OFFSET_FACTOR;for(let t=0;t<Math.abs(e.octaveDot);t++){const r=(e.octaveDot>0?-h:.6*h)-t*n*(e.octaveDot>0?1:-1);(0,o.drawSVGPath)(S,a.dotPath,s,r,i,i)}}if(d>0){const t=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR,i=A/a.PATH_SCALE*(r.DURATION_LINE_SCALES.get(d)??1);for(let s=0;s<d;s++){const n=t+s*e,h=(0,o.drawSVGPath)(S,a.underlinePath,p,n,i,1);(0,o.setStroke)(h,this.config.noteColor,r.LINE_STROKE_WIDTH)}}let E=T+l;if(g>0){const t=this.config.noteHeight*r.DOT_SIZE_FACTOR,e=t/(.15*a.PATH_SCALE);for(let i=0;i<g;i++)(0,o.drawSVGPath)(S,a.dotPath,E,0,e,e),E+=t+l;T=E+l}const I=T;if(e.tiedTo&&!m)i.set(e,{g:S,xNoteRight:I,yNoteBaseline:0});else if(e.tiedFrom){let t=e.tiedFrom;for(;t.tiedFrom;)t=t.tiedFrom;const s=i.get(t);if(s){const n=1*s.xNoteRight,r=(m?p-2.2*this.estimatedNoteWidth:p-l)-n,h=1.2*-this.config.noteHeight,u=r/a.PATH_SCALE*1.3,c=this.config.noteHeight/a.PATH_SCALE*1.6;r>1&&(0,o.drawSVGPath)(s.g,a.tiePath,n-(s.g.getCTM()?.e??0),h,u,c);let d=t;for(;d&&d!==e;){i.delete(d);const t=d.tiedTo;t&&(d=t)}}else console.warn("Missing linked SVG details for first tied note:",t)}h=Math.max(h,T)}),h-e}drawRest(t,e,i){const s=`${this.numberFontSize}px`,n=.1*this.estimatedNoteWidth,{durationLines:h=0,augmentationDots:l=0}=t;let u=e,c=u;const d=(0,o.drawSVGText)(i,"0",u,0,s,"normal","start","middle",this.config.noteColor).getBBox().width;if(c=u+d,h>0){const t=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR,s=d/a.PATH_SCALE*(r.DURATION_LINE_SCALES.get(h)??1);for(let n=0;n<h;n++){const h=t+n*e,l=(0,o.drawSVGPath)(i,a.underlinePath,u,h,s,1);(0,o.setStroke)(l,this.config.noteColor,r.LINE_STROKE_WIDTH)}}let g=c+n;if(l>0){const t=this.config.noteHeight*r.DOT_SIZE_FACTOR,e=t/(.15*a.PATH_SCALE);for(let s=0;s<l;s++)(0,o.drawSVGPath)(i,a.dotPath,g,0,e,e),g+=t+n;c=g+n}return c-e}drawSignatures(t,e,i,s){let n=e;const r=.3*this.estimatedNoteWidth,a=`${this.smallFontSize}px`,h=`${this.numberFontSize}px`;if(i){const e=`1=${u.PITCH_CLASS_NAMES[this.currentKey%12]??"C"}`;n+=(0,o.drawSVGText)(t,e,n,0,h,"normal","start","middle",this.config.noteColor).getBBox().width+2*r}if(s){const e=`${this.currentTimeSignature.numerator}/${this.currentTimeSignature.denominator}`;n+=(0,o.drawSVGText)(t,e,n,0,a,"normal","start","middle",this.config.noteColor).getBBox().width+r}const l=n-e;try{const e=t.getBBox(),i=e.y,s=e.y+e.height,n=Math.max(this.yBaseline+s,this.yBaseline-i)+.5*this.config.noteHeight;this.height=Math.max(this.height,n)}catch(t){}return t===this.overlayG&&this.config.pixelsPerTimeStep>0&&(this.signaturesBlinking=!0,(0,o.setBlinkAnimation)(this.overlayG,!0)),l}updateCurrentKey(t){const e=this.jianpuModel.measuresInfo.keySignatureAtQ(t,!0);return-1!==e&&e!==this.currentKey&&(this.currentKey=e,!0)}updateCurrentTimeSignature(t){const e=this.jianpuModel.measuresInfo.timeSignatureAtQ(t,!0);return!(!e||e.numerator===this.currentTimeSignature.numerator&&e.denominator===this.currentTimeSignature.denominator)&&(this.currentTimeSignature=e,!0)}handleScrollEvent=t=>{this.lastKnownScrollLeft=this.parentElement.scrollLeft,this.isScrolling||window.requestAnimationFrame(()=>{this.updateOverlaySignaturesForScroll(this.lastKnownScrollLeft),this.isScrolling=!1}),this.isScrolling=!0};scrollIntoViewIfNeeded(t){const e=this.parentElement.getBoundingClientRect().width,i=this.parentElement.scrollLeft;let s=i;if(this.config.scrollType===n.PAGE){const n=20;t<i+n?s=t-n:t>i+e-n&&(s=t-e+n)}else{s=t-.5*e}s=Math.max(0,Math.min(s,this.parentElement.scrollWidth-e)),Math.abs(s-i)>1&&(this.parentElement.scrollTo({left:s,behavior:"smooth"}),this.updateOverlaySignaturesForScroll(s))}updateOverlaySignaturesForScroll(t){const e=this.pixelsToTime(t),i=this.jianpuModel.measuresInfo.keySignatureAtQ(e),s=this.jianpuModel.measuresInfo.timeSignatureAtQ(e)??this.currentTimeSignature;let n=!1;if(i!==this.currentKey&&(this.currentKey=i,n=!0),s.numerator===this.currentTimeSignature.numerator&&s.denominator===this.currentTimeSignature.denominator||(this.currentTimeSignature=s,n=!0),n){for(;this.overlayG.lastChild;)this.overlayG.removeChild(this.overlayG.lastChild);this.drawSignatures(this.overlayG,0,!0,!0),t<10&&this.config.pixelsPerTimeStep>0?((0,o.setBlinkAnimation)(this.overlayG,!0),this.signaturesBlinking=!0):this.config.pixelsPerTimeStep>0&&((0,o.setBlinkAnimation)(this.overlayG,!1),this.signaturesBlinking=!1)}}pixelsToTime(t){return this.config.pixelsPerTimeStep<=0?0:this.jianpuModel.measuresInfo.timeToQuarters(t/this.config.pixelsPerTimeStep,0)}}return s})());
|
|
1
|
+
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.mm=e():t.mm=e()}(global,()=>(()=>{"use strict";var t={765(t,e,i){i.d(e,{JianpuBlock:()=>o});var s=i(559);function n(t){return Math.abs(t)<1e-6}function r(t,e){const i=t.start+t.length;if(e<=t.start||e>=i||n(i-e))return null;const s=i-e;t.length=e-t.start;const r={start:e,length:s,pitch:t.pitch,intensity:t.intensity,jianpuNumber:t.jianpuNumber,octaveDot:t.octaveDot,accidental:0,tiedFrom:t};return t.tiedTo&&(r.tiedTo=t.tiedTo,t.tiedTo.tiedFrom=r),t.tiedTo=r,r}class o{start;length;notes;measureNumber;durationLines;augmentationDots;augmentationDash;beatBegin;beatEnd;isTieStart;isTieEnd;constructor(t=0,e=0,i=[],s=1){this.start=t,this.length=e,this.notes=i,this.measureNumber=s}addNote(t){if(0===this.notes.length)return this.start=t.start,this.length=t.length,this.notes.push(t),!0;if(!n(this.start-t.start))return console.warn(`JianpuBlock: Attempted to add note at ${t.start} to block starting at ${this.start}. Ignoring.`),!1;let e=!1,i=!1;for(let s=0;s<this.notes.length;s++)if(this.notes[s].pitch===t.pitch){i=!0,t.length<this.notes[s].length&&(this.notes[s].tiedFrom&&(t.tiedFrom=this.notes[s].tiedFrom,t.tiedFrom&&(t.tiedFrom.tiedTo=t)),this.notes[s].tiedTo&&(t.tiedTo=this.notes[s].tiedTo,t.tiedTo&&(t.tiedTo.tiedFrom=t)),this.notes[s]=t,e=!0);break}i||this.notes.push(t);let s=1/0;for(const t of this.notes)s=Math.min(s,t.length);return this.length=s,!i||e}split(t,e){const i=this.start+this.length;if(t<=this.start||t>=i||n(i-t))return null;const s=i-t,a=t-this.start,h=new o(t,s,[],e.measureNumberAtQ(t)),l=[];for(const e of this.notes){const i=e.start+e.length;if(i>t+1e-6){const i=r(e,t);i?l.push(i):console.warn("Split failed for note, unexpected state.")}else n(i-t)}return l.forEach(t=>h.addNote(t)),this.length=a,delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash,this.beatEnd&&(h.beatEnd=!0,delete this.beatEnd),this.isTieEnd&&(h.isTieStart=!0,delete this.isTieEnd),h}splitToBeat(t){const e=t.timeSignatureAtQ(this.start);if(!e)return null;const i=t.measureLengthAtQ(this.start),s=t.measureNumberAtQ(this.start),r=this.start-(s-Math.floor(s))*i,o=this.start-r,a=4/e.denominator,h=o/a;this.beatBegin=n(h-Math.round(h));const l=r+(Math.floor(h+1e-6)+1)*a,u=r+i,c=this.start+this.length;let d=null;l<c-1e-6&&l>this.start+1e-6&&(d=l),u<c-1e-6&&u>this.start+1e-6&&(null===d||u<d)&&(d=u);let g=null;if(null!==d)g=this.split(d,t),g&&(this.beatEnd=!0);else{const t=(o+this.length)/a;this.beatEnd=n(t-Math.round(t)),this.beatEnd||(this.beatEnd=n(c-u))}return this.isTieStart=this.notes.some(t=>t.tiedFrom),this.isTieEnd=this.notes.some(t=>t.tiedTo),g&&(g.isTieStart=g.notes.some(t=>t.tiedFrom),g.isTieEnd=g.notes.some(t=>t.tiedTo),this.notes.some(t=>t.tiedTo&&t.start+t.length>d)&&delete this.isTieEnd),g}calculateRenderProperties(t){delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash;const e=this.length;if(n(e)||e<0)return;if(t.allowDottedRests||this.notes.length>0){if(n(e-1.5))return void(this.augmentationDots=1);if(n(e-.75))return this.durationLines=1,void(this.augmentationDots=1);if(n(e-.375))return this.durationLines=2,void(this.augmentationDots=1);n(e-3)&&(this.augmentationDots=1)}if(this.durationLines=e>=3.999999||e>=1.999999||e>=.999999?0:e>=.499999?1:e>=.249999?2:e>=.124999?3:4,this.augmentationDash=!1,1===this.notes.length){const e=this.notes[0],i=t.timeSignatureAtQ(this.start);if(!i)return;const s=Math.max(4/i.denominator,1);if(!(this.measureNumber%1<=1e-6)&&e.tiedFrom&&n(e.tiedFrom.length-s)&&e.tiedFrom.pitch===e.pitch&&e.length>=1){let i=!0;if(e.tiedTo){const s=e.start+e.length;i=Math.floor(t.measureNumberAtQ(this.start))===Math.floor(t.measureNumberAtQ(s))&&e.tiedTo.length>=1}i&&(this.augmentationDash=!0)}}}splitToStandardSymbol(t){const e=this.length;if(n(e)||e<s.MIN_RESOLUTION-1e-6)return null;const i=[];t.allowDottedRests||this.notes.length>0?(i.push(6),i.push(4),i.push(3),i.push(2),i.push(1.5),i.push(1),i.push(.75),i.push(.5),i.push(.375),i.push(.25),i.push(.125),i.push(.0625)):(i.push(4),i.push(2),i.push(1),i.push(.5),i.push(.25),i.push(.125),i.push(.0625));let r=0;for(const t of i)if(e>=t-1e-6){r=t;break}n(r)&&(r=s.MIN_RESOLUTION,e<r-1e-6&&e>1e-6&&console.warn(`Block length ${e} is too small, rendering as ${r}`));let o=null;return e>r+1e-6?(o=this.split(this.start+r,t),this.length!==r&&(console.warn(`Adjusting block length after split from ${this.length} to ${r}`),this.length=r)):this.length=r,o}mergeToMap(t){const e=t.get(this.start);e?(this.notes.forEach(t=>e.addNote(t)),0!==this.measureNumber&&(e.measureNumber=this.measureNumber)):t.set(this.start,this)}isMeasureBeginning(){return n(this.measureNumber-Math.floor(this.measureNumber))}}},830(t,e,i){i.d(e,{getMeasureLength:()=>s});function s(t){return t.numerator*(4/t.denominator)}i.d(e,["DEFAULT_KEY_SIGNATURE",0,{start:0,key:0},"DEFAULT_TEMPO",0,{start:0,qpm:60},"DEFAULT_TIME_SIGNATURE",0,{start:0,numerator:4,denominator:4}])},849(t,e,i){i.d(e,{JianpuModel:()=>a});var s=i(830),n=i(775),r=i(765),o=i(559);class a{jianpuInfo;measuresInfo;jianpuBlockMap;lastQ;constructor(t,e){this.jianpuInfo=t,this.jianpuBlockMap=new Map,this.lastQ=0,this.update(t,e)}isLastMeasureAtQ(t){return t>=this.lastQ-1e-6}getTotalDuration(){return this.lastQ}update(t,e){this.jianpuInfo=t,t.notes.sort((t,e)=>t.start-e.start),this.lastQ=0,t.notes.forEach(t=>{this.lastQ=Math.max(this.lastQ,t.start+t.length)}),this.lastQ+=1e-6,t.tempos=t.tempos&&t.tempos.length?t.tempos:[s.DEFAULT_TEMPO],t.tempos.sort((t,e)=>t.start-e.start),t.tempos[0].start>1e-6&&t.tempos.unshift({...s.DEFAULT_TEMPO,start:0});const i=void 0!==e?{start:0,key:e}:{...s.DEFAULT_KEY_SIGNATURE};t.keySignatures=t.keySignatures&&t.keySignatures.length?t.keySignatures:[i],t.keySignatures.sort((t,e)=>t.start-e.start),t.keySignatures[0].start>1e-6&&t.keySignatures.unshift({...i,start:0}),t.timeSignatures=t.timeSignatures&&t.timeSignatures.length?t.timeSignatures:[s.DEFAULT_TIME_SIGNATURE],t.timeSignatures.sort((t,e)=>t.start-e.start),t.timeSignatures[0].start>1e-6&&t.timeSignatures.unshift({...s.DEFAULT_TIME_SIGNATURE,start:0}),this.measuresInfo=new n.MeasuresInfo(t,this.lastQ),this.infoToBlocks()}infoToBlocks(){const t=new Map;let e=0;if(this.jianpuInfo.notes.forEach(i=>{const s=i.start,n=this.measuresInfo.measureNumberAtQ(s);if(s>e+1e-6){const i=e,n=s-i,o=this.measuresInfo.measureNumberAtQ(i),a=new r.JianpuBlock(i,n,[],o);t.set(i,a)}const o=this.measuresInfo.keySignatureAtQ(s),a=this.createJianpuNote(i,o);let h=t.get(s);h||(h=new r.JianpuBlock(s,0,[],n),t.set(s,h)),h.addNote(a),e=Math.max(e,s+h.length)}),this.lastQ>e+1e-6){const i=e,s=this.lastQ-1e-6-i;if(s>1e-6){const e=this.measuresInfo.measureNumberAtQ(i),n=new r.JianpuBlock(i,s,[],e);t.set(i,n)}}this.jianpuBlockMap=new Map;const i=Array.from(t.keys()).sort((t,e)=>t-e);let s=[];i.forEach(e=>{s.push(t.get(e))});const n=new Set;for(;s.length>0;){let t=s.shift();n.has(t.start)&&this.jianpuBlockMap.has(t.start);let e=t.splitToBeat(this.measuresInfo);if(e){t.mergeToMap(this.jianpuBlockMap),n.add(t.start),s.unshift(e);continue}let i=t,r=null;do{r=i.splitToStandardSymbol(this.measuresInfo),i.mergeToMap(this.jianpuBlockMap),n.add(i.start),r&&(i=r)}while(r)}this.jianpuBlockMap.forEach(t=>{t.calculateRenderProperties(this.measuresInfo)})}createJianpuNote(t,e){const i=function(t,e){const i=e%12;let s=o.MIDDLE_C_MIDI+i;i>o.MIDDLE_C_MIDI%12&&(s-=12);const n=Math.round((t-s)/12),r=(t-(s+12*n)+12)%12;let a=o.MAJOR_SCALE_INTERVALS[r],h=0;if(void 0===a){switch(r){case 1:a=o.MAJOR_SCALE_INTERVALS[0],h=1;break;case 3:a=o.MAJOR_SCALE_INTERVALS[4],h=2;break;case 6:a=o.MAJOR_SCALE_INTERVALS[5],h=1;break;case 8:a=o.MAJOR_SCALE_INTERVALS[9],h=2;break;case 10:a=o.MAJOR_SCALE_INTERVALS[11],h=2;break;default:{console.warn(`Unexpected chromatic interval ${r} in mapMidiToJianpu. Defaulting to sharp of lower valid degree.`);const i=(r-1+12)%12,s=(r+1+12)%12,n=o.MAJOR_SCALE_INTERVALS[i],l=o.MAJOR_SCALE_INTERVALS[s];void 0!==n?(a=n,h=1):void 0!==l?(a=l,h=2):(a=1,h=1,console.error(`Could not determine Jianpu number components for MIDI ${t}, interval ${r} from tonic in key ${e}.`));break}}void 0===a&&(console.error(`Jianpu number became undefined for MIDI ${t} (interval ${r}, key ${e}) after chromatic processing. This indicates a logic error or misconfigured MAJOR_SCALE_INTERVALS.`),a=1,h=1)}const l=Math.floor((t-s)/12);return{jianpuNumber:a,octaveDot:l,accidental:h}}(t.pitch,e);return{...t,jianpuNumber:i.jianpuNumber,octaveDot:i.octaveDot,accidental:i.accidental}}}},775(t,e,i){i.d(e,{MeasuresInfo:()=>r});var s=i(830),n=i(559);class r{measuresInfo;allowDottedRests=!0;constructor(t,e){if(this.measuresInfo=[],!(e>0))return;const i=r.getSortedChanges(t.tempos,s.DEFAULT_TEMPO),n=r.getSortedChanges(t.keySignatures,s.DEFAULT_KEY_SIGNATURE),o=r.getSortedChanges(t.timeSignatures,s.DEFAULT_TIME_SIGNATURE);let a=0,h=0,l=0,u=i[0].event,c=n[0].event,d=o[0].event,g=1,m=(0,s.getMeasureLength)(d),f=d.start;const S=[0];i.forEach(t=>S.push(t.start)),n.forEach(t=>S.push(t.start)),o.forEach(t=>S.push(t.start)),S.sort((t,e)=>t-e);let p=-1;for(let t=0;t<S.length;t++){const r=S[t];if(r>=e)break;if(r===p)continue;p=r;let T=!1,A=!1,E=!1;for(;a<i.length&&i[a].start<=r;)u=i[a++].event,T=!0;for(;h<n.length&&n[h].start<=r;)c=n[h++].event,A=!0;for(;l<o.length&&o[l].start<=r;){g+=(o[l].event.start-f)/m,g=Math.round(1e3*g)/1e3,d=o[l++].event,m=(0,s.getMeasureLength)(d),f=r,E=!0}const I={start:r,measureNumber:g+(r-f)/m,measureLength:m,tempo:u,keySignature:c,timeSignature:d};T&&(I.tempoChange=!0),A&&(I.keyChange=!0),E&&(I.timeChange=!0),this.measuresInfo.push(I)}}static getSortedChanges(t,e){const i=t&&t.length?t.slice():[e];return i.sort((t,e)=>t.start-e.start),i.map(t=>({start:Math.max(0,Math.round(t.start/n.MIN_RESOLUTION)*n.MIN_RESOLUTION),event:t}))}findIndex(t){let e=0,i=this.measuresInfo.length-1,s=0;for(;e<=i;){const n=Math.floor((e+i)/2);this.measuresInfo[n].start<=t?(s=n,e=n+1):i=n-1}return s}measureNumberAtQ(t){if(0===this.measuresInfo.length)return 1;const e=this.findIndex(t),i=this.measuresInfo[e],s=(t-i.start)/i.measureLength;return i.measureNumber+s+1e-9}measureLengthAtQ(t){if(0===this.measuresInfo.length)return(0,s.getMeasureLength)(s.DEFAULT_TIME_SIGNATURE);const e=this.findIndex(t);return this.measuresInfo[e].measureLength}tempoAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TEMPO.qpm;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.tempoChange&&o?r.tempo.qpm:-1}keySignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_KEY_SIGNATURE.key;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.keyChange&&o?r.keySignature.key:-1}timeSignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TIME_SIGNATURE;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.timeChange&&o?r.timeSignature:null}quartersToTime(t,e){const i=this.tempoAtQ(e);return i<=0?0:t/i*60}timeToQuarters(t,e){const i=this.tempoAtQ(e);if(i<=0)return 0;const s=t*i/60;return Math.round(s*n.MAX_QUARTER_DIVISION)/n.MAX_QUARTER_DIVISION}isBeatStart(t){if(0===this.measuresInfo.length)return!1;const e=this.findIndex(t),i=this.measuresInfo[e],s=i.timeSignature,r=(t-(i.start-(i.measureNumber-Math.floor(i.measureNumber))*i.measureLength))/(4/s.denominator);return Math.abs(r-Math.round(r))<n.MIN_RESOLUTION/2}}},559(t,e,i){i.d(e,["MAJOR_SCALE_INTERVALS",0,{0:1,2:2,4:3,5:4,7:5,9:6,11:7},"MAX_QUARTER_DIVISION",0,240,"MIDDLE_C_MIDI",0,60,"MIN_RESOLUTION",0,.0625,"PITCH_CLASS_NAMES",0,["C","C#","D","D#","E","F","F#","G","G#","A","A#","B"]])},240(t,e,i){const s=new Map([[1,1.78],[2,1.6],[3,1.3],[4,1.15]]);i.d(e,["AUGMENTATION_DASH_FACTOR",0,.8,"COMPACT_SPACING_FACTOR",0,1.5,"DOT_SIZE_FACTOR",0,.1,"DURATION_LINE_SCALES",0,s,"FONT_SIZE_MULTIPLIER",0,1.2,"LINE_STROKE_WIDTH",0,1,"OCTAVE_DOT_OFFSET_FACTOR",0,1,"SMALL_FONT_SIZE_MULTIPLIER",0,.75,"UNDERLINE_SPACING_FACTOR",0,.2])},961(t,e,i){i.d(e,["ACCIDENTAL_TEXT",0,["","#","b"],"PATH_SCALE",0,100,"augmentationDashPath",0,"m 0,0 h 50","barPath",0,"m 0,-50 v 100","dotPath",0,"M 0 0 a 15 15 0 1 0 0.0001 0 z","tiePath",0,"M -13,5 C 15,-15 65,-15 90,5 C 65,-25 15,-25 -13,5 Z","underlinePath",0,"m 0,0 h 100"])},134(t,e,i){i.d(e,{createSVGGroupChild:()=>o,drawSVGPath:()=>n,drawSVGText:()=>r,highlightElement:()=>l,resetElementHighlight:()=>u,setBlinkAnimation:()=>a,setStroke:()=>h});const s="http://www.w3.org/2000/svg";function n(t,e,i,n,r,o,a=1){const h=document.createElementNS(s,"path");return h.setAttributeNS(null,"d",e),h.setAttributeNS(null,"transform",`translate(${i}, ${n}) scale(${r}, ${o})`),a<1&&h.setAttributeNS(null,"opacity",`${a}`),t.appendChild(h),h}function r(t,e,i,n,r,o="normal",a="middle",h="middle",l="currentColor",u=1,c="sans-serif"){const d=document.createElementNS(s,"text");d.setAttributeNS(null,"font-family",c),d.setAttributeNS(null,"font-size",r),d.setAttributeNS(null,"font-weight",o),d.setAttributeNS(null,"x",`${i}`),d.setAttributeNS(null,"y",`${n}`),d.setAttributeNS(null,"text-anchor",a),d.setAttributeNS(null,"dominant-baseline",h),"currentColor"!==l&&d.setAttributeNS(null,"fill",l),u<1&&d.setAttributeNS(null,"opacity",`${u}`);const g=document.createTextNode(e);return d.appendChild(g),t.appendChild(d),d}function o(t,e){const i=document.createElementNS(s,"g");return e&&i.setAttribute("data-id",e),t.appendChild(i),i}function a(t,e=!0,i="1s"){let n=t.querySelector('animate[attributeName="opacity"]');return e?n?(n.setAttributeNS(null,"repeatCount","indefinite"),n.beginElement()):(n=document.createElementNS(s,"animate"),n.setAttributeNS(null,"attributeName","opacity"),n.setAttributeNS(null,"values","1;0.2;1"),n.setAttributeNS(null,"keyTimes","0;0.5;1"),n.setAttributeNS(null,"dur",i),n.setAttributeNS(null,"repeatCount","indefinite"),t.appendChild(n)):(n&&(n.endElement(),n.setAttributeNS(null,"repeatCount","0"),t.style.opacity="1"),t.style.opacity="1"),t}function h(t,e,i){t.setAttributeNS(null,"stroke",e),t.setAttributeNS(null,"stroke-width",`${i}`)}function l(t,e){const i=[];return t.matches("text, path")&&i.push(t),t.querySelectorAll("text, path").forEach(t=>{i.push(t)}),i.forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e);const i=t.getAttribute("stroke");null!==i&&"none"!==i&&t.setAttribute("stroke",e)}),t}function u(t,e){t.querySelectorAll("text, path").forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e);const i=t.getAttribute("stroke");null!==i&&"none"!==i&&t.setAttribute("stroke",e)})}i.d(e,["SVGNS",0,s])}};const e={};function i(s){const n=e[s];if(void 0!==n)return n.exports;const r=e[s]={exports:{}};return t[s](r,r.exports,i),r.exports}i.d=(t,e)=>{if(Array.isArray(e))for(var s=0;s<e.length;){var n=e[s++],r=e[s++],o=0===r?{enumerable:!0,value:e[s++]}:{enumerable:!0,get:r};i.o(t,n)||Object.defineProperty(t,n,o)}else for(var n in e)i.o(e,n)&&!i.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},i.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),i.r=t=>{Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};let s={};i.r(s),i.d(s,{JianpuSVGRender:()=>c,ScrollType:()=>n});var n,r=i(240),o=i(134),a=i(961),h=i(830),l=i(849),u=i(559);!function(t){t[t.PAGE=0]="PAGE",t[t.NOTE=1]="NOTE",t[t.BAR=2]="BAR"}(n||(n={}));class c{jianpuInfo;jianpuModel;config;height;width;parentElement;div;mainSVG;mainG;musicG;signaturesG;overlaySVG;overlayG;signaturesBlinking;lastKnownScrollLeft;isScrolling;currentKey;currentTimeSignature;playingNotes;lastRenderedQ;estimatedNoteWidth;numberFontSize;smallFontSize;yBaseline;parseColorString(t){return/^[a-z]+$/i.test(t)||t.startsWith("rgb(")?t:/^\d+,\s*\d+,\s*\d+$/.test(t)?`rgb(${t})`:t}constructor(t,e,i){this.jianpuInfo=t,this.div=i;this.config={noteHeight:e.noteHeight??20,noteSpacingFactor:e.noteSpacingFactor??r.COMPACT_SPACING_FACTOR,pixelsPerTimeStep:e.pixelsPerTimeStep??0,noteColor:this.parseColorString(e.noteColor??"black"),activeNoteColor:this.parseColorString(e.activeNoteColor??"red"),defaultKey:e.defaultKey??0,scrollType:e.scrollType??n.PAGE,fontFamily:e.fontFamily??"sans-serif",width:e.width??0,height:e.height??0},this.jianpuModel=new l.JianpuModel(this.jianpuInfo,this.config.defaultKey),this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??h.DEFAULT_TIME_SIGNATURE,this.playingNotes=new Map,this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.numberFontSize=this.config.noteHeight*r.FONT_SIZE_MULTIPLIER,this.smallFontSize=this.config.noteHeight*r.SMALL_FONT_SIZE_MULTIPLIER,this.estimatedNoteWidth=.6*this.numberFontSize,this.yBaseline=1.5*this.config.noteHeight,this.height=0,this.width=0,this.clear(),this.redraw()}clear(){for(;this.div.lastChild;)this.div.removeChild(this.div.lastChild);this.div.style.position="relative",this.div.style.overflow="hidden",this.overlaySVG=document.createElementNS(o.SVGNS,"svg"),this.overlaySVG.style.position="absolute",this.overlaySVG.style.left="0",this.overlaySVG.style.top="0",this.overlaySVG.style.pointerEvents="none",this.div.appendChild(this.overlaySVG),this.overlayG=(0,o.createSVGGroupChild)(this.overlaySVG,"overlay"),this.parentElement=document.createElement("div"),this.parentElement.style.overflowX="auto",this.parentElement.style.overflowY="hidden",this.parentElement.style.width="100%",this.parentElement.style.height="100%",this.div.appendChild(this.parentElement),this.parentElement.addEventListener("scroll",this.handleScrollEvent),this.mainSVG=document.createElementNS(o.SVGNS,"svg"),this.mainSVG.style.display="block",this.parentElement.appendChild(this.mainSVG),this.mainG=(0,o.createSVGGroupChild)(this.mainSVG,"main-content"),this.signaturesG=(0,o.createSVGGroupChild)(this.mainG,"signatures"),this.musicG=(0,o.createSVGGroupChild)(this.mainG,"music"),this.playingNotes.clear(),this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.height=this.config.height>0?this.config.height:5*this.config.noteHeight,this.width=this.config.width>0?this.config.width:0,this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??h.DEFAULT_TIME_SIGNATURE,this.drawSignatures(this.overlayG,0,!0,!0),this.updateLayout()}updateLayout(t){this.width=t??this.width,this.config.width>0&&(this.width=this.config.width),this.height=Math.max(this.height,6*this.config.noteHeight),this.config.height>0&&(this.height=this.config.height);const e=1.65*this.config.noteHeight;this.mainSVG.setAttribute("width",`${this.width}`),this.mainSVG.setAttribute("height",`${this.height}`),this.mainG.setAttribute("transform",`translate(0, ${this.yBaseline+e})`),this.overlaySVG.setAttribute("width","200"),this.overlaySVG.setAttribute("height",`${this.height}`),this.overlayG.setAttribute("transform",`translate(0, ${this.yBaseline})`)}redraw(t,e){let i=-1;const s=this.config.pixelsPerTimeStep<=0;if(t){const r=`${t.start}-${t.pitch}`;if(this.playingNotes.forEach((t,e)=>{if(e!==r){const t=this.mainSVG.querySelector(`g[data-id="${e}"]`);t&&(0,o.resetElementHighlight)(t,this.config.noteColor),this.playingNotes.delete(e)}}),!this.playingNotes.has(r)){const s=this.mainSVG.querySelector(`g[data-id="${r}"]`);if(s){(0,o.highlightElement)(s,this.config.activeNoteColor),this.playingNotes.set(r,t);const a=s.getBoundingClientRect(),h=this.mainSVG.getBoundingClientRect();i=a.left-h.left+this.parentElement.scrollLeft;const l=s.hasAttribute("data-is-measure-start");e&&(this.config.scrollType!==n.BAR||l)&&this.scrollIntoViewIfNeeded(i)}}if(!s&&this.signaturesBlinking){const e=this.overlayG.getBoundingClientRect().width;this.jianpuModel.measuresInfo.quartersToTime(t.start,t.start)*this.config.pixelsPerTimeStep>e&&(this.signaturesBlinking=!1,(0,o.setBlinkAnimation)(this.overlayG,!1))}}else{this.jianpuModel.update(this.jianpuInfo,this.config.defaultKey);let t=this.width,e=this.width,i=this.height>0?this.height-this.yBaseline:3*this.config.noteHeight,n=0;const r=new Map;this.jianpuModel.jianpuBlockMap.forEach((o,a)=>{if(a>=this.lastRenderedQ-1e-9){t=s?e:this.jianpuModel.measuresInfo.quartersToTime(a,a)*this.config.pixelsPerTimeStep;const h=this.drawJianpuBlock(o,t,r);s?e+=h:e=Math.max(e,t+h);const l=this.mainSVG.querySelector(`g[data-block-start="${o.start}"]`);if(l)try{const t=l.getBBox(),e=t.y,s=t.y+t.height;n=Math.min(n,e),i=Math.max(i,s)}catch(t){}this.lastRenderedQ=a+o.length}}),this.height=Math.max(this.height,i-n+this.config.noteHeight),this.updateLayout(e)}return i}drawJianpuBlock(t,e,i){let s=0;const n=this.config.pixelsPerTimeStep<=0,h=t.isMeasureBeginning(),l=(0,o.createSVGGroupChild)(this.musicG,`block-${t.start}`);if(l.setAttribute("data-block-start",`${t.start}`),h&&t.start>1e-6){const t=e-(n?.6*this.estimatedNoteWidth:4),i=2*this.config.noteHeight,h=0,l=(0,o.drawSVGPath)(this.musicG,a.barPath,t,h,1,i/a.PATH_SCALE);(0,o.setStroke)(l,this.config.noteColor,r.LINE_STROKE_WIDTH),n&&(s+=r.LINE_STROKE_WIDTH)}const u=this.updateCurrentKey(t.start),c=this.updateCurrentTimeSignature(t.start);let d=0;if((u||c)&&t.start>1e-6){const t=e+s;d=this.drawSignatures(this.signaturesG,t,u,c),n&&(s+=d+.2*this.estimatedNoteWidth)}const g=e+s;let m=0;if(t.notes.length>0?m=this.drawNotes(t,g,i,l):t.length>1e-6&&(m=this.drawRest(t,g,l)),n){s+=m;let e=this.estimatedNoteWidth*this.config.noteSpacingFactor;t.beatEnd?e*=1:t.length<.0625?e*=.05:t.length<.125?e*=.1:t.length<.25?e*=.2:t.length<.5?e*=.4:t.length<1&&(e*=.5),s+=e}else s=Math.max(d,m);if(this.jianpuModel.isLastMeasureAtQ(t.start+t.length)){const t=e+s,i=2*this.config.noteHeight,h=0,l=(0,o.drawSVGPath)(this.musicG,a.barPath,t,h,1,i/a.PATH_SCALE);(0,o.setStroke)(l,this.config.noteColor,r.LINE_STROKE_WIDTH),n&&(s+=r.LINE_STROKE_WIDTH)}return s}drawNotes(t,e,i,s){let n=e,h=e;const l=.1*this.estimatedNoteWidth,u=`${this.numberFontSize}px`,c=`${this.smallFontSize}px`,{durationLines:d=0,augmentationDots:g=0,augmentationDash:m=!1}=t;return t.notes.forEach(e=>{const f=`${e.start}-${e.pitch}`,S=(0,o.createSVGGroupChild)(s,f);t.isMeasureBeginning()&&S.setAttribute("data-is-measure-start","true");let p=n,T=p;if(0!==e.accidental){const t=a.ACCIDENTAL_TEXT[e.accidental];(0,o.drawSVGText)(S,t,p+l,0,c,"normal","end","text-top",this.config.noteColor,1,this.config.fontFamily)}let A=0;if(m){const t=this.config.noteHeight*r.AUGMENTATION_DASH_FACTOR,e=t/50,i=(0,o.drawSVGPath)(S,a.augmentationDashPath,p,0,e,1);(0,o.setStroke)(i,this.config.noteColor,r.LINE_STROKE_WIDTH),A=t,T=p+A}else{const t=`${e.jianpuNumber}`;A=(0,o.drawSVGText)(S,t,p,0,u,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width,T=p+A}if(0!==e.octaveDot&&!1===m){const t=this.config.noteHeight*r.DOT_SIZE_FACTOR,i=t/(.15*a.PATH_SCALE),s=p+A/2,n=2.8*t,h=this.config.noteHeight*r.OCTAVE_DOT_OFFSET_FACTOR;for(let t=0;t<Math.abs(e.octaveDot);t++){const r=(e.octaveDot>0?-h:.6*h)-t*n*(e.octaveDot>0?1:-1);(0,o.drawSVGPath)(S,a.dotPath,s,r,i,i)}}if(d>0){const t=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR,i=A/a.PATH_SCALE*(r.DURATION_LINE_SCALES.get(d)??1);for(let s=0;s<d;s++){const n=t+s*e,h=(0,o.drawSVGPath)(S,a.underlinePath,p,n,i,1);(0,o.setStroke)(h,this.config.noteColor,r.LINE_STROKE_WIDTH)}}let E=T+l;if(g>0){const t=this.config.noteHeight*r.DOT_SIZE_FACTOR,e=t/(.15*a.PATH_SCALE);for(let i=0;i<g;i++)(0,o.drawSVGPath)(S,a.dotPath,E,0,e,e),E+=t+l;T=E+l}const I=T;if(e.tiedTo&&!m)i.set(e,{g:S,xNoteRight:I,yNoteBaseline:0});else if(e.tiedFrom){let t=e.tiedFrom;for(;t.tiedFrom;)t=t.tiedFrom;const s=i.get(t);if(s){const n=1*s.xNoteRight,r=(m?p-2.2*this.estimatedNoteWidth:p-l)-n,h=1.2*-this.config.noteHeight,u=r/a.PATH_SCALE*1.3,c=this.config.noteHeight/a.PATH_SCALE*1.6;r>1&&(0,o.drawSVGPath)(s.g,a.tiePath,n-(s.g.getCTM()?.e??0),h,u,c);let d=t;for(;d&&d!==e;){i.delete(d);const t=d.tiedTo;t&&(d=t)}}else console.warn("Missing linked SVG details for first tied note:",t)}h=Math.max(h,T)}),h-e}drawRest(t,e,i){const s=`${this.numberFontSize}px`,n=.1*this.estimatedNoteWidth,{durationLines:h=0,augmentationDots:l=0}=t;let u=e,c=u;const d=(0,o.drawSVGText)(i,"0",u,0,s,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width;if(c=u+d,h>0){const t=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*r.UNDERLINE_SPACING_FACTOR,s=d/a.PATH_SCALE*(r.DURATION_LINE_SCALES.get(h)??1);for(let n=0;n<h;n++){const h=t+n*e,l=(0,o.drawSVGPath)(i,a.underlinePath,u,h,s,1);(0,o.setStroke)(l,this.config.noteColor,r.LINE_STROKE_WIDTH)}}let g=c+n;if(l>0){const t=this.config.noteHeight*r.DOT_SIZE_FACTOR,e=t/(.15*a.PATH_SCALE);for(let s=0;s<l;s++)(0,o.drawSVGPath)(i,a.dotPath,g,0,e,e),g+=t+n;c=g+n}return c-e}drawSignatures(t,e,i,s){let n=e;const r=.3*this.estimatedNoteWidth,a=`${this.smallFontSize}px`,h=`${this.numberFontSize}px`;if(i){const e=`1=${u.PITCH_CLASS_NAMES[this.currentKey%12]??"C"}`;n+=(0,o.drawSVGText)(t,e,n,0,h,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width+2*r}if(s){const e=`${this.currentTimeSignature.numerator}/${this.currentTimeSignature.denominator}`;n+=(0,o.drawSVGText)(t,e,n,0,a,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width+r}const l=n-e;try{const e=t.getBBox(),i=e.y,s=e.y+e.height,n=Math.max(this.yBaseline+s,this.yBaseline-i)+.5*this.config.noteHeight;this.height=Math.max(this.height,n)}catch(t){}return t===this.overlayG&&this.config.pixelsPerTimeStep>0&&(this.signaturesBlinking=!0,(0,o.setBlinkAnimation)(this.overlayG,!0)),l}updateCurrentKey(t){const e=this.jianpuModel.measuresInfo.keySignatureAtQ(t,!0);return-1!==e&&e!==this.currentKey&&(this.currentKey=e,!0)}updateCurrentTimeSignature(t){const e=this.jianpuModel.measuresInfo.timeSignatureAtQ(t,!0);return!(!e||e.numerator===this.currentTimeSignature.numerator&&e.denominator===this.currentTimeSignature.denominator)&&(this.currentTimeSignature=e,!0)}handleScrollEvent=t=>{this.lastKnownScrollLeft=this.parentElement.scrollLeft,this.isScrolling||window.requestAnimationFrame(()=>{this.updateOverlaySignaturesForScroll(this.lastKnownScrollLeft),this.isScrolling=!1}),this.isScrolling=!0};scrollIntoViewIfNeeded(t){const e=this.parentElement.getBoundingClientRect().width,i=this.parentElement.scrollLeft;let s=i;if(this.config.scrollType===n.PAGE){const n=20;t<i+n?s=t-n:t>i+e-n&&(s=t-e+n)}else{s=t-.5*e}s=Math.max(0,Math.min(s,this.parentElement.scrollWidth-e)),Math.abs(s-i)>1&&(this.parentElement.scrollTo({left:s,behavior:"smooth"}),this.updateOverlaySignaturesForScroll(s))}updateOverlaySignaturesForScroll(t){const e=this.pixelsToTime(t),i=this.jianpuModel.measuresInfo.keySignatureAtQ(e),s=this.jianpuModel.measuresInfo.timeSignatureAtQ(e)??this.currentTimeSignature;let n=!1;if(i!==this.currentKey&&(this.currentKey=i,n=!0),s.numerator===this.currentTimeSignature.numerator&&s.denominator===this.currentTimeSignature.denominator||(this.currentTimeSignature=s,n=!0),n){for(;this.overlayG.lastChild;)this.overlayG.removeChild(this.overlayG.lastChild);this.drawSignatures(this.overlayG,0,!0,!0),t<10&&this.config.pixelsPerTimeStep>0?((0,o.setBlinkAnimation)(this.overlayG,!0),this.signaturesBlinking=!0):this.config.pixelsPerTimeStep>0&&((0,o.setBlinkAnimation)(this.overlayG,!1),this.signaturesBlinking=!1)}}pixelsToTime(t){return this.config.pixelsPerTimeStep<=0?0:this.jianpuModel.measuresInfo.timeToQuarters(t/this.config.pixelsPerTimeStep,0)}}return s})());
|
package/node/lib.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.mm=e():t.mm=e()}(global,()=>(()=>{"use strict";var t={644(t,e,i){i.r(e),i.d(e,{DEFAULT_KEY_SIGNATURE:()=>o.DEFAULT_KEY_SIGNATURE,DEFAULT_TEMPO:()=>o.DEFAULT_TEMPO,DEFAULT_TIME_SIGNATURE:()=>o.DEFAULT_TIME_SIGNATURE,JianpuBlock:()=>r.JianpuBlock,JianpuModel:()=>n.JianpuModel,JianpuSVGRender:()=>s.JianpuSVGRender,ScrollType:()=>s.ScrollType,getMeasureLength:()=>o.getMeasureLength,mapMidiToJianpu:()=>n.mapMidiToJianpu,splitJianpuNote:()=>r.splitJianpuNote});var s=i(313),n=i(849),r=i(765),o=i(830)},765(t,e,i){i.d(e,{JianpuBlock:()=>o,splitJianpuNote:()=>r});var s=i(559);function n(t){return Math.abs(t)<1e-6}function r(t,e){const i=t.start+t.length;if(e<=t.start||e>=i||n(i-e))return null;const s=i-e;t.length=e-t.start;const r={start:e,length:s,pitch:t.pitch,intensity:t.intensity,jianpuNumber:t.jianpuNumber,octaveDot:t.octaveDot,accidental:0,tiedFrom:t};return t.tiedTo&&(r.tiedTo=t.tiedTo,t.tiedTo.tiedFrom=r),t.tiedTo=r,r}class o{start;length;notes;measureNumber;durationLines;augmentationDots;augmentationDash;beatBegin;beatEnd;isTieStart;isTieEnd;constructor(t=0,e=0,i=[],s=1){this.start=t,this.length=e,this.notes=i,this.measureNumber=s}addNote(t){if(0===this.notes.length)return this.start=t.start,this.length=t.length,this.notes.push(t),!0;if(!n(this.start-t.start))return console.warn(`JianpuBlock: Attempted to add note at ${t.start} to block starting at ${this.start}. Ignoring.`),!1;let e=!1,i=!1;for(let s=0;s<this.notes.length;s++)if(this.notes[s].pitch===t.pitch){i=!0,t.length<this.notes[s].length&&(this.notes[s].tiedFrom&&(t.tiedFrom=this.notes[s].tiedFrom,t.tiedFrom&&(t.tiedFrom.tiedTo=t)),this.notes[s].tiedTo&&(t.tiedTo=this.notes[s].tiedTo,t.tiedTo&&(t.tiedTo.tiedFrom=t)),this.notes[s]=t,e=!0);break}i||this.notes.push(t);let s=1/0;for(const t of this.notes)s=Math.min(s,t.length);return this.length=s,!i||e}split(t,e){const i=this.start+this.length;if(t<=this.start||t>=i||n(i-t))return null;const s=i-t,a=t-this.start,h=new o(t,s,[],e.measureNumberAtQ(t)),l=[];for(const e of this.notes){const i=e.start+e.length;if(i>t+1e-6){const i=r(e,t);i?l.push(i):console.warn("Split failed for note, unexpected state.")}else n(i-t)}return l.forEach(t=>h.addNote(t)),this.length=a,delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash,this.beatEnd&&(h.beatEnd=!0,delete this.beatEnd),this.isTieEnd&&(h.isTieStart=!0,delete this.isTieEnd),h}splitToBeat(t){const e=t.timeSignatureAtQ(this.start);if(!e)return null;const i=t.measureLengthAtQ(this.start),s=t.measureNumberAtQ(this.start),r=this.start-(s-Math.floor(s))*i,o=this.start-r,a=4/e.denominator,h=o/a;this.beatBegin=n(h-Math.round(h));const l=r+(Math.floor(h+1e-6)+1)*a,u=r+i,c=this.start+this.length;let d=null;l<c-1e-6&&l>this.start+1e-6&&(d=l),u<c-1e-6&&u>this.start+1e-6&&(null===d||u<d)&&(d=u);let g=null;if(null!==d)g=this.split(d,t),g&&(this.beatEnd=!0);else{const t=(o+this.length)/a;this.beatEnd=n(t-Math.round(t)),this.beatEnd||(this.beatEnd=n(c-u))}return this.isTieStart=this.notes.some(t=>t.tiedFrom),this.isTieEnd=this.notes.some(t=>t.tiedTo),g&&(g.isTieStart=g.notes.some(t=>t.tiedFrom),g.isTieEnd=g.notes.some(t=>t.tiedTo),this.notes.some(t=>t.tiedTo&&t.start+t.length>d)&&delete this.isTieEnd),g}calculateRenderProperties(t){delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash;const e=this.length;if(n(e)||e<0)return;if(t.allowDottedRests||this.notes.length>0){if(n(e-1.5))return void(this.augmentationDots=1);if(n(e-.75))return this.durationLines=1,void(this.augmentationDots=1);if(n(e-.375))return this.durationLines=2,void(this.augmentationDots=1);n(e-3)&&(this.augmentationDots=1)}if(this.durationLines=e>=3.999999||e>=1.999999||e>=.999999?0:e>=.499999?1:e>=.249999?2:e>=.124999?3:4,this.augmentationDash=!1,1===this.notes.length){const e=this.notes[0],i=t.timeSignatureAtQ(this.start);if(!i)return;const s=Math.max(4/i.denominator,1);if(!(this.measureNumber%1<=1e-6)&&e.tiedFrom&&n(e.tiedFrom.length-s)&&e.tiedFrom.pitch===e.pitch&&e.length>=1){let i=!0;if(e.tiedTo){const s=e.start+e.length;i=Math.floor(t.measureNumberAtQ(this.start))===Math.floor(t.measureNumberAtQ(s))&&e.tiedTo.length>=1}i&&(this.augmentationDash=!0)}}}splitToStandardSymbol(t){const e=this.length;if(n(e)||e<s.MIN_RESOLUTION-1e-6)return null;const i=[];t.allowDottedRests||this.notes.length>0?(i.push(6),i.push(4),i.push(3),i.push(2),i.push(1.5),i.push(1),i.push(.75),i.push(.5),i.push(.375),i.push(.25),i.push(.125),i.push(.0625)):(i.push(4),i.push(2),i.push(1),i.push(.5),i.push(.25),i.push(.125),i.push(.0625));let r=0;for(const t of i)if(e>=t-1e-6){r=t;break}n(r)&&(r=s.MIN_RESOLUTION,e<r-1e-6&&e>1e-6&&console.warn(`Block length ${e} is too small, rendering as ${r}`));let o=null;return e>r+1e-6?(o=this.split(this.start+r,t),this.length!==r&&(console.warn(`Adjusting block length after split from ${this.length} to ${r}`),this.length=r)):this.length=r,o}mergeToMap(t){const e=t.get(this.start);e?(this.notes.forEach(t=>e.addNote(t)),0!==this.measureNumber&&(e.measureNumber=this.measureNumber)):t.set(this.start,this)}isMeasureBeginning(){return n(this.measureNumber-Math.floor(this.measureNumber))}}},830(t,e,i){i.d(e,{getMeasureLength:()=>s});function s(t){return t.numerator*(4/t.denominator)}i.d(e,["DEFAULT_KEY_SIGNATURE",0,{start:0,key:0},"DEFAULT_TEMPO",0,{start:0,qpm:60},"DEFAULT_TIME_SIGNATURE",0,{start:0,numerator:4,denominator:4}])},849(t,e,i){i.d(e,{JianpuModel:()=>a,mapMidiToJianpu:()=>h});var s=i(830),n=i(775),r=i(765),o=i(559);class a{jianpuInfo;measuresInfo;jianpuBlockMap;lastQ;constructor(t,e){this.jianpuInfo=t,this.jianpuBlockMap=new Map,this.lastQ=0,this.update(t,e)}isLastMeasureAtQ(t){return t>=this.lastQ-1e-6}getTotalDuration(){return this.lastQ}update(t,e){this.jianpuInfo=t,t.notes.sort((t,e)=>t.start-e.start),this.lastQ=0,t.notes.forEach(t=>{this.lastQ=Math.max(this.lastQ,t.start+t.length)}),this.lastQ+=1e-6,t.tempos=t.tempos&&t.tempos.length?t.tempos:[s.DEFAULT_TEMPO],t.tempos.sort((t,e)=>t.start-e.start),t.tempos[0].start>1e-6&&t.tempos.unshift({...s.DEFAULT_TEMPO,start:0});const i=void 0!==e?{start:0,key:e}:{...s.DEFAULT_KEY_SIGNATURE};t.keySignatures=t.keySignatures&&t.keySignatures.length?t.keySignatures:[i],t.keySignatures.sort((t,e)=>t.start-e.start),t.keySignatures[0].start>1e-6&&t.keySignatures.unshift({...i,start:0}),t.timeSignatures=t.timeSignatures&&t.timeSignatures.length?t.timeSignatures:[s.DEFAULT_TIME_SIGNATURE],t.timeSignatures.sort((t,e)=>t.start-e.start),t.timeSignatures[0].start>1e-6&&t.timeSignatures.unshift({...s.DEFAULT_TIME_SIGNATURE,start:0}),this.measuresInfo=new n.MeasuresInfo(t,this.lastQ),this.infoToBlocks()}infoToBlocks(){const t=new Map;let e=0;if(this.jianpuInfo.notes.forEach(i=>{const s=i.start,n=this.measuresInfo.measureNumberAtQ(s);if(s>e+1e-6){const i=e,n=s-i,o=this.measuresInfo.measureNumberAtQ(i),a=new r.JianpuBlock(i,n,[],o);t.set(i,a)}const o=this.measuresInfo.keySignatureAtQ(s),a=this.createJianpuNote(i,o);let h=t.get(s);h||(h=new r.JianpuBlock(s,0,[],n),t.set(s,h)),h.addNote(a),e=Math.max(e,s+h.length)}),this.lastQ>e+1e-6){const i=e,s=this.lastQ-1e-6-i;if(s>1e-6){const e=this.measuresInfo.measureNumberAtQ(i),n=new r.JianpuBlock(i,s,[],e);t.set(i,n)}}this.jianpuBlockMap=new Map;const i=Array.from(t.keys()).sort((t,e)=>t-e);let s=[];i.forEach(e=>{s.push(t.get(e))});const n=new Set;for(;s.length>0;){let t=s.shift();n.has(t.start)&&this.jianpuBlockMap.has(t.start);let e=t.splitToBeat(this.measuresInfo);if(e){t.mergeToMap(this.jianpuBlockMap),n.add(t.start),s.unshift(e);continue}let i=t,r=null;do{r=i.splitToStandardSymbol(this.measuresInfo),i.mergeToMap(this.jianpuBlockMap),n.add(i.start),r&&(i=r)}while(r)}this.jianpuBlockMap.forEach(t=>{t.calculateRenderProperties(this.measuresInfo)})}createJianpuNote(t,e){const i=h(t.pitch,e);return{...t,jianpuNumber:i.jianpuNumber,octaveDot:i.octaveDot,accidental:i.accidental}}}function h(t,e){const i=e%12;let s=o.MIDDLE_C_MIDI+i;i>o.MIDDLE_C_MIDI%12&&(s-=12);const n=(t-(s+12*Math.round((t-s)/12))+12)%12;let r=o.MAJOR_SCALE_INTERVALS[n],a=0;if(void 0===r){switch(n){case 1:r=o.MAJOR_SCALE_INTERVALS[0],a=1;break;case 3:r=o.MAJOR_SCALE_INTERVALS[4],a=2;break;case 6:r=o.MAJOR_SCALE_INTERVALS[5],a=1;break;case 8:r=o.MAJOR_SCALE_INTERVALS[9],a=2;break;case 10:r=o.MAJOR_SCALE_INTERVALS[11],a=2;break;default:{console.warn(`Unexpected chromatic interval ${n} in mapMidiToJianpu. Defaulting to sharp of lower valid degree.`);const i=(n-1+12)%12,s=(n+1+12)%12,h=o.MAJOR_SCALE_INTERVALS[i],l=o.MAJOR_SCALE_INTERVALS[s];void 0!==h?(r=h,a=1):void 0!==l?(r=l,a=2):(r=1,a=1,console.error(`Could not determine Jianpu number components for MIDI ${t}, interval ${n} from tonic in key ${e}.`));break}}void 0===r&&(console.error(`Jianpu number became undefined for MIDI ${t} (interval ${n}, key ${e}) after chromatic processing. This indicates a logic error or misconfigured MAJOR_SCALE_INTERVALS.`),r=1,a=1)}return{jianpuNumber:r,octaveDot:Math.floor((t-s)/12),accidental:a}}},313(t,e,i){i.d(e,{JianpuSVGRender:()=>u,ScrollType:()=>s});var s,n=i(240),r=i(134),o=i(961),a=i(830),h=i(849),l=i(559);!function(t){t[t.PAGE=0]="PAGE",t[t.NOTE=1]="NOTE",t[t.BAR=2]="BAR"}(s||(s={}));class u{jianpuInfo;jianpuModel;config;height;width;parentElement;div;mainSVG;mainG;musicG;signaturesG;overlaySVG;overlayG;signaturesBlinking;lastKnownScrollLeft;isScrolling;currentKey;currentTimeSignature;playingNotes;lastRenderedQ;estimatedNoteWidth;numberFontSize;smallFontSize;yBaseline;parseColorString(t){return/^[a-z]+$/i.test(t)||t.startsWith("rgb(")?t:/^\d+,\s*\d+,\s*\d+$/.test(t)?`rgb(${t})`:t}constructor(t,e,i){this.jianpuInfo=t,this.div=i;this.config={noteHeight:e.noteHeight??20,noteSpacingFactor:e.noteSpacingFactor??n.COMPACT_SPACING_FACTOR,pixelsPerTimeStep:e.pixelsPerTimeStep??0,noteColor:this.parseColorString(e.noteColor??"black"),activeNoteColor:this.parseColorString(e.activeNoteColor??"red"),defaultKey:e.defaultKey??0,scrollType:e.scrollType??s.PAGE,fontFamily:e.fontFamily??"sans-serif",width:e.width??0,height:e.height??0},this.jianpuModel=new h.JianpuModel(this.jianpuInfo,this.config.defaultKey),this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??a.DEFAULT_TIME_SIGNATURE,this.playingNotes=new Map,this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.numberFontSize=this.config.noteHeight*n.FONT_SIZE_MULTIPLIER,this.smallFontSize=this.config.noteHeight*n.SMALL_FONT_SIZE_MULTIPLIER,this.estimatedNoteWidth=.6*this.numberFontSize,this.yBaseline=1.5*this.config.noteHeight,this.height=0,this.width=0,this.clear(),this.redraw()}clear(){for(;this.div.lastChild;)this.div.removeChild(this.div.lastChild);this.div.style.position="relative",this.div.style.overflow="hidden",this.overlaySVG=document.createElementNS(r.SVGNS,"svg"),this.overlaySVG.style.position="absolute",this.overlaySVG.style.left="0",this.overlaySVG.style.top="0",this.overlaySVG.style.pointerEvents="none",this.div.appendChild(this.overlaySVG),this.overlayG=(0,r.createSVGGroupChild)(this.overlaySVG,"overlay"),this.parentElement=document.createElement("div"),this.parentElement.style.overflowX="auto",this.parentElement.style.overflowY="hidden",this.parentElement.style.width="100%",this.parentElement.style.height="100%",this.div.appendChild(this.parentElement),this.parentElement.addEventListener("scroll",this.handleScrollEvent),this.mainSVG=document.createElementNS(r.SVGNS,"svg"),this.mainSVG.style.display="block",this.parentElement.appendChild(this.mainSVG),this.mainG=(0,r.createSVGGroupChild)(this.mainSVG,"main-content"),this.signaturesG=(0,r.createSVGGroupChild)(this.mainG,"signatures"),this.musicG=(0,r.createSVGGroupChild)(this.mainG,"music"),this.playingNotes.clear(),this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.height=this.config.height>0?this.config.height:5*this.config.noteHeight,this.width=this.config.width>0?this.config.width:0,this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??a.DEFAULT_TIME_SIGNATURE,this.drawSignatures(this.overlayG,0,!0,!0),this.updateLayout()}updateLayout(t){this.width=t??this.width,this.config.width>0&&(this.width=this.config.width),this.height=Math.max(this.height,6*this.config.noteHeight),this.config.height>0&&(this.height=this.config.height);const e=1.65*this.config.noteHeight;this.mainSVG.setAttribute("width",`${this.width}`),this.mainSVG.setAttribute("height",`${this.height}`),this.mainG.setAttribute("transform",`translate(0, ${this.yBaseline+e})`),this.overlaySVG.setAttribute("width","200"),this.overlaySVG.setAttribute("height",`${this.height}`),this.overlayG.setAttribute("transform",`translate(0, ${this.yBaseline})`)}redraw(t,e){let i=-1;const n=this.config.pixelsPerTimeStep<=0;if(t){const o=`${t.start}-${t.pitch}`;if(this.playingNotes.forEach((t,e)=>{if(e!==o){const t=this.mainSVG.querySelector(`g[data-id="${e}"]`);t&&(0,r.resetElementHighlight)(t,this.config.noteColor),this.playingNotes.delete(e)}}),!this.playingNotes.has(o)){const n=this.mainSVG.querySelector(`g[data-id="${o}"]`);if(n){(0,r.highlightElement)(n,this.config.activeNoteColor),this.playingNotes.set(o,t);const a=n.getBoundingClientRect(),h=this.mainSVG.getBoundingClientRect();i=a.left-h.left+this.parentElement.scrollLeft;const l=n.hasAttribute("data-is-measure-start");e&&(this.config.scrollType!==s.BAR||l)&&this.scrollIntoViewIfNeeded(i)}}if(!n&&this.signaturesBlinking){const e=this.overlayG.getBoundingClientRect().width;this.jianpuModel.measuresInfo.quartersToTime(t.start,t.start)*this.config.pixelsPerTimeStep>e&&(this.signaturesBlinking=!1,(0,r.setBlinkAnimation)(this.overlayG,!1))}}else{this.jianpuModel.update(this.jianpuInfo,this.config.defaultKey);let t=this.width,e=this.width,i=this.height>0?this.height-this.yBaseline:3*this.config.noteHeight,s=0;const r=new Map;this.jianpuModel.jianpuBlockMap.forEach((o,a)=>{if(a>=this.lastRenderedQ-1e-9){t=n?e:this.jianpuModel.measuresInfo.quartersToTime(a,a)*this.config.pixelsPerTimeStep;const h=this.drawJianpuBlock(o,t,r);n?e+=h:e=Math.max(e,t+h);const l=this.mainSVG.querySelector(`g[data-block-start="${o.start}"]`);if(l)try{const t=l.getBBox(),e=t.y,n=t.y+t.height;s=Math.min(s,e),i=Math.max(i,n)}catch(t){}this.lastRenderedQ=a+o.length}}),this.height=Math.max(this.height,i-s+this.config.noteHeight),this.updateLayout(e)}return i}drawJianpuBlock(t,e,i){let s=0;const a=this.config.pixelsPerTimeStep<=0,h=t.isMeasureBeginning(),l=(0,r.createSVGGroupChild)(this.musicG,`block-${t.start}`);if(l.setAttribute("data-block-start",`${t.start}`),h&&t.start>1e-6){const t=e-(a?.6*this.estimatedNoteWidth:4),i=2*this.config.noteHeight,h=0,l=(0,r.drawSVGPath)(this.musicG,o.barPath,t,h,1,i/o.PATH_SCALE);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH),a&&(s+=n.LINE_STROKE_WIDTH)}const u=this.updateCurrentKey(t.start),c=this.updateCurrentTimeSignature(t.start);let d=0;if((u||c)&&t.start>1e-6){const t=e+s;d=this.drawSignatures(this.signaturesG,t,u,c),a&&(s+=d+.2*this.estimatedNoteWidth)}const g=e+s;let m=0;if(t.notes.length>0?m=this.drawNotes(t,g,i,l):t.length>1e-6&&(m=this.drawRest(t,g,l)),a){s+=m;let e=this.estimatedNoteWidth*this.config.noteSpacingFactor;t.beatEnd?e*=1:t.length<.0625?e*=.05:t.length<.125?e*=.1:t.length<.25?e*=.2:t.length<.5?e*=.4:t.length<1&&(e*=.5),s+=e}else s=Math.max(d,m);if(this.jianpuModel.isLastMeasureAtQ(t.start+t.length)){const t=e+s,i=2*this.config.noteHeight,h=0,l=(0,r.drawSVGPath)(this.musicG,o.barPath,t,h,1,i/o.PATH_SCALE);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH),a&&(s+=n.LINE_STROKE_WIDTH)}return s}drawNotes(t,e,i,s){let a=e,h=e;const l=.1*this.estimatedNoteWidth,u=`${this.numberFontSize}px`,c=`${this.smallFontSize}px`,{durationLines:d=0,augmentationDots:g=0,augmentationDash:m=!1}=t;return t.notes.forEach(e=>{const S=`${e.start}-${e.pitch}`,f=(0,r.createSVGGroupChild)(s,S);t.isMeasureBeginning()&&f.setAttribute("data-is-measure-start","true");let p=a,T=p;if(0!==e.accidental){const t=o.ACCIDENTAL_TEXT[e.accidental];(0,r.drawSVGText)(f,t,p+l,0,c,"normal","end","text-top",this.config.noteColor)}let E=0;if(m){const t=this.config.noteHeight*n.AUGMENTATION_DASH_FACTOR,e=t/50,i=(0,r.drawSVGPath)(f,o.augmentationDashPath,p,0,e,1);(0,r.setStroke)(i,this.config.noteColor,n.LINE_STROKE_WIDTH),E=t,T=p+E}else{const t=`${e.jianpuNumber}`;E=(0,r.drawSVGText)(f,t,p,0,u,"normal","start","middle",this.config.noteColor).getBBox().width,T=p+E}if(0!==e.octaveDot&&!1===m){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,i=t/(.15*o.PATH_SCALE),s=p+E/2,a=2.8*t,h=this.config.noteHeight*n.OCTAVE_DOT_OFFSET_FACTOR;for(let t=0;t<Math.abs(e.octaveDot);t++){const n=(e.octaveDot>0?-h:.6*h)-t*a*(e.octaveDot>0?1:-1);(0,r.drawSVGPath)(f,o.dotPath,s,n,i,i)}}if(d>0){const t=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR,i=E/o.PATH_SCALE*(n.DURATION_LINE_SCALES.get(d)??1);for(let s=0;s<d;s++){const a=t+s*e,h=(0,r.drawSVGPath)(f,o.underlinePath,p,a,i,1);(0,r.setStroke)(h,this.config.noteColor,n.LINE_STROKE_WIDTH)}}let A=T+l;if(g>0){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,e=t/(.15*o.PATH_SCALE);for(let i=0;i<g;i++)(0,r.drawSVGPath)(f,o.dotPath,A,0,e,e),A+=t+l;T=A+l}const I=T;if(e.tiedTo&&!m)i.set(e,{g:f,xNoteRight:I,yNoteBaseline:0});else if(e.tiedFrom){let t=e.tiedFrom;for(;t.tiedFrom;)t=t.tiedFrom;const s=i.get(t);if(s){const n=1*s.xNoteRight,a=(m?p-2.2*this.estimatedNoteWidth:p-l)-n,h=1.2*-this.config.noteHeight,u=a/o.PATH_SCALE*1.3,c=this.config.noteHeight/o.PATH_SCALE*1.6;a>1&&(0,r.drawSVGPath)(s.g,o.tiePath,n-(s.g.getCTM()?.e??0),h,u,c);let d=t;for(;d&&d!==e;){i.delete(d);const t=d.tiedTo;t&&(d=t)}}else console.warn("Missing linked SVG details for first tied note:",t)}h=Math.max(h,T)}),h-e}drawRest(t,e,i){const s=`${this.numberFontSize}px`,a=.1*this.estimatedNoteWidth,{durationLines:h=0,augmentationDots:l=0}=t;let u=e,c=u;const d=(0,r.drawSVGText)(i,"0",u,0,s,"normal","start","middle",this.config.noteColor).getBBox().width;if(c=u+d,h>0){const t=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR,s=d/o.PATH_SCALE*(n.DURATION_LINE_SCALES.get(h)??1);for(let a=0;a<h;a++){const h=t+a*e,l=(0,r.drawSVGPath)(i,o.underlinePath,u,h,s,1);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH)}}let g=c+a;if(l>0){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,e=t/(.15*o.PATH_SCALE);for(let s=0;s<l;s++)(0,r.drawSVGPath)(i,o.dotPath,g,0,e,e),g+=t+a;c=g+a}return c-e}drawSignatures(t,e,i,s){let n=e;const o=.3*this.estimatedNoteWidth,a=`${this.smallFontSize}px`,h=`${this.numberFontSize}px`;if(i){const e=`1=${l.PITCH_CLASS_NAMES[this.currentKey%12]??"C"}`;n+=(0,r.drawSVGText)(t,e,n,0,h,"normal","start","middle",this.config.noteColor).getBBox().width+2*o}if(s){const e=`${this.currentTimeSignature.numerator}/${this.currentTimeSignature.denominator}`;n+=(0,r.drawSVGText)(t,e,n,0,a,"normal","start","middle",this.config.noteColor).getBBox().width+o}const u=n-e;try{const e=t.getBBox(),i=e.y,s=e.y+e.height,n=Math.max(this.yBaseline+s,this.yBaseline-i)+.5*this.config.noteHeight;this.height=Math.max(this.height,n)}catch(t){}return t===this.overlayG&&this.config.pixelsPerTimeStep>0&&(this.signaturesBlinking=!0,(0,r.setBlinkAnimation)(this.overlayG,!0)),u}updateCurrentKey(t){const e=this.jianpuModel.measuresInfo.keySignatureAtQ(t,!0);return-1!==e&&e!==this.currentKey&&(this.currentKey=e,!0)}updateCurrentTimeSignature(t){const e=this.jianpuModel.measuresInfo.timeSignatureAtQ(t,!0);return!(!e||e.numerator===this.currentTimeSignature.numerator&&e.denominator===this.currentTimeSignature.denominator)&&(this.currentTimeSignature=e,!0)}handleScrollEvent=t=>{this.lastKnownScrollLeft=this.parentElement.scrollLeft,this.isScrolling||window.requestAnimationFrame(()=>{this.updateOverlaySignaturesForScroll(this.lastKnownScrollLeft),this.isScrolling=!1}),this.isScrolling=!0};scrollIntoViewIfNeeded(t){const e=this.parentElement.getBoundingClientRect().width,i=this.parentElement.scrollLeft;let n=i;if(this.config.scrollType===s.PAGE){const s=20;t<i+s?n=t-s:t>i+e-s&&(n=t-e+s)}else{n=t-.5*e}n=Math.max(0,Math.min(n,this.parentElement.scrollWidth-e)),Math.abs(n-i)>1&&(this.parentElement.scrollTo({left:n,behavior:"smooth"}),this.updateOverlaySignaturesForScroll(n))}updateOverlaySignaturesForScroll(t){const e=this.pixelsToTime(t),i=this.jianpuModel.measuresInfo.keySignatureAtQ(e),s=this.jianpuModel.measuresInfo.timeSignatureAtQ(e)??this.currentTimeSignature;let n=!1;if(i!==this.currentKey&&(this.currentKey=i,n=!0),s.numerator===this.currentTimeSignature.numerator&&s.denominator===this.currentTimeSignature.denominator||(this.currentTimeSignature=s,n=!0),n){for(;this.overlayG.lastChild;)this.overlayG.removeChild(this.overlayG.lastChild);this.drawSignatures(this.overlayG,0,!0,!0),t<10&&this.config.pixelsPerTimeStep>0?((0,r.setBlinkAnimation)(this.overlayG,!0),this.signaturesBlinking=!0):this.config.pixelsPerTimeStep>0&&((0,r.setBlinkAnimation)(this.overlayG,!1),this.signaturesBlinking=!1)}}pixelsToTime(t){return this.config.pixelsPerTimeStep<=0?0:this.jianpuModel.measuresInfo.timeToQuarters(t/this.config.pixelsPerTimeStep,0)}}},775(t,e,i){i.d(e,{MeasuresInfo:()=>r});var s=i(830),n=i(559);class r{measuresInfo;allowDottedRests=!0;constructor(t,e){if(this.measuresInfo=[],!(e>0))return;const i=r.getSortedChanges(t.tempos,s.DEFAULT_TEMPO),n=r.getSortedChanges(t.keySignatures,s.DEFAULT_KEY_SIGNATURE),o=r.getSortedChanges(t.timeSignatures,s.DEFAULT_TIME_SIGNATURE);let a=0,h=0,l=0,u=i[0].event,c=n[0].event,d=o[0].event,g=1,m=(0,s.getMeasureLength)(d),S=d.start;const f=[0];i.forEach(t=>f.push(t.start)),n.forEach(t=>f.push(t.start)),o.forEach(t=>f.push(t.start)),f.sort((t,e)=>t-e);let p=-1;for(let t=0;t<f.length;t++){const r=f[t];if(r>=e)break;if(r===p)continue;p=r;let T=!1,E=!1,A=!1;for(;a<i.length&&i[a].start<=r;)u=i[a++].event,T=!0;for(;h<n.length&&n[h].start<=r;)c=n[h++].event,E=!0;for(;l<o.length&&o[l].start<=r;){g+=(o[l].event.start-S)/m,g=Math.round(1e3*g)/1e3,d=o[l++].event,m=(0,s.getMeasureLength)(d),S=r,A=!0}const I={start:r,measureNumber:g+(r-S)/m,measureLength:m,tempo:u,keySignature:c,timeSignature:d};T&&(I.tempoChange=!0),E&&(I.keyChange=!0),A&&(I.timeChange=!0),this.measuresInfo.push(I)}}static getSortedChanges(t,e){const i=t&&t.length?t.slice():[e];return i.sort((t,e)=>t.start-e.start),i.map(t=>({start:Math.max(0,Math.round(t.start/n.MIN_RESOLUTION)*n.MIN_RESOLUTION),event:t}))}findIndex(t){let e=0,i=this.measuresInfo.length-1,s=0;for(;e<=i;){const n=Math.floor((e+i)/2);this.measuresInfo[n].start<=t?(s=n,e=n+1):i=n-1}return s}measureNumberAtQ(t){if(0===this.measuresInfo.length)return 1;const e=this.findIndex(t),i=this.measuresInfo[e],s=(t-i.start)/i.measureLength;return i.measureNumber+s+1e-9}measureLengthAtQ(t){if(0===this.measuresInfo.length)return(0,s.getMeasureLength)(s.DEFAULT_TIME_SIGNATURE);const e=this.findIndex(t);return this.measuresInfo[e].measureLength}tempoAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TEMPO.qpm;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.tempoChange&&o?r.tempo.qpm:-1}keySignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_KEY_SIGNATURE.key;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.keyChange&&o?r.keySignature.key:-1}timeSignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TIME_SIGNATURE;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.timeChange&&o?r.timeSignature:null}quartersToTime(t,e){const i=this.tempoAtQ(e);return i<=0?0:t/i*60}timeToQuarters(t,e){const i=this.tempoAtQ(e);if(i<=0)return 0;const s=t*i/60;return Math.round(s*n.MAX_QUARTER_DIVISION)/n.MAX_QUARTER_DIVISION}isBeatStart(t){if(0===this.measuresInfo.length)return!1;const e=this.findIndex(t),i=this.measuresInfo[e],s=i.timeSignature,r=(t-(i.start-(i.measureNumber-Math.floor(i.measureNumber))*i.measureLength))/(4/s.denominator);return Math.abs(r-Math.round(r))<n.MIN_RESOLUTION/2}}},559(t,e,i){i.d(e,["MAJOR_SCALE_INTERVALS",0,{0:1,2:2,4:3,5:4,7:5,9:6,11:7},"MAX_QUARTER_DIVISION",0,240,"MIDDLE_C_MIDI",0,60,"MIN_RESOLUTION",0,.0625,"PITCH_CLASS_NAMES",0,["C","C#","D","D#","E","F","F#","G","G#","A","A#","B"]])},240(t,e,i){const s=new Map([[1,1.78],[2,1.6],[3,1.3],[4,1.15]]);i.d(e,["AUGMENTATION_DASH_FACTOR",0,.8,"COMPACT_SPACING_FACTOR",0,1.5,"DOT_SIZE_FACTOR",0,.1,"DURATION_LINE_SCALES",0,s,"FONT_SIZE_MULTIPLIER",0,1.2,"LINE_STROKE_WIDTH",0,1,"OCTAVE_DOT_OFFSET_FACTOR",0,1,"SMALL_FONT_SIZE_MULTIPLIER",0,.75,"UNDERLINE_SPACING_FACTOR",0,.2])},961(t,e,i){i.d(e,["ACCIDENTAL_TEXT",0,["","#","b"],"PATH_SCALE",0,100,"augmentationDashPath",0,"m 0,0 h 50","barPath",0,"m 0,-50 v 100","dotPath",0,"M 0 0 a 15 15 0 1 0 0.0001 0 z","tiePath",0,"M -13,5 C 15,-15 65,-15 90,5 C 65,-25 15,-25 -13,5 Z","underlinePath",0,"m 0,0 h 100"])},134(t,e,i){i.d(e,{createSVGGroupChild:()=>o,drawSVGPath:()=>n,drawSVGText:()=>r,highlightElement:()=>l,resetElementHighlight:()=>u,setBlinkAnimation:()=>a,setStroke:()=>h});const s="http://www.w3.org/2000/svg";function n(t,e,i,n,r,o,a=1){const h=document.createElementNS(s,"path");return h.setAttributeNS(null,"d",e),h.setAttributeNS(null,"transform",`translate(${i}, ${n}) scale(${r}, ${o})`),a<1&&h.setAttributeNS(null,"opacity",`${a}`),t.appendChild(h),h}function r(t,e,i,n,r,o="normal",a="middle",h="middle",l="currentColor",u=1){const c=document.createElementNS(s,"text");c.setAttributeNS(null,"font-family","sans-serif"),c.setAttributeNS(null,"font-size",r),c.setAttributeNS(null,"font-weight",o),c.setAttributeNS(null,"x",`${i}`),c.setAttributeNS(null,"y",`${n}`),c.setAttributeNS(null,"text-anchor",a),c.setAttributeNS(null,"dominant-baseline",h),"currentColor"!==l&&c.setAttributeNS(null,"fill",l),u<1&&c.setAttributeNS(null,"opacity",`${u}`);const d=document.createTextNode(e);return c.appendChild(d),t.appendChild(c),c}function o(t,e){const i=document.createElementNS(s,"g");return e&&i.setAttribute("data-id",e),t.appendChild(i),i}function a(t,e=!0,i="1s"){let n=t.querySelector('animate[attributeName="opacity"]');return e?n?(n.setAttributeNS(null,"repeatCount","indefinite"),n.beginElement()):(n=document.createElementNS(s,"animate"),n.setAttributeNS(null,"attributeName","opacity"),n.setAttributeNS(null,"values","1;0.2;1"),n.setAttributeNS(null,"keyTimes","0;0.5;1"),n.setAttributeNS(null,"dur",i),n.setAttributeNS(null,"repeatCount","indefinite"),t.appendChild(n)):(n&&(n.endElement(),n.setAttributeNS(null,"repeatCount","0"),t.style.opacity="1"),t.style.opacity="1"),t}function h(t,e,i){t.setAttributeNS(null,"stroke",e),t.setAttributeNS(null,"stroke-width",`${i}`)}function l(t,e){const i=[];return t.matches("text, path")&&i.push(t),t.querySelectorAll("text, path").forEach(t=>{i.push(t)}),i.forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e)}),t}function u(t,e){t.querySelectorAll("text, path").forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e)})}i.d(e,["SVGNS",0,s])}};const e={};function i(s){const n=e[s];if(void 0!==n)return n.exports;const r=e[s]={exports:{}};return t[s](r,r.exports,i),r.exports}i.d=(t,e)=>{if(Array.isArray(e))for(var s=0;s<e.length;){var n=e[s++],r=e[s++],o=0===r?{enumerable:!0,value:e[s++]}:{enumerable:!0,get:r};i.o(t,n)||Object.defineProperty(t,n,o)}else for(var n in e)i.o(e,n)&&!i.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},i.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),i.r=t=>{Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};let s={};i.r(s);var n=i(644);return window.jr=n,s})());
|
|
1
|
+
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.mm=e():t.mm=e()}(global,()=>(()=>{"use strict";var t={644(t,e,i){i.r(e),i.d(e,{DEFAULT_KEY_SIGNATURE:()=>o.DEFAULT_KEY_SIGNATURE,DEFAULT_TEMPO:()=>o.DEFAULT_TEMPO,DEFAULT_TIME_SIGNATURE:()=>o.DEFAULT_TIME_SIGNATURE,JianpuBlock:()=>r.JianpuBlock,JianpuModel:()=>n.JianpuModel,JianpuSVGRender:()=>s.JianpuSVGRender,ScrollType:()=>s.ScrollType,getMeasureLength:()=>o.getMeasureLength,mapMidiToJianpu:()=>n.mapMidiToJianpu,splitJianpuNote:()=>r.splitJianpuNote});var s=i(313),n=i(849),r=i(765),o=i(830)},765(t,e,i){i.d(e,{JianpuBlock:()=>o,splitJianpuNote:()=>r});var s=i(559);function n(t){return Math.abs(t)<1e-6}function r(t,e){const i=t.start+t.length;if(e<=t.start||e>=i||n(i-e))return null;const s=i-e;t.length=e-t.start;const r={start:e,length:s,pitch:t.pitch,intensity:t.intensity,jianpuNumber:t.jianpuNumber,octaveDot:t.octaveDot,accidental:0,tiedFrom:t};return t.tiedTo&&(r.tiedTo=t.tiedTo,t.tiedTo.tiedFrom=r),t.tiedTo=r,r}class o{start;length;notes;measureNumber;durationLines;augmentationDots;augmentationDash;beatBegin;beatEnd;isTieStart;isTieEnd;constructor(t=0,e=0,i=[],s=1){this.start=t,this.length=e,this.notes=i,this.measureNumber=s}addNote(t){if(0===this.notes.length)return this.start=t.start,this.length=t.length,this.notes.push(t),!0;if(!n(this.start-t.start))return console.warn(`JianpuBlock: Attempted to add note at ${t.start} to block starting at ${this.start}. Ignoring.`),!1;let e=!1,i=!1;for(let s=0;s<this.notes.length;s++)if(this.notes[s].pitch===t.pitch){i=!0,t.length<this.notes[s].length&&(this.notes[s].tiedFrom&&(t.tiedFrom=this.notes[s].tiedFrom,t.tiedFrom&&(t.tiedFrom.tiedTo=t)),this.notes[s].tiedTo&&(t.tiedTo=this.notes[s].tiedTo,t.tiedTo&&(t.tiedTo.tiedFrom=t)),this.notes[s]=t,e=!0);break}i||this.notes.push(t);let s=1/0;for(const t of this.notes)s=Math.min(s,t.length);return this.length=s,!i||e}split(t,e){const i=this.start+this.length;if(t<=this.start||t>=i||n(i-t))return null;const s=i-t,a=t-this.start,h=new o(t,s,[],e.measureNumberAtQ(t)),l=[];for(const e of this.notes){const i=e.start+e.length;if(i>t+1e-6){const i=r(e,t);i?l.push(i):console.warn("Split failed for note, unexpected state.")}else n(i-t)}return l.forEach(t=>h.addNote(t)),this.length=a,delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash,this.beatEnd&&(h.beatEnd=!0,delete this.beatEnd),this.isTieEnd&&(h.isTieStart=!0,delete this.isTieEnd),h}splitToBeat(t){const e=t.timeSignatureAtQ(this.start);if(!e)return null;const i=t.measureLengthAtQ(this.start),s=t.measureNumberAtQ(this.start),r=this.start-(s-Math.floor(s))*i,o=this.start-r,a=4/e.denominator,h=o/a;this.beatBegin=n(h-Math.round(h));const l=r+(Math.floor(h+1e-6)+1)*a,u=r+i,c=this.start+this.length;let d=null;l<c-1e-6&&l>this.start+1e-6&&(d=l),u<c-1e-6&&u>this.start+1e-6&&(null===d||u<d)&&(d=u);let g=null;if(null!==d)g=this.split(d,t),g&&(this.beatEnd=!0);else{const t=(o+this.length)/a;this.beatEnd=n(t-Math.round(t)),this.beatEnd||(this.beatEnd=n(c-u))}return this.isTieStart=this.notes.some(t=>t.tiedFrom),this.isTieEnd=this.notes.some(t=>t.tiedTo),g&&(g.isTieStart=g.notes.some(t=>t.tiedFrom),g.isTieEnd=g.notes.some(t=>t.tiedTo),this.notes.some(t=>t.tiedTo&&t.start+t.length>d)&&delete this.isTieEnd),g}calculateRenderProperties(t){delete this.durationLines,delete this.augmentationDots,delete this.augmentationDash;const e=this.length;if(n(e)||e<0)return;if(t.allowDottedRests||this.notes.length>0){if(n(e-1.5))return void(this.augmentationDots=1);if(n(e-.75))return this.durationLines=1,void(this.augmentationDots=1);if(n(e-.375))return this.durationLines=2,void(this.augmentationDots=1);n(e-3)&&(this.augmentationDots=1)}if(this.durationLines=e>=3.999999||e>=1.999999||e>=.999999?0:e>=.499999?1:e>=.249999?2:e>=.124999?3:4,this.augmentationDash=!1,1===this.notes.length){const e=this.notes[0],i=t.timeSignatureAtQ(this.start);if(!i)return;const s=Math.max(4/i.denominator,1);if(!(this.measureNumber%1<=1e-6)&&e.tiedFrom&&n(e.tiedFrom.length-s)&&e.tiedFrom.pitch===e.pitch&&e.length>=1){let i=!0;if(e.tiedTo){const s=e.start+e.length;i=Math.floor(t.measureNumberAtQ(this.start))===Math.floor(t.measureNumberAtQ(s))&&e.tiedTo.length>=1}i&&(this.augmentationDash=!0)}}}splitToStandardSymbol(t){const e=this.length;if(n(e)||e<s.MIN_RESOLUTION-1e-6)return null;const i=[];t.allowDottedRests||this.notes.length>0?(i.push(6),i.push(4),i.push(3),i.push(2),i.push(1.5),i.push(1),i.push(.75),i.push(.5),i.push(.375),i.push(.25),i.push(.125),i.push(.0625)):(i.push(4),i.push(2),i.push(1),i.push(.5),i.push(.25),i.push(.125),i.push(.0625));let r=0;for(const t of i)if(e>=t-1e-6){r=t;break}n(r)&&(r=s.MIN_RESOLUTION,e<r-1e-6&&e>1e-6&&console.warn(`Block length ${e} is too small, rendering as ${r}`));let o=null;return e>r+1e-6?(o=this.split(this.start+r,t),this.length!==r&&(console.warn(`Adjusting block length after split from ${this.length} to ${r}`),this.length=r)):this.length=r,o}mergeToMap(t){const e=t.get(this.start);e?(this.notes.forEach(t=>e.addNote(t)),0!==this.measureNumber&&(e.measureNumber=this.measureNumber)):t.set(this.start,this)}isMeasureBeginning(){return n(this.measureNumber-Math.floor(this.measureNumber))}}},830(t,e,i){i.d(e,{getMeasureLength:()=>s});function s(t){return t.numerator*(4/t.denominator)}i.d(e,["DEFAULT_KEY_SIGNATURE",0,{start:0,key:0},"DEFAULT_TEMPO",0,{start:0,qpm:60},"DEFAULT_TIME_SIGNATURE",0,{start:0,numerator:4,denominator:4}])},849(t,e,i){i.d(e,{JianpuModel:()=>a,mapMidiToJianpu:()=>h});var s=i(830),n=i(775),r=i(765),o=i(559);class a{jianpuInfo;measuresInfo;jianpuBlockMap;lastQ;constructor(t,e){this.jianpuInfo=t,this.jianpuBlockMap=new Map,this.lastQ=0,this.update(t,e)}isLastMeasureAtQ(t){return t>=this.lastQ-1e-6}getTotalDuration(){return this.lastQ}update(t,e){this.jianpuInfo=t,t.notes.sort((t,e)=>t.start-e.start),this.lastQ=0,t.notes.forEach(t=>{this.lastQ=Math.max(this.lastQ,t.start+t.length)}),this.lastQ+=1e-6,t.tempos=t.tempos&&t.tempos.length?t.tempos:[s.DEFAULT_TEMPO],t.tempos.sort((t,e)=>t.start-e.start),t.tempos[0].start>1e-6&&t.tempos.unshift({...s.DEFAULT_TEMPO,start:0});const i=void 0!==e?{start:0,key:e}:{...s.DEFAULT_KEY_SIGNATURE};t.keySignatures=t.keySignatures&&t.keySignatures.length?t.keySignatures:[i],t.keySignatures.sort((t,e)=>t.start-e.start),t.keySignatures[0].start>1e-6&&t.keySignatures.unshift({...i,start:0}),t.timeSignatures=t.timeSignatures&&t.timeSignatures.length?t.timeSignatures:[s.DEFAULT_TIME_SIGNATURE],t.timeSignatures.sort((t,e)=>t.start-e.start),t.timeSignatures[0].start>1e-6&&t.timeSignatures.unshift({...s.DEFAULT_TIME_SIGNATURE,start:0}),this.measuresInfo=new n.MeasuresInfo(t,this.lastQ),this.infoToBlocks()}infoToBlocks(){const t=new Map;let e=0;if(this.jianpuInfo.notes.forEach(i=>{const s=i.start,n=this.measuresInfo.measureNumberAtQ(s);if(s>e+1e-6){const i=e,n=s-i,o=this.measuresInfo.measureNumberAtQ(i),a=new r.JianpuBlock(i,n,[],o);t.set(i,a)}const o=this.measuresInfo.keySignatureAtQ(s),a=this.createJianpuNote(i,o);let h=t.get(s);h||(h=new r.JianpuBlock(s,0,[],n),t.set(s,h)),h.addNote(a),e=Math.max(e,s+h.length)}),this.lastQ>e+1e-6){const i=e,s=this.lastQ-1e-6-i;if(s>1e-6){const e=this.measuresInfo.measureNumberAtQ(i),n=new r.JianpuBlock(i,s,[],e);t.set(i,n)}}this.jianpuBlockMap=new Map;const i=Array.from(t.keys()).sort((t,e)=>t-e);let s=[];i.forEach(e=>{s.push(t.get(e))});const n=new Set;for(;s.length>0;){let t=s.shift();n.has(t.start)&&this.jianpuBlockMap.has(t.start);let e=t.splitToBeat(this.measuresInfo);if(e){t.mergeToMap(this.jianpuBlockMap),n.add(t.start),s.unshift(e);continue}let i=t,r=null;do{r=i.splitToStandardSymbol(this.measuresInfo),i.mergeToMap(this.jianpuBlockMap),n.add(i.start),r&&(i=r)}while(r)}this.jianpuBlockMap.forEach(t=>{t.calculateRenderProperties(this.measuresInfo)})}createJianpuNote(t,e){const i=h(t.pitch,e);return{...t,jianpuNumber:i.jianpuNumber,octaveDot:i.octaveDot,accidental:i.accidental}}}function h(t,e){const i=e%12;let s=o.MIDDLE_C_MIDI+i;i>o.MIDDLE_C_MIDI%12&&(s-=12);const n=(t-(s+12*Math.round((t-s)/12))+12)%12;let r=o.MAJOR_SCALE_INTERVALS[n],a=0;if(void 0===r){switch(n){case 1:r=o.MAJOR_SCALE_INTERVALS[0],a=1;break;case 3:r=o.MAJOR_SCALE_INTERVALS[4],a=2;break;case 6:r=o.MAJOR_SCALE_INTERVALS[5],a=1;break;case 8:r=o.MAJOR_SCALE_INTERVALS[9],a=2;break;case 10:r=o.MAJOR_SCALE_INTERVALS[11],a=2;break;default:{console.warn(`Unexpected chromatic interval ${n} in mapMidiToJianpu. Defaulting to sharp of lower valid degree.`);const i=(n-1+12)%12,s=(n+1+12)%12,h=o.MAJOR_SCALE_INTERVALS[i],l=o.MAJOR_SCALE_INTERVALS[s];void 0!==h?(r=h,a=1):void 0!==l?(r=l,a=2):(r=1,a=1,console.error(`Could not determine Jianpu number components for MIDI ${t}, interval ${n} from tonic in key ${e}.`));break}}void 0===r&&(console.error(`Jianpu number became undefined for MIDI ${t} (interval ${n}, key ${e}) after chromatic processing. This indicates a logic error or misconfigured MAJOR_SCALE_INTERVALS.`),r=1,a=1)}return{jianpuNumber:r,octaveDot:Math.floor((t-s)/12),accidental:a}}},313(t,e,i){i.d(e,{JianpuSVGRender:()=>u,ScrollType:()=>s});var s,n=i(240),r=i(134),o=i(961),a=i(830),h=i(849),l=i(559);!function(t){t[t.PAGE=0]="PAGE",t[t.NOTE=1]="NOTE",t[t.BAR=2]="BAR"}(s||(s={}));class u{jianpuInfo;jianpuModel;config;height;width;parentElement;div;mainSVG;mainG;musicG;signaturesG;overlaySVG;overlayG;signaturesBlinking;lastKnownScrollLeft;isScrolling;currentKey;currentTimeSignature;playingNotes;lastRenderedQ;estimatedNoteWidth;numberFontSize;smallFontSize;yBaseline;parseColorString(t){return/^[a-z]+$/i.test(t)||t.startsWith("rgb(")?t:/^\d+,\s*\d+,\s*\d+$/.test(t)?`rgb(${t})`:t}constructor(t,e,i){this.jianpuInfo=t,this.div=i;this.config={noteHeight:e.noteHeight??20,noteSpacingFactor:e.noteSpacingFactor??n.COMPACT_SPACING_FACTOR,pixelsPerTimeStep:e.pixelsPerTimeStep??0,noteColor:this.parseColorString(e.noteColor??"black"),activeNoteColor:this.parseColorString(e.activeNoteColor??"red"),defaultKey:e.defaultKey??0,scrollType:e.scrollType??s.PAGE,fontFamily:e.fontFamily??"sans-serif",width:e.width??0,height:e.height??0},this.jianpuModel=new h.JianpuModel(this.jianpuInfo,this.config.defaultKey),this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??a.DEFAULT_TIME_SIGNATURE,this.playingNotes=new Map,this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.numberFontSize=this.config.noteHeight*n.FONT_SIZE_MULTIPLIER,this.smallFontSize=this.config.noteHeight*n.SMALL_FONT_SIZE_MULTIPLIER,this.estimatedNoteWidth=.6*this.numberFontSize,this.yBaseline=1.5*this.config.noteHeight,this.height=0,this.width=0,this.clear(),this.redraw()}clear(){for(;this.div.lastChild;)this.div.removeChild(this.div.lastChild);this.div.style.position="relative",this.div.style.overflow="hidden",this.overlaySVG=document.createElementNS(r.SVGNS,"svg"),this.overlaySVG.style.position="absolute",this.overlaySVG.style.left="0",this.overlaySVG.style.top="0",this.overlaySVG.style.pointerEvents="none",this.div.appendChild(this.overlaySVG),this.overlayG=(0,r.createSVGGroupChild)(this.overlaySVG,"overlay"),this.parentElement=document.createElement("div"),this.parentElement.style.overflowX="auto",this.parentElement.style.overflowY="hidden",this.parentElement.style.width="100%",this.parentElement.style.height="100%",this.div.appendChild(this.parentElement),this.parentElement.addEventListener("scroll",this.handleScrollEvent),this.mainSVG=document.createElementNS(r.SVGNS,"svg"),this.mainSVG.style.display="block",this.parentElement.appendChild(this.mainSVG),this.mainG=(0,r.createSVGGroupChild)(this.mainSVG,"main-content"),this.signaturesG=(0,r.createSVGGroupChild)(this.mainG,"signatures"),this.musicG=(0,r.createSVGGroupChild)(this.mainG,"music"),this.playingNotes.clear(),this.lastRenderedQ=-1,this.signaturesBlinking=!1,this.lastKnownScrollLeft=0,this.isScrolling=!1,this.height=this.config.height>0?this.config.height:5*this.config.noteHeight,this.width=this.config.width>0?this.config.width:0,this.currentKey=this.jianpuModel.measuresInfo.keySignatureAtQ(0),this.currentTimeSignature=this.jianpuModel.measuresInfo.timeSignatureAtQ(0)??a.DEFAULT_TIME_SIGNATURE,this.drawSignatures(this.overlayG,0,!0,!0),this.updateLayout()}updateLayout(t){this.width=t??this.width,this.config.width>0&&(this.width=this.config.width),this.height=Math.max(this.height,6*this.config.noteHeight),this.config.height>0&&(this.height=this.config.height);const e=1.65*this.config.noteHeight;this.mainSVG.setAttribute("width",`${this.width}`),this.mainSVG.setAttribute("height",`${this.height}`),this.mainG.setAttribute("transform",`translate(0, ${this.yBaseline+e})`),this.overlaySVG.setAttribute("width","200"),this.overlaySVG.setAttribute("height",`${this.height}`),this.overlayG.setAttribute("transform",`translate(0, ${this.yBaseline})`)}redraw(t,e){let i=-1;const n=this.config.pixelsPerTimeStep<=0;if(t){const o=`${t.start}-${t.pitch}`;if(this.playingNotes.forEach((t,e)=>{if(e!==o){const t=this.mainSVG.querySelector(`g[data-id="${e}"]`);t&&(0,r.resetElementHighlight)(t,this.config.noteColor),this.playingNotes.delete(e)}}),!this.playingNotes.has(o)){const n=this.mainSVG.querySelector(`g[data-id="${o}"]`);if(n){(0,r.highlightElement)(n,this.config.activeNoteColor),this.playingNotes.set(o,t);const a=n.getBoundingClientRect(),h=this.mainSVG.getBoundingClientRect();i=a.left-h.left+this.parentElement.scrollLeft;const l=n.hasAttribute("data-is-measure-start");e&&(this.config.scrollType!==s.BAR||l)&&this.scrollIntoViewIfNeeded(i)}}if(!n&&this.signaturesBlinking){const e=this.overlayG.getBoundingClientRect().width;this.jianpuModel.measuresInfo.quartersToTime(t.start,t.start)*this.config.pixelsPerTimeStep>e&&(this.signaturesBlinking=!1,(0,r.setBlinkAnimation)(this.overlayG,!1))}}else{this.jianpuModel.update(this.jianpuInfo,this.config.defaultKey);let t=this.width,e=this.width,i=this.height>0?this.height-this.yBaseline:3*this.config.noteHeight,s=0;const r=new Map;this.jianpuModel.jianpuBlockMap.forEach((o,a)=>{if(a>=this.lastRenderedQ-1e-9){t=n?e:this.jianpuModel.measuresInfo.quartersToTime(a,a)*this.config.pixelsPerTimeStep;const h=this.drawJianpuBlock(o,t,r);n?e+=h:e=Math.max(e,t+h);const l=this.mainSVG.querySelector(`g[data-block-start="${o.start}"]`);if(l)try{const t=l.getBBox(),e=t.y,n=t.y+t.height;s=Math.min(s,e),i=Math.max(i,n)}catch(t){}this.lastRenderedQ=a+o.length}}),this.height=Math.max(this.height,i-s+this.config.noteHeight),this.updateLayout(e)}return i}drawJianpuBlock(t,e,i){let s=0;const a=this.config.pixelsPerTimeStep<=0,h=t.isMeasureBeginning(),l=(0,r.createSVGGroupChild)(this.musicG,`block-${t.start}`);if(l.setAttribute("data-block-start",`${t.start}`),h&&t.start>1e-6){const t=e-(a?.6*this.estimatedNoteWidth:4),i=2*this.config.noteHeight,h=0,l=(0,r.drawSVGPath)(this.musicG,o.barPath,t,h,1,i/o.PATH_SCALE);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH),a&&(s+=n.LINE_STROKE_WIDTH)}const u=this.updateCurrentKey(t.start),c=this.updateCurrentTimeSignature(t.start);let d=0;if((u||c)&&t.start>1e-6){const t=e+s;d=this.drawSignatures(this.signaturesG,t,u,c),a&&(s+=d+.2*this.estimatedNoteWidth)}const g=e+s;let m=0;if(t.notes.length>0?m=this.drawNotes(t,g,i,l):t.length>1e-6&&(m=this.drawRest(t,g,l)),a){s+=m;let e=this.estimatedNoteWidth*this.config.noteSpacingFactor;t.beatEnd?e*=1:t.length<.0625?e*=.05:t.length<.125?e*=.1:t.length<.25?e*=.2:t.length<.5?e*=.4:t.length<1&&(e*=.5),s+=e}else s=Math.max(d,m);if(this.jianpuModel.isLastMeasureAtQ(t.start+t.length)){const t=e+s,i=2*this.config.noteHeight,h=0,l=(0,r.drawSVGPath)(this.musicG,o.barPath,t,h,1,i/o.PATH_SCALE);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH),a&&(s+=n.LINE_STROKE_WIDTH)}return s}drawNotes(t,e,i,s){let a=e,h=e;const l=.1*this.estimatedNoteWidth,u=`${this.numberFontSize}px`,c=`${this.smallFontSize}px`,{durationLines:d=0,augmentationDots:g=0,augmentationDash:m=!1}=t;return t.notes.forEach(e=>{const f=`${e.start}-${e.pitch}`,S=(0,r.createSVGGroupChild)(s,f);t.isMeasureBeginning()&&S.setAttribute("data-is-measure-start","true");let p=a,T=p;if(0!==e.accidental){const t=o.ACCIDENTAL_TEXT[e.accidental];(0,r.drawSVGText)(S,t,p+l,0,c,"normal","end","text-top",this.config.noteColor,1,this.config.fontFamily)}let A=0;if(m){const t=this.config.noteHeight*n.AUGMENTATION_DASH_FACTOR,e=t/50,i=(0,r.drawSVGPath)(S,o.augmentationDashPath,p,0,e,1);(0,r.setStroke)(i,this.config.noteColor,n.LINE_STROKE_WIDTH),A=t,T=p+A}else{const t=`${e.jianpuNumber}`;A=(0,r.drawSVGText)(S,t,p,0,u,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width,T=p+A}if(0!==e.octaveDot&&!1===m){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,i=t/(.15*o.PATH_SCALE),s=p+A/2,a=2.8*t,h=this.config.noteHeight*n.OCTAVE_DOT_OFFSET_FACTOR;for(let t=0;t<Math.abs(e.octaveDot);t++){const n=(e.octaveDot>0?-h:.6*h)-t*a*(e.octaveDot>0?1:-1);(0,r.drawSVGPath)(S,o.dotPath,s,n,i,i)}}if(d>0){const t=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR,i=A/o.PATH_SCALE*(n.DURATION_LINE_SCALES.get(d)??1);for(let s=0;s<d;s++){const a=t+s*e,h=(0,r.drawSVGPath)(S,o.underlinePath,p,a,i,1);(0,r.setStroke)(h,this.config.noteColor,n.LINE_STROKE_WIDTH)}}let E=T+l;if(g>0){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,e=t/(.15*o.PATH_SCALE);for(let i=0;i<g;i++)(0,r.drawSVGPath)(S,o.dotPath,E,0,e,e),E+=t+l;T=E+l}const I=T;if(e.tiedTo&&!m)i.set(e,{g:S,xNoteRight:I,yNoteBaseline:0});else if(e.tiedFrom){let t=e.tiedFrom;for(;t.tiedFrom;)t=t.tiedFrom;const s=i.get(t);if(s){const n=1*s.xNoteRight,a=(m?p-2.2*this.estimatedNoteWidth:p-l)-n,h=1.2*-this.config.noteHeight,u=a/o.PATH_SCALE*1.3,c=this.config.noteHeight/o.PATH_SCALE*1.6;a>1&&(0,r.drawSVGPath)(s.g,o.tiePath,n-(s.g.getCTM()?.e??0),h,u,c);let d=t;for(;d&&d!==e;){i.delete(d);const t=d.tiedTo;t&&(d=t)}}else console.warn("Missing linked SVG details for first tied note:",t)}h=Math.max(h,T)}),h-e}drawRest(t,e,i){const s=`${this.numberFontSize}px`,a=.1*this.estimatedNoteWidth,{durationLines:h=0,augmentationDots:l=0}=t;let u=e,c=u;const d=(0,r.drawSVGText)(i,"0",u,0,s,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width;if(c=u+d,h>0){const t=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR*2.5,e=this.config.noteHeight*n.UNDERLINE_SPACING_FACTOR,s=d/o.PATH_SCALE*(n.DURATION_LINE_SCALES.get(h)??1);for(let a=0;a<h;a++){const h=t+a*e,l=(0,r.drawSVGPath)(i,o.underlinePath,u,h,s,1);(0,r.setStroke)(l,this.config.noteColor,n.LINE_STROKE_WIDTH)}}let g=c+a;if(l>0){const t=this.config.noteHeight*n.DOT_SIZE_FACTOR,e=t/(.15*o.PATH_SCALE);for(let s=0;s<l;s++)(0,r.drawSVGPath)(i,o.dotPath,g,0,e,e),g+=t+a;c=g+a}return c-e}drawSignatures(t,e,i,s){let n=e;const o=.3*this.estimatedNoteWidth,a=`${this.smallFontSize}px`,h=`${this.numberFontSize}px`;if(i){const e=`1=${l.PITCH_CLASS_NAMES[this.currentKey%12]??"C"}`;n+=(0,r.drawSVGText)(t,e,n,0,h,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width+2*o}if(s){const e=`${this.currentTimeSignature.numerator}/${this.currentTimeSignature.denominator}`;n+=(0,r.drawSVGText)(t,e,n,0,a,"normal","start","middle",this.config.noteColor,1,this.config.fontFamily).getBBox().width+o}const u=n-e;try{const e=t.getBBox(),i=e.y,s=e.y+e.height,n=Math.max(this.yBaseline+s,this.yBaseline-i)+.5*this.config.noteHeight;this.height=Math.max(this.height,n)}catch(t){}return t===this.overlayG&&this.config.pixelsPerTimeStep>0&&(this.signaturesBlinking=!0,(0,r.setBlinkAnimation)(this.overlayG,!0)),u}updateCurrentKey(t){const e=this.jianpuModel.measuresInfo.keySignatureAtQ(t,!0);return-1!==e&&e!==this.currentKey&&(this.currentKey=e,!0)}updateCurrentTimeSignature(t){const e=this.jianpuModel.measuresInfo.timeSignatureAtQ(t,!0);return!(!e||e.numerator===this.currentTimeSignature.numerator&&e.denominator===this.currentTimeSignature.denominator)&&(this.currentTimeSignature=e,!0)}handleScrollEvent=t=>{this.lastKnownScrollLeft=this.parentElement.scrollLeft,this.isScrolling||window.requestAnimationFrame(()=>{this.updateOverlaySignaturesForScroll(this.lastKnownScrollLeft),this.isScrolling=!1}),this.isScrolling=!0};scrollIntoViewIfNeeded(t){const e=this.parentElement.getBoundingClientRect().width,i=this.parentElement.scrollLeft;let n=i;if(this.config.scrollType===s.PAGE){const s=20;t<i+s?n=t-s:t>i+e-s&&(n=t-e+s)}else{n=t-.5*e}n=Math.max(0,Math.min(n,this.parentElement.scrollWidth-e)),Math.abs(n-i)>1&&(this.parentElement.scrollTo({left:n,behavior:"smooth"}),this.updateOverlaySignaturesForScroll(n))}updateOverlaySignaturesForScroll(t){const e=this.pixelsToTime(t),i=this.jianpuModel.measuresInfo.keySignatureAtQ(e),s=this.jianpuModel.measuresInfo.timeSignatureAtQ(e)??this.currentTimeSignature;let n=!1;if(i!==this.currentKey&&(this.currentKey=i,n=!0),s.numerator===this.currentTimeSignature.numerator&&s.denominator===this.currentTimeSignature.denominator||(this.currentTimeSignature=s,n=!0),n){for(;this.overlayG.lastChild;)this.overlayG.removeChild(this.overlayG.lastChild);this.drawSignatures(this.overlayG,0,!0,!0),t<10&&this.config.pixelsPerTimeStep>0?((0,r.setBlinkAnimation)(this.overlayG,!0),this.signaturesBlinking=!0):this.config.pixelsPerTimeStep>0&&((0,r.setBlinkAnimation)(this.overlayG,!1),this.signaturesBlinking=!1)}}pixelsToTime(t){return this.config.pixelsPerTimeStep<=0?0:this.jianpuModel.measuresInfo.timeToQuarters(t/this.config.pixelsPerTimeStep,0)}}},775(t,e,i){i.d(e,{MeasuresInfo:()=>r});var s=i(830),n=i(559);class r{measuresInfo;allowDottedRests=!0;constructor(t,e){if(this.measuresInfo=[],!(e>0))return;const i=r.getSortedChanges(t.tempos,s.DEFAULT_TEMPO),n=r.getSortedChanges(t.keySignatures,s.DEFAULT_KEY_SIGNATURE),o=r.getSortedChanges(t.timeSignatures,s.DEFAULT_TIME_SIGNATURE);let a=0,h=0,l=0,u=i[0].event,c=n[0].event,d=o[0].event,g=1,m=(0,s.getMeasureLength)(d),f=d.start;const S=[0];i.forEach(t=>S.push(t.start)),n.forEach(t=>S.push(t.start)),o.forEach(t=>S.push(t.start)),S.sort((t,e)=>t-e);let p=-1;for(let t=0;t<S.length;t++){const r=S[t];if(r>=e)break;if(r===p)continue;p=r;let T=!1,A=!1,E=!1;for(;a<i.length&&i[a].start<=r;)u=i[a++].event,T=!0;for(;h<n.length&&n[h].start<=r;)c=n[h++].event,A=!0;for(;l<o.length&&o[l].start<=r;){g+=(o[l].event.start-f)/m,g=Math.round(1e3*g)/1e3,d=o[l++].event,m=(0,s.getMeasureLength)(d),f=r,E=!0}const I={start:r,measureNumber:g+(r-f)/m,measureLength:m,tempo:u,keySignature:c,timeSignature:d};T&&(I.tempoChange=!0),A&&(I.keyChange=!0),E&&(I.timeChange=!0),this.measuresInfo.push(I)}}static getSortedChanges(t,e){const i=t&&t.length?t.slice():[e];return i.sort((t,e)=>t.start-e.start),i.map(t=>({start:Math.max(0,Math.round(t.start/n.MIN_RESOLUTION)*n.MIN_RESOLUTION),event:t}))}findIndex(t){let e=0,i=this.measuresInfo.length-1,s=0;for(;e<=i;){const n=Math.floor((e+i)/2);this.measuresInfo[n].start<=t?(s=n,e=n+1):i=n-1}return s}measureNumberAtQ(t){if(0===this.measuresInfo.length)return 1;const e=this.findIndex(t),i=this.measuresInfo[e],s=(t-i.start)/i.measureLength;return i.measureNumber+s+1e-9}measureLengthAtQ(t){if(0===this.measuresInfo.length)return(0,s.getMeasureLength)(s.DEFAULT_TIME_SIGNATURE);const e=this.findIndex(t);return this.measuresInfo[e].measureLength}tempoAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TEMPO.qpm;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.tempoChange&&o?r.tempo.qpm:-1}keySignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_KEY_SIGNATURE.key;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.keyChange&&o?r.keySignature.key:-1}timeSignatureAtQ(t,e=!1){if(0===this.measuresInfo.length)return s.DEFAULT_TIME_SIGNATURE;const i=this.findIndex(t),r=this.measuresInfo[i],o=Math.abs(r.start-t)<n.MIN_RESOLUTION/2;return!e||r.timeChange&&o?r.timeSignature:null}quartersToTime(t,e){const i=this.tempoAtQ(e);return i<=0?0:t/i*60}timeToQuarters(t,e){const i=this.tempoAtQ(e);if(i<=0)return 0;const s=t*i/60;return Math.round(s*n.MAX_QUARTER_DIVISION)/n.MAX_QUARTER_DIVISION}isBeatStart(t){if(0===this.measuresInfo.length)return!1;const e=this.findIndex(t),i=this.measuresInfo[e],s=i.timeSignature,r=(t-(i.start-(i.measureNumber-Math.floor(i.measureNumber))*i.measureLength))/(4/s.denominator);return Math.abs(r-Math.round(r))<n.MIN_RESOLUTION/2}}},559(t,e,i){i.d(e,["MAJOR_SCALE_INTERVALS",0,{0:1,2:2,4:3,5:4,7:5,9:6,11:7},"MAX_QUARTER_DIVISION",0,240,"MIDDLE_C_MIDI",0,60,"MIN_RESOLUTION",0,.0625,"PITCH_CLASS_NAMES",0,["C","C#","D","D#","E","F","F#","G","G#","A","A#","B"]])},240(t,e,i){const s=new Map([[1,1.78],[2,1.6],[3,1.3],[4,1.15]]);i.d(e,["AUGMENTATION_DASH_FACTOR",0,.8,"COMPACT_SPACING_FACTOR",0,1.5,"DOT_SIZE_FACTOR",0,.1,"DURATION_LINE_SCALES",0,s,"FONT_SIZE_MULTIPLIER",0,1.2,"LINE_STROKE_WIDTH",0,1,"OCTAVE_DOT_OFFSET_FACTOR",0,1,"SMALL_FONT_SIZE_MULTIPLIER",0,.75,"UNDERLINE_SPACING_FACTOR",0,.2])},961(t,e,i){i.d(e,["ACCIDENTAL_TEXT",0,["","#","b"],"PATH_SCALE",0,100,"augmentationDashPath",0,"m 0,0 h 50","barPath",0,"m 0,-50 v 100","dotPath",0,"M 0 0 a 15 15 0 1 0 0.0001 0 z","tiePath",0,"M -13,5 C 15,-15 65,-15 90,5 C 65,-25 15,-25 -13,5 Z","underlinePath",0,"m 0,0 h 100"])},134(t,e,i){i.d(e,{createSVGGroupChild:()=>o,drawSVGPath:()=>n,drawSVGText:()=>r,highlightElement:()=>l,resetElementHighlight:()=>u,setBlinkAnimation:()=>a,setStroke:()=>h});const s="http://www.w3.org/2000/svg";function n(t,e,i,n,r,o,a=1){const h=document.createElementNS(s,"path");return h.setAttributeNS(null,"d",e),h.setAttributeNS(null,"transform",`translate(${i}, ${n}) scale(${r}, ${o})`),a<1&&h.setAttributeNS(null,"opacity",`${a}`),t.appendChild(h),h}function r(t,e,i,n,r,o="normal",a="middle",h="middle",l="currentColor",u=1,c="sans-serif"){const d=document.createElementNS(s,"text");d.setAttributeNS(null,"font-family",c),d.setAttributeNS(null,"font-size",r),d.setAttributeNS(null,"font-weight",o),d.setAttributeNS(null,"x",`${i}`),d.setAttributeNS(null,"y",`${n}`),d.setAttributeNS(null,"text-anchor",a),d.setAttributeNS(null,"dominant-baseline",h),"currentColor"!==l&&d.setAttributeNS(null,"fill",l),u<1&&d.setAttributeNS(null,"opacity",`${u}`);const g=document.createTextNode(e);return d.appendChild(g),t.appendChild(d),d}function o(t,e){const i=document.createElementNS(s,"g");return e&&i.setAttribute("data-id",e),t.appendChild(i),i}function a(t,e=!0,i="1s"){let n=t.querySelector('animate[attributeName="opacity"]');return e?n?(n.setAttributeNS(null,"repeatCount","indefinite"),n.beginElement()):(n=document.createElementNS(s,"animate"),n.setAttributeNS(null,"attributeName","opacity"),n.setAttributeNS(null,"values","1;0.2;1"),n.setAttributeNS(null,"keyTimes","0;0.5;1"),n.setAttributeNS(null,"dur",i),n.setAttributeNS(null,"repeatCount","indefinite"),t.appendChild(n)):(n&&(n.endElement(),n.setAttributeNS(null,"repeatCount","0"),t.style.opacity="1"),t.style.opacity="1"),t}function h(t,e,i){t.setAttributeNS(null,"stroke",e),t.setAttributeNS(null,"stroke-width",`${i}`)}function l(t,e){const i=[];return t.matches("text, path")&&i.push(t),t.querySelectorAll("text, path").forEach(t=>{i.push(t)}),i.forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e);const i=t.getAttribute("stroke");null!==i&&"none"!==i&&t.setAttribute("stroke",e)}),t}function u(t,e){t.querySelectorAll("text, path").forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e);const i=t.getAttribute("stroke");null!==i&&"none"!==i&&t.setAttribute("stroke",e)})}i.d(e,["SVGNS",0,s])}};const e={};function i(s){const n=e[s];if(void 0!==n)return n.exports;const r=e[s]={exports:{}};return t[s](r,r.exports,i),r.exports}i.d=(t,e)=>{if(Array.isArray(e))for(var s=0;s<e.length;){var n=e[s++],r=e[s++],o=0===r?{enumerable:!0,value:e[s++]}:{enumerable:!0,get:r};i.o(t,n)||Object.defineProperty(t,n,o)}else for(var n in e)i.o(e,n)&&!i.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},i.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),i.r=t=>{Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};let s={};i.r(s);var n=i(644);return window.jr=n,s})());
|
package/node/svg_tools.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export declare const SVGNS = "http://www.w3.org/2000/svg";
|
|
2
2
|
export declare function drawSVGPath(e: SVGElement, path: string, x: number, y: number, scaleX: number, scaleY: number, opacity?: number): SVGPathElement;
|
|
3
|
-
export declare function drawSVGText(e: SVGElement, text: string, x: number, y: number, fontSize: string, fontWeight?: string, textAnchor?: 'start' | 'middle' | 'end', dominantBaseline?: string, fill?: string, opacity?: number): SVGTextElement;
|
|
3
|
+
export declare function drawSVGText(e: SVGElement, text: string, x: number, y: number, fontSize: string, fontWeight?: string, textAnchor?: 'start' | 'middle' | 'end', dominantBaseline?: string, fill?: string, opacity?: number, fontFamily?: string): SVGTextElement;
|
|
4
4
|
export declare function createSVGGroupChild(parent: SVGElement, id?: string): SVGGElement;
|
|
5
5
|
export declare function setBlinkAnimation(e: SVGElement, enable?: boolean, duration?: string): SVGElement;
|
|
6
6
|
export declare function setFill(e: SVGElement, color: string): void;
|
package/node/svg_tools.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.mm=e():t.mm=e()}(global,()=>(()=>{"use strict";const t={d:(e,n)=>{if(Array.isArray(n))for(var
|
|
1
|
+
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.mm=e():t.mm=e()}(global,()=>(()=>{"use strict";const t={d:(e,n)=>{if(Array.isArray(n))for(var r=0;r<n.length;){var l=n[r++],u=n[r++],i=0===u?{enumerable:!0,value:n[r++]}:{enumerable:!0,get:u};t.o(e,l)||Object.defineProperty(e,l,i)}else for(var l in n)t.o(n,l)&&!t.o(e,l)&&Object.defineProperty(e,l,{enumerable:!0,get:n[l]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}};let e={};t.r(e),t.d(e,{createSVGGroupChild:()=>u,drawSVGPath:()=>r,drawSVGText:()=>l,highlightElement:()=>a,resetElementHighlight:()=>c,setBlinkAnimation:()=>i,setFill:()=>o,setStroke:()=>s});const n="http://www.w3.org/2000/svg";function r(t,e,r,l,u,i,o=1){const s=document.createElementNS(n,"path");return s.setAttributeNS(null,"d",e),s.setAttributeNS(null,"transform",`translate(${r}, ${l}) scale(${u}, ${i})`),o<1&&s.setAttributeNS(null,"opacity",`${o}`),t.appendChild(s),s}function l(t,e,r,l,u,i="normal",o="middle",s="middle",a="currentColor",c=1,b="sans-serif"){const d=document.createElementNS(n,"text");d.setAttributeNS(null,"font-family",b),d.setAttributeNS(null,"font-size",u),d.setAttributeNS(null,"font-weight",i),d.setAttributeNS(null,"x",`${r}`),d.setAttributeNS(null,"y",`${l}`),d.setAttributeNS(null,"text-anchor",o),d.setAttributeNS(null,"dominant-baseline",s),"currentColor"!==a&&d.setAttributeNS(null,"fill",a),c<1&&d.setAttributeNS(null,"opacity",`${c}`);const p=document.createTextNode(e);return d.appendChild(p),t.appendChild(d),d}function u(t,e){const r=document.createElementNS(n,"g");return e&&r.setAttribute("data-id",e),t.appendChild(r),r}function i(t,e=!0,r="1s"){let l=t.querySelector('animate[attributeName="opacity"]');return e?l?(l.setAttributeNS(null,"repeatCount","indefinite"),l.beginElement()):(l=document.createElementNS(n,"animate"),l.setAttributeNS(null,"attributeName","opacity"),l.setAttributeNS(null,"values","1;0.2;1"),l.setAttributeNS(null,"keyTimes","0;0.5;1"),l.setAttributeNS(null,"dur",r),l.setAttributeNS(null,"repeatCount","indefinite"),t.appendChild(l)):(l&&(l.endElement(),l.setAttributeNS(null,"repeatCount","0"),t.style.opacity="1"),t.style.opacity="1"),t}function o(t,e){t.setAttributeNS(null,"fill",e)}function s(t,e,n){t.setAttributeNS(null,"stroke",e),t.setAttributeNS(null,"stroke-width",`${n}`)}function a(t,e){const n=[];return t.matches("text, path")&&n.push(t),t.querySelectorAll("text, path").forEach(t=>{n.push(t)}),n.forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e);const n=t.getAttribute("stroke");null!==n&&"none"!==n&&t.setAttribute("stroke",e)}),t}function c(t,e){t.querySelectorAll("text, path").forEach(t=>{"none"!==t.getAttribute("fill")&&t.setAttribute("fill",e);const n=t.getAttribute("stroke");null!==n&&"none"!==n&&t.setAttribute("stroke",e)})}return t.d(e,["SVGNS",0,n]),e})());
|