Closed jorunkel closed 1 year ago
You seem to be a developer, would you like to suggest a solution / work out a PR?
To be honest I'm not familiar with the source code of Kimai. The actual changeset should be quiet small, though. For the clientside part here ist some example code: https://stackoverflow.com/a/260877
Maybe the easiest way would be something like this Website: http://lab.ejci.net/favico.js/ Github: https://github.com/ejci/favico.js
Looks like a nice library, even though it does not work in Safari. Thanks for sharing @BKapelari
But: it is not maintained since 7 years and has too many features (10kb). If you know a more recent version, supporting ES6 builds I'd be happy to have a look.
Yes I see the same problems. Maybe we ca find something similar
Okay, I did a little recharge:
it is really simple to change the Favicon via JS:
document.querySelector("link[rel$=icon]").setAttribute('href', 'https://www.google.com/favicon.ico');
You can test it in the console on a site with no strict Content Security Policy (like stackoverflow.com)
With an ID on the link-tag, it would be even easier to target the right icon.
This should work in all mayor browsers except IE and Safari.
Where would be the right function to add the snippet?
We need an icon first. I have zero software/knowledge about image manipulation. Can someone make a stop icon from this: https://github.com/kimai/images/blob/master/kimai_logo_transparent.svg ?
The code would go here (if entries.lenglth > 0: toggle icon) https://github.com/kevinpapst/kimai2/blob/master/assets/js/plugins/KimaiActiveRecords.js#L67
Do you like this one?
Colors of the gradient are red and yellow here: https://github.com/kevinpapst/kimai2/blob/0dba83d8e9c526c1f30a77175e0b79a9d8e9dae2/assets/sass/variables.scss#L23-L29
Partially. The white blob in the middle AKA stop button 😁 is a little too prominent for me. But maybe okay as favicon to clearly communicate what's going on...
Just an idea: What about an icon that better indicates what's going on? Just arranged this in only seconds to illustrate what I mean:
Reduce the size to a typical favicon of 16x16 and check if it is still clear. I guess the Kimai icon is just not perfect for that (too much noise), but I actually like the color!
I think I would prefer icons like these: https://fontawesome.com/search?q=circle&c=media-playback&s=solid%2Cbrands
Okay, understand Your point. These could be simpler versions of the icon. I also simplified the one developed by @BKapelari
Okay, understand Your point. These could be simpler versions of the icon. I also simplified the one developed by @BKapelari
![]()
![]()
I would go for the red one. as @kevinpapst said, the rectangle is a littel too big, but not far
@BKapelari if you want to give it a try, send in a PR. We can still optimize the icons later on.
We need an icon first. I have zero software/knowledge about image manipulation. Can someone make a stop icon from this: https://github.com/kimai/images/blob/master/kimai_logo_transparent.svg ?
The code would go here (if entries.lenglth > 0: toggle icon) https://github.com/kevinpapst/kimai2/blob/master/assets/js/plugins/KimaiActiveRecords.js#L67
this works as it should. But if I reload the page, the icon is gone. I think there is a interval function for checking if the tracker is running. Where can I find it?
okay, seems to work. Here is my code: https://github.com/BKapelari/kimai2 Maybe we should define de "stop_favicon" in the config file? Also the naming could be better. I'm looking forward to your feedback!
Thanks for testing! I will have a look and add it, if it works properly.
See https://github.com/kimai/kimai/pull/4038
Once I get a package of better icons, I will change it to flip the image instead of adding the red rectangle.
This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs. If you use Kimai on a daily basis, please consider donating to support further development of Kimai.
Is your feature request related to a problem? Please describe. Currently the favicon is the same all the time. Kimai changes the page title to the duration when tracking is active. But since I'm using Kimai in a pinned tab in Firefox there is no way to see that. Working in other tabs I'd like to have a visual indicator whether tracking is active or not.
Describe the solution you'd like Kimai should change its favicon while tracking time. I.e. it could change color (red) or the symbol on it to a stop sign or even both. That would give some visual indicator that tracking is active even when the tab is not active.