XJC/src/app/angular-bootstrap-md/pro/time-picker/timepickerComponent.metadata.json

[{"__symbolic":"module","version":3,"metadata":{"TIME_PIRCKER_VALUE_ACCESSOT":{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR"},"useExisting":{"__symbolic":"reference","name":"ClockPicker"},"multi":true},"ClockPicker":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"time-picker","template":"\n    <div>\n        <div class=\"md-form\">\n            <label class=\"active\">{{ label }}</label>\n            <input [placeholder]=\"placeholder\" [value]=\"endHours\" type=\"text\" class=\"form-control timepicker\" (click)=\"openBtnClicked()\" [(ngModel)]=\"endHours\">\n        </div>\n        <div class=\"clockpicker picker\" [hidden]=\"!showClock\" [ngClass]=\"{'picker--opened': showClock, 'darktheme': darktheme}\">\n            <div class=\"picker__holder\">\n            <div class=\"picker__frame\">\n                <div class=\"picker__wrap\">\n                <div class=\"picker__box\">\n                    <div class=\"picker__date-display\">\n                    <div class=\"clockpicker-display\">\n                        <div class=\"clockpicker-display-column\">\n                        <span class=\"clockpicker-span-hours text-primary\" [ngClass]=\"{'text-primary': showHours}\" (click)=\"showHoursClock()\">\n                        {{ selectedHours.h }}</span>:<span class=\"clockpicker-span-minutes\" [ngClass]=\"{'text-primary': !showHours}\"\n                            (click)=\"showMinutesClock()\">{{selectedHours.m }}</span>\n                        </div>\n                        <div class=\"clockpicker-display-column clockpicker-display-am-pm\" *ngIf=\"twelvehour\">\n                        <div class=\"clockpicker-span-am-pm\">{{ selectedHours.ampm }}</div>\n                        </div>\n                    </div>\n                    </div>\n                    <div class=\"picker__calendar-container\">\n                    <!--<div class=\"clockpicker-plate\" (mousedown)=\"changeTick($event)\" #plate>-->\n                    <div class=\"clockpicker-plate\" #plate>\n                        <div class=\"clockpicker-canvas\">\n                        <svg class=\"clockpicker-svg\" width=\"270\" height=\"270\" #svg>\n                            <g transform=\"translate(135,135)\" #g>\n                            <line x1=\"0\" y1=\"0\" x2=\"77.94228634059948\" y2=\"-45.00000000000001\" #hand></line>\n                            <circle class=\"clockpicker-canvas-fg\" r=\"5\" cx=\"95.26279441628824\" cy=\"-55.000000000000014\" #fg></circle>\n                            <circle class=\"clockpicker-canvas-bg\" r=\"20\" cx=\"95.26279441628824\" cy=\"-55.000000000000014\" #bg></circle>\n                            <circle class=\"clockpicker-canvas-bearing\" cx=\"0\" cy=\"0\" r=\"2\" #bearing></circle>\n                            </g>\n                        </svg>\n                        </div>\n                        <div class=\"clockpicker-dial clockpicker-hours\" #hoursPlate [ngClass]=\"{'clockpicker-dial-out': !showHours}\" [ngStyle]=\"{'visibility': !showHours ? 'hidden' : 'visible'}\">\n                        <div *ngFor=\"let tick of hoursTicks\" class=\"clockpicker-tick\" style=\"font-size: 140%;\" [ngStyle]=\"{'left': tick.left+'px', 'top': tick.top+'px'}\"\n                            id=\"{{ tick.hour }}\">\n                            {{ tick.hour }}\n                        </div>\n                        </div>\n                        <div class=\"clockpicker-dial clockpicker-minutes\" #minutesPlate [ngClass]=\"{'clockpicker-dial-out': showHours}\" [ngStyle]=\"{'visibility': showHours ? 'hidden' : 'visible'}\">\n                        <div *ngFor=\"let tick of minutesTicks\" class=\"clockpicker-tick\" style=\"font-size: 120%;\" [ngStyle]=\"{'left': tick.left+'px', 'top': tick.top+'px'}\">\n                            {{ tick.min }}\n                        </div>\n                        </div>\n                    </div>\n                    <div class=\"clockpicker-am-pm-block\" *ngIf=\"twelvehour\">\n                        <button type=\"button\" class=\"btn-floating btn-flat clockpicker-button am-button\" [ngClass]=\"{'active': selectedHours.ampm=='AM'}\"\n                        (click)=\"setAmPm('AM')\">\n                        AM\n                        </button>\n                        <button type=\"button\" class=\"btn-floating btn-flat clockpicker-button pm-button\" [ngClass]=\"{'active': selectedHours.ampm=='PM'}\"\n                        (click)=\"setAmPm('PM')\">\n                        PM\n                        </button>\n                    </div>\n                    </div>\n                    <div class=\"picker__footer\">\n                    <button type=\"button\" class=\"btn-flat clockpicker-button\" (click)=\"closeBtnClicked()\">\n                        Done\n                    </button>\n                    </div>\n                </div>\n                </div>\n            </div>\n            </div>\n        </div>\n    </div>\n  ","providers":[{"__symbolic":"reference","name":"TIME_PIRCKER_VALUE_ACCESSOT"}]}]}],"members":{"hoursPlate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["hoursPlate"]}]}],"minutesPlate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["minutesPlate"]}]}],"plate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["plate"]}]}],"svg":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["svg"]}]}],"g":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["g"]}]}],"hand":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["hand"]}]}],"fg":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["fg"]}]}],"bg":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["bg"]}]}],"bearing":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["bearing"]}]}],"twelvehour":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"},"arguments":["twelvehour"]}]}],"darktheme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"},"arguments":["darktheme"]}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"},"arguments":["placeholder"]}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"},"arguments":["label"]}]}],"duration":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"},"arguments":["duration"]}]}],"showClock":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"},"arguments":["showClock"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"checkDraw":[{"__symbolic":"method"}],"mousedown":[{"__symbolic":"method"}],"openBtnClicked":[{"__symbolic":"method"}],"closeBtnClicked":[{"__symbolic":"method"}],"setHour":[{"__symbolic":"method"}],"setMinute":[{"__symbolic":"method"}],"setAmPm":[{"__symbolic":"method"}],"showHoursClock":[{"__symbolic":"method"}],"showMinutesClock":[{"__symbolic":"method"}],"generateTick":[{"__symbolic":"method"}],"setHand":[{"__symbolic":"method"}],"offset":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"TIME_PIRCKER_VALUE_ACCESSOT":{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR"},"useExisting":{"__symbolic":"reference","name":"ClockPicker"},"multi":true},"ClockPicker":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"time-picker","template":"\n    <div>\n        <div class=\"md-form\">\n            <label class=\"active\">{{ label }}</label>\n            <input [placeholder]=\"placeholder\" [value]=\"endHours\" type=\"text\" class=\"form-control timepicker\" (click)=\"openBtnClicked()\" [(ngModel)]=\"endHours\">\n        </div>\n        <div class=\"clockpicker picker\" [hidden]=\"!showClock\" [ngClass]=\"{'picker--opened': showClock, 'darktheme': darktheme}\">\n            <div class=\"picker__holder\">\n            <div class=\"picker__frame\">\n                <div class=\"picker__wrap\">\n                <div class=\"picker__box\">\n                    <div class=\"picker__date-display\">\n                    <div class=\"clockpicker-display\">\n                        <div class=\"clockpicker-display-column\">\n                        <span class=\"clockpicker-span-hours text-primary\" [ngClass]=\"{'text-primary': showHours}\" (click)=\"showHoursClock()\">\n                        {{ selectedHours.h }}</span>:<span class=\"clockpicker-span-minutes\" [ngClass]=\"{'text-primary': !showHours}\"\n                            (click)=\"showMinutesClock()\">{{selectedHours.m }}</span>\n                        </div>\n                        <div class=\"clockpicker-display-column clockpicker-display-am-pm\" *ngIf=\"twelvehour\">\n                        <div class=\"clockpicker-span-am-pm\">{{ selectedHours.ampm }}</div>\n                        </div>\n                    </div>\n                    </div>\n                    <div class=\"picker__calendar-container\">\n                    <!--<div class=\"clockpicker-plate\" (mousedown)=\"changeTick($event)\" #plate>-->\n                    <div class=\"clockpicker-plate\" #plate>\n                        <div class=\"clockpicker-canvas\">\n                        <svg class=\"clockpicker-svg\" width=\"270\" height=\"270\" #svg>\n                            <g transform=\"translate(135,135)\" #g>\n                            <line x1=\"0\" y1=\"0\" x2=\"77.94228634059948\" y2=\"-45.00000000000001\" #hand></line>\n                            <circle class=\"clockpicker-canvas-fg\" r=\"5\" cx=\"95.26279441628824\" cy=\"-55.000000000000014\" #fg></circle>\n                            <circle class=\"clockpicker-canvas-bg\" r=\"20\" cx=\"95.26279441628824\" cy=\"-55.000000000000014\" #bg></circle>\n                            <circle class=\"clockpicker-canvas-bearing\" cx=\"0\" cy=\"0\" r=\"2\" #bearing></circle>\n                            </g>\n                        </svg>\n                        </div>\n                        <div class=\"clockpicker-dial clockpicker-hours\" #hoursPlate [ngClass]=\"{'clockpicker-dial-out': !showHours}\" [ngStyle]=\"{'visibility': !showHours ? 'hidden' : 'visible'}\">\n                        <div *ngFor=\"let tick of hoursTicks\" class=\"clockpicker-tick\" style=\"font-size: 140%;\" [ngStyle]=\"{'left': tick.left+'px', 'top': tick.top+'px'}\"\n                            id=\"{{ tick.hour }}\">\n                            {{ tick.hour }}\n                        </div>\n                        </div>\n                        <div class=\"clockpicker-dial clockpicker-minutes\" #minutesPlate [ngClass]=\"{'clockpicker-dial-out': showHours}\" [ngStyle]=\"{'visibility': showHours ? 'hidden' : 'visible'}\">\n                        <div *ngFor=\"let tick of minutesTicks\" class=\"clockpicker-tick\" style=\"font-size: 120%;\" [ngStyle]=\"{'left': tick.left+'px', 'top': tick.top+'px'}\">\n                            {{ tick.min }}\n                        </div>\n                        </div>\n                    </div>\n                    <div class=\"clockpicker-am-pm-block\" *ngIf=\"twelvehour\">\n                        <button type=\"button\" class=\"btn-floating btn-flat clockpicker-button am-button\" [ngClass]=\"{'active': selectedHours.ampm=='AM'}\"\n                        (click)=\"setAmPm('AM')\">\n                        AM\n                        </button>\n                        <button type=\"button\" class=\"btn-floating btn-flat clockpicker-button pm-button\" [ngClass]=\"{'active': selectedHours.ampm=='PM'}\"\n                        (click)=\"setAmPm('PM')\">\n                        PM\n                        </button>\n                    </div>\n                    </div>\n                    <div class=\"picker__footer\">\n                    <button type=\"button\" class=\"btn-flat clockpicker-button\" (click)=\"closeBtnClicked()\">\n                        Done\n                    </button>\n                    </div>\n                </div>\n                </div>\n            </div>\n            </div>\n        </div>\n    </div>\n  ","providers":[{"__symbolic":"reference","name":"TIME_PIRCKER_VALUE_ACCESSOT"}]}]}],"members":{"hoursPlate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["hoursPlate"]}]}],"minutesPlate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["minutesPlate"]}]}],"plate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["plate"]}]}],"svg":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["svg"]}]}],"g":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["g"]}]}],"hand":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["hand"]}]}],"fg":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["fg"]}]}],"bg":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["bg"]}]}],"bearing":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["bearing"]}]}],"twelvehour":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"},"arguments":["twelvehour"]}]}],"darktheme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"},"arguments":["darktheme"]}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"},"arguments":["placeholder"]}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"},"arguments":["label"]}]}],"duration":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"},"arguments":["duration"]}]}],"showClock":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"},"arguments":["showClock"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"checkDraw":[{"__symbolic":"method"}],"mousedown":[{"__symbolic":"method"}],"openBtnClicked":[{"__symbolic":"method"}],"closeBtnClicked":[{"__symbolic":"method"}],"setHour":[{"__symbolic":"method"}],"setMinute":[{"__symbolic":"method"}],"setAmPm":[{"__symbolic":"method"}],"showHoursClock":[{"__symbolic":"method"}],"showMinutesClock":[{"__symbolic":"method"}],"generateTick":[{"__symbolic":"method"}],"setHand":[{"__symbolic":"method"}],"offset":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}]}}}}]