diff --git a/README.md b/README.md index 75e183e..fe0f0cb 100644 --- a/README.md +++ b/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/) \ No newline at end of file +Icon made by [catkuro](https://www.flaticon.com/authors/catkuro) from [Flaticon](https://www.flaticon.com/) diff --git a/package.json b/package.json index 5b3b2cd..12a4bcb 100644 --- a/package.json +++ b/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"], diff --git a/src/extension.ts b/src/extension.ts index 920d77c..e910228 100644 --- a/src/extension.ts +++ b/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('prefix'); const postfix = config.get('postfix'); @@ -13,8 +19,8 @@ function rendererGen() : [(time: Date) => string, boolean] { const flash = config.get('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('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(); };