☰

BroniesNL Customizer

Een user script om de interface (achtergrond, banner en kleur accenten) van Bronies.nl aan te passen en enkele problemen met het forum op te lossen.

  1. // ==UserScript==
  2. // @name        BroniesNL Customizer
  3. // @namespace   Ossie/BroniesNL/Customizer
  4. // @description Een user script om de interface (achtergrond, banner en kleur accenten) van Bronies.nl aan te passen en enkele problemen met het forum op te lossen.
  5. // @include     http://www.bronies.nl/*
  6. // @include     https://www.bronies.nl/*
  7. // @include     http://bronies.nl/*
  8. // @include     https://bronies.nl/*
  9. // @exclude     /\w*(gif|jpg|jpeg|png)/
  10. // @require     http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js
  11. // @require     //cdnjs.cloudflare.com/ajax/libs/datejs/1.0/date.min.js
  12. // @version     2.5
  13. // @grant       GM_getValue
  14. // @grant       GM_setValue
  15. // ==/UserScript==
  16.  
  17. var settings = {"background":"Official","cusback":"","banner":"Official","cusban":"","theme":"Normal","noimages":0,"limitimages":1,"bettertime":1};
  18. loadSettings();
  19.  
  20. var darkmod = [['body','color','#ddd'],['h2, h3','color','#ccc'],['.forumheader, .forumheader2, .forumheader3, .forumheader4, .fcaption, .finfobar', 'background-color','rgba(16,16,16,0.8)'],['.forumheader, .forumheader2, .forumheader3, .forumheader4, .fcaption, .finfobar', 'border','1px solid #2c65a4'],['#wrapper .smalltext','color','#ddd'],['#wrapper','border-radius','4px'],['.smalltext','color','#ddd'],['a:link, a:visited','color','#3f9aef'],['a:hover','color','#86bcef'],['#navigation','background-color',''],['.indent','background-color','rgba(0,0,0,0.1)'],['#wrapper','background','rgba(16,16,16,0.7)'],['.defaultform','background','rgba(255,255,255,0.1)'],['.npbutton','background','rgb(255,255,255)'],['#footer','background','url()'],['code span','color','#ddd']];
  21. var whitemod = [['body','color','#111'],['h2, h3','color','#222'],['.forumheader, .forumheader2, .forumheader3, .forumheader4, .fcaption, .finfobar', 'background-color','rgba(255,255,255,0.8)'],['.forumheader, .forumheader2, .forumheader3, .forumheader4, .fcaption, .finfobar', 'border','1px solid #AAA'],['#wrapper .smalltext','color','#111'],['#wrapper','border-radius','4px'],['.smalltext','color','#111'],['a:link, a:visited','color','#3f7aef'],['a:hover','color','#86bcef'],['#navigation','background-color',''],['.indent','background-color','rgb(255,255,255)'],['#wrapper','background','rgba(255,255,255,0.5)'],['.defaultform','background','rgba(255,255,255,0.4)'],['.npbutton','background','rgb(255,255,255)'],['#footer','background','url()']];
  22. var normal = [['body','color',''],['.forumheader, .forumheader2, .forumheader3, .forumheader4, .fcaption, .finfobar', 'background-color',''],['.forumheader, .forumheader2, .forumheader3, .forumheader4, .fcaption, .finfobar', 'border',''],['#wrapper .smalltext','color',''],['#wrapper','border-radius',''],['.smalltext','color',''],['a:link, a:visited','color',''],['a:hover','color',''],['#navigation','background-color',''],['.indent','background-color',''],['#wrapper','background',''],['.defaultform','background',''],['.npbutton','background',''],['#footer','background','']];
  23.  
  24. var themes = ["Dark Mod", "White Mod", "Normal"];
  25. var backgrounds = {"Dark Mod":"http://i.imgur.com/rc4ARbY.jpg","Official":"http://www.bronies.nl/e107_themes/leaf/images/background_mlp2.jpg","None - White":"http://i.imgur.com/GHpkydG.png","None - Grey":"http://i.imgur.com/8KvYUOS.png","None - Black":"http://i.imgur.com/7gMwArd.png"};
  26. var banners = {"Dark Mod":"http://i.imgur.com/QKNikxE.jpg","Official":"http://www.bronies.nl/e107_themes/leaf/images/01_header.png","Original":"http://i.imgur.com/Hiu5h1P.png","Rainbow Dash":"http://i.imgur.com/zIDVEHs.png","Luna/Zecora/Chrysalis":"http://i.imgur.com/JBfkwiX.png","Discord":"http://i.imgur.com/L3p8owm.jpg","None":""};
  27.  
  28. var optionsbutton = '<img class="customizerbutton" src="http://i.imgur.com/W3b3Sbv.png" style="position:absolute;right:0px;top:0px;z-index:1000;"></img>';
  29.  
  30. //0
  31. var sback = '';
  32. for(back in backgrounds){
  33. 	var sel = settings["background"] == back ? 'selected="selected"' : '';
  34. 	sback += '<option value="'+back+'" '+sel+'>'+back+'</option>';
  35. }
  36.  
  37. //2
  38. var sban = '';
  39. for(ban in banners){
  40. 	var sel = settings["banner"] == ban ? 'selected="selected"' : '';
  41. 	sban += '<option value="'+ban+'" '+sel+'>'+ban+'</option>';
  42. }
  43.  
  44. //4
  45. var st = '';
  46. for(t in themes){
  47. 	var sel = settings["theme"] == themes[t] ? 'selected="selected"' : '';
  48. 	st += '<option value="'+themes[t]+'" '+sel+'>'+themes[t]+'</option>';
  49. }
  50.  
  51. //5
  52. var sni = settings["noimages"] ? 'checked="yes"' : '';
  53. var sli = settings["limitimages"] ? 'checked="yes"' : '';
  54. var sbt = settings["bettertime"] ? 'checked="yes"' : '';
  55.  
  56. var options = format('<div class="customizeroptions" style="color:#FFF;text-align:left;display:none;position:absolute;right:0px;top:0px;z-index:999;background:rgba(50,50,50,0.6);border:1px solid rgba(150,150,150,0.5);padding:20px;">\
  57. <span>Background:</span>\
  58. <select name="cbackground" id="cbackground">{0}</select><BR>\
  59. <span>Custom Background:</span>\
  60. <input type="text" name="cusback" id="cusback" value="{1}"/><br><br>\
  61. <span>Banner:</span>\
  62. <select name="cbanner" id="cbanner">{2}</select><BR>\
  63. <span>Custom Banner:</span>\
  64. <input type="text" name="cusban" id="cusban" value="{3}"/><br><br>\
  65. <span>Theme:</span><select name="ctheme" id="ctheme">{4}</select><BR>\
  66. <input type="checkbox" name="cnoimages" id="cnoimages" {5}> Disable Images<br>\
  67. <input type="checkbox" name="climitimages" id="climitimages" {6}> Limit Images<br>\
  68. <input type="checkbox" name="cbettertime" id="cbettertime" {7}> Show Thread Age<br>\
  69. <button class="savesettings" value="Save">Save</button></div>',sback, settings["cusback"], sban, settings["cusban"], st, sni, sli, sbt);
  70.   
  71. showSettingsButton();
  72. applyTheme();
  73. applyBackground();
  74. applyBanner();
  75. fixImages();
  76. fixButtons();
  77. fixSpoiler();
  78. if(settings["bettertime"]) {
  79. 	betterTime();
  80. }
  81. if(settings["limitimages"]) {
  82. 	limitImages();
  83. }
  84. if(settings["noimages"]) {
  85. 	noImages();
  86. }
  87.  
  88. $(document).keydown(function(e) {
  89. 	if(!e.ctrlKey && e.altKey && e.keyCode >= 49 && e.keyCode <= 56){
  90. 		var value = e.keyCode - 48;
  91. 		if($('#post').length != 0) {
  92. 			$('#post').insertAtCaret('[img width='+value+'00][/img]');
  93. 			//$('#post').setCaret($('#post').getCursorPosition()-6);
  94. 		} else if(document.location.href.indexOf('/forum_viewtopic.php') != -1) {
  95. 			$('.forumheader3 form p .tbox').insertAtCaret('[img width='+value+'00][/img]');
  96. 			//$('#post').setCaret($('#post').getCursorPosition()-6);
  97. 		}
  98. 	}
  99. });
  100.  
  101. $('.customizeroptions span').css('width','130px').css('display','inline-block');
  102. $('.customizerbutton').click(showSettings);
  103. $('.savesettings').click(saveSettings);
  104.  
  105. function showSettingsButton() {
  106. 	$('body').append(optionsbutton).append(options);
  107. }
  108.  
  109. function showSettings(event) {
  110. 	if($('.customizeroptions').is(":visible")) {
  111. 		$('.customizeroptions').hide();
  112. 	} else {
  113. 		$('.customizeroptions').show();
  114. 	}
  115. }
  116.  
  117. function loadSettings() {
  118. 	var set = GM_getValue('settings');
  119. 	if(set != null) settings = JSON.parse(set);
  120. }
  121.  
  122. function saveSettings(event) {
  123. 	settings["background"] = $('#cbackground').find(":selected").text();
  124. 	settings["cusback"] = $('#cusback').val() != null && $('#cusback').val() != '' ? $('#cusback').val() : '';
  125. 	settings["banner"] = $('#cbanner').find(":selected").text();
  126. 	settings["cusban"] = $('#cusban').val() != null && $('#cusban').val() != '' ? $('#cusban').val() : '';
  127. 	settings["theme"] = $('#ctheme').find(":selected").text();
  128. 	settings["noimages"] = $('#cnoimages').prop('checked');
  129. 	settings["limitimages"] = $('#climitimages').prop('checked');
  130. 	settings["bettertime"] = $('#cbettertime').prop('checked');
  131. 	GM_setValue('settings',JSON.stringify(settings));
  132. 	applyBackground();
  133. 	applyBanner();
  134. 	applyTheme();
  135. 	if(settings["noimages"]) {
  136. 		noImages();
  137. 	}
  138. }
  139.  
  140. function applyTheme() {
  141. 	switch(settings["theme"]) {
  142. 		case("Dark Mod"):
  143. 			theme = darkmod;
  144. 		break;
  145. 		case("White Mod"):
  146. 			theme = whitemod;
  147. 		break;
  148. 		case("Normal"):
  149. 			theme = normal;
  150. 		break;
  151. 	}
  152. 	
  153. 	for(i = 0; i < theme.length; i++) {
  154. 		$(theme[i][0]).css(theme[i][1],theme[i][2]);
  155. 	}
  156.  
  157. }
  158.  
  159. function applyBackground() {
  160. 	var w = backgrounds[settings["background"]];
  161. 	if(settings["cusback"] != null && settings["cusback"] != "") w = settings["cusback"];
  162. 	$('body').css('background-image','url("'+w+'")');
  163. }
  164.  
  165. function applyBanner() {
  166. 	var b = banners[settings["banner"]];
  167. 	if(settings["cusban"] != null && settings["cusban"] != "") b = settings["cusban"];
  168. 	$('#header').css('background','url("'+b+'") no-repeat scroll 0% 0% transparent');
  169. }
  170.  
  171. function fixImages() {
  172. 	$('.forumheader2 img').each(function(index) {
  173. 		if($(this).attr('src').indexOf('nonew') != -1) {
  174. 			$(this).attr('src','http://i.imgur.com/yWQc5MT.png');
  175. 		} else if($(this).attr('src').indexOf('new.') != -1) {
  176. 			$(this).attr('src','http://i.imgur.com/FMUM9N9.png');
  177. 		}
  178. 	});
  179. 	
  180. 	$('.forumheader3 img').each(function(index) {
  181. 		if($(this).attr('src').indexOf('/nonew.png') != -1) {
  182. 			$(this).attr('src','http://i.imgur.com/yWQc5MT.png');
  183. 		} else if($(this).attr('src').indexOf('/new.png') != -1) {
  184. 			$(this).attr('src','http://i.imgur.com/FMUM9N9.png');
  185. 		} else if($(this).attr('src').indexOf('/sticky.png') != -1) {
  186. 			$(this).attr('src','http://i.imgur.com/h4cXlGk.png');
  187. 		} else if($(this).attr('src').indexOf('/announce.png') != -1) {
  188. 			$(this).attr('src','http://i.imgur.com/AnbFb3V.png');
  189. 		} else if($(this).attr('src').indexOf('/nonew_popular.png') != -1) {
  190. 			$(this).attr('src','http://i.imgur.com/8KxcQS7.png');
  191. 		} else if($(this).attr('src').indexOf('/new_popular.png') != -1) {
  192. 			$(this).attr('src','http://i.imgur.com/1J9BC2e.png');
  193. 		} else if($(this).attr('src').indexOf('/sticky_closed.png') != -1) {
  194. 			$(this).attr('src','http://i.imgur.com/GFh26F5.png');
  195. 		} else if($(this).attr('src').indexOf('/closed.png') != -1) {
  196. 			$(this).attr('src','http://i.imgur.com/SRLivKT.png');
  197. 		} else if($(this).attr('src').indexOf('/nonew_small.png') != -1) {
  198. 			$(this).attr('src','http://i.imgur.com/yWQc5MT.png');
  199. 		} else if($(this).attr('src').indexOf('/new_small.png') != -1) {
  200. 			$(this).attr('src','http://i.imgur.com/FMUM9N9.png');
  201. 		} else if($(this).attr('src').indexOf('/sticky_small.png') != -1) {
  202. 			$(this).attr('src','http://i.imgur.com/h4cXlGk.png');
  203. 		} else if($(this).attr('src').indexOf('/announce_small.png') != -1) {
  204. 			$(this).attr('src','http://i.imgur.com/AnbFb3V.png');
  205. 		} else if($(this).attr('src').indexOf('/nonew_popular_small.png') != -1) {
  206. 			$(this).attr('src','http://i.imgur.com/8KxcQS7.png');
  207. 		} else if($(this).attr('src').indexOf('/new_popular_small.png') != -1) {
  208. 			$(this).attr('src','http://i.imgur.com/1J9BC2e.png');
  209. 		} else if($(this).attr('src').indexOf('/sticky_closed_small.png') != -1) {
  210. 			$(this).attr('src','http://i.imgur.com/GFh26F5.png');
  211. 		} else if($(this).attr('src').indexOf('/closed_small.png') != -1) {
  212. 			$(this).attr('src','http://i.imgur.com/SRLivKT.png');
  213. 		} else if($(this).attr('src').indexOf('/e.png') != -1) {
  214. 			$(this).attr('src','http://i.imgur.com/5On2eOu.png');
  215. 		}
  216. 	});
  217. 	
  218. 	$('.forumheader3 img').each(function(index) {
  219. 		var src = $(this).attr('src');
  220. 		if(src.indexOf('lev1.') != -1) src = 'http://i.imgur.com/NT2kb0S.png';
  221. 		else if(src.indexOf('lev2') != -1) src = 'http://i.imgur.com/hDHNQSa.png';
  222. 		else if(src.indexOf('lev3') != -1) src = 'http://i.imgur.com/S83Bn9u.png';
  223. 		else if(src.indexOf('lev4') != -1) src = 'http://i.imgur.com/ESAMXeC.png';
  224. 		else if(src.indexOf('lev5') != -1) src = 'http://i.imgur.com/v8yUi3S.png';
  225. 		else if(src.indexOf('lev6') != -1) src = 'http://i.imgur.com/rqfI3dR.png';
  226. 		else if(src.indexOf('lev7') != -1) src = 'http://i.imgur.com/MJhubYv.png';
  227. 		else if(src.indexOf('lev8') != -1) src = 'http://i.imgur.com/jCy7qZR.png';
  228. 		else if(src.indexOf('lev9') != -1) src = 'http://i.imgur.com/pKd6f15.png';
  229. 		else if(src.indexOf('lev10') != -1) src = 'http://i.imgur.com/HM4MyzB.png';
  230. 		$(this).attr('src',src);
  231. 	});
  232. 	
  233. 	$('table tbody tr td a img').each(function(index) {
  234. 		if($(this).attr('src').indexOf('reply.') != -1) {
  235. 			$(this).attr('src','http://i.imgur.com/ppch3ZE.png');
  236. 		} else if($(this).attr('src').indexOf('newthread.') != -1) {
  237. 			$(this).attr('src','http://i.imgur.com/lpuuHS9.png');
  238. 		}
  239. 	});
  240. }
  241.  
  242. function fixButtons() {
  243. 	$('#navigation ul li a')
  244. 		.css('top','32px')
  245. 		.css('background','rgba(255,255,255,0.3)')
  246. 		.css('border','1px solid rgba(127,127,127,0.7)')
  247. 		.css('width','102px')
  248. 		.css('height','23px')
  249. 		.css('line-height','23px');
  250. 	$('.nav1_onpage a, .nav2_onpage a, .nav3_onpage a, .nav4_onpage a, .nav5_onpage a')
  251. 		.css('top','32px')
  252. 		.css('background','rgba(255,255,255,0.4)')
  253. 		.css('border','1px solid rgba(127,127,127,0.7)')
  254. 		.css('width','102px')
  255. 		.css('height','23px')
  256. 		.css('line-height','23px')
  257. 		.css('margin','0px');
  258. }
  259.  
  260. function betterTime() {
  261. 	var now = new Date();
  262. 	if(document.location.href.indexOf('/forum.php') != -1) {
  263. 		$('.forumheader3 .smallblacktext').each(function(index) {
  264. 			var t = $(this).text();
  265. 			console.log('1');
  266. 			if(t.indexOf('Edited') == -1) {
  267. 				console.log('2');
  268. 				if(t.indexOf(':') != -1) {
  269. 					var d = Date.parseExact(t.substring(4,t.indexOf(':')+5),'MMM dd yyyy, hh:mmtt');
  270. 					console.log(t.substring(4,t.indexOf(':')+5));
  271. 					var dif = Math.floor(Math.abs(now - d)/1000/60);
  272. 					if(dif>100800) dif = ">10w";
  273. 					else if(dif>1440) dif = Math.floor(dif/1440) + "d";
  274. 					else if(dif>60) dif = Math.floor(dif/60) + "h";
  275. 					else dif = dif + "m";
  276. 					$(this).html($(this).html() + " ("+dif+")");
  277. 				}
  278. 			}
  279. 		});
  280. 	}
  281. 	if(document.location.href.indexOf('viewforum') != -1) {
  282. 		$('.forumheader3').each(function(index) {
  283. 			if ( $(this).children().length != 2 ) { return; }
  284. 			var t = $(this).text();
  285. 			if(t.indexOf(':') != -1 && t.indexOf('Goto page:') == -1 && $(this).html().indexOf('mediumtext') == -1 && $(this).html().indexOf('smalltext') == -1) {
  286. 				var d = Date.parseExact(t.substring(t.length - 20),'MMM dd yyyy, hh:mmtt');
  287. 				console.log(t.substring(t.length - 20));
  288. 				var dif = Math.floor(Math.abs(now - d)/1000/60);
  289. 				if(dif>100800) dif = ">10w";
  290. 				else if(dif>1440) dif = Math.floor(dif/1440) + "d";
  291. 				else if(dif>60) dif = Math.floor(dif/60) + "h";
  292. 				else dif = dif + "m";
  293. 				var h = $(this).html();
  294. 				var p = h.indexOf('</a>')+4;
  295. 				$(this).html(h.substr(0,p) + " ("+dif+")" + h.substr(p));
  296. 			}
  297. 		});
  298. 	}
  299. }
  300.  
  301. function limitImages() {
  302. 	if(document.location.href.indexOf('viewtopic') != -1) {
  303. 		$('.forumheader3 img').each(function(index) {
  304. 			$(this).css('max-width',800);
  305. 		});
  306. 	}
  307. }
  308.  
  309. function fixSpoiler() {
  310. 	$('#dataform .forumheader2 img').each(function(index) {
  311. 		if($(this).attr('src').indexOf('/spoiler.png') != -1) {
  312. 			$(this).attr('onclick',"addtext('[spoiler][/spoiler]')");
  313. 		}
  314. 	});
  315. }
  316.  
  317. function noImages() {
  318. 	if(document.location.href.indexOf('viewforum') != -1) {
  319. 		$('img:not(.customizerbutton,table tbody tr td a img, .forumheader2 img, .forumheader3 img)').remove();
  320. 	} else {
  321. 		$('img:not(.customizerbutton,table tbody tr td a img, .forumheader2 img)').remove();
  322. 	}
  323. 	$('.smalltext img').remove();
  324. 	$('h2, h3, .contentbody').css('background','url()');
  325. 	$('embed').attr('src','');
  326. }
  327.  
  328. function format() {
  329. 	var s = arguments[0];
  330. 	for (var i = 0; i < arguments.length - 1; i++) {       
  331. 		var reg = new RegExp("\\{" + i + "\\}", "gm");             
  332. 		s = s.replace(reg, arguments[i + 1]);
  333. 	}
  334. 	return s;
  335. }
  336.  
  337. jQuery.fn.extend({
  338. insertAtCaret: function(myValue){
  339.   return this.each(function(i) {
  340.     if (this.selectionStart || this.selectionStart == '0') {
  341.       var startPos = this.selectionStart;
  342.       var endPos = this.selectionEnd;
  343.       var scrollTop = this.scrollTop;
  344.       this.value = this.value.substring(0, startPos)+myValue+this.value.substring(endPos,this.value.length);
  345.       this.focus();
  346.       this.selectionStart = startPos + myValue.length;
  347.       this.selectionEnd = startPos + myValue.length;
  348.       this.scrollTop = scrollTop;
  349.     } else {
  350.       this.value += myValue;
  351.       this.focus();
  352.     }
  353.   })
  354. }
  355. });
  356.  
  357. $.fn.setCaret = function(pos) {
  358.     return this.each(function() {
  359.         if (this.setSelectionRange) {
  360.             this.focus();
  361.             this.setSelectionRange(pos, pos);
  362.         } else if (this.createTextRange) {
  363.             var range = this.createTextRange();
  364.             range.collapse(true);
  365.             range.moveEnd('character', pos);
  366.             range.moveStart('character', pos);
  367.             range.select();
  368.         }
  369.     });
  370. };
  371.  
  372. (function ($, undefined) {
  373.     $.fn.getCursorPosition = function() {
  374.         var el = $(this).get(0);
  375.         var pos = 0;
  376.         if('selectionStart' in el) {
  377.             pos = el.selectionStart;
  378.         } else if('selection' in document) {
  379.             el.focus();
  380.             var Sel = document.selection.createRange();
  381.             var SelLength = document.selection.createRange().text.length;
  382.             Sel.moveStart('character', -el.value.length);
  383.             pos = Sel.text.length - SelLength;
  384.         }
  385.         return pos;
  386.     }
  387. })(jQuery);