// ==UserScript==
// @id hctb_bns_imgex
// @name BNS ImageExport
// @version 0.2
// @namespace bns_imgex@hctb
// @author fox9
// @description Convert text to image - BNS editpost
// @include http://bachngocsach.com/editpost.php?*
// @include http://bachngocsach.com/newreply.php?*
// @run-at document-end
// ==/UserScript==
var preview=document.getElementById("post_preview");if(!preview)return;
var input=preview.getElementsByTagName("input")[0];if(!input)return;
var input2=input.cloneNode(false);input2.value="make image";
input2.style.cssText+="float:right;";input2.removeAttribute("onclick");
var input3=input2.cloneNode(false);input3.value="+";
input2.addEventListener("click",start,false);input3.addEventListener("click",option,false);
var pnl=document.createElement("div");pnl.id="pnl";
pnl.style.cssText="display:none;width:200px;background-color:#DEB887;border:1px solid #696969;padding:2px;text-align:center";
pnl.innerHTML='<label>Size & Background</label><textarea rows="2" title="Chiều rộng\nMàu nền (-- Transparent)"></textarea><label>Watermark-1</label><textarea rows="7" title="Chữ (-- Skip)\nTên font\nKiểu chữ\nCỡ chữ\nTên/mã màu\nGóc xoay\nSố dòng"></textarea><label>Watermark-2</label><textarea rows="6" title="Chữ (-- Skip)\nTên font\nKiểu chữ\nCỡ chữ\nTên/mã màu\nGóc xoay"></textarea><input id="b1" type="button" value="Save"><input id="b2" type="button" value="Reset">';
var txt=pnl.getElementsByTagName("textarea");
preview=input.parentNode;preview.appendChild(pnl);preview.appendChild(input3);preview.appendChild(input2);
input.setAttribute("onclick","var b=this.parentNode.nextElementSibling.children[0];b.style.display=(b.style.display=='')?'none':'';")
var style=document.createElement("style");style.textContent="#pnl{float:right;margin-top:10px}#pnl>textarea{display:block;width:100%;resize:none}";
document.getElementsByTagName("head")[0].appendChild(style);sSet(gSet());
document.getElementById("b1").addEventListener("click",save,false);
document.getElementById("b2").addEventListener("click",reset,false);
function save(){GM_setValue("setting",gPar())}
function reset(){sSet(gSet(true));save()}
function option(){pnl.style.display=(pnl.style.display=="")?"none":"";}
function sSet(s){var s1=s.split(";");for(var i=0;i<3;i++){txt[i].value=unescape(s1[i])}}
function gSet(reset){var s=GM_getValue("setting");if(!s||reset)s=window.atob("NzIwcHglMEElMjNGRkZGRjQ7YmFjaG5nb2NzYWNoLmNvbSUwQUFyaWFsJTBBYm9sZCUyMGl0YWxpYyUwQTgwcHglMEElMjNmZWMlMEEtNDAlMEE0O0dJJUMwJTIwVEhJJUNBTiUyMC0lMjBTYW8lMkNWZSUyQ1doeS4uLiUwQVRpbWVzJTBBbm9ybWFsJTIwYm9sZCUwQTcycHglMEFwYWxlZ3JlZW4lMEEzNTs=");return s}
function gPar(){var s="";for(var i=0;i<3;i++){s+=escape(txt[i].value.trim())+";"}return s}
function start(e){
var content=e.target.parentNode.nextElementSibling,mi=<><![CDATA[
var pnl=document.getElementById("pnl"),txt=pnl.getElementsByTagName("textarea"),
b1=document.getElementById("b1"),b2=document.getElementById("b2"),
div=document.getElementById("container"),div1=div.children[0],
can=document.createElement("canvas"),ctx=can.getContext('2d'),
imgW,imgH,img=new Image(),bg,wm1,wm2,imgr=false,imgs;
b1.value="Apply";b2.value="Default";
b1.addEventListener("click",apply,false);b2.addEventListener("click",function(){sSet2(true)},false);
pnl.style.display="";div1.style.display="";div1.style.backgroundColor="";div1.style.border="";
div.parentNode.insertBefore(can,div);img.onload=function(){imgr=true}
sSet2();apply();
function apply(){
bg=txt[0].value.split("\n"),wm1=txt[1].value.split("\n"),wm2=txt[2].value.split("\n");
div.style.width=bg[0];div.style.display="";
imgW=div.clientWidth;imgH=div.clientHeight;
document.title=imgW+" x "+imgH+" - makeImage";
//8192 is limit for both width & height
if(imgW>8192){div.style.display="none";alert("Bề rộng của image quá lớn!\n\nChọn giá trị nhỏ hơn...haiz!");return}
img.src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='"+imgW+"' height='"+imgH+"'><foreignObject width='100%' height='100%'>"+(new XMLSerializer).serializeToString(div).replace(/color="#/g,'color="')+"</foreignObject></svg>";
div.style.display="none";
if(imgH>8192){
div1=document.createElement("div");div1.style.cssText="background-color:red;clear:both";pnl.appendChild(div1);
var ib=[],begin=0,nm=parseInt(imgH/8192)+1;//n of images
for(var i=0;i<nm;i++){
ib[i]=document.createElement("input");ib[i].type="button";
ib[i].value="i"+(i+1);
var len=Math.round((i+1)*imgH/nm);
ib[i].title=begin+"-"+len;begin=len;
ib[i].addEventListener("click",imgsDraw,false);div1.appendChild(ib[i])}
for(var i=0;i<3;i++){txt[i].setAttribute("disabled",true)}
b1.value="Return";b2.setAttribute("disabled",true);
b1.removeEventListener("click",apply,false);b1.addEventListener("click",ret,false);
imgs=true;
}else{drawImg(0,imgH)}
}
function imgsDraw(e){var az=e.target.title.split("-");drawImg(az[0],az[1])}
function drawImg(a,z){
can.width=imgW;can.height=z-a;
if(bg[1].substr(0,2)!="--"){ctx.fillStyle=bg[1];ctx.fillRect(0,0,can.width,can.height)}
var x=can.width/2,y=imgH/2;ctx.textAlign="center";
if(wm2[0].substr(0,2)!="--"){
wm(wm2[0],wm2[2]+" "+wm2[3]+" "+wm2[1],wm2[4],x,y-a,wm2[5]);
var wm2b=true}
if(wm1[0].substr(0,2)!="--"){
var n=parseInt(wm1[6]);if(wm2b&&n%2==0)n++;
y=imgH/(n+1);//n:times to paint
for(i=1;i<=n;i++){
if(wm2b&&i==parseInt(n/2)+1)continue;
wm(wm1[0],wm1[2]+" "+wm1[3]+" "+wm1[1],wm1[4],x,(y*i)-a,wm1[5])}
}
dImg();
function wm(s,f,c,x,y,r){
ctx.save();ctx.font=f;ctx.fillStyle=c;
ctx.translate(x,y);ctx.rotate(r*Math.PI/180);
ctx.fillText(s,0,0);ctx.restore()}
function dImg(){
if(imgr){ctx.drawImage(img,0,a,imgW,z-a,0,0,imgW,z-a);if(!imgs)imgr=false;
}else{setTimeout(dImg,300)}}
}
function ret(){
pnl.removeChild(div1);
for(var i=0;i<3;i++){txt[i].removeAttribute("disabled")}
b1.removeEventListener("click",ret,false);b1.addEventListener("click",apply,false);
b2.removeAttribute("disabled",true);b1.value="Apply";
imgr=false;imgs=false;}
function sSet2(def){
var s=((def)?par[1]:par[0]).split(";");for(var i=0;i<3;i++){txt[i].value=unescape(s[i])}}
]]></>.toString();
var pnl2=document.createElement("div");pnl2.appendChild(pnl.cloneNode(true));
var nWin='data:text/html;charset=utf-8;base64,'+window.btoa(unescape(encodeURIComponent('<html><head><title>makeImage</title><style>body{background-color:#f4f4f4;overflow-y:scroll}canvas:hover{background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAAAAAA6mKC9AAAAGElEQVQYV2N4DwX/oYBhgARgDJjEAAkAAEC99wFuu0VFAAAAAElFTkSuQmCC")}#pnl{position:fixed;top:20px;right:5px}textarea{display:block;width:100%;resize:none;font:12px Tahoma,Calibri,Verdana,Geneva,sans-serif}#b1{float:left}#b2{float:right}</style></head><body><div id="container" style="font:13px Verdana,Arial,Tahoma,Calibri,Geneva,sans-serif;text-align:justify">'+content.innerHTML+'</div>'+pnl2.innerHTML+'<script>var par=["'+gPar()+'","'+gSet(true)+'"];'+mi+'</script></body></html>')));
window.open(nWin,'make-image','width=800,height=600')}