☰

IP.Chat-Specific Theme

Adds the ability to use a specific theme for IP.Chat separate from the forum theme. The theme can be changed while in IP.Chat via a separate menu next to the default theme changer.

当前为 2014-05-13 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name	IP.Chat-Specific Theme
  3. // @namespace	Makaze
  4. // @include	*
  5. // @version	1.1.3
  6. // @description Adds the ability to use a specific theme for IP.Chat separate from the forum theme. The theme can be changed while in IP.Chat via a separate menu next to the default theme changer.
  7. // ==/UserScript==
  8.  
  9. function updateSkin(skinID) {
  10. 	var logo,
  11. 	i = 0;
  12.  
  13. 	for (i = 0; i < document.getElementsByTagName('link').length; i++) {
  14. 		if (document.getElementsByTagName('link')[i].getAttribute('rel') === 'stylesheet' && document.getElementsByTagName('link')[i].href.match(/css_\d+/gi)) {
  15. 			document.getElementsByTagName('link')[i].href = document.getElementsByTagName('link')[i].href.replace(/css_\d+/gi, 'css_' + skinID);
  16. 		}
  17. 	}
  18. 	switch (skinID) {
  19. 		case 29:
  20. 			logo = 'http://serenesforest.net/forums/public/style_images/29_sflogoblue.png';
  21. 		break;
  22. 		case 27:
  23. 			logo = 'http://serenesforest.net/forums/public/style_images/27_serenes_forest_forums_banner.jpg';
  24. 		break;
  25. 		case 28:
  26. 			logo = 'http://serenesforest.net/forums/public/style_images/28_sflogopurp.png';
  27. 	}
  28. 	document.getElementById('logo').getElementsByTagName('img')[0].src = logo;
  29. }
  30.  
  31. function insertAfter(referenceNode, newNode) {
  32. 	referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);
  33. }
  34.  
  35. function fade(elem, type, speed) {
  36. 	var defaultOpacity,
  37. 	currentDisplay = elem.style.display || window.getComputedStyle(elem).display;
  38.  
  39. 	elem.style.opacity = '';
  40. 	defaultOpacity = window.getComputedStyle(elem).opacity;
  41. 	elem.style.opacity = 0;
  42.  
  43. 	// Default values:
  44.  
  45. 	switch (arguments.length) {
  46. 		case 1:
  47. 			type = 'toggle';
  48. 		case 2:
  49. 			speed = 300;
  50. 		break;
  51. 	}
  52.  
  53. 	switch (type) {
  54. 		case 'in':
  55. 			elem.style.display = '';
  56. 			setTimeout(function() {
  57. 				elem.style.transition = 'all ' + speed + 'ms ease-in-out';
  58. 				elem.style.opacity = defaultOpacity;
  59. 				setTimeout(function() {
  60. 					elem.style.transition = '';
  61. 					elem.style.opacity = '';
  62. 				}, speed + 10);
  63. 			}, 1);
  64. 		break;
  65. 		case 'out':
  66. 			elem.style.transition = '';
  67. 			elem.style.opacity = defaultOpacity;
  68. 			elem.style.transition = 'all ' + speed + 'ms ease-in-out';
  69. 			elem.style.opacity = 0;
  70. 			setTimeout(function() {
  71. 				elem.style.display = 'none';
  72. 				elem.style.transition = '';
  73. 				elem.style.opacity = '';
  74. 			}, speed + 10);
  75. 		break;
  76. 		case 'toggle':
  77. 		default:
  78. 			if (currentDisplay === 'none') {
  79. 				elem.style.display = '';
  80. 				setTimeout(function() {
  81. 					elem.style.transition = 'all ' + speed + 'ms ease-in-out';
  82. 					elem.style.opacity = defaultOpacity;
  83. 					setTimeout(function() {
  84. 						elem.style.transition = '';
  85. 						elem.style.opacity = '';
  86. 					}, speed + 10);
  87. 				}, 1);
  88. 			} else {
  89. 				elem.style.transition = '';
  90. 				elem.style.opacity = defaultOpacity;
  91. 				elem.style.transition = 'all ' + speed + 'ms ease-in-out';
  92. 				elem.style.opacity = 0;
  93. 				setTimeout(function() {
  94. 					elem.style.display = 'none';
  95. 					elem.style.transition = '';
  96. 					elem.style.opacity = '';
  97. 				}, speed + 10);
  98. 			}
  99. 	}
  100. }
  101.  
  102. function clonedThemeChanger() {
  103. 	var buttonToClone = document.getElementById('new_skin'),
  104. 	menuToClone = document.getElementById('new_skin_menucontent'),
  105. 	clonedButton = buttonToClone.clone(true),
  106. 	clonedMenu = menuToClone.clone(true),
  107. 	container = document.createElement('li'),
  108. 	opts,
  109. 	i = 0;
  110.  
  111. 	clonedButton.id = 'new_ipc_skin';
  112. 	clonedButton.innerHTML = 'Change IP.Chat Theme';
  113. 	clonedButton.href = 'javascript:void(0)';
  114.  
  115. 	clonedMenu.id = 'new_ipc_skin_menucontent';
  116.  
  117. 	container.id = 'ipc_themechanger';
  118. 	insertAfter(buttonToClone.parentNode, container);
  119.  
  120. 	document.getElementById('ipc_themechanger').appendChild(clonedButton);
  121. 	document.getElementById('ipc_themechanger').appendChild(clonedMenu);
  122. 	document.getElementById('rss_feed').onload = function() {
  123. 		buttonToClone.click();
  124. 		setTimeout(function() {
  125. 			buttonToClone.click();
  126. 		}, 300);
  127. 	};
  128.  
  129. 	document.getElementById('new_ipc_skin').onclick = function() {
  130. 		var menu = document.getElementById('new_ipc_skin_menucontent'),
  131. 		widthOff = document.getElementById('new_skin').offsetWidth,
  132. 		top = document.getElementById('new_skin_menucontent').style.top.split('px')[0],
  133. 		left = document.getElementById('new_skin_menucontent').style.left.split('px')[0];
  134. 		if (menu.style.display === 'none') {
  135. 			this.className = 'menu_active';
  136. 			fade(menu, 'in');
  137. 			menu.style.top = parseFloat(top) + 'px';
  138. 			menu.style.left = parseFloat(left) + widthOff + 6 + 'px';
  139. 		} else {
  140. 			this.className = '';
  141. 			fade(menu, 'out');
  142. 		}
  143. 	};
  144.  
  145. 	var ipcThemeChangerHandler = function() {
  146. 		var nameToLoad = this.textContent,
  147. 		idToLoad = parseFloat(this.getAttribute('data-skinid')),
  148. 		menu = this.parentNode.parentNode,
  149. 		newOpt,
  150. 		oldOpts;
  151.  
  152. 		menu.getElementsByClassName('selected')[0].className = '';
  153. 		this.parentNode.className = 'selected';
  154.  
  155. 		updateSkin(idToLoad);
  156.  
  157. 		if (localStorage.getItem('MakazeScriptOptions')) {
  158. 			oldOpts = JSON.parse(localStorage.getItem('MakazeScriptOptions'));
  159. 			oldOpts.ipc_theme_name = nameToLoad;
  160. 			oldOpts.ipc_theme_id = idToLoad;
  161. 			localStorage.setItem('MakazeScriptOptions', JSON.stringify(oldOpts));
  162. 		} else {
  163. 			newOpt = {'ipc_theme_name': nameToLoad, 'ipc_theme_id': idToLoad};
  164. 			localStorage.setItem('MakazeScriptOptions', JSON.stringify(newOpt));
  165. 		}
  166.  
  167. 		menu.style.opacity = 0;
  168. 		setTimeout(function() {
  169. 			menu.style.display = 'none';
  170. 		}, 350);
  171.  
  172. 		document.getElementById('new_ipc_skin').className = '';
  173. 	};
  174.  
  175. 	for (i = 0; i < document.getElementById('new_ipc_skin_menucontent').getElementsByTagName('a').length; i++) {
  176. 		var menu = document.getElementById('new_ipc_skin_menucontent');
  177. 		document.getElementById('new_ipc_skin_menucontent').getElementsByTagName('a')[i].href = 'javascript:void(0)';
  178. 		if (localStorage.getItem('MakazeScriptOptions') && JSON.parse(localStorage.getItem('MakazeScriptOptions')).hasOwnProperty('ipc_theme_id')) {
  179. 			opts = JSON.parse(localStorage.getItem('MakazeScriptOptions'));
  180. 			if (opts.ipc_theme_id === document.getElementById('new_ipc_skin_menucontent').getElementsByTagName('a')[i].getAttribute('data-skinid')) {
  181. 				menu.getElementsByClassName('selected')[0].className = '';
  182. 				document.getElementById('new_ipc_skin_menucontent').getElementsByTagName('a')[i].parentNode.className = 'selected';
  183. 			}
  184. 		}
  185. 		document.getElementById('new_ipc_skin_menucontent').getElementsByTagName('a')[i].onclick = ipcThemeChangerHandler;
  186. 	}
  187. }
  188.  
  189. if (document.body.id == 'ipboard_body' && document.getElementById('chat-form') != null) {
  190. 	var opts,
  191. 	detectedTheme,
  192. 	forumTheme = document.getElementById('new_skin_menucontent').getElementsByClassName('selected')[0].getAttribute('data-skinid'),
  193. 	clonedScript;
  194.  
  195. 	if (localStorage.getItem('MakazeScriptOptions') && JSON.parse(localStorage.getItem('MakazeScriptOptions')).hasOwnProperty('ipc_theme_id')) {
  196. 		opts = JSON.parse(localStorage.getItem('MakazeScriptOptions'));
  197. 		detectedTheme = opts.ipc_theme_id;
  198. 		if (detectedTheme !== forumTheme) {
  199. 			updateSkin(detectedTheme);
  200. 		}
  201. 	}
  202.  
  203. 	clonedScript = document.createElement('script');
  204. 	clonedScript.setAttribute('type', 'text/javascript');
  205. 	clonedScript.innerHTML = updateSkin.toString() + insertAfter.toString() + fade.toString() + clonedThemeChanger.toString() + 'clonedThemeChanger();';
  206. 	document.body.appendChild(clonedScript);
  207. }