らくがきちょう

[diary:172274]
[beforeExec]
window.onresize = fixDispResize = function(){
Fid("fixDisp").style.width = (Fid("main2").offsetWidth - 4) + "px";
};
entry = function(){
Fx.e("/home/yadokari/diary/2010/05/1273841145.html");
fixDispResize();
};
musicSel = function(o){
o.className = "a2_act";
if(musicSel.act != null) musicSel.act.className = "a2";
musicSel.act = o;
};
setMidiDat = function(al,f){
var s = Fx.mu[al][f].split(",");
midi.al_no = al;
midi.f_no = f;
midi.name = s[0];
midi.label = s[1];
var s2 = Fx.al[al].split(",");
midi.al_label = s2[2];
midi.path = s2[1];
midi.uri = "MIHO" + s2[1] + s[0];
};
midiPlay = function(al,f,fg){
setMidiDat(al,f);

if(self != parent && window.name == "main_yadokari"){
var menu = top.frames["menu_yadokari"];
var obj = menu.document.getElementById("midiDisp");

var once = echo(obj) == "";
if(fg || !fg && once){
echo(obj,'<embed src="' + midi.uri + '" autostart="true" repeat="true" loop="true" width="120" height="16"></embed>');

obj.setAttribute("dat", f);
echo("midiInfo", midi.f_no + " : " + midi.label + " [" + midi.name + "]");
if(once){
menu.midiList = function(fg){
alert(top.frames["menu_yadokari"].document.getElementById("midiMenu").getAttribute("dat"));

};
echo(menu.document.getElementById("midiMenu"), '\x3ca href="javascript:midiList(-1)">\x3c\x3c/a> \x3ca target="main_yadokari" href="main.html?diary=172244" title="♪中島みゆき">MIDIの小部屋\x3c/a> \x3ca href="javascript:midiList(1)">>\x3c/a>'

);
menu.document.getElementById("midiMenu").setAttribute("dat", Fx.mu[al].join(","));
}
} else {

var info = obj.getAttribute("dat");
echo("midiInfo", midi.f_no + " : " + midi.label + " [" + midi.name + "]");
}
} else {
echo("midiDisp", '<embed src="' + midi.uri + '" autostart="true" repeat="true" loop="true" width="200" height="16"></embed> <$$span style="font-size:80%; color:#808080; vertical-align:middle">' + midi.f_no + ' : ' + midi.label + ' [' + midi.name + ']<$$/span>');

}
};

keyDec = function(s1,s2){
var s = Fx.dec(key(s1,s2)).replace(/\t/g, "\n");
s = s.replace(/^\s*\n|\n$/g,"").split("\n");
return s;
};
Lo.entry = function(dat){
midi = new Object();
Fx.al = keyDec(dat, "directry");
Fx.mu = new Array();
var a,b,s;
for(var j = 0; j < Fx.al.length; j++){
a = Fx.al[j].split(",");
s = "\x3cdiv class='al_title'>" + a[2] + "\x3c/div>";
Fx.mu[j] = keyDec(dat, a[0]);
for(var i = 0; i < Fx.mu[j].length; i++){
s += "\x3ca href='javascript:midiPlay(" + j + "," + i + ",true)' class='a2' onclick='musicSel(this)'>\x3cspan>■\x3c/span>" + Fx.mu[j][i].split(",")[1].replace(/「(.+)」/," \x3cfont class='mini'>$1\x3c/font>") + "\x3c/a>";
}
var o = Fap(Fid("midiBox"), Fce("div"));
echo(o, s);
}
fixDispResize();
};

[/beforeExec]
[cssText]
a { text-decoration:none; }
.ma2 a { text-decoration:underline; }
html { background-attachment:scroll; }
#fixDisp {
position:fixed; top:0px; left:63px; height:100px;
background-color:#fff; width:400px;
}
.fixDispCont {
padding:.5em 0 .5em .5em; border-bottom:1px solid #ccc;

}
#main2 {
margin-right:230px;
}
#ma1 { margin:0 1em; font:120%/1.2 "Times New Roman"; color:#a0a0a0;
padding-top:100px;
}
.s1 { color:steelblue; }
.s2 { color:blueviolet; }
.s3 { color:#808080; font-size:80%; }
.ma2 {
min-height:6em; border-bottom:1px solid #ccc; margin-right:.5em;
padding:.5em 0; font:90%/1.4 meiryo,"メイリオ";
}
.ma2_title { color:orange; background-color:#339; padding:.25em .5em; }
.ma2_info { font-size:80%; text-align:right; }
#menu2Disp {
width:230px; float:right;
background:url(MIHO/futari/ringnote2.gif) repeat-y;
padding-top:1em; font:90%/1.4 "Comic Sans MS";
}
#menu2Disp > div { margin-left:54px; margin-bottom:.5em; }
#menu2Disp a {
display:block; border-bottom:1px dotted #ccc; font-size:85%;
padding-left:.5em;
}
#menu2Disp a:hover {
color:magenta; border-bottom:1px dotted tomato;
background-color:yellow;
}
#menu2Disp a:hover span { color:steelblue; }
.a1 span { color:green; }
.a2 { color:steelblue; }
.a2 span { color:orange; }
.a2_act { color:#339; background-color:#ffefff; }
.a2_act span { color:tomato; }
.al_title { font-size:90%; text-align:center; margin-top:.5em; }
font.mini { color:tomato; font-size:70%; }

#footerDisp { display:none; }
[/cssText]
[body]
<$$div id="menu2Disp">
<$$div class="box">
<$$a href="main.html?diary=172231&page=172274" class="a1"><$$span>■<$$/span>コンテンツの更新<$$/a>
<$$/div>
<$$div id="midiBox"><$$/div>
<$$/div>
<$$div id="main2">
<$$div id="ma1">
<$$a href="main.html?diary=172274">#172274<$$/a>
<$$span class="s1">なんちゃん<$$/span>の<$$/span><$$span class="s2">らくがきちょう<$$/span><$$span class="s3">
1.0.1<$$/span>
<$$/div>
<$$div class="ma2">
<$$img src="files/yosei_0.gif" alt="" /> <$$a href="main.html?diary=172244">MIDIの小部屋<$$/a>で使うmidiBoxを作ってみる。<$$a href="/home/botanic/diary/2008/04/1207264217.html#comments" target="_blank">データ<$$/a>

<$$div id="midiDisp"><$$/div>
・曲データの構成<$$br />
 Fx.mu = [fileName title,* *,....];
<$$/div>
<$$div class="ma2">
<$$div class="ma2_title">音楽の曲データの作成<$$/div>
<$$div class="ma2_info">2010/06/29 20:23<$$/div>
<$$div class="ma2_main">
色々なページで利用できる音楽の曲データを日記の一部に作ることにする。<$$br />
・曲のデータは<$$a href="/home/yadokari/diary/2010/05/1273841145.html">ここ<$$/a><$$br />
・データの更新は<$$a href="/home/yadokari/main.html?diary=172231&page=172378">ここ<$$/a><$$br />
<$$br />
・<$$a href="http://cgi.geocities.jp/musicgarden_jp/geo_cgi/index.html">ジオのCGIの最初の一歩<$$/a>
<$$/div>

<$$/div>
<$$/div>
<$$/div>

<$$div id="fixDisp">
<$$div class="fixDispCont">
音楽の庭
<$$div id="midiInfo"><$$/div>
<$$div>
<$$/div>
[/body]

[exec]
document.title = "らくがきちょう 1.0.1";
entry();
[/exec]
[/diary:172274]

■仕様書 Wrote 2010 04/30 21:35