@obliczeniowo/elementary
Version:
Library made in Angular version 19
66 lines (65 loc) • 3.2 kB
TypeScript
import { AfterViewInit, ElementRef, EventEmitter, Renderer2 } from '@angular/core';
import { Point2D } from '@obliczeniowo/elementary/classes';
import { DrawingSvgInterface } from '@obliczeniowo/elementary/drawing';
import * as i0 from "@angular/core";
export interface DisplayClockTime {
seconds?: boolean;
time?: boolean;
interactive?: boolean;
}
/**
* Basic usage of component is to display time as HH:mm:ss format combined with a little dynamic svg
* element that display clock pointing time given in input time as Date object or [h, m, s]
*
* You can set 'interactive' mode by 'display' input set { interactive: true, ... }
* In this mode you can change time by clicking on modifying area fields, this will emit
* new date every time you click on this areas
*
* To have easy way of manipulate time size of clock-time must be at least 150px
*
* In interactive mode you can add own controls buttons:
*
* @example
*
* <obl-clock-time [display]="{ time: true; interactive: true }" [column]="true" #clock>
* <button (click)="setDate(clock)">OK</button>
* <obl-clock-time>
*/
export declare class ClockTimeComponent implements AfterViewInit {
protected renderer: Renderer2;
/** size of clock */
size: import("@angular/core").InputSignal<number>;
/** switch on/off displaying time text */
display: import("@angular/core").InputSignal<DisplayClockTime>;
/** font size */
fontSize: import("@angular/core").InputSignal<number | undefined>;
/** if display time is set to tru this one will control if clock and time text is displayed in one row or in column */
column: boolean;
/**
* set time by Date object or table of [hours, minutes, seconds]
*/
date: import("@angular/core").InputSignalWithTransform<Date, Date | [number, number, number]>;
/** Emit when date is changed */
changed: EventEmitter<Date>;
protected svg: ElementRef<SVGSVGElement>;
protected get noTime(): boolean;
protected interactiveTime?: Date;
protected dc: DrawingSvgInterface;
protected hRay: number;
protected mRay: number;
protected sRay: number;
protected hAngle: number;
protected mAngle: number;
protected sAngle: number;
protected pmAm: boolean;
protected mouse: Point2D;
constructor(renderer: Renderer2);
ngAfterViewInit(): void;
protected switchPmAm(): void;
protected clicked(event: MouseEvent): void;
protected mouseMove(event: MouseEvent): void;
protected draw(dc?: DrawingSvgInterface): void;
protected getBrowserName(): "edge" | "opera" | "chrome" | "ie" | "firefox" | "safari" | "other";
static ɵfac: i0.ɵɵFactoryDeclaration<ClockTimeComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<ClockTimeComponent, "obl-clock-time", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "display": { "alias": "display"; "required": false; "isSignal": true; }; "fontSize": { "alias": "fontSize"; "required": false; "isSignal": true; }; "column": { "alias": "column"; "required": false; }; "date": { "alias": "date"; "required": false; "isSignal": true; }; }, { "changed": "changed"; }, never, ["*"], false, never>;
}