☰

GitHub Editor - Change Default Settings

change default settings for the github editor

As of 2016-08-16. See the latest version.

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