Tieba Imagizer

贴吧图化 - Gerald倾情打造

当前为 2014-05-29 提交的版本,查看 最新版本

您需要先安装一个扩展,例如 篡改猴Greasemonkey暴力猴,之后才能安装此脚本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴Userscripts ,之后才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。

您需要先安装用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name	Tieba Imagizer
// @namespace	http://gera2ld.blog.163.com/
// @author	Gerald <[email protected]>
// @icon	http://s.gravatar.com/avatar/a0ad718d86d21262ccd6ff271ece08a3?s=80
// @version	1.2.6.1
// @description	贴吧图化 - Gerald倾情打造
// @homepage	http://geraldl.ml/userjs/TiebaImagizer
// @include	http://tieba.baidu.com/*
// @exclude	http://tieba.baidu.com/tb/*
// @require	https://greasyfork.org/scripts/144/code.user.js
// ==/UserScript==

// 初始化图片上传功能
var loadingURL='http://tieba.baidu.com/tb/static-ihome/img/loading2.gif';
function initImageLoader(callback) {
	var fil='http://static.tieba.baidu.com/tb/static-frs/component/sign_shai/flash_image_loader.js';
	if(!unsafeWindow.FlashImageLoader) $.getScript(fil,callback); else callback();
}
// 初始化颜色选择面板
function initColorPanel() {
	if(utils.colorInput) return;
	// Check support for input[type=color]
	var i=document.createElement('input');
	i.setAttribute('type','color');
	if(i.type=='color')
		return utils.colorInput=function(id,key,def,func){
			return utils.bindProp($('<input type=color id='+id+' class="ge_rsep colorbox">'),'value',key,def,func,['change','keyup']);
		};

	utils.addStyle('\
#colors{display:none;position:absolute;background:white;border:2px ridge;padding:10px;cursor:default;}\
#colors .colors{width:261px;cursor:pointer;margin:2px;border-collapse:separate;border-spacing:1px;background:black;}\
#colors .colors td{display:table-cell !important;width:12px;height:12px;border:none;emptycells:show;}\
.colorbox{width:12px;height:12px;border:1px solid;display:inline-block;position:relative;top:3px;}\
');
	var cp=$('<div id=colors>').click(function(e){e.stopPropagation();}),r,c,t;
	r=function(e){
		var d=$(e.target).attr('data');
		if(d) {
			if(e.type=='mouseover') {
				if(c) c.css('outline','none');
				c=$(e.target).css('outline','1px outset yellow');
				$('#ge_vcolor').val(d);
			} else cp.owner.setColor(d);
		}
	};
	t=$('<table class=colors>').appendTo(cp).mouseover(r).click(r);
	var k=['00','33','66','99','cc','ff'],p=['#ffffff','#ff0000','#00ff00','#0000ff','#ffff00','#00ffff','#ff00ff'];
	for(var i=0;i<12;i++) {
		r=$('<tr>').appendTo(t);
		if(i<6) c='#'+k[i]+k[i]+k[i]; else c=p[i-6];
		$('<td>').appendTo(r).css({background:c}).attr('data',c);
		if(!i) $('<td rowspan=12 style="background:white;">').appendTo(r);
		for(var j=0;j<18;j++) {
			c='#'+k[Math.floor(i/6)*3+Math.floor(j/6)]+k[j%6]+k[i%6];
			$('<td>').appendTo(r).css({background:c}).attr('data',c);
		}
	}
	t=$('<form>').appendTo(cp);
	$('<span id=ge_scolor class="ge_rsep colorbox">').appendTo(t);
	r=function(){$('#ge_scolor').css('background',this.value);};
	$('<input type=text id=ge_vcolor style="width:60px" class=ge_rsep>').appendTo(t).change(r).keyup(r);
	r=function(e){e.preventDefault();cp.owner.setColor($('#ge_scolor').css('background-color'));};
	$('<span class=ge_sbtn>OK</span>').appendTo(t).click(r);t.submit(r);
	c=null;
	utils.colorInput=function(id,key,def,func){
		var o=$('<span id='+id+' class=colorbox>'),c=utils.getObj(key,def);
		o.css({border:'1px outset white',cursor:'pointer',background:c}).attr('data',c).click(function(e){
			if(cp.owner!=o) {
				cp.owner=o;cp.appendTo(o).css({top:'auto',bottom:'auto'}).show();
				if(cp.offset().top+cp.height()>pageYOffset+innerHeight) cp.css('bottom','14px');
				else cp.css('top','14px');
				$('#ge_scolor').css('background',e=o.attr('data'));
				$('#ge_vcolor').val(e);
			} else {cp.owner=null;cp.hide();}
		});
		o.setColor=function(v){
			v=v.replace(/rgb\((\d+),\s?(\d+),\s?(\d+)\)/i,function(v,g1,g2,g3){
				v=[g1,g2,g3];for(g1 in v) {v[g1]=parseInt(v[g1]).toString(16);if(v[g1].length<2) v[g1]='0'+v[g1];}
				return '#'+v.join('');
			});
			o.attr('data',v).css('background',v);
			utils.setObj(key,v);
			cp.owner=null;cp.hide();func();
		};
		o[0].val=function(){return o.attr('data');};
		return o[0];
	};
}
function initImagizer(editor){
	var st=utils.addStyle(),content=null,ebody=editor.$body,
			op=utils.addRPopup(utils.addSButton('图 化')).panel;
	utils.uploadImage=null;		// tell other scripts that imagizer is initiated
	function getStyle() {
		var s={},t=[];
		if($('#w2iitalic').prop('checked')) t.push('italic');
		if($('#w2ibold').prop('checked')) t.push('bold');
		t.push($('#w2isize').val()+'px');
		if(f.val()) t.push(f.val());
		s.font=t.join(' ');
		s.color=cf.val();
		s.background=$('#w2iabgclr').prop('checked')?cb.val():'inherit';
		return s;
	}
	function undo(){
		if(!content) return;
		ebody.html(content);content=null;
		bUndo.addClass('ge_disabled');
	}
	function init(){
		initImageLoader(function(){
			utils.uploadImage=function(data,node) {
				function error(a){
					alert('图片上传发生错误!');
					undo();
					unbindEvents();
				}
				function uploaded(a,d) {
					var c=JSON.parse(d);
					if(c.error_code) error(); else {
						var e='http://imgsrc.baidu.com/forum/pic/item/'+c.info.pic_id_encode+'.jpg';
						$(node).replaceWith('<img class="BDE_Image" src="'+e+'" pic_type="0" onload="EditorUI.resizeImage(this,560)">');
						unbindEvents();
					}
				}
				function bindEvents(){
					unsafeWindow.FlashImageLoader.bind('uploadComplete', uploaded);
					unsafeWindow.FlashImageLoader.bind('uploadError',error);
				}
				function unbindEvents(){
					unsafeWindow.FlashImageLoader.unbind('uploadComplete', uploaded);
					unsafeWindow.FlashImageLoader.unbind('uploadError',error);
				}
				$.get('/dc/common/imgtbs',function(r) {
					bindEvents();
					unsafeWindow.FlashImageLoader.uploadBase64('http://upload.tieba.baidu.com/upload/pic',data.replace(/^data:.*?;base64,/,''),{tbs:r.data.tbs});
				},'json');
			};
			u.removeClass('ge_disabled').text('开始图化').unbind('click').click(word2Image);
		});
	}
	var u=$('<div class="ge_sbtn ge_disabled" style="margin:0 0 2px;">图化组件初始化失败,点击重试</div>').appendTo(op).click(init);
	init();
	// Extracted from ueditor.js
	function extractContents(H) {
		function remove(i){i.parentNode.removeChild(i);}
		function findParents(i){
			var a=[i];
			while(i.parentNode!==editor.body&&(i=i.parentNode)) a.unshift(i);
			return a;
		}
		var F = H.startContainer, E = H.endContainer, N = H.startOffset, G = H.endOffset, T = H.document, B = T.createDocumentFragment(), I, K;
		if (F.nodeType == 1) {
				F = F.childNodes[N] || (I = F.appendChild(T.createTextNode("")))
		}
		if (E.nodeType == 1) {
				E = E.childNodes[G] || (K = E.appendChild(T.createTextNode("")))
		}
		if (F === E && F.nodeType == 3) {
				B.appendChild(T.createTextNode(F.substringData(N, G - N)));
				F.deleteData(N, G - N);
				H.collapse(true)
				return B
		}
		var J, P, R = B, Q = findParents(F), C = findParents(E);
		for (var O = 0; Q[O] == C[O]; ) {
				O++
		}
		for (var M = O, S; S = Q[M]; M++) {
				J = S.nextSibling;
				if (S == F) {
						if (!I) {
								if (H.startContainer.nodeType == 3) {
										R.appendChild(T.createTextNode(F.nodeValue.slice(N)));
								} else {
										R.appendChild(F)
								}
						}
				} else {
						P = S.cloneNode(false);
						R.appendChild(P)
				}
				while (J) {
						if (J === E || J === C[M]) {
								break
						}
						S = J.nextSibling;
						R.appendChild(J);
						J = S
				}
				R = P
		}
		R = B;
		if (!Q[O]) {
				R.appendChild(Q[O - 1].cloneNode(false));
				R = R.firstChild
		}
		for (var M = O, D; D = C[M]; M++) {
				J = D.previousSibling;
				if (D == E) {
						if (!K && H.endContainer.nodeType == 3) {
								R.appendChild(T.createTextNode(E.substringData(0, G)));
								E.deleteData(0, G)
						}
				} else {
						P = D.cloneNode(false);
						R.appendChild(P)
				}
				if (M != O || !Q[O]) {
						while (J) {
								if (J === F) {
										break
								}
								D = J.previousSibling;
								R.insertBefore(J, R.firstChild);
								J = D
						}
				}
				R = P
		}
		H.setStartBefore(!C[O] ? C[O - 1] : !Q[O] ? Q[O - 1] : C[O]).collapse(true);
		I && remove(I);
		K && remove(K);
		return B
	}
	function innerText(o) {
		return $('<div>').append(o.childNodes||o.html()).html(function(i,h){return h.replace(/<br>(<\/p>)?|<\/p>/gi,'\n');}).text().replace(/\s+$/,'');
	}
	function word2Image(){
		content=ebody.html();
		bUndo.removeClass('ge_disabled');
		var fz=parseInt($('#w2isize').val()),loading=$('<img title="双击撤销">').attr('src',loadingURL),
				r=editor.selection.getRange(),s=null;
		if(!r.collapsed) s=innerText(extractContents(r));
		if(s&&/\S/.test(s)) {
			r.insertNode(loading[0]);
		} else {
			s=innerText(ebody);
			if(!/\S/.test(s)) return;
			ebody.html(loading);
		}
		var lines=s.split('\n'),w=0,c=document.createElement('canvas'),d=c.getContext('2d'),lh=Math.round(1.5*fz),data=[];
		s=getStyle();
		d.font=s.font;
		lines.forEach(function(line){
			line=line.replace(/\s+$/,'');
			do {
				for(var l=0,j=0;j<line.length;j++) {
					l+=d.measureText(line[j]).width;
					if(l>560) break; else if(w<l) w=l;
				}
				data.push(line.substr(0,j));
				line=line.substr(j);
			} while(line);
		});
		c.height=lh*data.length;
		c.width=w;
		if($('#w2ishadow').prop('checked')) {
			d.shadowColor='gray';
			d.shadowBlur=d.shadowOffsetY=d.shadowOffsetX=Math.ceil(fz/25);
		}
		if($('#w2iabgclr').prop('checked')) {
			d.fillStyle=s.background;
			d.fillRect(0,0,w,c.height);
		}
		d.font=s.font;
		d.fillStyle=d.strokeStyle=s.color;
		e=$('#w2istroke').prop('checked')?d.strokeText:d.fillText;
		i=0;data.forEach(function(j){e.call(d,j,0,fz+lh*(i++));});
		utils.uploadImage(c.toDataURL(),loading);
	}
	function checkFont(e) {
		e=getStyle();var i,s='';
		for(i in e) e[i]+=' !important';
		if($('#w2ipreview').prop('checked')) st.html('#ueditor_replace{font:'+e.font+';color:'+e.color+';background:'+e.background+'}');
		else st.html('');
		for(i in e) s+=i+':'+e[i]+';';
		f.css('cssText',s);
	}
	utils.addStyle('#w2iface{max-width:800px;max-height:400px;}');
	var ff=utils.list('w2ifaces','w2ifaceid',null,['微软雅黑']).load();
	var f=$('<select id=w2iface>').appendTo($('<label>字体:</label>').appendTo(op)).change(function(e){ff.load(f.prop('selectedIndex'));checkFont();});
	ff.list.forEach(function(i){$('<option>'+i+'</option>').appendTo(f);});f.prop('selectedIndex',ff.last);
	$('<span class=ge_sbtn>+</span>').appendTo(op).click(function(e){
		if(e=prompt('请输入字体名称:')) {
			ff.load(ff.push(e));
			$('<option>').text(e).appendTo(f);
			f.val(e);checkFont();
		}
	});
	$('<span class=ge_sbtn>-</span>').appendTo(op).click(function(e){
		e=f.prop('selectedIndex');
		f.children(':eq('+e+')').remove();
		ff.pop(e);ff.load(f.prop('selectedIndex'));checkFont();
	});
	initColorPanel();
	var cf,cb;
	utils.bindProp($('<input type=checkbox id=w2ipreview>').appendTo(op),'checked','w2ipreview',false,checkFont);
	$('<label for=w2ipreview>预览</label><br><label for=w2icolor>颜色:</label>').appendTo(op);
	$(cf=utils.colorInput('w2icolor','w2icolor','#2222ff',checkFont)).appendTo(op).addClass('ge_rsep');
	$('<label for=w2isize>大小:</label>').appendTo(op);
	utils.bindProp($('<input type=number id=w2isize min=9 class=ge_rsep style="height:18px;width:40px;">').appendTo(op),'value','w2isize',22,checkFont);
	utils.bindProp($('<input type=checkbox id=w2iabgclr>').appendTo(op),'checked','w2iabgclr',false,checkFont);
	$('<label for=w2iabgclr>背景色:</label>').appendTo(op);
	$(cb=utils.colorInput('w2ibgclr','w2ibgclr','#efe4b0',checkFont)).appendTo(op);
	$('<br>').appendTo(op);
	utils.bindProp($('<input type=checkbox id=w2ibold>').appendTo(op),'checked','w2ibold',false,checkFont);
	$('<label for=w2ibold class=ge_rsep>加粗</label>').appendTo(op);
	utils.bindProp($('<input type=checkbox id=w2iitalic>').appendTo(op),'checked','w2iitalic',false,checkFont);
	$('<label for=w2iitalic class=ge_rsep>倾斜</label>').appendTo(op);
	utils.bindProp($('<input type=checkbox id=w2ishadow>').appendTo(op),'checked','w2ishadow',false,checkFont);
	$('<label for=w2ishadow class=ge_rsep>阴影</label>').appendTo(op);
	utils.bindProp($('<input type=checkbox id=w2istroke>').appendTo(op),'checked','w2istroke',false,checkFont);
	$('<label for=w2istroke class=ge_rsep>镂空</label>').appendTo(op);
	var bUndo=$('<span class="ge_sbtn ge_disabled" title="回到最后一次图化前的状态">撤销图化</span>').appendTo(op).click(undo);
	f.prop('selectedIndex',ff.last);checkFont();
}

if(unsafeWindow.PosterContext&&unsafeWindow.PosterContext.isPostAllowed()) utils.wait(unsafeWindow,'test_editor',initImagizer);