Show chord diagrams on j-total
by
maRk
2015-10-14 [2015/10/14 21:03:47]
マウスオーバーでコード表示
@@ -6,7 +6,7 @@
* @require
*/
(function(){
- var chords = document.querySelectorAll('a[href]');
+ var chords = document.querySelectorAll('tt a[href]');
Array.prototype.forEach.call(chords, function(elm){
elm.addEventListener('mouseover', function(){
showchord(elm, elm.href);
/*
* @title Show chord diagrams on j-total
* @description マウスオーバーでコード表示
* @include http://music.j-total.net/data/*
* @license MIT License
* @require
*/
(function(){
var chords = document.querySelectorAll('tt a[href]');
Array.prototype.forEach.call(chords, function(elm){
elm.addEventListener('mouseover', function(){
showchord(elm, elm.href);
}, false);
elm.addEventListener('mouseleave', function(){
setTimeout(function(){
if (elm.hasChildNodes()){
for (var i = 1; i < (elm.childNodes.length); i++) {
elm.removeChild(elm.childNodes[i]);
}
}
}, 1500);
}, false);
});
function showchord(e, c){
var x = new XMLHttpRequest();
var this_chord = c.replace(/.+\/(.*)\.html\'\);$/, '/cd/img/$1.gif');
console.log(this_chord);
x.open('GET', this_chord);
x.responseType = 'blob';
x.onload = function(){
if (this.status == 200){
var blob = this.response;
var img = document.createElement('img');
img.onload = function(){
window.URL.revokeObjectURL(img.src);
};
img.src = window.URL.createObjectURL(blob);
if(e.childNodes.length<2){
e.appendChild(img);
}
}
};
x.send();
}
})();
- Permalink
- このページへの個別リンクです。
- RAW
- 書かれたコードへの直接のリンクです。
- Packed
- 文字列が圧縮された書かれたコードへのリンクです。
- Userscript
- Greasemonkey 等で利用する場合の .user.js へのリンクです。
- Loader
- @require やソースコードが長い場合に多段ロードする Loader コミのコードへのリンクです。
- Metadata
- コード中にコメントで @xxx と書かれたメタデータの JSON です。