diff --git a/LICENSE.txt b/LICENSE.txt
new file mode 100644
index 0000000..f179455
--- /dev/null
+++ b/LICENSE.txt
@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2012-2014 Elias Dorneles
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
diff --git a/boxfrets.js b/boxfrets.js
index 024af0c..d2fd075 100644
--- a/boxfrets.js
+++ b/boxfrets.js
@@ -210,6 +210,23 @@ var set_notes = function(){
}
}
}
+var loadFromUrl = function(url_params){
+ if (is_defined(url_params['diagram_title'])){
+ $('#diagram_title').val(unescape(url_params['diagram_title']));
+ }
+ if (is_defined(url_params['strings'])){
+ if (is_defined(url_params['q']) && url_params['q'] == 'y'){
+ COLOR = "coffee";
+ $('#checkanswer').click(function(){
+ check_answers(url_params['strings']);
+ });
+ $('#colorchooser').hide();
+ $('#checkanswer').show();
+ } else {
+ fill_from_repr(url_params['strings']);
+ }
+ }
+}
jQuery(function() {
$(gen_fret_boxes(19, 6)).insertAfter($('#mainfretboard'));
GUITAR_STRINGS = getFretcloneStrings();
@@ -221,25 +238,7 @@ jQuery(function() {
//var a_minor_penta = [[5, 8], [5, 8], [5, 7], [5, 7], [5, 7], [5, 8]];
// show diagram of an A minor penta scale form
//show_scale(a_minor_penta);
- var url_params = get_url_parameters();
- var loadFromUrl = function(){
- if (is_defined(url_params['diagram_title'])){
- $('#diagram_title').val(unescape(url_params['diagram_title']));
- }
- if (is_defined(url_params['strings'])){
- if (is_defined(url_params['q']) && url_params['q'] == 'y'){
- COLOR = "coffee";
- $('#checkanswer').click(function(){
- check_answers(url_params['strings']);
- });
- $('#colorchooser').hide();
- $('#checkanswer').show();
- } else {
- fill_from_repr(url_params['strings']);
- }
- }
- }
- loadFromUrl();
+ loadFromUrl(get_url_parameters());
update_link();
var message = $('#message');
// update link at every click on a note...
@@ -273,10 +272,10 @@ jQuery(function() {
// set up example links
$('#examples ul li a').click(function(){
- url_params = get_url_parameters($(this).attr('href'));
- clear_fretboard(); update_link();
- loadFromUrl();
+ clear_fretboard();
+ loadFromUrl(get_url_parameters($(this).attr('href')));
+ update_link();
});
- // TODO: generate jTab
- // TODO: show chord in standard notation
+ // TODO: fix quiz behavior (do not show note names in quiz mode), and show message on check answer
+ // TODO: find a way to show enarmonics
});
diff --git a/fretboard.html b/fretboard.html
index 002ee53..ae40233 100644
--- a/fretboard.html
+++ b/fretboard.html
@@ -9,10 +9,10 @@
* { margin:0; padding:0; border-spacing:0; }
body { font-family:sans-serif; font-size:100%; }
table#mainfretboard { position:absolute; top:120px; left:50px; border:1px solid red; }
- table#mainfretboard tr td { border:1px solid black; font-size: 28px; width:46px; height:34px; text-align:center; }
+ table#mainfretboard tr td { border:1px solid black; font-size:28px; width:46px; height:34px; text-align:center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
- table#fretclone { position:absolute; top:100px; left:-5px; border-spacing:8px; }
- table#fretclone tr td { margin: 0 2px; display:inline-block; border:2px solid transparent; background-color:transparent; font-size:18px; font-weight:bold; width:40px;height:24px; text-align:center; z-index:1; border-radius: 5px; }
+ table#fretclone { position:absolute; top:100px; left:0px; border-spacing:8px; }
+ table#fretclone tr td { margin: 0 2px; border:2px solid transparent; background-color:transparent; font-size:18px; font-weight:bold; width:38px; height:27px; text-align:center; z-index:1; border-radius:5px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
table#fretclone tr td:hover { cursor:pointer; border-color: black !important; border-style: dotted !important; }
.orange { background-color:#ffbb67 !important; border-color:#543d22 !important; color:#543d22 !important; }
.green { background-color:#669999 !important; border-color:#003333 !important; color:#003333 !important; }
@@ -22,7 +22,7 @@
.red { background-color:#ea2e49 !important; border-color:#400d14 !important; color:#400d14 !important; }
.blank { background-color:#dddddd !important; border-color:#333333 !important; color:#333333 !important; }
.white { background-color:#ffffff !important; border-color:#111111 !important; color:#111111 !important; }
- .transparent { background-color:transparent !important; border-color:transparent !important; color:transparent !important }
+ .transparent { background-color:transparent !important; border-color:#ddd !important; color:transparent !important }
input.color_button { width:40px; border-radius: 5px; }
div#main { height:280px; margin:10px; width: 940px; }
#diagram_title { font-size:25px; font-weight:bold; margin:15px; display:block; padding:4px; border:0; width:100%; }
@@ -65,8 +65,8 @@
the whole diagram or use an
. Also, you can just click on a painted fret to clear it.
-
-
+
+ Restart |
Link |
Quiz link
Examples: