// chordView 20250127 koyama88(at)cameo.plala.or.jp // // chordview.jsを準備し、以下のようなHTMLファイルを作成する // // // // // // // // // // //
//
//
// // // // CHORDTEXT(曲名や歌詞やコード)の書き方: // 1. 「//」から行末まではコメント // 2. 冒頭1行目がタブ1段の時はタイトル // 3. 更にタブ1段が続けばタイトルの説明 // 4. タブなしの行は「曲名」 // 複数の曲がある場合はまず曲名一覧が表示される([view]表示) // 曲名に続いてタブ区切りでURLを書けば[View]表示でリンクになる(歌詞やコードは別ファイル) // 曲名の[view]をクリックするとその曲のコード譜または歌詞とコードが表示される // 1曲だけの場合は、すぐにその曲のコード譜または歌詞とコードが表示される // 5. 曲名に続くタブ1段(以上)の行はその曲の「コード譜」または「歌詞とコード」 // タブ区切りで整列し、4つ以上の場合は「|」を表示して整列する // 画像ファイル(jpg,png,gif)、サウンドファイル(mp3,wav)、リンク(https:..)も行に1つ記載可 // 「---」で区切り線を表示 // 6. 歌詞の上にコードを表示するには [夏:G]が[過:D]ぎ... のようにする var kshift=[6,5,4,3,2,1,0,11,10,9,8,7,6]; // kidxからkshiftへの変換テーブル var ksel=["+6","+5","+4","+3","+2","+1","0","-1","-2","-3","-4","-5","-6"]; var kidx=[]; // 曲ごとのkshift[]のindex var chord=[]; // キーの変換テーブル chord["A"] =["A","Bb","B","C","C#","D","Eb","E","F","F#","G","Ab"]; chord["A#"]=["A#","B","C","C#","D","Eb","E","F","F#","G","Ab","A"] chord["Bb"]=["Bb","B","C","C#","D","Eb","E","F","F#","G","Ab","A"] chord["B"] =["B","C","C#","D","Eb","E","F","F#","G","Ab","A","Bb"] chord["C"] =["C","C#","D","Eb","E","F","F#","G","Ab","A","Bb","B"]; chord["C#"]=["C#","D","Eb","E","F","F#","G","Ab","A","Bb","B","C"]; chord["Db"]=["Db","D","Eb","E","F","F#","G","Ab","A","Bb","B","C"]; chord["D"] =["D","Eb","E","F","F#","G","Ab","A","Bb","B","C","C#"]; chord["D#"]=["D#","E","F","F#","G","Ab","A","Bb","B","C","C#","D"]; chord["Eb"]=["Eb","E","F","F#","G","Ab","A","Bb","B","C","C#","D"]; chord["E"] =["E","F","F#","G","Ab","A","Bb","B","C","C#","D","Eb"]; chord["F"] =["F","F#","G","Ab","A","Bb","B","C","C#","D","Eb","E"]; chord["F#"]=["F#","G","Ab","A","Bb","B","C","C#","D","Eb","E","F"]; chord["Gb"]=["Gb","G","Ab","A","Bb","B","C","C#","D","Eb","E","F"]; chord["G"] =["G","Ab","A","Bb","B","C","C#","D","Eb","E","F","F#"]; chord["G#"]=["G#","A","Bb","B","C","C#","D","Eb","E","F","F#","G"]; chord["Ab"]=["Ab","A","Bb","B","C","C#","D","Eb","E","F","F#","G"]; var chordtext, TITLE, data; window.onload=function(){ $("MENU").style.fontFamily=$("CONTENT").style.fontFamily="meiryo"; // フォントを"メイリオ"に $("MENU").style.fontSize=$("CONTENT").style.fontSize="x-large"; // フォントサイズを"x-large"に $("CHORDTEXT").style.tabSize="4"; $("EDIT").style.textAlign="right"; $("EDIT").innerHTML="
"; with(document.body.style){lineHeight="140%";margin="0";padding="0";} // 全体のstyle chordtext=$("CHORDTEXT").value; // HTMLに記載されたCHORDTEXT if(chordtext!=getWS("CHORDTEXTini")){ // 変更があれば setWS("CHORDTEXT",chordtext); // 現在のCHOTDTEXTとして保存 setWS("CHORDTEXTini",chordtext); // 初期値として保存 data=text2data(chordtext); // dataを作り for(var i=1;i"; // 大見出しとして表示 } for(var j=1;j"; // 説明 s+="
    "; for(var i=1; i
    "; }else if(item[0].match(/^---/)) s+="
    "; // 区切り線 else{ // 通常は if(item.length>1 || data[i].length>1) s+="
  1. "+reform(item[0]); // 曲名 else s+="
  2. "+reform(item[0])+""; // 内容がなければGRAY if(item.length>1 && item[1].match(/^http|html|\/$/)){ s+="[View]"; // リンクなら[View] }else if(data[i].length>1) s+="[view]"; // 通常は[view] } } s+="
"; s+="

"; s+="

"; $("MENU").innerHTML=s; // 曲名一覧の表示 $("MENU").style.display=""; $("CONTENT").style.display="none"; // メニューのみ表示 $("EDIT").style.display="none"; $("CHORDTEXT").style.display="none"; } } var EditDisp=false; // false:非表示 true:表示 function editdisp(d){ // テキストデータの表示/非表示 if(d===undefined) editdisp(!EditDisp); // 引数がない時は表示/非表示を反転 else if(d==true){ $("CHORDTEXT").style.display=""; $("EDIT").style.display=""; EditDisp=d; }else{ $("CHORDTEXT").style.display="none"; $("EDIT").style.display="none"; EditDisp=d; } } function update(){ // 表示を更新 chordtext=$("CHORDTEXT").value; setWS("CHORDTEXT",chordtext); // テキストデータを保存 data=text2data(chordtext); // dataを作り menuview(); // メニュー表示 } function inittext(){ chordtext=getWS("CHORDTEXTini"); // テキストデータを初期値にする $("CHORDTEXT").value=chordtext; // 表示を初期値にする setWS("CHORDTEXT",chordtext); // 初期値を保存する data=text2data(chordtext); // dataを作り menuview(); // メニュー表示 } var RUBYDISP=false; function ruby(){ // ルビコードの表示/非表示 var rt=document.getElementsByTagName("rt"); for(var i=0;i"+rb+""+rt.replace(/[A-G][#b]?/g,_chord)+"";} function reform(s){ s=s.replace(/Ⅷ/g,"VIII") .replace(/Ⅶ/g,"VII") .replace(/Ⅵ/g,"VI") .replace(/Ⅳ/g,"IV") .replace(/Ⅴ/g,"V") .replace(/Ⅲ/g,"III") .replace(/Ⅱ/g,"II") .replace(/Ⅰ/g,"I") .replace(/([ACDFGIV])[♯#]/g,"$1#") .replace(/([ABDEGIV])♭/g,"$1b") // ♭→b .replace(/\[([^:]*):([^\]]*)\]/g,_ruby) // ************************** .replace(/(\([#♭b]?9\))/g,"$1") .replace(/(\([#♭b]?1[13]\))/g,"$1") .replace(/\(?[♭b]5\)?/g,"(b5)") .replace(/(on[A-G][#♭b]?)/,"$1") .replace(/(sus4)/g,"$1") .replace(/(dim7?)/g,"$1") .replace(/MAJ7/g,"MAJ7") .replace(/([A-GIV][#♭b]?)([△Δm\-φo]?[1-9][\-\/]?[1-9]?)/g,"$1$2") .replace(/\-/g,"−") .replace(/([A-GIV])[♭b]/g,"$1b") .replace(/([A-GIV])#/g,"$1#")// ♭→b .replace(/[△Δ]/g,"Δ") .replace(/VIII/g,"Ⅷ") .replace(/VII/g,"Ⅶ") .replace(/VI/g,"Ⅵ") .replace(/IV/g,"Ⅳ") //.replace(/V/g,"Ⅴ") .replace(/III/g,"Ⅲ") .replace(/II/g,"Ⅱ"); //.replace(/I/g,"Ⅰ") return s; } function chgkey(i, idx){ // 曲iをキーidxで表示 kidx[i]=idx; setWS("KIDX",kidx); // キーのインデックスKIDXを保存 view(i); // 曲iを表示 } function view(i){ // 曲iを表示 I=i; // 曲番号を保存 var title=data[i][0]; // 曲名 TITLE=document.title; // 現在のタイトルを退避 document.title=title; // VIEWのタイトルに置き換える var S="

"+reform(title); for(var j=1;j"; for(var k=0;k"+ksel[k]+""; S+="" break; } S+="


"; var ncol=-1; for(var j=1;j3?(2*ncol+1):ncol)+">
"; // 区切り線 }else{ if(item.length!=ncol){ if(ncol!=-1) S+=""; S+="
" ncol=item.length; } S+=""; for(var k=0;k=4) S+=""; // 4小節以上なら区切り表示 if(item[k].match(/\[([^:]*):([^\]]*)\]/)) S+=""; // *********** else{ var a=item[k].replace(/(\.jpg|\.gif|\.png) width/,"$1%20width").split(" "); // スペース区切り for(var m=0;m"; }else if(a[m].match(/\.mp3|\.wav/)){ // 音ファイル a[m]=""; }else if(a[m].match(/http|\.html/)){ // リンク a[m]="["+(a[m].match(/youtube/)?"YouTube":"リンク")+"]"; }else a[m]=reform(a[m]); // 歌詞・コードはreform } if(item[k].match(/\.jpg|\.gif|\.png/)) S+=""; else S+=""; } } } if(item.length>3) S+=""; // 行末の小節区切り表示 S+="" } } S+="
|"+item[k].replace(/\[([^:]*):([^\]]*)\]/g,_ruby)+""+a.join(" ")+""+a.join(" ")+"|
"; if(data.length==2) S+="
"; $("CONTENT").innerHTML=S; $("MENU").style.display="none"; $("CONTENT").style.display=""; // コンテンツのみ表示 $("CHORDTEXT").style.display="none"; window.addEventListener('popstate', function(e){ // [戻る]操作で document.title=TITLE; // タイトルを復旧 $("MENU").style.display=""; $("CONTENT").style.display="none";$("CHORDTEXT").style.display="none";// 初期表示 }); editdisp(false); // テキストデータの非表示 // $("KSHIFT").selectedIndex=kidx; // kidxのセレクタを選択 history.pushState(null, null, location.href); // [戻る]操作で現在ページ } function $(id){return document.getElementById(id);} function getParams(){ var params=new Array(); if(location.search){ var requests=location.search.substring(1).split("&"); for(var i in requests){ var items=requests[i].split("="); if(items.length==2) params[items[0]]=items[1]; else params["kw"]=items[0]; } } return params; } function setWS(name, value){ // WebStorageへの保存 var ws_name=location.pathname+"_"+name; localStorage.setItem(ws_name, JSON.stringify(value)); } function getWS(name){ // WebStorageからの取得 var ws_name=location.pathname+"_"+name; var ws_value=JSON.parse(localStorage.getItem(ws_name)); return ws_value; }