☰

Geekhub Markdown Editor

add CodeMirror Editor for comment & topic

安装此脚本？
作者推荐脚本

您可能也喜欢Geekhub。

安装此脚本 
  1. // ==UserScript==
  2. // @name     Geekhub Markdown Editor
  3. // @namespace https://geekhub.com/
  4. // @version  4
  5. // @description  add CodeMirror Editor for comment & topic
  6. // @author       dallaslu
  7. // @match        https://geekhub.com/*
  8. // @match        https://www.geekhub.com/*
  9. // @grant        none
  10. // @require      https://cdn.jsdelivr.net/npm/codemirror/lib/codemirror.min.js
  11. // @require      https://cdn.jsdelivr.net/npm/codemirror/mode/markdown/markdown.js
  12. // @require      https://cdn.jsdelivr.net/npm/codemirror/mode/gfm/gfm.js
  13. // @require      https://cdn.jsdelivr.net/npm/codemirror/addon/mode/overlay.js
  14. // ==/UserScript==
  15.  
  16. (function() {
  17. 	'use strict';
  18.   
  19.   	var ghSchemeButtons = {
  20.         'light': 'dark',
  21.         'dark': 'darcula',
  22.         'solar': 'darcula',
  23.         'ocean': 'darcula',
  24.         'jade': 'default'
  25.     };
  26.  
  27.     function init() {
  28.       	var cmElement = document.querySelector('.CodeMirror');
  29.       	if(!cmElement){
  30.             var textElement = document.getElementById('comment-box') 
  31.                 || document.getElementById('post_content')
  32.                 || document.getElementById('second_hand_content')
  33.                 || document.getElementById('molecule_content')
  34.                 || document.getElementById('group_buy_content')
  35.                 || document.getElementById('service_content');
  36.           
  37.           	if(textElement){
  38. 				var theme = '';
  39.                 for (var btn in ghSchemeButtons) {
  40.                     var schemeBtn = document.getElementById(btn);
  41.                     if (schemeBtn && !schemeBtn.classList.contains('hidden')) {
  42.                         theme = ghSchemeButtons[btn];
  43.                         break;
  44.                     }
  45.                 }
  46.  
  47. 				theme = theme || 'darcula';
  48.               
  49.               	loadStyles('https://cdn.jsdelivr.net/npm/codemirror/lib/codemirror.css');
  50.               	loadStyles('https://cdn.jsdelivr.net/npm/codemirror/theme/darcula.css');
  51.               
  52.       			var cm = CodeMirror.fromTextArea(textElement, {
  53.     				mode : {
  54. 						name : "gfm",
  55. 						tokenTypeOverrides : {
  56. 							emoji : "emoji"
  57. 						}
  58. 					},
  59. 					lineWrapping : true,
  60. 					lineNumbers : false,
  61.               	    theme: theme
  62.        		 	});
  63.               
  64.               	cm.on('change', function(){
  65.             		cm.save();
  66.                 });
  67.               	
  68.               	// TODO clear with textarea after submit
  69.             }
  70.         }
  71.     }
  72.   
  73.   	function loadStyles(url) {
  74. 		var link = document.createElement("link");
  75. 		link.type = "text/css";
  76. 		link.rel = "stylesheet";
  77. 		link.href = url;
  78. 		var head = document.getElementsByTagName("head")[0];
  79. 		head.appendChild(link);
  80. 	}
  81.  
  82.     var observer = new MutationObserver(function(doc, observer) {
  83. 		init();
  84.     });
  85.  
  86.     observer.observe(document, {
  87.         characterData: true,
  88.         childList: true,
  89.         attributes: true,
  90.         subtree: true,
  91.         attributeOldValue: true,
  92.         characterDataOldValue: true
  93.     });
  94.  
  95.     init();
  96. })();