☰

DigDig.IO Server Selector

Server selector for digdig.io. Double click to copy, single click to download.

当前为 2021-07-21 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         DigDig.IO Server Selector
  3. // @namespace    http://tampermonkey.net/
  4. // @version      0.2.8
  5. // @description  Server selector for digdig.io. Double click to copy, single click to download.
  6. // @author       Zertalious (Zert)
  7. // @match        *://digdig.io/*
  8. // @icon         data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
  9. // @grant        unsafeWindow
  10. // @grant        GM_addStyle
  11. // ==/UserScript==
  12.  
  13. GM_addStyle( `
  14.  
  15. body {
  16. 	margin: 0;
  17. 	overflow: hidden;
  18. 	font-family: 'Ubuntu';
  19. 	text-shadow: 1px 0 #000, -1px 0 #000, 0 1px #000, 0 -1px #000, 1px 1px #000, -1px -1px #000;
  20. 	color: #fff;
  21. 	width: 100vw;
  22. 	height: 100vh;
  23. }
  24.  
  25. .pointer-lock canvas {
  26. 	pointer-events: none;
  27. }
  28.  
  29. .pointer-lock:after {
  30. 	content: 'Pointer is locked. Press [X] to unlock.';
  31. 	position: absolute;
  32. 	left: 50%;
  33. 	top: 10px;
  34. 	transform: translate(-50%, 0);
  35. 	background: rgb(233 30 30 / 60%);
  36. 	padding: 2px 5px;
  37. 	text-shadow: none;
  38. 	z-index: 999;
  39. }
  40.  
  41. .group {
  42. 	position: absolute;
  43. 	right: 15px;
  44. 	bottom: 15px;
  45. 	display: flex;
  46. 	flex-direction: column;
  47. }
  48.  
  49. .group > * {
  50. 	margin-bottom: 8px;
  51. }
  52.  
  53. .group > *:last-child {
  54. 	margin-bottom: 0;
  55. }
  56.  
  57. .btn {
  58. 	background: #aeaeae;
  59. 	font-size: 2.25em;
  60. 	text-align: center;
  61. 	padding: 0.2em;
  62. 	cursor: pointer;
  63. 	box-shadow: inset 0 0 0 0.1em rgba(0, 0, 0, 0.25);
  64. 	border-radius: 0.1em;
  65. 	position: relative;
  66. 	user-select: none;
  67. }
  68.  
  69. .btn:before {
  70. 	content: ' ';
  71. 	position: absolute;
  72. 	top: 0.1em;
  73. 	left: 0.1em;
  74. 	width: calc(100% - 0.2em);
  75. 	height: calc(100% - 0.2em);
  76. 	background: transparent;
  77. }
  78.  
  79. .btn:hover:before {
  80. 	background: hsla(0, 0%, 100%, 0.25);
  81. }
  82.  
  83. .btn:active:before {
  84. 	background: rgba(0, 0, 0, 0.1);
  85. }
  86.  
  87. .btn i {
  88. 	text-shadow: none;
  89. }
  90.  
  91. [tooltip] {
  92. 	position: relative;
  93. }
  94.  
  95. [tooltip]:after {
  96. 	content: attr(tooltip);
  97. 	font-size: 0.9rem;
  98. 	position: absolute;
  99. 	right: 100%;
  100. 	top: 50%;
  101. 	transform: translate(-10px, -50%);
  102. 	white-space: nowrap;
  103. 	pointer-events: none;
  104. 	background: rgba(0, 0, 0, 0.5);
  105. 	padding: 0.25em 0.4em;
  106. 	border-radius: 0.2em;
  107. 	opacity: 0;
  108. 	transition: 0.2s;
  109. }
  110.  
  111. [tooltip]:not(.disabled):hover:after {
  112. 	opacity: 1;
  113. }
  114.  
  115. [tooltip]:is(.force-tooltip):after {
  116. 	opacity: 1 !important;
  117. }
  118.  
  119. .dialog {
  120. 	position: absolute;
  121. 	right: 85px;
  122. 	bottom: 15px;
  123. 	background: #aeaeae;
  124. 	padding: 0.75em;
  125. 	border-radius: 0.3em;
  126. 	box-shadow: inset 0 0 0 0.3em rgba(0, 0, 0, 0.25);
  127. 	width: 300px;
  128. 	transition: 0.2s;
  129. }
  130.  
  131. .dialog > * {
  132. 	margin-bottom: 5px;
  133. }
  134.  
  135. .dialog > *:last-child {
  136. 	margin-bottom: 0;
  137. }
  138.  
  139. .dialog.disabled {
  140. 	transform: translate(0, calc(100% + 15px));
  141. }
  142.  
  143. .dialog .btn {
  144. 	font-size: 1.25rem;
  145. 	background: #bb5555;
  146. }
  147.  
  148. .title {
  149. 	font-size: 1.5em;
  150. 	text-align: center;
  151. }
  152.  
  153. .spinner {
  154. 	margin: 10px auto;
  155. 	width: 60px;
  156. 	height: 60px;
  157. 	border: 10px solid transparent;
  158. 	border-top-color: rgba(0, 0, 0, 0.3);
  159. 	border-radius: 50%;
  160. 	animation: spin 0.5s infinite;
  161. }
  162.  
  163. .option {
  164. 	background: rgba(0, 0, 0, 0.1);
  165. 	padding: 0.5em 0.75em;
  166. 	border-radius: 0.25em;
  167. 	cursor: pointer;
  168. }
  169.  
  170. .option.active {
  171. 	box-shadow: inset 0 0 0 0.15em rgba(0, 0, 0, 0.2);
  172. }
  173.  
  174. @keyframes spin {
  175. 	from {
  176. 		transform: rotate(0);
  177. 	}
  178.  
  179. 	to {
  180. 		transform: rotate(360deg);
  181. 	}
  182. }
  183.  
  184. ` );
  185.  
  186. const temp = document.createElement( 'div' );
  187.  
  188. temp.innerHTML += `
  189.  
  190. <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"/>
  191. <div class="group">
  192. 	<div class="btn leaderboard-btn" tooltip="Capture leaderboard [G]">
  193. 		<i class="fa fa-trophy"></i>
  194. 	</div>
  195. 	<div class="btn screenshot-btn" tooltip="Take screenshot [F]">
  196. 		<i class="fa fa-camera"></i>
  197. 	</div>
  198. 	<div class="btn servers-btn" tooltip="Servers">
  199. 		<i class="fa fa-globe"></i>
  200. 	</div>
  201. </div>
  202. <div class="dialog disabled">
  203. 	<div class="title">Servers</div>
  204. 	<div class="spinner"></div>
  205. 	<div class="btn refresh-btn">refresh</div>
  206. 	<div class="btn close-btn">close</div>
  207. 	</div>
  208. </div>
  209.  
  210. `;
  211.  
  212. while ( temp.children.length > 0 ) {
  213.  
  214. 	document.body.appendChild( temp.children[ 0 ] );
  215.  
  216. }
  217.  
  218. temp.innerHTML = '';
  219.  
  220. const spinner = document.querySelector( '.spinner' );
  221.  
  222. let selectedServerId = new URLSearchParams( document.location.search.substring( 1 ) ).get( 'server' );
  223.  
  224. if ( selectedServerId ) {
  225.  
  226. 	const idFromUrl = selectedServerId;
  227.  
  228. 	const interval = setInterval( function () {
  229.  
  230. 		if ( idFromUrl !== selectedServerId ) {
  231.  
  232. 			clearInterval( interval );
  233.  
  234. 		}
  235.  
  236. 		try {
  237.  
  238. 			connect( idFromUrl );
  239.  
  240. 			clearInterval( interval );
  241.  
  242. 		} catch ( e ) { }
  243.  
  244. 	}, 50 );
  245.  
  246. }
  247.  
  248. ( async function () {
  249.  
  250. 	await fetchServers( 'ffa' ); 
  251. 	await fetchServers( 'teams' );
  252.  
  253. 	spinner.style.display = 'none';
  254.  
  255. } )();
  256.  
  257. const serverIds = {};
  258.  
  259. const refreshBtn = document.querySelector( '.refresh-btn' );
  260.  
  261. async function fetchServers( mode ) {
  262.  
  263. 	const response = await fetch( 'https://api.n.m28.io/endpoint/digdig-' + mode + '/findEach' );
  264. 	const json = await response.json();
  265.  
  266. 	for ( let key in json.servers ) {
  267.  
  268. 		const id = json.servers[ key ].id;
  269.  
  270. 		if ( ! serverIds[ id ] ) {
  271.  
  272. 			serverIds[ id ] = true;
  273.  
  274. 			const div = document.createElement( 'div' );
  275. 			div.classList.add( 'option' );
  276. 			div.innerHTML = mode + '_' + key.split( '-' )[ 1 ] + '_' + id;
  277. 			div.setAttribute( 'data-id', id );
  278.  
  279. 			dialog.insertBefore( div, refreshBtn );
  280.  
  281. 			div.onclick = function () {
  282.  
  283. 				connect( id );
  284.  
  285. 			}
  286.  
  287. 			if ( ! selectedServerId || selectedServerId === id ) {
  288.  
  289. 				div.click();
  290.  
  291. 			}
  292.  
  293. 		}
  294.  
  295. 	}
  296.  
  297. }
  298.  
  299. function connect( id ) {
  300.  
  301. 	selectedServerId = id;
  302.  
  303. 	cp6.forceServerID( selectedServerId );
  304.  
  305. 	onServerChange();
  306. 		
  307. }
  308.  
  309. unsafeWindow.console.log = new Proxy( unsafeWindow.console.log, {
  310. 	apply( target, thisArgs, [ text ] ) {
  311.  
  312. 		if ( typeof text === 'string' && text.startsWith( 'Connecting to ' ) ) {
  313.  
  314. 			const id = text.split('Connecting to ')[ 1 ].split( '.' )[ 0 ];
  315.  
  316. 			if ( id !== selectedServerId ) {
  317.  
  318. 				selectedServerId = id;
  319.  
  320. 				onServerChange();
  321.  
  322. 			}
  323.  
  324. 		}
  325.  
  326. 		return Reflect.apply( ...arguments );
  327.  
  328. 	}
  329. } );
  330.  
  331. function onServerChange() {
  332.  
  333. 	const url = new URL( window.location );
  334. 	url.searchParams.set( 'server', selectedServerId );
  335.  
  336. 	history.pushState( {}, document.title, url );
  337.  
  338. 	const active = document.querySelector( '.option.active' );
  339.  
  340. 	if ( active ) {
  341.  
  342. 		active.classList.remove( 'active' );
  343.  
  344. 	}
  345.  
  346. 	const option = document.querySelector( '[data-id="' + selectedServerId + '"]' );
  347.  
  348. 	if ( option ) {
  349.  
  350. 		option.classList.add( 'active' );
  351.  
  352. 	}
  353.  
  354. }
  355.  
  356. const dialog = document.querySelector( '.dialog' );
  357. const serversBtn = document.querySelector( '.servers-btn' );
  358.  
  359. serversBtn.onclick = function () {
  360.  
  361. 	if ( dialog.classList.contains( 'disabled' ) ) {
  362.  
  363. 		dialog.classList.remove( 'disabled' );
  364. 		this.classList.add( 'disabled' );
  365.  
  366. 	} else {
  367.  
  368. 		hideDialog();
  369.  
  370. 	}
  371.  
  372. }
  373.  
  374. document.body.onclick = function ( event ) {
  375.  
  376. 	if ( [ 'canvas', 'loading' ].indexOf( event.target.id ) > - 1 || event.target === this ) {
  377.  
  378. 		hideDialog();
  379.  
  380. 	}
  381.  
  382. }
  383.  
  384. document.querySelector( '.close-btn' ).onclick = hideDialog;
  385.  
  386. refreshBtn.onclick = async function () {
  387.  
  388. 	spinner.style.display = '';
  389.  
  390. 	await fetchServers( 'ffa' ); 
  391. 	await fetchServers( 'teams' );
  392.  
  393. 	spinner.style.display = 'none';
  394.  
  395. };
  396.  
  397. function hideDialog() {
  398.  
  399. 	dialog.classList.add( 'disabled' );
  400. 	serversBtn.classList.remove( 'disabled' );
  401.  
  402. }
  403.  
  404. function createClickListener( a, b ) {
  405.  
  406. 	let clicks = 0;
  407.  
  408. 	return function () {
  409.  
  410. 		clicks ++;
  411.  
  412. 		setTimeout( function () {
  413.  
  414. 			if ( clicks === 1 ) {
  415.  
  416. 				a();
  417.  
  418. 			}
  419.  
  420. 			clicks = 0;
  421.  
  422. 		}, 300 );
  423.  
  424. 		if ( clicks === 2 ) {
  425.  
  426. 			b();
  427.  
  428. 		}
  429.  
  430. 	}
  431.  
  432. }
  433.  
  434. const screenshotBtn = document.querySelector( '.screenshot-btn' );
  435. const leaderboardBtn = document.querySelector( '.leaderboard-btn' );
  436.  
  437. const displayCopiedScreenshot = createCopiedDisplayer( screenshotBtn );
  438. const displayCopiedLeaderboard = createCopiedDisplayer( leaderboardBtn );
  439.  
  440. screenshotBtn.onclick = createClickListener( 
  441. 	function () {
  442.  
  443. 		downloadCanvas( document.querySelector( 'canvas' ), 'digdig' );
  444.  
  445. 	}, 
  446. 	copyScreenshot
  447. );
  448.  
  449. leaderboardBtn.onclick = createClickListener(
  450. 	function () {
  451.  
  452. 		if ( leaderboard ) {
  453.  
  454. 			downloadCanvas( getLeaderboardCanvas(), 'digdig_leaderboard' );
  455.  
  456. 		}
  457.  
  458. 	}, 
  459. 	copyLeaderboard
  460. );
  461.  
  462. function copyScreenshot() {
  463.  
  464. 	copyCanvasToClipboard( document.querySelector( 'canvas' ) );
  465.  
  466. 	displayCopiedScreenshot();
  467.  
  468. }
  469.  
  470. function copyLeaderboard() {
  471.  
  472. 	if ( leaderboard ) {
  473.  
  474. 		copyCanvasToClipboard( getLeaderboardCanvas() );
  475.  
  476. 		displayCopiedLeaderboard();
  477.  
  478. 	}
  479.  
  480. }
  481.  
  482. window.addEventListener( 'keyup', function ( event ) {
  483.  
  484. 	const key = String.fromCharCode( event.keyCode );
  485.  
  486. 	if ( key === 'F' ) {
  487.  
  488. 		copyScreenshot();
  489.  
  490. 	} else if ( key === 'G' ) {
  491.  
  492. 		copyLeaderboard();
  493.  
  494. 	} else if ( key === 'X' ) {
  495.  
  496. 		document.body.classList.toggle( 'pointer-lock' );
  497.  
  498. 	}
  499.  
  500. } );
  501.  
  502. function createCopiedDisplayer( element ) {
  503.  
  504. 	let old, timeout;
  505.  
  506. 	return function () {
  507.  
  508. 		if ( element.classList.contains( 'force-tooltip' ) ) {
  509.  
  510. 			clearTimeout( timeout );
  511.  
  512. 		} else {
  513.  
  514. 			old = element.getAttribute( 'tooltip' );
  515. 			element.setAttribute( 'tooltip', 'Copied!' );
  516. 			element.classList.add( 'force-tooltip' );
  517.  
  518. 		}
  519.  
  520. 		timeout = setTimeout( function () {
  521.  
  522. 			element.setAttribute( 'tooltip', old );
  523. 			element.classList.remove( 'force-tooltip' );
  524.  
  525. 		}, 1000 );
  526.  
  527. 	}
  528.  
  529. }
  530.  
  531.  
  532. function getLeaderboardCanvas() {
  533.  
  534. 	const offset = - 115 * 0.8 * 0;
  535.  
  536. 	const canvas = document.createElement( 'canvas' );
  537. 	
  538. 	canvas.width = leaderboard.width;
  539. 	canvas.height = leaderboard.height + offset;
  540.  
  541. 	canvas.getContext( '2d' ).drawImage( leaderboard, 0, offset );
  542.  
  543. 	return canvas;
  544.  
  545. }
  546.  
  547. function copyCanvasToClipboard( canvas ) {
  548.  
  549. 	canvas.toBlob( function ( blob ) {
  550.  
  551. 		navigator.clipboard.write( [ new ClipboardItem( { 'image/png': blob } ) ] );
  552.  
  553. 	} );
  554.  
  555. }
  556.  
  557. function downloadCanvas( canvas, filename ) {
  558.  
  559. 	const a = document.createElement( 'a' );
  560.  
  561. 	a.href = canvas.toDataURL();
  562. 	a.download = filename + '_' + Date.now() + '.png';
  563.  
  564. 	a.click();
  565.  
  566. }
  567.  
  568. let leaderboard;
  569. let leaderboardPartial;
  570.  
  571. const Canvas = unsafeWindow.OffscreenCanvas ? unsafeWindow.OffscreenCanvas.prototype : unsafeWindow.HTMLCanvasElement.prototype;
  572.  
  573. Canvas.getContext = new Proxy( Canvas.getContext, {
  574. 	apply() {
  575.  
  576. 		const ctx = Reflect.apply( ...arguments );
  577.  
  578. 		ctx.fillText = new Proxy( ctx.fillText, {
  579. 			apply( target, thisArgs, args ) {
  580.  
  581. 				if ( args[ 0 ].indexOf( 'Diggers' ) > - 1 ) {
  582.  
  583. 					leaderboardPartial = ctx.canvas;
  584.  
  585. 				}
  586.  
  587. 				return Reflect.apply( ...arguments );
  588.  
  589. 			}
  590. 		} );
  591.  
  592. 		ctx.drawImage = new Proxy( ctx.drawImage, {
  593. 			apply( target, thisArgs, args ) {
  594.  
  595. 				if ( args[ 0 ] === leaderboardPartial ) {
  596.  
  597. 					leaderboard = ctx.canvas;
  598.  
  599. 				}
  600.  
  601. 				return Reflect.apply( ...arguments );
  602.  
  603. 			}
  604. 		} );
  605.  
  606. 		return ctx;
  607.  
  608. 	}
  609. } )

欢迎访问Greasy Fork镜像

土豆服务器，请按需使用

镜像地址随时可能被墙，建议加群获取最新地址

加入Q群

QingJ © 2025

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