osu! Mark User With Modes Icons

Mark osu, taiko, ctb and mania icons in osu user profile page

  1. // ==UserScript==
  2. // @name osu! Mark User With Modes Icons
  3. // @namespace https://osu.ppy.sh/u/376831
  4. // @description Mark osu, taiko, ctb and mania icons in osu user profile page
  5. // @include *osu.ppy.sh/u/*
  6. // @version 1.01
  7. // @grant none
  8. // ==/UserScript==
  9. var transparent = 0.3;
  10. var cookiesSaveDays = 30;
  11. addLoadEvent(loadEvent);
  12. function loadEvent() {
  13. var userNameElement = document.getElementsByClassName('profile-username');
  14. addModesImgsToEnd(userNameElement[0].parentNode.parentNode);
  15. setImgsTransparentBySetting(readImgsSetting());
  16. setModeImgsFunctions();
  17. }
  18. function createModeImg(modeType) {
  19. var img = document.createElement('img');
  20. img.setAttribute('id', 'modeType' + modeType);
  21. img.setAttribute('src', 'https://osu.ppy.sh/forum/images/icons/misc/' + modeType + '.gif');
  22. img.style['cursor'] = 'pointer';
  23. setImgTransparent(img, true);
  24. return img;
  25. }
  26. function addModesImgsToEnd(element) {
  27. var imgs = document.createElement('div');
  28. var osu = createModeImg('osu');
  29. var taiko = createModeImg('taiko');
  30. var ctb = createModeImg('ctb');
  31. var mania = createModeImg('mania');
  32. imgs.appendChild(osu);
  33. imgs.appendChild(taiko);
  34. imgs.appendChild(ctb);
  35. imgs.appendChild(mania);
  36. element.appendChild(imgs);
  37. }
  38. function setModeImgFunctions(element) {
  39. element.onmouseover = function () {
  40. if (element.style['opacity'] == transparent) {
  41. setImgTransparent(element, false);
  42. }
  43. };
  44. element.onmousedown = function () {
  45. var setting = readImgsSetting();
  46. switch (element.id) {
  47. case 'modeTypeosu':
  48. setting = (setting.substr(0, 1) == '1' ? '0' : '1') + setting.substr(1, 3);
  49. break;
  50. case 'modeTypetaiko':
  51. setting = setting.substr(0, 1) + (setting.substr(1, 1) == '1' ? '0' : '1') + setting.substr(2, 2);
  52. break;
  53. case 'modeTypectb':
  54. setting = setting.substr(0, 2) + (setting.substr(2, 1) == '1' ? '0' : '1') + setting.substr(3, 1);
  55. break;
  56. case 'modeTypemania':
  57. setting = setting.substr(0, 3) + (setting.substr(3, 1) == '1' ? '0' : '1');
  58. break;
  59. };
  60. saveImgsSetting(setting);
  61. };
  62. element.onmouseout = function () {
  63. setImgsTransparentBySetting(readImgsSetting());
  64. };
  65. element.onmouseup = function () {
  66. setImgsTransparentBySetting(readImgsSetting());
  67. };
  68. }
  69. function setModeImgsFunctions() {
  70. setModeImgFunctions(document.getElementById('modeTypeosu'));
  71. setModeImgFunctions(document.getElementById('modeTypetaiko'));
  72. setModeImgFunctions(document.getElementById('modeTypectb'));
  73. setModeImgFunctions(document.getElementById('modeTypemania'));
  74. }
  75. function setImgTransparent(element, boolean) {
  76. if (boolean) {
  77. element.style['filter'] = 'alpha(opacity=' + transparent * 100 + ')';
  78. element.style['-moz-opacity'] = transparent;
  79. element.style['-khtml-opacity'] = transparent;
  80. element.style['opacity'] = transparent;
  81. } else {
  82. element.style['filter'] = 'alpha(opacity=100)';
  83. element.style['-moz-opacity'] = '1';
  84. element.style['-khtml-opacity'] = '1';
  85. element.style['opacity'] = '1';
  86. }
  87. }
  88. function setImgsTransparentBySetting(setting) {
  89. setImgTransparent(document.getElementById('modeTypeosu'), setting.substr(0, 1) == '0');
  90. setImgTransparent(document.getElementById('modeTypetaiko'), setting.substr(1, 1) == '0');
  91. setImgTransparent(document.getElementById('modeTypectb'), setting.substr(2, 1) == '0');
  92. setImgTransparent(document.getElementById('modeTypemania'), setting.substr(3, 1) == '0');
  93. }
  94. function getImgsTransparentSetting() {
  95. var std = document.getElementById('modeTypeosu').style['opacity'] == transparent ? '0' : '1';
  96. var taiko = document.getElementById('modeTypetaiko').style['opacity'] == transparent ? '0' : '1';
  97. var ctb = document.getElementById('modeTypectb').style['opacity'] == transparent ? '0' : '1';
  98. var mania = document.getElementById('modeTypemania').style['opacity'] == transparent ? '0' : '1';
  99. return (std + taiko + ctb + mania);
  100. }
  101. function readImgsSetting() {
  102. var name = trim(document.getElementsByClassName('profile-username') [0].innerHTML);
  103. var setting = getCookie('osuUserModesIconsSetting');
  104. if (!setting) {
  105. return '0000';
  106. } else {
  107. var index = setting.indexOf(name);
  108. if (index == - 1) {
  109. return '0000';
  110. } else {
  111. return setting.substr(index + name.length + 1, 4);
  112. }
  113. }
  114. }
  115. function saveImgsSetting(newSetting) {
  116. var name = trim(document.getElementsByClassName('profile-username') [0].innerHTML);
  117. var setting = getCookie('osuUserModesIconsSetting');
  118. if (!setting) {
  119. addCookie('osuUserModesIconsSetting', name + ',' + newSetting);
  120. } else {
  121. var index = setting.indexOf(name);
  122. if (index == - 1) {
  123. addCookie('osuUserModesIconsSetting', setting + ',' + name + ',' + newSetting);
  124. } else {
  125. addCookie('osuUserModesIconsSetting', setting.substr(0, index + name.length + 1) + newSetting + setting.substr(index + name.length + 5));
  126. }
  127. }
  128. }
  129. function addCookie(name, value) {
  130. var exp = new Date();
  131. exp.setTime(exp.getTime() + cookiesSaveDays * 24 * 60 * 60 * 1000);
  132. document.cookie = name + '=' + value + ';expires=' + exp.toGMTString() + ';path=/';
  133. }
  134. function removeCookie(name) {
  135. document.cookie = name + '=;expires=' + (new Date(0)).toGMTString() + ';path=/';
  136. }
  137. function getCookie(name) {
  138. var arr,
  139. reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)');
  140. if (arr = document.cookie.match(reg)) {
  141. return unescape(arr[2]);
  142. }
  143. else {
  144. return null;
  145. }
  146. }
  147. function trim(str) {
  148. str = str.replace(/^(\s|\u00A0)+/, '');
  149. for (var i = str.length - 1; i >= 0; i--) {
  150. if (/\S/.test(str.charAt(i))) {
  151. str = str.substring(0, i + 1);
  152. break;
  153. }
  154. }
  155. return str;
  156. }
  157. function addLoadEvent(func) {
  158. var oldonload = window.onload;
  159. if (typeof window.onload != 'function') {
  160. window.onload = func;
  161. } else {
  162. window.onload = function () {
  163. oldonload();
  164. func();
  165. }
  166. }
  167. }