Last active 1481515504

A javascript thing to get ukulele tab charts quickly. https://b303.me/uketabs.html

Revision c6f212645145ea81e6dd6ef886fcc0dece1d78a6

uketabs.html Raw
1<!DOCTYPE html>
2<html>
3 <head>
4 <meta charset="utf-8">
5 <title>UkeTabGenerator</title>
6 </head>
7 <body>
8 <form id="form">
9 <input type="text" id="tabs" style="width:70%" value="E♭|F7|B♭7|G♭" autofocus>
10 <input type="submit">
11 </form>
12 <div id="display"></div>
13 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
14 <script>
15
16function showtabs() {
17 var tabs = $("input#tabs").val().replace(/♭/g, "b");
18 window.location.hash = tabs.replace(/ /g, ",")
19 // If multiple chords, support these separators
20 $.each(" ,|/", function(i,s){
21 if (tabs.indexOf(s) != -1 && tabs.split) tabs = tabs.split(s);
22 });
23 // If only one chord, we need an array
24 if (!$.isArray(tabs)) {
25 tabs = [tabs];
26 }
27 for (var i=0;i<tabs.length;i++) {
28 if (tabs[i].indexOf("#") != -1) {
29 if (!window.sharpalertshown) alert("All sharp chords must be converted to their flat counterpart (D# = Eb)");
30 window.sharpalertshown = true;
31 }
32 else if (tabs[i].indexOf("n") != -1) {
33 $("<br>").appendTo($('#display'));
34 } else {
35 newimg = $("<img class='tabimg'>");
36 newimg.bind("error", function(e){
37 e.target.style.display="none"
38 });
39 newimg.attr("src", "https://ukutabs.com/chords/" + tabs[i] + "%20.png");
40 newimg.appendTo($('#display'));
41 }
42 }
43}
44
45window.onload = function() {
46 if (window.location.hash) {
47 tabs = window.location.hash.substr(1)
48 $("#tabs").val(tabs)
49 $("#form").submit()
50 }
51}
52
53$("#form").bind("submit", function(e){
54 e.preventDefault();
55 $("#display").empty();
56 showtabs()
57});
58
59 </script>
60 </body>
61</html>