├── CNAME ├── favicon.ico ├── favicon-16x16.png ├── favicon-32x32.png ├── mstile-70x70.png ├── mstile-144x144.png ├── mstile-150x150.png ├── mstile-310x150.png ├── mstile-310x310.png ├── apple-touch-icon.png ├── android-chrome-192x192.png ├── android-chrome-512x512.png ├── font ├── ttf │ ├── PlusJakartaSans-Bold.ttf │ ├── PlusJakartaSans-Light.ttf │ ├── PlusJakartaSans-Italic.ttf │ ├── PlusJakartaSans-Medium.ttf │ ├── PlusJakartaSans-Regular.ttf │ ├── PlusJakartaSans-BoldItalic.ttf │ ├── PlusJakartaSans-ExtraBold.ttf │ ├── PlusJakartaSans-ExtraLight.ttf │ ├── PlusJakartaSans-LightItalic.ttf │ ├── PlusJakartaSans-MediumItalic.ttf │ ├── PlusJakartaSans-ExtraBoldItalic.ttf │ └── PlusJakartaSans-ExtraLightItalic.ttf ├── woff │ ├── PlusJakartaSans-Bold.woff │ ├── PlusJakartaSans-Italic.woff │ ├── PlusJakartaSans-Light.woff │ ├── PlusJakartaSans-Medium.woff │ ├── PlusJakartaSans-Regular.woff │ ├── PlusJakartaSans-BoldItalic.woff │ ├── PlusJakartaSans-ExtraBold.woff │ ├── PlusJakartaSans-ExtraLight.woff │ ├── PlusJakartaSans-LightItalic.woff │ ├── PlusJakartaSans-MediumItalic.woff │ ├── PlusJakartaSans-ExtraBoldItalic.woff │ └── PlusJakartaSans-ExtraLightItalic.woff └── woff2 │ ├── PlusJakartaSans-Bold.woff2 │ ├── PlusJakartaSans-Italic.woff2 │ ├── PlusJakartaSans-Light.woff2 │ ├── PlusJakartaSans-Medium.woff2 │ ├── PlusJakartaSans-ExtraBold.woff2 │ ├── PlusJakartaSans-Regular.woff2 │ ├── PlusJakartaSans-BoldItalic.woff2 │ ├── PlusJakartaSans-ExtraLight.woff2 │ ├── PlusJakartaSans-LightItalic.woff2 │ ├── PlusJakartaSans-MediumItalic.woff2 │ ├── PlusJakartaSans-ExtraBoldItalic.woff2 │ └── PlusJakartaSans-ExtraLightItalic.woff2 ├── README.md ├── browserconfig.xml ├── sitemap.xml ├── site.webmanifest ├── safari-pinned-tab.svg ├── style.css ├── index.html └── script.js /CNAME: -------------------------------------------------------------------------------- 1 | tracker.sebdoe.com -------------------------------------------------------------------------------- /favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/favicon.ico -------------------------------------------------------------------------------- /favicon-16x16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/favicon-16x16.png -------------------------------------------------------------------------------- /favicon-32x32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/favicon-32x32.png -------------------------------------------------------------------------------- /mstile-70x70.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/mstile-70x70.png -------------------------------------------------------------------------------- /mstile-144x144.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/mstile-144x144.png -------------------------------------------------------------------------------- /mstile-150x150.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/mstile-150x150.png -------------------------------------------------------------------------------- /mstile-310x150.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/mstile-310x150.png -------------------------------------------------------------------------------- /mstile-310x310.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/mstile-310x310.png -------------------------------------------------------------------------------- /apple-touch-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/apple-touch-icon.png -------------------------------------------------------------------------------- /android-chrome-192x192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/android-chrome-192x192.png -------------------------------------------------------------------------------- /android-chrome-512x512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/android-chrome-512x512.png -------------------------------------------------------------------------------- /font/ttf/PlusJakartaSans-Bold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/ttf/PlusJakartaSans-Bold.ttf -------------------------------------------------------------------------------- /font/ttf/PlusJakartaSans-Light.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/ttf/PlusJakartaSans-Light.ttf -------------------------------------------------------------------------------- /font/ttf/PlusJakartaSans-Italic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/ttf/PlusJakartaSans-Italic.ttf -------------------------------------------------------------------------------- /font/ttf/PlusJakartaSans-Medium.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/ttf/PlusJakartaSans-Medium.ttf -------------------------------------------------------------------------------- /font/ttf/PlusJakartaSans-Regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/ttf/PlusJakartaSans-Regular.ttf -------------------------------------------------------------------------------- /font/woff/PlusJakartaSans-Bold.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff/PlusJakartaSans-Bold.woff -------------------------------------------------------------------------------- /font/woff/PlusJakartaSans-Italic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff/PlusJakartaSans-Italic.woff -------------------------------------------------------------------------------- /font/woff/PlusJakartaSans-Light.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff/PlusJakartaSans-Light.woff -------------------------------------------------------------------------------- /font/woff/PlusJakartaSans-Medium.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff/PlusJakartaSans-Medium.woff -------------------------------------------------------------------------------- /font/woff2/PlusJakartaSans-Bold.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff2/PlusJakartaSans-Bold.woff2 -------------------------------------------------------------------------------- /font/ttf/PlusJakartaSans-BoldItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/ttf/PlusJakartaSans-BoldItalic.ttf -------------------------------------------------------------------------------- /font/ttf/PlusJakartaSans-ExtraBold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/ttf/PlusJakartaSans-ExtraBold.ttf -------------------------------------------------------------------------------- /font/ttf/PlusJakartaSans-ExtraLight.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/ttf/PlusJakartaSans-ExtraLight.ttf -------------------------------------------------------------------------------- /font/woff/PlusJakartaSans-Regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff/PlusJakartaSans-Regular.woff -------------------------------------------------------------------------------- /font/woff2/PlusJakartaSans-Italic.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff2/PlusJakartaSans-Italic.woff2 -------------------------------------------------------------------------------- /font/woff2/PlusJakartaSans-Light.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff2/PlusJakartaSans-Light.woff2 -------------------------------------------------------------------------------- /font/woff2/PlusJakartaSans-Medium.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff2/PlusJakartaSans-Medium.woff2 -------------------------------------------------------------------------------- /font/ttf/PlusJakartaSans-LightItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/ttf/PlusJakartaSans-LightItalic.ttf -------------------------------------------------------------------------------- /font/ttf/PlusJakartaSans-MediumItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/ttf/PlusJakartaSans-MediumItalic.ttf -------------------------------------------------------------------------------- /font/woff/PlusJakartaSans-BoldItalic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff/PlusJakartaSans-BoldItalic.woff -------------------------------------------------------------------------------- /font/woff/PlusJakartaSans-ExtraBold.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff/PlusJakartaSans-ExtraBold.woff -------------------------------------------------------------------------------- /font/woff/PlusJakartaSans-ExtraLight.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff/PlusJakartaSans-ExtraLight.woff -------------------------------------------------------------------------------- /font/woff/PlusJakartaSans-LightItalic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff/PlusJakartaSans-LightItalic.woff -------------------------------------------------------------------------------- /font/woff2/PlusJakartaSans-ExtraBold.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff2/PlusJakartaSans-ExtraBold.woff2 -------------------------------------------------------------------------------- /font/woff2/PlusJakartaSans-Regular.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff2/PlusJakartaSans-Regular.woff2 -------------------------------------------------------------------------------- /font/ttf/PlusJakartaSans-ExtraBoldItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/ttf/PlusJakartaSans-ExtraBoldItalic.ttf -------------------------------------------------------------------------------- /font/woff/PlusJakartaSans-MediumItalic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff/PlusJakartaSans-MediumItalic.woff -------------------------------------------------------------------------------- /font/woff2/PlusJakartaSans-BoldItalic.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff2/PlusJakartaSans-BoldItalic.woff2 -------------------------------------------------------------------------------- /font/woff2/PlusJakartaSans-ExtraLight.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff2/PlusJakartaSans-ExtraLight.woff2 -------------------------------------------------------------------------------- /font/woff2/PlusJakartaSans-LightItalic.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff2/PlusJakartaSans-LightItalic.woff2 -------------------------------------------------------------------------------- /font/ttf/PlusJakartaSans-ExtraLightItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/ttf/PlusJakartaSans-ExtraLightItalic.ttf -------------------------------------------------------------------------------- /font/woff/PlusJakartaSans-ExtraBoldItalic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff/PlusJakartaSans-ExtraBoldItalic.woff -------------------------------------------------------------------------------- /font/woff/PlusJakartaSans-ExtraLightItalic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff/PlusJakartaSans-ExtraLightItalic.woff -------------------------------------------------------------------------------- /font/woff2/PlusJakartaSans-MediumItalic.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff2/PlusJakartaSans-MediumItalic.woff2 -------------------------------------------------------------------------------- /font/woff2/PlusJakartaSans-ExtraBoldItalic.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff2/PlusJakartaSans-ExtraBoldItalic.woff2 -------------------------------------------------------------------------------- /font/woff2/PlusJakartaSans-ExtraLightItalic.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sd0e/reddittracker/HEAD/font/woff2/PlusJakartaSans-ExtraLightItalic.woff2 -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # reddittracker 2 | 3 | Unfortunately, due to changes to the Reddit API, it is no longer possible to fetch the details of Reddit posts, and so Reddit Tracker no longer works. Sorry for any inconvenience. 4 | 5 | This repository has now been archived. 6 | -------------------------------------------------------------------------------- /browserconfig.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | #f2f2f2 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /sitemap.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | https://tracker.sebdoe.com/ 4 | 2022-11-13 5 | 1.0 6 | 7 | 8 | -------------------------------------------------------------------------------- /site.webmanifest: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Reddit Tracker", 3 | "short_name": "Reddit Tracker", 4 | "icons": [ 5 | { 6 | "src": "/android-chrome-192x192.png", 7 | "sizes": "192x192", 8 | "type": "image/png" 9 | }, 10 | { 11 | "src": "/android-chrome-512x512.png", 12 | "sizes": "512x512", 13 | "type": "image/png" 14 | } 15 | ], 16 | "theme_color": "#f2f2f2", 17 | "background_color": "#f2f2f2", 18 | "display": "standalone" 19 | } 20 | -------------------------------------------------------------------------------- /safari-pinned-tab.svg: -------------------------------------------------------------------------------- 1 | 2 | 4 | 7 | 8 | Created by potrace 1.14, written by Peter Selinger 2001-2017 9 | 10 | 12 | 16 | 20 | 31 | 32 | 33 | -------------------------------------------------------------------------------- /style.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: 'PlusJakartaSansMedium'; 3 | src: url('font/woff2/PlusJakartaSans-Regular.woff2') format('woff2'), 4 | url('font/woff/PlusJakartaSans-Regular.woff') format('woff'), 5 | url('font/ttf/PlusJakartaSans-Regular.ttf') format('truetype'); 6 | } 7 | 8 | @font-face { 9 | font-family: 'PlusJakartaSansBold'; 10 | src: url('font/woff2/PlusJakartaSans-Bold.woff2') format('woff2'), 11 | url('font/woff/PlusJakartaSans-Bold.woff') format('woff'), 12 | url('font/ttf/PlusJakartaSans-Bold.ttf') format('truetype'); 13 | } 14 | 15 | @font-face { 16 | font-family: 'PlusJakartaSansExtraBold'; 17 | src: url('font/woff2/PlusJakartaSans-ExtraBold.woff2') format('woff2'), 18 | url('font/woff/PlusJakartaSans-ExtraBold.woff') format('woff'), 19 | url('font/ttf/PlusJakartaSans-ExtraBold.ttf') format('truetype'); 20 | } 21 | 22 | :root { 23 | --themeColor: #333333; 24 | --lighterThemeColor: #4d4d4d; 25 | --backgroundColor: #f2f2f2; 26 | --columnBackgroundColor: #f2f2f2; 27 | } 28 | 29 | * { 30 | font-family: 'PlusJakartaSansBold', sans-serif; 31 | } 32 | 33 | html { 34 | margin: 0; 35 | border: 0; 36 | padding: 0; 37 | } 38 | 39 | body { 40 | margin: 0; 41 | border: 0; 42 | background-color: var(--backgroundColor); 43 | color: var(--themeColor); 44 | } 45 | 46 | header { 47 | position: fixed; 48 | top: 0; 49 | width: 100%; 50 | line-height: 4rem; 51 | vertical-align: middle; 52 | left: 0; 53 | right: 0; 54 | -webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.4); 55 | -moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.4); 56 | box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.4); 57 | background-color: var(--backgroundColor); 58 | z-index: 2; 59 | } 60 | 61 | .headerTitle { 62 | line-height: 3rem; 63 | vertical-align: middle; 64 | color: var(--themeColor); 65 | font-family: 'PlusJakartaSansMedium', sans-serif; 66 | margin-left: 1.5rem; 67 | font-size: 1.3rem; 68 | } 69 | 70 | .headerTextLeft { 71 | color: #d13c04; 72 | font-family: 'PlusJakartaSansBold', sans-serif; 73 | } 74 | 75 | .headerRight { 76 | float: right; 77 | margin-right: 1.5rem; 78 | } 79 | 80 | .darkModeToggleButton { 81 | cursor: pointer; 82 | transition: ease-in-out 0.1s; 83 | -webkit-touch-callout: none; 84 | -webkit-user-select: none; 85 | -khtml-user-select: none; 86 | -moz-user-select: none; 87 | -ms-user-select: none; 88 | user-select: none; 89 | } 90 | 91 | .darkModeToggleButton:hover { 92 | filter: opacity(0.8); 93 | } 94 | 95 | .material-icons.darkModeToggleIcon { 96 | line-height: 3rem; 97 | vertical-align: middle; 98 | } 99 | 100 | main { 101 | padding: 5.5rem 1.5rem 1.5rem 1.5rem; 102 | width: calc(100% - 3rem); 103 | } 104 | 105 | .redditPostInput { 106 | -webkit-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.25); 107 | -moz-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.25); 108 | box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.25); 109 | width: calc(100% - 3rem); 110 | border-radius: 0.8rem; 111 | letter-spacing: 0.05rem; 112 | background-color: var(--backgroundColor); 113 | color: var(--lighterThemeColor); 114 | font-size: 1rem; 115 | border: none; 116 | padding: 1rem 1.5rem; 117 | } 118 | 119 | .resultsHolder { 120 | margin-top: 3rem; 121 | width: calc(100% - 3rem); 122 | column-count: 2; 123 | column-gap: 3rem; 124 | -webkit-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.25); 125 | -moz-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.25); 126 | box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.25); 127 | padding: 1.5rem; 128 | border-radius: 0.8rem; 129 | } 130 | 131 | 132 | @media only screen and (max-width: 800px) { 133 | .resultsHolder { 134 | column-count: 1; 135 | } 136 | } 137 | 138 | .column { 139 | display: block; 140 | break-inside: avoid-column; 141 | margin-bottom: 1.5rem; 142 | } 143 | 144 | .column.shadow { 145 | background-color: var(--columnBackgroundColor); 146 | -webkit-box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.25); 147 | -moz-box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.25); 148 | box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.25); 149 | padding: 1.5rem; 150 | border-radius: 0.8rem; 151 | margin-bottom: 1.5rem; 152 | margin-top: 0.25rem; 153 | } 154 | 155 | #fullscreen { 156 | position: fixed; 157 | z-index: 100; 158 | width: calc(100% - 3rem); 159 | height: calc(100% - 3rem); 160 | top: 0; 161 | left: 0; 162 | background-color: var(--backgroundColor); 163 | } 164 | 165 | .titleHolder { 166 | display: block; 167 | margin-bottom: 0.8rem; 168 | line-height: 2rem; 169 | vertical-align: middle; 170 | } 171 | 172 | #postTitle { 173 | font-size: 1.6rem; 174 | text-decoration: none; 175 | color: inherit; 176 | transition: 0.2s ease-in-out; 177 | line-height: 2rem; 178 | vertical-align: middle; 179 | } 180 | 181 | #postTitle:hover { 182 | filter: opacity(0.8); 183 | } 184 | 185 | .material-icons.aboutIcon { 186 | line-height: 2rem; 187 | vertical-align: middle; 188 | margin-left: 0.5rem; 189 | font-size: 1.3rem; 190 | cursor: default; 191 | } 192 | 193 | .material-icons.archviedIcon { 194 | color: #e2be2c; 195 | } 196 | 197 | .material-icons.lockedIcon { 198 | color: #e2be2c; 199 | } 200 | 201 | .material-icons.deletedIcon { 202 | color: #cc0f2e; 203 | } 204 | 205 | .material-icons.removedIcon { 206 | color: #da1939; 207 | } 208 | 209 | .material-icons.adIcon { 210 | color: #ebca25; 211 | } 212 | 213 | #postFlair { 214 | display: block; 215 | margin-top: 1rem; 216 | margin-bottom: 1.5rem; 217 | padding: 0.25rem 0.5rem; 218 | border-radius: 0.25rem; 219 | font-size: 0.9rem; 220 | line-height: 1rem; 221 | vertical-align: middle; 222 | text-transform: uppercase; 223 | letter-spacing: 0.15rem; 224 | background-color: #8D8EEB; 225 | color: white; 226 | -webkit-box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.25); 227 | -moz-box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.25); 228 | box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.25); 229 | } 230 | 231 | .subredditHolder { 232 | display: inline-block; 233 | line-height: 1.6rem; 234 | vertical-align: middle; 235 | font-family: 'PlusJakartaSansMedium', sans-serif; 236 | filter: opacity(0.8); 237 | margin-bottom: 1.6rem; 238 | font-size: 1.2rem; 239 | } 240 | 241 | .letterR { 242 | line-height: 1.6rem; 243 | vertical-align: middle; 244 | font-family: 'PlusJakartaSansMedium', sans-serif; 245 | font-size: 1.2rem; 246 | } 247 | 248 | #postSubreddit { 249 | line-height: 1.6rem; 250 | vertical-align: middle; 251 | font-family: 'PlusJakartaSansBold', sans-serif; 252 | font-size: 1.2rem; 253 | text-decoration: none; 254 | color: inherit; 255 | transition: 0.2s ease-in-out; 256 | } 257 | 258 | #postSubreddit:hover { 259 | filter: opacity(0.6); 260 | } 261 | 262 | #postImage { 263 | width: 100%; 264 | max-height: 20rem; 265 | object-fit: cover; 266 | -webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.4); 267 | -moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.4); 268 | box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.4); 269 | border-radius: 0.8rem; 270 | } 271 | 272 | #postVideo { 273 | width: 100%; 274 | max-height: 20rem; 275 | object-fit: cover; 276 | -webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.4); 277 | -moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.4); 278 | box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.4); 279 | border-radius: 0.8rem; 280 | } 281 | 282 | .typeLink { 283 | color: var(--themeColor); 284 | } 285 | 286 | .columnTitle { 287 | display: block; 288 | margin-bottom: 1.5rem; 289 | font-size: 1.4rem; 290 | text-decoration: none; 291 | color: inherit; 292 | transition: 0.2s ease-in-out; 293 | line-height: 2rem; 294 | vertical-align: middle; 295 | } 296 | 297 | .statHolder { 298 | display: block; 299 | line-height: 1.5rem; 300 | vertical-align: middle; 301 | margin-bottom: 1rem; 302 | font-size: 1.2rem; 303 | overflow-y: hidden; 304 | position: relative; 305 | } 306 | 307 | .statHolder.link { 308 | text-decoration: none; 309 | color: inherit; 310 | transition: 0.2s ease-in-out; 311 | } 312 | 313 | .statHolder.link:hover { 314 | filter: opacity(0.8); 315 | } 316 | 317 | .material-icons.statIcon { 318 | display: inline-block; 319 | line-height: 1.4rem; 320 | vertical-align: middle; 321 | margin-right: 1.2rem; 322 | font-size: 1.5rem; 323 | cursor: default; 324 | } 325 | 326 | .extraText { 327 | line-height: 1.5rem; 328 | vertical-align: middle; 329 | font-family: 'PlusJakartaSansMedium', sans-serif; 330 | font-size: 1.2rem; 331 | } 332 | 333 | .extraText.bold { 334 | font-family: 'PlusJakartaSansBold', sans-serif; 335 | } 336 | 337 | .boldStat { 338 | display: inline-block; 339 | line-height: 1.5rem; 340 | vertical-align: middle; 341 | font-family: 'PlusJakartaSansBold', sans-serif; 342 | font-size: 1.2rem; 343 | z-index: 1; 344 | } 345 | 346 | .columnTitleHolder { 347 | display: block; 348 | color: #d13c04; 349 | filter: opacity(0.8); 350 | line-height: 2rem; 351 | vertical-align: middle; 352 | text-transform: uppercase; 353 | letter-spacing: 0.15rem; 354 | margin-bottom: 0.75rem; 355 | } 356 | 357 | .columnTitleHolder.fullscreen { 358 | display: none; 359 | } 360 | 361 | .material-icons.liveIcon { 362 | line-height: 2rem; 363 | vertical-align: middle; 364 | margin-right: 0.5rem; 365 | cursor: default; 366 | } 367 | 368 | .columnTitleRight { 369 | float: right; 370 | } 371 | 372 | .enterFullscreenButton { 373 | cursor: pointer; 374 | transition: 0.1s ease-in-out; 375 | } 376 | 377 | .enterFullscreenButton:hover { 378 | filter: opacity(0.6); 379 | } 380 | 381 | .material-icons.enterFullscreenIcon { 382 | line-height: 2rem; 383 | vertical-align: middle; 384 | font-size: 1.5rem; 385 | } 386 | 387 | .canvasContainer { 388 | height: 20rem; 389 | } 390 | 391 | .canvasContainer.fullscreen { 392 | height: 100%; 393 | } 394 | 395 | .exitFullscreenButton { 396 | z-index: 101; 397 | position: fixed; 398 | top: 1rem; 399 | right: 1rem; 400 | background-color: var(--backgroundColor); 401 | -webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.4); 402 | -moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.4); 403 | box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.4); 404 | padding: 1rem; 405 | line-height: 1.3rem; 406 | vertical-align: middle; 407 | border-radius: 0.5rem; 408 | transition: 0.1s ease-in-out; 409 | cursor: pointer; 410 | } 411 | 412 | .exitFullscreenButton:hover { 413 | filter: opacity(0.7); 414 | } 415 | 416 | .exitFullscreenIcon { 417 | line-height: 1.3rem; 418 | vertical-align: middle; 419 | } 420 | 421 | footer { 422 | padding: 1.5rem; 423 | padding-top: 0rem; 424 | } 425 | 426 | small { 427 | display: block; 428 | font-family: 'PlusJakartaSansMedium', sans-serif; 429 | padding-top: 1.5rem; 430 | } 431 | 432 | .footerAttribution { 433 | color: var(--themeColor); 434 | transition: 0.1s ease-in-out; 435 | } 436 | 437 | .footerAttribution:hover { 438 | filter: opacity(0.8); 439 | } 440 | 441 | .commentHolder { 442 | display: block; 443 | margin-top: 1.5rem; 444 | line-height: 1.5rem; 445 | vertical-align: middle; 446 | position: relative; 447 | } 448 | 449 | .commentNumberHolder { 450 | vertical-align: top; 451 | } 452 | 453 | .commentNumber { 454 | display: inline-block; 455 | padding: 0rem 0.55rem; 456 | background-color: #dbba07; 457 | color: #f2f2f2; 458 | border-radius: 1rem; 459 | line-height: 1.5rem; 460 | vertical-align: middle; 461 | margin-right: 1rem; 462 | -webkit-box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.25); 463 | -moz-box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.25); 464 | box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.25); 465 | cursor: default; 466 | } 467 | 468 | .commentNumber.one { 469 | background-color: #dbba07; 470 | } 471 | 472 | .commentNumber.two { 473 | background-color: #b5b0b0; 474 | } 475 | 476 | .commentNumber.three { 477 | background-color: #ad6824; 478 | } 479 | 480 | .commentContent { 481 | filter: opacity(0.8); 482 | display: inline-block; 483 | text-decoration: none; 484 | color: var(--themeColor); 485 | transition: 0.1s ease-in-out; 486 | } 487 | 488 | .commentContent:hover { 489 | filter: opacity(0.6); 490 | } 491 | 492 | .inlineLink { 493 | color: var(--themeColor); 494 | } 495 | 496 | .commentStatHolder { 497 | display: block; 498 | line-height: 1.2rem; 499 | vertical-align: middle; 500 | margin-top: 1rem; 501 | font-size: 1rem; 502 | overflow-y: hidden; 503 | position: relative; 504 | filter: opacity(0.8); 505 | } 506 | 507 | .material-icons.commentStatIcon { 508 | display: inline-block; 509 | line-height: 1.2rem; 510 | vertical-align: middle; 511 | margin-right: 1.2rem; 512 | font-size: 1.5rem; 513 | cursor: default; 514 | } 515 | 516 | .commentBoldStat { 517 | display: inline-block; 518 | line-height: 1.2rem; 519 | vertical-align: middle; 520 | font-family: 'PlusJakartaSansBold', sans-serif; 521 | font-size: 1rem; 522 | z-index: 1; 523 | } 524 | 525 | #graphHelpIcon { 526 | line-height: 2rem; 527 | vertical-align: middle; 528 | font-size: 1.25rem; 529 | color: var(--themeColor); 530 | margin-left: 0.5rem; 531 | } -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Reddit Tracker | Live Reddit Post Statistics 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 | 46 | 47 | 48 | 49 | 50 |
51 | Reddit Tracker 52 |
53 | dark_mode 54 |
55 |
56 |
57 |

