☰

GitHub Editor - Change Default Settings

change default settings for the github editor

Verze ze dne 06. 03. 2018. Zobrazit nejnovější verzi.

  1. // ==UserScript==
  2. // @name         GitHub Editor - Change Default Settings
  3. // @namespace    https://greatest.deepsurf.us/users/649
  4. // @version      1.1.1
  5. // @description  change default settings for the github editor
  6. // @author       Adrien Pyke
  7. // @match        *://github.com/*/new/*
  8. // @match        *://github.com/*/edit/*
  9. // @grant        GM_getValue
  10. // @grant        GM_setValue
  11. // @grant        GM_registerMenuCommand
  12. // @require      https://cdn.rawgit.com/fuzetsu/userscripts/477063e939b9658b64d2f91878da20a7f831d98b/wait-for-elements/wait-for-elements.js
  13. // ==/UserScript==
  14.  
  15. (() => {
  16. 	'use strict';
  17.  
  18. 	const loadConfig = function() {
  19. 		let defaults = {
  20. 			indentMode: 'tab',
  21. 			indentWidth: 4,
  22. 			wrapMode: 'off'
  23. 		};
  24.  
  25. 		let cfg = GM_getValue('cfg');
  26. 		if (!cfg) return defaults;
  27.  
  28. 		return JSON.parse(cfg);
  29. 	};
  30.  
  31. 	const saveConfig = function(cfg) {
  32. 		GM_setValue('cfg', JSON.stringify(cfg));
  33. 	};
  34.  
  35. 	const setup = function() {
  36. 		const createContainer = function() {
  37. 			let div = document.createElement('div');
  38. 			div.style.backgroundColor = 'white';
  39. 			div.style.padding = '5px';
  40. 			div.style.border = '1px solid black';
  41. 			div.style.position = 'fixed';
  42. 			div.style.top = '0';
  43. 			div.style.right = '0';
  44. 			div.style.zIndex = 99999;
  45. 			return div;
  46. 		};
  47.  
  48. 		const createSelect = function(label, options, value) {
  49. 			let select = document.createElement('select');
  50. 			select.style.margin = '2px';
  51. 			let optgroup = document.createElement('optgroup');
  52. 			if (label) {
  53. 				optgroup.setAttribute('label', label);
  54. 			}
  55. 			select.appendChild(optgroup);
  56. 			options.forEach(opt => {
  57. 				let option = document.createElement('option');
  58. 				option.setAttribute('value', opt.value);
  59. 				option.textContent = opt.text;
  60. 				optgroup.appendChild(option);
  61. 			});
  62. 			select.value = value;
  63. 			return select;
  64. 		};
  65.  
  66. 		const createButton = function(text, onclick) {
  67. 			let button = document.createElement('button');
  68. 			button.style.margin = '2px';
  69. 			button.textContent = text;
  70. 			button.onclick = onclick;
  71. 			return button;
  72. 		};
  73.  
  74. 		const createLineBreak = function() {
  75. 			return document.createElement('br');
  76. 		};
  77.  
  78. 		const init = function(cfg) {
  79. 			let div = createContainer();
  80.  
  81. 			let indentMode = createSelect('Indent mode', [
  82. 				{ value: 'space', text: 'Spaces' },
  83. 				{ value: 'tab', text: 'Tabs' }
  84. 			], cfg.indentMode);
  85. 			div.appendChild(indentMode);
  86.  
  87. 			let indentWidth = createSelect('Indent size', [
  88. 				{ value: 2, text: 2 },
  89. 				{ value: 4, text: 4 },
  90. 				{ value: 8, text: 8 }
  91. 			], cfg.indentWidth);
  92. 			div.appendChild(indentWidth);
  93.  
  94. 			let wrapMode = createSelect('Line wrap mode', [
  95. 				{ value: 'off', text: 'No wrap' },
  96. 				{ value: 'on', text: 'Soft wrap' }
  97. 			], cfg.wrapMode);
  98. 			div.appendChild(wrapMode);
  99.  
  100. 			div.appendChild(createLineBreak());
  101.  
  102. 			div.appendChild(createButton('Save', () => {
  103. 				let settings = {
  104. 					indentMode: indentMode.value,
  105. 					indentWidth: indentWidth.value,
  106. 					wrapMode: wrapMode.value
  107. 				};
  108. 				saveConfig(settings);
  109. 				div.remove();
  110. 			}));
  111.  
  112. 			div.appendChild(createButton('Cancel', () => div.remove()));
  113.  
  114. 			document.body.appendChild(div);
  115. 		};
  116. 		init(loadConfig());
  117. 	};
  118.  
  119. 	const updateDropdown = function(dropdown, value) {
  120. 		dropdown.value = value;
  121. 		let evt = document.createEvent('HTMLEvents');
  122. 		evt.initEvent('change', false, true);
  123. 		dropdown.dispatchEvent(evt);
  124. 	};
  125.  
  126. 	const applySettings = function(cfg) {
  127. 		let indentMode = document.querySelector('.js-code-indent-mode');
  128. 		let indentWidth = document.querySelector('.js-code-indent-width');
  129. 		let wrapMode = document.querySelector('.js-code-wrap-mode');
  130.  
  131. 		if (location.href.match(/^https?:\/\/github.com\/[^/]*\/[^/]*\/new\/.*/)) {
  132. 			// new file
  133. 			updateDropdown(indentMode, cfg.indentMode);
  134. 			updateDropdown(indentWidth, cfg.indentWidth);
  135. 			updateDropdown(wrapMode, cfg.wrapMode);
  136. 		} else if (location.href.match(/^https?:\/\/github.com\/[^/]*\/[^/]*\/edit\/.*/)) {
  137. 			// edit file
  138. 			// if the file is using space indentation we don't want to change it
  139. 			if (indentMode.value === 'tab') {
  140. 				updateDropdown(indentWidth, cfg.indentWidth);
  141. 			}
  142. 			updateDropdown(wrapMode, cfg.wrapMode);
  143. 		}
  144. 	};
  145.  
  146. 	GM_registerMenuCommand('GitHub Editor Settings', setup);
  147. 	let settings = loadConfig();
  148.  
  149. 	waitForElems({
  150. 		sel: '.CodeMirror-code',
  151. 		onmatch() {
  152. 			applySettings(settings);
  153. 		}
  154. 	});
  155. })();