Skip to content

Home

Jump to bottom
ppvnf edited this page Oct 3, 2022 · 57 revisions

ElevenClock

First of all... What is Elevenclock? ElevenClock is an application whose whole point is to have a customizable clock on your Windows 11 taskbars. When Microsoft's engineers were creating Windows 11, they forgot to add a clock on the secondary screen taskbar. So I did that. ElevenClock was an app designed to return this functionality, but it has evolved and it can now replace your system clock also in order to let you customize it, like in the good old days.

In other words, ElevenClock is A customization tool for your Windows 11 clocks

Table of contents

  1. ElevenClock
  2. Documentation
  3. Installation
  4. Running and building the source code
  5. Translating ElevenClock
  6. Troubleshooting
  7. Help

How does it work (Nerd Section)

Since Microsoft does not allow third-party programs to modify any taskbar section to prevent people from tweaking Windows 11, using an app like T-Clock wouldn't have worked, because the taskbar has been entirely rewritten without room for the modifications.. But there are alternatives if we realize that the taskbar is nothing more than a borderless frameless window set to stay on the top:

Basically, ElevenClock places a Frameless Borderless transparent window over the taskbar, and it raises the window continuously to prevent the taskbar from overlaying the clock.

This is why Elevenclock can be customized and the system clock no, and also why every single function had to be reimplemented, like fullscreen hiding or following the taskbar on the top of the screen. And for positioning the clock, it is just maths. Calculating the coordinates taking in account other displays, monitor scaling variations and other stuff like that.

Third-party libraries

ElevenClock has been completely made using Python 3.10, and it uses some open-source libraries in order to work:

  • PyAutoGui, to recreate Win+N and Win+D key presses
  • Win32mica, to add the mica effect on the settings window. This module was made by me :)
  • PyWin32, bindings to the Win32 API, in order to detect full screen windows
  • PyQt5 (Qt), to provide the Clock UI, the Settings Window UI and eventually the First Run UI
  • Psutil, to monitor ElevenClock's memory usage and prevent memory leaks
  • PyInstaller, to build all this stuff in a single .exe file
  • PythonBlurBehind, to give a nice acrylic background to the clock context menu
  • Frameless Window: Have nice dialogs and a nice frameless Settings window
  • WNFUN: Read the Windows Notification Facility from the Win32 API



You have arrived at the end of the section. Return to top



Documentation:

On this page you'll find all the information relating to ElevenClock's capabilities, features and operation methods. This page is still under construction

The Actual Clock

ElevenClock's actual clock is a transparent and frameless window placed where the clock should be. The window is titleless and has the StayOnTop flag enabled. Additionally, it has the Alt-F4 key press event disabled, so the user doesn't accidentally close it. The position is calculated by adding the coordinates of the screen with their size, subtracting the clock's size. If the cock is set to the top and/or to the left, the screen width or height, respectively, is omitted in the calculations. A specific value can be set to the clock's height, as well as offsets can be added to the clock's x and y values.

This window is being constantly raised to prevent the taskbar from displaying over it. If the taskbar has the focus (for example, when the start menu is opened), the clock remains hidden, because a focused top-level window's z-index is higher than the z-index of an unfocused top-level window. This bug can't be fixed, as it is a minor issue and a fix would be difficult to implement, if not impossible.

Time formats

