🏠 Home 

其乐编辑器增加渐变字功能

让其乐论坛的高级编辑框可直接发彩色渐变字。


安装此脚本?
  1. // ==UserScript==
  2. // @name 其乐编辑器增加渐变字功能
  3. // @namespace http://tampermonkey.net/
  4. // @version 0.6
  5. // @description 让其乐论坛的高级编辑框可直接发彩色渐变字。
  6. // @author 软妹币玩家、美豆、wavice
  7. // @match *://keylol.com/forum.php*
  8. // @grant GM_getValue
  9. // @grant GM_setValue
  10. // ==/UserScript==
  11. (function () {
  12. 'use strict';
  13. var parseColor = function (hexStr) {
  14. return hexStr.length === 4 ? hexStr.substr(1).split('').map(function (s) { return 0x11 * parseInt(s, 16); }) : [hexStr.substr(1, 2), hexStr.substr(3, 2), hexStr.substr(5, 2)].map(function (s) { return parseInt(s, 16); })
  15. };
  16. // zero-pad 1 digit to 2
  17. var pad = function (s) {
  18. return (s.length === 1) ? '0' + s : s;
  19. };
  20. var gradientColors = function (start, end, steps, gamma) {
  21. var i, j, ms, me, output = [], so = [];
  22. gamma = gamma || 1;
  23. var normalize = function (channel) {
  24. return Math.pow(channel / 255, gamma);
  25. };
  26. start = parseColor(start).map(normalize);
  27. end = parseColor(end).map(normalize);
  28. for (i = 0; i < steps; i++) {
  29. ms = i / (steps - 1);
  30. me = 1 - ms;
  31. for (j = 0; j < 3; j++) {
  32. so[j] = pad(Math.round(Math.pow(start[j] * me + end[j] * ms, 1 / gamma) * 255).toString(16));
  33. }
  34. output.push('#' + so.join(''));
  35. }
  36. return output;
  37. };
  38. // try if it works
  39. //console.log(gradientColors('#00ff00', '#ff0000', 100));
  40. var startColor = GM_getValue('startColor') || '#0080FF';
  41. var endColor = GM_getValue('endColor') || '#FF80FF';
  42. function ConvertGrantWord(str) {
  43. var arr = gradientColors(startColor, endColor, str.length);
  44. var r###lt = '';
  45. for (var j = 0; j < str.length; j++) {
  46. r###lt += "[color=" + arr[j] + "]" + str[j] + "[/color]"
  47. }
  48. return r###lt;
  49. }
  50. /*insertText(r###lt, 0, 0);
  51. switchEditor(0);
  52. switchEditor(1);
  53. console.log(r###lt);*/
  54. var div = document.createElement('div');
  55. div.setAttribute('style', 'padding: 0 3px;');
  56. var a = document.createElement('a');
  57. a.setAttribute('id', editorid + '_gradient');
  58. a.setAttribute('title', '添加渐变文字');
  59. a.setAttribute('href', 'javascript:;');
  60. a.setAttribute('style', 'background: transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ4IDc5LjE2NDAzNiwgMjAxOS8wOC8xMy0wMTowNjo1NyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjAgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjU5N0RGNDc1QTI1MDExRUE5Nzg1RUY1Q0Q3NTZDQkM5IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjU5N0RGNDc2QTI1MDExRUE5Nzg1RUY1Q0Q3NTZDQkM5Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NTk3REY0NzNBMjUwMTFFQTk3ODVFRjVDRDc1NkNCQzkiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NTk3REY0NzRBMjUwMTFFQTk3ODVFRjVDRDc1NkNCQzkiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5C+Sk1AAAEBklEQVR42syUbUxbVRjH//f2tvSdl0AHrWM0bBRw2hYI4As0YrItDujYYHWbkeAGJn5QEp0BY2Ji9MOyQBaa+PJhM8YpjZrwYTCdTifNtlRBtmyZrkKRVZjQDixtb6GF9njuzZj0+z54kufee16e3/0/z3nOYQgheJiNxcNugkLB3jWfwDPq5+gIM0gfYSV0R9pRiRfVFhgyS7EdhcgTHBhqJW1Afp3Q+0BYy6qKDjGP7BI5D4BthsMwsIWnj3QcJmcHPyMVlTVBJdij5aqtKMsxi0DdRjycnj5UXx9ytBLX4OfEajEHIVH3CpwHIS8sz2M+NWcrKi6CaXsp3njz1dziOuvAb/xfL8siEkioNJISl6qwftfddfTAgTbH89hRUorsTEUuklGr+K8NoJJTQo6Mv6ORaPHMzAxkkgy8092jHEg5P3Jfcbffz7ewg9ret3rKK6yVWF1NQFgbTyQFxL004PpaAjxifJSPil7+O3dg0BvQuK8RhaatT7AMB4Zw0CgVePwxM5aWlrCysgKj0YhgMCAgQmnA6/x419O1thKT0QQJy8JisSArKwtNzU1YXFxEMpkES8dTqRT8fj9qa2sRDofh8XjQ1GTHhe9/qkkD3sPSx7uaG2DZaYVGqxEd4vE4+vv74XA4oFAoUFBQgEAggPr6ehHkdrtRVVUFk6kUsdX1hrSyoW255+1eMhcKkbvhMJny+cie3buFCeKj3zRE0t3dTYaHh8nY2BjJ0mqJiprQbnq9ZJ/dHhE43OaSlDIscqkqqYTD0LXruHbjBjo6OsTQ5XI5RkdHYTab6WaswrBtG1r27gUiUWhpKpL3VW0GZmarFJBd8QC+aVibG3H7z2n4vX+A53lxE1wuF/R6PSYmJjB89Sr0k1PAgBOFzzYgo2CLOu3oFUL7zZhnAtPxGFBpBSuVQFDc0tICp9OJvr4+MZcjIyOw2Wy4fPEiZMYipMrLcPnXccx5veG0HL6vO4g8Tuqyv/RC/NbsLKGqxPy0trYSnU5H8vPzxTfdGJKTk0N+8XjE+aFLP5AtOm2UBvuewGE2bptTB4/hx9uXcO7m9M+vvX68urOjHdFoFLFYDHyMF4+whGXEMY1GA11eHpbDIXR2dmHKN98jNdSdSMx+9x8wi+ZvZSWOBCGeTK2mBgxD6ywCqgoqlZp2KZKVgqdrJCyHtbU4dU7EF+aDnRJ93ZfKAmM8PH56c9nIqASaV1azg3Zute7fT86c+YQ89WS1MPkVtXaNVkdOnvqQvNJ9nI5JqakqkKGHYqcd2upjSC8bOYWl1ik3e5JJ5TXP+ANffHv+fFkwuCgUwySnfvRTTpGUj14YOhla/ocqpu7yot/BMVgLLiApi4gY5n9/Y/8rwACYitOak/ly8QAAAABJRU5ErkJggg==) no-repeat 0 0;width: 20px;height: 20px;float: left;border: 1px solid #fcfcfc;overflow: hidden;');
  61. //a.innerText = "渐变字";
  62. div.appendChild(a);
  63. document.getElementById(editorid + "_controls").appendChild(div);
  64. a.addEventListener('click', function () {
  65. showEditorMenu2();
  66. //doane();
  67. }, false);
  68. function showEditorMenu2() {
  69. var ctrlid = editorid + '_gradient';
  70. var menutype = 'menu';
  71. var menupos = '43!';
  72. var menu = document.createElement('div');
  73. menu.id = ctrlid + '_menu';
  74. menu.style.display = 'none';
  75. menu.className = 'p_pof upf';
  76. menu.style.width = '270px';
  77. s = '<div class="p_opt cl"><span class="y" style="margin:-10px -10px 0 0"><a onclick="hideMenu();return false;" class="flbc" href="javascript:;">关闭</a></span><div>' + '请输入要插入的渐变字:<br /><textarea id="' + ctrlid + '_param_1" style="width: 98%" cols="50" rows="5" class="txtarea"></textarea>' + '</div><div style="width: 50%; display: inline-block;">起始色:<input id="' + ctrlid + '_start_color" type="color" value="' + startColor + '"></div><div style="width: 50%; display: inline-block;">终止色:<input id="' + ctrlid + '_end_color" type="color" value="' + endColor + '"></div><div class="pns mtn"><button type="submit" id="' + ctrlid + '_submit" class="pn pnc"><strong>提交</strong></button></div></div>';
  78. menu.innerHTML = s;
  79. $(editorid + '_editortoolbar').appendChild(menu);
  80. showMenu({
  81. 'ctrlid': ctrlid,
  82. 'mtype': menutype,
  83. 'evt': 'click',
  84. 'duration': 3,
  85. 'cache': 0,
  86. 'drag': 1,
  87. 'pos': menupos
  88. });
  89. try {
  90. if ($(ctrlid + '_param_1')) {
  91. $(ctrlid + '_param_1').focus();
  92. }
  93. } catch (e) { }
  94. var objs = menu.getElementsByTagName('*');
  95. for (var i = 0; i < objs.length; i++) {
  96. _attachEvent(objs[i], 'keydown',
  97. function (e) {
  98. var obj = e.target;
  99. if ((obj.type == 'text' && e.keyCode == 13) || (obj.type == 'textarea' && e.ctrlKey && e.keyCode == 13)) {
  100. if ($(ctrlid + '_submit') && tag != 'image') $(ctrlid + '_submit').click();
  101. doane(e);
  102. } else if (e.keyCode == 27) {
  103. hideMenu();
  104. doane(e);
  105. }
  106. });
  107. }
  108. if ($(ctrlid + '_submit')) $(ctrlid + '_submit').onclick = function () {
  109. checkFocus();
  110. if (!str) {
  111. str = '';
  112. var first = $(ctrlid + '_param_1').value;
  113. var str = ConvertGrantWord(first);
  114. var txt = getSel();
  115. //insertText((opentag + str + closetag), strlen(opentag), strlen(closetag), true, sel);
  116. insertText(str, str.length, 0, false , txt);
  117. switchEditor(0);
  118. switchEditor(1);
  119. hideMenu();
  120. }
  121. }
  122. if ($(ctrlid + '_start_color')) $(ctrlid + '_start_color').onchange = function () {
  123. startColor = this.value;
  124. GM_setValue('startColor', startColor);
  125. }
  126. if ($(ctrlid + '_end_color')) $(ctrlid + '_end_color').onchange = function () {
  127. endColor = this.value;
  128. GM_setValue('endColor', endColor);
  129. }
  130. }
  131. // Your code here...
  132. })();