├── README.md ├── hitcount_bar_type ├── config.js ├── css │ ├── all.min.css │ ├── odometr.css │ ├── style.css │ └── style_count.css ├── deps │ ├── countUp.js │ ├── jquery.animate-shadow-min.js │ ├── jquery.counterup.min.js │ ├── jquery.waypoints.min.js │ ├── odometr.js │ ├── reconnecting-websocket.min.js │ └── socket.js ├── fonts │ └── MADETOMMY.otf ├── index.html ├── index.js └── metadata.txt ├── mania_ingame ├── css │ ├── style_hitcount.css │ └── style_hiterror.css ├── deps │ ├── reconnecting-websocket.min.js │ └── smooth.js ├── fonts │ ├── GOTHICB.TTF │ ├── GoogleSans-Bold.otf │ ├── MADETOMMY.otf │ ├── malgun.ttf │ └── malgunbd.ttf ├── index.html ├── index.js └── setting.js ├── mania_normal ├── css │ └── style.css ├── deps │ ├── countUp.js │ ├── odometr.js │ ├── reconnecting-websocket.min.js │ └── smooth.js ├── fonts │ ├── GOTHICB.TTF │ ├── GoogleSans-Bold.otf │ ├── MADETOMMY.otf │ ├── malgun.ttf │ └── malgunbd.ttf ├── index.html └── index.js ├── mania_nowplaying ├── css │ ├── odometr.css │ └── style.css ├── deps │ ├── countUp.js │ ├── main.css │ ├── odometr.js │ ├── reconnecting-websocket.min.js │ └── smooth.js ├── fonts │ ├── GOTHICB.TTF │ ├── GoogleSans-Bold.otf │ └── MADETOMMY.otf ├── index.html └── index.js ├── mania_simple_hitcount ├── css │ ├── odometr.css │ └── style.css ├── deps │ ├── countUp.js │ ├── odometr.js │ ├── reconnecting-websocket.min.js │ └── smooth.js ├── fonts │ ├── GOTHICB.TTF │ ├── GoogleSans-Bold.otf │ └── MADETOMMY.otf ├── index.html └── index.js ├── mania_simple_hiterror ├── css │ └── style.css ├── deps │ ├── reconnecting-websocket.min.js │ └── smooth.js ├── index.html └── index.js ├── mania_simple_hiterror_colorful ├── css │ └── style.css ├── deps │ ├── reconnecting-websocket.min.js │ └── smooth.js ├── index.html └── index.js ├── mania_simple_leaderboard ├── css │ └── style.css ├── deps │ ├── countUp.js │ ├── main.css │ └── reconnecting-websocket.min.js ├── fonts │ ├── GOTHICB.TTF │ └── MADETOMMY.otf ├── index.html ├── index.js ├── parts │ ├── background4.png │ ├── background5.png │ └── background6.png └── setting │ ├── setting.exe │ └── setting.json ├── mania_simple_leaderboard_qhd ├── css │ └── style.css ├── deps │ ├── countUp.js │ ├── main.css │ └── reconnecting-websocket.min.js ├── fonts │ ├── GOTHICB.TTF │ └── MADETOMMY.otf ├── index.html ├── index.js ├── parts │ ├── background4.png │ ├── background5.png │ └── background6.png └── setting │ ├── setting.exe │ └── setting.json ├── mania_simple_overlay ├── css │ ├── odometr.css │ ├── style.css │ └── style_simple.css ├── deps │ ├── countUp.js │ ├── odometr.js │ └── reconnecting-websocket.min.js ├── fonts │ ├── GOTHICB.TTF │ └── MADETOMMY.otf ├── index.html ├── index.js └── setting │ ├── setting.exe │ └── setting.json ├── mania_simple_overlay_qhd ├── css │ ├── odometr.css │ ├── style.css │ └── style_simple.css ├── deps │ ├── countUp.js │ ├── odometr.js │ └── reconnecting-websocket.min.js ├── fonts │ ├── GOTHICB.TTF │ └── MADETOMMY.otf ├── index.html ├── index.js └── setting │ ├── setting.exe │ └── setting.json ├── now_playing_disk_version ├── config.js ├── css │ ├── all.min.css │ └── style.css ├── deps │ ├── countUp.js │ ├── jquery.animate-shadow-min.js │ ├── jquery.counterup.min.js │ ├── jquery.waypoints.min.js │ ├── reconnecting-websocket.min.js │ └── socket.js ├── fonts │ ├── GOTHICB.TTF │ └── MADETOMMY.otf ├── index.html ├── index.js ├── metadata.txt └── parts │ ├── disk.png │ ├── loadingbg.jpg │ ├── next.png │ ├── pause.png │ ├── play.png │ └── previous.png └── nps_chart ├── css └── style.css ├── deps ├── countUp.js ├── echarts.min.js └── reconnecting-websocket.min.js ├── fonts ├── GoogleSans-Bold.otf └── MADETOMMY.otf ├── index.html └── index.js /README.md: -------------------------------------------------------------------------------- 1 | # CustomOverlay in gousumemory, tosu 2 | **This is made to be used in mania, and it may not work on other modes.** 3 | 4 | ※ gosumemory is no longer updated. (official discord announce) so, change program to **tosu**(made by KotRikD). This is very similar to gosumemory. 5 | 6 | How to use tosu : https://github.com/KotRikD/tosu 7 | 8 | Made by **2ky ([@s2skky](https://twitter.com/s2skky))**. 9 | 10 | Special thanks to **riunosk** for polishing up 'README.md'. 11 | 12 | 13 | ## How to setting? 14 | https://youtu.be/XAGthkn75c0 (gosumemory) 15 | 16 | ## Current released theme 17 | 18 | ### simple-overlay 19 |
Details 20 | 21 | #### normal mode : 22 | 23 | > - Customizable Colors and Contents. 24 | > - OBS Size : FHD->520x240, QHD -> 700x330 25 | > 26 | > ![ezgif com-gif-maker](https://user-images.githubusercontent.com/62880311/136022486-44d7bde7-0683-42fe-a5db-ef5804919994.gif) 27 | > 28 | > 29 | #### simple mode : 30 | 31 | > - Non-customizable 32 | > - OBS Size : FHD->280x280, QHD -> 375x375 33 | > 34 | >![ezgif com-gif-maker (1)](https://user-images.githubusercontent.com/62880311/136022501-cccd83a6-82f3-4bb8-91e1-459e28327c70.gif) 35 | > 36 |
37 | 38 | ### simple-leaderboard 39 |
Details 40 | 41 | #### Screenshot: 42 | 43 | > - OBS size : FHD->280x1080, QHD->360x1440 44 | > 45 | > ![ezgif com-gif-maker (2)](https://user-images.githubusercontent.com/62880311/136027869-3c7f2a62-c73f-446e-963f-0e7034ae5ae8.gif) 46 | 47 | #### Features : 48 | > - It predicts your score in real-time and shows your real-time ranking. 49 | > - When the beatmap does not have global leaderboards, local scores will be shown automatically. 50 | > - To use this overlay you should be osu! APIv1 key and osu! UID. 51 | > - API Links : https://old.ppy.sh/p/api or http://osu.ppy.sh/p/api 52 | 53 | #### Unsupported : 54 | > - ScoreV2 mod and unsubmitted/deleted maps. 55 | > - Some maps may not work for unknown reasons. 56 | 57 | #### Special Thanks : 58 | > - **B-Force (inteliser)** : for helping me to make "simple_leaderboard" 59 |
60 | 61 | ### simple-hitcount 62 |
Details 63 | 64 | #### Screenshot : 65 | > - OBS Size : 220x290 66 | > 67 | > ![Animation](https://user-images.githubusercontent.com/62880311/171421519-adb2f980-c034-44a4-9918-c2236aaf980e.gif) 68 | > 69 |
70 | 71 | ### now-playing 72 |
Details 73 | 74 | #### Screenshot : 75 | > - OBS Size : 540x200 76 | > 77 | > ![capture](https://user-images.githubusercontent.com/62880311/171421414-e76b96d4-1012-4996-b53b-06c4a8f0d1d5.png) 78 | > 79 |
80 | 81 | ### simple-hiterror (normal & colorful) 82 |
Details 83 | 84 | #### Screenshot : 85 | > 86 | > ![Animation2](https://user-images.githubusercontent.com/62880311/171418407-3376073b-492a-4a69-99df-40cb530ea156.gif) 87 | > 88 | > ![GIF 2022-10-15 오후 7-06-36](https://user-images.githubusercontent.com/62880311/195980722-96270dfd-6c3c-42f0-bc8f-13899acf1463.gif) 89 | > 90 | > - It's not perfect color matching because of LN press&release issue. 91 | #### Reference 92 | > - Calculating Tick : [TryZCustomOverlay](https://github.com/FukutoTojido/TryZCustomOverlay) (made by FukutoTojido) 93 |
94 | 95 | ### NPS-Chart 96 |
Details 97 | 98 | #### Screenshot : 99 | > - OBS Size : 400x360 100 | > 101 | > ![Animation](https://user-images.githubusercontent.com/62880311/171416076-b92766ee-d9d8-4262-9fd7-d8168054a8bd.gif) 102 | > 103 | #### Caution : 104 | > - ScoreV2 mode is recognized as a note when pressing and releasing LN. 105 |
106 | 107 | ### Normal Hitcount 108 |
Details 109 | 110 | #### Screenshot : 111 | > - OBS Size : 230x400 112 | > 113 | > ![image](https://user-images.githubusercontent.com/62880311/182515903-793ff7e5-a838-4548-8a27-b976c753dbb9.png) 114 | > 115 |
116 | 117 | ### mania ingame (hiterror + hitcount) 118 |
Details 119 | 120 | #### Screenshot : 121 | > - init ingame size : 380x500 (you must adjust size) 122 | > 123 | > ![image](https://user-images.githubusercontent.com/62880311/182748095-1fd6eb81-6ce2-48de-a771-15dd6499cf54.png) 124 | > 125 |
126 | 127 | ### now playing disk version 128 |
Details 129 | 130 | #### Screenshot : 131 | > - OBS size : 430x550 132 | > - must using KotRikD / tosu program (no adapt gosumemory) 133 | > - ${\textsf{\color{magenta}There are 2 custom options. Check config.js file.}}$ 134 | > 135 | > ![GIF 2024-08-13 오전 12-25-59](https://github.com/user-attachments/assets/6098a99e-94c5-4b78-bc10-2054f83d174a) 136 | > 137 |
138 | 139 | ### mania hitcount bar type 140 |
Details 141 | 142 | #### Screenshot : 143 | > - OBS size : 910x150 144 | > - must using KotRikD / tosu program (no adapt gosumemory) 145 | > - ${\textsf{\color{magenta}There are 2 custom options. Check config.js file.}}$ 146 | > 147 | > ![GIF 2024-08-13 오전 12-28-02](https://github.com/user-attachments/assets/55b8ccbf-2583-466f-b4d3-b310b59f137e) 148 | > 149 |
150 | 151 | ## ChangeLog: 152 | 153 | > #### **2024-08-14* 154 | > - Fixed output bugs for concurrent notes in all hiterror overlay. 155 | > - Modify vanishing effect smoother in hiterror tick. 156 | 157 | > #### **2024-08-13* 158 | > - Released 2 new overlays (mania hitcount bar type, now playing disk version) 159 | 160 | > #### **2021-10-05* 161 | > - Released simple-overlay and simple-leaderboard. 162 | > - Hotfix for simple-overlay. 163 | 164 | > #### **2021-10-17* 165 | > - Changed folder name. 166 | 167 | > #### **2021-10-18* 168 | > - Added option to remove background behind leaderboard in simple-leaderboard. 169 | 170 | > #### **2022-06-01* 171 | > - Inital commit. 172 | > - Add 3 existing themes overlay. 173 | > - Add 1 new theme overlay(NPS Chart). 174 | 175 | > #### **2022-08-03* 176 | > - Add new theme overlay(Normal Hitcount). 177 | 178 | > #### **2022-08-04* 179 | > - Add ingame overlay. 180 | 181 | > #### **2022-10-15* 182 | > - Add simple_hiterror colorful. 183 | -------------------------------------------------------------------------------- /hitcount_bar_type/config.js: -------------------------------------------------------------------------------- 1 | // option 1 : left content 2 | // pp : performance 3 | // ur : unstable rate 4 | 5 | const leftContent = 'pp'; 6 | 7 | 8 | // option 2 : text color 9 | // random : random color 10 | // red 11 | // orange 12 | // yellow 13 | // green 14 | // blue 15 | // purple 16 | // pink 17 | 18 | const textColor = 'random'; -------------------------------------------------------------------------------- /hitcount_bar_type/css/odometr.css: -------------------------------------------------------------------------------- 1 | .odometer.odometer-auto-theme, 2 | .odometer.odometer-theme-default { 3 | display: inline-block; 4 | vertical-align: middle; 5 | *vertical-align: auto; 6 | *zoom: 1; 7 | *display: inline; 8 | position: relative; 9 | } 10 | 11 | .odometer.odometer-auto-theme .odometer-digit, 12 | .odometer.odometer-theme-default .odometer-digit { 13 | display: inline-block; 14 | vertical-align: middle; 15 | *vertical-align: auto; 16 | *zoom: 1; 17 | *display: inline; 18 | position: relative; 19 | } 20 | 21 | .odometer.odometer-auto-theme .odometer-digit .odometer-digit-spacer, 22 | .odometer.odometer-theme-default .odometer-digit .odometer-digit-spacer { 23 | display: inline-block; 24 | vertical-align: middle; 25 | *vertical-align: auto; 26 | *zoom: 1; 27 | *display: inline; 28 | visibility: hidden; 29 | } 30 | 31 | .odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner, 32 | .odometer.odometer-theme-default .odometer-digit .odometer-digit-inner { 33 | text-align: left; 34 | display: block; 35 | position: absolute; 36 | top: 0; 37 | left: 0; 38 | right: 0; 39 | bottom: 0; 40 | overflow: hidden; 41 | } 42 | 43 | .odometer.odometer-auto-theme .odometer-digit .odometer-ribbon, 44 | .odometer.odometer-theme-default .odometer-digit .odometer-ribbon { 45 | display: block; 46 | } 47 | 48 | .odometer.odometer-auto-theme .odometer-digit .odometer-ribbon-inner, 49 | .odometer.odometer-theme-default .odometer-digit .odometer-ribbon-inner { 50 | display: block; 51 | -webkit-backface-visibility: hidden; 52 | } 53 | 54 | .odometer.odometer-auto-theme .odometer-digit .odometer-value, 55 | .odometer.odometer-theme-default .odometer-digit .odometer-value { 56 | display: block; 57 | -webkit-transform: translateZ(0); 58 | } 59 | 60 | .odometer.odometer-auto-theme .odometer-digit .odometer-value.odometer-last-value, 61 | .odometer.odometer-theme-default .odometer-digit .odometer-value.odometer-last-value { 62 | position: absolute; 63 | } 64 | 65 | .odometer.odometer-auto-theme.odometer-animating-up .odometer-ribbon-inner, 66 | .odometer.odometer-theme-default.odometer-animating-up .odometer-ribbon-inner { 67 | -webkit-transition: -webkit-transform 300ms; 68 | -moz-transition: -moz-transform 300ms; 69 | -ms-transition: -ms-transform 300ms; 70 | -o-transition: -o-transform 300ms; 71 | transition: transform 300ms; 72 | } 73 | 74 | .odometer.odometer-auto-theme.odometer-animating-up.odometer-animating .odometer-ribbon-inner, 75 | .odometer.odometer-theme-default.odometer-animating-up.odometer-animating .odometer-ribbon-inner { 76 | -webkit-transform: translateY(-100%); 77 | -moz-transform: translateY(-100%); 78 | -ms-transform: translateY(-100%); 79 | -o-transform: translateY(-100%); 80 | transform: translateY(-100%); 81 | } 82 | 83 | .odometer.odometer-auto-theme.odometer-animating-down .odometer-ribbon-inner, 84 | .odometer.odometer-theme-default.odometer-animating-down .odometer-ribbon-inner { 85 | -webkit-transform: translateY(-100%); 86 | -moz-transform: translateY(-100%); 87 | -ms-transform: translateY(-100%); 88 | -o-transform: translateY(-100%); 89 | transform: translateY(-100%); 90 | } 91 | 92 | .odometer.odometer-auto-theme.odometer-animating-down.odometer-animating .odometer-ribbon-inner, 93 | .odometer.odometer-theme-default.odometer-animating-down.odometer-animating .odometer-ribbon-inner { 94 | -webkit-transition: -webkit-transform 300ms; 95 | -moz-transition: -moz-transform 300ms; 96 | -ms-transition: -ms-transform 300ms; 97 | -o-transition: -o-transform 300ms; 98 | transition: transform 300ms; 99 | -webkit-transform: translateY(0); 100 | -moz-transform: translateY(0); 101 | -ms-transform: translateY(0); 102 | -o-transform: translateY(0); 103 | transform: translateY(0); 104 | } 105 | 106 | .odometer.odometer-auto-theme, 107 | .odometer.odometer-theme-default { 108 | font-family: "Helvetica Neue", sans-serif; 109 | line-height: 1.1em; 110 | } 111 | 112 | .odometer.odometer-auto-theme .odometer-value, 113 | .odometer.odometer-theme-default .odometer-value { 114 | text-align: center; 115 | } 116 | 117 | .odometer.pp .odometer-inside:after { 118 | content: "pp" 119 | } 120 | 121 | .odometer.combo .odometer-inside:after { 122 | content: "x" 123 | } 124 | 125 | .odometer.URIndex .odometer-inside:after { 126 | content: "UR" 127 | } -------------------------------------------------------------------------------- /hitcount_bar_type/css/style.css: -------------------------------------------------------------------------------- 1 | /* made by sky(@s2skky) */ 2 | 3 | @font-face { 4 | font-family: "TOMMY"; 5 | src: url("../fonts/MADETOMMY.otf"); 6 | } 7 | .odometer.odometer-auto-theme { 8 | font-family: "GothicB", Helvetica, sans-serif !important; 9 | font-weight: 900px !important; 10 | } 11 | 12 | body, 13 | html { 14 | padding: 0; 15 | margin: 0; 16 | overflow-x: hidden; 17 | overflow-y: hidden; 18 | } 19 | .trans{ 20 | transition: color 1s ease; 21 | } 22 | 23 | #main{ 24 | width: 910px; 25 | height: 150px; 26 | } -------------------------------------------------------------------------------- /hitcount_bar_type/css/style_count.css: -------------------------------------------------------------------------------- 1 | /* made by sky(@s2skky) */ 2 | 3 | @font-face { 4 | font-family: "TOMMY"; 5 | src: url("../fonts/MADETOMMY.otf"); 6 | } 7 | .odometer.odometer-auto-theme { 8 | font-family: "GothicB", Helvetica, sans-serif !important; 9 | font-weight: 900px !important; 10 | } 11 | 12 | 13 | #cntArea{ 14 | position: absolute; 15 | width: 910px; 16 | height: 150px; 17 | 18 | overflow: hidden; 19 | } 20 | #cntAreaBg{ 21 | width: 100%; 22 | height: 100%; 23 | 24 | padding-top: 20px; 25 | box-sizing: border-box; 26 | 27 | display: flex; 28 | 29 | } 30 | #ppArea{ 31 | width: 35%; 32 | height: 100%; 33 | display: flex; 34 | justify-content: right; 35 | } 36 | 37 | #hitArea{ 38 | width: 65%; 39 | height: 100%; 40 | display: flex; 41 | justify-content: space-evenly; 42 | } 43 | 44 | .cntGrp{ 45 | width: 100%; 46 | } 47 | .cntDash{ 48 | height: 8px; 49 | border-radius: 15px; 50 | margin-left: 6px; 51 | margin-right: 6px; 52 | background-color: rgba(255,255,255,0.7); 53 | } 54 | .cntText{ 55 | margin-top : 10px; 56 | margin-left: 10px; 57 | font-family: TOMMY; 58 | font-size: 15pt; 59 | color: rgba(255, 162, 250, 0.8); 60 | } 61 | 62 | 63 | #gekiDash{ 64 | width: 100%; 65 | height: 100%; 66 | box-shadow: 0 0 2rem azure,0 0 0.5rem azure,0 0 0.7rem azure, inset 0 0 0.8rem azure; 67 | } 68 | #hit300Dash{ 69 | width: 100%; 70 | height: 100%; 71 | box-shadow: 0 0 2rem orange,0 0 0.5rem orange,0 0 0.7rem orange, inset 0 0 0.8rem orange; 72 | } 73 | #katuDash{ 74 | width: 100%; 75 | height: 100%; 76 | box-shadow: 0 0 2rem forestgreen,0 0 0.5rem forestgreen,0 0 0.7rem forestgreen, inset 0 0 0.8rem forestgreen; 77 | } 78 | #hit100Dash{ 79 | width: 100%; 80 | height: 100%; 81 | box-shadow: 0 0 2rem dodgerblue,0 0 0.5rem dodgerblue,0 0 0.7rem dodgerblue, inset 0 0 0.8rem dodgerblue; 82 | } 83 | #hit50Dash{ 84 | width: 100%; 85 | height: 100%; 86 | box-shadow: 0 0 2rem hotpink,0 0 0.5rem hotpink,0 0 0.7rem hotpink, inset 0 0 0.8rem hotpink; 87 | } 88 | #hit0Dash{ 89 | width: 100%; 90 | height: 100%; 91 | box-shadow: 0 0 2rem crimson,0 0 0.5rem crimson,0 0 0.7rem crimson, inset 0 0 0.8rem crimson; 92 | } 93 | 94 | 95 | 96 | #geki, #hit300, #katu, #hit100, #hit50, #hit0, #pp{ 97 | margin-top : 9px; 98 | margin-left: 10px; 99 | font-family: TOMMY; 100 | font-weight: bold; 101 | font-size: 23pt; 102 | color: white; 103 | } 104 | 105 | #ppLeftGrp{ 106 | width: 54%; 107 | } 108 | #ppRightGrp{ 109 | width: 46%; 110 | } 111 | 112 | #ppDashGrp{ 113 | display: flex; 114 | align-items: center; 115 | } 116 | #ppDash{ 117 | width: 100%; 118 | margin-left: 0; 119 | } 120 | #ppText{ 121 | margin-left: 5px; 122 | white-space: nowrap; 123 | } 124 | #pp{ 125 | float: right; 126 | margin-top: 8px; 127 | margin-right: 18px; 128 | font-size: 21pt; 129 | white-space: nowrap; 130 | } 131 | 132 | 133 | 134 | -------------------------------------------------------------------------------- /hitcount_bar_type/deps/jquery.animate-shadow-min.js: -------------------------------------------------------------------------------- 1 | /* 2 | Shadow animation 1.11 3 | http://www.bitstorm.org/jquery/shadow-animation/ 4 | Copyright 2011, 2013 Edwin Martin 5 | Contributors: Mark Carver, Xavier Lepretre and Jason Redding 6 | Released under the MIT and GPL licenses. 7 | */ 8 | 'use strict';jQuery(function(h){function r(b,m,d){var l=[];h.each(b,function(f){var g=[],e=b[f];f=m[f];e.b&&g.push("inset");"undefined"!==typeof f.left&&g.push(parseFloat(e.left+d*(f.left-e.left))+"px "+parseFloat(e.top+d*(f.top-e.top))+"px");"undefined"!==typeof f.blur&&g.push(parseFloat(e.blur+d*(f.blur-e.blur))+"px");"undefined"!==typeof f.a&&g.push(parseFloat(e.a+d*(f.a-e.a))+"px");if("undefined"!==typeof f.color){var p="rgb"+(h.support.rgba?"a":"")+"("+parseInt(e.color[0]+d*(f.color[0]-e.color[0]), 9 | 10)+","+parseInt(e.color[1]+d*(f.color[1]-e.color[1]),10)+","+parseInt(e.color[2]+d*(f.color[2]-e.color[2]),10);h.support.rgba&&(p+=","+parseFloat(e.color[3]+d*(f.color[3]-e.color[3])));g.push(p+")")}l.push(g.join(" "))});return l.join(", ")}function q(b){function m(){var a=/^inset\b/.exec(b.substring(c));return null!==a&&0b;b++)b=1;f--){var l=parseInt(i/n*f);u&&(l=parseFloat(i/n*f).toFixed(a));if(s)while(/(\d+)(\d{3})/.test(l.toString()))l=l.toString().replace(/(\d+)(\d{3})/,"$1,$2");e.unshift(l)}t.data("counterup-nums",e);t.text("0");var c=function(){t.text(t.data("counterup-nums").shift());if(t.data("counterup-nums").length)setTimeout(t.data("counterup-func"),r.delay);else{delete t.data("counterup-nums");t.data("counterup-nums",null);t.data("counterup-func",null)}};t.data("counterup-func",c);setTimeout(t.data("counterup-func"),r.delay)};t.waypoint(i,{offset:"100%",triggerOnce:!0})})}})(jQuery); -------------------------------------------------------------------------------- /hitcount_bar_type/deps/reconnecting-websocket.min.js: -------------------------------------------------------------------------------- 1 | !function(a,b){"function"==typeof define&&define.amd?define([],b):"undefined"!=typeof module&&module.exports?module.exports=b():a.ReconnectingWebSocket=b()}(this,function(){function a(b,c,d){function l(a,b){var c=document.createEvent("CustomEvent");return c.initCustomEvent(a,!1,!1,b),c}var e={debug:!1,automaticOpen:!0,reconnectInterval:1e3,maxReconnectInterval:3e4,reconnectDecay:1.5,timeoutInterval:2e3};d||(d={});for(var f in e)this[f]="undefined"!=typeof d[f]?d[f]:e[f];this.url=b,this.reconnectAttempts=0,this.readyState=WebSocket.CONNECTING,this.protocol=null;var h,g=this,i=!1,j=!1,k=document.createElement("div");k.addEventListener("open",function(a){g.onopen(a)}),k.addEventListener("close",function(a){g.onclose(a)}),k.addEventListener("connecting",function(a){g.onconnecting(a)}),k.addEventListener("message",function(a){g.onmessage(a)}),k.addEventListener("error",function(a){g.onerror(a)}),this.addEventListener=k.addEventListener.bind(k),this.removeEventListener=k.removeEventListener.bind(k),this.dispatchEvent=k.dispatchEvent.bind(k),this.open=function(b){h=new WebSocket(g.url,c||[]),b||k.dispatchEvent(l("connecting")),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","attempt-connect",g.url);var d=h,e=setTimeout(function(){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","connection-timeout",g.url),j=!0,d.close(),j=!1},g.timeoutInterval);h.onopen=function(){clearTimeout(e),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onopen",g.url),g.protocol=h.protocol,g.readyState=WebSocket.OPEN,g.reconnectAttempts=0;var d=l("open");d.isReconnect=b,b=!1,k.dispatchEvent(d)},h.onclose=function(c){if(clearTimeout(e),h=null,i)g.readyState=WebSocket.CLOSED,k.dispatchEvent(l("close"));else{g.readyState=WebSocket.CONNECTING;var d=l("connecting");d.code=c.code,d.reason=c.reason,d.wasClean=c.wasClean,k.dispatchEvent(d),b||j||((g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onclose",g.url),k.dispatchEvent(l("close")));var e=g.reconnectInterval*Math.pow(g.reconnectDecay,g.reconnectAttempts);setTimeout(function(){g.reconnectAttempts++,g.open(!0)},e>g.maxReconnectInterval?g.maxReconnectInterval:e)}},h.onmessage=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onmessage",g.url,b.data);var c=l("message");c.data=b.data,k.dispatchEvent(c)},h.onerror=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onerror",g.url,b),k.dispatchEvent(l("error"))}},1==this.automaticOpen&&this.open(!1),this.send=function(b){if(h)return(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","send",g.url,b),h.send(b);throw"INVALID_STATE_ERR : Pausing to reconnect websocket"},this.close=function(a,b){"undefined"==typeof a&&(a=1e3),i=!0,h&&h.close(a,b)},this.refresh=function(){h&&h.close()}}return a.prototype.onopen=function(){},a.prototype.onclose=function(){},a.prototype.onconnecting=function(){},a.prototype.onmessage=function(){},a.prototype.onerror=function(){},a.debugAll=!1,a.CONNECTING=WebSocket.CONNECTING,a.OPEN=WebSocket.OPEN,a.CLOSING=WebSocket.CLOSING,a.CLOSED=WebSocket.CLOSED,a}); 2 | -------------------------------------------------------------------------------- /hitcount_bar_type/fonts/MADETOMMY.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/hitcount_bar_type/fonts/MADETOMMY.otf -------------------------------------------------------------------------------- /hitcount_bar_type/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | yep 1 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 |
19 |
20 |
21 |
22 |
23 |
Performance
518 / 528
24 |
25 |
26 |
27 |
28 |
320
29 |
30 |
31 |
300
32 |
33 |
34 |
200
35 |
36 |
37 |
100
38 |
39 |
40 |
50
41 |
42 |
43 |
miss
44 |
45 |
46 |
47 |
48 |
49 | 50 | 51 | 52 | 53 | 54 | 55 | -------------------------------------------------------------------------------- /hitcount_bar_type/index.js: -------------------------------------------------------------------------------- 1 | // connecting to websocket 2 | import WebSocketManager from './deps/socket.js'; 3 | 4 | const socket = new WebSocketManager('127.0.0.1:24050'); 5 | 6 | 7 | 8 | // cache values here to prevent constant updating 9 | const cache = {}; 10 | 11 | if(leftContent == 'pp') document.getElementById("ppText").innerHTML = 'Performance'; 12 | else if(leftContent == 'ur') document.getElementById("ppText").innerHTML = 'Unstable Rate' 13 | 14 | 15 | 16 | socket.api_v2(({ state, settings, session, profile, performance, resultsScreen, play, beatmap, directPath, folders, leaderboard }) => { 17 | 18 | if (cache['data.menu.state'] != state.number) { 19 | cache['data.menu.state'] = state.number; 20 | 21 | // 플레이 중 22 | if(state.number == '2'){ 23 | 24 | // hitcount 로딩 25 | const cntAreaBg = document.getElementById("cntAreaBg"); 26 | cntAreaBg.style.transition = 'all 0.5s ease-in' 27 | cntAreaBg.style.opacity = 1; 28 | 29 | // 카운트 색상 랜덤 변경 30 | const cntText = document.querySelectorAll('.cntText'); 31 | var n = Math.floor(Math.random() * (7-1) + 1); 32 | var color = ''; 33 | 34 | if(textColor == 'red') n = 1; 35 | else if(textColor == 'orange') n = 2; 36 | else if(textColor == 'yellow') n = 3; 37 | else if(textColor == 'green') n = 4; 38 | else if(textColor == 'blue') n = 5; 39 | else if(textColor == 'purple') n = 6; 40 | else if(textColor == 'pink') n = 7; 41 | 42 | if(n == 1) 43 | color = 'rgba(255, 162, 162, 0.8)'; // red 44 | else if(n == 2) 45 | color = 'rgba(255, 204, 162, 0.8)'; // orange 46 | else if(n == 3) 47 | color = 'rgba(253, 255, 162, 0.8)'; // yellow 48 | else if(n == 4) 49 | color = 'rgba(170, 255, 162, 0.8)'; // green 50 | else if(n == 5) 51 | color = 'rgba(162, 213, 255, 0.8)'; // blue 52 | else if(n == 6) 53 | color = 'rgba(198, 162, 255, 0.8)'; // purple 54 | else if(n == 7) 55 | color = 'rgba(255, 162, 250, 0.8)'; // pink 56 | 57 | for(var i = 0; i < cntText.length; i++) 58 | cntText[i].style.color = color; 59 | } 60 | // 플레이중 아님 61 | else{ 62 | 63 | //히든처리 64 | const cntAreaBg = document.getElementById("cntAreaBg"); 65 | cntAreaBg.style.transition = 'all 0.5s ease-out' 66 | cntAreaBg.style.opacity = 0; 67 | 68 | } 69 | } 70 | 71 | 72 | 73 | 74 | 75 | 76 | //geki 77 | if(cache['hits.geki'] != play.hits.geki){ 78 | cache['hits.geki'] = play.hits.geki; 79 | 80 | const geki = document.getElementById("geki"); 81 | 82 | geki.innerHTML = play.hits.geki; 83 | 84 | $("#gekiDash").css("opacity", "1"); 85 | $("#gekiDash").stop().animate({opacity : 0}, 1000); 86 | } 87 | 88 | //katu 89 | if(cache['hits.katu'] != play.hits.katu){ 90 | cache['hits.katu'] = play.hits.katu; 91 | 92 | const katu = document.getElementById("katu"); 93 | 94 | katu.innerHTML = play.hits.katu; 95 | 96 | $("#katuDash").css("opacity", "1"); 97 | $("#katuDash").stop().animate({opacity : 0}, 1000); 98 | } 99 | 100 | //hit300 101 | if(cache['hits.hit300'] != play.hits[300]){ 102 | cache['hits.hit300'] = play.hits[300]; 103 | 104 | const hit300 = document.getElementById("hit300"); 105 | 106 | hit300.innerHTML = play.hits[300]; 107 | 108 | $("#hit300Dash").css("opacity", "1"); 109 | $("#hit300Dash").stop().animate({opacity : 0}, 1000); 110 | } 111 | 112 | //hit100 113 | if(cache['hits.hit100'] != play.hits[100]){ 114 | cache['hits.hit100'] = play.hits[100]; 115 | 116 | const hit100 = document.getElementById("hit100"); 117 | 118 | hit100.innerHTML = play.hits[100]; 119 | 120 | $("#hit100Dash").css("opacity", "1"); 121 | $("#hit100Dash").stop().animate({opacity : 0}, 1000); 122 | } 123 | 124 | //hit50 125 | if(cache['hits.hit50'] != play.hits[50]){ 126 | cache['hits.hit50'] = play.hits[50]; 127 | 128 | const hit50 = document.getElementById("hit50"); 129 | 130 | hit50.innerHTML = play.hits[50]; 131 | 132 | $("#hit50Dash").css("opacity", "1"); 133 | $("#hit50Dash").stop().animate({opacity : 0}, 1000); 134 | } 135 | 136 | //hit0 137 | if(cache['hits.hit0'] != play.hits[0]){ 138 | cache['hits.hit0'] = play.hits[0]; 139 | 140 | const hit0 = document.getElementById("hit0"); 141 | 142 | hit0.innerHTML = play.hits[0]; 143 | 144 | $("#hit0Dash").css("opacity", "1"); 145 | $("#hit0Dash").stop().animate({opacity : 0}, 1000); 146 | } 147 | 148 | //pp 149 | if(cache['pp.current'] != play.pp.current && leftContent == 'pp'){ 150 | cache['pp.current'] = play.pp.current; 151 | 152 | const pp = document.getElementById("pp"); 153 | 154 | pp.innerHTML = play.pp.current.toFixed(1) + " / " + performance.accuracy[100].toFixed(1); 155 | } 156 | 157 | if(cache['ur'] != play.unstableRate && leftContent == 'ur'){ 158 | cache['ur'] = play.unstableRate; 159 | 160 | const ur = document.getElementById("pp"); 161 | 162 | pp.innerHTML = play.unstableRate.toFixed(3); 163 | } 164 | }); 165 | -------------------------------------------------------------------------------- /hitcount_bar_type/metadata.txt: -------------------------------------------------------------------------------- 1 | Usecase: obs-overlay 2 | Name: hitcount_bar_type 3 | Author: sky 4 | CompatibleWith: tosu 5 | Resolution: 2560x1440 6 | authorLinks: https://github.com/2222zz/gosumemory-theme -------------------------------------------------------------------------------- /mania_ingame/css/style_hitcount.css: -------------------------------------------------------------------------------- 1 | /* made by 2ky(@s2skky) */ 2 | 3 | @font-face { 4 | font-family: "malgun"; 5 | src: url("../fonts/malgun.ttf"); 6 | } 7 | 8 | #hitcount_box{ 9 | position: absolute; 10 | top:10px; 11 | left:10px; 12 | width:220px; 13 | height:390px; 14 | line-height: 33px; 15 | 16 | transition: ease-in-out 500ms; 17 | 18 | } 19 | #countBox{ 20 | position: absolute; 21 | left: 20px; 22 | top: 10px; 23 | } 24 | #h300g, 25 | #h300, 26 | #h200, 27 | #h100, 28 | #h50, 29 | #miss, 30 | #ur, 31 | #pp, 32 | #ratio, 33 | #blank{ 34 | font-family: malgun; 35 | font-size: 20pt; 36 | 37 | white-space: nowrap; 38 | overflow: hidden; 39 | text-overflow: ellipsis; 40 | 41 | color: white; 42 | } -------------------------------------------------------------------------------- /mania_ingame/css/style_hiterror.css: -------------------------------------------------------------------------------- 1 | /* made by 2ky(@s2skky) */ 2 | 3 | body, 4 | html { 5 | padding: 0; 6 | margin: 0; 7 | overflow: hidden; 8 | } 9 | #main { 10 | position: absolute; 11 | width: 350px; 12 | height: 200px; 13 | top:30px; 14 | } 15 | #bar { 16 | position: absolute; 17 | left: 20px; 18 | width: 300px; 19 | height: 0px; 20 | 21 | background-color: white; 22 | transition: ease-in-out 200ms; 23 | } 24 | 25 | #arrow{ 26 | position: absolute; 27 | width: 0px; 28 | height: 0px; 29 | top: -27.5px; 30 | left: 140px; 31 | 32 | border-style:solid; 33 | border-width: 10px; 34 | border-color: white transparent transparent transparent; 35 | 36 | transition: ease-out 100ms; 37 | transform-origin: 50% 50%; 38 | } 39 | 40 | #center { 41 | position: absolute; 42 | top:-11px; 43 | left: 147.5px; 44 | width: 5px; 45 | height: 25px; 46 | background-color: red; 47 | transition: ease-out 500ms; 48 | } 49 | 50 | #tick0, 51 | #tick1, 52 | #tick2, 53 | #tick3, 54 | #tick4, 55 | #tick5, 56 | #tick6, 57 | #tick7, 58 | #tick8, 59 | #tick9, 60 | #tick10, 61 | #tick11, 62 | #tick12, 63 | #tick13, 64 | #tick14, 65 | #tick15, 66 | #tick16, 67 | #tick17, 68 | #tick18, 69 | #tick19, 70 | #tick20, 71 | #tick21, 72 | #tick22, 73 | #tick23, 74 | #tick24, 75 | #tick25, 76 | #tick26, 77 | #tick27, 78 | #tick28, 79 | #tick29, 80 | #tick30, 81 | #tick31, 82 | #tick32, 83 | #tick33, 84 | #tick34, 85 | #tick35, 86 | #tick36, 87 | #tick37, 88 | #tick38, 89 | #tick39, 90 | #tick40, 91 | #tick41, 92 | #tick42, 93 | #tick43, 94 | #tick44, 95 | #tick45, 96 | #tick46, 97 | #tick47, 98 | #tick48, 99 | #tick49, 100 | #tick50, 101 | #tick51, 102 | #tick52, 103 | #tick53, 104 | #tick54, 105 | #tick55, 106 | #tick56, 107 | #tick57, 108 | #tick58, 109 | #tick59, 110 | #tick60, 111 | #tick61, 112 | #tick62, 113 | #tick63, 114 | #tick64, 115 | #tick65, 116 | #tick66, 117 | #tick67, 118 | #tick68, 119 | #tick69, 120 | #tick70, 121 | #tick71, 122 | #tick72, 123 | #tick73, 124 | #tick74, 125 | #tick75, 126 | #tick76, 127 | #tick77, 128 | #tick78, 129 | #tick79, 130 | #tick80, 131 | #tick81, 132 | #tick82, 133 | #tick83, 134 | #tick84, 135 | #tick85, 136 | #tick86, 137 | #tick87, 138 | #tick88, 139 | #tick89, 140 | #tick90, 141 | #tick91, 142 | #tick92, 143 | #tick93, 144 | #tick94, 145 | #tick95, 146 | #tick96, 147 | #tick97, 148 | #tick98, 149 | #tick99{ 150 | position: absolute; 151 | top: -9px; 152 | height: 20px; 153 | width: 5px; 154 | background-color: white; 155 | left: 147.5px; 156 | } 157 | 158 | #early{ 159 | position: absolute; 160 | top: -13px; 161 | left: 40px; 162 | font-size: 18px; 163 | font-weight: bold; 164 | 165 | color: #B3D7FF; 166 | transition: ease-out 500ms; 167 | } 168 | #late{ 169 | position: absolute; 170 | top: -13px; 171 | right: 40px; 172 | font-size: 18px; 173 | font-weight: bold; 174 | 175 | color: #FFB3B3; 176 | transition: ease-out 500ms; 177 | } 178 | -------------------------------------------------------------------------------- /mania_ingame/deps/reconnecting-websocket.min.js: -------------------------------------------------------------------------------- 1 | !function(a,b){"function"==typeof define&&define.amd?define([],b):"undefined"!=typeof module&&module.exports?module.exports=b():a.ReconnectingWebSocket=b()}(this,function(){function a(b,c,d){function l(a,b){var c=document.createEvent("CustomEvent");return c.initCustomEvent(a,!1,!1,b),c}var e={debug:!1,automaticOpen:!0,reconnectInterval:1e3,maxReconnectInterval:3e4,reconnectDecay:1.5,timeoutInterval:2e3};d||(d={});for(var f in e)this[f]="undefined"!=typeof d[f]?d[f]:e[f];this.url=b,this.reconnectAttempts=0,this.readyState=WebSocket.CONNECTING,this.protocol=null;var h,g=this,i=!1,j=!1,k=document.createElement("div");k.addEventListener("open",function(a){g.onopen(a)}),k.addEventListener("close",function(a){g.onclose(a)}),k.addEventListener("connecting",function(a){g.onconnecting(a)}),k.addEventListener("message",function(a){g.onmessage(a)}),k.addEventListener("error",function(a){g.onerror(a)}),this.addEventListener=k.addEventListener.bind(k),this.removeEventListener=k.removeEventListener.bind(k),this.dispatchEvent=k.dispatchEvent.bind(k),this.open=function(b){h=new WebSocket(g.url,c||[]),b||k.dispatchEvent(l("connecting")),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","attempt-connect",g.url);var d=h,e=setTimeout(function(){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","connection-timeout",g.url),j=!0,d.close(),j=!1},g.timeoutInterval);h.onopen=function(){clearTimeout(e),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onopen",g.url),g.protocol=h.protocol,g.readyState=WebSocket.OPEN,g.reconnectAttempts=0;var d=l("open");d.isReconnect=b,b=!1,k.dispatchEvent(d)},h.onclose=function(c){if(clearTimeout(e),h=null,i)g.readyState=WebSocket.CLOSED,k.dispatchEvent(l("close"));else{g.readyState=WebSocket.CONNECTING;var d=l("connecting");d.code=c.code,d.reason=c.reason,d.wasClean=c.wasClean,k.dispatchEvent(d),b||j||((g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onclose",g.url),k.dispatchEvent(l("close")));var e=g.reconnectInterval*Math.pow(g.reconnectDecay,g.reconnectAttempts);setTimeout(function(){g.reconnectAttempts++,g.open(!0)},e>g.maxReconnectInterval?g.maxReconnectInterval:e)}},h.onmessage=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onmessage",g.url,b.data);var c=l("message");c.data=b.data,k.dispatchEvent(c)},h.onerror=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onerror",g.url,b),k.dispatchEvent(l("error"))}},1==this.automaticOpen&&this.open(!1),this.send=function(b){if(h)return(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","send",g.url,b),h.send(b);throw"INVALID_STATE_ERR : Pausing to reconnect websocket"},this.close=function(a,b){"undefined"==typeof a&&(a=1e3),i=!0,h&&h.close(a,b)},this.refresh=function(){h&&h.close()}}return a.prototype.onopen=function(){},a.prototype.onclose=function(){},a.prototype.onconnecting=function(){},a.prototype.onmessage=function(){},a.prototype.onerror=function(){},a.debugAll=!1,a.CONNECTING=WebSocket.CONNECTING,a.OPEN=WebSocket.OPEN,a.CLOSING=WebSocket.CLOSING,a.CLOSED=WebSocket.CLOSED,a}); 2 | -------------------------------------------------------------------------------- /mania_ingame/deps/smooth.js: -------------------------------------------------------------------------------- 1 | function smooth(arr, windowSize, getter = (value) => value, setter) { 2 | const get = getter 3 | const result = [] 4 | 5 | for (let i = 0; i < arr.length; i += 1) { 6 | const leftOffeset = i - windowSize 7 | const from = leftOffeset >= 0 ? leftOffeset : 0 8 | const to = i + windowSize + 1 9 | 10 | let count = 0 11 | let sum = 0 12 | for (let j = from; j < to && j < arr.length; j += 1) { 13 | sum += get(arr[j]) 14 | count += 1 15 | } 16 | 17 | result[i] = setter ? setter(arr[i], sum / count) : sum / count 18 | } 19 | 20 | return result 21 | } 22 | 23 | exports = smooth -------------------------------------------------------------------------------- /mania_ingame/fonts/GOTHICB.TTF: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_ingame/fonts/GOTHICB.TTF -------------------------------------------------------------------------------- /mania_ingame/fonts/GoogleSans-Bold.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_ingame/fonts/GoogleSans-Bold.otf -------------------------------------------------------------------------------- /mania_ingame/fonts/MADETOMMY.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_ingame/fonts/MADETOMMY.otf -------------------------------------------------------------------------------- /mania_ingame/fonts/malgun.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_ingame/fonts/malgun.ttf -------------------------------------------------------------------------------- /mania_ingame/fonts/malgunbd.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_ingame/fonts/malgunbd.ttf -------------------------------------------------------------------------------- /mania_ingame/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 |
50 |
51 |
52 |
53 |
54 |
55 |
56 |
57 |
58 |
59 |
60 |
61 |
62 |
63 |
64 |
65 |
66 |
67 |
68 |
69 |
70 |
71 |
72 |
73 |
74 |
75 |
76 |
77 |
78 |
79 |
80 |
81 |
82 |
83 |
84 |
85 |
86 |
87 |
88 |
89 |
90 |
91 |
92 |
93 |
94 |
95 |
96 |
97 |
98 |
99 |
100 |
101 |
102 |
103 |
104 |
105 |
106 |
107 |
108 |
109 |
110 |
111 |
112 |
113 |
114 |
115 |
116 |
117 |
118 |
119 |
120 |
Early
Late
121 |
122 | 123 |
124 |
125 |
126 |
127 |
128 |
129 |
130 |
131 |
132 |
133 |
134 |
135 |
136 |
137 |
138 | 139 | 140 | 141 | 142 | -------------------------------------------------------------------------------- /mania_ingame/setting.js: -------------------------------------------------------------------------------- 1 | // made by 2ky(@s2skky) 2 | 3 | let hiterror_switch = true; 4 | let hitcount_switch = true; 5 | 6 | let hiterror_horizontal_margin = '50px'; 7 | let hiterror_vertical_margin = '60px'; 8 | 9 | let hitcount_horizontal_margin = '0px'; 10 | let hitcount_vertical_margin = '80px'; -------------------------------------------------------------------------------- /mania_normal/css/style.css: -------------------------------------------------------------------------------- 1 | /* made by 2ky(@s2skky) */ 2 | 3 | @font-face { 4 | font-family: "malgun"; 5 | src: url("../fonts/malgun.ttf"); 6 | } 7 | 8 | body, 9 | html { 10 | padding: 0; 11 | margin: 0; 12 | overflow-x: hidden; 13 | overflow-y: hidden; 14 | } 15 | #hitcount_box{ 16 | position: absolute; 17 | top:10px; 18 | left:10px; 19 | width:220px; 20 | height:390px; 21 | line-height: 33px; 22 | 23 | transition: ease-in-out 500ms; 24 | } 25 | #textBox{ 26 | position: absolute; 27 | left: 20px; 28 | top: 10px; 29 | } 30 | #countBox{ 31 | position: absolute; 32 | left: 20px; 33 | top: 10px; 34 | } 35 | #h300g, 36 | #h300, 37 | #h200, 38 | #h100, 39 | #h50, 40 | #miss, 41 | #ur, 42 | #pp, 43 | #ratio, 44 | #blank{ 45 | font-family: malgun; 46 | font-size: 20pt; 47 | 48 | white-space: nowrap; 49 | overflow: hidden; 50 | text-overflow: ellipsis; 51 | 52 | color: white; 53 | } -------------------------------------------------------------------------------- /mania_normal/deps/reconnecting-websocket.min.js: -------------------------------------------------------------------------------- 1 | !function(a,b){"function"==typeof define&&define.amd?define([],b):"undefined"!=typeof module&&module.exports?module.exports=b():a.ReconnectingWebSocket=b()}(this,function(){function a(b,c,d){function l(a,b){var c=document.createEvent("CustomEvent");return c.initCustomEvent(a,!1,!1,b),c}var e={debug:!1,automaticOpen:!0,reconnectInterval:1e3,maxReconnectInterval:3e4,reconnectDecay:1.5,timeoutInterval:2e3};d||(d={});for(var f in e)this[f]="undefined"!=typeof d[f]?d[f]:e[f];this.url=b,this.reconnectAttempts=0,this.readyState=WebSocket.CONNECTING,this.protocol=null;var h,g=this,i=!1,j=!1,k=document.createElement("div");k.addEventListener("open",function(a){g.onopen(a)}),k.addEventListener("close",function(a){g.onclose(a)}),k.addEventListener("connecting",function(a){g.onconnecting(a)}),k.addEventListener("message",function(a){g.onmessage(a)}),k.addEventListener("error",function(a){g.onerror(a)}),this.addEventListener=k.addEventListener.bind(k),this.removeEventListener=k.removeEventListener.bind(k),this.dispatchEvent=k.dispatchEvent.bind(k),this.open=function(b){h=new WebSocket(g.url,c||[]),b||k.dispatchEvent(l("connecting")),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","attempt-connect",g.url);var d=h,e=setTimeout(function(){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","connection-timeout",g.url),j=!0,d.close(),j=!1},g.timeoutInterval);h.onopen=function(){clearTimeout(e),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onopen",g.url),g.protocol=h.protocol,g.readyState=WebSocket.OPEN,g.reconnectAttempts=0;var d=l("open");d.isReconnect=b,b=!1,k.dispatchEvent(d)},h.onclose=function(c){if(clearTimeout(e),h=null,i)g.readyState=WebSocket.CLOSED,k.dispatchEvent(l("close"));else{g.readyState=WebSocket.CONNECTING;var d=l("connecting");d.code=c.code,d.reason=c.reason,d.wasClean=c.wasClean,k.dispatchEvent(d),b||j||((g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onclose",g.url),k.dispatchEvent(l("close")));var e=g.reconnectInterval*Math.pow(g.reconnectDecay,g.reconnectAttempts);setTimeout(function(){g.reconnectAttempts++,g.open(!0)},e>g.maxReconnectInterval?g.maxReconnectInterval:e)}},h.onmessage=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onmessage",g.url,b.data);var c=l("message");c.data=b.data,k.dispatchEvent(c)},h.onerror=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onerror",g.url,b),k.dispatchEvent(l("error"))}},1==this.automaticOpen&&this.open(!1),this.send=function(b){if(h)return(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","send",g.url,b),h.send(b);throw"INVALID_STATE_ERR : Pausing to reconnect websocket"},this.close=function(a,b){"undefined"==typeof a&&(a=1e3),i=!0,h&&h.close(a,b)},this.refresh=function(){h&&h.close()}}return a.prototype.onopen=function(){},a.prototype.onclose=function(){},a.prototype.onconnecting=function(){},a.prototype.onmessage=function(){},a.prototype.onerror=function(){},a.debugAll=!1,a.CONNECTING=WebSocket.CONNECTING,a.OPEN=WebSocket.OPEN,a.CLOSING=WebSocket.CLOSING,a.CLOSED=WebSocket.CLOSED,a}); 2 | -------------------------------------------------------------------------------- /mania_normal/deps/smooth.js: -------------------------------------------------------------------------------- 1 | function smooth(arr, windowSize, getter = (value) => value, setter) { 2 | const get = getter 3 | const result = [] 4 | 5 | for (let i = 0; i < arr.length; i += 1) { 6 | const leftOffeset = i - windowSize 7 | const from = leftOffeset >= 0 ? leftOffeset : 0 8 | const to = i + windowSize + 1 9 | 10 | let count = 0 11 | let sum = 0 12 | for (let j = from; j < to && j < arr.length; j += 1) { 13 | sum += get(arr[j]) 14 | count += 1 15 | } 16 | 17 | result[i] = setter ? setter(arr[i], sum / count) : sum / count 18 | } 19 | 20 | return result 21 | } 22 | 23 | exports = smooth -------------------------------------------------------------------------------- /mania_normal/fonts/GOTHICB.TTF: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_normal/fonts/GOTHICB.TTF -------------------------------------------------------------------------------- /mania_normal/fonts/GoogleSans-Bold.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_normal/fonts/GoogleSans-Bold.otf -------------------------------------------------------------------------------- /mania_normal/fonts/MADETOMMY.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_normal/fonts/MADETOMMY.otf -------------------------------------------------------------------------------- /mania_normal/fonts/malgun.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_normal/fonts/malgun.ttf -------------------------------------------------------------------------------- /mania_normal/fonts/malgunbd.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_normal/fonts/malgunbd.ttf -------------------------------------------------------------------------------- /mania_normal/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | yep 1 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 | 32 | 33 | 34 | 35 | 36 | 37 | -------------------------------------------------------------------------------- /mania_normal/index.js: -------------------------------------------------------------------------------- 1 | // made by 2ky(@s2skky) 2 | 3 | // no touch 4 | let socket = new ReconnectingWebSocket("ws://127.0.0.1:24050/ws"); 5 | socket.onopen = () => console.log("Successfully Connected"); 6 | socket.onclose = event => { 7 | console.log("Socket Closed Connection: ", event); 8 | socket.send("Client Closed!"); 9 | }; 10 | socket.onerror = error => console.log("Socket Error: ", error); 11 | 12 | 13 | let hitcountBox = document.getElementById("hitcount_box"); 14 | let pp = document.getElementById("pp"); 15 | let ur = document.getElementById("ur"); 16 | let ratio = document.getElementById("ratio"); 17 | 18 | let h300g = document.getElementById("h300g"); 19 | let h300 = document.getElementById("h300"); 20 | let h200 = document.getElementById("h200"); 21 | let h100 = document.getElementById("h100"); 22 | let h50 = document.getElementById("h50"); 23 | let miss = document.getElementById("miss"); 24 | 25 | 26 | 27 | let curH320; 28 | let curH300; 29 | let curH200; 30 | let curH100; 31 | let curH50; 32 | let curH0; 33 | let curUR; 34 | let curTotalNote = 0; 35 | let curScore = 0; 36 | let curPP; 37 | 38 | let state; 39 | 40 | 41 | function display_section(){ 42 | hitcountBox.style.opacity = 1; 43 | } 44 | 45 | socket.onmessage = event => { 46 | try { 47 | let data = JSON.parse(event.data); 48 | let menu = data.menu; 49 | let play = data.gameplay; 50 | 51 | 52 | if (state !== menu.state){ 53 | state = menu.state; 54 | 55 | if(state == 2){ 56 | setTimeout(display_section, 1000); 57 | } 58 | else{ 59 | hitcountBox.style.opacity = 0; 60 | } 61 | 62 | } 63 | 64 | if (curPP !== play.pp.current){ 65 | curPP = play.pp.current; 66 | pp.innerHTML = curPP + 'pp'; 67 | } 68 | if (curUR !== play.hits.unstableRate){ 69 | curUR = play.hits.unstableRate; 70 | ur.innerHTML = 'UR : ' + curUR.toFixed(2); 71 | } 72 | if (curTotalNote !== play.hits.geki + play.hits[300] + play.hits.katu + play.hits[100] + play.hits[50] + play.hits[0]){ 73 | curTotalNote = play.hits.geki + play.hits[300] + play.hits.katu + play.hits[100] + play.hits[50] + play.hits[0]; 74 | let k; 75 | if(curTotalNote == 0){ 76 | ratio.innerHTML = 'Ratio : NaN:1'; 77 | } 78 | else if((curTotalNote - play.hits.geki) != 0){ 79 | k = play.hits.geki / (curTotalNote - play.hits.geki); 80 | ratio.innerHTML = 'Ratio : ' + k.toFixed(1) + ':1'; 81 | } 82 | else{ 83 | ratio.innerHTML = 'Ratio : ∞:1'; 84 | } 85 | 86 | } 87 | if (curH320 !== play.hits.geki){ 88 | curH320 = play.hits.geki; 89 | h300g.innerHTML = 'MAX : ' + curH320; 90 | } 91 | if (curH300 !== play.hits[300]){ 92 | curH300 = play.hits[300]; 93 | h300.innerHTML = 'Perf : ' + curH300; 94 | } 95 | if (curH200 !== play.hits.katu){ 96 | curH200 = play.hits.katu; 97 | h200.innerHTML = 'Great : ' + curH200; 98 | } 99 | if (curH100 !== play.hits[100]){ 100 | curH100 = play.hits[100]; 101 | h100.innerHTML = 'Good : ' + curH100; 102 | } 103 | if (curH50 !== play.hits[50]){ 104 | curH50 = play.hits[50]; 105 | h50.innerHTML = 'Bad : ' + curH50; 106 | } 107 | if (curH0 !== play.hits[0]){ 108 | curH0 = play.hits[0]; 109 | miss.innerHTML = 'Miss : ' + curH0; 110 | } 111 | 112 | if(curScore !== play.score){ 113 | curScore = play.score; 114 | } 115 | 116 | } catch (err) { console.log(err); }; 117 | }; -------------------------------------------------------------------------------- /mania_nowplaying/css/odometr.css: -------------------------------------------------------------------------------- 1 | .odometer.odometer-auto-theme, 2 | .odometer.odometer-theme-default { 3 | display: inline-block; 4 | vertical-align: middle; 5 | *vertical-align: auto; 6 | *zoom: 1; 7 | *display: inline; 8 | position: relative; 9 | } 10 | 11 | .odometer.odometer-auto-theme .odometer-digit, 12 | .odometer.odometer-theme-default .odometer-digit { 13 | display: inline-block; 14 | vertical-align: middle; 15 | *vertical-align: auto; 16 | *zoom: 1; 17 | *display: inline; 18 | position: relative; 19 | } 20 | 21 | .odometer.odometer-auto-theme .odometer-digit .odometer-digit-spacer, 22 | .odometer.odometer-theme-default .odometer-digit .odometer-digit-spacer { 23 | display: inline-block; 24 | vertical-align: middle; 25 | *vertical-align: auto; 26 | *zoom: 1; 27 | *display: inline; 28 | visibility: hidden; 29 | } 30 | 31 | .odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner, 32 | .odometer.odometer-theme-default .odometer-digit .odometer-digit-inner { 33 | text-align: left; 34 | display: block; 35 | position: absolute; 36 | top: 0; 37 | left: 0; 38 | right: 0; 39 | bottom: 0; 40 | overflow: hidden; 41 | } 42 | 43 | .odometer.odometer-auto-theme .odometer-digit .odometer-ribbon, 44 | .odometer.odometer-theme-default .odometer-digit .odometer-ribbon { 45 | display: block; 46 | } 47 | 48 | .odometer.odometer-auto-theme .odometer-digit .odometer-ribbon-inner, 49 | .odometer.odometer-theme-default .odometer-digit .odometer-ribbon-inner { 50 | display: block; 51 | -webkit-backface-visibility: hidden; 52 | } 53 | 54 | .odometer.odometer-auto-theme .odometer-digit .odometer-value, 55 | .odometer.odometer-theme-default .odometer-digit .odometer-value { 56 | display: block; 57 | -webkit-transform: translateZ(0); 58 | } 59 | 60 | .odometer.odometer-auto-theme .odometer-digit .odometer-value.odometer-last-value, 61 | .odometer.odometer-theme-default .odometer-digit .odometer-value.odometer-last-value { 62 | position: absolute; 63 | } 64 | 65 | .odometer.odometer-auto-theme.odometer-animating-up .odometer-ribbon-inner, 66 | .odometer.odometer-theme-default.odometer-animating-up .odometer-ribbon-inner { 67 | -webkit-transition: -webkit-transform 300ms; 68 | -moz-transition: -moz-transform 300ms; 69 | -ms-transition: -ms-transform 300ms; 70 | -o-transition: -o-transform 300ms; 71 | transition: transform 300ms; 72 | } 73 | 74 | .odometer.odometer-auto-theme.odometer-animating-up.odometer-animating .odometer-ribbon-inner, 75 | .odometer.odometer-theme-default.odometer-animating-up.odometer-animating .odometer-ribbon-inner { 76 | -webkit-transform: translateY(-100%); 77 | -moz-transform: translateY(-100%); 78 | -ms-transform: translateY(-100%); 79 | -o-transform: translateY(-100%); 80 | transform: translateY(-100%); 81 | } 82 | 83 | .odometer.odometer-auto-theme.odometer-animating-down .odometer-ribbon-inner, 84 | .odometer.odometer-theme-default.odometer-animating-down .odometer-ribbon-inner { 85 | -webkit-transform: translateY(-100%); 86 | -moz-transform: translateY(-100%); 87 | -ms-transform: translateY(-100%); 88 | -o-transform: translateY(-100%); 89 | transform: translateY(-100%); 90 | } 91 | 92 | .odometer.odometer-auto-theme.odometer-animating-down.odometer-animating .odometer-ribbon-inner, 93 | .odometer.odometer-theme-default.odometer-animating-down.odometer-animating .odometer-ribbon-inner { 94 | -webkit-transition: -webkit-transform 300ms; 95 | -moz-transition: -moz-transform 300ms; 96 | -ms-transition: -ms-transform 300ms; 97 | -o-transition: -o-transform 300ms; 98 | transition: transform 300ms; 99 | -webkit-transform: translateY(0); 100 | -moz-transform: translateY(0); 101 | -ms-transform: translateY(0); 102 | -o-transform: translateY(0); 103 | transform: translateY(0); 104 | } 105 | 106 | .odometer.odometer-auto-theme, 107 | .odometer.odometer-theme-default { 108 | font-family: "Helvetica Neue", sans-serif; 109 | line-height: 1.1em; 110 | } 111 | 112 | .odometer.odometer-auto-theme .odometer-value, 113 | .odometer.odometer-theme-default .odometer-value { 114 | text-align: center; 115 | } 116 | 117 | .odometer.pp .odometer-inside:after { 118 | content: "pp" 119 | } 120 | 121 | .odometer.combo .odometer-inside:after { 122 | content: "x" 123 | } 124 | 125 | .odometer.URIndex .odometer-inside:after { 126 | content: "UR" 127 | } -------------------------------------------------------------------------------- /mania_nowplaying/css/style.css: -------------------------------------------------------------------------------- 1 | /*made by 2ky(@s2skky)*/ 2 | 3 | @font-face { 4 | font-family: "Google Sans Bold"; 5 | src: url("../fonts/GoogleSans-Bold.otf"); 6 | } 7 | @font-face { 8 | font-family: "TOMMY"; 9 | src: url("../fonts/MADETOMMY.otf"); 10 | } 11 | .odometer.odometer-auto-theme { 12 | font-family: "GothicB", Helvetica, sans-serif !important; 13 | font-weight: 900px !important; 14 | } 15 | 16 | body, 17 | html { 18 | font-family: sans-serif; 19 | padding: 0; 20 | margin: 0; 21 | overflow-x: hidden; 22 | overflow-y: hidden; 23 | } 24 | 25 | #section_2{ 26 | position: absolute; 27 | top: 15px; 28 | left: 30px; 29 | transition: ease-in-out 500ms; 30 | } 31 | #nowPlayingBox{ 32 | position: absolute; 33 | width: 480px; 34 | height: 170px; 35 | background-color: rgba( 0, 0, 0, 0.5 ); 36 | border-radius: 10px; 37 | box-shadow: 0 5px 9px black; 38 | transform: skew(-8deg); 39 | } 40 | #mask_box{ 41 | position: absolute; 42 | width:400px; 43 | height: 170px; 44 | left:80px; 45 | background-color: rgba( 0, 0, 0, 0.5 ); 46 | box-shadow: 9px 5px 9px black; 47 | } 48 | #map_pic{ 49 | position: absolute; 50 | left: 30px; 51 | top: 20px; 52 | width: 170px; 53 | height: 126px; 54 | background-color: white; 55 | background-size: cover; 56 | border-radius: 10px; 57 | box-shadow: 0 5px 9px black; 58 | transition: ease-in-out 500ms; 59 | } 60 | #map_title{ 61 | position: absolute; 62 | color: white; 63 | font-size: 26px; 64 | border-radius: 5px; 65 | padding-right: 12px; 66 | padding-top: 5px; 67 | padding-bottom: 8px; 68 | } 69 | #mask_background{ 70 | position: absolute; 71 | top:20px; 72 | left:192px; 73 | height: 48px; 74 | background-color: rgba( 0, 0, 0, 0.5 ); 75 | } 76 | #mask_title{ 77 | position: absolute; 78 | left:212px; 79 | top: 20px; 80 | width: 205px; 81 | height: 100%; 82 | overflow: hidden; 83 | } 84 | .over{ 85 | transform: translate(205px); 86 | animation: slide 10s linear infinite; 87 | } 88 | @keyframes slide { 89 | 0% {transform: translate(0px);} 90 | 10% {transform: translate(0px);} 91 | 90% { transform: translate(calc(-100% + 205px)); } 92 | 100% { transform: translate(calc(-100% + 205px)); } 93 | } 94 | 95 | #map_artist{ 96 | position: absolute; 97 | width: 225px; 98 | overflow: hidden; 99 | text-overflow: ellipsis; 100 | white-space: nowrap; 101 | left: 214px; 102 | top: 68px; 103 | color: white; 104 | font-size: 20px; 105 | text-shadow: -1px 1px 2px #000, 1px 1px 2px #000; 106 | } 107 | #map_mapper{ 108 | position: absolute; 109 | left: 214px; 110 | top: 94px; 111 | color: white; 112 | font-size: 20px; 113 | text-shadow: -1px 1px 2px #000, 1px 1px 2px #000; 114 | } 115 | #map_diff{ 116 | position:absolute; 117 | right: 10px; 118 | top: 122px; 119 | color: white; 120 | font-size: 20px; 121 | text-shadow: -1px 1px 2px #000, 1px 1px 2px #000; 122 | } 123 | #map_bar{ 124 | position:absolute; 125 | bottom:10px; 126 | right:0px; 127 | width:240px; 128 | height:7px; 129 | background-color:rgba( 0, 0, 0, 0.4 ); 130 | } 131 | #map_star_bar{ 132 | float:right; 133 | width:120px; 134 | height:7px; 135 | background-color:rgba( 255, 255, 255, 0.5 ); 136 | transition: ease-in-out 500ms; 137 | } 138 | #icon_mask{ 139 | position: absolute; 140 | background-color:darkblue; 141 | top: 60px; 142 | left: -48px; 143 | width: 90px; 144 | height: 40px; 145 | border-radius: 10px; 146 | box-shadow: 0 5px 9px black; 147 | transform: skew(-8deg) rotate(-90deg); 148 | color: white; 149 | font-size: 20px; 150 | } -------------------------------------------------------------------------------- /mania_nowplaying/deps/main.css: -------------------------------------------------------------------------------- 1 | @import url("https://fonts.googleapis.com/css2?family=Roboto:wght@500&display=swap"); 2 | 3 | * { 4 | padding: 0; 5 | margin: 0; 6 | box-sizing: border-box; 7 | } 8 | 9 | body { 10 | font-family: "Roboto", sans-serif; 11 | color: white; 12 | font-size: 40px; 13 | background-color: white; 14 | } -------------------------------------------------------------------------------- /mania_nowplaying/deps/reconnecting-websocket.min.js: -------------------------------------------------------------------------------- 1 | !function(a,b){"function"==typeof define&&define.amd?define([],b):"undefined"!=typeof module&&module.exports?module.exports=b():a.ReconnectingWebSocket=b()}(this,function(){function a(b,c,d){function l(a,b){var c=document.createEvent("CustomEvent");return c.initCustomEvent(a,!1,!1,b),c}var e={debug:!1,automaticOpen:!0,reconnectInterval:1e3,maxReconnectInterval:3e4,reconnectDecay:1.5,timeoutInterval:2e3};d||(d={});for(var f in e)this[f]="undefined"!=typeof d[f]?d[f]:e[f];this.url=b,this.reconnectAttempts=0,this.readyState=WebSocket.CONNECTING,this.protocol=null;var h,g=this,i=!1,j=!1,k=document.createElement("div");k.addEventListener("open",function(a){g.onopen(a)}),k.addEventListener("close",function(a){g.onclose(a)}),k.addEventListener("connecting",function(a){g.onconnecting(a)}),k.addEventListener("message",function(a){g.onmessage(a)}),k.addEventListener("error",function(a){g.onerror(a)}),this.addEventListener=k.addEventListener.bind(k),this.removeEventListener=k.removeEventListener.bind(k),this.dispatchEvent=k.dispatchEvent.bind(k),this.open=function(b){h=new WebSocket(g.url,c||[]),b||k.dispatchEvent(l("connecting")),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","attempt-connect",g.url);var d=h,e=setTimeout(function(){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","connection-timeout",g.url),j=!0,d.close(),j=!1},g.timeoutInterval);h.onopen=function(){clearTimeout(e),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onopen",g.url),g.protocol=h.protocol,g.readyState=WebSocket.OPEN,g.reconnectAttempts=0;var d=l("open");d.isReconnect=b,b=!1,k.dispatchEvent(d)},h.onclose=function(c){if(clearTimeout(e),h=null,i)g.readyState=WebSocket.CLOSED,k.dispatchEvent(l("close"));else{g.readyState=WebSocket.CONNECTING;var d=l("connecting");d.code=c.code,d.reason=c.reason,d.wasClean=c.wasClean,k.dispatchEvent(d),b||j||((g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onclose",g.url),k.dispatchEvent(l("close")));var e=g.reconnectInterval*Math.pow(g.reconnectDecay,g.reconnectAttempts);setTimeout(function(){g.reconnectAttempts++,g.open(!0)},e>g.maxReconnectInterval?g.maxReconnectInterval:e)}},h.onmessage=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onmessage",g.url,b.data);var c=l("message");c.data=b.data,k.dispatchEvent(c)},h.onerror=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onerror",g.url,b),k.dispatchEvent(l("error"))}},1==this.automaticOpen&&this.open(!1),this.send=function(b){if(h)return(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","send",g.url,b),h.send(b);throw"INVALID_STATE_ERR : Pausing to reconnect websocket"},this.close=function(a,b){"undefined"==typeof a&&(a=1e3),i=!0,h&&h.close(a,b)},this.refresh=function(){h&&h.close()}}return a.prototype.onopen=function(){},a.prototype.onclose=function(){},a.prototype.onconnecting=function(){},a.prototype.onmessage=function(){},a.prototype.onerror=function(){},a.debugAll=!1,a.CONNECTING=WebSocket.CONNECTING,a.OPEN=WebSocket.OPEN,a.CLOSING=WebSocket.CLOSING,a.CLOSED=WebSocket.CLOSED,a}); 2 | -------------------------------------------------------------------------------- /mania_nowplaying/deps/smooth.js: -------------------------------------------------------------------------------- 1 | function smooth(arr, windowSize, getter = (value) => value, setter) { 2 | const get = getter 3 | const result = [] 4 | 5 | for (let i = 0; i < arr.length; i += 1) { 6 | const leftOffeset = i - windowSize 7 | const from = leftOffeset >= 0 ? leftOffeset : 0 8 | const to = i + windowSize + 1 9 | 10 | let count = 0 11 | let sum = 0 12 | for (let j = from; j < to && j < arr.length; j += 1) { 13 | sum += get(arr[j]) 14 | count += 1 15 | } 16 | 17 | result[i] = setter ? setter(arr[i], sum / count) : sum / count 18 | } 19 | 20 | return result 21 | } 22 | 23 | exports = smooth -------------------------------------------------------------------------------- /mania_nowplaying/fonts/GOTHICB.TTF: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_nowplaying/fonts/GOTHICB.TTF -------------------------------------------------------------------------------- /mania_nowplaying/fonts/GoogleSans-Bold.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_nowplaying/fonts/GoogleSans-Bold.otf -------------------------------------------------------------------------------- /mania_nowplaying/fonts/MADETOMMY.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_nowplaying/fonts/MADETOMMY.otf -------------------------------------------------------------------------------- /mania_nowplaying/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | yep 1 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 |
18 |
19 |
20 |
21 |
22 |
Tempestissimo
23 |
24 |
t+pazolite
25 |
by Kuo Kyoka
26 |
★ 4.60
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 | 35 | 36 | 37 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /mania_nowplaying/index.js: -------------------------------------------------------------------------------- 1 | // made by 2ky(@s2skky) 2 | 3 | // no touch 4 | let socket = new ReconnectingWebSocket("ws://127.0.0.1:24050/ws"); 5 | socket.onopen = () => console.log("Successfully Connected"); 6 | socket.onclose = event => { 7 | console.log("Socket Closed Connection: ", event); 8 | socket.send("Client Closed!"); 9 | }; 10 | socket.onerror = error => console.log("Socket Error: ", error); 11 | 12 | let section_2 = document.getElementById("section_2"); 13 | 14 | let nowPlayingBox = document.getElementById("nowPlayingBox"); 15 | let map_pic = document.getElementById("map_pic"); 16 | let map_title = document.getElementById("map_title"); 17 | let mask_title = document.getElementById("mask_title"); 18 | let mask_background = document.getElementById("mask_background"); 19 | let map_artist = document.getElementById("map_artist"); 20 | let map_mapper = document.getElementById("map_mapper"); 21 | let map_diff = document.getElementById("map_diff"); 22 | let map_star_bar = document.getElementById("map_star_bar"); 23 | 24 | let temp_title; 25 | let temp_artist; 26 | let temp_mapper; 27 | let temp_diff; 28 | let temp_path; 29 | 30 | let state; 31 | function display_section(){ 32 | section_2.style.opacity = 1; 33 | } 34 | 35 | socket.onmessage = event => { 36 | try { 37 | let data = JSON.parse(event.data); 38 | let menu = data.menu; 39 | let play = data.gameplay; 40 | 41 | if(temp_title != menu.bm.metadata.title){ 42 | temp_title = menu.bm.metadata.title; 43 | map_title.innerHTML = temp_title; 44 | map_title.style.width = 'max-content'; 45 | let title_width = map_title.offsetWidth; 46 | 47 | if(title_width >= 205){ 48 | mask_title.style.width = '205px'; 49 | mask_background.style.width = '235px'; 50 | map_title.classList.add("over"); 51 | }else{ 52 | map_title.style.width = 'auto'; 53 | mask_background.style.width = (title_width+20) + 'px'; 54 | map_title.classList.remove("over"); 55 | } 56 | } 57 | 58 | if (state !== menu.state){ 59 | state = menu.state; 60 | if(state == 2){ 61 | setTimeout(display_section, 1000); 62 | } 63 | else{ 64 | section_2.style.opacity = 0; 65 | } 66 | } 67 | if(temp_mapper != menu.bm.metadata.mapper){ 68 | temp_mapper = menu.bm.metadata.mapper; 69 | map_mapper.innerHTML = 'by ' + temp_mapper; 70 | } 71 | if(temp_artist != menu.bm.metadata.artist){ 72 | temp_artist = menu.bm.metadata.artist; 73 | map_artist.innerHTML = temp_artist; 74 | } 75 | if(temp_diff != menu.bm.stats.fullSR){ 76 | temp_diff = menu.bm.stats.fullSR; 77 | map_diff.innerHTML = parseFloat(temp_diff).toFixed(2) + ' star'; 78 | 79 | if(parseFloat(temp_diff).toFixed(2) >= 10){ 80 | map_star_bar.style.width = '240px'; 81 | } 82 | else{ 83 | map_star_bar.style.width = ( (parseFloat(temp_diff) / 10) * 240 ) + 'px'; 84 | } 85 | if (parseFloat(menu.bm.stats.fullSR) < 2){ 86 | nowPlayingBox.style.backgroundColor = '#88B300'; 87 | map_star_bar.style.backgroundColor = '#88B300'; 88 | } 89 | else if(parseFloat(menu.bm.stats.fullSR) >= 2 && parseFloat(menu.bm.stats.fullSR) < 2.5){ 90 | nowPlayingBox.style.backgroundColor = '#66CCFF'; 91 | map_star_bar.style.backgroundColor = '#66CCFF'; 92 | } 93 | else if(parseFloat(menu.bm.stats.fullSR) >= 2.5 && parseFloat(menu.bm.stats.fullSR) < 4){ 94 | nowPlayingBox.style.backgroundColor = '#FFCC22'; 95 | map_star_bar.style.backgroundColor = '#FFCC22'; 96 | } 97 | else if(parseFloat(menu.bm.stats.fullSR) >= 4 && parseFloat(menu.bm.stats.fullSR) < 5.30){ 98 | nowPlayingBox.style.backgroundColor = '#FF66AA'; 99 | map_star_bar.style.backgroundColor = '#FF66AA'; 100 | } 101 | else if(parseFloat(menu.bm.stats.fullSR) >= 5.30 && parseFloat(menu.bm.stats.fullSR) < 6.5){ 102 | nowPlayingBox.style.backgroundColor = '#AA88FF'; 103 | map_star_bar.style.backgroundColor = '#AA88FF'; 104 | } 105 | else{ 106 | nowPlayingBox.style.backgroundColor = '#787878'; 107 | map_star_bar.style.backgroundColor = '#999999'; 108 | } 109 | } 110 | if (temp_path !== menu.bm.path.full){ 111 | temp_path = data.menu.bm.path.full; 112 | data.menu.bm.path.full = data.menu.bm.path.full.replace(/#/g, '%23').replace(/%/g, '%25').replace(/\'/g, '%27').replace(/\\/g, '/'); 113 | map_pic.style.backgroundImage = `url('http://127.0.0.1:24050/Songs/${data.menu.bm.path.full}?a=${Math.random(10000)}')`; 114 | map_pic.style.backgroundPosition = "50% 50%"; 115 | } 116 | } catch (err) { console.log(err); }; 117 | }; -------------------------------------------------------------------------------- /mania_simple_hitcount/css/odometr.css: -------------------------------------------------------------------------------- 1 | .odometer.odometer-auto-theme, 2 | .odometer.odometer-theme-default { 3 | display: inline-block; 4 | vertical-align: middle; 5 | *vertical-align: auto; 6 | *zoom: 1; 7 | *display: inline; 8 | position: relative; 9 | } 10 | 11 | .odometer.odometer-auto-theme .odometer-digit, 12 | .odometer.odometer-theme-default .odometer-digit { 13 | display: inline-block; 14 | vertical-align: middle; 15 | *vertical-align: auto; 16 | *zoom: 1; 17 | *display: inline; 18 | position: relative; 19 | } 20 | 21 | .odometer.odometer-auto-theme .odometer-digit .odometer-digit-spacer, 22 | .odometer.odometer-theme-default .odometer-digit .odometer-digit-spacer { 23 | display: inline-block; 24 | vertical-align: middle; 25 | *vertical-align: auto; 26 | *zoom: 1; 27 | *display: inline; 28 | visibility: hidden; 29 | } 30 | 31 | .odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner, 32 | .odometer.odometer-theme-default .odometer-digit .odometer-digit-inner { 33 | text-align: left; 34 | display: block; 35 | position: absolute; 36 | top: 0; 37 | left: 0; 38 | right: 0; 39 | bottom: 0; 40 | overflow: hidden; 41 | } 42 | 43 | .odometer.odometer-auto-theme .odometer-digit .odometer-ribbon, 44 | .odometer.odometer-theme-default .odometer-digit .odometer-ribbon { 45 | display: block; 46 | } 47 | 48 | .odometer.odometer-auto-theme .odometer-digit .odometer-ribbon-inner, 49 | .odometer.odometer-theme-default .odometer-digit .odometer-ribbon-inner { 50 | display: block; 51 | -webkit-backface-visibility: hidden; 52 | } 53 | 54 | .odometer.odometer-auto-theme .odometer-digit .odometer-value, 55 | .odometer.odometer-theme-default .odometer-digit .odometer-value { 56 | display: block; 57 | -webkit-transform: translateZ(0); 58 | } 59 | 60 | .odometer.odometer-auto-theme .odometer-digit .odometer-value.odometer-last-value, 61 | .odometer.odometer-theme-default .odometer-digit .odometer-value.odometer-last-value { 62 | position: absolute; 63 | } 64 | 65 | .odometer.odometer-auto-theme.odometer-animating-up .odometer-ribbon-inner, 66 | .odometer.odometer-theme-default.odometer-animating-up .odometer-ribbon-inner { 67 | -webkit-transition: -webkit-transform 300ms; 68 | -moz-transition: -moz-transform 300ms; 69 | -ms-transition: -ms-transform 300ms; 70 | -o-transition: -o-transform 300ms; 71 | transition: transform 300ms; 72 | } 73 | 74 | .odometer.odometer-auto-theme.odometer-animating-up.odometer-animating .odometer-ribbon-inner, 75 | .odometer.odometer-theme-default.odometer-animating-up.odometer-animating .odometer-ribbon-inner { 76 | -webkit-transform: translateY(-100%); 77 | -moz-transform: translateY(-100%); 78 | -ms-transform: translateY(-100%); 79 | -o-transform: translateY(-100%); 80 | transform: translateY(-100%); 81 | } 82 | 83 | .odometer.odometer-auto-theme.odometer-animating-down .odometer-ribbon-inner, 84 | .odometer.odometer-theme-default.odometer-animating-down .odometer-ribbon-inner { 85 | -webkit-transform: translateY(-100%); 86 | -moz-transform: translateY(-100%); 87 | -ms-transform: translateY(-100%); 88 | -o-transform: translateY(-100%); 89 | transform: translateY(-100%); 90 | } 91 | 92 | .odometer.odometer-auto-theme.odometer-animating-down.odometer-animating .odometer-ribbon-inner, 93 | .odometer.odometer-theme-default.odometer-animating-down.odometer-animating .odometer-ribbon-inner { 94 | -webkit-transition: -webkit-transform 300ms; 95 | -moz-transition: -moz-transform 300ms; 96 | -ms-transition: -ms-transform 300ms; 97 | -o-transition: -o-transform 300ms; 98 | transition: transform 300ms; 99 | -webkit-transform: translateY(0); 100 | -moz-transform: translateY(0); 101 | -ms-transform: translateY(0); 102 | -o-transform: translateY(0); 103 | transform: translateY(0); 104 | } 105 | 106 | .odometer.odometer-auto-theme, 107 | .odometer.odometer-theme-default { 108 | font-family: "Helvetica Neue", sans-serif; 109 | line-height: 1.1em; 110 | } 111 | 112 | .odometer.odometer-auto-theme .odometer-value, 113 | .odometer.odometer-theme-default .odometer-value { 114 | text-align: center; 115 | } 116 | 117 | .odometer.pp .odometer-inside:after { 118 | content: "pp" 119 | } 120 | 121 | .odometer.combo .odometer-inside:after { 122 | content: "x" 123 | } 124 | 125 | .odometer.URIndex .odometer-inside:after { 126 | content: "UR" 127 | } -------------------------------------------------------------------------------- /mania_simple_hitcount/css/style.css: -------------------------------------------------------------------------------- 1 | /* made by 2ky(@s2skky) */ 2 | 3 | @font-face { 4 | font-family: "Google Sans Bold"; 5 | src: url("../fonts/GoogleSans-Bold.otf"); 6 | } 7 | @font-face { 8 | font-family: "TOMMY"; 9 | src: url("../fonts/MADETOMMY.otf"); 10 | } 11 | .odometer.odometer-auto-theme { 12 | font-family: "GothicB", Helvetica, sans-serif !important; 13 | font-weight: 900px !important; 14 | } 15 | 16 | body, 17 | html { 18 | padding: 0; 19 | margin: 0; 20 | overflow-x: hidden; 21 | overflow-y: hidden; 22 | } 23 | 24 | #section_3{ 25 | transition: ease-in-out 500ms; 26 | } 27 | #hitcount_box{ 28 | position: absolute; 29 | top:10px; 30 | left:10px; 31 | width:200px; 32 | height:270px; 33 | line-height: 35px; 34 | background-color: #262626; 35 | } 36 | #textBox{ 37 | position: absolute; 38 | left: 20px; 39 | top: 10px; 40 | } 41 | #textH300g, 42 | #textH300, 43 | #textH200, 44 | #textH100, 45 | #textH50, 46 | #textMiss, 47 | #textUr{ 48 | font-family: TOMMY; 49 | font-size: 20pt; 50 | transition: ease-in-out 100ms; 51 | text-align: left; 52 | text-shadow: -1px 1px 2px #000, 1px 1px 2px #000; 53 | } 54 | #textH300g{ 55 | color:azure; 56 | } 57 | #textH300{ 58 | color:orange; 59 | } 60 | #textH200{ 61 | color:forestgreen; 62 | } 63 | #textH100{ 64 | color:dodgerblue; 65 | } 66 | #textH50{ 67 | color:hotpink; 68 | } 69 | #textMiss{ 70 | color:crimson; 71 | } 72 | #textUr{ 73 | color:white; 74 | } 75 | 76 | #countBox{ 77 | position: absolute; 78 | right: 20px; 79 | top: 10px; 80 | } 81 | #h300g, 82 | #h300, 83 | #h200, 84 | #h100, 85 | #h50, 86 | #miss, 87 | #ur{ 88 | position:absolute; 89 | right: 2px; 90 | font-family: TOMMY; 91 | font-weight: bold; 92 | font-size: 20pt; 93 | text-align: right; 94 | text-shadow: -1px 1px 2px #000, 1px 1px 2px #000; 95 | 96 | white-space: nowrap; 97 | overflow: hidden; 98 | text-overflow: ellipsis; 99 | 100 | color: #eaeaea; 101 | } 102 | #h300g{ 103 | top:4px; 104 | } 105 | #h300{ 106 | top: 39px; 107 | } 108 | #h200{ 109 | top: 74px; 110 | } 111 | #h100{ 112 | top: 109px; 113 | } 114 | #h50{ 115 | top: 144px; 116 | } 117 | #miss{ 118 | top: 179px; 119 | } 120 | #ur{ 121 | top: 214px; 122 | } 123 | 124 | #bar_box{ 125 | position: absolute; 126 | width: 200px; 127 | height: 5px; 128 | top: 265px; 129 | background-color:dimgray; 130 | overflow:hidden; 131 | display:flex; 132 | 133 | } 134 | #bar_h300g, 135 | #bar_h300, 136 | #bar_h200, 137 | #bar_bad{ 138 | height: 5px; 139 | } 140 | #bar_h300g{ 141 | background-color: azure; 142 | } 143 | #bar_h300{ 144 | background-color: orange; 145 | } 146 | #bar_h200{ 147 | background-color: forestgreen; 148 | } 149 | #bar_bad{ 150 | background-color: crimson; 151 | } -------------------------------------------------------------------------------- /mania_simple_hitcount/deps/reconnecting-websocket.min.js: -------------------------------------------------------------------------------- 1 | !function(a,b){"function"==typeof define&&define.amd?define([],b):"undefined"!=typeof module&&module.exports?module.exports=b():a.ReconnectingWebSocket=b()}(this,function(){function a(b,c,d){function l(a,b){var c=document.createEvent("CustomEvent");return c.initCustomEvent(a,!1,!1,b),c}var e={debug:!1,automaticOpen:!0,reconnectInterval:1e3,maxReconnectInterval:3e4,reconnectDecay:1.5,timeoutInterval:2e3};d||(d={});for(var f in e)this[f]="undefined"!=typeof d[f]?d[f]:e[f];this.url=b,this.reconnectAttempts=0,this.readyState=WebSocket.CONNECTING,this.protocol=null;var h,g=this,i=!1,j=!1,k=document.createElement("div");k.addEventListener("open",function(a){g.onopen(a)}),k.addEventListener("close",function(a){g.onclose(a)}),k.addEventListener("connecting",function(a){g.onconnecting(a)}),k.addEventListener("message",function(a){g.onmessage(a)}),k.addEventListener("error",function(a){g.onerror(a)}),this.addEventListener=k.addEventListener.bind(k),this.removeEventListener=k.removeEventListener.bind(k),this.dispatchEvent=k.dispatchEvent.bind(k),this.open=function(b){h=new WebSocket(g.url,c||[]),b||k.dispatchEvent(l("connecting")),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","attempt-connect",g.url);var d=h,e=setTimeout(function(){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","connection-timeout",g.url),j=!0,d.close(),j=!1},g.timeoutInterval);h.onopen=function(){clearTimeout(e),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onopen",g.url),g.protocol=h.protocol,g.readyState=WebSocket.OPEN,g.reconnectAttempts=0;var d=l("open");d.isReconnect=b,b=!1,k.dispatchEvent(d)},h.onclose=function(c){if(clearTimeout(e),h=null,i)g.readyState=WebSocket.CLOSED,k.dispatchEvent(l("close"));else{g.readyState=WebSocket.CONNECTING;var d=l("connecting");d.code=c.code,d.reason=c.reason,d.wasClean=c.wasClean,k.dispatchEvent(d),b||j||((g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onclose",g.url),k.dispatchEvent(l("close")));var e=g.reconnectInterval*Math.pow(g.reconnectDecay,g.reconnectAttempts);setTimeout(function(){g.reconnectAttempts++,g.open(!0)},e>g.maxReconnectInterval?g.maxReconnectInterval:e)}},h.onmessage=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onmessage",g.url,b.data);var c=l("message");c.data=b.data,k.dispatchEvent(c)},h.onerror=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onerror",g.url,b),k.dispatchEvent(l("error"))}},1==this.automaticOpen&&this.open(!1),this.send=function(b){if(h)return(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","send",g.url,b),h.send(b);throw"INVALID_STATE_ERR : Pausing to reconnect websocket"},this.close=function(a,b){"undefined"==typeof a&&(a=1e3),i=!0,h&&h.close(a,b)},this.refresh=function(){h&&h.close()}}return a.prototype.onopen=function(){},a.prototype.onclose=function(){},a.prototype.onconnecting=function(){},a.prototype.onmessage=function(){},a.prototype.onerror=function(){},a.debugAll=!1,a.CONNECTING=WebSocket.CONNECTING,a.OPEN=WebSocket.OPEN,a.CLOSING=WebSocket.CLOSING,a.CLOSED=WebSocket.CLOSED,a}); 2 | -------------------------------------------------------------------------------- /mania_simple_hitcount/deps/smooth.js: -------------------------------------------------------------------------------- 1 | function smooth(arr, windowSize, getter = (value) => value, setter) { 2 | const get = getter 3 | const result = [] 4 | 5 | for (let i = 0; i < arr.length; i += 1) { 6 | const leftOffeset = i - windowSize 7 | const from = leftOffeset >= 0 ? leftOffeset : 0 8 | const to = i + windowSize + 1 9 | 10 | let count = 0 11 | let sum = 0 12 | for (let j = from; j < to && j < arr.length; j += 1) { 13 | sum += get(arr[j]) 14 | count += 1 15 | } 16 | 17 | result[i] = setter ? setter(arr[i], sum / count) : sum / count 18 | } 19 | 20 | return result 21 | } 22 | 23 | exports = smooth -------------------------------------------------------------------------------- /mania_simple_hitcount/fonts/GOTHICB.TTF: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_hitcount/fonts/GOTHICB.TTF -------------------------------------------------------------------------------- /mania_simple_hitcount/fonts/GoogleSans-Bold.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_hitcount/fonts/GoogleSans-Bold.otf -------------------------------------------------------------------------------- /mania_simple_hitcount/fonts/MADETOMMY.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_hitcount/fonts/MADETOMMY.otf -------------------------------------------------------------------------------- /mania_simple_hitcount/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | yep 1 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 |
18 |
19 |
20 |
320
21 |
300
22 |
200
23 |
100
24 |
50
25 |
0
26 |
UR
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 |
46 |
47 | 48 | 49 | 50 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /mania_simple_hitcount/index.js: -------------------------------------------------------------------------------- 1 | // made by 2ky(@s2skky) 2 | 3 | // no touch 4 | let socket = new ReconnectingWebSocket("ws://127.0.0.1:24050/ws"); 5 | socket.onopen = () => console.log("Successfully Connected"); 6 | socket.onclose = event => { 7 | console.log("Socket Closed Connection: ", event); 8 | socket.send("Client Closed!"); 9 | }; 10 | socket.onerror = error => console.log("Socket Error: ", error); 11 | 12 | let section_3 = document.getElementById("section_3"); 13 | 14 | let hitcountBox = document.getElementById("hitcount_box"); 15 | let h300g = document.getElementById("h300g"); 16 | let h300 = document.getElementById("h300"); 17 | let h200 = document.getElementById("h200"); 18 | let h100 = document.getElementById("h100"); 19 | let h50 = document.getElementById("h50"); 20 | let miss = document.getElementById("miss"); 21 | let ur = document.getElementById("ur"); 22 | 23 | let texth300g = document.getElementById("textH300g"); 24 | let texth300 = document.getElementById("textH300"); 25 | let texth200 = document.getElementById("textH200"); 26 | let texth100 = document.getElementById("textH100"); 27 | let texth50 = document.getElementById("textH50"); 28 | let textmiss = document.getElementById("textMiss"); 29 | let textur = document.getElementById("textUr"); 30 | 31 | let bar_h300g = document.getElementById("bar_h300g"); 32 | let bar_h300 = document.getElementById("bar_h300"); 33 | let bar_h200 = document.getElementById("bar_h200"); 34 | let bar_bad = document.getElementById("bar_bad"); 35 | 36 | let tH300g; 37 | let tH300; 38 | let tH200; 39 | let tH100; 40 | let tH50; 41 | let tMiss; 42 | let tUr; 43 | let tTotal = 0; 44 | let tScore = 0; 45 | 46 | let state; 47 | 48 | 49 | function display_section(){ 50 | section_3.style.opacity = 1; 51 | } 52 | function set_hitcount_bar(total){ 53 | let tempH300 = Math.floor((tH300 / total) * 200); 54 | let tempH200 = Math.floor((tH200 / total) * 200); 55 | let tempMiss = Math.floor(((tH100+ tH50 + tMiss) / total) * 200); 56 | let tempH320 = 200 - tempH300 - tempH200 - tempMiss; 57 | 58 | bar_h300g.style.width = tempH320 + 'px'; 59 | bar_h300.style.width = tempH300 + 'px'; 60 | bar_h200.style.width = tempH200 + 'px'; 61 | bar_bad.style.width = tempMiss + 'px'; 62 | } 63 | 64 | socket.onmessage = event => { 65 | try { 66 | let data = JSON.parse(event.data); 67 | let menu = data.menu; 68 | let play = data.gameplay; 69 | 70 | 71 | if (state !== menu.state){ 72 | state = menu.state; 73 | 74 | if(state == 2){ 75 | setTimeout(display_section, 1000); 76 | } 77 | else{ 78 | bar_h300g.style.width = '0px'; 79 | bar_h300.style.width = '0px'; 80 | bar_h200.style.width = '0px'; 81 | bar_bad.style.width = '0px'; 82 | 83 | section_3.style.opacity = 0; 84 | } 85 | 86 | } 87 | 88 | 89 | if (tTotal !== play.hits.geki + play.hits[300] + play.hits.katu + play.hits[100] + play.hits[50] + play.hits[0]){ 90 | tTotal = play.hits.geki + play.hits[300] + play.hits.katu + play.hits[100] + play.hits[50] + play.hits[0]; 91 | } 92 | 93 | if (tH300g !== play.hits.geki){ 94 | tH300g = play.hits.geki; 95 | h300g.innerHTML = tH300g; 96 | if(tTotal != 0){ 97 | set_hitcount_bar(tTotal); 98 | } 99 | } 100 | if (tH300 !== play.hits[300]){ 101 | tH300 = play.hits[300]; 102 | h300.innerHTML = tH300; 103 | if(tTotal != 0){ 104 | set_hitcount_bar(tTotal); 105 | } 106 | } 107 | if (tH200 !== play.hits.katu){ 108 | tH200 = play.hits.katu; 109 | h200.innerHTML = tH200; 110 | if(tTotal != 0){ 111 | set_hitcount_bar(tTotal); 112 | } 113 | } 114 | if (tH100 !== play.hits[100]){ 115 | tH100 = play.hits[100]; 116 | h100.innerHTML = tH100; 117 | if(tTotal != 0){ 118 | set_hitcount_bar(tTotal); 119 | } 120 | } 121 | if (tH50 !== play.hits[50]){ 122 | tH50 = play.hits[50]; 123 | h50.innerHTML = tH50; 124 | if(tTotal != 0){ 125 | set_hitcount_bar(tTotal); 126 | } 127 | } 128 | if (tMiss !== play.hits[0]){ 129 | tMiss = play.hits[0]; 130 | miss.innerHTML = tMiss; 131 | if(tTotal != 0){ 132 | set_hitcount_bar(tTotal); 133 | } 134 | } 135 | if (tUr !== play.hits.unstableRate){ 136 | tUr = play.hits.unstableRate; 137 | ur.innerHTML = tUr; 138 | } 139 | 140 | if(tScore !== play.score){ 141 | tScore = play.score; 142 | if(tScore == 0){ 143 | bar_h300g.style.width = '0px'; 144 | bar_h300.style.width = '0px'; 145 | bar_h200.style.width = '0px'; 146 | bar_bad.style.width = '0px'; 147 | } 148 | } 149 | 150 | } catch (err) { console.log(err); }; 151 | }; -------------------------------------------------------------------------------- /mania_simple_hiterror/css/style.css: -------------------------------------------------------------------------------- 1 | /* made by 2ky(@s2skky) */ 2 | 3 | body, 4 | html { 5 | padding: 0; 6 | margin: 0; 7 | overflow: hidden; 8 | } 9 | #main { 10 | position: absolute; 11 | width: 350px; 12 | height: 200px; 13 | top:50px; 14 | } 15 | #bar { 16 | position: absolute; 17 | left: 20px; 18 | width: 300px; 19 | height: 0px; 20 | 21 | background-color: white; 22 | transition: ease-in-out 200ms; 23 | } 24 | 25 | #arrow{ 26 | position: absolute; 27 | width: 0px; 28 | height: 0px; 29 | top: -27.5px; 30 | left: 140px; 31 | 32 | border-style:solid; 33 | border-width: 10px; 34 | border-color: white transparent transparent transparent; 35 | 36 | transition: ease-out 100ms; 37 | transform-origin: 50% 50%; 38 | } 39 | 40 | #center { 41 | position: absolute; 42 | top:-11px; 43 | left: 147.5px; 44 | width: 5px; 45 | height: 25px; 46 | background-color: red; 47 | transition: ease-out 500ms; 48 | } 49 | 50 | #tick0, 51 | #tick1, 52 | #tick2, 53 | #tick3, 54 | #tick4, 55 | #tick5, 56 | #tick6, 57 | #tick7, 58 | #tick8, 59 | #tick9, 60 | #tick10, 61 | #tick11, 62 | #tick12, 63 | #tick13, 64 | #tick14, 65 | #tick15, 66 | #tick16, 67 | #tick17, 68 | #tick18, 69 | #tick19, 70 | #tick20, 71 | #tick21, 72 | #tick22, 73 | #tick23, 74 | #tick24, 75 | #tick25, 76 | #tick26, 77 | #tick27, 78 | #tick28, 79 | #tick29, 80 | #tick30, 81 | #tick31, 82 | #tick32, 83 | #tick33, 84 | #tick34, 85 | #tick35, 86 | #tick36, 87 | #tick37, 88 | #tick38, 89 | #tick39, 90 | #tick40, 91 | #tick41, 92 | #tick42, 93 | #tick43, 94 | #tick44, 95 | #tick45, 96 | #tick46, 97 | #tick47, 98 | #tick48, 99 | #tick49, 100 | #tick50, 101 | #tick51, 102 | #tick52, 103 | #tick53, 104 | #tick54, 105 | #tick55, 106 | #tick56, 107 | #tick57, 108 | #tick58, 109 | #tick59, 110 | #tick60, 111 | #tick61, 112 | #tick62, 113 | #tick63, 114 | #tick64, 115 | #tick65, 116 | #tick66, 117 | #tick67, 118 | #tick68, 119 | #tick69, 120 | #tick70, 121 | #tick71, 122 | #tick72, 123 | #tick73, 124 | #tick74, 125 | #tick75, 126 | #tick76, 127 | #tick77, 128 | #tick78, 129 | #tick79, 130 | #tick80, 131 | #tick81, 132 | #tick82, 133 | #tick83, 134 | #tick84, 135 | #tick85, 136 | #tick86, 137 | #tick87, 138 | #tick88, 139 | #tick89, 140 | #tick90, 141 | #tick91, 142 | #tick92, 143 | #tick93, 144 | #tick94, 145 | #tick95, 146 | #tick96, 147 | #tick97, 148 | #tick98, 149 | #tick99{ 150 | position: absolute; 151 | top: -9px; 152 | height: 20px; 153 | width: 5px; 154 | background-color: white; 155 | left: 147.5px; 156 | } 157 | 158 | #early{ 159 | position: absolute; 160 | top: -13px; 161 | left: 40px; 162 | font-size: 18px; 163 | font-weight: bold; 164 | 165 | color: #B3D7FF; 166 | transition: ease-out 500ms; 167 | } 168 | #late{ 169 | position: absolute; 170 | top: -13px; 171 | right: 40px; 172 | font-size: 18px; 173 | font-weight: bold; 174 | 175 | color: #FFB3B3; 176 | transition: ease-out 500ms; 177 | } 178 | -------------------------------------------------------------------------------- /mania_simple_hiterror/deps/reconnecting-websocket.min.js: -------------------------------------------------------------------------------- 1 | !function(a,b){"function"==typeof define&&define.amd?define([],b):"undefined"!=typeof module&&module.exports?module.exports=b():a.ReconnectingWebSocket=b()}(this,function(){function a(b,c,d){function l(a,b){var c=document.createEvent("CustomEvent");return c.initCustomEvent(a,!1,!1,b),c}var e={debug:!1,automaticOpen:!0,reconnectInterval:1e3,maxReconnectInterval:3e4,reconnectDecay:1.5,timeoutInterval:2e3};d||(d={});for(var f in e)this[f]="undefined"!=typeof d[f]?d[f]:e[f];this.url=b,this.reconnectAttempts=0,this.readyState=WebSocket.CONNECTING,this.protocol=null;var h,g=this,i=!1,j=!1,k=document.createElement("div");k.addEventListener("open",function(a){g.onopen(a)}),k.addEventListener("close",function(a){g.onclose(a)}),k.addEventListener("connecting",function(a){g.onconnecting(a)}),k.addEventListener("message",function(a){g.onmessage(a)}),k.addEventListener("error",function(a){g.onerror(a)}),this.addEventListener=k.addEventListener.bind(k),this.removeEventListener=k.removeEventListener.bind(k),this.dispatchEvent=k.dispatchEvent.bind(k),this.open=function(b){h=new WebSocket(g.url,c||[]),b||k.dispatchEvent(l("connecting")),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","attempt-connect",g.url);var d=h,e=setTimeout(function(){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","connection-timeout",g.url),j=!0,d.close(),j=!1},g.timeoutInterval);h.onopen=function(){clearTimeout(e),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onopen",g.url),g.protocol=h.protocol,g.readyState=WebSocket.OPEN,g.reconnectAttempts=0;var d=l("open");d.isReconnect=b,b=!1,k.dispatchEvent(d)},h.onclose=function(c){if(clearTimeout(e),h=null,i)g.readyState=WebSocket.CLOSED,k.dispatchEvent(l("close"));else{g.readyState=WebSocket.CONNECTING;var d=l("connecting");d.code=c.code,d.reason=c.reason,d.wasClean=c.wasClean,k.dispatchEvent(d),b||j||((g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onclose",g.url),k.dispatchEvent(l("close")));var e=g.reconnectInterval*Math.pow(g.reconnectDecay,g.reconnectAttempts);setTimeout(function(){g.reconnectAttempts++,g.open(!0)},e>g.maxReconnectInterval?g.maxReconnectInterval:e)}},h.onmessage=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onmessage",g.url,b.data);var c=l("message");c.data=b.data,k.dispatchEvent(c)},h.onerror=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onerror",g.url,b),k.dispatchEvent(l("error"))}},1==this.automaticOpen&&this.open(!1),this.send=function(b){if(h)return(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","send",g.url,b),h.send(b);throw"INVALID_STATE_ERR : Pausing to reconnect websocket"},this.close=function(a,b){"undefined"==typeof a&&(a=1e3),i=!0,h&&h.close(a,b)},this.refresh=function(){h&&h.close()}}return a.prototype.onopen=function(){},a.prototype.onclose=function(){},a.prototype.onconnecting=function(){},a.prototype.onmessage=function(){},a.prototype.onerror=function(){},a.debugAll=!1,a.CONNECTING=WebSocket.CONNECTING,a.OPEN=WebSocket.OPEN,a.CLOSING=WebSocket.CLOSING,a.CLOSED=WebSocket.CLOSED,a}); 2 | -------------------------------------------------------------------------------- /mania_simple_hiterror/deps/smooth.js: -------------------------------------------------------------------------------- 1 | function smooth(arr, windowSize, getter = (value) => value, setter) { 2 | const get = getter 3 | const result = [] 4 | 5 | for (let i = 0; i < arr.length; i += 1) { 6 | const leftOffeset = i - windowSize 7 | const from = leftOffeset >= 0 ? leftOffeset : 0 8 | const to = i + windowSize + 1 9 | 10 | let count = 0 11 | let sum = 0 12 | for (let j = from; j < to && j < arr.length; j += 1) { 13 | sum += get(arr[j]) 14 | count += 1 15 | } 16 | 17 | result[i] = setter ? setter(arr[i], sum / count) : sum / count 18 | } 19 | 20 | return result 21 | } 22 | 23 | exports = smooth -------------------------------------------------------------------------------- /mania_simple_hiterror/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 |
50 |
51 |
52 |
53 |
54 |
55 |
56 |
57 |
58 |
59 |
60 |
61 |
62 |
63 |
64 |
65 |
66 |
67 |
68 |
69 |
70 |
71 |
72 |
73 |
74 |
75 |
76 |
77 |
78 |
79 |
80 |
81 |
82 |
83 |
84 |
85 |
86 |
87 |
88 |
89 |
90 |
91 |
92 |
93 |
94 |
95 |
96 |
97 |
98 |
99 |
100 |
101 |
102 |
103 |
104 |
105 |
106 |
107 |
108 |
109 |
110 |
111 |
112 |
113 |
114 |
115 |
116 |
117 |
118 |
119 |
Early
Late
120 |
121 |
122 | 123 | 124 | 125 | -------------------------------------------------------------------------------- /mania_simple_hiterror/index.js: -------------------------------------------------------------------------------- 1 | // made by 2ky(@s2skky) 2 | 3 | //no touch 4 | let socket = new ReconnectingWebSocket("ws://127.0.0.1:24050/ws"); 5 | socket.onopen = () => { 6 | console.log("Successfully Connected"); 7 | }; 8 | socket.onclose = event => { 9 | console.log("Socket Closed Connection: ", event); 10 | socket.send("Client Closed!"); 11 | }; 12 | socket.onerror = error => { 13 | console.log("Socket Error: ", error); 14 | }; 15 | 16 | 17 | let tick = []; 18 | for (var t = 0; t < 100; t++) { 19 | tick[t] = document.querySelectorAll("[id^=tick]")[t]; 20 | } 21 | 22 | let bar = document.getElementById("bar"); 23 | let center = document.getElementById("center"); 24 | let arrow = document.getElementById("arrow"); 25 | 26 | let early = document.getElementById("early"); 27 | let late = document.getElementById("late"); 28 | 29 | let state; 30 | let cur_ur; 31 | let cur_combo; 32 | 33 | let tempHitErrorArrayLength; 34 | let OD = 0; 35 | let tickPos = []; 36 | let fullPos; 37 | let tempAvg; 38 | let tempSmooth; 39 | let currentErrorValue = []; 40 | let preHitErrorArrayLength = 0; 41 | let hitErrorArrayPos = []; 42 | 43 | socket.onmessage = event => { 44 | let data = JSON.parse(event.data); 45 | if (state !== data.menu.state) { 46 | state = data.menu.state; 47 | if (state !== 2) { 48 | for (var y = 0; y < 100; y++) { 49 | tick[y].style.transform = "translateX(0)"; 50 | tick[y].style.opacity = 0; 51 | } 52 | tickPos = []; 53 | tempAvg = 0; 54 | arrow.style.transform = "translateX(0)"; 55 | bar.style.opacity = 0; 56 | early.style.opacity = 0; 57 | late.style.opacity = 0; 58 | } else { 59 | tickPos = []; 60 | currentErrorValue = []; 61 | hitErrorArrayPos = []; 62 | preHitErrorArrayLength = 0; 63 | tempHitErrorArrayLength = 0; 64 | 65 | bar.style.opacity = 1; 66 | early.style.opacity = 1; 67 | late.style.opacity = 1; 68 | 69 | setTimeout(function(){ 70 | early.style.opacity = 0; 71 | late.style.opacity = 0; 72 | }, 1200); 73 | } 74 | } 75 | if (data.gameplay.hits.unstableRate == 0) { 76 | for (var y = 0; y < 100; y++) { 77 | tick[y].style.transform = "translateX(0)"; 78 | tick[y].style.opacity = 0; 79 | } 80 | arrow.style.transform = "translateX(0)"; 81 | } 82 | if (cur_ur !== data.gameplay.hits.unstableRate) { 83 | cur_ur = data.gameplay.hits.unstableRate; 84 | tempAvg = 0; 85 | } 86 | 87 | //source reference -> TryZCustomOverlay(made by FukutoTojido) 88 | if (cur_combo !== data.gameplay.combo.current) { 89 | OD = data.menu.bm.stats.memoryOD; 90 | cur_combo = data.gameplay.combo.current; 91 | tempSmooth = smooth(data.gameplay.hits.hitErrorArray, 4); 92 | 93 | if (tempHitErrorArrayLength !== tempSmooth.length) { 94 | preHitErrorArrayLength = tempHitErrorArrayLength; 95 | tempHitErrorArrayLength = tempSmooth.length; 96 | tickPos = []; 97 | currentErrorValue = []; 98 | hitErrorArrayPos = []; 99 | 100 | for (var a = 0; a < tempHitErrorArrayLength; a++) { 101 | tempAvg = tempAvg * 0.90 + tempSmooth[a] * 0.1; 102 | } 103 | fullPos = (-10 * OD + 199.5); 104 | 105 | // push hitErrorValue 106 | for(var b = preHitErrorArrayLength; b < tempHitErrorArrayLength; b++){ 107 | tickPos.push((data.gameplay.hits.hitErrorArray[b] / fullPos * 145)); 108 | currentErrorValue.push((data.gameplay.hits.hitErrorArray[b])); 109 | hitErrorArrayPos.push(b); 110 | } 111 | //tickPos = data.gameplay.hits.hitErrorArray[tempHitErrorArrayLength - 1] / fullPos * 145; 112 | //currentErrorValue = data.gameplay.hits.hitErrorArray[tempHitErrorArrayLength - 1]; 113 | 114 | // s: adjust arrow 115 | arrow.style.transform = `translateX(${(tempAvg / fullPos) * 150}px)`; 116 | if((tempAvg / fullPos) * 150 > 2.5){ 117 | arrow.style.borderColor = "#FF4040 transparent transparent transparent" 118 | } 119 | else if((tempAvg / fullPos) * 150 < -2.5){ 120 | arrow.style.borderColor = "#1985FF transparent transparent transparent" 121 | } 122 | else{ 123 | arrow.style.borderColor = "white transparent transparent transparent" 124 | } 125 | // e: adjst arrow 126 | 127 | for(var c = 0; c < hitErrorArrayPos.length; c++){ 128 | var curTickPos = hitErrorArrayPos[c] % 100; 129 | tick[curTickPos].style.opacity = 1; 130 | tick[curTickPos].style.transform = `translateX(${tickPos[c]}px)`; 131 | 132 | $("#tick" + curTickPos).stop().animate({opacity : 0}, 1200); 133 | 134 | } 135 | } 136 | } 137 | } 138 | -------------------------------------------------------------------------------- /mania_simple_hiterror_colorful/css/style.css: -------------------------------------------------------------------------------- 1 | /* made by 2ky(@s2skky) */ 2 | 3 | body, 4 | html { 5 | padding: 0; 6 | margin: 0; 7 | overflow: hidden; 8 | } 9 | #main { 10 | position: absolute; 11 | width: 350px; 12 | height: 200px; 13 | top:50px; 14 | } 15 | #bar { 16 | position: absolute; 17 | left: 20px; 18 | width: 300px; 19 | height: 0px; 20 | 21 | background-color: white; 22 | transition: ease-in-out 200ms; 23 | } 24 | 25 | #arrow{ 26 | position: absolute; 27 | width: 0px; 28 | height: 0px; 29 | top: -27.5px; 30 | left: 140px; 31 | 32 | border-style:solid; 33 | border-width: 10px; 34 | border-color: white transparent transparent transparent; 35 | 36 | transition: ease-out 100ms; 37 | transform-origin: 50% 50%; 38 | } 39 | 40 | #center { 41 | position: absolute; 42 | top:-11px; 43 | left: 147.5px; 44 | width: 5px; 45 | height: 25px; 46 | background-color: red; 47 | transition: ease-out 500ms; 48 | } 49 | 50 | #tick0, 51 | #tick1, 52 | #tick2, 53 | #tick3, 54 | #tick4, 55 | #tick5, 56 | #tick6, 57 | #tick7, 58 | #tick8, 59 | #tick9, 60 | #tick10, 61 | #tick11, 62 | #tick12, 63 | #tick13, 64 | #tick14, 65 | #tick15, 66 | #tick16, 67 | #tick17, 68 | #tick18, 69 | #tick19, 70 | #tick20, 71 | #tick21, 72 | #tick22, 73 | #tick23, 74 | #tick24, 75 | #tick25, 76 | #tick26, 77 | #tick27, 78 | #tick28, 79 | #tick29, 80 | #tick30, 81 | #tick31, 82 | #tick32, 83 | #tick33, 84 | #tick34, 85 | #tick35, 86 | #tick36, 87 | #tick37, 88 | #tick38, 89 | #tick39, 90 | #tick40, 91 | #tick41, 92 | #tick42, 93 | #tick43, 94 | #tick44, 95 | #tick45, 96 | #tick46, 97 | #tick47, 98 | #tick48, 99 | #tick49, 100 | #tick50, 101 | #tick51, 102 | #tick52, 103 | #tick53, 104 | #tick54, 105 | #tick55, 106 | #tick56, 107 | #tick57, 108 | #tick58, 109 | #tick59, 110 | #tick60, 111 | #tick61, 112 | #tick62, 113 | #tick63, 114 | #tick64, 115 | #tick65, 116 | #tick66, 117 | #tick67, 118 | #tick68, 119 | #tick69, 120 | #tick70, 121 | #tick71, 122 | #tick72, 123 | #tick73, 124 | #tick74, 125 | #tick75, 126 | #tick76, 127 | #tick77, 128 | #tick78, 129 | #tick79, 130 | #tick80, 131 | #tick81, 132 | #tick82, 133 | #tick83, 134 | #tick84, 135 | #tick85, 136 | #tick86, 137 | #tick87, 138 | #tick88, 139 | #tick89, 140 | #tick90, 141 | #tick91, 142 | #tick92, 143 | #tick93, 144 | #tick94, 145 | #tick95, 146 | #tick96, 147 | #tick97, 148 | #tick98, 149 | #tick99 150 | { 151 | position: absolute; 152 | top: -9px; 153 | height: 20px; 154 | width: 5px; 155 | background-color: white; 156 | left: 147.5px; 157 | } 158 | 159 | #early{ 160 | position: absolute; 161 | top: -13px; 162 | left: 40px; 163 | font-size: 18px; 164 | font-weight: bold; 165 | 166 | color: #B3D7FF; 167 | transition: ease-out 500ms; 168 | } 169 | #late{ 170 | position: absolute; 171 | top: -13px; 172 | right: 40px; 173 | font-size: 18px; 174 | font-weight: bold; 175 | 176 | color: #FFB3B3; 177 | transition: ease-out 500ms; 178 | } 179 | -------------------------------------------------------------------------------- /mania_simple_hiterror_colorful/deps/reconnecting-websocket.min.js: -------------------------------------------------------------------------------- 1 | !function(a,b){"function"==typeof define&&define.amd?define([],b):"undefined"!=typeof module&&module.exports?module.exports=b():a.ReconnectingWebSocket=b()}(this,function(){function a(b,c,d){function l(a,b){var c=document.createEvent("CustomEvent");return c.initCustomEvent(a,!1,!1,b),c}var e={debug:!1,automaticOpen:!0,reconnectInterval:1e3,maxReconnectInterval:3e4,reconnectDecay:1.5,timeoutInterval:2e3};d||(d={});for(var f in e)this[f]="undefined"!=typeof d[f]?d[f]:e[f];this.url=b,this.reconnectAttempts=0,this.readyState=WebSocket.CONNECTING,this.protocol=null;var h,g=this,i=!1,j=!1,k=document.createElement("div");k.addEventListener("open",function(a){g.onopen(a)}),k.addEventListener("close",function(a){g.onclose(a)}),k.addEventListener("connecting",function(a){g.onconnecting(a)}),k.addEventListener("message",function(a){g.onmessage(a)}),k.addEventListener("error",function(a){g.onerror(a)}),this.addEventListener=k.addEventListener.bind(k),this.removeEventListener=k.removeEventListener.bind(k),this.dispatchEvent=k.dispatchEvent.bind(k),this.open=function(b){h=new WebSocket(g.url,c||[]),b||k.dispatchEvent(l("connecting")),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","attempt-connect",g.url);var d=h,e=setTimeout(function(){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","connection-timeout",g.url),j=!0,d.close(),j=!1},g.timeoutInterval);h.onopen=function(){clearTimeout(e),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onopen",g.url),g.protocol=h.protocol,g.readyState=WebSocket.OPEN,g.reconnectAttempts=0;var d=l("open");d.isReconnect=b,b=!1,k.dispatchEvent(d)},h.onclose=function(c){if(clearTimeout(e),h=null,i)g.readyState=WebSocket.CLOSED,k.dispatchEvent(l("close"));else{g.readyState=WebSocket.CONNECTING;var d=l("connecting");d.code=c.code,d.reason=c.reason,d.wasClean=c.wasClean,k.dispatchEvent(d),b||j||((g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onclose",g.url),k.dispatchEvent(l("close")));var e=g.reconnectInterval*Math.pow(g.reconnectDecay,g.reconnectAttempts);setTimeout(function(){g.reconnectAttempts++,g.open(!0)},e>g.maxReconnectInterval?g.maxReconnectInterval:e)}},h.onmessage=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onmessage",g.url,b.data);var c=l("message");c.data=b.data,k.dispatchEvent(c)},h.onerror=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onerror",g.url,b),k.dispatchEvent(l("error"))}},1==this.automaticOpen&&this.open(!1),this.send=function(b){if(h)return(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","send",g.url,b),h.send(b);throw"INVALID_STATE_ERR : Pausing to reconnect websocket"},this.close=function(a,b){"undefined"==typeof a&&(a=1e3),i=!0,h&&h.close(a,b)},this.refresh=function(){h&&h.close()}}return a.prototype.onopen=function(){},a.prototype.onclose=function(){},a.prototype.onconnecting=function(){},a.prototype.onmessage=function(){},a.prototype.onerror=function(){},a.debugAll=!1,a.CONNECTING=WebSocket.CONNECTING,a.OPEN=WebSocket.OPEN,a.CLOSING=WebSocket.CLOSING,a.CLOSED=WebSocket.CLOSED,a}); 2 | -------------------------------------------------------------------------------- /mania_simple_hiterror_colorful/deps/smooth.js: -------------------------------------------------------------------------------- 1 | function smooth(arr, windowSize, getter = (value) => value, setter) { 2 | const get = getter 3 | const result = [] 4 | 5 | for (let i = 0; i < arr.length; i += 1) { 6 | const leftOffeset = i - windowSize 7 | const from = leftOffeset >= 0 ? leftOffeset : 0 8 | const to = i + windowSize + 1 9 | 10 | let count = 0 11 | let sum = 0 12 | for (let j = from; j < to && j < arr.length; j += 1) { 13 | sum += get(arr[j]) 14 | count += 1 15 | } 16 | 17 | result[i] = setter ? setter(arr[i], sum / count) : sum / count 18 | } 19 | 20 | return result 21 | } 22 | 23 | exports = smooth -------------------------------------------------------------------------------- /mania_simple_hiterror_colorful/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 |
50 |
51 |
52 |
53 |
54 |
55 |
56 |
57 |
58 |
59 |
60 |
61 |
62 |
63 |
64 |
65 |
66 |
67 |
68 |
69 |
70 |
71 |
72 |
73 |
74 |
75 |
76 |
77 |
78 |
79 |
80 |
81 |
82 |
83 |
84 |
85 |
86 |
87 |
88 |
89 |
90 |
91 |
92 |
93 |
94 |
95 |
96 |
97 |
98 |
99 |
100 |
101 |
102 |
103 |
104 |
105 |
106 |
107 |
108 |
109 |
110 |
111 |
112 |
113 |
114 |
115 |
116 |
117 |
118 |
119 |
Early
Late
120 |
121 |
122 | 123 | 124 | 125 | -------------------------------------------------------------------------------- /mania_simple_leaderboard/css/style.css: -------------------------------------------------------------------------------- 1 | /* made by sky(@s2skky) */ 2 | 3 | @font-face { 4 | font-family: "TOMMY"; 5 | src: url("../fonts/MADETOMMY.otf"); 6 | } 7 | body, 8 | html { 9 | padding: 0; 10 | margin: 0; 11 | overflow-x: hidden; 12 | overflow-y: hidden; 13 | } 14 | #leaderboard_section{ 15 | position:absolute; 16 | left:0; 17 | top:290px; 18 | width:270px; 19 | height:510px; 20 | overflow: hidden; 21 | transition: ease-in-out 500ms; 22 | } 23 | #rank_container{ 24 | position: absolute; 25 | width:100%; 26 | height:100%; 27 | top:-4600px; 28 | transition: ease-in-out 300ms; 29 | } 30 | .rank_box{ 31 | position:absolute; 32 | width: 263px; 33 | height:88px; 34 | background-color:rgba(255,255,255,0.1); 35 | transition: ease-in-out 300ms; 36 | } 37 | .rank_box::before{ 38 | position: absolute; 39 | content: ""; 40 | top: 0; 41 | left: 0; 42 | width:100%; 43 | height:100%; 44 | background-image: url("../parts/background5.png"); 45 | background-size: cover; 46 | opacity: 0.4; 47 | } 48 | .rank_box_hide{ 49 | position:absolute; 50 | width: 263px; 51 | height:88px; 52 | background-color:rgba(255,255,255,0.1); 53 | transition: ease-in-out 300ms; 54 | } 55 | .rank_box_hide::before{ 56 | position: absolute; 57 | content: ""; 58 | top: 0; 59 | left: 0; 60 | width:100%; 61 | height:100%; 62 | background-image: url("../parts/background6.png"); 63 | background-size: cover; 64 | opacity: 0.4; 65 | } 66 | .rank_pic{ 67 | position: absolute; 68 | width:54px; 69 | height:54px; 70 | top:18px; 71 | left:8px; 72 | background-color: azure; 73 | background-size: cover; 74 | border-radius: 10px; 75 | } 76 | #rank_pic_opa{ 77 | position: absolute; 78 | width:54px; 79 | height:54px; 80 | top:18px; 81 | left:8px; 82 | background-color: #000; 83 | background-size: cover; 84 | border-radius: 10px; 85 | opacity:0.4; 86 | } 87 | .rank_id{ 88 | position: absolute; 89 | top:15px; 90 | left: 70px; 91 | width:170px; 92 | color: azure; 93 | font-family: TOMMY; 94 | font-size: 18pt; 95 | font-weight: 130; 96 | overflow: hidden; 97 | text-overflow: ellipsis; 98 | white-space: nowrap; 99 | } 100 | .rank_id_hide{ 101 | position: absolute; 102 | top:14px; 103 | left: 70px; 104 | width:170px; 105 | color: azure; 106 | font-family: TOMMY; 107 | font-size: 18pt; 108 | font-weight: bold; 109 | overflow: hidden; 110 | text-overflow: ellipsis; 111 | white-space: nowrap; 112 | } 113 | .rank_score{ 114 | position: absolute; 115 | top:47px; 116 | left: 70px; 117 | color: azure; 118 | font-family: TOMMY; 119 | font-size: 15pt; 120 | font-weight: bold; 121 | } 122 | .rank_score_hide{ 123 | position: absolute; 124 | top:47px; 125 | left: 70px; 126 | color: azure; 127 | font-family: TOMMY; 128 | font-size: 15pt; 129 | font-weight: bold; 130 | } 131 | .rank_percent{ 132 | position: absolute; 133 | top:47px; 134 | right: 8px; 135 | color: #93F0F4; 136 | font-family: TOMMY; 137 | font-size: 15pt; 138 | font-weight: bold; 139 | } 140 | .rank{ 141 | position: absolute; 142 | top:6px; 143 | right: 8px; 144 | color: azure; 145 | font-family: TOMMY; 146 | font-size: 26pt; 147 | font-weight: 130; 148 | opacity: 0.3; 149 | } 150 | .rank_hide{ 151 | position: absolute; 152 | top:22px; 153 | left: 2px; 154 | width:65px; 155 | color: azure; 156 | font-family: TOMMY; 157 | font-size: 23pt; 158 | font-weight: 120; 159 | letter-spacing: -1px; 160 | opacity: 0.3; 161 | text-align: center; 162 | } 163 | .rank_box_opa{ 164 | opacity = 0.3; 165 | } -------------------------------------------------------------------------------- /mania_simple_leaderboard/deps/main.css: -------------------------------------------------------------------------------- 1 | @import url("https://fonts.googleapis.com/css2?family=Roboto:wght@500&display=swap"); 2 | 3 | * { 4 | padding: 0; 5 | margin: 0; 6 | box-sizing: border-box; 7 | } 8 | 9 | body { 10 | font-family: "Roboto", sans-serif; 11 | color: white; 12 | font-size: 40px; 13 | background-color: white; 14 | } -------------------------------------------------------------------------------- /mania_simple_leaderboard/deps/reconnecting-websocket.min.js: -------------------------------------------------------------------------------- 1 | !function(a,b){"function"==typeof define&&define.amd?define([],b):"undefined"!=typeof module&&module.exports?module.exports=b():a.ReconnectingWebSocket=b()}(this,function(){function a(b,c,d){function l(a,b){var c=document.createEvent("CustomEvent");return c.initCustomEvent(a,!1,!1,b),c}var e={debug:!1,automaticOpen:!0,reconnectInterval:1e3,maxReconnectInterval:3e4,reconnectDecay:1.5,timeoutInterval:2e3};d||(d={});for(var f in e)this[f]="undefined"!=typeof d[f]?d[f]:e[f];this.url=b,this.reconnectAttempts=0,this.readyState=WebSocket.CONNECTING,this.protocol=null;var h,g=this,i=!1,j=!1,k=document.createElement("div");k.addEventListener("open",function(a){g.onopen(a)}),k.addEventListener("close",function(a){g.onclose(a)}),k.addEventListener("connecting",function(a){g.onconnecting(a)}),k.addEventListener("message",function(a){g.onmessage(a)}),k.addEventListener("error",function(a){g.onerror(a)}),this.addEventListener=k.addEventListener.bind(k),this.removeEventListener=k.removeEventListener.bind(k),this.dispatchEvent=k.dispatchEvent.bind(k),this.open=function(b){h=new WebSocket(g.url,c||[]),b||k.dispatchEvent(l("connecting")),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","attempt-connect",g.url);var d=h,e=setTimeout(function(){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","connection-timeout",g.url),j=!0,d.close(),j=!1},g.timeoutInterval);h.onopen=function(){clearTimeout(e),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onopen",g.url),g.protocol=h.protocol,g.readyState=WebSocket.OPEN,g.reconnectAttempts=0;var d=l("open");d.isReconnect=b,b=!1,k.dispatchEvent(d)},h.onclose=function(c){if(clearTimeout(e),h=null,i)g.readyState=WebSocket.CLOSED,k.dispatchEvent(l("close"));else{g.readyState=WebSocket.CONNECTING;var d=l("connecting");d.code=c.code,d.reason=c.reason,d.wasClean=c.wasClean,k.dispatchEvent(d),b||j||((g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onclose",g.url),k.dispatchEvent(l("close")));var e=g.reconnectInterval*Math.pow(g.reconnectDecay,g.reconnectAttempts);setTimeout(function(){g.reconnectAttempts++,g.open(!0)},e>g.maxReconnectInterval?g.maxReconnectInterval:e)}},h.onmessage=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onmessage",g.url,b.data);var c=l("message");c.data=b.data,k.dispatchEvent(c)},h.onerror=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onerror",g.url,b),k.dispatchEvent(l("error"))}},1==this.automaticOpen&&this.open(!1),this.send=function(b){if(h)return(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","send",g.url,b),h.send(b);throw"INVALID_STATE_ERR : Pausing to reconnect websocket"},this.close=function(a,b){"undefined"==typeof a&&(a=1e3),i=!0,h&&h.close(a,b)},this.refresh=function(){h&&h.close()}}return a.prototype.onopen=function(){},a.prototype.onclose=function(){},a.prototype.onconnecting=function(){},a.prototype.onmessage=function(){},a.prototype.onerror=function(){},a.debugAll=!1,a.CONNECTING=WebSocket.CONNECTING,a.OPEN=WebSocket.OPEN,a.CLOSING=WebSocket.CLOSING,a.CLOSED=WebSocket.CLOSED,a}); 2 | -------------------------------------------------------------------------------- /mania_simple_leaderboard/fonts/GOTHICB.TTF: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_leaderboard/fonts/GOTHICB.TTF -------------------------------------------------------------------------------- /mania_simple_leaderboard/fonts/MADETOMMY.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_leaderboard/fonts/MADETOMMY.otf -------------------------------------------------------------------------------- /mania_simple_leaderboard/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | yep 1 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 |
17 |
18 |
19 |
20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /mania_simple_leaderboard/parts/background4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_leaderboard/parts/background4.png -------------------------------------------------------------------------------- /mania_simple_leaderboard/parts/background5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_leaderboard/parts/background5.png -------------------------------------------------------------------------------- /mania_simple_leaderboard/parts/background6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_leaderboard/parts/background6.png -------------------------------------------------------------------------------- /mania_simple_leaderboard/setting/setting.exe: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_leaderboard/setting/setting.exe -------------------------------------------------------------------------------- /mania_simple_leaderboard/setting/setting.json: -------------------------------------------------------------------------------- 1 | { 2 | "api" : "", 3 | "background" : "white", 4 | "opacity" : "100%", 5 | "profile" : "hide", 6 | "sub" : "acc", 7 | "uid" : "" 8 | } -------------------------------------------------------------------------------- /mania_simple_leaderboard_qhd/css/style.css: -------------------------------------------------------------------------------- 1 | /* made by sky(@s2skky) */ 2 | 3 | @font-face { 4 | font-family: "TOMMY"; 5 | src: url("../fonts/MADETOMMY.otf"); 6 | } 7 | body, 8 | html { 9 | padding: 0; 10 | margin: 0; 11 | overflow-x: hidden; 12 | overflow-y: hidden; 13 | } 14 | #leaderboard_section{ 15 | position:absolute; 16 | left:0; 17 | top:387px; 18 | width:360px; 19 | height:680px; 20 | overflow: hidden; 21 | transition: ease-in-out 500ms; 22 | } 23 | #rank_container{ 24 | position: absolute; 25 | width:100%; 26 | height:100%; 27 | top:-6900px; 28 | transition: ease-in-out 300ms; 29 | } 30 | .rank_box{ 31 | position:absolute; 32 | width: 352px; 33 | height:118px; 34 | background-color:rgba(255,255,255,0.1); 35 | transition: ease-in-out 300ms; 36 | } 37 | .rank_box::before{ 38 | position: absolute; 39 | content: ""; 40 | top: 0; 41 | left: 0; 42 | width:100%; 43 | height:100%; 44 | background-image: url("../parts/background5.png"); 45 | background-size: cover; 46 | opacity: 0.4; 47 | } 48 | .rank_box_hide{ 49 | position:absolute; 50 | width: 352px; 51 | height:118px; 52 | background-color:rgba(255,255,255,0.1); 53 | transition: ease-in-out 300ms; 54 | } 55 | .rank_box_hide::before{ 56 | position: absolute; 57 | content: ""; 58 | top: 0; 59 | left: 0; 60 | width:100%; 61 | height:100%; 62 | background-image: url("../parts/background6.png"); 63 | background-size: cover; 64 | opacity: 0.4; 65 | } 66 | .rank_pic{ 67 | position: absolute; 68 | width:72px; 69 | height:72px; 70 | top:24px; 71 | left:12px; 72 | background-color: azure; 73 | background-size: cover; 74 | border-radius: 10px; 75 | } 76 | #rank_pic_opa{ 77 | position: absolute; 78 | width:72px; 79 | height:72px; 80 | top:24px; 81 | left:12px; 82 | background-color: #000; 83 | background-size: cover; 84 | border-radius: 10px; 85 | opacity:0.4; 86 | } 87 | .rank_id{ 88 | position: absolute; 89 | top:20px; 90 | left: 94px; 91 | width:227px; 92 | color: azure; 93 | font-family: TOMMY; 94 | font-size: 24pt; 95 | font-weight: 130; 96 | overflow: hidden; 97 | text-overflow: ellipsis; 98 | white-space: nowrap; 99 | } 100 | .rank_id_hide{ 101 | position: absolute; 102 | top:20px; 103 | left: 94px; 104 | width:227px; 105 | color: azure; 106 | font-family: TOMMY; 107 | font-size: 24pt; 108 | font-weight: bold; 109 | overflow: hidden; 110 | text-overflow: ellipsis; 111 | white-space: nowrap; 112 | } 113 | .rank_score{ 114 | position: absolute; 115 | top:63px; 116 | left: 94px; 117 | color: azure; 118 | font-family: TOMMY; 119 | font-size: 20pt; 120 | font-weight: bold; 121 | } 122 | .rank_score_hide{ 123 | position: absolute; 124 | top:63px; 125 | left: 94px; 126 | color: azure; 127 | font-family: TOMMY; 128 | font-size: 20pt; 129 | font-weight: bold; 130 | } 131 | .rank_percent{ 132 | position: absolute; 133 | top:63px; 134 | right: 11px; 135 | color: #93F0F4; 136 | font-family: TOMMY; 137 | font-size: 20pt; 138 | font-weight: bold; 139 | } 140 | .rank{ 141 | position: absolute; 142 | top:8px; 143 | right: 11px; 144 | color: azure; 145 | font-family: TOMMY; 146 | font-size: 36pt; 147 | font-weight: 130; 148 | opacity: 0.3; 149 | } 150 | .rank_hide{ 151 | position: absolute; 152 | top:30px; 153 | left: 4px; 154 | width:87px; 155 | color: azure; 156 | font-family: TOMMY; 157 | font-size: 30pt; 158 | font-weight: 120; 159 | letter-spacing: -1px; 160 | opacity: 0.3; 161 | text-align: center; 162 | } 163 | .rank_box_opa{ 164 | opacity = 0.3; 165 | } -------------------------------------------------------------------------------- /mania_simple_leaderboard_qhd/deps/main.css: -------------------------------------------------------------------------------- 1 | @import url("https://fonts.googleapis.com/css2?family=Roboto:wght@500&display=swap"); 2 | 3 | * { 4 | padding: 0; 5 | margin: 0; 6 | box-sizing: border-box; 7 | } 8 | 9 | body { 10 | font-family: "Roboto", sans-serif; 11 | color: white; 12 | font-size: 40px; 13 | background-color: white; 14 | } -------------------------------------------------------------------------------- /mania_simple_leaderboard_qhd/deps/reconnecting-websocket.min.js: -------------------------------------------------------------------------------- 1 | !function(a,b){"function"==typeof define&&define.amd?define([],b):"undefined"!=typeof module&&module.exports?module.exports=b():a.ReconnectingWebSocket=b()}(this,function(){function a(b,c,d){function l(a,b){var c=document.createEvent("CustomEvent");return c.initCustomEvent(a,!1,!1,b),c}var e={debug:!1,automaticOpen:!0,reconnectInterval:1e3,maxReconnectInterval:3e4,reconnectDecay:1.5,timeoutInterval:2e3};d||(d={});for(var f in e)this[f]="undefined"!=typeof d[f]?d[f]:e[f];this.url=b,this.reconnectAttempts=0,this.readyState=WebSocket.CONNECTING,this.protocol=null;var h,g=this,i=!1,j=!1,k=document.createElement("div");k.addEventListener("open",function(a){g.onopen(a)}),k.addEventListener("close",function(a){g.onclose(a)}),k.addEventListener("connecting",function(a){g.onconnecting(a)}),k.addEventListener("message",function(a){g.onmessage(a)}),k.addEventListener("error",function(a){g.onerror(a)}),this.addEventListener=k.addEventListener.bind(k),this.removeEventListener=k.removeEventListener.bind(k),this.dispatchEvent=k.dispatchEvent.bind(k),this.open=function(b){h=new WebSocket(g.url,c||[]),b||k.dispatchEvent(l("connecting")),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","attempt-connect",g.url);var d=h,e=setTimeout(function(){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","connection-timeout",g.url),j=!0,d.close(),j=!1},g.timeoutInterval);h.onopen=function(){clearTimeout(e),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onopen",g.url),g.protocol=h.protocol,g.readyState=WebSocket.OPEN,g.reconnectAttempts=0;var d=l("open");d.isReconnect=b,b=!1,k.dispatchEvent(d)},h.onclose=function(c){if(clearTimeout(e),h=null,i)g.readyState=WebSocket.CLOSED,k.dispatchEvent(l("close"));else{g.readyState=WebSocket.CONNECTING;var d=l("connecting");d.code=c.code,d.reason=c.reason,d.wasClean=c.wasClean,k.dispatchEvent(d),b||j||((g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onclose",g.url),k.dispatchEvent(l("close")));var e=g.reconnectInterval*Math.pow(g.reconnectDecay,g.reconnectAttempts);setTimeout(function(){g.reconnectAttempts++,g.open(!0)},e>g.maxReconnectInterval?g.maxReconnectInterval:e)}},h.onmessage=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onmessage",g.url,b.data);var c=l("message");c.data=b.data,k.dispatchEvent(c)},h.onerror=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onerror",g.url,b),k.dispatchEvent(l("error"))}},1==this.automaticOpen&&this.open(!1),this.send=function(b){if(h)return(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","send",g.url,b),h.send(b);throw"INVALID_STATE_ERR : Pausing to reconnect websocket"},this.close=function(a,b){"undefined"==typeof a&&(a=1e3),i=!0,h&&h.close(a,b)},this.refresh=function(){h&&h.close()}}return a.prototype.onopen=function(){},a.prototype.onclose=function(){},a.prototype.onconnecting=function(){},a.prototype.onmessage=function(){},a.prototype.onerror=function(){},a.debugAll=!1,a.CONNECTING=WebSocket.CONNECTING,a.OPEN=WebSocket.OPEN,a.CLOSING=WebSocket.CLOSING,a.CLOSED=WebSocket.CLOSED,a}); 2 | -------------------------------------------------------------------------------- /mania_simple_leaderboard_qhd/fonts/GOTHICB.TTF: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_leaderboard_qhd/fonts/GOTHICB.TTF -------------------------------------------------------------------------------- /mania_simple_leaderboard_qhd/fonts/MADETOMMY.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_leaderboard_qhd/fonts/MADETOMMY.otf -------------------------------------------------------------------------------- /mania_simple_leaderboard_qhd/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | yep 1 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 |
17 |
18 |
19 |
20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /mania_simple_leaderboard_qhd/parts/background4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_leaderboard_qhd/parts/background4.png -------------------------------------------------------------------------------- /mania_simple_leaderboard_qhd/parts/background5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_leaderboard_qhd/parts/background5.png -------------------------------------------------------------------------------- /mania_simple_leaderboard_qhd/parts/background6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_leaderboard_qhd/parts/background6.png -------------------------------------------------------------------------------- /mania_simple_leaderboard_qhd/setting/setting.exe: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_leaderboard_qhd/setting/setting.exe -------------------------------------------------------------------------------- /mania_simple_leaderboard_qhd/setting/setting.json: -------------------------------------------------------------------------------- 1 | { 2 | "api" : "", 3 | "background" : "white", 4 | "opacity" : "100%", 5 | "profile" : "hide", 6 | "sub" : "acc", 7 | "uid" : "" 8 | } -------------------------------------------------------------------------------- /mania_simple_overlay/css/odometr.css: -------------------------------------------------------------------------------- 1 | .odometer.odometer-auto-theme, 2 | .odometer.odometer-theme-default { 3 | display: inline-block; 4 | vertical-align: middle; 5 | *vertical-align: auto; 6 | *zoom: 1; 7 | *display: inline; 8 | position: relative; 9 | } 10 | 11 | .odometer.odometer-auto-theme .odometer-digit, 12 | .odometer.odometer-theme-default .odometer-digit { 13 | display: inline-block; 14 | vertical-align: middle; 15 | *vertical-align: auto; 16 | *zoom: 1; 17 | *display: inline; 18 | position: relative; 19 | } 20 | 21 | .odometer.odometer-auto-theme .odometer-digit .odometer-digit-spacer, 22 | .odometer.odometer-theme-default .odometer-digit .odometer-digit-spacer { 23 | display: inline-block; 24 | vertical-align: middle; 25 | *vertical-align: auto; 26 | *zoom: 1; 27 | *display: inline; 28 | visibility: hidden; 29 | } 30 | 31 | .odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner, 32 | .odometer.odometer-theme-default .odometer-digit .odometer-digit-inner { 33 | text-align: left; 34 | display: block; 35 | position: absolute; 36 | top: 0; 37 | left: 0; 38 | right: 0; 39 | bottom: 0; 40 | overflow: hidden; 41 | } 42 | 43 | .odometer.odometer-auto-theme .odometer-digit .odometer-ribbon, 44 | .odometer.odometer-theme-default .odometer-digit .odometer-ribbon { 45 | display: block; 46 | } 47 | 48 | .odometer.odometer-auto-theme .odometer-digit .odometer-ribbon-inner, 49 | .odometer.odometer-theme-default .odometer-digit .odometer-ribbon-inner { 50 | display: block; 51 | -webkit-backface-visibility: hidden; 52 | } 53 | 54 | .odometer.odometer-auto-theme .odometer-digit .odometer-value, 55 | .odometer.odometer-theme-default .odometer-digit .odometer-value { 56 | display: block; 57 | -webkit-transform: translateZ(0); 58 | } 59 | 60 | .odometer.odometer-auto-theme .odometer-digit .odometer-value.odometer-last-value, 61 | .odometer.odometer-theme-default .odometer-digit .odometer-value.odometer-last-value { 62 | position: absolute; 63 | } 64 | 65 | .odometer.odometer-auto-theme.odometer-animating-up .odometer-ribbon-inner, 66 | .odometer.odometer-theme-default.odometer-animating-up .odometer-ribbon-inner { 67 | -webkit-transition: -webkit-transform 300ms; 68 | -moz-transition: -moz-transform 300ms; 69 | -ms-transition: -ms-transform 300ms; 70 | -o-transition: -o-transform 300ms; 71 | transition: transform 300ms; 72 | } 73 | 74 | .odometer.odometer-auto-theme.odometer-animating-up.odometer-animating .odometer-ribbon-inner, 75 | .odometer.odometer-theme-default.odometer-animating-up.odometer-animating .odometer-ribbon-inner { 76 | -webkit-transform: translateY(-100%); 77 | -moz-transform: translateY(-100%); 78 | -ms-transform: translateY(-100%); 79 | -o-transform: translateY(-100%); 80 | transform: translateY(-100%); 81 | } 82 | 83 | .odometer.odometer-auto-theme.odometer-animating-down .odometer-ribbon-inner, 84 | .odometer.odometer-theme-default.odometer-animating-down .odometer-ribbon-inner { 85 | -webkit-transform: translateY(-100%); 86 | -moz-transform: translateY(-100%); 87 | -ms-transform: translateY(-100%); 88 | -o-transform: translateY(-100%); 89 | transform: translateY(-100%); 90 | } 91 | 92 | .odometer.odometer-auto-theme.odometer-animating-down.odometer-animating .odometer-ribbon-inner, 93 | .odometer.odometer-theme-default.odometer-animating-down.odometer-animating .odometer-ribbon-inner { 94 | -webkit-transition: -webkit-transform 300ms; 95 | -moz-transition: -moz-transform 300ms; 96 | -ms-transition: -ms-transform 300ms; 97 | -o-transition: -o-transform 300ms; 98 | transition: transform 300ms; 99 | -webkit-transform: translateY(0); 100 | -moz-transform: translateY(0); 101 | -ms-transform: translateY(0); 102 | -o-transform: translateY(0); 103 | transform: translateY(0); 104 | } 105 | 106 | .odometer.odometer-auto-theme, 107 | .odometer.odometer-theme-default { 108 | font-family: "Helvetica Neue", sans-serif; 109 | line-height: 1.1em; 110 | } 111 | 112 | .odometer.odometer-auto-theme .odometer-value, 113 | .odometer.odometer-theme-default .odometer-value { 114 | text-align: center; 115 | } 116 | 117 | .odometer.pp .odometer-inside:after { 118 | content: "pp" 119 | } 120 | 121 | .odometer.combo .odometer-inside:after { 122 | content: "x" 123 | } 124 | 125 | .odometer.URIndex .odometer-inside:after { 126 | content: "UR" 127 | } -------------------------------------------------------------------------------- /mania_simple_overlay/css/style.css: -------------------------------------------------------------------------------- 1 | /* made by sky(@s2skky) */ 2 | 3 | @font-face { 4 | font-family: "TOMMY"; 5 | src: url("../fonts/MADETOMMY.otf"); 6 | } 7 | .odometer.odometer-auto-theme { 8 | font-family: "GothicB", Helvetica, sans-serif !important; 9 | font-weight: 900px !important; 10 | } 11 | 12 | body, 13 | html { 14 | padding: 0; 15 | margin: 0; 16 | overflow-x: hidden; 17 | overflow-y: hidden; 18 | } 19 | .trans{ 20 | transition: color 1s ease; 21 | } 22 | 23 | #info_section{ 24 | position:absolute; 25 | left : 10px; 26 | top : 10px; 27 | width:500px; 28 | height:220px; 29 | background-color: rgba( 255, 255, 255, 0.1 ); 30 | border-radius: 30px; 31 | transition: ease-in-out 500ms; 32 | opacity: 0; 33 | } 34 | #left_box{ 35 | position:absolute; 36 | left:35px; 37 | top:20px; 38 | width:230px; 39 | height:33px; 40 | background-color: orange; 41 | border-radius:40px; 42 | } 43 | #l_text, 44 | #r_text{ 45 | position: absolute; 46 | top:6px; 47 | left:17px; 48 | font-family: TOMMY; 49 | font-weight:bold; 50 | font-size:13pt; 51 | } 52 | #l_number{ 53 | width:auto; 54 | background-color: rgba( 0, 0, 0, 0.6 ); 55 | font-family: TOMMY; 56 | font-weight: 120; 57 | font-size:15pt; 58 | color:white; 59 | border-radius: 30px; 60 | float:right; 61 | padding-left:11px; 62 | padding-right:9px; 63 | margin-top:4px; 64 | margin-right:4px; 65 | letter-spacing:1px; 66 | } 67 | #right_box{ 68 | position:absolute; 69 | right:35px; 70 | top:20px; 71 | width:170px; 72 | height:33px; 73 | background-color: deepskyblue; 74 | border-radius:40px; 75 | } 76 | #r_number{ 77 | width:auto; 78 | background-color: rgba( 0, 0, 0, 0.6 ); 79 | font-family: TOMMY; 80 | font-weight: 120; 81 | font-size:15pt; 82 | color:white; 83 | border-radius: 30px; 84 | float:right; 85 | padding-left:12px; 86 | padding-right:10px; 87 | margin-top:4px; 88 | margin-right:4px; 89 | letter-spacing:1px; 90 | } 91 | #center_line{ 92 | position:absolute; 93 | left:30px; 94 | top:133px; 95 | width:440px; 96 | height:4px; 97 | background-color:#898989; 98 | } 99 | #title_mask{ 100 | position:absolute; 101 | left:30px; 102 | top:64px; 103 | width:440px; 104 | height:100%; 105 | overflow: hidden; 106 | } 107 | .over{ 108 | transform: translate(440px); 109 | animation: slide 10s linear infinite; 110 | } 111 | @keyframes slide { 112 | 0% {transform: translate(0px);} 113 | 10% {transform: translate(0px);} 114 | 90% { transform: translate(calc(-100% + 440px)); } 115 | 100% { transform: translate(calc(-100% + 440px)); } 116 | } 117 | #title{ 118 | font-family: TOMMY; 119 | font-weight: 120; 120 | font-size:17pt; 121 | color:white; 122 | white-space: nowrap; 123 | overflow: hidden; 124 | text-align: center; 125 | } 126 | #subtitle_mask{ 127 | position:absolute; 128 | left:30px; 129 | top:96px; 130 | width:440px; 131 | height:100%; 132 | overflow: hidden; 133 | } 134 | #subtitle{ 135 | font-family: TOMMY; 136 | font-weight: 120; 137 | font-size:14pt; 138 | color:white; 139 | white-space: nowrap; 140 | overflow: hidden; 141 | text-align: center; 142 | } 143 | #bottom_section{ 144 | position:absolute; 145 | left:30px; 146 | top:145px; 147 | width:444px; 148 | height:56px; 149 | } 150 | #h320_text, 151 | #h300_text, 152 | #h200_text, 153 | #h100_text, 154 | #h50_text, 155 | #h0_text{ 156 | position:absolute; 157 | top:3px; 158 | font-family: TOMMY; 159 | font-weight: bold; 160 | font-size:12pt; 161 | color:#898989; 162 | width:74px; 163 | text-align: center; 164 | } 165 | #h320_text{ 166 | left:0px; 167 | } 168 | #h300_text{ 169 | left:74px; 170 | } 171 | #h200_text{ 172 | left:148px; 173 | } 174 | #h100_text{ 175 | left:222px; 176 | } 177 | #h50_text{ 178 | left:296px; 179 | } 180 | #h0_text{ 181 | left:370px; 182 | } 183 | #h320_shadow, 184 | #h300_shadow, 185 | #h200_shadow, 186 | #h100_shadow, 187 | #h50_shadow, 188 | #h0_shadow{ 189 | position:absolute; 190 | top:3px; 191 | font-family: TOMMY; 192 | font-weight: bold; 193 | font-size:12pt; 194 | width:74px; 195 | text-align: center; 196 | opacity :0; 197 | } 198 | #h320_shadow{ 199 | left:0px; 200 | color:azure; 201 | } 202 | #h300_shadow{ 203 | left:74px; 204 | color:orange; 205 | } 206 | #h200_shadow{ 207 | left:148px; 208 | color:forestgreen; 209 | } 210 | #h100_shadow{ 211 | left:222px; 212 | color:dodgerblue; 213 | } 214 | #h50_shadow{ 215 | left:296px; 216 | color:hotpink; 217 | } 218 | #h0_shadow{ 219 | left:370px; 220 | color:crimson; 221 | } 222 | #h320, 223 | #h300, 224 | #h200, 225 | #h100, 226 | #h50, 227 | #h0{ 228 | position:absolute; 229 | top:28px; 230 | font-family: TOMMY; 231 | font-weight: bold; 232 | font-size:18pt; 233 | color:white; 234 | text-align: center; 235 | width:74px; 236 | } 237 | #h320{ 238 | left:0px; 239 | } 240 | #h300{ 241 | left:74px; 242 | } 243 | #h200{ 244 | left:148px; 245 | } 246 | #h100{ 247 | left:222px; 248 | } 249 | #h50{ 250 | left:296px; 251 | } 252 | #h0{ 253 | left:370px; 254 | } 255 | #ur_text{ 256 | position:absolute; 257 | left:5px; 258 | top:140px; 259 | text-align: center; 260 | font-family: TOMMY; 261 | font-weight: bold; 262 | font-size:12pt; 263 | color:#898989; 264 | display:none; 265 | } 266 | #ur{ 267 | position:absolute; 268 | left:128px; 269 | top:136px; 270 | width:80px; 271 | font-family: TOMMY; 272 | font-weight: bold; 273 | font-size:18pt; 274 | color:white; 275 | text-align: right; 276 | display:none; 277 | } 278 | #bottom_line{ 279 | position:absolute; 280 | left:20px; 281 | top:120px; 282 | width:220px; 283 | height:3px; 284 | background-color:#898989; 285 | display:none; 286 | } -------------------------------------------------------------------------------- /mania_simple_overlay/css/style_simple.css: -------------------------------------------------------------------------------- 1 | /* made by sky(@s2skky) */ 2 | 3 | @font-face { 4 | font-family: "TOMMY"; 5 | src: url("../fonts/MADETOMMY.otf"); 6 | } 7 | .odometer.odometer-auto-theme { 8 | font-family: "GothicB", Helvetica, sans-serif !important; 9 | font-weight: 900px !important; 10 | } 11 | 12 | body, 13 | html { 14 | padding: 0; 15 | margin: 0; 16 | overflow-x: hidden; 17 | overflow-y: hidden; 18 | } 19 | .trans{ 20 | transition: color 1s ease; 21 | } 22 | 23 | #info_section{ 24 | position:absolute; 25 | left : 10px; 26 | top : 10px; 27 | width:260px; 28 | height:260px; 29 | background-color: rgba( 255, 255, 255, 0.1 ); 30 | border-radius: 30px; 31 | transition: ease-in-out 500ms; 32 | } 33 | #left_box{ 34 | position:absolute; 35 | left:35px; 36 | top:20px; 37 | width:230px; 38 | height:33px; 39 | background-color: #FCE800; 40 | border-radius:40px; 41 | display: none; 42 | } 43 | #l_text, 44 | #r_text{ 45 | position: absolute; 46 | top:6px; 47 | left:17px; 48 | font-family: TOMMY; 49 | font-weight:bold; 50 | font-size:13pt; 51 | } 52 | #l_number{ 53 | width:auto; 54 | background-color: rgba( 0, 0, 0, 0.6 ); 55 | font-family: TOMMY; 56 | font-weight: 120; 57 | font-size:15pt; 58 | color:white; 59 | border-radius: 30px; 60 | float:right; 61 | padding-left:11px; 62 | padding-right:9px; 63 | margin-top:4px; 64 | margin-right:4px; 65 | letter-spacing:1px; 66 | } 67 | #right_box{ 68 | position:absolute; 69 | right:35px; 70 | top:20px; 71 | width:170px; 72 | height:33px; 73 | background-color: #0FD0E2; 74 | border-radius:40px; 75 | display: none; 76 | } 77 | #r_number{ 78 | width:auto; 79 | background-color: rgba( 0, 0, 0, 0.6 ); 80 | font-family: TOMMY; 81 | font-weight: 120; 82 | font-size:15pt; 83 | color:white; 84 | border-radius: 30px; 85 | float:right; 86 | padding-left:12px; 87 | padding-right:10px; 88 | margin-top:4px; 89 | margin-right:4px; 90 | letter-spacing:1px; 91 | } 92 | #center_line{ 93 | position:absolute; 94 | left:20px; 95 | top:58px; 96 | width:220px; 97 | height:3px; 98 | background-color:#898989; 99 | } 100 | #title_mask{ 101 | position:absolute; 102 | left:30px; 103 | top:16px; 104 | width:200px; 105 | height:100%; 106 | overflow: hidden; 107 | } 108 | .over{ 109 | transform: translate(200px); 110 | animation: slide 10s linear infinite; 111 | } 112 | @keyframes slide { 113 | 0% {transform: translate(0px);} 114 | 10% {transform: translate(0px);} 115 | 90% { transform: translate(calc(-100% + 200px)); } 116 | 100% { transform: translate(calc(-100% + 200px)); } 117 | } 118 | #title{ 119 | font-family: TOMMY; 120 | font-weight: 110; 121 | font-size:17pt; 122 | color:white; 123 | white-space: nowrap; 124 | overflow: hidden; 125 | text-align: center; 126 | } 127 | #subtitle_mask{ 128 | position:absolute; 129 | left:30px; 130 | top:96px; 131 | width:440px; 132 | height:100%; 133 | overflow: hidden; 134 | display: none; 135 | } 136 | #subtitle{ 137 | font-family: TOMMY; 138 | font-weight: 120; 139 | font-size:14pt; 140 | color:white; 141 | white-space: nowrap; 142 | overflow: hidden; 143 | text-align: center; 144 | display: none; 145 | } 146 | #bottom_section{ 147 | position:absolute; 148 | left:22px; 149 | top:72px; 150 | width:444px; 151 | height:56px; 152 | } 153 | #h320_text, 154 | #h300_text, 155 | #h200_text, 156 | #h100_text, 157 | #h50_text, 158 | #h0_text{ 159 | position:absolute; 160 | top:3px; 161 | font-family: TOMMY; 162 | font-weight: bold; 163 | font-size:11pt; 164 | color:#898989; 165 | width:74px; 166 | text-align: center; 167 | } 168 | #h320_text{ 169 | left:0px; 170 | } 171 | #h300_text{ 172 | left:72px; 173 | } 174 | #h200_text{ 175 | left:144px; 176 | } 177 | #h100_text{ 178 | top:67px; 179 | left:0px; 180 | } 181 | #h50_text{ 182 | top:67px; 183 | left:72px; 184 | } 185 | #h0_text{ 186 | top:67px; 187 | left:144px; 188 | } 189 | #h320_shadow, 190 | #h300_shadow, 191 | #h200_shadow, 192 | #h100_shadow, 193 | #h50_shadow, 194 | #h0_shadow{ 195 | position:absolute; 196 | top:3px; 197 | font-family: TOMMY; 198 | font-weight: bold; 199 | font-size:11pt; 200 | width:74px; 201 | text-align: center; 202 | opacity :0; 203 | } 204 | #h320_shadow{ 205 | left:0px; 206 | color:azure; 207 | } 208 | #h300_shadow{ 209 | left:72px; 210 | color:orange; 211 | } 212 | #h200_shadow{ 213 | left:144px; 214 | color:forestgreen; 215 | } 216 | #h100_shadow{ 217 | top:67px; 218 | left:0px; 219 | color:dodgerblue; 220 | } 221 | #h50_shadow{ 222 | top:67px; 223 | left:72px; 224 | color:hotpink; 225 | } 226 | #h0_shadow{ 227 | top:67px; 228 | left:144px; 229 | color:crimson; 230 | } 231 | #h320, 232 | #h300, 233 | #h200, 234 | #h100, 235 | #h50, 236 | #h0{ 237 | position:absolute; 238 | top:28px; 239 | font-family: TOMMY; 240 | font-weight: bold; 241 | font-size:17pt; 242 | color:white; 243 | text-align: center; 244 | width:74px; 245 | } 246 | #h320{ 247 | left:0px; 248 | } 249 | #h300{ 250 | left:72px; 251 | } 252 | #h200{ 253 | left:144px; 254 | } 255 | #h100{ 256 | top:92px; 257 | left:0px; 258 | } 259 | #h50{ 260 | top:92px; 261 | left:72px; 262 | } 263 | #h0{ 264 | top:92px; 265 | left:144px; 266 | } 267 | #ur_text{ 268 | position:absolute; 269 | left:5px; 270 | top:147px; 271 | text-align: center; 272 | font-family: TOMMY; 273 | font-weight: bold; 274 | font-size:12pt; 275 | color:#898989; 276 | } 277 | #ur{ 278 | position:absolute; 279 | left:128px; 280 | top:142px; 281 | width:80px; 282 | font-family: TOMMY; 283 | font-weight: bold; 284 | font-size:17pt; 285 | color:white; 286 | text-align: right; 287 | } 288 | #bottom_line{ 289 | position:absolute; 290 | left:20px; 291 | top:202px; 292 | width:220px; 293 | height:3px; 294 | background-color:#898989; 295 | } -------------------------------------------------------------------------------- /mania_simple_overlay/deps/reconnecting-websocket.min.js: -------------------------------------------------------------------------------- 1 | !function(a,b){"function"==typeof define&&define.amd?define([],b):"undefined"!=typeof module&&module.exports?module.exports=b():a.ReconnectingWebSocket=b()}(this,function(){function a(b,c,d){function l(a,b){var c=document.createEvent("CustomEvent");return c.initCustomEvent(a,!1,!1,b),c}var e={debug:!1,automaticOpen:!0,reconnectInterval:1e3,maxReconnectInterval:3e4,reconnectDecay:1.5,timeoutInterval:2e3};d||(d={});for(var f in e)this[f]="undefined"!=typeof d[f]?d[f]:e[f];this.url=b,this.reconnectAttempts=0,this.readyState=WebSocket.CONNECTING,this.protocol=null;var h,g=this,i=!1,j=!1,k=document.createElement("div");k.addEventListener("open",function(a){g.onopen(a)}),k.addEventListener("close",function(a){g.onclose(a)}),k.addEventListener("connecting",function(a){g.onconnecting(a)}),k.addEventListener("message",function(a){g.onmessage(a)}),k.addEventListener("error",function(a){g.onerror(a)}),this.addEventListener=k.addEventListener.bind(k),this.removeEventListener=k.removeEventListener.bind(k),this.dispatchEvent=k.dispatchEvent.bind(k),this.open=function(b){h=new WebSocket(g.url,c||[]),b||k.dispatchEvent(l("connecting")),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","attempt-connect",g.url);var d=h,e=setTimeout(function(){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","connection-timeout",g.url),j=!0,d.close(),j=!1},g.timeoutInterval);h.onopen=function(){clearTimeout(e),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onopen",g.url),g.protocol=h.protocol,g.readyState=WebSocket.OPEN,g.reconnectAttempts=0;var d=l("open");d.isReconnect=b,b=!1,k.dispatchEvent(d)},h.onclose=function(c){if(clearTimeout(e),h=null,i)g.readyState=WebSocket.CLOSED,k.dispatchEvent(l("close"));else{g.readyState=WebSocket.CONNECTING;var d=l("connecting");d.code=c.code,d.reason=c.reason,d.wasClean=c.wasClean,k.dispatchEvent(d),b||j||((g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onclose",g.url),k.dispatchEvent(l("close")));var e=g.reconnectInterval*Math.pow(g.reconnectDecay,g.reconnectAttempts);setTimeout(function(){g.reconnectAttempts++,g.open(!0)},e>g.maxReconnectInterval?g.maxReconnectInterval:e)}},h.onmessage=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onmessage",g.url,b.data);var c=l("message");c.data=b.data,k.dispatchEvent(c)},h.onerror=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onerror",g.url,b),k.dispatchEvent(l("error"))}},1==this.automaticOpen&&this.open(!1),this.send=function(b){if(h)return(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","send",g.url,b),h.send(b);throw"INVALID_STATE_ERR : Pausing to reconnect websocket"},this.close=function(a,b){"undefined"==typeof a&&(a=1e3),i=!0,h&&h.close(a,b)},this.refresh=function(){h&&h.close()}}return a.prototype.onopen=function(){},a.prototype.onclose=function(){},a.prototype.onconnecting=function(){},a.prototype.onmessage=function(){},a.prototype.onerror=function(){},a.debugAll=!1,a.CONNECTING=WebSocket.CONNECTING,a.OPEN=WebSocket.OPEN,a.CLOSING=WebSocket.CLOSING,a.CLOSED=WebSocket.CLOSED,a}); 2 | -------------------------------------------------------------------------------- /mania_simple_overlay/fonts/GOTHICB.TTF: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_overlay/fonts/GOTHICB.TTF -------------------------------------------------------------------------------- /mania_simple_overlay/fonts/MADETOMMY.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_overlay/fonts/MADETOMMY.otf -------------------------------------------------------------------------------- /mania_simple_overlay/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | yep 1 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
320
41 |
320
42 |
300
43 |
300
44 |
200
45 |
200
46 |
100
47 |
100
48 |
50
49 |
50
50 |
miss
51 |
miss
52 |
53 |
54 |
55 |
56 |
57 |
58 |
Unstable Rate
59 |
60 |
61 |
62 |
63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | -------------------------------------------------------------------------------- /mania_simple_overlay/setting/setting.exe: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_overlay/setting/setting.exe -------------------------------------------------------------------------------- /mania_simple_overlay/setting/setting.json: -------------------------------------------------------------------------------- 1 | { 2 | "background" : "gray", 3 | "l_b" : 0, 4 | "l_g" : 140, 5 | "l_r" : 255, 6 | "left_box" : "star", 7 | "r_b" : 255, 8 | "r_g" : 191, 9 | "r_r" : 0, 10 | "right_box" : "ur", 11 | "simple" : "off", 12 | "subtitle" : "mapper" 13 | } -------------------------------------------------------------------------------- /mania_simple_overlay_qhd/css/odometr.css: -------------------------------------------------------------------------------- 1 | .odometer.odometer-auto-theme, 2 | .odometer.odometer-theme-default { 3 | display: inline-block; 4 | vertical-align: middle; 5 | *vertical-align: auto; 6 | *zoom: 1; 7 | *display: inline; 8 | position: relative; 9 | } 10 | 11 | .odometer.odometer-auto-theme .odometer-digit, 12 | .odometer.odometer-theme-default .odometer-digit { 13 | display: inline-block; 14 | vertical-align: middle; 15 | *vertical-align: auto; 16 | *zoom: 1; 17 | *display: inline; 18 | position: relative; 19 | } 20 | 21 | .odometer.odometer-auto-theme .odometer-digit .odometer-digit-spacer, 22 | .odometer.odometer-theme-default .odometer-digit .odometer-digit-spacer { 23 | display: inline-block; 24 | vertical-align: middle; 25 | *vertical-align: auto; 26 | *zoom: 1; 27 | *display: inline; 28 | visibility: hidden; 29 | } 30 | 31 | .odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner, 32 | .odometer.odometer-theme-default .odometer-digit .odometer-digit-inner { 33 | text-align: left; 34 | display: block; 35 | position: absolute; 36 | top: 0; 37 | left: 0; 38 | right: 0; 39 | bottom: 0; 40 | overflow: hidden; 41 | } 42 | 43 | .odometer.odometer-auto-theme .odometer-digit .odometer-ribbon, 44 | .odometer.odometer-theme-default .odometer-digit .odometer-ribbon { 45 | display: block; 46 | } 47 | 48 | .odometer.odometer-auto-theme .odometer-digit .odometer-ribbon-inner, 49 | .odometer.odometer-theme-default .odometer-digit .odometer-ribbon-inner { 50 | display: block; 51 | -webkit-backface-visibility: hidden; 52 | } 53 | 54 | .odometer.odometer-auto-theme .odometer-digit .odometer-value, 55 | .odometer.odometer-theme-default .odometer-digit .odometer-value { 56 | display: block; 57 | -webkit-transform: translateZ(0); 58 | } 59 | 60 | .odometer.odometer-auto-theme .odometer-digit .odometer-value.odometer-last-value, 61 | .odometer.odometer-theme-default .odometer-digit .odometer-value.odometer-last-value { 62 | position: absolute; 63 | } 64 | 65 | .odometer.odometer-auto-theme.odometer-animating-up .odometer-ribbon-inner, 66 | .odometer.odometer-theme-default.odometer-animating-up .odometer-ribbon-inner { 67 | -webkit-transition: -webkit-transform 300ms; 68 | -moz-transition: -moz-transform 300ms; 69 | -ms-transition: -ms-transform 300ms; 70 | -o-transition: -o-transform 300ms; 71 | transition: transform 300ms; 72 | } 73 | 74 | .odometer.odometer-auto-theme.odometer-animating-up.odometer-animating .odometer-ribbon-inner, 75 | .odometer.odometer-theme-default.odometer-animating-up.odometer-animating .odometer-ribbon-inner { 76 | -webkit-transform: translateY(-100%); 77 | -moz-transform: translateY(-100%); 78 | -ms-transform: translateY(-100%); 79 | -o-transform: translateY(-100%); 80 | transform: translateY(-100%); 81 | } 82 | 83 | .odometer.odometer-auto-theme.odometer-animating-down .odometer-ribbon-inner, 84 | .odometer.odometer-theme-default.odometer-animating-down .odometer-ribbon-inner { 85 | -webkit-transform: translateY(-100%); 86 | -moz-transform: translateY(-100%); 87 | -ms-transform: translateY(-100%); 88 | -o-transform: translateY(-100%); 89 | transform: translateY(-100%); 90 | } 91 | 92 | .odometer.odometer-auto-theme.odometer-animating-down.odometer-animating .odometer-ribbon-inner, 93 | .odometer.odometer-theme-default.odometer-animating-down.odometer-animating .odometer-ribbon-inner { 94 | -webkit-transition: -webkit-transform 300ms; 95 | -moz-transition: -moz-transform 300ms; 96 | -ms-transition: -ms-transform 300ms; 97 | -o-transition: -o-transform 300ms; 98 | transition: transform 300ms; 99 | -webkit-transform: translateY(0); 100 | -moz-transform: translateY(0); 101 | -ms-transform: translateY(0); 102 | -o-transform: translateY(0); 103 | transform: translateY(0); 104 | } 105 | 106 | .odometer.odometer-auto-theme, 107 | .odometer.odometer-theme-default { 108 | font-family: "Helvetica Neue", sans-serif; 109 | line-height: 1.1em; 110 | } 111 | 112 | .odometer.odometer-auto-theme .odometer-value, 113 | .odometer.odometer-theme-default .odometer-value { 114 | text-align: center; 115 | } 116 | 117 | .odometer.pp .odometer-inside:after { 118 | content: "pp" 119 | } 120 | 121 | .odometer.combo .odometer-inside:after { 122 | content: "x" 123 | } 124 | 125 | .odometer.URIndex .odometer-inside:after { 126 | content: "UR" 127 | } -------------------------------------------------------------------------------- /mania_simple_overlay_qhd/css/style.css: -------------------------------------------------------------------------------- 1 | /* made by sky(@s2skky) */ 2 | 3 | @font-face { 4 | font-family: "TOMMY"; 5 | src: url("../fonts/MADETOMMY.otf"); 6 | } 7 | .odometer.odometer-auto-theme { 8 | font-family: "GothicB", Helvetica, sans-serif !important; 9 | font-weight: 900px !important; 10 | } 11 | 12 | body, 13 | html { 14 | padding: 0; 15 | margin: 0; 16 | overflow-x: hidden; 17 | overflow-y: hidden; 18 | } 19 | .trans{ 20 | transition: color 1s ease; 21 | } 22 | 23 | #info_section{ 24 | position:absolute; 25 | left : 15px; 26 | top : 15px; 27 | width:666px; 28 | height:295px; 29 | background-color: rgba( 255, 255, 255, 0.1 ); 30 | border-radius: 40px; 31 | transition: ease-in-out 500ms; 32 | opacity: 0; 33 | } 34 | #left_box{ 35 | position:absolute; 36 | left:47px; 37 | top:27px; 38 | width:310px; 39 | height:44px; 40 | background-color: orange; 41 | border-radius:40px; 42 | } 43 | #l_text, 44 | #r_text{ 45 | position: absolute; 46 | top:8px; 47 | left:24px; 48 | font-family: TOMMY; 49 | font-weight:bold; 50 | font-size:18pt; 51 | } 52 | #l_number{ 53 | width:auto; 54 | background-color: rgba( 0, 0, 0, 0.6 ); 55 | font-family: TOMMY; 56 | font-weight: 120; 57 | font-size:20pt; 58 | color:white; 59 | border-radius: 40px; 60 | float:right; 61 | padding-left:15px; 62 | padding-right:12px; 63 | margin-top:6px; 64 | margin-right:6px; 65 | letter-spacing:1px; 66 | } 67 | #right_box{ 68 | position:absolute; 69 | right:47px; 70 | top:27px; 71 | width:230px; 72 | height:44px; 73 | background-color: deepskyblue; 74 | border-radius:40px; 75 | } 76 | #r_number{ 77 | width:auto; 78 | background-color: rgba( 0, 0, 0, 0.6 ); 79 | font-family: TOMMY; 80 | font-weight: 120; 81 | font-size:20pt; 82 | color:white; 83 | border-radius: 40px; 84 | float:right; 85 | padding-left:16px; 86 | padding-right:14px; 87 | margin-top:6px; 88 | margin-right:6px; 89 | letter-spacing:1px; 90 | } 91 | #center_line{ 92 | position:absolute; 93 | left:40px; 94 | top:178px; 95 | width:586px; 96 | height:6px; 97 | background-color:#898989; 98 | } 99 | #title_mask{ 100 | position:absolute; 101 | left:40px; 102 | top:86px; 103 | width:586px; 104 | height:100%; 105 | overflow: hidden; 106 | } 107 | .over{ 108 | transform: translate(586px); 109 | animation: slide 10s linear infinite; 110 | } 111 | @keyframes slide { 112 | 0% {transform: translate(0px);} 113 | 10% {transform: translate(0px);} 114 | 90% { transform: translate(calc(-100% + 586px)); } 115 | 100% { transform: translate(calc(-100% + 586px)); } 116 | } 117 | #title{ 118 | font-family: TOMMY; 119 | font-weight: 120; 120 | font-size:23pt; 121 | color:white; 122 | white-space: nowrap; 123 | overflow: hidden; 124 | text-align: center; 125 | } 126 | #subtitle_mask{ 127 | position:absolute; 128 | left:40px; 129 | top:130px; 130 | width:586px; 131 | height:100%; 132 | overflow: hidden; 133 | } 134 | #subtitle{ 135 | font-family: TOMMY; 136 | font-weight: 120; 137 | font-size:18pt; 138 | color:white; 139 | white-space: nowrap; 140 | overflow: hidden; 141 | text-align: center; 142 | } 143 | #bottom_section{ 144 | position:absolute; 145 | left:40px; 146 | top:195px; 147 | width:586px; 148 | height:75px; 149 | } 150 | #h320_text, 151 | #h300_text, 152 | #h200_text, 153 | #h100_text, 154 | #h50_text, 155 | #h0_text{ 156 | position:absolute; 157 | top:4px; 158 | font-family: TOMMY; 159 | font-weight: bold; 160 | font-size:16pt; 161 | color:#898989; 162 | width:99px; 163 | text-align: center; 164 | } 165 | #h320_text{ 166 | left:0px; 167 | } 168 | #h300_text{ 169 | left:99px; 170 | } 171 | #h200_text{ 172 | left:198px; 173 | } 174 | #h100_text{ 175 | left:297px; 176 | } 177 | #h50_text{ 178 | left:396px; 179 | } 180 | #h0_text{ 181 | left:495px; 182 | } 183 | #h320_shadow, 184 | #h300_shadow, 185 | #h200_shadow, 186 | #h100_shadow, 187 | #h50_shadow, 188 | #h0_shadow{ 189 | position:absolute; 190 | top:4px; 191 | font-family: TOMMY; 192 | font-weight: bold; 193 | font-size:16pt; 194 | width:99px; 195 | text-align: center; 196 | opacity :0; 197 | } 198 | #h320_shadow{ 199 | left:0px; 200 | color:azure; 201 | } 202 | #h300_shadow{ 203 | left:99px; 204 | color:orange; 205 | } 206 | #h200_shadow{ 207 | left:198px; 208 | color:forestgreen; 209 | } 210 | #h100_shadow{ 211 | left:297px; 212 | color:dodgerblue; 213 | } 214 | #h50_shadow{ 215 | left:396px; 216 | color:hotpink; 217 | } 218 | #h0_shadow{ 219 | left:495px; 220 | color:crimson; 221 | } 222 | #h320, 223 | #h300, 224 | #h200, 225 | #h100, 226 | #h50, 227 | #h0{ 228 | position:absolute; 229 | top:38px; 230 | font-family: TOMMY; 231 | font-weight: bold; 232 | font-size:24pt; 233 | color:white; 234 | text-align: center; 235 | width:99px; 236 | } 237 | #h320{ 238 | left:0px; 239 | } 240 | #h300{ 241 | left:99px; 242 | } 243 | #h200{ 244 | left:198px; 245 | } 246 | #h100{ 247 | left:297px; 248 | } 249 | #h50{ 250 | left:396px; 251 | } 252 | #h0{ 253 | left:495px; 254 | } 255 | #ur_text{ 256 | position:absolute; 257 | left:5px; 258 | top:140px; 259 | text-align: center; 260 | font-family: TOMMY; 261 | font-weight: bold; 262 | font-size:12pt; 263 | color:#898989; 264 | display:none; 265 | } 266 | #ur{ 267 | position:absolute; 268 | left:128px; 269 | top:136px; 270 | width:80px; 271 | font-family: TOMMY; 272 | font-weight: bold; 273 | font-size:18pt; 274 | color:white; 275 | text-align: right; 276 | display:none; 277 | } 278 | #bottom_line{ 279 | position:absolute; 280 | left:20px; 281 | top:120px; 282 | width:220px; 283 | height:3px; 284 | background-color:#898989; 285 | display:none; 286 | } -------------------------------------------------------------------------------- /mania_simple_overlay_qhd/css/style_simple.css: -------------------------------------------------------------------------------- 1 | /* made by sky(@s2skky) */ 2 | 3 | @font-face { 4 | font-family: "TOMMY"; 5 | src: url("../fonts/MADETOMMY.otf"); 6 | } 7 | .odometer.odometer-auto-theme { 8 | font-family: "GothicB", Helvetica, sans-serif !important; 9 | font-weight: 900px !important; 10 | } 11 | 12 | body, 13 | html { 14 | padding: 0; 15 | margin: 0; 16 | overflow-x: hidden; 17 | overflow-y: hidden; 18 | } 19 | .trans{ 20 | transition: color 1s ease; 21 | } 22 | 23 | #info_section{ 24 | position:absolute; 25 | left : 15px; 26 | top : 15px; 27 | width:345px; 28 | height:345px; 29 | background-color: rgba( 255, 255, 255, 0.1 ); 30 | border-radius: 40px; 31 | transition: ease-in-out 500ms; 32 | } 33 | #left_box{ 34 | position:absolute; 35 | left:35px; 36 | top:20px; 37 | width:230px; 38 | height:33px; 39 | background-color: #FCE800; 40 | border-radius:40px; 41 | display: none; 42 | } 43 | #l_text, 44 | #r_text{ 45 | position: absolute; 46 | top:6px; 47 | left:17px; 48 | font-family: TOMMY; 49 | font-weight:bold; 50 | font-size:13pt; 51 | } 52 | #l_number{ 53 | width:auto; 54 | background-color: rgba( 0, 0, 0, 0.6 ); 55 | font-family: TOMMY; 56 | font-weight: 120; 57 | font-size:15pt; 58 | color:white; 59 | border-radius: 30px; 60 | float:right; 61 | padding-left:11px; 62 | padding-right:9px; 63 | margin-top:4px; 64 | margin-right:4px; 65 | letter-spacing:1px; 66 | } 67 | #right_box{ 68 | position:absolute; 69 | right:35px; 70 | top:20px; 71 | width:170px; 72 | height:33px; 73 | background-color: #0FD0E2; 74 | border-radius:40px; 75 | display: none; 76 | } 77 | #r_number{ 78 | width:auto; 79 | background-color: rgba( 0, 0, 0, 0.6 ); 80 | font-family: TOMMY; 81 | font-weight: 120; 82 | font-size:15pt; 83 | color:white; 84 | border-radius: 30px; 85 | float:right; 86 | padding-left:12px; 87 | padding-right:10px; 88 | margin-top:4px; 89 | margin-right:4px; 90 | letter-spacing:1px; 91 | } 92 | #center_line{ 93 | position:absolute; 94 | left:25px; 95 | top:78px; 96 | width:295px; 97 | height:4px; 98 | background-color:#898989; 99 | } 100 | #title_mask{ 101 | position:absolute; 102 | left:40px; 103 | top:21px; 104 | width:265px; 105 | height:100%; 106 | overflow: hidden; 107 | } 108 | .over{ 109 | transform: translate(265px); 110 | animation: slide 10s linear infinite; 111 | } 112 | @keyframes slide { 113 | 0% {transform: translate(0px);} 114 | 10% {transform: translate(0px);} 115 | 90% { transform: translate(calc(-100% + 265px)); } 116 | 100% { transform: translate(calc(-100% + 265px)); } 117 | } 118 | #title{ 119 | font-family: TOMMY; 120 | font-weight: 110; 121 | font-size:23pt; 122 | color:white; 123 | white-space: nowrap; 124 | overflow: hidden; 125 | text-align: center; 126 | } 127 | #subtitle_mask{ 128 | position:absolute; 129 | left:30px; 130 | top:96px; 131 | width:440px; 132 | height:100%; 133 | overflow: hidden; 134 | display: none; 135 | } 136 | #subtitle{ 137 | font-family: TOMMY; 138 | font-weight: 120; 139 | font-size:14pt; 140 | color:white; 141 | white-space: nowrap; 142 | overflow: hidden; 143 | text-align: center; 144 | display: none; 145 | } 146 | #bottom_section{ 147 | position:absolute; 148 | left:30px; 149 | top:96px; 150 | width:285px; 151 | height:75px; 152 | } 153 | #h320_text, 154 | #h300_text, 155 | #h200_text, 156 | #h100_text, 157 | #h50_text, 158 | #h0_text{ 159 | position:absolute; 160 | top:4px; 161 | font-family: TOMMY; 162 | font-weight: bold; 163 | font-size:16pt; 164 | color:#898989; 165 | width:96px; 166 | text-align: center; 167 | } 168 | #h320_text{ 169 | left:0px; 170 | } 171 | #h300_text{ 172 | left:96px; 173 | } 174 | #h200_text{ 175 | left:192px; 176 | } 177 | #h100_text{ 178 | top:90px; 179 | left:0px; 180 | } 181 | #h50_text{ 182 | top:90px; 183 | left:96px; 184 | } 185 | #h0_text{ 186 | top:90px; 187 | left:192px; 188 | } 189 | #h320_shadow, 190 | #h300_shadow, 191 | #h200_shadow, 192 | #h100_shadow, 193 | #h50_shadow, 194 | #h0_shadow{ 195 | position:absolute; 196 | top:4px; 197 | font-family: TOMMY; 198 | font-weight: bold; 199 | font-size:16pt; 200 | width:96px; 201 | text-align: center; 202 | opacity :0; 203 | } 204 | #h320_shadow{ 205 | left:0px; 206 | color:azure; 207 | } 208 | #h300_shadow{ 209 | left:96px; 210 | color:orange; 211 | } 212 | #h200_shadow{ 213 | left:192px; 214 | color:forestgreen; 215 | } 216 | #h100_shadow{ 217 | top:90px; 218 | left:0px; 219 | color:dodgerblue; 220 | } 221 | #h50_shadow{ 222 | top:90px; 223 | left:96px; 224 | color:hotpink; 225 | } 226 | #h0_shadow{ 227 | top:90px; 228 | left:192px; 229 | color:crimson; 230 | } 231 | #h320, 232 | #h300, 233 | #h200, 234 | #h100, 235 | #h50, 236 | #h0{ 237 | position:absolute; 238 | top:38px; 239 | font-family: TOMMY; 240 | font-weight: bold; 241 | font-size:23pt; 242 | color:white; 243 | text-align: center; 244 | width:96px; 245 | } 246 | #h320{ 247 | left:0px; 248 | } 249 | #h300{ 250 | left:96px; 251 | } 252 | #h200{ 253 | left:192px; 254 | } 255 | #h100{ 256 | top:123px; 257 | left:0px; 258 | } 259 | #h50{ 260 | top:123px; 261 | left:96px; 262 | } 263 | #h0{ 264 | top:123px; 265 | left:192px; 266 | } 267 | #ur_text{ 268 | position:absolute; 269 | left:7px; 270 | top:196px; 271 | text-align: center; 272 | font-family: TOMMY; 273 | font-weight: bold; 274 | font-size:16pt; 275 | color:#898989; 276 | } 277 | #ur{ 278 | position:absolute; 279 | left:170px; 280 | top:189px; 281 | width:107px; 282 | font-family: TOMMY; 283 | font-weight: bold; 284 | font-size:23pt; 285 | color:white; 286 | text-align: right; 287 | } 288 | #bottom_line{ 289 | position:absolute; 290 | left:25px; 291 | top:270px; 292 | width:295px; 293 | height:4px; 294 | background-color:#898989; 295 | } -------------------------------------------------------------------------------- /mania_simple_overlay_qhd/deps/reconnecting-websocket.min.js: -------------------------------------------------------------------------------- 1 | !function(a,b){"function"==typeof define&&define.amd?define([],b):"undefined"!=typeof module&&module.exports?module.exports=b():a.ReconnectingWebSocket=b()}(this,function(){function a(b,c,d){function l(a,b){var c=document.createEvent("CustomEvent");return c.initCustomEvent(a,!1,!1,b),c}var e={debug:!1,automaticOpen:!0,reconnectInterval:1e3,maxReconnectInterval:3e4,reconnectDecay:1.5,timeoutInterval:2e3};d||(d={});for(var f in e)this[f]="undefined"!=typeof d[f]?d[f]:e[f];this.url=b,this.reconnectAttempts=0,this.readyState=WebSocket.CONNECTING,this.protocol=null;var h,g=this,i=!1,j=!1,k=document.createElement("div");k.addEventListener("open",function(a){g.onopen(a)}),k.addEventListener("close",function(a){g.onclose(a)}),k.addEventListener("connecting",function(a){g.onconnecting(a)}),k.addEventListener("message",function(a){g.onmessage(a)}),k.addEventListener("error",function(a){g.onerror(a)}),this.addEventListener=k.addEventListener.bind(k),this.removeEventListener=k.removeEventListener.bind(k),this.dispatchEvent=k.dispatchEvent.bind(k),this.open=function(b){h=new WebSocket(g.url,c||[]),b||k.dispatchEvent(l("connecting")),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","attempt-connect",g.url);var d=h,e=setTimeout(function(){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","connection-timeout",g.url),j=!0,d.close(),j=!1},g.timeoutInterval);h.onopen=function(){clearTimeout(e),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onopen",g.url),g.protocol=h.protocol,g.readyState=WebSocket.OPEN,g.reconnectAttempts=0;var d=l("open");d.isReconnect=b,b=!1,k.dispatchEvent(d)},h.onclose=function(c){if(clearTimeout(e),h=null,i)g.readyState=WebSocket.CLOSED,k.dispatchEvent(l("close"));else{g.readyState=WebSocket.CONNECTING;var d=l("connecting");d.code=c.code,d.reason=c.reason,d.wasClean=c.wasClean,k.dispatchEvent(d),b||j||((g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onclose",g.url),k.dispatchEvent(l("close")));var e=g.reconnectInterval*Math.pow(g.reconnectDecay,g.reconnectAttempts);setTimeout(function(){g.reconnectAttempts++,g.open(!0)},e>g.maxReconnectInterval?g.maxReconnectInterval:e)}},h.onmessage=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onmessage",g.url,b.data);var c=l("message");c.data=b.data,k.dispatchEvent(c)},h.onerror=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onerror",g.url,b),k.dispatchEvent(l("error"))}},1==this.automaticOpen&&this.open(!1),this.send=function(b){if(h)return(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","send",g.url,b),h.send(b);throw"INVALID_STATE_ERR : Pausing to reconnect websocket"},this.close=function(a,b){"undefined"==typeof a&&(a=1e3),i=!0,h&&h.close(a,b)},this.refresh=function(){h&&h.close()}}return a.prototype.onopen=function(){},a.prototype.onclose=function(){},a.prototype.onconnecting=function(){},a.prototype.onmessage=function(){},a.prototype.onerror=function(){},a.debugAll=!1,a.CONNECTING=WebSocket.CONNECTING,a.OPEN=WebSocket.OPEN,a.CLOSING=WebSocket.CLOSING,a.CLOSED=WebSocket.CLOSED,a}); 2 | -------------------------------------------------------------------------------- /mania_simple_overlay_qhd/fonts/GOTHICB.TTF: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_overlay_qhd/fonts/GOTHICB.TTF -------------------------------------------------------------------------------- /mania_simple_overlay_qhd/fonts/MADETOMMY.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_overlay_qhd/fonts/MADETOMMY.otf -------------------------------------------------------------------------------- /mania_simple_overlay_qhd/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | yep 1 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
320
41 |
320
42 |
300
43 |
300
44 |
200
45 |
200
46 |
100
47 |
100
48 |
50
49 |
50
50 |
miss
51 |
miss
52 |
53 |
54 |
55 |
56 |
57 |
58 |
Unstable Rate
59 |
60 |
61 |
62 |
63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | -------------------------------------------------------------------------------- /mania_simple_overlay_qhd/setting/setting.exe: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/mania_simple_overlay_qhd/setting/setting.exe -------------------------------------------------------------------------------- /mania_simple_overlay_qhd/setting/setting.json: -------------------------------------------------------------------------------- 1 | { 2 | "background" : "gray", 3 | "l_b" : 0, 4 | "l_g" : 140, 5 | "l_r" : 255, 6 | "left_box" : "star", 7 | "r_b" : 255, 8 | "r_g" : 191, 9 | "r_r" : 0, 10 | "right_box" : "ur", 11 | "simple" : "off", 12 | "subtitle" : "mapper" 13 | } -------------------------------------------------------------------------------- /now_playing_disk_version/config.js: -------------------------------------------------------------------------------- 1 | // option 1 : subcontent type 2 | // pp : performance 3 | // ur : unstable rate 4 | 5 | const subcontent = 'pp'; 6 | 7 | // option 2 : start animate type 8 | // ls : left slide 9 | // rs : right slide 10 | // us : up slide 11 | // bk : blink 12 | 13 | const animatedType = 'rs'; -------------------------------------------------------------------------------- /now_playing_disk_version/deps/jquery.animate-shadow-min.js: -------------------------------------------------------------------------------- 1 | /* 2 | Shadow animation 1.11 3 | http://www.bitstorm.org/jquery/shadow-animation/ 4 | Copyright 2011, 2013 Edwin Martin 5 | Contributors: Mark Carver, Xavier Lepretre and Jason Redding 6 | Released under the MIT and GPL licenses. 7 | */ 8 | 'use strict';jQuery(function(h){function r(b,m,d){var l=[];h.each(b,function(f){var g=[],e=b[f];f=m[f];e.b&&g.push("inset");"undefined"!==typeof f.left&&g.push(parseFloat(e.left+d*(f.left-e.left))+"px "+parseFloat(e.top+d*(f.top-e.top))+"px");"undefined"!==typeof f.blur&&g.push(parseFloat(e.blur+d*(f.blur-e.blur))+"px");"undefined"!==typeof f.a&&g.push(parseFloat(e.a+d*(f.a-e.a))+"px");if("undefined"!==typeof f.color){var p="rgb"+(h.support.rgba?"a":"")+"("+parseInt(e.color[0]+d*(f.color[0]-e.color[0]), 9 | 10)+","+parseInt(e.color[1]+d*(f.color[1]-e.color[1]),10)+","+parseInt(e.color[2]+d*(f.color[2]-e.color[2]),10);h.support.rgba&&(p+=","+parseFloat(e.color[3]+d*(f.color[3]-e.color[3])));g.push(p+")")}l.push(g.join(" "))});return l.join(", ")}function q(b){function m(){var a=/^inset\b/.exec(b.substring(c));return null!==a&&0b;b++)b=1;f--){var l=parseInt(i/n*f);u&&(l=parseFloat(i/n*f).toFixed(a));if(s)while(/(\d+)(\d{3})/.test(l.toString()))l=l.toString().replace(/(\d+)(\d{3})/,"$1,$2");e.unshift(l)}t.data("counterup-nums",e);t.text("0");var c=function(){t.text(t.data("counterup-nums").shift());if(t.data("counterup-nums").length)setTimeout(t.data("counterup-func"),r.delay);else{delete t.data("counterup-nums");t.data("counterup-nums",null);t.data("counterup-func",null)}};t.data("counterup-func",c);setTimeout(t.data("counterup-func"),r.delay)};t.waypoint(i,{offset:"100%",triggerOnce:!0})})}})(jQuery); -------------------------------------------------------------------------------- /now_playing_disk_version/deps/reconnecting-websocket.min.js: -------------------------------------------------------------------------------- 1 | !function(a,b){"function"==typeof define&&define.amd?define([],b):"undefined"!=typeof module&&module.exports?module.exports=b():a.ReconnectingWebSocket=b()}(this,function(){function a(b,c,d){function l(a,b){var c=document.createEvent("CustomEvent");return c.initCustomEvent(a,!1,!1,b),c}var e={debug:!1,automaticOpen:!0,reconnectInterval:1e3,maxReconnectInterval:3e4,reconnectDecay:1.5,timeoutInterval:2e3};d||(d={});for(var f in e)this[f]="undefined"!=typeof d[f]?d[f]:e[f];this.url=b,this.reconnectAttempts=0,this.readyState=WebSocket.CONNECTING,this.protocol=null;var h,g=this,i=!1,j=!1,k=document.createElement("div");k.addEventListener("open",function(a){g.onopen(a)}),k.addEventListener("close",function(a){g.onclose(a)}),k.addEventListener("connecting",function(a){g.onconnecting(a)}),k.addEventListener("message",function(a){g.onmessage(a)}),k.addEventListener("error",function(a){g.onerror(a)}),this.addEventListener=k.addEventListener.bind(k),this.removeEventListener=k.removeEventListener.bind(k),this.dispatchEvent=k.dispatchEvent.bind(k),this.open=function(b){h=new WebSocket(g.url,c||[]),b||k.dispatchEvent(l("connecting")),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","attempt-connect",g.url);var d=h,e=setTimeout(function(){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","connection-timeout",g.url),j=!0,d.close(),j=!1},g.timeoutInterval);h.onopen=function(){clearTimeout(e),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onopen",g.url),g.protocol=h.protocol,g.readyState=WebSocket.OPEN,g.reconnectAttempts=0;var d=l("open");d.isReconnect=b,b=!1,k.dispatchEvent(d)},h.onclose=function(c){if(clearTimeout(e),h=null,i)g.readyState=WebSocket.CLOSED,k.dispatchEvent(l("close"));else{g.readyState=WebSocket.CONNECTING;var d=l("connecting");d.code=c.code,d.reason=c.reason,d.wasClean=c.wasClean,k.dispatchEvent(d),b||j||((g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onclose",g.url),k.dispatchEvent(l("close")));var e=g.reconnectInterval*Math.pow(g.reconnectDecay,g.reconnectAttempts);setTimeout(function(){g.reconnectAttempts++,g.open(!0)},e>g.maxReconnectInterval?g.maxReconnectInterval:e)}},h.onmessage=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onmessage",g.url,b.data);var c=l("message");c.data=b.data,k.dispatchEvent(c)},h.onerror=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onerror",g.url,b),k.dispatchEvent(l("error"))}},1==this.automaticOpen&&this.open(!1),this.send=function(b){if(h)return(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","send",g.url,b),h.send(b);throw"INVALID_STATE_ERR : Pausing to reconnect websocket"},this.close=function(a,b){"undefined"==typeof a&&(a=1e3),i=!0,h&&h.close(a,b)},this.refresh=function(){h&&h.close()}}return a.prototype.onopen=function(){},a.prototype.onclose=function(){},a.prototype.onconnecting=function(){},a.prototype.onmessage=function(){},a.prototype.onerror=function(){},a.debugAll=!1,a.CONNECTING=WebSocket.CONNECTING,a.OPEN=WebSocket.OPEN,a.CLOSING=WebSocket.CLOSING,a.CLOSED=WebSocket.CLOSED,a}); 2 | -------------------------------------------------------------------------------- /now_playing_disk_version/fonts/GOTHICB.TTF: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/now_playing_disk_version/fonts/GOTHICB.TTF -------------------------------------------------------------------------------- /now_playing_disk_version/fonts/MADETOMMY.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/now_playing_disk_version/fonts/MADETOMMY.otf -------------------------------------------------------------------------------- /now_playing_disk_version/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | yep 1 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 |
16 |
17 | 18 | 19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 | 27 |
28 | 29 |
30 | 31 |
32 |
33 |
34 |
35 |
00:00
36 |
00:00
37 |
38 |
39 |
UnstableRate
40 |
41 |
42 |
Remain
43 |
44 |
45 |
46 |
47 |
BPM
48 |
49 |
50 |
OD
51 |
52 |
53 |
HP
54 |
55 |
56 |
SR
57 |
58 |
59 |
60 |
61 |
made by  sssskky
62 |
63 |
64 |
65 |
66 |
67 |
Loading...
68 |
69 |
70 |
71 |
72 | 73 | 74 | 75 | 76 | 77 | -------------------------------------------------------------------------------- /now_playing_disk_version/metadata.txt: -------------------------------------------------------------------------------- 1 | Usecase: obs-overlay 2 | Name: now_playing_disk_ver 3 | Author: sky 4 | CompatibleWith: tosu 5 | Resolution: 430x550 6 | authorLinks: https://github.com/2222zz/gosumemory-theme -------------------------------------------------------------------------------- /now_playing_disk_version/parts/disk.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/now_playing_disk_version/parts/disk.png -------------------------------------------------------------------------------- /now_playing_disk_version/parts/loadingbg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/now_playing_disk_version/parts/loadingbg.jpg -------------------------------------------------------------------------------- /now_playing_disk_version/parts/next.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/now_playing_disk_version/parts/next.png -------------------------------------------------------------------------------- /now_playing_disk_version/parts/pause.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/now_playing_disk_version/parts/pause.png -------------------------------------------------------------------------------- /now_playing_disk_version/parts/play.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/now_playing_disk_version/parts/play.png -------------------------------------------------------------------------------- /now_playing_disk_version/parts/previous.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/now_playing_disk_version/parts/previous.png -------------------------------------------------------------------------------- /nps_chart/css/style.css: -------------------------------------------------------------------------------- 1 | /* made by 2ky(@s2skky) */ 2 | 3 | @font-face { 4 | font-family: "Google Sans Bold"; 5 | src: url("../fonts/GoogleSans-Bold.otf"); 6 | } 7 | @font-face { 8 | font-family: "TOMMY"; 9 | src: url("../fonts/MADETOMMY.otf"); 10 | } 11 | 12 | body, 13 | html { 14 | padding: 0; 15 | margin: 0; 16 | overflow-x: hidden; 17 | overflow-y: hidden; 18 | } 19 | 20 | #section{ 21 | transition: ease-in-out 500ms; 22 | width : 400px; 23 | height : 400px; 24 | } 25 | #chart{ 26 | position: absolute; 27 | top: -10px; 28 | width: 400px; 29 | height: 400px; 30 | } 31 | #nps{ 32 | font-family: TOMMY; 33 | font-size: 24pt; 34 | color: white; 35 | text-align: right; 36 | margin-right: 40px; 37 | } -------------------------------------------------------------------------------- /nps_chart/deps/reconnecting-websocket.min.js: -------------------------------------------------------------------------------- 1 | !function(a,b){"function"==typeof define&&define.amd?define([],b):"undefined"!=typeof module&&module.exports?module.exports=b():a.ReconnectingWebSocket=b()}(this,function(){function a(b,c,d){function l(a,b){var c=document.createEvent("CustomEvent");return c.initCustomEvent(a,!1,!1,b),c}var e={debug:!1,automaticOpen:!0,reconnectInterval:1e3,maxReconnectInterval:3e4,reconnectDecay:1.5,timeoutInterval:2e3};d||(d={});for(var f in e)this[f]="undefined"!=typeof d[f]?d[f]:e[f];this.url=b,this.reconnectAttempts=0,this.readyState=WebSocket.CONNECTING,this.protocol=null;var h,g=this,i=!1,j=!1,k=document.createElement("div");k.addEventListener("open",function(a){g.onopen(a)}),k.addEventListener("close",function(a){g.onclose(a)}),k.addEventListener("connecting",function(a){g.onconnecting(a)}),k.addEventListener("message",function(a){g.onmessage(a)}),k.addEventListener("error",function(a){g.onerror(a)}),this.addEventListener=k.addEventListener.bind(k),this.removeEventListener=k.removeEventListener.bind(k),this.dispatchEvent=k.dispatchEvent.bind(k),this.open=function(b){h=new WebSocket(g.url,c||[]),b||k.dispatchEvent(l("connecting")),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","attempt-connect",g.url);var d=h,e=setTimeout(function(){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","connection-timeout",g.url),j=!0,d.close(),j=!1},g.timeoutInterval);h.onopen=function(){clearTimeout(e),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onopen",g.url),g.protocol=h.protocol,g.readyState=WebSocket.OPEN,g.reconnectAttempts=0;var d=l("open");d.isReconnect=b,b=!1,k.dispatchEvent(d)},h.onclose=function(c){if(clearTimeout(e),h=null,i)g.readyState=WebSocket.CLOSED,k.dispatchEvent(l("close"));else{g.readyState=WebSocket.CONNECTING;var d=l("connecting");d.code=c.code,d.reason=c.reason,d.wasClean=c.wasClean,k.dispatchEvent(d),b||j||((g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onclose",g.url),k.dispatchEvent(l("close")));var e=g.reconnectInterval*Math.pow(g.reconnectDecay,g.reconnectAttempts);setTimeout(function(){g.reconnectAttempts++,g.open(!0)},e>g.maxReconnectInterval?g.maxReconnectInterval:e)}},h.onmessage=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onmessage",g.url,b.data);var c=l("message");c.data=b.data,k.dispatchEvent(c)},h.onerror=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onerror",g.url,b),k.dispatchEvent(l("error"))}},1==this.automaticOpen&&this.open(!1),this.send=function(b){if(h)return(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","send",g.url,b),h.send(b);throw"INVALID_STATE_ERR : Pausing to reconnect websocket"},this.close=function(a,b){"undefined"==typeof a&&(a=1e3),i=!0,h&&h.close(a,b)},this.refresh=function(){h&&h.close()}}return a.prototype.onopen=function(){},a.prototype.onclose=function(){},a.prototype.onconnecting=function(){},a.prototype.onmessage=function(){},a.prototype.onerror=function(){},a.debugAll=!1,a.CONNECTING=WebSocket.CONNECTING,a.OPEN=WebSocket.OPEN,a.CLOSING=WebSocket.CLOSING,a.CLOSED=WebSocket.CLOSED,a}); 2 | -------------------------------------------------------------------------------- /nps_chart/fonts/GoogleSans-Bold.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/nps_chart/fonts/GoogleSans-Bold.otf -------------------------------------------------------------------------------- /nps_chart/fonts/MADETOMMY.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/2222zz/osu-custom-overlay/c053f292dfce4672da8d80ff5e0ac76c11f09a31/nps_chart/fonts/MADETOMMY.otf -------------------------------------------------------------------------------- /nps_chart/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | yep 1 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 |
17 |
0 Nps
18 |
19 |
20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /nps_chart/index.js: -------------------------------------------------------------------------------- 1 | // made by 2ky(@s2skky) 2 | 3 | // no touch 4 | let socket = new ReconnectingWebSocket("ws://127.0.0.1:24050/ws"); 5 | socket.onopen = () => console.log("Successfully Connected"); 6 | socket.onclose = event => { 7 | console.log("Socket Closed Connection: ", event); 8 | socket.send("Client Closed!"); 9 | }; 10 | socket.onerror = error => console.log("Socket Error: ", error); 11 | 12 | let section = document.getElementById("section"); 13 | let myChart = echarts.init(document.getElementById('chart')); 14 | let nps = document.getElementById("nps"); 15 | let option; 16 | 17 | let state; 18 | let currentTime; 19 | let currentNote; 20 | let previousNote = [0,0,0,0,0,0]; 21 | let flag = 0; 22 | let maxNps = 0; 23 | let isRefresh = false; 24 | let isFirstStart = false; 25 | 26 | function displaySection(){ 27 | section.style.opacity = 1; 28 | } 29 | function setOption(){ 30 | } 31 | 32 | socket.onmessage = event => { 33 | try { 34 | let data = JSON.parse(event.data); 35 | let menu = data.menu; 36 | let play = data.gameplay; 37 | 38 | if(menu.bm.time.current > 0 && menu.state == 2){ 39 | currentTime = data.menu.bm.time.current; 40 | isFirstStart = true; 41 | } 42 | if(menu.bm.time.current <= 0 && menu.state == 2 && isFirstStart){ 43 | maxNps = 0; 44 | currentNote = 0; 45 | for(var i=0; i<5; i++) 46 | previousNote[i] = 0; 47 | option.series[0].data = (function (){ 48 | currentTime = menu.bm.time.current; 49 | var res = []; 50 | var len = 100; 51 | while (len--) { 52 | res.unshift(currentTime); 53 | currentTime = currentTime - 200; 54 | } 55 | return res; 56 | })(); 57 | myChart.setOption(option); 58 | } 59 | if (menu.bm.time.current > 0 && currentNote !== play.hits.geki + play.hits[300] + play.hits.katu + play.hits[100] + play.hits[50] + play.hits[0]){ 60 | currentNote = play.hits.geki + play.hits[300] + play.hits.katu + play.hits[100] + play.hits[50] + play.hits[0]; 61 | } 62 | 63 | if (state !== menu.state){ 64 | state = menu.state; 65 | 66 | option = { 67 | grid: [ 68 | { 69 | show: true, 70 | backgroundColor: '#1A1A1A', 71 | borderColor: '#FFFFFF', 72 | }, 73 | ], 74 | xAxis: [ 75 | { 76 | type: 'category', 77 | show: false, 78 | boundaryGap: true, 79 | data: (function (){ 80 | currentTime = menu.bm.time.current; 81 | var res = []; 82 | var len = 100; 83 | while (len--) { 84 | res.unshift(currentTime); 85 | currentTime = currentTime - 200; 86 | } 87 | return res; 88 | })() 89 | }, 90 | ], 91 | yAxis: [ 92 | { 93 | type: 'value', 94 | show: false, 95 | scale: true, 96 | name: 'nps', 97 | max: 0, 98 | min: 0, 99 | boundaryGap: [0.2, 0.2], 100 | } 101 | ], 102 | series: [ 103 | { 104 | name: 'nps', 105 | type: 'line', 106 | lineStyle:{ 107 | color:'#FFFFFF' 108 | }, 109 | symbol: 'none', 110 | //smooth: true, 111 | yAxisIndex: 0, 112 | data: (function (){ 113 | var res = []; 114 | var len = 0; 115 | while (len < 100) { 116 | res.push(0); 117 | len++; 118 | } 119 | return res; 120 | })() 121 | } 122 | ] 123 | }; 124 | 125 | myChart.setOption(option); 126 | 127 | if(state == 2){ 128 | setTimeout(displaySection, 1500); 129 | maxNps = 0; 130 | } 131 | else{ 132 | section.style.opacity = 0; 133 | maxNps = 0; 134 | isFirstStart = false; 135 | } 136 | 137 | } 138 | 139 | } catch (err) { console.log(err); }; 140 | }; 141 | 142 | //데이터를 생성하고 삭제합니다. 143 | setInterval(function (){ 144 | flag += 1; 145 | var value = 0; 146 | value = currentNote - previousNote[flag]; 147 | previousNote[flag] = currentNote; 148 | if(flag == 5){ 149 | flag = 0; 150 | } 151 | var axisData = currentTime; 152 | var data0 = option.series[0].data; 153 | 154 | data0.shift(); 155 | if(isRefresh){ 156 | data0.push(value); 157 | nps.innerHTML = value + " Nps"; 158 | if(value > maxNps){ 159 | maxNps = value; 160 | option.yAxis[0].max = maxNps; 161 | } 162 | } 163 | else 164 | data0.push(0); 165 | option.xAxis[0].data.shift(); 166 | option.xAxis[0].data.push(axisData); 167 | 168 | if(flag == 0) 169 | isRefresh = true; 170 | myChart.setOption(option); 171 | }, 200); --------------------------------------------------------------------------------