monkeytypegame/monkeytype
1
1
Fork 0
mirror of https://github.com/monkeytypegame/monkeytype.git synced 2025-10-06 13:40:16 +08:00
Code Issues Projects Releases Packages Wiki Activity

added a dynamic, theme depended favicon

Browse source
This commit is contained in:
unknown 2020-05-20 23:46:25 +01:00
parent 7e36b089af
commit 1ee970c922
3 changed files with 29 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
public/index.html
View file

@ -8,7 +8,7 @@
<link rel="stylesheet" href="css/fa.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="themes/dark.css" id="currentTheme">
<link rel="shortcut icon" href="favicon.png">
<link id="favicon" rel="shortcut icon" href="favicon.png">
</head>
<body>
<div class="notification">Signed in</div>

1
public/js/script.js
View file

@ -1061,6 +1061,7 @@ if (window.location.hostname === "localhost") {
}
$(document).ready(() => {
updateFavicon(32,14);
$('body').css('transition', '.25s');
restartTest();
if (config.quickTab) {

27
public/js/userconfig.js
View file

@ -141,6 +141,7 @@ function previewTheme(name) {
function setTheme(name) {
config.theme = name;
$("#currentTheme").attr("href", `themes/${name}.css`);
updateFavicon(32,14);
try{
firebase.analytics().logEvent('changedTheme', {
theme: name
@ -150,6 +151,32 @@ function setTheme(name) {
}
}
function updateFavicon(size,curveSize){
var canvas = document.createElement('canvas');
canvas.width = size;
canvas.height = size;
let ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.moveTo(0,curveSize);
//top left
ctx.quadraticCurveTo(0, 0, curveSize, 0);
ctx.lineTo(size-curveSize,0);
//top right
ctx.quadraticCurveTo(size, 0, size, curveSize);
ctx.lineTo(size,size-curveSize);
ctx.quadraticCurveTo(size, size, size-curveSize, size);
ctx.lineTo(curveSize,size);
ctx.quadraticCurveTo(0, size, 0, size-curveSize);
ctx.fillStyle = getComputedStyle(document.body).getPropertyValue('--bg-color').replace(' ','');
ctx.fill();
ctx.font = "900 "+ size/2*1.2 + "px Roboto Mono";
ctx.textAlign = "center";
ctx.fillStyle = getComputedStyle(document.body).getPropertyValue('--main-color').replace(' ','');
ctx.fillText("mt", size/2+(size/32), size/3*2.1);
// document.body.appendChild(canvas);
$("#favicon").attr('href',canvas.toDataURL('image/png'));
}
function changeLanguage(language) {
if (language == null || language == undefined) {
language = "english";