NOTE: THIS MODULE IS TO BE HOSTED ONLY AT https://github.com/BKeyport/MMM-Worldclock - Any other hosting location is invalid.

If you fork this file (you don't need to if you're just using it) please update me with any changes you make, so if it's useful to everyone, it can be added!

If you find this module useful, and would like to contribute to the project, I appreciate the thought. Instead of giving to me, please donate to L'Arche Tahoma Hope at https://www.larchetahomahope.org/donate/ - in honor of Nancy Tyson. (Dedicate my donation checkbox). Nancy means the world to me. You don't have to notify me you have done so.

THANK YOU for your consideration.

Module: MMM-Worldclock

This module is derived from default MagicMirror module 'clock' and modified. Thanks to michaelteeuw.
This module displays times from around the world.
Modified fork of worldclock by eouia, renamed and improved.

*** Due to the end of life for required modules, this module may break in future versions of MagicMirror. I am working on a solution. ***

Installation

1. Execute the following commands to install the module:

cd ~/MagicMirror/modules # navigate to module folder
git clone https://github.com/BKeyport/MMM-Worldclock # clone this repository

2. Then, add the following into the modules section of your config/config.js file:

{
	module: 'MMM-Worldclock',
	position: 'top_left', // This can be any of the regions, best in top_left or top_right regions
	config: {
	// See 'Configuration options' for more information.
		timeFormat: 'hh:mm A', //Global time format, as defined in moment.js format()
		style: 'top', // Which way do you want the flag and description from the clock? choices are 'top', 'left','right','bottom'
		offsetTimezone: null, // Timezone you want to show the difference from. null, "", or omitted from config will be UTC.
		clocks: [
			{
				title: "Home",
			},
			{
				title: "HOLLYWOOD", // Too long of a title could cause bad text align.
				timezone: "America/Los_Angeles", //When omitted, Local time will be displayed. 
				flag: "us", // If you'd like a flag from the standard library 
			},
			{
				timezone: "Asia/Seoul",
			},
			{
				title: "UTC",
				timezone: "UTC",
				timeFormat: "HH:mm MM/DD", // Time format override. 
				altflag: "world.png" // if you'd like a flag from a file on your mirror device. 
			},
		]
	},
},

3. Change the options to your desired method.

Configuration options

The following properties can be configured:

Option	Description
timeFormat	How to format the time of worldclocks Possible example values: any formatter available in moment.js (eg. HH:mm A, hmmss) Default value: LT (It could be displayed like '12:34 AM')
style	How to display with defined style. Possible values: top, bottom, left, right If you select top, the time will be displayed over the timezone title or UTC gap comment. You can customize this style by modifying CSS with style selector (style-top, style-bottom, style-left, style-right). See the clock_style.css Default value: top
offsetTimezone	null or Europe/Berlin If you set null, timegap from UTC will be shown. If you set TIMEZONE like Europe/Berlin, it will show timegap from that timezone.
clocks	Array of clocks

clocks configuration options:

Option	Description
title	The clock title of each timezone. if it is omitted or null, the timezone value will be displayed instead. Example: My Home, The Golden Gate, Hong Kong Office or null
timezone	Specify a timezone to show current local time. Possible examples values: America/New_York, Europe/Berlin, Etc/GMT+10 See more informations about configuration value here Default value: null If this value is null or omitted, current local timezone value (defined in config.js) will be used. I don't recommend it because the purpose of this module is showing another local time. All available timzone codes are here
flag	ISO 3166-1-alpha-2 code for country. DO NOT use with altflag below
altflag	name of alternative flag file. MUST Be square image, MUST be self centered. DO NOT use with flag above. Place in module's root directory.
timeFormat	Override module timeFormat configuration for this clock. For possible values see timeFormat above.

If you happen to use flag and altflag together you'll get both on the same clock, This is clearly not desired.

Altflag images should have no whitespace around the edge for most advantagous look. It will be slightly smaller than the flag image. I'm not sure why this is, yet.

Style Customizing

Look and feel of the module is handled by CSS.

Please make all changes in MagicMirror/css/custom.css (If you haven't made any changes to CSS, it may not exist)

Each clock is in it's own class. The class is defined as 'world-' with the sequence number, starting at zero.

First clock is 'world-0' ("home") in default code
Second is 'world-1' ("Hollywood") in default code
and so on.

Modifying the overall style is accomplished by adjusting the classname 'style-' and the value of your style config.

'style-top' 'style-bottom' 'style-left' and 'style-right' respectively.

Updates

• 2022-09-07

  • starting updates for eliminating moment.js
  • update css to use global colors by default using varibles.

• 2021-06-07

  • Update schema.json for various bug fixes and MMM-Config, Update README.

• 2021-06-06

  • Adjusted defaults to match documentation.
  • Adjusted defaults for MMM-Config use. ** Note: double check your fields carefully, some may revert to default, working on bugfix **
  • Continue rewrite of documentation for clarity.
  • Altflag now is about the same size as regular flags.

• 2021-01-18

  • Added initial altflag operation. Will allow user to add a flag of their choice. Is not working fully yet, I need to learn and build my own css tree for it to make it seamless with other flag system. As of present, icons are slightly larger than wanted, and may interrupt other operation. Suggestions welcome.

• 2020-08-06

  • Fixed timeFormat per clock to work properly.

Updates after 2020-08-01 is BKeyport

• 2019-02-24
  • eouia: offsetTimezone is added.
• 2017-08-25
  • eouia: supports MMM-TelegramBot (https://github.com/eouia/MMM-TelegramBot)
  • eouia: command /worldclock is added
• 2017-08-10
  • eouia: Country flags are supported.
  • eouia: HTML/CSS Structures are refined.

Thank YOU for your support.

@eouia/@bkeyport