markdown bahamut

在舊版小屋的右側新增 markdown 編輯器!

目前为 2021-09-20 提交的版本。查看 最新版本

  1. // ==UserScript==
  2. // @name markdown bahamut
  3. // @namespace http://home.gamer.com.tw/ding890326
  4. // @version 0.1
  5. // @description 在舊版小屋的右側新增 markdown 編輯器!
  6. // @author YOWJUORN (遊隼)
  7. // @match https://home.gamer.com.tw/creationNew1.php
  8. // @match https://home.gamer.com.tw/creationEdit1.php?sn=*
  9. // @require https://cdn.jsdelivr.net/npm/marked/marked.min.js
  10. // ==/UserScript==
  11.  
  12. var body_editstyle;
  13. var textarea_source;
  14. var textarea_markdown;
  15. var standard_html;
  16.  
  17. (function () {
  18. add_aside_editor();
  19. })();
  20.  
  21. function add_aside_editor() {
  22. var div_aside = document.getElementById('BH-slave');
  23. var div_aside_gads = document.getElementById('flySalve');
  24.  
  25. var h5_markdown_title = document.createElement('h5');
  26. h5_markdown_title.innerHTML = 'Markdown 編輯器';
  27. div_aside.insertBefore(h5_markdown_title, div_aside_gads);
  28.  
  29. textarea_markdown = document.createElement('textarea');
  30. textarea_markdown.hidden = true;
  31. textarea_markdown.style.width = '298px';
  32. textarea_markdown.style.height = '568px';
  33. textarea_markdown.style.resize = 'vertical';
  34. textarea_markdown.style.backgroundColor = '#1E1E1E';
  35. textarea_markdown.style.color = '#D4D4D4';
  36. textarea_markdown.style.fontFamily = 'Courier New';
  37. textarea_markdown.addEventListener('input', textarea_markdown_ischange);
  38. div_aside.insertBefore(textarea_markdown, div_aside_gads);
  39.  
  40. var new_div = document.createElement('div');
  41. new_div.classList.add('BH-rbox');
  42. new_div.classList.add('MSG-list2');
  43. new_div.innerHTML = '<a href="//home.gamer.com.tw/ding890326" target="_blank"><img src="https://avatar2.bahamut.com.tw/avataruserpic/d/i/ding890326/ding890326.png" class="MSG-myavatar"></a>' +
  44. '<ul class="MSG-mydata1">'+
  45. '<li>擴充作者:<span class="TS2">游隼</span></li>'+
  46. '<li>勇者評價:<a href="heartList.php?owner=ding890326" target="_blank" class="AT2">4</a><br>'+
  47. '<br><span class="AT1">~~歡迎來我的小屋玩~~</span></li>'+
  48. '<li>都 2120 年了<br>'+
  49. '巴哈還不支援 Markdown<br>'+
  50. '這是一個單向 (md>巴哈)<br>'+
  51. '的 Markdown 編輯器<br>'+
  52. '有 bug 可以回報小屋</li>'+
  53. '</ul>';
  54. div_aside.insertBefore(new_div, div_aside_gads);
  55.  
  56. var button_initialization_mdeditor = document.createElement('button');
  57. button_initialization_mdeditor.innerHTML = '我知道了';
  58. button_initialization_mdeditor.style.width = '100%';
  59. button_initialization_mdeditor.onclick = function () {
  60. body_editstyle = window.frames[0].document.body;
  61. textarea_source = document.getElementById('source');
  62. textarea_source.addEventListener('input', textarea_source_ischange);
  63. new_div.hidden = true;
  64. textarea_markdown.hidden = false;
  65. };
  66. new_div.appendChild(button_initialization_mdeditor);
  67. }
  68.  
  69. function textarea_source_ischange() {
  70. //textarea_markdown.value = bahacode_to_markdown(textarea_source.value);
  71. }
  72.  
  73. function textarea_markdown_ischange() {
  74. marked.setOptions({gfm: true});
  75. standard_html = marked(textarea_markdown.value);
  76. standard_html = bahaize.p(standard_html);
  77. standard_html = bahaize.em(standard_html);
  78. standard_html = bahaize.strong(standard_html);
  79. standard_html = bahaize.table(standard_html);
  80. standard_html = bahaize.pre_code(standard_html);
  81. standard_html = bahaize.code(standard_html);
  82. body_editstyle.innerHTML = standard_html;
  83. }
  84.  
  85. var bahaize = {
  86. p: function (mdstr) {
  87. mdstr = mdstr.replaceAll('</p><p>', '<br/>');
  88. mdstr = mdstr.replaceAll('</p>\n<p>', '<br/>\n');
  89. mdstr = mdstr.replaceAll('<p>', '');
  90. mdstr = mdstr.replaceAll('</p>', '');
  91. return mdstr;
  92. },
  93. em: function (mdstr) {
  94. mdstr = mdstr.replaceAll('<em>', '<i>');
  95. mdstr = mdstr.replaceAll('</em>', '</i>');
  96. return mdstr;
  97. },
  98. strong: function (mdstr) {
  99. mdstr = mdstr.replaceAll('<strong>', '<b>');
  100. mdstr = mdstr.replaceAll('</strong>', '</b>');
  101. return mdstr;
  102. },
  103. blockquote: function (mdstr) {
  104. mdstr = mdstr.replaceAll('<blockquote>', '<tab>');
  105. mdstr = mdstr.replaceAll('</blockquote>', '</tab>');
  106. return mdstr;
  107. },
  108. table: function (mdstr) {
  109. mdstr = mdstr.replaceAll('<table>', '<table width="98%" cellspacing="1" cellpadding="1" border="1">');
  110. mdstr = mdstr.replaceAll('<td ', '<td bgcolor="#F4F4F4"');
  111. mdstr = mdstr.replaceAll('<td>', '<td bgcolor="#F4F4F4">');
  112. mdstr = mdstr.replaceAll('<th ', '<td bgcolor="#D5D5D5"');
  113. mdstr = mdstr.replaceAll('<th>', '<td bgcolor="#D5D5D5">');
  114. mdstr = mdstr.replaceAll('</th>', '</td>');
  115. mdstr = mdstr.replaceAll('</thead>\n<tbody>', '');
  116. mdstr = mdstr.replaceAll('<thead>', '<tbody>');
  117. return mdstr;
  118. },
  119. pre_code: function (mdstr) {
  120. mdstr = mdstr.replaceAll('<pre><code>', '<table width="98%" cellspacing="1" cellpadding="1" border="1"><tbody><tr bgcolor="#F4F4F4"><td><font style="color:#000000;"><font face="Courier New">');
  121. mdstr = mdstr.replaceAll('</code></pre>', '</font></font></td></tr></tbody></table>');
  122. return mdstr;
  123. },
  124. code: function (mdstr) {
  125. mdstr = mdstr.replaceAll('<code>', ' <font size="4"><font style="background-color:#F4F4F4;"><font style="color:#F4F4F4;">`</font><font style="color:#000000;"><font face="Courier New"><font size="3">');
  126. mdstr = mdstr.replaceAll('</code>', '</font></font><font style="color:#F4F4F4;">`</font></font></font></font> ');
  127. return mdstr;
  128. }
  129. };