The time format used in the clock is taken from windows registry and converted into a python-compatible % string (see https://docs.python.org/3/library/datetime.html#strftime-and-strptime-format-codes). If the user has seconds enabled, either via Windows Registry or via the Settings Window, and the time format does not contain any s or ss, a %S is added on the string, in a way that it shows just after the minutes.

If the user has the day of the week or the week number features enabled, the corresponding reference characters are added to the time format string, as well as the date or the time is removed if the user disables them. Those settings appear on the Settings Window, under Date and time preferences.

The clock has a built-in thread that, every 0.1s, converts this format string to the actual machine's date and time using the python function strftime(), from the datetime module

Clock UI

The clock UI, as mentioned before, is based on a transparent window with a transparent background. The color of the text is set to black or white depending on the system's taskbar color scheme (read from the registry). Due to stylistic reasons, the default font, Segoe UI Variable Display changes from it's regular variant to its Semib variant if the mode is set to dark. The background, since version 2.9.2, is set to the clock's most top-left pixel color. This color is retrieved by creating a screenshot of this specific pixel, and then extracting the RGB color. Since the clock's corners are rounded, the pixel in question has (more or less) the color of the taskbar in that region. The dynamic background can be disabled and be set to be transparent or a specific color. The font color, the font family and the font size can be customized as well.

The hover effect is achieved with a semi-transparent widget with a less transparent border and a border radius, being shown and hidden gradually when the mouseIn and mouseOut events are triggered on the window.

Notification counter and focus assistant

If the feature is enabled, the process will check if the focus assistant is enabled, and if it is, it will show the moon displayed in the original clock. If it is not, the process will check if there are unread notifications. If the value is bigger than 0, a notification counter will be displayed. This counter imitates the Windows 11's one, by being round and following system colors.

Those values are taken from the WNF (Windows Notification Facility), with the help of the scripts on WNFUN (https://github.com/ionescu007/wnfun)

Clock's context menu

The Clock's context menu and the system tray menu is a QMenu modified to be transparent, with the fluent graphics effect and border radius applied through the hidden Win32 APIs. The menu lets the user access the most common tools, such as:

  • ElevenClock Settings: The name says it all
  • Reload the clocks: Reload all the clocks. Might be useful
  • An unclickable entry with the clock's version
  • Restart ElevenClock: A button to restart the whole process
  • Hide ElevenClock: Hide the clocks without killing the process. Clicking on the icon tray will show them again
  • Screen tools: Tools related to the current screen clock:
    • Blacklist this screen: Do not show the clock on that screen anymore. This action can be reverted
  • Task Manager: Since MS removed the task manager shortcut, I decided to add one here. It just opens windows task manager
  • Adjust date and time: This is inherited from the default windows clock. Shortcut to date and time settings
  • Notifications settings: This is inherited from the default windows clock. Shortcut to notification settings



You have arrived at the end of the section. Return to top



ElevenClock Installation

ElevenClock is a software distributed, as most software is, prepackaged and with self-executable installers. On this page you will see the two most common installation methods and its steps.

Microsoft Store installation

This is the most recommended method, due to its ease and security. You will need to have the latest version of the Microsoft Store and be running Windows 11 (any version).

  1. Open this link: ElevenClock - Microsoft Store
  2. Click on the Get it from Microsoft Store button.
  3. A popup will appear. Click on "Open Microsoft Store" (Note that this step might not be necessary depending on the browser)
  4. Click on the Install button and wait until the installation is done. ElevenClock should start straightforward.

Legacy Installation

This install method is useful when you want to install ElevenClock on a computer that does not have the Microsoft Store installed or that has no access to the internet. The process is harder than the Microsoft Store Installation, but it is still easy for an average user.

  1. Download ElevenClock from the one of the following sources:
  1. Bypass Windows Defender Smartscreen by clicking on More Info and then on Run anyway
    Defender Smart Screen Installation Screen Defender Smart Screen Run Anyway Screen

  2. Install the program as normal:
    image

  3. The clock should start automatically when the installation is finished.



You have arrived at the end of the section. Return to top



Running and building the source code

Cloning the source code is useful to be able to test ElevenClock's source code, to debug it, to modify it, and even to build your custom ElevenClock version with your custom features or fixes. Though this steps are really intuitive and are the same that most software use, here are the detailed steps required to achieve that.

If you want to clone a specific version, you can download the source code in a zip file from GitHub Releases

Cloning the source code

Clone using git

  1. Open a Command Prompt on a folder
  2. Run the following command to clone the repository and access it:
git clone https://github.com/martinet101/ElevenClock && cd elevenclock

NOTE: If you want to use PowerShell, the command would be the following:

git clone https://github.com/martinet101/ElevenClock; cd elevenclock

image

Clone manually

  1. Open a browser and download the source code.
  2. Extract the files into a new folder. To do this, you can use any zip extractor, such as 7-zip, Winzip, etc... Or even SomePythonThings Zip Manager (haha little spam for you)

Installing dependencies

Python 3.10 is required to run ElevenClock. Other versions of python are NOT supported. You can download python from here

NOTE: The Microsoft Store Python should work, but you won't be able to build ElevenClock.

When Python 3.10 is installed:

  1. Open the folder where the ElevenClock source is located. Open the ROOT folder of the repo, NOT the folder where init.py is placed
  2. Make sure you have pip installed. You can see how to install pip here: https://pip.pypa.io/en/stable/installation/
  3. Open a Command Prompt or PowerShell window and run:
pip install -r ./requirements.txt
  1. Wait for it to finish

Running the source code

  1. Open the local repository folder and navigate to a subfolder named ElevenClock
  2. Open a Command Prompt or Powershell Window on that folder
  3. Run the following command:
python __init__.py
  1. If everything works fine, ElevenClock should launch. Nothing will be printed on-screen, to see the logs you'll need to right-click any clock -> ElevenClock settings -> Debugging information -> Open log

Building ElevenClock from source

  1. Open the ElevenClock local folder and navigate to the root folder of the repository
  2. Run build.bat to build a standalone executable file. If the process finishes successfully, a file named ElevenClock.exe will be generated on the same folder.
  3. Run build_debugging.bat to build a debuggable executable. If the process finishes successfully, a folder named __init__ will be generated on the same folder. Access this folder and run the file named __init__.exe. A console will appear and ElevenClock will run in debugging mode



You have arrived at the end of the section. Return to top



Translating ElevenClock

Since ElevenClock is an app that wants to reach every single person in the world running Windows 11, on issue #111 it was requested to add this feature. And here we are. On this page you will find useful information about how does the ElevenClock translation program works and how to participate on it, because anyone can contribute here!

You can check the supported languages here. If you want to add a new language, drop an e-mail at marticlilop@gmail.com

How does it work (Nerd section)

The method ElevenClock uses to translate the UI is based on JSONs, containing a reference sentence and a translated sentence. Every language file codes for a different language, and every language is stored on one single file. If a translation is missing, the program will fallback to English, providing always a readable UI for everyone. Those language files need to be registered to be used, and this is done in languages.py.

Contributing

Either if you want to update an already existing language or you want to create a new one, the steps are the same:

  1. Log in or create an account in Tolgee. You can log in with GitHub, if you prefer.

image

  1. E-mail me to marticlilop@gmail.com with the following information: the mail you used for registration and the languages where you are willing to contribute.

  2. I'll accept you (or not hehe) and you'll find the ElevenClock project in your dashboard image

  3. Now select the language you want to translate image

  4. To make things easier, you can filter the untranslated strings image

  5. You can then start translating. The changes will be included with the next ElevenClock release. image

The translation program is changing. The OLD documentation as of 8/6/2022 (source code version 3.6.0-beta) can be found here

How does it work (Nerd section)

The method ElevenClock uses to translate the UI is based on dictionaries, containing a reference sentence and a translated sentence. Those dictionaries are stored in python files and divided into sections, to make them easier to read and to maintain. Every language file codes for a different language, and every language is stored on one single file. If a translation is missing, the program will fallback to English, providing always a readable UI for everyone. Those language files need to be registered to be used, and this is done in languages.py. The addition of language files is not dynamic in order to prevent hackers from inserting malicious .py files into the code.

Adding a new language

To translate ElevenClock to a new language:

  1. Download this file. This file has all the language definitions.
  2. Rename so it matches the following pattern: lang_[LANG_CODE].py. For example, lang_en.py for English or lang_ca.py for Catalan. More information about language codes can be found Here
  3. Translate the sentences that you will find on each line. DO NOT replace the English reference strings, but rather write the translation between the quotation marks present at the end of the line. Please follow the rules established in the Rules section in order to provide a functional translation.
  4. When the translation job is done, you can either submit a pull request (If you know how to) or, if you don't know how to, just send me the translated file at marticlilop@gmail.com. I'll review it and publish it with the new version.

Example translation: (On the left the English references which SHOULD NOT be modified. On the right the Catalan translations)

image

Updating or improving an existing translation

  1. Go to this folder and download language file which corresponds to the language you want to update.
  2. Translate every non-translated sentence in between the quotation marks that you will find at the very end of every line. The non-translated sentences will be at the top of the document. Please follow the rules established in the Rules section in order to provide a functional translation.
  3. In order to publish changes, you can either submit a pull request (If you know how to) or, if you don't know how to, just send me the updated file at marticlilop@gmail.com. I'll review it and publish it with the new version.

Rules:

  • Make sure not to modify the original strings. If this happened the translation wouldn't work at all.
  • Make sure to add any final stop/colon/semicolon/hyphen/etc.
  • Make sure to add the {0} symbols, since they code for variable values

Supported languages

List of supported languages here



You have arrived at the end of the section. Return to top



Troubleshooting

Here you will find information related to error solving and similar.

Known Issues

  • ElevenClock overlays the battery/volume icon in the taskbar
    The best solution here is to set a smaller font size, since ElevenClock is a simple overlay and can't interact with other taskbar elements.

  • ElevenClock shows a weird font overlapping characters like the T and the u on Tuesday
    This is because Qt's Font Kerning is broken with Variable fonts. A possible solution could be setting a custom font from the settings window

  • The clock flashes when clicking the taskbar or hides when opening the start menu
    This happend because of Microsoft's z-index policy, where a focused window (in this case the taskbar) cannot be overlapped by an unfocused window (the clock). The clock will show again when the taskbar loses focus.

  • Clicking the clock in a secondary screen shows the calendar in the main monitor
    Yes, this happens and can't be fixed. Best we can do is hope that Microsoft enables a multi-monitor calendar at some point.

  • Clicking the clock opens the PowerToys mute button instead of the calendar
    You will need to change the key combination for the PowerToys mute menu to Win+Shift+N or something similar to avoid interferences

  • %Z and %z symbols are not working on the custom date and time format.
    Yes, they are not meant to. This is a misexplanation on Python's datetime documentation. More info on this comment

  • Bold fonts are not working
    Yes, they don't work. I dont know why, but I couldn't get bold fonts to work. This issue is present in other Qt-made apps, so i guess it is Qt's bug.

Common Problems

Q: Something is not working as intended / ElevenClock is crashing
A: Reset ElevenClock. To do that, if you can launch ElevenClock Settings, scroll down to Debugging information and click on Reset. If ElevenClock is not launching or crashes, remove the folder named .elevenclock in your user directory.

Q: ElevenClock does not show where it should on multi-gpu systems (with iGPU and dGPU)
A: On windows performance settings, force ElevenClock to use the Power Saving GPU (usually your intel or amd integrated graphics chip.). More info on how to do this here

Q: The clock shows misplaced/blurry
A: Please follow the instructions detailed in this discussion

Q: The clock shows over fullscreen
A: Enable Hide the clock in fullscreen mode on the settings window, under Clock Settings

Q: The clock shows over Remote Desktop, Cytrix Workspace or VMWare
A: Enable Hide the clock when RDP Client or Cytrix Workspace are running (Old method) on settings, under Fixes and experimental features

Q: Can ElevenClock be in my language?
A: Yes, just take a look at TRANSLATION.md

Q: My antivirus is telling me that ElevenClock is a virus/My antivirus is uninstalling ElevenClock/My browser is blocking ElevenClock download
A: Just whitelist ElevenClock on the antivirus quarantine box/antivirus settings

Q: The clock shows seconds when the "Show Seconds" settings is disabled
A: Check that you don't have seconds set in your regional settings and disable seconds following this article's instructions (Other guides might not work)

Q: ElevenClock does not show the correct time zone when time zone is changed
A: Just restart ElevenClock (Right-click clock -> Restart ElevenClock)

Q: The main clock does not get modified when enabling seconds, etc.
A: Enable Show the clock on the primary screen on the settings window, under Clock Settings

Help

Here you will find information relating to advanced features and jow do they work

Network time

From version 3.5 and above, ElevenClock has now the abiilty to fetch the time from the internet rather that from the computer. This feature allows the user to view the time from virtually any part of the world. To do so, the feature Enable atomci clock-based internet time must be enabled. image
Then, a valid URL will need to be pasted in the adjacent text box. The vald urls are from the follwoing websites:

  • World Time Api https://worldtimeapi.org/

    • Valid URLs: http://worldtimeapi.org/api/timezone/:area/:location[/:region] (Note that :region is optional)
      • Example URL: http://worldtimeapi.org/api/timezone/America/Argentina/Salta
      • More examples here

  • World Clock Api http://worldclockapi.com/

    • Valid URLs: http://worldclockapi.com/api/json/:area/:location
      • Example URL: http://worldclockapi.com/api/json/europe/london
      • More info here

The Internet sync frequency option will determine the interval of time that ElevenClock must wait before syncing the time again

ElevenClock - Made with ❤️ by Martí Climent

ElevenClock

Eleven Clock demo

Customize your Windows 11 taskbar clocks, including those on secondary monitors
Downloads@latest
Release Version Badge
Issues Badge
Closed Issues Badge
Clone this wiki locally