<commit_before>import { BaseSlider } from "./baseslider";
import { Measure } from "../measure";
import { Image } from "./image";

/**
 * Class used to create slider controls based on images
 */
export class ImageBasedSlider extends BaseSlider {
    private _backgroundImage: Image;
    private _thumbImage: Image;
    private _valueBarImage: Image;

    private _tempMeasure = new Measure(0, 0, 0, 0);

    /**
     * Gets or sets the image used to render the background
     */
    public get backgroundImage(): Image {
        return this._backgroundImage;
    }

    public set backgroundImage(value: Image) {
        if (this._backgroundImage === value) {
            return;
        }

        this._backgroundImage = value;

        if (value && !value.isLoaded) {
            value.onImageLoadedObservable.addOnce(() => this._markAsDirty());
        }

        this._markAsDirty();
    }

    /**
     * Gets or sets the image used to render the thumb
     */
    public get thumbImage(): Image {
        return this._thumbImage;
    }

    public set thumbImage(value: Image) {
        if (this._thumbImage === value) {
            return;
        }

        this._thumbImage = value;

        if (value && !value.isLoaded) {
            value.onImageLoadedObservable.addOnce(() => this._markAsDirty());
        }

        this._markAsDirty();
    }

    /**
     * Creates a new ImageBasedSlider
     * @param name defines the control name
     */
    constructor(public name?: string) {
        super(name);
    }

    protected _getTypeName(): string {
        return "ImageBasedSlider";
    }

    public _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void {
        context.save();

        this._applyStates(context);
        if (this._processMeasures(parentMeasure, context)) {

            this._prepareRenderingData("rectangle");
            const thumbPosition = this._getThumbPosition();
            var left = this._renderLeft;
            var top = this._renderTop;
            var width = this._renderWidth;
            var height = this._renderHeight;


            // Background
            if (this._backgroundImage) {
                this._tempMeasure.copyFromFloats(left, top, width, height);
                this._backgroundImage._draw(this._tempMeasure, context);<commit_msg>added vertical support<commit_after>import { BaseSlider } from "./baseslider";
import { Measure } from "../measure";
import { Image } from "./image";

/**
 * Class used to create slider controls based on images
 */
export class ImageBasedSlider extends BaseSlider {
    private _backgroundImage: Image;
    private _thumbImage: Image;
    private _valueBarImage: Image;

    private _tempMeasure = new Measure(0, 0, 0, 0);

    /**
     * Gets or sets the image used to render the background
     */
    public get backgroundImage(): Image {
        return this._backgroundImage;
    }

    public set backgroundImage(value: Image) {
        if (this._backgroundImage === value) {
            return;
        }

        this._backgroundImage = value;

        if (value && !value.isLoaded) {
            value.onImageLoadedObservable.addOnce(() => this._markAsDirty());
        }

        this._markAsDirty();
    }

    /**
     * Gets or sets the image used to render the thumb
     */
    public get thumbImage(): Image {
        return this._thumbImage;
    }

    public set thumbImage(value: Image) {
        if (this._thumbImage === value) {
            return;
        }

        this._thumbImage = value;

        if (value && !value.isLoaded) {
            value.onImageLoadedObservable.addOnce(() => this._markAsDirty());
        }

        this._markAsDirty();
    }

    /**
     * Creates a new ImageBasedSlider
     * @param name defines the control name
     */
    constructor(public name?: string) {
        super(name);
    }

    protected _getTypeName(): string {
        return "ImageBasedSlider";
    }

    public _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void {
        context.save();

        this._applyStates(context);
        if (this._processMeasures(parentMeasure, context)) {

            this._prepareRenderingData("rectangle");
            const thumbPosition = this._getThumbPosition();
            var left = this._renderLeft;
            var top = this._renderTop;
            var width = this._renderWidth;
            var height = this._renderHeight;


            // Background
            if (this._backgroundImage) {
                this._tempMeasure.copyFromFloats(left, top, width, height);
                if (this.isThumbClamped) {
                    if (this.isVertical) {
                        this._tempMeasure.height += this._effectiveThumbThickness;
                    } else {
                        this._tempMeasure.width += this._effectiveThumbThickness;
                    }

                }
                this._backgroundImage._draw(this._tempMeasure, context);
{'fraction_non_alphanumeric': 0.10289389067524116, 'fraction_numerical': 0.0020096463022508037, 'mean_word_length': 2.0552486187845305, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 7, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5899450', 'n_tokens_mistral': 1331, 'n_tokens_neox': 1282, 'n_words': 332}