satie
Version:
A sheet music renderer for the web
62 lines (61 loc) • 2.57 kB
JavaScript
/**
* This file is part of Satie music engraver <https://github.com/jnetterf/satie>.
* Copyright (C) Joshua Netterfield <joshua.ca> 2015 - present.
*
* Satie is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as
* published by the Free Software Foundation, either version 3 of the
* License, or (at your option) any later version.
*
* Satie is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with Satie. If not, see <http://www.gnu.org/licenses/>.
*/
;
var __extends = (this && this.__extends) || function (d, b) {
for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
var react_1 = require("react");
var private_smufl_1 = require("./private_smufl");
var private_fontManager_1 = require("./private_fontManager");
/**
* Most musical elements are rendered as glyphs. Exceptions include
* slurs, ties, dots in dotted notes, ledger lines, and stave lines.
*/
var Glyph = (function (_super) {
__extends(Glyph, _super);
function Glyph() {
return _super !== null && _super.apply(this, arguments) || this;
}
Glyph.prototype.render = function () {
var px = this.props.x;
var py = this.props.y;
if (this.context.renderTarget === "svg-export") {
var pathData = private_fontManager_1.toPathData("Bravura", private_smufl_1.getGlyphCode(this.props.glyphName), px, py, 40 * (this.props.scale || 1));
return react_1.DOM.path({ d: pathData }, null);
}
var text = react_1.DOM.text({
className: "mn_",
fill: this.props.fill,
fillOpacity: this.props.opacity,
fontSize: 40 * (this.props.scale || 1),
strokeOpacity: this.props.opacity,
transform: this.props.transform,
x: px,
y: py
}, private_smufl_1.getGlyphCode(this.props.glyphName));
return text;
};
return Glyph;
}(react_1.Component));
Glyph.contextTypes = {
renderTarget: react_1.PropTypes.oneOf(["svg-web", "svg-export"])
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = Glyph;