JSPDF: Difference between revisions
No edit summary |
No edit summary |
||
| Line 3: | Line 3: | ||
<head> | <head> | ||
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> | <meta http-equiv="content-type" content="text/html; charset=UTF-8"> | ||
<script src="/w/JavaScript/ | <title>abcjs: Tune Editor demo</title> | ||
<script src="/w/JavaScript/abcjs_editor_midi_3.0-min.js" type="text/javascript"></script> | |||
<script type="text/javascript"> | <script type="text/javascript"> | ||
window.onload = function() { | window.onload = function() { | ||
abc_editor = new | abc_editor = new ABCJS.Editor("abc", { paper_id: "paper0", | ||
midi_id: "midi", | |||
warnings_id: "warnings", | |||
parser_params: {} | |||
}); | |||
window.ABCJS.midi.soundfontUrl = "/w/soundfonts/"; | |||
//window.ABCJS.renderMidi("midi", abc_editor.editarea.getString(), 0), {}, { generateInline: true }, {}); | |||
//new ABCJS.Editor("abc", {generate_midi: true, generate_warnings: false}); | |||
} | } | ||
</script> | </script> | ||
| Line 21: | Line 25: | ||
<p>Type or paste an abc tune in the area below and see it rendered as you type. Also notice that you can click on the drawn notes and | <p>Type or paste an abc tune in the area below and see it rendered as you type. Also notice that you can click on the drawn notes and | ||
see the place in the text where that note is defined.</p> | see the place in the text where that note is defined.</p> | ||
<textarea name=" | <textarea name="ABCSandBox" id="abc" cols="80" rows="15"> | ||
X:0 | X:0 | ||
T: | T: First Score | ||
C: The Traditional Tune Archive | C: The Traditional Tune Archive | ||
M: | M: | ||
| Line 31: | Line 35: | ||
<div class="output"> | <div class="output"> | ||
<a class="pause" href="#" onclick="pauseDrawing(this); return false;" title="Pause/Resume real-time drawing"></a> | |||
<a class="pdf" href="#" onclick="createPdf2('/w/tunes/TEMP.pdf', abc_editor.editarea.getString(), 0); return false;" title="Quick PDF"></a> | |||
<a class="yes_midi" href="#" onclick="pauseMidi(this); return false;" title="Pause/Resume MIDI generation"></a> | |||
<div id="warnings"></div> | <div id="warnings"></div> | ||
<div class="clear_both"><br /></div> | <div class="clear_both"><br /></div> | ||
| Line 38: | Line 45: | ||
<div id="paper3" class="paper"></div> | <div id="paper3" class="paper"></div> | ||
</div> | </div> | ||
<p>Based on abcjs. For more information, see <a href="http://abcjs.net" >the project page</a>. </p> | <p>Based on abcjs. For more information, see <a href="http://abcjs.net" >the project page</a>. </p> | ||
Revision as of 13:52, 19 May 2017
<!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title>abcjs: Tune Editor demo</title> <script src="/w/JavaScript/abcjs_editor_midi_3.0-min.js" type="text/javascript"></script> <script type="text/javascript">
window.onload = function() { abc_editor = new ABCJS.Editor("abc", { paper_id: "paper0", midi_id: "midi", warnings_id: "warnings", parser_params: {} });
window.ABCJS.midi.soundfontUrl = "/w/soundfonts/";
//window.ABCJS.renderMidi("midi", abc_editor.editarea.getString(), 0), {}, { generateInline: true }, {});
//new ABCJS.Editor("abc", {generate_midi: true, generate_warnings: false});
}
</script>
</head> <body> <p>Type or paste an abc tune in the area below and see it rendered as you type. Also notice that you can click on the drawn notes and see the place in the text where that note is defined.</p> <textarea name="ABCSandBox" id="abc" cols="80" rows="15"> X:0 T: First Score C: The Traditional Tune Archive M: K: x </textarea>
<div class="output"> <a class="pause" href="#" onclick="pauseDrawing(this); return false;" title="Pause/Resume real-time drawing"></a> <a class="pdf" href="#" onclick="createPdf2('/w/tunes/TEMP.pdf', abc_editor.editarea.getString(), 0); return false;" title="Quick PDF"></a> <a class="yes_midi" href="#" onclick="pauseMidi(this); return false;" title="Pause/Resume MIDI generation"></a> <div id="warnings"></div> <div class="clear_both"><br /></div> <div id="paper0" class="paper"></div> <div id="paper1" class="paper"></div> <div id="paper2" class="paper"></div> <div id="paper3" class="paper"></div> </div>
<p>Based on abcjs. For more information, see <a href="http://abcjs.net" >the project page</a>. </p>
<p>Author: <a href=" mailto:paul@paulrosen.net ">Paul Rosen</a></p> </body> </html>