{"id":444,"date":"2013-12-12T11:25:55","date_gmt":"2013-12-12T20:25:55","guid":{"rendered":"\/blog\/?p=444"},"modified":"2023-09-21T09:38:48","modified_gmt":"2023-09-21T00:38:48","slug":"%ea%b8%b0%ed%83%80-%ec%bd%94%eb%93%9c-%ed%8a%b8%eb%a0%88%ec%9d%b4%eb%84%88","status":"publish","type":"post","link":"https:\/\/hasu0707.duckdns.org\/blog\/?p=444","title":{"rendered":"\uae30\ud0c0 \ucf54\ub4dc \ud2b8\ub808\uc774\ub108"},"content":{"rendered":"\n
<!DOCTYPE html>\n<html>\n<head>\n<meta content=\"text\/html; charset=utf-8\u2033 http-equiv=\"Content-Type\" \/>\n<meta name=\"viewport\" content=\"initial-scale=1.0, maximum-scale=3.0, user-scalable=no, width=device-width\" \/>\n<title>Guitar Chord Trainer<\/title>\n<style type=\"text\/css\">\n.style_chord {\n border: thin dotted #0000FF;\n margin: 5px;\n font-family: Verdana, Geneva, Tahoma, sans-serif;\n font-size: 42px;\n color: #FF0000;\n font-weight: bold;\n font-style: normal;\n font-variant: normal;\n z-index: inherit;\n}\n.style_finger {\n font-family: \"Courier New\", Courier, monospace;\n font-weight: bold;\n font-size: 30px;\n color: #0066FF;\n}\n.style_remaining {\n font-family: \"Courier New\", Courier, monospace;\n font-size:18pt;\n font-weight: bold;\n color: #6600FF;\n text-align: left;\n}\n.style1 {\n font-family: Arial, Helvetica, sans-serif;\n font-size: 12px;\n text-align: left;\n}\n.style2 {\n font-family: Tahoma, Geneva, sans-serif;\n font-size: 12px;\n text-align: left;\n}\n.style3 {\n font-family: Tahoma, Geneva, sans-serif;\n font-size: 20px;\n text-align: left;\n}\na {\n  font-family: Arial, Helvetica, sans-serif;\n  font-size: 12px;\n  color: #000;\n}\n.auto-style1 {\n border-style: solid;\n border-width: 1px;\n}\n.auto-style2 {\n font-family: Arial, Helvetica, sans-serif;\n font-size: 12px;\n text-align: center;\n width: 50px;\n}\n.auto-style3 {\n text-align: left;\n}\n<\/style>\n<\/head>\n<script language=\"javascript\">\n<!\u2013\nvar sec_view_finger = 0;  \/\/ \uc6b4\uc9c0\uac00 \ubcf4\uc5ec\uc9c0\ub294 \uc2dc\uac04(\ucd08), 0\uc774\uba74 \ubb34\uc870\uac74 \ubcf4\uc784\nvar sec_next_chord =  5;  \/\/ \uc804\uccb4 \ud558\ub098\uc758 \ucf54\ub4dc\uac00 \ubcf4\uc5ec\uc9c0\ub294 \uc2dc\uac04(\ucd08)\n\nvar json_chords =\n{\n  \"chords\": [\n    {\"chord\":\"C\",  \"check\":\"0\u2033, \"finger\":\"12 24 35\u2033},\n    {\"chord\":\"Cm\", \"check\":\"0\u2033, \"finger\":\"15 22 (33 34)\"},\n    {\"chord\":\"C7\u2033, \"check\":\"0\u2033, \"finger\":\"12 24 (35 33)\"},\n    {\"chord\":\"D\",  \"check\":\"0\u2033, \"finger\":\"- (23 21) 32\u2033},\n    {\"chord\":\"Dm\", \"check\":\"0\u2033, \"finger\":\"11 23 32\u2033},\n    {\"chord\":\"D7\u2033, \"check\":\"0\u2033, \"finger\":\"12 (21 23)\"},\n    {\"chord\":\"E\",  \"check\":\"0\u2033, \"finger\":\"13 (25 24)\"},\n    {\"chord\":\"Em\", \"check\":\"0\u2033, \"finger\":\"- (25 24)\"},\n    {\"chord\":\"E7\u2033, \"check\":\"0\u2033, \"finger\":\"13 25\u2033},\n    {\"chord\":\"F\",  \"check\":\"0\u2033, \"finger\":\"16 23 (35 34)\"},\n    {\"chord\":\"Fm\", \"check\":\"0\u2033, \"finger\":\"16 (35 34)\"},\n    {\"chord\":\"F7\u2033, \"check\":\"0\u2033, \"finger\":\"16 23 35\u2033},\n    {\"chord\":\"G\",  \"check\":\"0\u2033, \"finger\":\"- 25 (36 31)\"},\n    {\"chord\":\"Gm\", \"check\":\"0\u2033, \"finger\":\"- \u2013 36 \u2013 (54 55)\"},\n    {\"chord\":\"G7\u2033, \"check\":\"0\u2033, \"finger\":\"11 25 36\u2033},\n    {\"chord\":\"A\",  \"check\":\"0\u2033, \"finger\":\"(24 23 22)\"},\n    {\"chord\":\"Am\", \"check\":\"0\u2033, \"finger\":\"12 (24 23)\"},\n    {\"chord\":\"A7\u2033, \"check\":\"0\u2033, \"finger\":\"- 24 22\u2033},\n    {\"chord\":\"B\",  \"check\":\"0\u2033, \"finger\":\"- 25 \u2013 (44 43 42)\"},\n    {\"chord\":\"Bm\", \"check\":\"0\u2033, \"finger\":\"- 25 35 (44 43)\"},\n    {\"chord\":\"B7\u2033, \"check\":\"0\u2033, \"finger\":\"14 (25 23 21)\"},\n  ]\n};\n\nvar array_chord = new Array(100);\nvar array_finger = new Array(100);\nvar array_count = 0;\nvar timer = sec_next_chord;\nvar wait_next = false;;\nvar chord_no = Math.floor(Math.random() * json_chords.chords.length);\n\nfunction set_array()\n{\n  var count = 0;\n\n  for (ii=0; ii<json_chords.chords.length; ii++)\n  {\n    if (document.form_chord.elements[ii+1].checked)\n    {\n      array_chord[count] = json_chords.chords[ii].chord;\n      array_finger[count] = json_chords.chords[ii].finger;\n      count++;\n    }\n  }\n\n  array_count = count;\n\n  sec_view_finger = document.form_time.sec_view_finger.value;\n  sec_next_chord = document.form_time.sec_next_chord.value;\n}\n\nfunction set_chord_no()\n{\n  var nn;\n\n  set_array();\n  do\n  {\n    if (array_count <= 2)\n    {\n      nn = Math.floor(Math.random() * (array_count));\n      break;\n    }\n    nn = Math.floor(Math.random() * (array_count));\n    wait_next = true;\n  } while(nn == chord_no);\n\n  wait_next = false;\n  chord_no = nn;\n\n}\n\nfunction reset()\n{\n  var div_chord = document.getElementById('chord');\n  var div_finger = document.getElementById('finger');\n  var div_remaining_time = document.getElementById('remaining_time');\n\n  div_chord.style.innerHTML = \"\";\n  div_finger.style.innerHTML = \"\";\n  div_remaining_time.style.innerHTML = \"\";\n  sec_view_finger = document.form_time.sec_view_finger.value;\n  sec_next_chord = document.form_time.sec_next_chord.value;\n  set_chord_no();\n  timer = sec_next_chord;\n}\n\nfunction display_timer()\n{\n  var div_chord = document.getElementById('chord');\n  var div_finger = document.getElementById('finger');\n  var div_remaining_time = document.getElementById('remaining_time');\n\n  if (wait_next)\n    return false;\n\n  wait_next = false;\n\n  sec_view_finger = document.form_time.sec_view_finger.value;\n  sec_next_chord = document.form_time.sec_next_chord.value;\n\n  if (timer == 0)\n  {\n    timer = sec_next_chord;\n    if (sec_view_finger != 0)\n      div_finger.style.display = \"none\";\n    set_chord_no();\n  }\n\n  if (sec_view_finger == 0)\n  {\n    div_finger.innerHTML = array_finger[chord_no];\n    div_finger.style.display = \"\";\n  }\n  else\n  {\n    if (timer == sec_view_finger)\n    {\n      div_finger.innerHTML = array_finger[chord_no];\n      div_finger.style.display = \"\";\n    }\n  }\n\n  div_chord.innerHTML = array_chord[chord_no];\n  div_remaining_time.innerHTML = timer;\n\n  timer\u2013;\n}\n\nfunction write_chord_list()\n{\n  for (ii=0; ii<json_chords.chords.length; ii++)\n  {\n    document.write(\"<input type=\\\"checkbox\\\" name=\\\"\"+json_chords.chords[ii].chord+\"\\\" id=\\\"\"+json_chords.chords[ii].chord+\"\\\" onclick=\\\"set_array()\\\"\");\n    if (json_chords.chords[ii].check == 1)\n      document.write(\"checked>\");\n    else\n      document.write(\">\");\n    document.write(\"<label for=\\\"\"+json_chords.chords[ii].chord+\"\\\">\"+json_chords.chords[ii].chord+\"<\/label> \");\n    if (!((ii+1)%3))\n      document.write(\"<br>\\n\");\n  }\n}\n\nfunction check_all()\n{\n  if (document.form_chord.chord_check_all.checked == true)\n  {\n    for (ii=1; ii<json_chords.chords.length+1; ii++)\n      document.form_chord.elements[ii].checked = true;\n  }\n  else\n  {\n    for (ii=1; ii<json_chords.chords.length+1; ii++)\n      document.form_chord.elements[ii].checked = false;\n  }\n  set_array();\n}\n\nfunction main()\n{\n  set_array();\n\n  document.getElementById('sec_view_finger').value = sec_view_finger;\n  document.getElementById('sec_next_chord').value = sec_next_chord;\n\n  window.setInterval(\"display_timer()\", 1000);\n}\n\n\/\/\u2013>\n<\/script>\n<body>\n<table class=\"auto-style1\u2033 style=\"width: 100%\">\n  <tr>\n    <td colspan=\"3\u2033><div id=\"chord\" class=\"style_chord\"> Ready !! <\/div><\/td>\n  <\/tr>\n  <tr>\n    <td colspan=\"3\u2033><div id=\"finger\" class=\"style_finger\"> <\/div><\/td>\n  <\/tr>\n  <tr>\n    <td colspan=\"3\u2033><hr><\/td>\n  <\/tr>\n  <tr>\n    <form name=\"form_time\" method=\"post\" action=\"\">\n      <td class=\"style1\u2033 style=\"width: 50%; \"><label for=\"label_sec_view_finger\">View finger (sec.)<\/label>\n        <script language=\"javascript\">\n        <!\u2013\/\/\n          html_str = \"<input name=\\\"sec_view_finger\\\" type=\\\"text\\\" id=\\\"sec_view_finger\\\" size=\\\"3\\\" value=\\\"\"+sec_view_finger+\"\\\">\";\n          document.write(html_str);\n        \/\/\u2013>\n        <\/script><\/td>\n       <td class=\"style1\u2033 style=\"width: 50%;\"><label for=\"label_sec_next_chord\">Next chord (sec.)<\/label>\n        <script language=\"javascript\">\n        <!\u2013\/\/\n          html_str = \"<input name=\\\"sec_next_chord\\\" type=\\\"text\\\" id=\\\"sec_next_chord\\\" size=\\\"3\\\" value=\\\"\"+sec_next_chord+\"\\\">\";\n          document.write(html_str);\n        \/\/\u2013>\n        <\/script><\/td>\n    <\/form>\n  <\/tr>\n\n  <tr>\n      <td colspan=\"3\u2033 class=\"style1\u2033><hr><\/td>\n  <\/tr>\n\n  <tr>\n      <td colspan=\"3\u2033 class=\"style1\u2033 style=\"height: 92px\">\n      <form name=\"form_chord\" method=\"post\" action=\"\">\n        <p class=\"style3\u2033>\n          <input type=\"checkbox\" name=\"chord_check_all\" onclick=\"check_all()\">\n          <label for=\"ALL\"><strong>ALL<\/strong><\/label>\n          <br>\n          <script language=\"javascript\">\n          <!\u2013\/\/\n            write_chord_list();\n          \/\/\u2013>\n          <\/script>\n        <\/p>\n        <hr>\n      <\/form>\n      <\/td>\n  <\/tr>\n\n  <tr>\n    <td class=\"auto-style2\u2033 style=\"width: 10%\">sec.<\/td>\n    <td class=\"auto-style3\u2033 style=\"width: 10%\"><div id=\"remaining_time\" class=\"style_remaining\"><\/div><\/td>\n    <td class=\"style1\u2033 onclick=\"reset();\"><a href=\"#\">[APPLY]<\/a><\/td>\n  <\/tr>\n<\/table>\n<\/body>\n\n<script language=\"javascript\">\n<!\u2013\/\/\nmain();\n\/\/\u2013>\n<\/script>\n<\/html><\/pre>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_import_markdown_pro_load_document_selector":0,"_import_markdown_pro_submit_text_textarea":"","site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[18],"tags":[],"class_list":["post-444","post","type-post","status-publish","format-standard","hentry","category-development_language"],"_links":{"self":[{"href":"https:\/\/hasu0707.duckdns.org\/blog\/index.php?rest_route=\/wp\/v2\/posts\/444","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hasu0707.duckdns.org\/blog\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/hasu0707.duckdns.org\/blog\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/hasu0707.duckdns.org\/blog\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/hasu0707.duckdns.org\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=444"}],"version-history":[{"count":0,"href":"https:\/\/hasu0707.duckdns.org\/blog\/index.php?rest_route=\/wp\/v2\/posts\/444\/revisions"}],"wp:attachment":[{"href":"https:\/\/hasu0707.duckdns.org\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=444"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/hasu0707.duckdns.org\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=444"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/hasu0707.duckdns.org\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=444"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}