|
// ==UserScript== |
|
// @include http://bgm.tokor.org/* |
|
// ==/UserScript== |
|
|
|
(function(){ |
|
var PersistentStore = { |
|
read: function(key){ |
|
return JSON.parse(window.localStorage.getItem(key)); |
|
}, |
|
write: function(key,val){ |
|
return window.localStorage.setItem(key,JSON.stringify(val)); |
|
} |
|
}; |
|
|
|
var PlayLog = { |
|
__storeKey: "play_log", |
|
__log: [], |
|
load: function(){ |
|
var log = PersistentStore.read(this.__storeKey); |
|
if(log){ |
|
this.__log = log; |
|
} |
|
}, |
|
store: function(){ |
|
PersistentStore.write(this.__storeKey, this.__log); |
|
}, |
|
add: function(info){ |
|
if(!this.exist(info.id)){ |
|
this.__log.push(info); |
|
} |
|
}, |
|
find: function(key,val){ |
|
for(var i=0,len=this.__log.length;i<len;i++){ |
|
if(this.__log[i][key] === val){ |
|
return i; |
|
} |
|
} |
|
return -1; |
|
}, |
|
exist: function(id){ |
|
return this.find("id",id) !== -1; |
|
}, |
|
getInfo: function(index){ |
|
return this.__log[index]; |
|
} |
|
}; |
|
var injectPlayLogger = function(){ |
|
var script = document.createElement("script"); |
|
script.textContent = "("+(function(){ |
|
var fireEvent = function(name,val){ |
|
var e; |
|
if(window.opera){ |
|
e = document.createEvent("Event"); |
|
e.initEvent(name, true, false); |
|
e.mydata = val; |
|
}else{ |
|
e = document.createEvent("MessageEvent"); |
|
e.initMessageEvent(name, true, false, |
|
JSON.stringify(val), |
|
location.protocol + "//" + location.host, |
|
"", |
|
window |
|
); |
|
} |
|
document.dispatchEvent(e); |
|
}; |
|
onNextVideoLoaded = (function(f){ |
|
return function(json){ |
|
setTimeout(function(){ |
|
fireEvent("playVideo",videoInfo); |
|
},1000); |
|
return f(json); |
|
}; |
|
})(onNextVideoLoaded); |
|
}).toString()+")();"; |
|
document.body.appendChild(script); |
|
}; |
|
var initListener = function(){ |
|
document.addEventListener("playVideo",function(e){ |
|
var data = e.mydata || JSON.parse(e.data); |
|
PlayLog.add(data); |
|
PlayLog.store(); |
|
updateUI(); |
|
},false); |
|
}; |
|
var initUI = function(){ |
|
var div = document.createElement("div"); |
|
div.innerHTML = [ |
|
"<p>再生履歴</p>", |
|
'<div id="play-history-pane" ', |
|
'style="overflow: scroll;width: 100%;height: 10em;background-color: #fff;"', |
|
'>', |
|
'</div>' |
|
].join(""); |
|
document.getElementById("content-left").appendChild(div); |
|
}; |
|
var buildItemUI = function(item){ |
|
var div = document.createElement("div"); |
|
div.style.position = "static"; |
|
div.style.float = "left"; |
|
div.style.width = "150px"; |
|
div.innerHTML = [ |
|
"<p title=\""+item.title+"\">"+item.title.slice(0,20)+"</p>", |
|
"<p><img src=\""+item.thumbnail+"\"/></p>", |
|
"<p><a onclick=\"client.addNew('"+item.id+"',function(j){});return false;\" href=\"#\">キューに入れる</a></p>" |
|
].join(""); |
|
return div; |
|
}; |
|
var updateUI = function(){ |
|
var el = document.getElementById("play-history-pane"); |
|
el.innerHTML = ""; |
|
PlayLog.__log.slice(0,10).forEach(function(item){ |
|
el.appendChild(buildItemUI(item)); |
|
}); |
|
}; |
|
PlayLog.load(); |
|
initUI(); |
|
initListener(); |
|
injectPlayLogger(); |
|
})(); |