private initRangeSlicer()

in src/sampleSlicer.ts [579:642]


    private initRangeSlicer(parent: HTMLElement): void {

      this.rangeSlicer = d3Select(parent)
          .append('div')
          .classed(SampleSlicer.RangeSlicerSelector.className, true)
          .style('background', '#ffffff');

        this.rangeSlicerHead = this.rangeSlicer
            .append('div')
            .classed(SampleSlicer.RangeSlicerHeadSelector.className, true);

        this.rangeSlicerControls = this.rangeSlicerHead
            .append('div')
            .classed(SampleSlicer.RangeSlicerControlsSelector.className, true);

        this.rangeSlicerSlider = this.rangeSlicerHead
            .append('div')
            .classed(SampleSlicer.RangeSlicerSliderSelector.className, true);

        this.startControl = this.rangeSlicerControls
            .append('div')
            .classed(SampleSlicer.RangeSlicerControlSelector.className, true);

        this.endControl = this.rangeSlicerControls
            .append('div')
            .classed(SampleSlicer.RangeSlicerControlSelector.className, true);

        this.startInput = SampleSlicer.appendInputElement(this.startControl.nodes()[0]);
        this.endInput = SampleSlicer.appendInputElement(this.endControl.nodes()[0]);

        this.startInput.addEventListener("change", (event: Event) => {
            const inputString: string = this.startInput.value;
            this.onRangeInputTextboxChange(inputString, RangeValueType.Start);
        });

        this.startInput.addEventListener("keyup", (event: KeyboardEvent) => {
            if (event.keyCode === 13) {
                const inputString: string = this.startInput.value;
                this.onRangeInputTextboxChange(inputString, RangeValueType.Start);
            }
        });

        this.startInput.addEventListener("focus", (event: Event) => {
            this.startInput.value = SampleSlicer.formatValue(this.behavior.scalableRange.getValue().min);
            this.startInput.select();
        });

        this.endInput.addEventListener("change", (event: Event) => {
            const inputString: string = this.endInput.value;
            this.onRangeInputTextboxChange(inputString, RangeValueType.End);
        });

        this.endInput.addEventListener("keyup", (event: KeyboardEvent) => {
            if (event.keyCode === 13) {
                const inputString: string = this.endInput.value;
                this.onRangeInputTextboxChange(inputString, RangeValueType.End);
            }
        });

        this.endInput.addEventListener("focus", (event: Event) => {
            this.endInput.value = SampleSlicer.formatValue(this.behavior.scalableRange.getValue().max);
            this.endInput.select();
        });
    }