Unfortunately, due to changes to the Reddit API, it is no longer possible to fetch the details of Reddit posts, and so Reddit Tracker no longer works. Sorry for any inconvenience.

58 | 59 |
143 | 161 | 162 | 163 | -------------------------------------------------------------------------------- /script.js: -------------------------------------------------------------------------------- 1 | const redditRegex = /^(http(?:s?):\/\/(?:www\.|old\.)?reddit.com\/(?:r|u|user)\/([a-zA-Z0-9_-]{3,})*\/comments\/([a-zA-Z0-9]{6}))/g; 2 | const linkRegex = /(http|ftp|https):\/\/([\w_-]+(?:(?:\.[\w_-]+)+))([\w.,@?^=%&:/~+#-]*[\w@?^=%&/~+#-])?/g; 3 | 4 | window['lastTime'] = null; 5 | 6 | const proxy = 'https://crossrun.onrender.com/'; 7 | 8 | const getRedditJson = url => { 9 | return url + '.json'; 10 | } 11 | 12 | const createTextPreview = (text, num = 200) => { 13 | if (text.length >= num) { 14 | return text.substring(0, num - 3) + '...'; 15 | } else { 16 | return text; 17 | } 18 | } 19 | 20 | // Pings the proxy to turn it on, decreasing response time once the user enters a valid URL 21 | const pingProxy = () => $.get(proxy); 22 | 23 | pingProxy(); 24 | 25 | // Gets the comment with the most upvotes from an array of comments 26 | const getTopCommentIndex = arr => { 27 | window.tempIndex = 0; 28 | window.topVal = ''; 29 | window.exists = false; 30 | for (let idx = 0; idx < arr.length; idx++) { 31 | if (arr[idx].kind === 't1') { 32 | window.exists = true; 33 | const data = arr[idx].data; 34 | if (data.ups > window.topVal || window.topVal === '') { 35 | window.topVal = data.ups; 36 | window.tempIndex = idx; 37 | } 38 | } 39 | } 40 | if (window.exists) { 41 | return window.tempIndex; 42 | } else { 43 | return -1; 44 | } 45 | } 46 | 47 | // Fetches the latest data about the post from the Reddit API. 48 | const refreshData = () => { 49 | $('.resultsHolder').fadeIn(100); 50 | const redditURL = window.redditURL; 51 | const url = proxy + getRedditJson(redditURL); 52 | $.get(getRedditJson(url), res => { 53 | // Only shows fetched data if the input's value's not empty and the URL is the same as before the fetch. 54 | if ($('#redditPostInput').val() !== '' && redditURL === window.redditURL) { 55 | $('.loading').hide(); 56 | $('.resultsHolder').fadeIn(100); 57 | $('#postFlair').hide(); 58 | $('#postImage').hide(); 59 | $('#postImage').css('margin-bottom', '0'); 60 | $('#gallery').hide(); 61 | $('#video').hide(); 62 | $('#link').hide(); 63 | $('#textContents').hide(); 64 | $('.archivedIcon').hide(); 65 | $('.lockedIcon').hide(); 66 | $('.deletedIcon').hide(); 67 | $('.removedIcon').hide(); 68 | $('.adIcon').hide(); 69 | $('.commentHolder').hide(); 70 | $('#noComments').hide(); 71 | $('#noComments').text('This post has no comments.'); 72 | 73 | // Post Data 74 | const data = res[0].data.children[0].data; 75 | const title = data.title; 76 | $('#postTitle').text(title); 77 | $('#postTitle').attr('href', window.redditURL); 78 | tippy('#postTitle', { 79 | content: 'Click to view post on Reddit', 80 | }); 81 | const subreddit = data.subreddit; 82 | if (!subreddit.startsWith('u_')) { 83 | // Subreddit 84 | $('#postTypePrefix').text('r/'); 85 | $('#postSubreddit').text(subreddit); 86 | $('#postSubreddit').attr('href', 'https://www.reddit.com/r/' + subreddit + '/'); 87 | } else { 88 | // User 89 | $('#postTypePrefix').text('u/'); 90 | $('#postSubreddit').text(subreddit.slice(2)); 91 | $('#postSubreddit').attr('href', 'https://www.reddit.com/u/' + subreddit.slice(2) + '/'); 92 | } 93 | const postURL = data.url; 94 | const text = data.selftext; 95 | const isVideo = data.is_video; 96 | if (postURL.includes('gallery')) { 97 | // Gallery 98 | $('#gallery').attr('href', postURL); 99 | $('#gallery').show(); 100 | } else if (text == '' && isVideo == false) { 101 | const hostname = new URL(postURL).hostname; 102 | if (hostname !== 'i.redd.it' && hostname !== 'external-preview.redd.it' && hostname !== 'i.imgur.com') { 103 | // Link 104 | $('#link').text(createTextPreview(postURL, 35)); 105 | $('#link').attr('href', postURL); 106 | $('#link').show(); 107 | } else { 108 | // Image 109 | $('#postImage').attr('alt', title); 110 | $('#postImage').attr('src', postURL); 111 | $('#postImage').show(); 112 | tippy('#postImage', { 113 | content: title, 114 | }); 115 | } 116 | } else if (text != '') { 117 | // Text 118 | $('#textContents').text(createTextPreview(text)); 119 | $('#textContents').show(); 120 | } else if (isVideo == true) { 121 | // Video 122 | $('#video').attr('href', postURL); 123 | $('#video').show(); 124 | } 125 | const user = data.author; 126 | $('#postUser').text(user); 127 | $('#postUserHolder').attr('href', 'https://www.reddit.com/u/' + user + '/'); 128 | tippy('#postUser', { 129 | content: user, 130 | }); 131 | const score = data.ups; 132 | resetText('#postScore', score); 133 | const upvoteRatio = data.upvote_ratio; 134 | // Estimates the number of upvotes from the upvote ratio by adding the score to the estimated number of downvotes. 135 | const estUpvotes = ((score * (1 - upvoteRatio)) + score).toFixed(); 136 | resetText('#postUpvotes', estUpvotes); 137 | // Estimates the number of downvotes by working out the percentage from the upvote ratio subtracted by one (the ratio for downvotes). 138 | const estDownvotes = (score * (1 - upvoteRatio)).toFixed(); 139 | resetText('#postDownvotes', estDownvotes); 140 | const awards = data.total_awards_received; 141 | resetText('#postAwards', awards); 142 | const numComments = data.num_comments; 143 | resetText('#postComments', numComments); 144 | const upvotePercentage = data.upvote_ratio * 100; 145 | resetText('#postUpvotePercentage', upvotePercentage); 146 | // (upvotes s^{-1}) 147 | const derivative = window['lastTime'] !== null && window['lastTime'] !== undefined ? ((score - window['lastScore'])/((new Date().getTime() - window['lastTime'])/1000)) : null; 148 | const archived = data.archived; 149 | if (archived) { 150 | $('.archviedIcon').show(); 151 | } 152 | const locked = data.locked; 153 | if (locked) { 154 | $('.lockedIcon').show(); 155 | $('#noComments').text("This post is locked. There are currently no comments, and it's unlikely there will be any."); 156 | } 157 | const removedString = data.removed_by_category; 158 | if (removedString === 'deleted') { 159 | // User deleted 160 | $('.deletedIcon').show(); 161 | } else if (removedString === 'moderator') { 162 | // Moderator removed 163 | $('.removedIcon').show(); 164 | } 165 | const flairText = data.link_flair_text; 166 | if (flairText !== null) { 167 | $('#postFlair').text(flairText); 168 | if (data.link_flair_background_color === '') { 169 | $('#postFlair').css('background-color', '#d4d4d4'); 170 | } else { 171 | $('#postFlair').css('background-color', data.link_flair_background_color); 172 | } 173 | if (data.link_flair_text_color === 'light') { 174 | $('#postFlair').css('color', '#f2f2f2'); 175 | } else { 176 | $('#postFlair').css('color', '#333333'); 177 | } 178 | $('#postFlair').show(); 179 | } 180 | 181 | if (data.mobile_ad_url !== undefined) { 182 | // Is an advertisement. 183 | if (data.mobile_ad_url !== '') { 184 | // Has an image 185 | const adImageURL = data.mobile_ad_url; 186 | $('#postImage').attr('alt', title); 187 | $('#postImage').attr('src', adImageURL); 188 | $('#postImage').css('margin-bottom', '1rem'); 189 | $('#postImage').show(); 190 | tippy('#postImage', { 191 | content: title, 192 | }); 193 | } 194 | $('.adIcon').show(); 195 | } 196 | 197 | const date = new Date(); 198 | const currentTime = `${parseNumber(date.getHours())}:${parseNumber(date.getMinutes())}`; 199 | addData('Score', currentTime, score); 200 | addData('Estimated Upvotes', currentTime, estUpvotes); 201 | addData('Estimated Downvotes', currentTime, estDownvotes); 202 | addData('Awards', currentTime, awards); 203 | addData('Comments', currentTime, numComments); 204 | addData('Upvote Percentage', currentTime, upvotePercentage); 205 | if (derivative !== null) addData('Score Derivative (Score Change Per Second)', currentTime, derivative); 206 | 207 | // Comment Data 208 | let comments = res[1].data.children; 209 | 210 | if (comments.length !== 0) { 211 | const firstTopCommentIndex = getTopCommentIndex(comments); 212 | if (firstTopCommentIndex !== -1) { 213 | comments[firstTopCommentIndex].kind = 'used'; 214 | } 215 | const secondTopCommentIndex = getTopCommentIndex(comments); 216 | if (secondTopCommentIndex !== -1) { 217 | comments[secondTopCommentIndex].kind = 'used'; 218 | } 219 | const thirdTopCommentIndex = getTopCommentIndex(comments); 220 | if (thirdTopCommentIndex !== -1) { 221 | comments[thirdTopCommentIndex].kind = 'used'; 222 | } 223 | 224 | if (firstTopCommentIndex !== -1) { 225 | const commentText = comments[firstTopCommentIndex].data.body; 226 | $('#commentOneText').html(createTextPreview(commentText)); 227 | const commentLink = window.redditURL + 'comment/' + comments[firstTopCommentIndex].data.id; 228 | $('#commentOneText').attr('href', commentLink); 229 | tippy('#commentOneText', { 230 | content: 'Click to view comment on Reddit', 231 | }); 232 | resetText('#commentOneScore', comments[firstTopCommentIndex].data.ups); 233 | resetText('#commentOneAwards', comments[firstTopCommentIndex].data.total_awards_received); 234 | $('#commentHolderOne').show(); 235 | } 236 | 237 | if (secondTopCommentIndex !== -1) { 238 | const commentText = comments[secondTopCommentIndex].data.body 239 | $('#commentTwoText').html(createTextPreview(commentText)); 240 | const commentLink = window.redditURL + 'comment/' + comments[secondTopCommentIndex].data.id; 241 | $('#commentTwoText').attr('href', commentLink); 242 | tippy('#commentTwoText', { 243 | content: 'Click to view comment on Reddit', 244 | }); 245 | resetText('#commentTwoScore', comments[secondTopCommentIndex].data.ups); 246 | resetText('#commentTwoAwards', comments[secondTopCommentIndex].data.total_awards_received); 247 | $('#commentHolderTwo').show(); 248 | } 249 | 250 | if (thirdTopCommentIndex !== -1) { 251 | const commentText = comments[thirdTopCommentIndex].data.body; 252 | $('#commentThreeText').html(createTextPreview(commentText)); 253 | const commentLink = window.redditURL + 'comment/' + comments[thirdTopCommentIndex].data.id; 254 | $('#commentThreeText').attr('href', commentLink); 255 | tippy('#commentThreeText', { 256 | content: 'Click to view comment on Reddit', 257 | }); 258 | resetText('#commentThreeScore', comments[thirdTopCommentIndex].data.ups); 259 | resetText('#commentThreeAwards', comments[thirdTopCommentIndex].data.total_awards_received); 260 | $('#commentHolderThree').show(); 261 | } 262 | } else { 263 | $('#noComments').show(); 264 | } 265 | 266 | $('.column').show(); 267 | 268 | window['lastTime'] = new Date().getTime(); 269 | window['lastScore'] = score; 270 | } else { 271 | $('.resultsHolder').hide(); 272 | } 273 | }); 274 | } 275 | 276 | const removeEmojis = str => { 277 | return str.split(':').pop(); 278 | } 279 | 280 | // Adds a leading zero to a number if it only has one number 281 | const parseNumber = num => { 282 | num = num.toString(); 283 | if (num.length === 1) { 284 | return '0' + num; 285 | } else { 286 | return num; 287 | } 288 | } 289 | 290 | // Prevents all animations from happening at once when the visibility changes. 291 | window.isVisible = true; 292 | 293 | document.addEventListener('visibilitychange', () => { 294 | if (window.isVisible === true) { 295 | window.isVisible = false; 296 | } else { 297 | window.isVisible = true; 298 | } 299 | }); 300 | 301 | // Creates an animation which either goes up or down depending on whether the value increases or decreases. 302 | const resetText = (selector, newVal, type = 'text') => { 303 | // System to prevent all changes animating at once when you change back to page. 304 | const currentTime = new Date().getTime(); 305 | if (currentTime - window.timeSinceLast[selector] < 4000) { 306 | window.timeSinceLast[selector] = currentTime; 307 | return; 308 | } 309 | window.timeSinceLast[selector] = currentTime; 310 | 311 | if (window.isVisible) { 312 | let isGreater; 313 | const oldVal = $(selector).text(); 314 | if (Number(newVal) !== NaN) { 315 | // Is a number 316 | isGreater = Number(oldVal) < Number(newVal); 317 | const isSmaller = Number(oldVal) > Number(newVal); 318 | const isSame = oldVal == newVal; 319 | if (oldVal == '') { 320 | isGreater = true; 321 | } 322 | if (isGreater) { 323 | $(selector).css('position', 'absolute'); 324 | $(selector).animate( 325 | { marginTop: '-=2rem' }, { 326 | complete: () => { 327 | if (type === 'text') { 328 | $(selector).text(newVal); 329 | } else if (type === 'html') { 330 | $(selector).html(newVal); 331 | } 332 | $(selector).css('margin-top', '2.2rem'); 333 | $(selector).animate({ marginTop: '-=2rem' }, 500); 334 | return; 335 | } 336 | }); 337 | } else if (isSame) { 338 | if (type === 'text') { 339 | $(selector).text(newVal); 340 | } else if (type === 'html') { 341 | $(selector).html(newVal); 342 | } 343 | return; 344 | } else if (isSmaller) { 345 | $(selector).css('position', 'absolute'); 346 | $(selector).animate( 347 | { marginTop: '+=2rem' }, { 348 | complete: () => { 349 | if (type === 'text') { 350 | $(selector).text(newVal); 351 | } else if (type === 'html') { 352 | $(selector).html(newVal); 353 | } 354 | $(selector).css('margin-top', '-1.8rem'); 355 | $(selector).animate({ marginTop: '+=2rem' }, 500); 356 | return; 357 | } 358 | }); 359 | } 360 | } else { 361 | $(selector).css('position', 'absolute'); 362 | $(selector).animate( 363 | { marginTop: '-=2rem' }, { 364 | complete: () => { 365 | if (type === 'text') { 366 | $(selector).text(newVal); 367 | } else if (type === 'html') { 368 | $(selector).html(newVal); 369 | } 370 | $(selector).css('margin-top', '2.2rem'); 371 | $(selector).animate({ marginTop: '-=2rem' }, 500); 372 | return; 373 | } 374 | }); 375 | } 376 | } else { 377 | if (type === 'text') { 378 | $(selector).text(newVal); 379 | } else if (type === 'html') { 380 | $(selector).html(newVal); 381 | } 382 | return; 383 | } 384 | } 385 | 386 | // Chart 387 | 388 | const addData = (set, label, data) => { 389 | if (set === 'Score') { 390 | liveChart.data.labels.push(label); 391 | } 392 | 393 | liveChart.data.datasets.forEach((dataset) => { 394 | if (dataset.label === set) { 395 | dataset.data.push(data); 396 | } 397 | }); 398 | 399 | liveChart.update(); 400 | } 401 | 402 | const clearChart = () => { 403 | liveChart.data.labels = []; 404 | 405 | liveChart.data.datasets.forEach((dataset) => { 406 | dataset.data = []; 407 | }); 408 | 409 | liveChart.update(); 410 | } 411 | 412 | var labels = []; 413 | 414 | var data = { 415 | labels: labels, 416 | datasets: [{ 417 | label: 'Score', 418 | backgroundColor: '#333333', 419 | borderColor: '#333333', 420 | lineTension: 0.6, 421 | data: [], 422 | hidden: false, 423 | }, { 424 | label: 'Estimated Upvotes', 425 | backgroundColor: '#d13c04', 426 | borderColor: '#d13c04', 427 | lineTension: 0.6, 428 | data: [], 429 | hidden: false, 430 | }, { 431 | label: 'Estimated Downvotes', 432 | backgroundColor: '#8d8eeb', 433 | borderColor: '#8d8eeb', 434 | lineTension: 0.6, 435 | data: [], 436 | hidden: true, 437 | }, { 438 | label: 'Awards', 439 | backgroundColor: '#46c92e', 440 | borderColor: '#46c92e', 441 | lineTension: 0.6, 442 | data: [], 443 | hidden: true, 444 | }, { 445 | label: 'Comments', 446 | backgroundColor: '#78800E', 447 | borderColor: '#78800E', 448 | lineTension: 0.6, 449 | data: [], 450 | hidden: true, 451 | }, { 452 | label: 'Upvote Percentage', 453 | backgroundColor: '#bf37a6', 454 | borderColor: '#bf37a6', 455 | lineTension: 0.6, 456 | data: [], 457 | hidden: true, 458 | }, { 459 | label: 'Score Derivative (Score Change Per Second)', 460 | backgroundColor: '#ab6733', 461 | borderColor: '#ab6733', 462 | lineTension: 0.6, 463 | data: [], 464 | hidden: true, 465 | }] 466 | }; 467 | 468 | const config = { 469 | type: 'line', 470 | data, 471 | options: { 472 | responsive: true, 473 | maintainAspectRatio: false, 474 | elements: { 475 | point: { 476 | radius: 2.5, 477 | }, 478 | }, 479 | }, 480 | }; 481 | 482 | var liveChart = new Chart( 483 | document.getElementById('liveChart'), config 484 | ); 485 | 486 | const exitFullscreenMode = () => { 487 | $('.exitFullscreenButton').hide(); 488 | $('.canvasContainer').parent().removeAttr('id'); 489 | $('.columnTitleHolder').removeClass('fullscreen'); 490 | $('.canvasContainer').removeClass('fullscreen'); 491 | if (document.exitFullscreen) { 492 | document.exitFullscreen(); 493 | } else if (document.webkitExitFullscreen) { 494 | document.webkitExitFullscreen(); 495 | } else if (document.msExitFullscreen) { 496 | document.msExitFullscreen(); 497 | } 498 | } 499 | 500 | const enterFullscreenMode = () => { 501 | $('.exitFullscreenButton').show(); 502 | $('.canvasContainer').parent().attr('id', 'fullscreen'); 503 | $('.columnTitleHolder').addClass('fullscreen'); 504 | $('.canvasContainer').addClass('fullscreen'); 505 | if (document.documentElement.requestFullscreen) { 506 | document.documentElement.requestFullscreen(); 507 | } else if (document.documentElement.webkitRequestFullscreen) { 508 | document.documentElement.webkitRequestFullscreen(); 509 | } else if (document.documentElement.msRequestFullscreen) { 510 | document.documentElement.msRequestFullscreen(); 511 | } 512 | } 513 | 514 | const getURLParameter = name => { 515 | return decodeURIComponent((new RegExp("[?|&]" + name + "=" + "([^&;]+?)(&|#|;|$)").exec(location.search) || [null, ""])[1].replace(/\+/g, "%20")) || null; 516 | } 517 | 518 | const startReloader = url => { 519 | $('.loading').show(); 520 | clearChart(); 521 | clearInterval(window.interval); 522 | window.timeSinceLast = {}; 523 | window.postData = []; 524 | window['lastTime'] = null; 525 | if (url !== '') { 526 | if (redditRegex.test(url)) { 527 | // url = url.match(redditRegex)[0] + '/'; 528 | window.redditURL = url; 529 | clearInterval(window.interval); 530 | refreshData(); 531 | } else { 532 | $('.column').hide(); 533 | } 534 | window.interval = setInterval(refreshData, 7000); 535 | } else { 536 | clearInterval(window.interval); 537 | $('.column').hide(); 538 | $('.resultsHolder').hide(); 539 | } 540 | } 541 | 542 | $(document).ready(() => { 543 | tippy('.archviedIcon', { 544 | content: 'Archived', 545 | }); 546 | 547 | tippy('.lockedIcon', { 548 | content: 'Locked', 549 | }); 550 | 551 | tippy('.deletedIcon', { 552 | content: 'Deleted by user', 553 | }); 554 | 555 | tippy('.removedIcon', { 556 | content: 'Removed by the moderators', 557 | }); 558 | 559 | tippy('.adIcon', { 560 | content: 'Advertisement', 561 | }); 562 | 563 | tippy('#userIcon', { 564 | content: 'User', 565 | }); 566 | 567 | tippy('#scoreIcon', { 568 | content: 'Score', 569 | }); 570 | 571 | tippy('#estUpvotesIcon', { 572 | content: 'Estimated Upvotes', 573 | }); 574 | 575 | tippy('#estDownvotesIcon', { 576 | content: 'Estimated Downvotes', 577 | }); 578 | 579 | tippy('#awardsIcon', { 580 | content: 'Awards', 581 | }); 582 | 583 | tippy('#commentsIcon', { 584 | content: 'Comments', 585 | }); 586 | 587 | tippy('#percentageIcon', { 588 | content: 'Upvote Percentage', 589 | }); 590 | 591 | tippy('#postFlair', { 592 | content: 'Flair', 593 | }); 594 | 595 | tippy('.subredditHolder', { 596 | content: 'Subreddit', 597 | }); 598 | 599 | tippy('.enterFullscreenButton', { 600 | content: 'Fullscreen', 601 | }); 602 | 603 | tippy('.exitFullscreenButton', { 604 | content: 'Exit Fullscreen', 605 | }); 606 | 607 | tippy('.liveIcon', { 608 | content: 'Live Score', 609 | }); 610 | 611 | tippy('.commentNumber.one', { 612 | content: 'Top Comment', 613 | }); 614 | 615 | tippy('.commentNumber.two', { 616 | content: 'Second Top Comment', 617 | }); 618 | 619 | tippy('.commentNumber.three', { 620 | content: 'Third Top Comment', 621 | }); 622 | 623 | tippy('#graphHelpIcon', { 624 | content: 'Click on the items at the top to add or remove them from the graph', 625 | }); 626 | }); 627 | 628 | const execMode = mode => { 629 | if (mode === 'dark') { 630 | // Changing to dark. 631 | window.darkMode = true; 632 | document.documentElement.style.setProperty('--themeColor', '#f2f2f2'); 633 | document.documentElement.style.setProperty('--lighterThemeColor', '#e0e0e0'); 634 | document.documentElement.style.setProperty('--backgroundColor', '#1f1f1f'); 635 | document.documentElement.style.setProperty('--columnBackgroundColor', 'rgba(255, 255, 255, 0.02)'); 636 | Chart.defaults.color = '#f2f2f2'; 637 | liveChart.update(); 638 | $('#darkModeToggleIcon').text('light_mode'); 639 | $('#darkModeToggleIcon').css('color', '#efb701'); 640 | } else { 641 | // Changing to light. 642 | window.darkMode = false; 643 | document.documentElement.style.setProperty('--themeColor', '#333333'); 644 | document.documentElement.style.setProperty('--lighterThemeColor', '#4d4d4d'); 645 | document.documentElement.style.setProperty('--backgroundColor', '#f2f2f2'); 646 | document.documentElement.style.setProperty('--columnBackgroundColor', '#f2f2f2'); 647 | Chart.defaults.color = '#333333'; 648 | liveChart.update(); 649 | $('#darkModeToggleIcon').text('dark_mode'); 650 | $('#darkModeToggleIcon').css('color', '#333333'); 651 | } 652 | } 653 | 654 | const toggleDarkMode = mode => { 655 | if (mode === undefined) { 656 | if (window.darkMode === true) { 657 | execMode('light'); 658 | } else { 659 | execMode('dark'); 660 | } 661 | } else { 662 | if (mode === 'dark') { 663 | execMode('dark'); 664 | } else { 665 | execMode('light'); 666 | } 667 | } 668 | } 669 | 670 | if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) { 671 | toggleDarkMode('dark'); 672 | } 673 | --------------------------------------------------------------------------------