Created
July 10, 2024 08:36
-
-
Save evilUrge/9624f3272a067b6dd9d8e7e0f099f505 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// ==UserScript== | |
// @name Clozemaster artifical image, page cleaner and fullscreen | |
// @namespace https://gist.github.com/evilUrge | |
// @version 0.5 | |
// @description Change background image URLs from *.small.png to *.png, stretch images, and ensure they are not trimmed on Clozemaster | |
// @author Gilad Maoz | |
// @license MIT | |
// @icon https://www.clozemaster.com/icons/favicon-96x96.png | |
// @match https://www.clozemaster.com/* | |
// @grant none | |
// ==/UserScript== | |
(function() { | |
'use strict'; | |
function replaceImageURLs() { | |
// Select the element that might have a background image and needs modification | |
const elements = document.querySelectorAll('div[style*=".small.png"]'); | |
elements.forEach(el => { | |
let style = el.getAttribute('style'); // Get the current style | |
let newStyle = style.replace(/\.small\.png/g, '.png'); // Replace .small.png with .png | |
newStyle += ` background-size: cover; background-repeat: no-repeat; overflow: visible; min-height: ${window.innerHeight}px;`; | |
el.setAttribute('style', newStyle); // Set the modified style | |
}); | |
} | |
function removeItems() { | |
['.btn-default.toggle-image-disabled', | |
'#body > div > div > div.container-fluid.header', | |
'#body > div > div > div > div > div:nth-child(1) > div > div.row.progress.round', | |
'#body > div > div > div > div > div:nth-child(1) > div > div.row.bg-success.text-center.lead', | |
'#body > div > div > div:nth-child(2) > div > div:nth-child(1) > div', | |
'.footer'].forEach(item=>{ | |
const query = document.querySelector(item) | |
if (query) query.remove() | |
}) | |
} | |
function enterFullScreen() { | |
if (!document.fullscreenElement) { | |
document.documentElement.requestFullscreen().catch(e => { | |
console.error('Error requesting fullscreen:', e); | |
}); | |
} | |
} | |
function hideTopBar() { | |
const style = document.createElement('style'); | |
style.textContent = ` | |
#titlebar-container { | |
display: none !important; | |
} | |
/* Hide title bar for full screen */ | |
html:-webkit-full-screen #titlebar-container, | |
html:-webkit-full-screen #titlebar-container, | |
html:fullscreen #titlebar-container { | |
display: none !important; | |
} | |
`; | |
document.head.appendChild(style); | |
} | |
function modifyNavbar() { | |
const collectionName = document.querySelector('.playing-name > strong:nth-child(1)'); | |
const statusBar = document.querySelector('.status'); | |
if (statusBar && collectionName) { | |
const textContent = collectionName.textContent.trim(); | |
const newElement = document.createElement('div'); | |
newElement.className = 'col-xs-3 text-right'; | |
newElement.innerHTML = `<span class="hidden-xs">${textContent}</span>`; | |
statusBar.insertBefore(newElement, statusBar.firstChild); | |
} | |
// Change the class name for original navbar items | |
document.querySelectorAll('.col-xs-4').forEach(el => { | |
el.classList.remove('col-xs-4'); | |
el.classList.add('col-xs-3'); | |
}); | |
} | |
function init() { | |
const isAppMode = window.matchMedia('(display-mode: standalone)').matches || | |
window.navigator.standalone === true || // iOS specific | |
(window.external && ('msLaunchUri' in window.external)); // Edge specific | |
if(isAppMode || true){ //TODO: FIX! | |
modifyNavbar(); | |
removeItems(); | |
enterFullScreen(); | |
hideTopBar(); | |
} | |
replaceImageURLs(); | |
} | |
init() | |
const observer = new MutationObserver(() => { | |
init() | |
}); | |
observer.observe(document.body, { childList: true, subtree: true }); | |
})(); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment