微件:SaltTextDiffPalette - 版本历史

Salt lovely：.

2021-04-10T09:36:50Z

←上一版本		2021年4月10日 (六) 17:36的版本
第1行：		第1行：
	<noinclude><div class="salt-textDiffTool">这里是盐酱牌文字调色板</div>{{#Widget:SaltTextDiffPalette~~}}<~~/~~noinclude><includeonly><style>~~		<noinclude>
	.salt-textDiffTool.done{font-size:1rem}.salt-textDiffTool.done .title{width:100%;font-size:1.2rem}.salt-textDiffTool.done .title .subtitle{display:inline-block;font-size:1rem}.salt-textDiffTool.done .message{width:100%;font-size:0.875rem}.salt-textDiffTool.done .origin,.salt-textDiffTool.done .edited{width:33%;height:20rem;display:inline-block}~~.salt-textDiffTool.done .result{width:33%;display:inline-block~~}~~.salt-textDiffTool.done .result .delete~~{~~color:#333;background-color:#feea;text-decoration:line-through}.salt-textDiffTool.done .result .insert~~{~~color:~~#~~333;background-color~~:~~#efea;text-decoration:underline~~}~~.salt-textDiffTool.done .result .normal{color:#222~~}.salt-textDiffTool.done .result.anticopy .delete{color:#666}.salt-textDiffTool.done .result.anticopy .insert{background-color:#cfcd;text-decoration:none}.salt-textDiffTool.done .result.anticopy .normal{color:crimson;text-decoration:underline}		* 这个调色板并不自带CSS，请自行调用<code>Widget:SaltTextDiffPalette/CSS</code>或者自己写{{tl\|CSS}}。
	</~~style~~><script>"use strict";		<div class="salt-textDiffTool">这里是盐酱牌文字调色板</div>{{#Widget:SaltTextDiffPalette/CSS}}{{#Widget:SaltTextDiffPalette}}</noinclude><includeonly><script>"use strict";
	var __awaiter = (this && this.__awaiter) \|\| function (thisArg, _arguments, P, generator) {		var __awaiter = (this && this.__awaiter) \|\| function (thisArg, _arguments, P, generator) {
	function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }		function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
第50行：		第50行：
	title.style.fontWeight = 'bold';		title.style.fontWeight = 'bold';
	subtitle.className = 'subtitle';		subtitle.className = 'subtitle';
			subtitle.title = 'Levenshtein距离: 一段文字需要几个字符的更改才能变为另一段文字, 数值越小, 相似度越高';
	msg.className = 'message';		msg.className = 'message';
			msg.textContent = '就绪';
	input1.className = 'origin';		input1.className = 'origin';
	input2.className = 'edited';		input2.className = 'edited';

Salt lovely：.

2021-04-10T09:26:01Z

←上一版本		2021年4月10日 (六) 17:26的版本
第1行：		第1行：
	<noinclude><div class="salt-textDiffTool">这里是盐酱牌文字调色板</div>{{#Widget:SaltTextDiffPalette}}</noinclude><includeonly><style>		<noinclude><div class="salt-textDiffTool">这里是盐酱牌文字调色板</div>{{#Widget:SaltTextDiffPalette}}</noinclude><includeonly><style>
	.salt-textDiffTool.done{font-size:1rem}.salt-textDiffTool.done .title{width:100%;font-size:1.2rem}.salt-textDiffTool.done .title .subtitle{~~width:100%;~~display:inline-block;font-size:1rem}.salt-textDiffTool.done ~~.title~~ .message{width:100%~~;display:inline-block~~;font-size:0.875rem}.salt-textDiffTool.done .origin,.salt-textDiffTool.done .edited{width:33%;display:inline-block}.salt-textDiffTool.done .result{width:33%;display:inline-block}.salt-textDiffTool.done .result .delete{color:#333;background-color:#feea;text-decoration:line-through}.salt-textDiffTool.done .result .insert{color:#333;background-color:#efea;text-decoration:underline}.salt-textDiffTool.done .result .normal{color:#222}.salt-textDiffTool.done .result.anticopy .delete{color:#666}.salt-textDiffTool.done .result.anticopy .insert{background-color:#cfcd;text-decoration:none}.salt-textDiffTool.done .result.anticopy .normal{color:crimson;text-decoration:underline}		.salt-textDiffTool.done{font-size:1rem}.salt-textDiffTool.done .title{width:100%;font-size:1.2rem}.salt-textDiffTool.done .title .subtitle{display:inline-block;font-size:1rem}.salt-textDiffTool.done .message{width:100%;font-size:0.875rem}.salt-textDiffTool.done .origin,.salt-textDiffTool.done .edited{width:33%;height:20rem;display:inline-block}.salt-textDiffTool.done .result{width:33%;display:inline-block}.salt-textDiffTool.done .result .delete{color:#333;background-color:#feea;text-decoration:line-through}.salt-textDiffTool.done .result .insert{color:#333;background-color:#efea;text-decoration:underline}.salt-textDiffTool.done .result .normal{color:#222}.salt-textDiffTool.done .result.anticopy .delete{color:#666}.salt-textDiffTool.done .result.anticopy .insert{background-color:#cfcd;text-decoration:none}.salt-textDiffTool.done .result.anticopy .normal{color:crimson;text-decoration:underline}
	</style><script>"use strict";		</style><script>"use strict";
	var __awaiter = (this && this.__awaiter) \|\| function (thisArg, _arguments, P, generator) {		var __awaiter = (this && this.__awaiter) \|\| function (thisArg, _arguments, P, generator) {
第34行：		第34行：
	version();		version();
	history();		history();
			let scr = document.createElement('script');
			scr.src = 'https://cdn.staticfile.org/jsdiff/5.0.0/diff.min.js';
			document.head.appendChild(scr);
	let _a_ = Array.from(document.querySelectorAll('.salt-textDiffTool:not(.done)'));		let _a_ = Array.from(document.querySelectorAll('.salt-textDiffTool:not(.done)'));
	for (let div of _a_) {		for (let div of _a_) {
	div.classList.add('done');		div.classList.add('done');
	let _name = div.textContent;		let _name = div.textContent;
			div.textContent = '';
	let frag = document.createDocumentFragment();		let frag = document.createDocumentFragment();
	let title = document.createElement('div'), subtitle = document.createElement('span'), msg = document.createElement('~~span~~');		let title = document.createElement('div'), subtitle = document.createElement('span'), msg = document.createElement('div');
	let input1 = document.createElement('textarea'), input2 = document.createElement('textarea');		let input1 = document.createElement('textarea'), input2 = document.createElement('textarea');
	let btn = document.createElement('button'), result = document.createElement('div');		let btn = document.createElement('button'), result = document.createElement('div');
	title.className = 'title';		title.className = 'title';
	title.textContent = prefix + _name;		title.textContent = prefix + _name + ' ';
	title.style.fontWeight = 'bold';		title.style.fontWeight = 'bold';
	subtitle.className = 'subtitle';		subtitle.className = 'subtitle';
第51行：		第55行：
	result.className = 'result';		result.className = 'result';
	btn.textContent = '开始调色';		btn.textContent = '开始调色';
			result.title = '双击切换文章对比/反抄袭调色板模式';
	result.style.whiteSpace = 'pre-wrap';		result.style.whiteSpace = 'pre-wrap';
	let changeEventLevenshteinDistance = function () {		let changeEventLevenshteinDistance = function () {
第90行：		第95行：
	input2.disabled = false;		input2.disabled = false;
	msg.textContent = '处理完毕';		msg.textContent = '处理完毕';
			};
			result.ondblclick = function () {
			if (result.classList.contains('anticopy'))
			result.classList.remove('anticopy');
			else
			result.classList.add('anticopy');
	};		};
	frag.appendChild(title);		frag.appendChild(title);
			frag.appendChild(msg);
	frag.appendChild(input1);		frag.appendChild(input1);
	frag.appendChild(input2);		frag.appendChild(input2);
			frag.appendChild(result);
	frag.appendChild(btn);		frag.appendChild(btn);
	~~frag.appendChild(result);~~
	title.appendChild(subtitle);		title.appendChild(subtitle);
	~~title.appendChild(msg);~~
	div.appendChild(frag);		div.appendChild(frag);
	}		}

Salt lovely：测试中

2021-04-10T09:18:24Z

测试中

新页面

<noinclude><div class="salt-textDiffTool">这里是盐酱牌文字调色板</div>{{#Widget:SaltTextDiffPalette}}</noinclude><includeonly><style>
.salt-textDiffTool.done{font-size:1rem}.salt-textDiffTool.done .title{width:100%;font-size:1.2rem}.salt-textDiffTool.done .title .subtitle{width:100%;display:inline-block;font-size:1rem}.salt-textDiffTool.done .title .message{width:100%;display:inline-block;font-size:0.875rem}.salt-textDiffTool.done .origin,.salt-textDiffTool.done .edited{width:33%;display:inline-block}.salt-textDiffTool.done .result{width:33%;display:inline-block}.salt-textDiffTool.done .result .delete{color:#333;background-color:#feea;text-decoration:line-through}.salt-textDiffTool.done .result .insert{color:#333;background-color:#efea;text-decoration:underline}.salt-textDiffTool.done .result .normal{color:#222}.salt-textDiffTool.done .result.anticopy .delete{color:#666}.salt-textDiffTool.done .result.anticopy .insert{background-color:#cfcd;text-decoration:none}.salt-textDiffTool.done .result.anticopy .normal{color:crimson;text-decoration:underline}
</style><script>"use strict";
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
(function () {
let updateHistory = `
///////////////////////////////////////////////////////////////
// 作者：Salt_lovely
// 许可证：AGPL v3
// typescript 4.2
///////////////////////////////////////////////////////////////
// 借物表：
// 快速Levenshtein距离算法根据如下思路编写：
// - https://www.codeproject.com/Articles/13525/Fast-memory-efficient-Levenshtein-algorithm-2
// - 2012年3月26日
// - 作者：Sten Hjelmqvist
// - 许可证：CPOL
// JSDiff快速字符串匹配：
// - https://github.com/kpdecker/jsdiff
// - 作者：kpdecker
// - 许可证：BSD
///////////////////////////////////////////////////////////////`;
let prefix = '[盐的文字调色板]';
let ver = '0.1.0';
function main() {
version();
history();
let _a_ = Array.from(document.querySelectorAll('.salt-textDiffTool:not(.done)'));
for (let div of _a_) {
div.classList.add('done');
let _name = div.textContent;
let frag = document.createDocumentFragment();
let title = document.createElement('div'), subtitle = document.createElement('span'), msg = document.createElement('span');
let input1 = document.createElement('textarea'), input2 = document.createElement('textarea');
let btn = document.createElement('button'), result = document.createElement('div');
title.className = 'title';
title.textContent = prefix + _name;
title.style.fontWeight = 'bold';
subtitle.className = 'subtitle';
msg.className = 'message';
input1.className = 'origin';
input2.className = 'edited';
result.className = 'result';
btn.textContent = '开始调色';
result.style.whiteSpace = 'pre-wrap';
let changeEventLevenshteinDistance = function () {
let str1 = input1.value, str2 = input2.value, LevenshteinDistance = fastLevenshteinDistance(str1, str2);
subtitle.textContent = 'Levenshtein距离: ' + LevenshteinDistance +
' 字符, 占比: ' + round(LevenshteinDistance / str1.length * 100, 2) + '%(对比原文), ' +
round(LevenshteinDistance / str2.length * 100, 2) + '%(对比后文), 快速Levenshtein距离算法, 可能有误';
};
let changeEventDiffColor = function () {
return __awaiter(this, void 0, void 0, function* () {
let str1 = input1.value, str2 = input2.value;
if (input1.value.length > 1024 || input2.value.length > 1024)
result.textContent = '正在处理中';
let res = textDiffColor(str1, str2);
result.textContent = '';
result.appendChild(res);
});
};
let trigger = function () {
msg.textContent = '';
if (input1.value.length < 8192 && input2.value.length < 8192)
changeEventLevenshteinDistance();
else
msg.textContent += '内容太多, 不再同步计算Levenshtein距离\n';
if (input1.value.length < 1024 && input2.value.length < 1024)
changeEventDiffColor();
else
msg.textContent += '内容太多, 不再同步处理调色板\n';
};
input1.oninput = trigger;
input2.oninput = trigger;
btn.onclick = function () {
msg.textContent = '处理中';
input1.disabled = true;
input2.disabled = true;
changeEventLevenshteinDistance();
changeEventDiffColor();
input1.disabled = false;
input2.disabled = false;
msg.textContent = '处理完毕';
};
frag.appendChild(title);
frag.appendChild(input1);
frag.appendChild(input2);
frag.appendChild(btn);
frag.appendChild(result);
title.appendChild(subtitle);
title.appendChild(msg);
div.appendChild(frag);
}
}
function fastLevenshteinDistance(str1 = '', str2 = '') {
var _a;
assert(typeof str1 === 'string', 'fastLevenshteinDistance输入的第一个参数不是字符串');
assert(typeof str2 === 'string', 'fastLevenshteinDistance输入的第二个参数不是字符串');
str1 = str1.toLocaleLowerCase().trim();
str2 = str2.toLocaleLowerCase().trim();
let n = str1.length, m = str2.length;
if (n > m) {
let temp = str1;
str1 = str2;
str2 = temp;
n = str1.length;
m = str2.length;
}
if (m == 0)
return n;
else if (n == 0)
return m;
let v0 = [];
let v1 = new Array(n + 1);
let cost;
for (let i = 0; i <= m; i++) {
v0[i] = i;
}
for (let i = 0; i < n; i++) {
if (i > 0)
v0 = v1.slice(0);
v1[0] = i + 1;
for (let j = 0; j < m; j++) {
if (str1[i] == str2[j])
cost = 0;
else
cost = 1;
v1[j + 1] = Math.min(v1[j] + 1, v0[j + 1] + 1, v0[j] + cost);
}
}
return (_a = v1.pop()) !== null && _a !== void 0 ? _a : 0;
}
function textDiffColor(str1 = '', str2 = '') {
if (typeof window.Diff !== 'object')
alert('JSDiff尚未下载...请稍后或刷新页面');
let res = window.Diff.diffChars(str1, str2);
let frag = document.createDocumentFragment();
for (let i = 0; i < res.length; i++) {
let text = document.createElement('span');
if (res[i].added && res[i + 1] && res[i + 1].removed) {
let temp = res[i];
res[i] = res[i + 1];
res[i + 1] = temp;
}
text.textContent = res[i].value;
if (res[i].removed)
text.className = 'delete';
else if (res[i].added)
text.className = 'insert';
else
text.className = 'normal';
frag.appendChild(text);
}
return frag;
}
function round(n, p = 0) {
let e = Math.pow(10, p);
return Math.round.call(null, n * e) / e;
}
function assert(condition, msg) {
if (!condition)
throw new Error(prefix + ': ' + (msg !== null && msg !== void 0 ? msg : '发生错误'));
}
function log(msg) {
let t = typeof msg;
let p = prefix + ': ';
if (t == 'boolean' || t == 'number' || t == 'string') {
console.log(p + msg);
}
else if (t == 'object') {
console.log(p, msg);
}
else if (msg instanceof Array) {
console.log(p + '[' + msg.join(', ') + ']');
}
else if (t == 'undefined') {
console.log(p + 'undefined');
}
else {
console.log(p);
console.log(msg);
}
}
function history() {
log(updateHistory);
}
function version() {
log(ver);
}
function addScript(s) {
let scr = document.createElement('script');
scr.src = s;
document.head.appendChild(scr);
}
document.addEventListener('readystatechange', main);
})();
</script></includeonly>

微件:SaltTextDiffPalette - 版本历史

Salt lovely：​.

Salt lovely：​.

Salt lovely：​测试中

Salt lovely：.

Salt lovely：.

Salt lovely：测试中