import { ChangeDetectorRef, Component, ElementRef, Renderer, Optional, forwardRef, Input } from '@angular/core'; import { Platform, Config, DomController, Form, Haptic, Item, Range } from 'ionic-angular'; import { NG_VALUE_ACCESSOR } from '@angular/forms'; class TempRange extends Range { static decorators = undefined; } export const MCRANGE_VALUE_ACCESSOR: any = { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => McRangeComponent), multi: true }; @Component({ selector: 'mc-range', template: '' + '
' + '' + '' + '' + '
' + '
' + '
{{_min}}{{_unit}}{{_max}}{{_unit}}' + '', host: { '[class.range-disabled]': '_disabled', '[class.range-pressed]': '_pressed', '[class.range-has-pin]': '_pin' }, providers: [MCRANGE_VALUE_ACCESSOR] }) export class McRangeComponent extends TempRange { //text: string; _description: string; _unit: string; _plt_mf: Platform; constructor( _form: Form, _haptic: Haptic, @Optional() _item: Item, config: Config, _plt: Platform, elementRef: ElementRef, renderer: Renderer, _dom: DomController, _cd: ChangeDetectorRef ) { super( _form, _haptic, _item, config, _plt, elementRef, renderer, _dom, _cd ); this._description = ''; this._unit = ''; this._plt_mf = _plt; // console.log('Hello McRange Component'); // this.text = 'Hello World'; } /** * @input {number} Maximum integer value of the range. Defaults to `100`. */ @Input() get description(): string { return this._description; } set description(val: string) { this._description = val; } @Input() get step(): number { return this._step; } set step(val: number) { if (!isNaN(val) && val > 0) { this._step = val; } } @Input() get unit(): string { return this._unit; } set unit(val: string) { this._unit = ' ' + val; } _ratioToValue(ratio: number) { //this._step = 0.1; ratio = (this._max - this._min) * ratio; ratio = Math.round(ratio / this._step) * this._step + this._min; return Math.round( ratio * 100 ) / 100; // strange bug with 10th significant digit // return clamp(this._min, ratio, this._max) + 12.3; } _pointerDown(ev: UIEvent): boolean { // console.log( ev ); if( ev.srcElement.className != "range-slider" || !this._plt_mf.is( 'ios' ) ) return super._pointerDown( ev ); return false; } }