vexflow
Version:
A JavaScript library for rendering music notation and guitar tablature
878 lines (606 loc) • 30.5 kB
HTML
<html>
<head>
<title>parser.js</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" media="all" href="public/stylesheets/normalize.css" />
<link rel="stylesheet" media="all" href="docco.css" />
</head>
<body>
<div class="container">
<div class="page">
<div class="header">
<h1>parser.js</h1>
<div class="toc">
<h3>Table of Contents</h3>
<ol>
<li>
<a class="source" href="accidental.html">
accidental.js
</a>
</li>
<li>
<a class="source" href="annotation.html">
annotation.js
</a>
</li>
<li>
<a class="source" href="articulation.html">
articulation.js
</a>
</li>
<li>
<a class="source" href="barnote.html">
barnote.js
</a>
</li>
<li>
<a class="source" href="beam.html">
beam.js
</a>
</li>
<li>
<a class="source" href="bend.html">
bend.js
</a>
</li>
<li>
<a class="source" href="boundingbox.html">
boundingbox.js
</a>
</li>
<li>
<a class="source" href="boundingboxcomputation.html">
boundingboxcomputation.js
</a>
</li>
<li>
<a class="source" href="canvascontext.html">
canvascontext.js
</a>
</li>
<li>
<a class="source" href="clef.html">
clef.js
</a>
</li>
<li>
<a class="source" href="clefnote.html">
clefnote.js
</a>
</li>
<li>
<a class="source" href="crescendo.html">
crescendo.js
</a>
</li>
<li>
<a class="source" href="curve.html">
curve.js
</a>
</li>
<li>
<a class="source" href="dot.html">
dot.js
</a>
</li>
<li>
<a class="source" href="easyscore.html">
easyscore.js
</a>
</li>
<li>
<a class="source" href="element.html">
element.js
</a>
</li>
<li>
<a class="source" href="factory.html">
factory.js
</a>
</li>
<li>
<a class="source" href="formatter.html">
formatter.js
</a>
</li>
<li>
<a class="source" href="fraction.html">
fraction.js
</a>
</li>
<li>
<a class="source" href="frethandfinger.html">
frethandfinger.js
</a>
</li>
<li>
<a class="source" href="ghostnote.html">
ghostnote.js
</a>
</li>
<li>
<a class="source" href="glyph.html">
glyph.js
</a>
</li>
<li>
<a class="source" href="glyphnote.html">
glyphnote.js
</a>
</li>
<li>
<a class="source" href="gracenote.html">
gracenote.js
</a>
</li>
<li>
<a class="source" href="gracenotegroup.html">
gracenotegroup.js
</a>
</li>
<li>
<a class="source" href="gracetabnote.html">
gracetabnote.js
</a>
</li>
<li>
<a class="source" href="index.html">
index.js
</a>
</li>
<li>
<a class="source" href="keymanager.html">
keymanager.js
</a>
</li>
<li>
<a class="source" href="keysignature.html">
keysignature.js
</a>
</li>
<li>
<a class="source" href="keysignote.html">
keysignote.js
</a>
</li>
<li>
<a class="source" href="modifier.html">
modifier.js
</a>
</li>
<li>
<a class="source" href="modifiercontext.html">
modifiercontext.js
</a>
</li>
<li>
<a class="source" href="multimeasurerest.html">
multimeasurerest.js
</a>
</li>
<li>
<a class="source" href="music.html">
music.js
</a>
</li>
<li>
<a class="source" href="note.html">
note.js
</a>
</li>
<li>
<a class="source" href="notehead.html">
notehead.js
</a>
</li>
<li>
<a class="source" href="notesubgroup.html">
notesubgroup.js
</a>
</li>
<li>
<a class="source" href="ornament.html">
ornament.js
</a>
</li>
<li>
<a class="source" href="parser.html">
parser.js
</a>
</li>
<li>
<a class="source" href="pedalmarking.html">
pedalmarking.js
</a>
</li>
<li>
<a class="source" href="raphaelcontext.html">
raphaelcontext.js
</a>
</li>
<li>
<a class="source" href="registry.html">
registry.js
</a>
</li>
<li>
<a class="source" href="renderer.html">
renderer.js
</a>
</li>
<li>
<a class="source" href="repeatnote.html">
repeatnote.js
</a>
</li>
<li>
<a class="source" href="smufl.html">
smufl.js
</a>
</li>
<li>
<a class="source" href="stave.html">
stave.js
</a>
</li>
<li>
<a class="source" href="stavebarline.html">
stavebarline.js
</a>
</li>
<li>
<a class="source" href="staveconnector.html">
staveconnector.js
</a>
</li>
<li>
<a class="source" href="stavehairpin.html">
stavehairpin.js
</a>
</li>
<li>
<a class="source" href="staveline.html">
staveline.js
</a>
</li>
<li>
<a class="source" href="stavemodifier.html">
stavemodifier.js
</a>
</li>
<li>
<a class="source" href="stavenote.html">
stavenote.js
</a>
</li>
<li>
<a class="source" href="staverepetition.html">
staverepetition.js
</a>
</li>
<li>
<a class="source" href="stavesection.html">
stavesection.js
</a>
</li>
<li>
<a class="source" href="stavetempo.html">
stavetempo.js
</a>
</li>
<li>
<a class="source" href="stavetext.html">
stavetext.js
</a>
</li>
<li>
<a class="source" href="stavetie.html">
stavetie.js
</a>
</li>
<li>
<a class="source" href="stavevolta.html">
stavevolta.js
</a>
</li>
<li>
<a class="source" href="stem.html">
stem.js
</a>
</li>
<li>
<a class="source" href="stemmablenote.html">
stemmablenote.js
</a>
</li>
<li>
<a class="source" href="stringnumber.html">
stringnumber.js
</a>
</li>
<li>
<a class="source" href="strokes.html">
strokes.js
</a>
</li>
<li>
<a class="source" href="svgcontext.html">
svgcontext.js
</a>
</li>
<li>
<a class="source" href="system.html">
system.js
</a>
</li>
<li>
<a class="source" href="tables.html">
tables.js
</a>
</li>
<li>
<a class="source" href="tabnote.html">
tabnote.js
</a>
</li>
<li>
<a class="source" href="tabslide.html">
tabslide.js
</a>
</li>
<li>
<a class="source" href="tabstave.html">
tabstave.js
</a>
</li>
<li>
<a class="source" href="tabtie.html">
tabtie.js
</a>
</li>
<li>
<a class="source" href="textbracket.html">
textbracket.js
</a>
</li>
<li>
<a class="source" href="textdynamics.html">
textdynamics.js
</a>
</li>
<li>
<a class="source" href="textnote.html">
textnote.js
</a>
</li>
<li>
<a class="source" href="tickable.html">
tickable.js
</a>
</li>
<li>
<a class="source" href="tickcontext.html">
tickcontext.js
</a>
</li>
<li>
<a class="source" href="timesignature.html">
timesignature.js
</a>
</li>
<li>
<a class="source" href="timesignote.html">
timesignote.js
</a>
</li>
<li>
<a class="source" href="tremolo.html">
tremolo.js
</a>
</li>
<li>
<a class="source" href="tuning.html">
tuning.js
</a>
</li>
<li>
<a class="source" href="tuplet.html">
tuplet.js
</a>
</li>
<li>
<a class="source" href="vex.html">
vex.js
</a>
</li>
<li>
<a class="source" href="vibrato.html">
vibrato.js
</a>
</li>
<li>
<a class="source" href="vibratobracket.html">
vibratobracket.js
</a>
</li>
<li>
<a class="source" href="voice.html">
voice.js
</a>
</li>
<li>
<a class="source" href="voicegroup.html">
voicegroup.js
</a>
</li>
</ol>
</div>
</div>
<p><a href="http://vexflow.com">VexFlow</a> - Copyright (c) Mohit Muthanna 2010.</p>
<p>A generic text parsing class for VexFlow.</p>
<div class='highlight'><pre>
<span class="hljs-keyword">import</span> { Vex } <span class="hljs-keyword">from</span> <span class="hljs-string">'./vex'</span>;</pre></div>
<p>To enable logging for this class. Set <code>Vex.Flow.Parser.DEBUG</code> to <code>true</code>.</p>
<div class='highlight'><pre><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">L</span>(<span class="hljs-params">...args</span>) </span>{ <span class="hljs-keyword">if</span> (Parser.DEBUG) Vex.L(<span class="hljs-string">'Vex.Flow.Parser'</span>, args); }
<span class="hljs-keyword">export</span> <span class="hljs-keyword">const</span> X = Vex.MakeException(<span class="hljs-string">'ParserError'</span>);</pre></div>
<p>Converts parser results into an easy to reference list that can be
used in triggers.</p>
<div class='highlight'><pre><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">flattenMatches</span>(<span class="hljs-params">results</span>) </span>{
<span class="hljs-keyword">if</span> (results.matchedString !== <span class="hljs-literal">undefined</span>) <span class="hljs-keyword">return</span> results.matchedString;
<span class="hljs-keyword">if</span> (results.results) <span class="hljs-keyword">return</span> flattenMatches(results.results);
<span class="hljs-keyword">if</span> (results.length === <span class="hljs-number">1</span>) <span class="hljs-keyword">return</span> flattenMatches(results[<span class="hljs-number">0</span>]);
<span class="hljs-keyword">if</span> (results.length === <span class="hljs-number">0</span>) <span class="hljs-keyword">return</span> <span class="hljs-literal">null</span>;
<span class="hljs-keyword">return</span> results.map(flattenMatches);
}</pre></div>
<p>This is the base parser class. Given an arbitrary context-free grammar, it
can parse any line and execute code when specific rules are met (e.g.,
when a string is terminated.)</p>
<div class='highlight'><pre><span class="hljs-keyword">export</span> <span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">Parser</span> </span>{</pre></div>
<p>For an example of a simple grammar, take a look at tests/parser_tests.js or
the EasyScore grammar in easyscore.js.</p>
<div class='highlight'><pre> <span class="hljs-keyword">constructor</span>(grammar) {
<span class="hljs-keyword">this</span>.grammar = grammar;
}</pre></div>
<p>Parse <code>line</code> using current grammar. Returns {success: true} if the
line parsed correctly, otherwise returns <code>{success: false, errorPos: N}</code>
where <code>errorPos</code> is the location of the error in the string.</p>
<div class='highlight'><pre> parse(line) {
<span class="hljs-keyword">this</span>.line = line;
<span class="hljs-keyword">this</span>.pos = <span class="hljs-number">0</span>;
<span class="hljs-keyword">this</span>.errorPos = <span class="hljs-number">-1</span>;
<span class="hljs-keyword">const</span> results = <span class="hljs-keyword">this</span>.expect(<span class="hljs-keyword">this</span>.grammar.begin());
results.errorPos = <span class="hljs-keyword">this</span>.errorPos;
<span class="hljs-keyword">return</span> results;
}
matchFail(returnPos) {
<span class="hljs-keyword">if</span> (<span class="hljs-keyword">this</span>.errorPos === <span class="hljs-number">-1</span>) <span class="hljs-keyword">this</span>.errorPos = <span class="hljs-keyword">this</span>.pos;
<span class="hljs-keyword">this</span>.pos = returnPos;
}
matchSuccess() {
<span class="hljs-keyword">this</span>.errorPos = <span class="hljs-number">-1</span>;
}</pre></div>
<p>Look for <code>token</code> in this.line[this.pos], and return success
if one is found. <code>token</code> is specified as a regular expression.</p>
<div class='highlight'><pre> matchToken(token, noSpace = <span class="hljs-literal">false</span>) {
<span class="hljs-keyword">const</span> regexp = noSpace
? <span class="hljs-keyword">new</span> <span class="hljs-built_in">RegExp</span>(<span class="hljs-string">'^(('</span> + token + <span class="hljs-string">'))'</span>)
: <span class="hljs-keyword">new</span> <span class="hljs-built_in">RegExp</span>(<span class="hljs-string">'^(('</span> + token + <span class="hljs-string">')\\s*)'</span>);
<span class="hljs-keyword">const</span> workingLine = <span class="hljs-keyword">this</span>.line.slice(<span class="hljs-keyword">this</span>.pos);
<span class="hljs-keyword">const</span> result = workingLine.match(regexp);
<span class="hljs-keyword">if</span> (result !== <span class="hljs-literal">null</span>) {
<span class="hljs-keyword">return</span> {
<span class="hljs-attr">success</span>: <span class="hljs-literal">true</span>,
<span class="hljs-attr">matchedString</span>: result[<span class="hljs-number">2</span>],
<span class="hljs-attr">incrementPos</span>: result[<span class="hljs-number">1</span>].length,
<span class="hljs-attr">pos</span>: <span class="hljs-keyword">this</span>.pos,
};
} <span class="hljs-keyword">else</span> {
<span class="hljs-keyword">return</span> {
<span class="hljs-attr">success</span>: <span class="hljs-literal">false</span>,
<span class="hljs-attr">pos</span>: <span class="hljs-keyword">this</span>.pos,
};
}
}</pre></div>
<p>Execute rule to match a sequence of tokens (or rules). If <code>maybe</code> is
set, then return success even if the token is not found, but reset
the position before exiting.</p>
<div class='highlight'><pre> expectOne(rule, maybe = <span class="hljs-literal">false</span>) {
<span class="hljs-keyword">const</span> results = [];
<span class="hljs-keyword">const</span> pos = <span class="hljs-keyword">this</span>.pos;
<span class="hljs-keyword">let</span> allMatches = <span class="hljs-literal">true</span>;
<span class="hljs-keyword">let</span> oneMatch = <span class="hljs-literal">false</span>;
maybe = (maybe === <span class="hljs-literal">true</span>) || (rule.maybe === <span class="hljs-literal">true</span>);</pre></div>
<p>Execute all sub rules in sequence.</p>
<div class='highlight'><pre> <span class="hljs-keyword">for</span> (<span class="hljs-keyword">let</span> i = <span class="hljs-number">0</span>; i < rule.expect.length; i++) {
<span class="hljs-keyword">const</span> next = rule.expect[i];
<span class="hljs-keyword">const</span> localPos = <span class="hljs-keyword">this</span>.pos;
<span class="hljs-keyword">const</span> result = <span class="hljs-keyword">this</span>.expect(next);</pre></div>
<p>If <code>rule.or</code> is set, then return success if any one
of the subrules match, else all subrules must match.</p>
<div class='highlight'><pre> <span class="hljs-keyword">if</span> (result.success) {
results.push(result);
oneMatch = <span class="hljs-literal">true</span>;
<span class="hljs-keyword">if</span> (rule.or) <span class="hljs-keyword">break</span>;
} <span class="hljs-keyword">else</span> {
allMatches = <span class="hljs-literal">false</span>;
<span class="hljs-keyword">if</span> (!rule.or) {
<span class="hljs-keyword">this</span>.pos = localPos;
<span class="hljs-keyword">break</span>;
}
}
}
<span class="hljs-keyword">const</span> gotOne = (rule.or && oneMatch) || allMatches;
<span class="hljs-keyword">const</span> success = gotOne || (maybe === <span class="hljs-literal">true</span>);
<span class="hljs-keyword">if</span> (maybe && !gotOne) <span class="hljs-keyword">this</span>.pos = pos;
<span class="hljs-keyword">if</span> (success) <span class="hljs-keyword">this</span>.matchSuccess(); <span class="hljs-keyword">else</span> <span class="hljs-keyword">this</span>.matchFail(pos);
<span class="hljs-keyword">return</span> { success, results, <span class="hljs-attr">numMatches</span>: gotOne ? <span class="hljs-number">1</span> : <span class="hljs-number">0</span> };
}</pre></div>
<p>Try to match multiple (one or more) instances of the rule. If <code>maybe</code> is set,
then a failed match is also a success (but the position is reset).</p>
<div class='highlight'><pre> expectOneOrMore(rule, maybe = <span class="hljs-literal">false</span>) {
<span class="hljs-keyword">const</span> results = [];
<span class="hljs-keyword">const</span> pos = <span class="hljs-keyword">this</span>.pos;
<span class="hljs-keyword">let</span> numMatches = <span class="hljs-number">0</span>;
<span class="hljs-keyword">let</span> more = <span class="hljs-literal">true</span>;
<span class="hljs-keyword">do</span> {
<span class="hljs-keyword">const</span> result = <span class="hljs-keyword">this</span>.expectOne(rule);
<span class="hljs-keyword">if</span> (result.success) {
numMatches++;
results.push(result.results);
} <span class="hljs-keyword">else</span> {
more = <span class="hljs-literal">false</span>;
}
} <span class="hljs-keyword">while</span> (more);
<span class="hljs-keyword">const</span> success = (numMatches > <span class="hljs-number">0</span>) || (maybe === <span class="hljs-literal">true</span>);
<span class="hljs-keyword">if</span> (maybe && !(numMatches > <span class="hljs-number">0</span>)) <span class="hljs-keyword">this</span>.pos = pos;
<span class="hljs-keyword">if</span> (success) <span class="hljs-keyword">this</span>.matchSuccess(); <span class="hljs-keyword">else</span> <span class="hljs-keyword">this</span>.matchFail(pos);
<span class="hljs-keyword">return</span> { success, results, numMatches };
}</pre></div>
<p>Match zero or more instances of <code>rule</code>. Offloads to <code>expectOneOrMore</code>.</p>
<div class='highlight'><pre> expectZeroOrMore(rule) {
<span class="hljs-keyword">return</span> <span class="hljs-keyword">this</span>.expectOneOrMore(rule, <span class="hljs-literal">true</span>);
}</pre></div>
<p>Execute the rule produced by the provided the <code>rules</code> function. This
ofloads to one of the above matchers and consolidates the results. It is also
responsible for executing any code triggered by the rule (in <code>rule.run</code>.)</p>
<div class='highlight'><pre> expect(rules) {
L(<span class="hljs-string">'Evaluating rules:'</span>, rules);
<span class="hljs-keyword">let</span> result;
<span class="hljs-keyword">if</span> (!rules) {
<span class="hljs-keyword">throw</span> <span class="hljs-keyword">new</span> X(<span class="hljs-string">'Invalid Rule: '</span> + rules, rules);
}</pre></div>
<p>Get rule from Grammar class.</p>
<div class='highlight'><pre> <span class="hljs-keyword">const</span> rule = rules.bind(<span class="hljs-keyword">this</span>.grammar)();
<span class="hljs-keyword">if</span> (rule.token) {</pre></div>
<p>Base case: parse the regex and throw an error if the
line doesn’t match.</p>
<div class='highlight'><pre> result = <span class="hljs-keyword">this</span>.matchToken(rule.token, (rule.noSpace === <span class="hljs-literal">true</span>));
<span class="hljs-keyword">if</span> (result.success) {</pre></div>
<p>Token match! Update position and throw away parsed portion
of string.</p>
<div class='highlight'><pre> <span class="hljs-keyword">this</span>.pos += result.incrementPos;
}
} <span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span> (rule.expect) {
<span class="hljs-keyword">if</span> (rule.oneOrMore) {
result = <span class="hljs-keyword">this</span>.expectOneOrMore(rule);
} <span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span> (rule.zeroOrMore) {
result = <span class="hljs-keyword">this</span>.expectZeroOrMore(rule);
} <span class="hljs-keyword">else</span> {
result = <span class="hljs-keyword">this</span>.expectOne(rule);
}
} <span class="hljs-keyword">else</span> {
<span class="hljs-keyword">throw</span> <span class="hljs-keyword">new</span> X(<span class="hljs-string">'Bad grammar! No `token` or `expect` property'</span>, rule);
}</pre></div>
<p>If there’s a trigger attached to this rule, then pull it.</p>
<div class='highlight'><pre> result.matches = [];
<span class="hljs-keyword">if</span> (result.results) result.results.forEach(<span class="hljs-function"><span class="hljs-params">r</span> =></span> result.matches.push(flattenMatches(r)));
<span class="hljs-keyword">if</span> (rule.run && result.success) rule.run(result);
<span class="hljs-keyword">return</span> result;
}
}</pre></div>
<div class="fleur">h</div>
</div>
</div>
</body>
</html>