1.0.2 • Published 6 years ago

@astrouxdesignsystem/rux-clock v1.0.2

Weekly downloads
3
License
GPL-3.0
Repository
-
Last release
6 years ago

#Clock The RUX Clock component is a custom clock instance relavant to SATCOM/SATOPS operations running a constant 24 hour clock set to UTC along with the day of the year. RUX Clock also supports displaying AOS (Acquisition of Signal), LOS (Loss of Signal) and timezone support.

RUX Clock is based on the industry standard WebComponents v1 spec and implemented with Polymer Project 3 for backwards compatibility and document binding.

RUX Clock is supplied as-is and …

For stylesheet usage outside of a WebComponent environment, please see Astro UXDS Stylesheets

##Guidelines

##Installation Install the Astro Component Library npm install --save @astro-components Or Install just the clock npm install --save @astro-components/rux-clock ###Dependancies

##Usage ###Import the RUX Clock

import { RuxClock } from "@astro-components/rux-clock/rux-clock.js";

###Basic HTML Usage RUX Clock can be used without any properties and will display a 24-hour clock in HH:MM:SS UTC format along with the day of the year.

<rux-clock></rux-clock>

###Advanced HTML Usage The following example shows a more advanced RUX Clock instance with data-bound aos and los values as well as hiding the timezone and day of year display.

<rux-clock
	aos=[[sat1.aos]]
	los=[[sat1.los]]
	hide-timezon=true
	hide-date=true></rux-clock>

###Properties

PropertyTypeDescription
aosdateIf a valid JavaScript Date object is passed in the AOS time will display next to the standard 24-hour clock. Updates to the passed in date object will be displayed immediately.
losdateIf a valid JavaScript Date object is passed in the LOS time will display next to the standard 24-hour clock. Updates to the passed in date object will be displayed immediately.
timezonestringOptional timzone setting. Accepted format is Country/City e.g., America/San_Francisco. Default timezone is UTC.
localestringOptional locale setting to format time in local time format. e.g., us-en. Default locale is us-en.
hide-timezonebooleanHides the timezone in the main 24-hour clock. Defaults to false
hide-datebooleanHides the day of the year. Defaults to false.