osu!web enhancement

Some small improvements to osu!web, featuring beatmapset filter and profile page improvement.

当前为 2023-10-01 提交的版本,查看 最新版本

  1. // ==UserScript==
  2. // @name osu!web enhancement
  3. // @namespace http://tampermonkey.net/
  4. // @version 0.6.2
  5. // @description Some small improvements to osu!web, featuring beatmapset filter and profile page improvement.
  6. // @author VoltaXTY
  7. // @match https://osu.ppy.sh/*
  8. // @match https://lazer.ppy.sh/*
  9. // @icon http://ppy.sh/favicon.ico
  10. // @grant none
  11. // @run-at document-end
  12. // ==/UserScript==
  13. const ShowPopup = (m, t = "info") => {
  14. window.popup(m, t);
  15. [["info", console.log], ["warning", console.warn], ["danger", console.error]].find(g => g[0] === t)[1](m);
  16. }
  17. const svg_osu_miss = URL.createObjectURL(new Blob(
  18. [`<svg viewBox="0 0 128 128" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" >
  19. <filter id="blur">
  20. <feFlood flood-color="red" flood-opacity="0.5" in="SourceGraphic" />
  21. <feComposite operator="in" in2="SourceGraphic" />
  22. <feGaussianBlur stdDeviation="6" />
  23. <feComponentTransfer result="glow1"> <feFuncA type="linear" slope="10" intercept="0" /> </feComponentTransfer>
  24. <feGaussianBlur in="glow1" stdDeviation="1" result="glow2" />
  25. <feMerge> <feMergeNode in="SourceGraphic" /> <feMergeNode in="glow2" /> </feMerge>
  26. </filter>
  27. <filter id="blur2"> <feGaussianBlur stdDeviation="0.2"/> </filter>
  28. <path id="cross" d="M 26 16 l -10 10 l 38 38 l -38 38 l 10 10 l 38 -38 l 38 38 l 10 -10 l -38 -38 l 38 -38 l -10 -10 l -38 38 Z" />
  29. <use href="#cross" stroke="red" stroke-width="2" fill="transparent" filter="url(#blur)"/>
  30. <use href="#cross" fill="white" stroke="transparent" filter="url(#blur2)"/>
  31. </svg>`], {type: "image/svg+xml"}));
  32. const svg_green_tick = URL.createObjectURL(new Blob([
  33. `<svg viewBox="0 0 18 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" >
  34. <polyline points="2,8 7,14 16,2" stroke="#62ee56" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none"/>
  35. </svg>`], {type: "image/svg+xml"}));
  36. const inj_style =
  37. `#osu-db-input{
  38. display: none;
  39. }
  40. .osu-db-button{
  41. align-items: center;
  42. padding: 10px;
  43. }
  44. .osu-db-button:hover{
  45. cursor: pointer;
  46. }
  47. .beatmapsets__item.owned-beatmapset{
  48. opacity: 1.0;
  49. }
  50. .beatmapsets__item.owned-beatmapset .beatmapset-panel__menu-container{
  51. background-color: #87dda8;
  52. }
  53. .beatmapsets__item.owned-beatmapset .fas, .beatmapsets__item.owned-beatmapset .far{
  54. color: #5c9170;
  55. }
  56. .owned-beatmap-link{
  57. color: #87dda8;
  58. }
  59. .play-detail__accuracy{
  60. margin: 0px 12px;
  61. }
  62. .play-detail__accuracy.ppAcc{
  63. color: #8ef9f1;
  64. padding: 0;
  65. }
  66. .play-detail__weighted-pp{
  67. margin: 0px;
  68. }
  69. .play-detail__pp{
  70. flex-direction: column;
  71. }
  72. .lost-pp{
  73. font-size: 10px;
  74. position: relative;
  75. right: 7px;
  76. font-weight: 600;
  77. }
  78. .score-detail{
  79. display: inline-block;
  80. }
  81. .score-detail-data-text{
  82. margin-left: 5px;
  83. margin-right: 10px;
  84. width: auto;
  85. display: inline-block;
  86. }
  87. @keyframes rainbow{
  88. 0%{
  89. color: #be19ff;
  90. }
  91. 25%{
  92. color: #0075ff;
  93. }
  94. 50%{
  95. color: #4ddf86;
  96. }
  97. 75%{
  98. color: #e9ea00;
  99. }
  100. 100%{
  101. color: #ff7800;
  102. }
  103. }
  104. .play-detail__accuracy-and-weighted-pp{
  105. display: flex;
  106. flex-direction: row;
  107. }
  108. .play-detail__before{
  109. flex-grow: 1;
  110. }
  111. .mania-max{
  112. animation: 0.16s infinite alternate rainbow;
  113. }
  114. .mania-300{
  115. color: #fbff00;
  116. }
  117. .osu-100, .fruits-100, .taiko-150{
  118. color: #67ff5b;
  119. }
  120. .mania-200{
  121. color: #6cd800;
  122. }
  123. .osu-300, .fruits-300, .taiko-300{
  124. color: #7dfbff;
  125. }
  126. .mania-100{
  127. color: #257aea;
  128. }
  129. .mania-50{
  130. color: #d2d2d2;
  131. }
  132. .osu-50, .fruits-50-miss{
  133. color: #ffbf00;
  134. }
  135. .mania-miss, .taiko-miss, .fruits-miss{
  136. color: #cc2626;
  137. }
  138. .mania-max, .mania-300, .mania-200, .mania-100, .mania-50, .mania-miss, .osu-300, .osu-100, .osu-50, .osu-miss{
  139. font-weight: 600;
  140. }
  141. .score-detail-data-text{
  142. font-weight: 500;
  143. }
  144. .osu-miss{
  145. display: inline-block;
  146. }
  147. .osu-miss > img{
  148. width: 14px;
  149. height: 14px;
  150. bottom: 1px;
  151. position: relative;
  152. }
  153. .play-detail__Accuracy, .play-detail__Accuracy2, .combo, .max-combo, .play-detail__combo{
  154. display: inline-block;
  155. width: auto;
  156. }
  157. .play-detail__Accuracy{
  158. text-align: left;
  159. color: #fc2;
  160. }
  161. .play-detail__Accuracy2{
  162. text-align: left;
  163. color: rgb(142, 249, 241);
  164. }
  165. .play-detail__combo, .play-detail__Accuracy2, .play-detail__Accuracy{
  166. margin-right: 13px;
  167. }
  168. .play-detail__combo{
  169. text-align: right;
  170. }
  171. .combo, .max-combo{
  172. margin: 0px 1px;
  173. }
  174. .max-combo, .legacy-perfect-combo{
  175. color: hsl(var(--hsl-lime-1));
  176. }
  177. div.bar__exp-info{
  178. position: relative;
  179. bottom: 100%;
  180. }
  181. .play-detail__group--background, .beatmap-playcount__background{
  182. position: absolute;
  183. width: 90%;
  184. height: 100%;
  185. left: 0px;
  186. margin: 0px;
  187. pointer-events: none;
  188. z-index: 1;
  189. border-radius: 10px 0px 0px 10px;
  190. background-size: cover;
  191. background-position-y: -100%;
  192. mask-image: linear-gradient(to right, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0));
  193. -webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0));
  194. }
  195. @media(max-width: 900px){
  196. .play-detail__group--background, .beatmap-playcount__background{
  197. background-position-y: 0%;
  198. mask-image: linear-gradient(to bottom, #0007, #0004);
  199. -webkit-mask-image: linear-gradient(to bottom, #0007, #0004);
  200. width: 100%;
  201. }
  202. .lost-pp{
  203. left: 3px;
  204. }
  205. .play-detail__group.play-detail__group--bottom{
  206. z-index: 1;
  207. }
  208. .play-detail__before{
  209. flex-grow: 0;
  210. }
  211. }
  212. .play-detail.play-detail--highlightable.play-detail--pin-sortable.js-score-pin-sortable .play-detail__group--background{
  213. left: 20px;
  214. }
  215. .beatmap-playcount__background{
  216. width: 100%;
  217. border-radius: 6px;
  218. mask-image: linear-gradient(to right, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.3));
  219. -webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.3));
  220. }
  221. .beatmap-playcount__info, .beatmap-playcount__detail-count, .play-detail__group.play-detail__group--top *{
  222. z-index: 1;
  223. }
  224. div.play-detail-list time.js-timeago, span.beatmap-playcount__mapper, span.beatmap-playcount__mapper > a{
  225. color: #ccc;
  226. }
  227. button.show-more-link{
  228. z-index: 4;
  229. }
  230. a.beatmap-download-link{
  231. margin: 0px 5px;
  232. color: hsl(var(--hsl-l1));
  233. }
  234. a.beatmap-download-link:hover, a.beatmap-pack-item-download-link span:hover{
  235. color: #fff;
  236. }
  237. a.beatmap-pack-item-download-link span{
  238. color: hsl(var(--hsl-l1));
  239. }
  240. .play-detail.play-detail--highlightable.audio-player{
  241. max-width: none;
  242. height: unset;
  243. padding: unset;
  244. align-items: unset;
  245. }
  246. .play-detail.play-detail--highlightable.audio-player__button{
  247. align-items: unset;
  248. padding: unset;
  249. }
  250. .play-detail.play-detail--highlightable.audio-player__button:hover{
  251. color: unset;
  252. }
  253. `;
  254. let scriptContent =
  255. String.raw`console.log("page script injected from osu!web enhancement");
  256. if(window.oldXHROpen === undefined){
  257. window.oldXHROpen = window.XMLHttpRequest.prototype.open;
  258. window.XMLHttpRequest.prototype.open = function() {
  259. this.addEventListener("load", function() {
  260. const url = this.responseURL;
  261. const trreg = /https:\/\/(?<subdomain>osu|lazer)\.ppy\.sh\/users\/(?<id>[0-9]+)\/extra-pages\/(?<type>top_ranks|historical)\?mode=(?<mode>osu|taiko|fruits|mania)/.exec(url);
  262. const adreg = /https:\/\/(?<subdomain>osu|lazer)\.ppy\.sh\/users\/(?<id>[0-9]+)\/scores\/(?<type>firsts|best|recent|pinned)\?mode=(?<mode>osu|taiko|fruits|mania)&limit=[0-9]*&offset=[0-9]*/.exec(url);
  263. let reg = trreg ?? (adreg ?? null);
  264. if(!reg){
  265. const bmsreg = /https:\/\/(?:osu|lazer)\.ppy\.sh\/beatmapsets\/search\?/;
  266. return;
  267. }
  268. let info = {
  269. type: reg.groups.type,
  270. userId: Number(reg.groups.id),
  271. mode: reg.groups.mode,
  272. subdomain: reg.groups.subdomain,
  273. };
  274. const responseBody = this.responseText;
  275. info.data = JSON.parse(responseBody);
  276. info.id = "osu!web enhancement";
  277. window.postMessage(info, "*");
  278. });
  279. return oldXHROpen.apply(this, arguments);
  280. };
  281. }`;
  282. const scriptId = "osu-web-enhancement-XHR-script";
  283. if(!document.querySelector(`script#${scriptId}`)){
  284. const script = document.createElement("script");
  285. script.textContent = scriptContent;
  286. document.body.appendChild(script);
  287. }
  288. const HTML = (tagname, attrs, ...children) => {
  289. if(attrs === undefined) return document.createTextNode(tagname);
  290. const ele = document.createElement(tagname);
  291. if(attrs) for(let [key, value] of Object.entries(attrs)){
  292. if(key === "eventListener"){
  293. for(let listener of value){
  294. ele.addEventListener(listener.type, listener.listener, listener.options);
  295. }
  296. }
  297. else ele.setAttribute(key, value);
  298. }
  299. for(let child of children) if(child) ele.append(child);
  300. return ele;
  301. };
  302. const html = (html) => {
  303. const t = document.createElement("template");
  304. t.innerHTML = html;
  305. return t.content.firstElementChild;
  306. };
  307. const PostMessage = (msg) => { console.error(msg); };
  308. const OsuMod = {
  309. NoFail: 1 << 0,
  310. Easy: 1 << 1,
  311. TouchDevice: 1 << 2,
  312. NoVideo: 1 << 2,
  313. Hidden: 1 << 3,
  314. HardRock: 1 << 4,
  315. SuddenDeath: 1 << 5,
  316. DoubleTime: 1 << 6,
  317. Relax: 1 << 7,
  318. HalfTime: 1 << 8,
  319. Nightcore: 1 << 9, // always with DT
  320. Flashlight: 1 << 10,
  321. Autoplay: 1 << 11,
  322. SpunOut: 1 << 12,
  323. Autopilot: 1 << 13,
  324. Perfect: 1 << 14,
  325. Key4: 1 << 15,
  326. Key5: 1 << 16,
  327. Key6: 1 << 17,
  328. Key7: 1 << 18,
  329. Key8: 1 << 19,
  330. KeyMod: 1 << 19 | 1 << 18 | 1 << 17 | 1 << 16 | 1 << 15,
  331. FadeIn: 1 << 20,
  332. Random: 1 << 21,
  333. Cinema: 1 << 22,
  334. TargetPractice: 1 << 23,
  335. Key9: 1 << 24,
  336. Coop: 1 << 25,
  337. Key1: 1 << 26,
  338. Key3: 1 << 27,
  339. Key2: 1 << 28,
  340. ScoreV2: 1 << 29,
  341. Mirror: 1 << 30,
  342. };
  343. class Byte{ value = 0; constructor(arr, iter){ this.value = arr[iter.nxtpos++]; } };
  344. class RankedStatus extends Byte{
  345. constructor(arr, iter){
  346. super(arr, iter);
  347. switch(this.value){
  348. case 1: this.description = "unsubmitted"; break;
  349. case 2: this.description = "pending/wip/graveyard"; break;
  350. case 3: this.description = "unused"; break;
  351. case 4: this.description = "ranked"; break;
  352. case 5: this.description = "approved"; break;
  353. case 6: this.description = "qualified"; break;
  354. case 7: this.description = "loved"; break;
  355. default: this.description = "unknown"; this.value = 0;
  356. }
  357. }
  358. };
  359. class OsuMode extends Byte{
  360. constructor(arr, iter){
  361. super(arr, iter);
  362. switch(this.value){
  363. case 1: this.description = "taiko"; break;
  364. case 2: this.description = "catch"; break;
  365. case 3: this.description = "mania"; break;
  366. default: this.value = 0; this.description = "osu";
  367. }
  368. }
  369. };
  370. class Grade extends Byte{
  371. constructor(arr, iter){
  372. super(arr, iter);
  373. switch(this.value){
  374. case 0: this.description = "SSH"; break;
  375. case 1: this.description = "SH"; break;
  376. case 2: this.description = "SS"; break;
  377. case 3: this.description = "S"; break;
  378. case 4: this.description = "A"; break;
  379. case 5: this.description = "B"; break;
  380. case 6: this.description = "C"; break;
  381. case 7: this.description = "D"; break;
  382. default: this.description = "not played";
  383. }
  384. }
  385. };
  386. class Short{ value = 0; constructor(arr, iter){ this.value = arr[iter.nxtpos++] | arr[iter.nxtpos++] << 8; } };
  387. class Int{ value = 0; constructor(arr, iter){ this.value = arr[iter.nxtpos++] | arr[iter.nxtpos++] << 8 | arr[iter.nxtpos++] << 16 | arr[iter.nxtpos++] << 24; } };
  388. class Long{ value = 0n; constructor(arr, iter){ this.value = new DataView(arr.buffer, iter.nxtpos, 8).getBigUint64(0, true); iter.nxtpos += 8; } };
  389. class ULEB128{
  390. value = 0n;
  391. constructor(arr, iter){
  392. let shift = 0n;
  393. while(true){
  394. let peek = BigInt(arr[iter.nxtpos++]);
  395. this.value |= (peek & 0x7Fn) << shift;
  396. if((peek & 0x80n) === 0n) break;
  397. shift += 7n;
  398. }
  399. }
  400. };
  401. class Single{ value = 0; constructor(arr, iter){ this.value = new DataView(arr.buffer, iter.nxtpos, 4).getFloat32(0, true); iter.nxtpos += 4; } };
  402. class Double{ value = 0; constructor(arr, iter){ this.value = new DataView(arr.buffer, iter.nxtpos, 8).getFloat64(0, true); iter.nxtpos += 8; } };
  403. class Boolean{ value = false; constructor(arr, iter){ this.value = arr[iter.nxtpos++] !== 0x00; } };
  404. class OString{
  405. value = "";
  406. constructor(arr, iter){
  407. switch(arr[iter.nxtpos++]){
  408. case 0: break;
  409. case 0x0b: {
  410. const l = new ULEB128(arr, iter).value;
  411. const bv = new Uint8Array(arr.buffer, iter.nxtpos, Number(l));
  412. this.value = new TextDecoder().decode(bv);
  413. iter.nxtpos += Number(l);
  414. break;
  415. }
  416. default: console.assert(false, `error occurred while parsing osu string with the first byte.`);
  417. }
  418. }
  419. };
  420. class IntDouble{
  421. int = 0;
  422. double = 0;
  423. constructor(arr, iter){
  424. const m1 = arr[iter.nxtpos++];
  425. console.assert(m1 === 0x08, `error occurred while parsing Int-Double pair at ${iter.nxtpos - 1} with value 0x${m1.toString(16)}: should be 0x8.`);
  426. this.int = new Int(arr, iter).value;
  427. const m2 = arr[iter.nxtpos++];
  428. console.assert(m2 === 0x0d, `error occurred while parsing Int-Double pair at ${iter.nxtpos - 1} with value 0x${m1.toString(16)}: should be 0x8.`);
  429. this.double = new Double(arr, iter).value;
  430. }
  431. };
  432. class IntDoubleArray extends Array{
  433. constructor(arr, iter){
  434. super(new Int(arr, iter).value);
  435. for(let i = 0; i < this.length; i++) this[i] = new IntDouble(arr, iter);
  436. }
  437. };
  438. class TimingPoint{
  439. BPM = 0;
  440. offset = 0;
  441. notInherited = false;
  442. constructor(arr, iter){
  443. this.BPM = new Double(arr, iter).value;
  444. this.offset = new Double(arr, iter).value;
  445. this.notInherited = new Boolean(arr, iter).value;
  446. }
  447. };
  448. class TimingPointArray extends Array{
  449. constructor(arr, iter){
  450. super(new Int(arr, iter).value);
  451. for(let i = 0; i < this.length; i++) this[i] = new TimingPoint(arr, iter);
  452. }
  453. };
  454. class DateTime extends Long{};
  455. class Beatmap{
  456. constructor(arr, iter){
  457. if(iter.osuVersion < 20191106) this.bytes = new Int(arr, iter);
  458. this.artistName = new OString(arr, iter);
  459. this.artistNameUnicode = new OString(arr, iter);
  460. this.songTitle = new OString(arr, iter);
  461. this.songTitleUnicode = new OString(arr, iter);
  462. this.creatorName = new OString(arr, iter);
  463. this.difficultyName = new OString(arr, iter);
  464. this.audioFilename = new OString(arr, iter);
  465. this.MD5Hash = new OString(arr, iter);
  466. this.beatmapFilename = new OString(arr, iter);
  467. this.rankedStatus = new RankedStatus(arr, iter);
  468. this.hitcircleCount = new Short(arr, iter);
  469. this.sliderCount = new Short(arr, iter);
  470. this.spinnerCount = new Short(arr, iter);
  471. this.lastModified = new Long(arr, iter);
  472. this.AR = iter.osuVersion < 20140609 ? new Byte(arr, iter) : new Single(arr, iter);
  473. this.CS = iter.osuVersion < 20140609 ? new Byte(arr, iter) : new Single(arr, iter);
  474. this.HP = iter.osuVersion < 20140609 ? new Byte(arr, iter) : new Single(arr, iter);
  475. this.OD = iter.osuVersion < 20140609 ? new Byte(arr, iter) : new Single(arr, iter);
  476. this.sliderVelocity = new Double(arr, iter);
  477. if(iter.osuVersion >= 20140609) this.osuSRInfoArr = new IntDoubleArray(arr, iter);
  478. if(iter.osuVersion >= 20140609) this.taikoSRInfoArr = new IntDoubleArray(arr, iter);
  479. if(iter.osuVersion >= 20140609) this.catchSRInfoArr = new IntDoubleArray(arr, iter);
  480. if(iter.osuVersion >= 20140609) this.maniaSRInfoArr = new IntDoubleArray(arr, iter);
  481. this.drainTime = new Int(arr, iter);
  482. this.totalTime = new Int(arr, iter);
  483. this.audioPreviewTime = new Int(arr, iter);
  484. this.timingPointArr = new TimingPointArray(arr, iter);
  485. this.difficultyID = new Int(arr, iter);
  486. this.beatmapID = new Int(arr, iter);
  487. this.threadID = new Int(arr, iter);
  488. this.osuGrade = new Grade(arr, iter);
  489. this.taikoGrade = new Grade(arr, iter);
  490. this.catchGrade = new Grade(arr, iter);
  491. this.maniaGrade = new Grade(arr, iter);
  492. this.offsetLocal = new Short(arr, iter);
  493. this.stackLeniency = new Single(arr, iter);
  494. this.mode = new OsuMode(arr, iter);
  495. this.sourceStr = new OString(arr, iter);
  496. this.tagStr = new OString(arr, iter);
  497. this.offsetOnline = new Short(arr, iter);
  498. this.titleFont = new OString(arr, iter);
  499. this.unplayed = new Boolean(arr, iter);
  500. this.lastTimePlayed = new Long(arr, iter);
  501. this.isOsz2 = new Boolean(arr, iter);
  502. this.folderName = new OString(arr, iter);
  503. this.lastTimeChecked = new Long(arr, iter);
  504. this.ignoreBeatmapSound = new Boolean(arr, iter);
  505. this.ignoreBeatmapSkin = new Boolean(arr, iter);
  506. this.disableStoryboard = new Boolean(arr, iter);
  507. this.disableVideo = new Boolean(arr, iter);
  508. this.visualOverride = new Boolean(arr, iter);
  509. if(iter.osuVersion < 20140609) this.uselessShort = new Short(arr, iter);
  510. this.lastModified = new Int(arr, iter);
  511. this.scrollSpeedMania = new Byte(arr, iter);
  512. }
  513. };
  514. class BeatmapArray extends Array{
  515. constructor(arr, iter){
  516. super(new Int(arr, iter).value);
  517. for(let i = 0; i < this.length; i++) this[i] = new Beatmap(arr, iter);
  518. }
  519. };
  520. class OsuDb{
  521. constructor(arr, iter){
  522. this.version = new Int(arr, iter);
  523. iter.osuVersion = this.version.value;
  524. this.folderCount = new Int(arr, iter);
  525. this.accountUnlocked = new Boolean(arr, iter);
  526. this.timeTillUnlock = new DateTime(arr, iter);
  527. this.playerName = new OString(arr, iter);
  528. this.beatmapArray = new BeatmapArray(arr, iter);
  529. this.permission = new Int(arr, iter);
  530. }
  531. };
  532. const beatmapsets = new Set();
  533. const beatmaps = new Set();
  534. const bmsReg = /https:\/\/(?:osu|lazer)\.ppy\.sh\/beatmapsets\/([0-9]+)/;
  535. const bmsdlReg = /https:\/\/(?:osu|lazer)\.ppy\.sh\/beatmapsets\/([0-9]+)\/download/;
  536. const bmReg = /https:\/\/(?:osu|lazer)\.ppy\.sh\/beatmapsets\/(?:[0-9]+)#(?:mania|osu|fruits|taiko)\/([0-9]+)/;
  537. const BeatmapsetRefresh = () => {
  538. for(const bm of window.osudb.beatmapArray){
  539. beatmaps.add(bm.difficultyID.value);
  540. beatmapsets.add(bm.beatmapID.value);
  541. }
  542. OnMutation();
  543. };
  544. const NewOsuDb = (r) => {
  545. return new Promise((resolve, reject) => {
  546. const start = performance.now();
  547. const result = new Uint8Array(r.result);
  548. const length = result.length;
  549. console.log(`start reading osu!.db(${length} Bytes).`);
  550. const iter = {
  551. nxtpos: 0,
  552. };
  553. window.osudb = new OsuDb(result, iter);
  554. if(iter.nxtpos !== length) ShowPopup("There are still remaining unread bytes, something may be wrong.", "danger");
  555. ShowPopup(`Finished reading osu!.db in ${performance.now() - start} ms.`);
  556. resolve();
  557. })
  558. };
  559. const ReadOsuDb = (file) => {
  560. if(file.name !== "osu!.db"){ console.assert( false, "filename should be 'osu!.db'."); return; }
  561. const r = new FileReader();
  562. r.onload = () => {
  563. NewOsuDb(r);
  564. BeatmapsetRefresh();
  565. };
  566. r.onerror = () => console.assert(false, "error occurred while reading file.");
  567. r.readAsArrayBuffer(file);
  568. };
  569. const SelectOsuDb = (event) => {
  570. const t = event.target;
  571. const l = t.files;
  572. console.assert(l && l.length === 1, "No file or multiple files are selected.");
  573. ReadOsuDb(l[0]);
  574. };
  575. const CheckForUpdate = () => {
  576. const verReg = /<dd class="script-show-version"><span>([0-9\.]+)<\/span><\/dd>/;
  577. fetch("https://gf.qytechs.cn/en/scripts/475417-osu-web-enhancement", {
  578. credentials: "omit"
  579. }).then(response => response.text()).then((html) => {
  580. const ver = verReg.exec(html);
  581. if(ver){
  582. const result = (() => {
  583. const verList = ver[1].split(".");
  584. const thisVer = GM_info.script.version;
  585. console.log(`latest version is: ${ver[1]}, current version is: ${thisVer}`);
  586. const thisVerList = thisVer.split(".");
  587. for(let i = 0; i < verList.length; i++){
  588. if(Number(verList[i]) > Number(thisVerList[i] ?? 0)) return true;
  589. else if(Number(verList[i]) < Number(thisVerList[i] ?? 0)) return false;
  590. }
  591. return false;
  592. })();
  593. if(result){
  594. const a = HTML("a", {href: "https://gf.qytechs.cn/scripts/475417-osu-web-enhancement/code/osu!web%20enhancement.user.js", download: "", style: "display:none;"});
  595. a.click();
  596. }
  597. else{
  598. ShowPopup("The lastest version is already installed!")
  599. }
  600. }
  601. });
  602. };
  603. const AddMenu = () => {
  604. const menuId = "osu-web-enhancement-toolbar";
  605. if(!window.menuEventListener){
  606. window.addEventListener("click", (ev) => {
  607. const fid = ev.target?.dataset?.functionId;
  608. if(fid) switch(fid){
  609. case "import-osu-db-button": document.getElementById("osu-db-input")?.click(); break;
  610. case "check-for-update-button": CheckForUpdate(); break;
  611. }
  612. });
  613. window.menuEventListener = true;
  614. }
  615. if(document.getElementById(menuId)) return;
  616. const anc = document.querySelector("div.nav2__col.nav2__col--menu.js-react--quick-search-button");
  617. const i = HTML("input", {type: "file", id: "osu-db-input", accept: ".db", eventListener: [{
  618. type: "change",
  619. listener: SelectOsuDb,
  620. options: false,
  621. }]});
  622. const menuClass = "simple-menu simple-menu--nav2 simple-menu--nav2-left-aligned simple-menu--nav2-transparent js-menu";
  623. const menuItemClass = "simple-menu__item u-section-community--before-bg-normal";
  624. const menuTgtId = "osu-web-enhancement";
  625. anc.insertAdjacentElement("beforebegin",
  626. HTML("div", {class: "nav2__col nav2__col--menu", id: menuId},
  627. HTML("div", {class: "nav2__menu-link-main js-menu", "data-menu-target": `nav2-menu-popup-${menuTgtId}`, "data-menu-show-delay":"0", style:"flex-direction: column; cursor: default;"},
  628. HTML("span", {style: "flex-grow: 1;"}),
  629. HTML("span", {style: "font-size: 10px;"}, HTML("osu!web")),
  630. HTML("span", {style: "font-size: 10px;"}, HTML("enhancement")),
  631. HTML("span", {style: "flex-grow: 1;"}),
  632. ),
  633. HTML("div", {class: "nav2__menu-popup"},
  634. HTML("div", {class: `${menuClass}`, "data-menu-id": `nav2-menu-popup-${menuTgtId}`, "data-visibility": "hidden"},
  635. HTML("div", {class: `${menuItemClass}`, style: "cursor: pointer;", "data-function-id": "import-osu-db-button", }, HTML("Import osu!.db")),
  636. HTML("div", {class: `${menuItemClass}`, style: "cursor: pointer;", "data-function-id": "check-for-update-button"}, HTML("Check for update")),
  637. HTML("a", {class: `${menuItemClass}`, style: "cursor: pointer;", href: "https://gf.qytechs.cn/en/scripts/475417-osu-web-enhancement", target: "_blank"}, HTML("Go to GreasyFork page"))
  638. ),
  639. )
  640. )
  641. );
  642. const mobMenuItmCls = "navbar-mobile-item__submenu-item js-click-menu--close";
  643. const mob = document.querySelector(`div.mobile-menu__item.js-click-menu[data-click-menu-id="mobile-nav"]`);
  644. mob.insertAdjacentElement("beforeend",
  645. HTML("div", {class: "navbar-mobile-item"},
  646. HTML("div", {class: "navbar-mobile-item__main js-click-menu", "data-click-menu-target": `nav-mobile-${menuTgtId}`, style: "cursor: pointer;"},
  647. HTML("span", {class: "navbar-mobile-item__icon navbar-mobile-item__icon--closed"},
  648. HTML("i", {class: "fas fa-chevron-right"})
  649. ),
  650. HTML("span", {class: "navbar-mobile-item__icon navbar-mobile-item__icon--opened"},
  651. HTML("i", {class: "fas fa-chevron-down"})
  652. ),
  653. HTML("osu!web enhancement"),
  654. ),
  655. HTML("ul", {class: "navbar-mobile-item__submenu js-click-menu", "data-click-menu-id": `nav-mobile-${menuTgtId}`, "data-visibility": "hidden"},
  656. HTML("li", {}, HTML("div", {class: mobMenuItmCls, style: "cursor: pointer;", "data-function-id": "import-osu-db-button",}, HTML("Import osu!.db"))),
  657. HTML("li", {}, HTML("div", {class: mobMenuItmCls, style: "cursor: pointer;", "data-function-id": "check-for-update-button"}, HTML("Check for update"))),
  658. HTML("a", {class: `${mobMenuItmCls}`, style: "cursor: pointer;", href: "https://gf.qytechs.cn/en/scripts/475417-osu-web-enhancement", target: "_blank"}, HTML("Go to GreasyFork page"))
  659. )
  660. )
  661. );
  662. document.body.appendChild(i);
  663. };
  664. const FilterBeatmapSet = () => {
  665. document.querySelectorAll(".beatmapsets__item").forEach((item) => {
  666. const bmsID = Number(bmsReg.exec(item.innerHTML)?.[1]);
  667. if(bmsID && beatmapsets.has(bmsID)){
  668. item.classList.add("owned-beatmapset");
  669. }
  670. });
  671. document.querySelectorAll("div.bbcode a, a.osu-md__link").forEach(item => {
  672. if(item.classList.contains("owned-beatmap-link") || item.classList.contains("beatmap-download-link")) return;
  673. const e = bmsReg.exec(item.href);
  674. if(e && beatmapsets.has(Number(e[1]))){
  675. item.classList.add("owned-beatmap-link");
  676. if(item.nextElementSibling?.classList?.contains("beatmap-download-link")) item.nextElementSibling.remove();
  677. const box = item.getBoundingClientRect();
  678. const size = Math.round(box.height / 16 * 14);
  679. const vert = Math.round(size * 4 / 14) / 2;
  680. item.after(HTML("img", {src: svg_green_tick, title: "Owned", alt: "owned beatmap", style: `margin: 0px 5px; width: ${size}px; height: ${size}px; vertical-align: -${vert}px;`}));
  681. }else if(e && !item.nextElementSibling?.classList?.contains("beatmap-download-link")){
  682. item.after(
  683. HTML("a", {class: "beatmap-download-link", href: `https://osu.ppy.sh/beatmapsets/${e[1]}/download`, download: ""},
  684. HTML("span", {class: "fas fa-file-download", title: "Download"})
  685. )
  686. );
  687. }
  688. });
  689. document.querySelectorAll("li.beatmap-pack-items__set").forEach(item => {
  690. if(item.classList.contains("owned-beatmap-pack-item")) return;
  691. const a = item.querySelector("a.beatmap-pack-items__link");
  692. const e = bmsReg.exec(a.href);
  693. if(e && beatmapsets.has(Number(e[1]))){
  694. item.classList.add("owned-beatmap-pack-item");
  695. const span = item.querySelector("span.fal");
  696. span.setAttribute("title", "Owned");
  697. span.dataset.origTitle = "owned";
  698. span.setAttribute("class", "");
  699. span.append(HTML("img", {src: svg_green_tick, alt: "owned beatmap", style: `width: 16px; height: 16px; vertical-align: -2px;`}));
  700. const parent = item.querySelector(".beatmap-pack-item-download-link");
  701. if(parent){
  702. console.assert(parent.parentElement === item, "unexpected error occurred!");
  703. item.insertBefore(span, parent);
  704. parent.remove();
  705. }
  706. }else if(e){
  707. const icon = item.querySelector(".beatmap-pack-items__icon");
  708. icon.setAttribute("title", "Download");
  709. icon.setAttribute("class", "fas fa-file-download beatmap-pack-items__icon");
  710. if(icon.parentElement === item){
  711. const dl = HTML("a", {class: "beatmap-pack-item-download-link", href: `https://osu.ppy.sh/beatmapsets/${e[1]}/download`, download: ""});
  712. item.insertBefore(dl, icon);
  713. dl.append(icon);
  714. }
  715. }
  716. })
  717. };
  718. const AdjustStyle = (modestr, sectionName) => {
  719. const styleSheetId = `userscript-generated-stylesheet-${sectionName}`;
  720. let e = document.getElementById(styleSheetId);
  721. if(!e){
  722. e = document.createElement("style");
  723. e.id = styleSheetId;
  724. document.head.appendChild(e);
  725. }
  726. const s = e.sheet;
  727. while(s.cssRules.length) s.deleteRule(0);
  728. const sectionSelector = `div.js-sortable--page[data-page-id="${sectionName}"]`;
  729. let ll = [];
  730. switch(modestr){
  731. case "mania": ll = [".mania-300", ".mania-200", ".mania-100", ".mania-50", ".mania-miss"]; break;
  732. case "fruits": ll = [".fruits-300", ".fruits-100", ".fruits-50-miss", ".fruits-miss"]; break;
  733. case "taiko": ll = [".taiko-300", ".taiko-150", ".taiko-miss"]; break;
  734. case "osu": ll = [".osu-300", ".osu-100", ".osu-50", ".osu-miss"]; break;
  735. }
  736. class FasterCalc{
  737. _map = new Map();
  738. Calculate = (ele) => {
  739. const t = ele.textContent;
  740. let w = 0, changed = false;
  741. for(const c of t){
  742. let wc = this._map.get(c);
  743. if(!wc){
  744. if(!changed) changed = ele.cloneNode(true);
  745. ele.textContent = c;
  746. wc = ele.clientWidth;
  747. this._map.set(c, wc);
  748. }
  749. w += wc;
  750. }
  751. if(changed){
  752. ele.insertAdjacentElement("afterend", changed);
  753. ele.remove();
  754. }
  755. return w;
  756. };
  757. };
  758. let past = performance.now(), curr;
  759. let fc = new FasterCalc();
  760. ll.forEach((str) =>
  761. s.insertRule(
  762. `${sectionSelector} ${str} + .score-detail-data-text {
  763. width: ${[...document.querySelectorAll(`${sectionSelector} ${str} + .score-detail-data-text`)].reduce((max, ele) => { const w = fc.Calculate(ele); return w > max ? w : max }, 0) + 2}px;
  764. }` ,0
  765. )
  766. );
  767. curr = performance.now();
  768. console.log(`AdjustStyle Stage 1: ${curr - past}ms`);
  769. past = performance.now();
  770. fc = new FasterCalc();
  771. [".play-detail__combo", ".play-detail__Accuracy", ".play-detail__Accuracy2"].forEach((str) =>
  772. s.insertRule(
  773. `${sectionSelector} ${str}{
  774. min-width: ${Math.ceil([...document.querySelectorAll(`${sectionSelector} ${str}`)].reduce((max, ele) => {const w = fc.Calculate(ele); return w > max ? w : max;}, 0)) + 1}px;
  775. }`
  776. ,0
  777. )
  778. );
  779. curr = performance.now();
  780. console.log(`AdjustStyle Stage 2: ${curr - past}ms`);
  781. past = performance.now();
  782. [".play-detail__pp"].forEach((str) =>
  783. s.insertRule(
  784. `${sectionSelector} ${str}{
  785. min-width: ${Math.ceil([...document.querySelectorAll(`${sectionSelector} ${str}`)].reduce((max, ele) => {const w = ele.clientWidth; return w > max ? w : max;}, 0)) + 1}px;
  786. }`
  787. ,0
  788. )
  789. );
  790. curr = performance.now();
  791. console.log(`AdjustStyle Stage 3: ${curr - past}ms`);
  792. past = performance.now();
  793. };
  794. const TopRanksWorker = (userId, modestr, addedNodes = [document.body]) => {
  795. const isLazer = window.location.hostname.split(".")[0] === "lazer"; // assume that hostname can only be osu.ppy.sh or lazer.ppy.sh
  796. const subdomain = isLazer ? "lazer": "osu";
  797. let sectionNames = new Set();
  798. const GetSection = (ele) => {
  799. let count = 0;
  800. while(ele){
  801. if(ele.tagName === "DIV" && ele.className === "js-sortable--page") return ele.dataset.pageId;
  802. ele = ele.parentElement;
  803. count++;
  804. if(count > 50) console.log(ele);
  805. }
  806. };
  807. addedNodes.forEach((eles) => {
  808. if(eles instanceof Element) eles.querySelectorAll(":scope div.play-detail.play-detail--highlightable").forEach((ele) => {
  809. if(ele.getAttribute("improved") !== null) return;
  810. const a = ele.querySelector(":scope time.js-timeago");
  811. const t = a.getAttribute("datetime");
  812. const data = messageCache.get(`${userId},${modestr},${subdomain},${t}`);
  813. if(data){
  814. sectionNames.add(GetSection(ele));
  815. ListItemWorker(ele, data, isLazer);
  816. }
  817. });
  818. });
  819. sectionNames.forEach(sectionName => AdjustStyle(modestr, sectionName));
  820. };
  821. const DiffToColour = (diff, stops = [0.1, 1.25, 2, 2.5, 3.3, 4.2, 4.9, 5.8, 6.7, 7.7, 9], vals = ['#4290FB', '#4FC0FF', '#4FFFD5', '#7CFF4F', '#F6F05C', '#FF8068', '#FF4E6F', '#C645B8', '#6563DE', '#18158E', '#000000']) => {
  822. const len = stops.length;
  823. diff = Math.min(Math.max(diff, stops[0]), stops[len - 1]);
  824. let r = stops.findIndex(stop => stop > diff);
  825. if(r === -1) r = len - 1;
  826. const d = stops[r] - stops[r - 1];
  827. return `#${[[1, 3], [3, 5], [5, 7]]
  828. .map(_ => [Number.parseInt(vals[r].slice(..._), 16), Number.parseInt(vals[r-1].slice(..._), 16)])
  829. .map(_ => Math.round((_[0] ** 2.2 * (diff - stops[r-1]) / d + _[1] ** 2.2 * (stops[r] - diff) / d) ** (1 / 2.2)).toString(16).padStart(2, "0"))
  830. .join("")
  831. }`;
  832. };
  833. let scr = {};
  834. const ListItemWorker = (ele, data, isLazer) => {
  835. if(ele.getAttribute("improved") !== null) return;
  836. ele.setAttribute("improved", "");
  837. if(data.pp){
  838. data.pp = Number(data.pp);
  839. const pptext = ele.querySelector(".play-detail__pp > span").childNodes[0];
  840. pptext.nodeValue = data.pp >= 1 ? data.pp.toPrecision(5) : (data.pp < 0.00005 ? 0 : data.pp.toFixed(4));
  841. if(data.weight) pptext.title = `${data.weight.pp >= 1 ? data.weight.pp.toPrecision(5) : (data.weight.pp < 0.00005 ? 0 : data.weight.pp.toFixed(4))} of total pp`;
  842. }
  843. const left = ele.querySelector("div.play-detail__group.play-detail__group--top");
  844. const leftc = HTML("div", {class: "play-detail__group--background", style: `background-image: url(https://assets.ppy.sh/beatmaps/${data.beatmap.beatmapset_id}/covers/card@2x.jpg);`});
  845. left.insertAdjacentElement("beforebegin", leftc);
  846. const detail = ele.querySelector("div.play-detail__score-detail-top-right");
  847. const du = detail.children[0];
  848. if(!detail.children[1]) detail.append(HTML("div", {classList: "play-detail__pp-weight"}));
  849. const db = detail.children[1];
  850. data.statistics.perfect ??= 0, data.statistics.great ??= 0, data.statistics.good ??= 0, data.statistics.ok ??= 0, data.statistics.meh ??= 0, data.statistics.miss ??= 0;
  851. const bmName = ele.querySelector("span.play-detail__beatmap");
  852. const sr = HTML("div", {class: `difficulty-badge ${data.beatmap.difficulty_rating >= 6.7 ? "difficulty-badge--expert-plus" : ""}`, style: `--bg: ${DiffToColour(data.beatmap.difficulty_rating)}`},
  853. HTML("span", {class: "difficulty-badge__icon"}, HTML("span", {class: "fas fa-star"})),
  854. HTML("span", {class: "difficulty-badge__rating"}, HTML(`${data.beatmap.difficulty_rating.toFixed(2)}`))
  855. );
  856. /*
  857. const ic = ele;
  858. ic.classList.add("audio-player", "js-audio--player");
  859. ic.setAttribute("data-audio-url", `https://b.ppy.sh/preview/${data.beatmap.beatmapset_id}.mp3`)
  860. ic.setAttribute("data-audio-state", "paused");
  861. const gr = ele;
  862. gr.classList.add("audio-player__button", "audio-player__button--play", "js-audio--play");
  863. */
  864. bmName.parentElement.insertBefore(sr, bmName);
  865. const bma = ele.querySelector("a.play-detail__title");
  866. const cnt = [data.beatmap.count_circles, data.beatmap.count_sliders, data.beatmap.count_spinners];
  867. // const modeName = ["STD", "TAIKO", "CTB", "MANIA"];
  868. const secToMin = (s) => `${Math.floor(s/60)}:${String(s%60).padStart(2, '0')}`;
  869. // let scrMsg = `${modeName[data.ruleset_id]} ${data.beatmapset.title}\n[${data.beatmap.version}] ${secToMin(data.beatmap.total_length)}\n${data.total_score} ${data.rank} ${data.pp ? (data.pp >= 1 ? data.pp.toPrecision(5) : (data.pp < 0.00005 ? 0 : data.pp.toFixed(4))) : "-"}pp\n`;
  870. let scrMsg = `${data.beatmapset.title}\n [${data.beatmap.version}] ${secToMin(data.beatmap.total_length)}\n${data.total_score} ${data.rank} ${data.pp ? (data.pp >= 1 ? data.pp.toPrecision(5) : (data.pp < 0.00005 ? 0 : data.pp.toFixed(4))) : "-"}pp\n`;
  871. bma.onclick = (e) => {e.stopPropagation();};
  872. switch(data.ruleset_id){
  873. case 0:{
  874. du.replaceChildren(
  875. HTML("span", {class: "play-detail__before"}),
  876. HTML("span", {class: "play-detail__Accuracy", title: `${isLazer ? "V2" : "V1"} Accuracy`}, HTML(`${(data.accuracy * 100).toFixed(2)}%`)),
  877. HTML("span", {class: "play-detail__combo", title: `Combo${isLazer ? "/Max Combo" : ""}`},
  878. HTML("span", {class: `combo ${isLazer ?(data.max_combo === (data.maximum_statistics.great ?? 0) + (data.maximum_statistics.legacy_combo_increase ?? 0) ? "legacy-perfect-combo" : ""):(data.legacy_perfect ? "legacy-perfect-combo" : "")}`}, HTML(`${data.max_combo}`)),
  879. isLazer ? HTML("/") : null,
  880. isLazer ? HTML("span", {class: "max-combo"}, HTML(`${(data.maximum_statistics.great ?? 0) + (data.maximum_statistics.legacy_combo_increase ?? 0)}`)) : null,
  881. HTML("x"),
  882. ),
  883. );
  884. const m_300 = HTML("span", {class: "score-detail score-detail-osu-300"},
  885. HTML("span", {class: "osu-300"},
  886. HTML("300")
  887. ),
  888. HTML("span", {class: "score-detail-data-text"},
  889. HTML(`${data.statistics.great + data.statistics.perfect}`)
  890. )
  891. );
  892. const s100 = HTML("span", {class: "score-detail score-detail-osu-100"},
  893. HTML("span", {class: "osu-100"},
  894. HTML("100")
  895. ),
  896. HTML("span", {class: "score-detail-data-text"},
  897. HTML(`${data.statistics.ok + data.statistics.good}`)
  898. )
  899. );
  900. const s50 = HTML("span", {class: "score-detail score-detail-osu-50"},
  901. HTML("span", {class: "osu-50"},
  902. HTML("50")
  903. ),
  904. HTML("span", {class: "score-detail-data-text"},
  905. HTML(`${data.statistics.meh}`)
  906. )
  907. );
  908. const s0 = HTML("span", {class: "score-detail score-detail-osu-miss"},
  909. HTML("span", {class: "osu-miss"},
  910. HTML("img", {src: svg_osu_miss, alt: "miss"})
  911. ),
  912. HTML("span", {class: "score-detail-data-text"},
  913. HTML(`${data.statistics.miss}`)
  914. )
  915. );
  916. db.replaceChildren(m_300, s100, s50, s0);
  917. scrMsg += `${data.statistics.great + data.statistics.perfect}-${data.statistics.ok + data.statistics.good}-${data.statistics.meh}-${data.statistics.miss} ${data.max_combo}`;
  918. if (isLazer) {
  919. scrMsg += `${(data.maximum_statistics.great ?? 0) + (data.maximum_statistics.legacy_combo_increase ?? 0)}`;
  920. }
  921. scrMsg += "x\n";
  922. scrMsg += `⭕ ${cnt[0]} 🌡️ ${cnt[1]} 🔄 ${cnt[2]}\n`;
  923. break;
  924. }
  925. case 1:{
  926. const cur = [data.statistics.great ?? 0, data.statistics.ok ?? 0, data.statistics.miss ?? 0];
  927. const mx = cur[0] + cur[1] + cur[2];
  928. du.replaceChildren(
  929. HTML("span", {class: "play-detail__before"}),
  930. HTML("span", {class: "play-detail__Accuracy"}, HTML(`${(data.accuracy * 100).toFixed(2)}%`)),
  931. HTML("span", {class: "play-detail__combo", title: `Combo/Max Combo`},
  932. HTML("span", {class: `combo ${(data.max_combo === mx ? "legacy-perfect-combo" : "")}`}, HTML(`${data.max_combo}`)),
  933. HTML("/"),
  934. HTML("span", {class: "max-combo"}, HTML(`${mx}`)),
  935. HTML("x"),
  936. ),
  937. );
  938. db.replaceChildren(
  939. HTML("span", {class: "score-detail score-detail-taiko-300"},
  940. HTML("span", {class: "taiko-300"}, HTML("300")),
  941. HTML("span", {class: "score-detail-data-text"}, HTML(data.statistics.great ?? 0))
  942. ),
  943. HTML("span", {class: "score-detail score-detail-taiko-150"},
  944. HTML("span", {class: "taiko-150"}, HTML("150")),
  945. HTML("span", {class: "score-detail-data-text"}, HTML(data.statistics.ok ?? 0))
  946. ),
  947. HTML("span", {class: "score-detail score-detail-fruits-combo"},
  948. HTML("span", {class: "taiko-miss"}, HTML("miss")),
  949. HTML("span", {class: "score-detail-data-text"}, HTML(data.statistics.miss ?? 0))
  950. ),
  951. );
  952. scrMsg += `${data.statistics.great}-${data.statistics.ok}-${data.statistics.miss} ${data.max_combo}/${mx}x\n`;
  953. scrMsg += `🥁 ${cnt[0]} 🌡️ ${cnt[1]} 🍥 ${cnt[2]}\n`;
  954. break;
  955. }
  956. case 2:{
  957. if (isLazer) {
  958. const cur = [data.statistics.great ?? 0, data.statistics.large_tick_hit ?? 0, data.statistics.small_tick_hit ?? 0];
  959. const mx = [data.maximum_statistics.great ?? 0, data.maximum_statistics.large_tick_hit ?? 0, data.maximum_statistics.small_tick_hit ?? 0];
  960. du.replaceChildren(
  961. HTML("span", {class: "play-detail__before"}),
  962. HTML("span", {class: "play-detail__Accuracy"}, HTML(`${(data.accuracy * 100).toFixed(2)}%`)),
  963. HTML("span", {class: "play-detail__combo", title: `Combo/Max Combo`},
  964. HTML("span", {class: `combo ${(data.max_combo === mx[0] + mx[1] ? "legacy-perfect-combo" : "")}`}, HTML(`${data.max_combo}`)),
  965. isLazer ? HTML("/") : null,
  966. isLazer ? HTML("span", {class: "max-combo"}, HTML(`${mx[0] + mx[1]}`)) : null,
  967. HTML("x"),
  968. ),
  969. );
  970. db.replaceChildren(
  971. HTML("span", {class: "score-detail score-detail-fruits-300"},
  972. HTML("span", {class: "fruits-300"}, HTML("fruits")),
  973. HTML("span", {class: "score-detail-data-text"}, HTML(cur[0] + "/" + mx[0]))
  974. ),
  975. HTML("span", {class: "score-detail score-detail-fruits-100"},
  976. HTML("span", {class: "fruits-100"}, HTML("ticks")),
  977. HTML("span", {class: "score-detail-data-text"}, HTML(cur[1] + "/" + mx[1]))
  978. ),
  979. HTML("span", {class: "score-detail score-detail-fruits-50-miss"},
  980. HTML("span", {class: "fruits-50-miss"}, HTML("drops")),
  981. HTML("span", {class: "score-detail-data-text"}, HTML(cur[2] + "/" + mx[2]))
  982. )
  983. );
  984. scrMsg += `${cur[0]}/${mx[0]}-${cur[1]}/${mx[1]}-${cur[2]}/${mx[2]} ${data.max_combo}/${mx[0] + mx[1]}x\n`;
  985. scrMsg += `🍎 ${cnt[0]} 💧 ${cnt[1]} 🍌 ${cnt[2]}\n`;
  986. } else {
  987. du.replaceChildren(
  988. HTML("span", {class: "play-detail__before"}),
  989. HTML("span", {class: "play-detail__Accuracy"}, HTML(`${(data.accuracy * 100).toFixed(2)}%`)),
  990. );
  991. db.replaceChildren(
  992. HTML("span", {class: "score-detail score-detail-fruits-300"},
  993. HTML("span", {class: "fruits-300"}, HTML("FRUIT")),
  994. HTML("span", {class: "score-detail-data-text"}, HTML(data.statistics.great ?? 0))
  995. ),
  996. HTML("span", {class: "score-detail score-detail-fruits-100"},
  997. HTML("span", {class: "fruits-100"}, HTML("tick")),
  998. HTML("span", {class: "score-detail-data-text"}, HTML(data.statistics.large_tick_hit ?? 0))
  999. ),
  1000. HTML("span", {class: "score-detail score-detail-fruits-50-miss"},
  1001. HTML("span", {class: "fruits-50-miss"}, HTML("miss")),
  1002. HTML("span", {class: "score-detail-data-text"}, HTML(data.statistics.small_tick_miss ?? 0))
  1003. ),
  1004. HTML("span", {class: "score-detail score-detail-fruits-miss"},
  1005. HTML("span", {class: "fruits-miss"}, HTML("MISS")),
  1006. HTML("span", {class: "score-detail-data-text"}, HTML(data.statistics.miss ?? 0))
  1007. )
  1008. );
  1009. scrMsg += `${data.statistics.great ?? 0}-${data.statistics.large_tick_hit ?? 0}-${data.statistics.small_tick_miss ?? 0}-${data.statistics.miss ?? 0} ${data.max_combo}\n`;
  1010. scrMsg += `🍎 ${cnt[0]} 💧 ${cnt[1]} 🍌 ${cnt[2]}\n`;
  1011. }
  1012. break;
  1013. }
  1014. case 3:{
  1015. const v2acc = (320*data.statistics.perfect+300*data.statistics.great+200*data.statistics.good+100*data.statistics.ok+50*data.statistics.meh)/(320*(data.statistics.perfect+data.statistics.great+data.statistics.good+data.statistics.ok+data.statistics.meh+data.statistics.miss));
  1016. const MCombo = (data.maximum_statistics.perfect ?? 0) + (data.maximum_statistics.legacy_combo_increase ?? 0);
  1017. const isMCombo = isLazer ? data.max_combo >= MCombo : data.legacy_perfect;
  1018. du.replaceChildren(
  1019. HTML("span", {class: "play-detail__before"}),
  1020. HTML("span", {class: "play-detail__Accuracy2", title: `pp Accuracy`}, HTML(`${(v2acc * 100).toFixed(2)}%`)),
  1021. HTML("span", {class: "play-detail__Accuracy", title: `Score${isLazer ? "V2" : "V1"} Accuracy`}, HTML(`${(data.accuracy * 100).toFixed(2)}%`)),
  1022. HTML("span", {class: "play-detail__combo", title: `Combo${isLazer ? "/Max Combo" : ""}`},
  1023. HTML("span", {class: `combo ${isMCombo ? "legacy-perfect-combo" : ""}`}, HTML(`${data.max_combo}`)),
  1024. isLazer ? HTML("/") : null,
  1025. isLazer ? HTML("span", {class: "max-combo"}, HTML(MCombo)) : null,
  1026. HTML("x"),
  1027. ),
  1028. );
  1029. if(data.pp){
  1030. const lostpp = data.pp * (0.2 / (Math.min(Math.max(v2acc, 0.8), 1) - 0.8) - 1);
  1031. ele.querySelector(".play-detail__pp").appendChild(HTML("span", {class: "lost-pp"}, HTML(`-${lostpp.toPrecision(4)}`)));
  1032. }
  1033. const M_300 = Number(data.statistics.perfect) / Math.max(Number(data.statistics.great), 1);
  1034. db.replaceChildren(
  1035. HTML("span", {class: "score-detail score-detail-mania-max-300"},
  1036. HTML("span", {class: "mania-max"}, HTML("M")),
  1037. HTML("/"),
  1038. HTML("span", {class: "mania-300"}, HTML("300")),
  1039. HTML("span", {class: "score-detail-data-text"}, HTML(`${M_300 >= 1000 ? Math.round(M_300) : (M_300 < 1 ? M_300.toFixed(2): M_300.toPrecision(3))}`))
  1040. ),
  1041. HTML("span", {class: "score-detail score-detail-mania-max-200"},
  1042. HTML("span", {class: "mania-200"}, HTML("200")),
  1043. HTML("span", {class: "score-detail-data-text"}, HTML(data.statistics.good))
  1044. ),
  1045. HTML("span", {class: "score-detail score-detail-mania-max-100"},
  1046. HTML("span", {class: "mania-100"}, HTML("100")),
  1047. HTML("span", {class: "score-detail-data-text"}, HTML(data.statistics.ok))
  1048. ),
  1049. HTML("span", {class: "score-detail score-detail-mania-max-50"},
  1050. HTML("span", {class: "mania-50"}, HTML("50")),
  1051. HTML("span", {class: "score-detail-data-text"}, HTML(data.statistics.meh))
  1052. ),
  1053. HTML("span", {class: "score-detail score-detail-mania-max-0"},
  1054. HTML("span", {class: "mania-miss"}, HTML("miss")),
  1055. HTML("span", {class: "score-detail-data-text"}, HTML(data.statistics.miss))
  1056. )
  1057. );
  1058. scrMsg += `${data.statistics.perfect}-${data.statistics.great}-${data.statistics.good}-${data.statistics.ok}-${data.statistics.meh}-${data.statistics.miss} ${data.max_combo}`;
  1059. if(isLazer){
  1060. scrMsg += `/${MCombo}`;
  1061. }
  1062. scrMsg += "x\n";
  1063. scrMsg += `🍚 ${cnt[0]} 🍜 ${cnt[1]}\n`;
  1064. break;
  1065. }
  1066. }
  1067. scr[data.id] = scrMsg;
  1068. }
  1069. let lastInitData;
  1070. const OsuLevelToExp = (n) => {
  1071. if(n <= 100) return 5000 / 3 * (4 * n ** 3 - 3 * n ** 2 - n) + 1.25 * 1.8 ** (n - 60);
  1072. else return 26_931_190_827 + 99_999_999_999 * (n - 100);
  1073. }
  1074. const OsuExpValToStr = (num) => {
  1075. let exp = Math.log10(num);
  1076. if(exp >= 12){
  1077. return `${(num / 10 ** 12).toPrecision(4)}T`;
  1078. }
  1079. else if(exp >= 9){
  1080. return `${(num / 10 ** 9).toPrecision(4)}B`;
  1081. }
  1082. else if(exp >= 6){
  1083. return `${(num / 10 ** 6).toPrecision(4)}M`;
  1084. }
  1085. else if(exp >= 4){
  1086. return `${(num / 10 ** 3).toPrecision(4)}K`;
  1087. }
  1088. else return `${num}`;
  1089. }
  1090. const messageCache = new Map();
  1091. window.messageCache = messageCache;
  1092. const profUrlReg = /https:\/\/(?:osu|lazer)\.ppy\.sh\/users\/[0-9]+(?:|\/osu|\/taiko|\/fruits|\/mania)/;
  1093. const ImproveProfile = (mulist) => {
  1094. let initData, wloc = window.location.toString();
  1095. if(!profUrlReg.exec(wloc)) return;
  1096. const initDataEle = document.querySelector(".js-react--profile-page.osu-layout.osu-layout--full");
  1097. if(!initDataEle) return;
  1098. initData = JSON.parse(initDataEle.dataset.initialData);
  1099. const userId = initData.user.id, modestr = initData.current_mode;
  1100. if(initData !== lastInitData){
  1101. let ppDiv;
  1102. document.querySelectorAll("div.value-display.value-display--plain").forEach((ele) => {
  1103. if(ele.querySelector("div.value-display__label").textContent === "pp") ppDiv = ele;
  1104. });
  1105. if(ppDiv){
  1106. const ttscore = initData.user.statistics.total_score;
  1107. const lvl = initData.user.statistics.level.current;
  1108. const upgradescore = Math.round(OsuLevelToExp(lvl + 1) - OsuLevelToExp(lvl));
  1109. const lvlscore = ttscore - Math.round(OsuLevelToExp(lvl));
  1110. lastInitData = initData;
  1111. document.querySelector("div.bar__text").textContent = `${OsuExpValToStr(lvlscore)}/${OsuExpValToStr(upgradescore)} (${(lvlscore/upgradescore * 100).toPrecision(3)}%)`;
  1112. const _pp = initData.user.statistics.pp;
  1113. ppDiv.querySelector(".value-display__value > div").textContent = _pp >= 1 ? _pp.toPrecision(6) : (_pp < 0.000005 ? 0 : _pp.toFixed(5));
  1114. }
  1115. }
  1116. if(mulist !== undefined) mulist.forEach((record) => {
  1117. if(record.type === "childList" && record.addedNodes) TopRanksWorker(userId, modestr, record.addedNodes);
  1118. });
  1119. }
  1120. let wloc = "";
  1121. const WindowLocationChanged = () => {
  1122. if(window.location !== wloc){
  1123. wloc = window.location;
  1124. return true;
  1125. }
  1126. else return false;
  1127. }
  1128. const InsertStyleSheet = () => {
  1129. //const sheetId = "osu-web-enhancement-general-stylesheet";
  1130. const s = new CSSStyleSheet();
  1131. s.replaceSync(inj_style);
  1132. document.adoptedStyleSheets = [...document.adoptedStyleSheets, s];
  1133. }
  1134. const OnBeatmapsetDownload = (message) => {
  1135. beatmapsets.add(message.beatmapsetId);
  1136. }
  1137. const ImproveBeatmapPlaycountItems = () => {
  1138. for(const item of [...document.querySelectorAll("div.beatmap-playcount")]){
  1139. if(item.getAttribute("improved") !== null) continue;
  1140. item.setAttribute("improved", "");
  1141. const a = item.querySelector("a");
  1142. const bms = bmsReg.exec(a.href);
  1143. if(!bms?.[1]) continue;
  1144. const d = item.querySelector("div.beatmap-playcount__detail");
  1145. const b = HTML("div", {class: "beatmap-playcount__background", style: `background-image: url(https://assets.ppy.sh/beatmaps/${bms[1]}/covers/card@2x.jpg)`});
  1146. if(d.childElementCount > 0) d.insertBefore(b, d.children[0]);
  1147. else d.append(b);
  1148. }
  1149. }
  1150. const CloseScoreCardPopup = () => {
  1151. document.querySelector("div.score-card-popup-window").remove();
  1152. }
  1153. const CopyToClipboard = (txt) => {
  1154. const t = document.createElement('textarea');
  1155. t.value = txt;
  1156. document.body.appendChild(t);
  1157. t.select();
  1158. document.execCommand('copy');
  1159. document.body.removeChild(t);
  1160. }
  1161. const ShowScoreCardPopup = () => {
  1162. const p = document.querySelector("div.js-portal");
  1163. if(!p) return;
  1164. document.body.append(
  1165. HTML("div", {class: "score-card-popup-window"},
  1166. HTML("div", {class: "score-card-popup-menu"},
  1167. HTML("button", {class: "score-card-close-button", eventListener: {type: "click", listener: CloseScoreCardPopup}}),
  1168. HTML("button", {class: "score-card-copy-to-clipboard-button", ev}),
  1169. ),
  1170. HTML("div", {class: "score-card"},
  1171. )
  1172. )
  1173. );
  1174. };
  1175. const CopyDetailsPopup = (id) => {
  1176. let msg = scr[document.querySelector("div.js-portal")?.querySelector("div.simple-menu").querySelector("a").href.split("/").pop()];
  1177. console.log(msg);
  1178. CopyToClipboard(msg);
  1179. ShowPopup("Score details copied to clipboard!");
  1180. };
  1181. const AddPopupButton = () => {
  1182. const p = document.querySelector("div.js-portal")?.querySelector("div.simple-menu");
  1183. if(!p || p.querySelector("button.score-card-popup-button")) return;
  1184. // p.append(HTML("button", {class: "score-card-popup-button simple-menu__item", type: "button", eventListener: [{type: "click", listener: ShowScoreCardPopup}]}, HTML("Popup")));
  1185. p.append(HTML("button", {class: "score-card-popup-button simple-menu__item", type: "button", eventListener: [{type: "click", listener: CopyDetailsPopup}]}, HTML("Copy Text Details")));
  1186. };
  1187. const OnMutation = (mulist) => {
  1188. mut.disconnect();
  1189. AddMenu();
  1190. FilterBeatmapSet();
  1191. ImproveBeatmapPlaycountItems();
  1192. ImproveProfile(mulist);
  1193. AddPopupButton();
  1194. mut.observe(document, {childList: true, subtree: true});
  1195. };
  1196. const MessageFilter = (message) => {
  1197. info = `${message.userId},${message.mode},${message.subdomain}`;
  1198. switch(message.type){
  1199. case "beatmapset_download_complete": OnBeatmapsetDownload(message); break;
  1200. case "top_ranks":
  1201. [message.data.pinned.items, message.data.best.items, message.data.firsts.items].forEach(items => items.forEach(item => {
  1202. messageCache.set(`${info},${item.ended_at}`, item);
  1203. }));
  1204. TopRanksWorker(message.userId, message.mode);
  1205. break;
  1206. case "firsts": case "pinned": case "best": case "recent":
  1207. message.data.forEach(item => { messageCache.set(`${info},${item.ended_at}`, item); });
  1208. TopRanksWorker(message.userId, message.mode);
  1209. break;
  1210. case "historical":
  1211. message.data.recent.items.forEach(item => { messageCache.set(`${info},${item.ended_at}`, item); });
  1212. TopRanksWorker(message.userId, message.mode);
  1213. break;
  1214. }
  1215. }
  1216. const WindowMessageFilter = (event) => {
  1217. if(event.source === window && event?.data?.id === "osu!web enhancement"){
  1218. MessageFilter(event.data);
  1219. }
  1220. }
  1221. const OnClick = (event) => {
  1222. let t = event.target;
  1223. while(t){
  1224. if(t.tagName === "A"){
  1225. const e = bmsdlReg.exec(t.href);
  1226. if(!e) continue;
  1227. beatmapsets.add(Number(e[1]));
  1228. FilterBeatmapSet();
  1229. break;
  1230. }
  1231. t = t.parentElement;
  1232. }
  1233. }
  1234. //document.addEventListener("click", OnClick);
  1235. window.addEventListener("message", WindowMessageFilter);
  1236. const mut = new MutationObserver(OnMutation);
  1237. mut.observe(document, {childList: true, subtree: true});
  1238. InsertStyleSheet();
  1239. //{id, mode} -> (bmid -> record)
  1240. console.log("osu!web enhancement loaded");

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址