✨ Full time string as tooltip

README.md

@@ -1,25 +1,33 @@
 # Yet Another Clock
 
+Display a digital clock in the status bar of VisualStudio Code.
+Best for full-screen window as the system clock may be hidden.
+
 ![blue status bar](images/screenshot.blue.png)
 ![light status bar](images/screenshot.light.png)
 ![dark status bar](images/screenshot.dark.png)
 
+[Release Notes](https://github.com/jameslan/vscode-yaclock/releases)
+
 ## Features
 
 - Works locally. Do not require to be installed into remote host when using VSCode Remote.
 - Simple config. Do not need to learn how to format date time to string in javascript.
 Checkbox rules all!
-- Adaptive refresh rate. Refresh every second only when needed (second is displayed or
-the separator is flashing), otherwise refresh every minute at 0 second.
+- Adaptive refresh rate. Refresh at the beginning of every second only when needed
+(second is displayed or the separator is flashing),
+otherwise refresh at the beginning of 0 second every minute.
 - No window reload required for any config change.
 - Standing out. With a configurable colorful emoji (prefix or postfix),
 you could find the time with just a glimpse.
+- Show full date time as tool tip of the clock status bar item.
+Note that the tooltip appears only when the editor window is focused / activated.
 
 ## Tips
+
 - To add [Standard Octicons](https://code.visualstudio.com/api/references/icons-in-labels) into
 prefix or postfix, use `$()`, such as `$(clock)`
 
-
 ## Configuration
 
 |Name|Description|Default|
@@ -35,4 +43,4 @@ prefix or postfix, use `$()`, such as `$(clock)`
 |`yaclock.position`|Position in the status bar.|`right`|
 |`yaclock.priority`|Priority. The bigger value, the clock will be closer to the left edge.|`10`|
 
-Icon made by [catkuro](https://www.flaticon.com/authors/catkuro) from [Flaticon](https://www.flaticon.com/)
+Icon made by [catkuro](https://www.flaticon.com/authors/catkuro) from [Flaticon](https://www.flaticon.com/)

package.json

@@ -1,11 +1,11 @@
 {
   "name": "yaclock",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "displayName": "Clock",
   "description": "Yet Another Clock for Visual Studio Code in the status bar",
   "main": "out/extension.js",
   "scripts": {
-    "build": "tsc -p .",
+    "build": "npx tsc -p .",
     "vscode:prepublish": "npm run build"
   },
   "extensionKind": ["ui"],

src/extension.ts

@@ -1,7 +1,13 @@
-import * as vscode from 'vscode'
+import * as vscode from 'vscode';
+
+interface Renderer {
+    renderText(time: Date): string;
+    renderTooltip(time: Date): string;
+    expireInSeconds: boolean;
+}
 
 // returns the render, as well as a flag indicating if it needs to be called on every second
-function rendererGen() : [(time: Date) => string, boolean] {
+function rendererGen(): Renderer {
     const config = vscode.workspace.getConfiguration('yaclock');
     const prefix = config.get<string>('prefix');
     const postfix = config.get<string>('postfix');
@@ -13,8 +19,8 @@ function rendererGen() : [(time: Date) => string, boolean] {
     const flash = config.get<boolean>('flashTimeSeparator');
     let showSeparator = true;
 
-    return [
-        (time: Date) => {
+    return {
+        renderText(time: Date) {
             let options: Intl.DateTimeFormatOptions = {};
             if (showDate) {
                 options = { day: 'numeric', month: 'short' };
@@ -38,8 +44,13 @@ function rendererGen() : [(time: Date) => string, boolean] {
 
             return `${prefix}${day}${hour}${separator}${minute}${second}${ampm}${postfix}`
         },
-        showSecond || flash || false,
-    ];
+
+        renderTooltip(time: Date) {
+            return time.toLocaleString();
+        },
+
+        expireInSeconds: showSecond || flash || false,
+    };
 }
 
 function createClock(): vscode.StatusBarItem {
@@ -49,23 +60,25 @@ function createClock(): vscode.StatusBarItem {
         config.get<number>('priority'));
 }
 
-export function activate({ subscriptions }: vscode.ExtensionContext) {
+export function activate(context: vscode.ExtensionContext) {
     let clockItem: vscode.StatusBarItem;
-    let renderer: (time: Date) => string;
-    let refreshInSeconds: boolean;
+    let renderer: Renderer;
     let schedule: number;
 
+    let subscriptions = context.subscriptions
+
     const update = () => {
         const time = new Date();
-        const interval = refreshInSeconds ? 1000 - time.getMilliseconds() : 60000 - time.getMilliseconds() - time.getSeconds() * 1000;
+        const interval = renderer.expireInSeconds ? 1000 - time.getMilliseconds() : 60000 - time.getMilliseconds() - time.getSeconds() * 1000;
         schedule = setTimeout(update, interval);
 
-        clockItem.text = renderer(time);
+        clockItem.text = renderer.renderText(time);
+        clockItem.tooltip = renderer.renderTooltip(time);
     }
 
     const setup = () => {
         clockItem = createClock();
-        [ renderer, refreshInSeconds ] = rendererGen();
+        renderer = rendererGen();
         subscriptions.push(clockItem);
         clockItem.show();
     };