guicomponents.js

Bindows 1.01 完全版 Bindows 框架提供给你： 基于类的面向对象 API； 一个完整的窗口系统

    this._line.setCssClassName("bi-slider-line");
    this.add(this._line);
    this._thumb = new BiComponent;
    this._thumb.setCssClassName("bi-slider-thumb");
    this.add(this._thumb);
    this.setOrientation(sOrientation || "horizontal");

    if (this._orientation == "horizontal")
        this.setSize(200, 22);

    else
        this.setSize(22, 200);

    this.setTabIndex(1);
    this._timer = new BiTimer;
    this._timer.setInterval(100);
    this._rangeModel.addEventListener("change", this._onchange, this);
    this.addEventListener("mousedown", this._onmousedown);
    this.addEventListener("mousewheel", this._onmousewheel);
    this.addEventListener("keydown", this._onkeydown);
    this._timer.addEventListener("tick", this._ontick, this);
}

var _p = BiSlider.prototype = new BiComponent;
_p._className = "BiSlider";
_p._preferredWidth = 200;
_p._preferredHeight = 22;
_p._blockIncrement = 10;
_p._unitIncrement = 1;
_p._tickIncrease = null;
_p.setOrientation = function(sOrientation)
{
    if (this._orientation != sOrientation)
    {
        this._orientation = sOrientation;
        this.setCssClassName("bi-slider bi-slider-" + sOrientation);

        if (sOrientation == "horizontal")
        {
            this._line.setLeft(0);
            this._line.setRight(0);
            this._line.setBottom(null);
        }

        else
        {
            this._line.setTop(0);
            this._line.setBottom(0);
            this._line.setRight(null);
        }

        this._layoutLine();
        this._layoutThumb();
    }
};

BiSlider.prototype.getOrientation = function()
{
    return this._orientation;
} ;

_p.setValue = function(nValue)
{
    this._rangeModel.setValue(nValue);
} ;

_p.getValue = function()
{
    return this._rangeModel.getValue();
} ;

_p.setMaximum = function(nMaximum)
{
    this._rangeModel.setMaximum(nMaximum);
} ;

_p.getMaximum = function()
{
    return this._rangeModel.getMaximum();
} ;

_p.setMinimum = function(nMinimum)
{
    this._rangeModel.setMinimum(nMinimum);
} ;

_p.getMinimum = function()
{
    return this._rangeModel.getMinimum();
} ;

_p.layoutAllChildren = function()
{
    this._layoutThumb();
    this._layoutLine();
    BiComponent.prototype.layoutAllChildren.call(this);
};

_p.layoutAllChildrenX = function()
{
    this._layoutThumbX();
    this._layoutLineX();
    BiComponent.prototype.layoutAllChildrenX.call(this);
};

_p.layoutAllChildrenY = function()
{
    this._layoutThumbY();
    this._layoutLineY();
    BiComponent.prototype.layoutAllChildrenY.call(this);
};

_p._layoutLine = function()
{
    this._layoutLineX();
    this._layoutLineY();
};

_p._layoutLineX = function()
{
    if (this._created)
    {
        if (this._orientation == "horizontal")
        {
        }

        else
        {
            this._line.setLeft((this.getClientWidth() - this._line.getWidth()) / 2);
        }
    }
};

_p._layoutLineY = function()
{
    if (this._created)
    {
        if (this._orientation == "horizontal")
        {
            this._line.setTop((this.getClientHeight() - this._line.getHeight()) / 2);
        }

        else
        {
        }
    }
};

_p._layoutThumb = function()
{
    this._layoutThumbX();
    this._layoutThumbY();
};

_p._layoutThumbX = function()
{
    if (this._created)
    {
        if (this._orientation == "horizontal")
        {
            this._thumb.setLeft((this.getValue() - this.getMinimum()) / (this.getMaximum() - this.getMinimum()) * (this.getClientWidth() - this._thumb.getWidth()));
        }

        else
        {
            this._thumb.setLeft((this.getClientWidth() - this._thumb.getWidth()) / 2);
        }
    }
};

_p._layoutThumbY = function()
{
    if (this._created)
    {
        if (this._orientation == "horizontal")
        {
            this._thumb.setTop((this.getClientHeight() - this._thumb.getHeight()) / 2);
        }

        else
        {
            this._thumb.setTop((this.getClientHeight() - this._thumb.getHeight()) * (1 - (this.getValue() - this.getMinimum()) / (this.getMaximum() - this.getMinimum())));
        }
    }
};

BiSlider.prototype.getUnitIncrement = function()
{
    return this._unitIncrement;
} ;

BiSlider.prototype.setUnitIncrement = function(v)
{
    this._unitIncrement = v;
} ;

BiSlider.prototype.getBlockIncrement = function()
{
    return this._blockIncrement;
} ;

BiSlider.prototype.setBlockIncrement = function(v)
{
    this._blockIncrement = v;
} ;

_p._onmousedown = function(e)
{
    this.addEventListener("mousemove", this._onmousemove);
    this.addEventListener("mouseup", this._onmouseup);
    this.addEventListener("losecapture", this._onmouseup);
    this.setCapture(true);

    if (this.getCanFocus())
        this.setFocused(true);

    if (e.getTarget() == this._thumb)
    {
        this._dragData = {
            screenX: e.getScreenX(), screenY: e.getScreenY(), dx: e.getScreenX() - this._thumb.getLeft(), dy: e.getScreenY() - this._thumb.getTop(), startValue: this.getValue()
        };
    }

    else
    {
        this._timer.start();
    }
};

_p._onmousemove = function(e)
{
    if (this._dragData)
    {
        var size, pos, reset;

        if (this._orientation == "horizontal")
        {
            size = this.getClientWidth() - this._thumb.getWidth();
            pos = e.getScreenX() - this._dragData.dx;
            reset = Math.abs(e.getScreenY() - this._dragData.screenY) > 100;
        }

        else
        {
            size = this.getClientHeight() - this._thumb.getHeight();
            pos = size - (e.getScreenY() - this._dragData.dy);
            reset = Math.abs(e.getScreenX() - this._dragData.screenX) > 100;
        }

        this.setValue(reset ? this._dragData.startValue : this.getMinimum() + (this.getMaximum() - this.getMinimum()) * pos / size);
    }

    else
    {
    }
};

_p._onmouseup = function(e)
{
    this.removeEventListener("mousemove", this._onmousemove);
    this.removeEventListener("mouseup", this._onmouseup);
    this.removeEventListener("losecapture", this._onmouseup);
    this.setCapture(false);

    if (this._dragData)
    {
        this._dragData = null;
    }

    else
    {
        this._timer.stop();
        this._tickIncrease = null;
    }
};

_p._onkeydown = function(e)
{
    switch (e.getKeyCode())
    {
        case BiKeyboardEvent.PAGE_UP:
        this.setValue(this.getValue() + this.getBlockIncrement());

        break;

        case BiKeyboardEvent.PAGE_DOWN:
        this.setValue(this.getValue() - this.getBlockIncrement());

        break;

        case BiKeyboardEvent.END:
        this.setValue(this.getOrientation() == "horizontal" ? this.getMaximum() : this.getMinimum());

        break;

        case BiKeyboardEvent.HOME:
        this.setValue(this.getOrientation() == "horizontal" ? this.getMinimum() : this.getMaximum());

        break;

        case BiKeyboardEvent.UP:
        case BiKeyboardEvent.RIGHT:
        this.setValue(this.getValue() + this.getUnitIncrement());

        break;

        case BiKeyboardEvent.LEFT:
        case BiKeyboardEvent.DOWN:
        this.setValue(this.getValue() - this.getUnitIncrement());

        break;
    }
};

_p._onmousewheel = function(e)
{
    this.setValue(this.getValue() + e.getWheelDelta() * this.getUnitIncrement());
} ;

_p._ontick = function(e)
{
    if (this._orientation == "horizontal")
    {
        var mouseX = BiMouseEvent.getClientX() - this.getClientLeft();
        var l = this._thumb.getLeft();
        var w = this._thumb.getWidth();

        if (mouseX < l && this._tickIncrease != true)
        {
            this.setValue(this.getValue() - this.getBlockIncrement());
            this._tickIncrease = false;
        }

        else if (mouseX > l + w && this._tickIncrease != false)
        {
            this.setValue(this.getValue() + this.getBlockIncrement());
            this._tickIncrease = true;
        }
    }

    else
    {
        var mouseY = BiMouseEvent.getClientY() - this.getClientTop();
        var t = this._thumb.getTop();
        var h = this._thumb.getHeight();

        if (mouseY < t && this._tickIncrease != false)
        {
            this.setValue(this.getValue() + this.getBlockIncrement());
            this._tickIncrease = true;
        }

        else if (mouseY > t + h && this._tickIncrease != true)
        {
            this.setValue(this.getValue() - this.getBlockIncrement());
            this._tickIncrease = false;
        }
    }
};

_p._onchange = function(e)
{
    this._layoutThumb();
    this.dispatchEvent(new BiEvent("change"));
};

_p.dispose = function()
{
    BiComponent.prototype.dispose.call(this);
    this._line = null;
    this._thumb = null;
};

function BiSpinner()
{
    BiComponent.call(this);
    this.setCssClassName("bi-spinner");
    this.setSize(50, 22);
    this._rangeModel = new BiRangeModel();
    var f = new BiFont(1);
    this._upButton = new BiButton;
    this._upButton.setCssClassName("bi-button bi-spinner-up-button");
    this._upButton.setFont(f);
    this._upButton.setIcon(new BiImage(BiSpinner.UP_BUTTON_IMAGE, 3, 2));
    this._upButton.setTabIndex(-1);
    this.add(this._upButton, null, true);
    this._downButton = new BiButton;
    this._downButton.setCssClassName("bi-button bi-spinner-down-button");
    this._downButton.setFont(f);
    this._downButton.setIcon(new BiImage(BiSpinner.DOWN_BUTTON_IMAGE, 3, 2));
    this._downButton.setTabIndex(-1);
    this.add(this._downButton, null, true);
    this._textField = new BiTextField;
    this._textField.setMaxLength(3);
    this._textField.setText("0");
    this.add(this._textField, null, true);
    this._upButton.setWidth(16);
    this._upButton.setTop(0);
    this._downButton.setWidth(16);
    this._downButton.setBottom(0);
    this._textField.setTop(0);
    this._textField.setBottom(0);
    this._positionComponents();
    this._timer = new BiTimer
    this._timer.setInterval(this._interval);
    this.setTabIndex(1);
    this._textField.addEventListener("keypress", this._onkeypress, this);
    this._textField.addEventListener("keydown", this._onkeydown, this);
    this._textField.addEventListener("keyup", this._onkeyup, this);
    this._textField.addEventListener("blur", this._onblur, this);
    this._upButton.addEventListener("mousedown", this._onmousedown, this);
    this._downButton.addEventListener("mousedown", this._onmousedown, this);
    this._rangeModel.addEventListener("change", this._onchange, this);
    this._timer.addEventListener("tick", this._ontick, this);
}

BiSpinner.UP_BUTTON_IMAGE = application.getPath() + "images/arrow.up.tiny.gif";
BiSpinner.DOWN_BUTTON_IMAGE = application.getPath() + "images/arrow.down.tiny.gif";
var _p = BiSpinner.prototype = new BiComponent;
_p._className = "BiSpinner";
_p._tickIncrease = null;
_p._incrementAmount = 1;
_p._interval = 100;
_p._firstInterval = 500;
_p.setValue = function(nValue)
{
    this._rangeModel.setValue(nValue);
} ;

_p.getValue = function()
{
    this._ensureValidValue();
    return this._rangeModel.getValue();
};

_p.setMaximum = function(nMaximum)
{
    this._rangeModel.setMaximum(nMaximum);
} ;

_p.getMaximum = function()
{
    return this._rangeModel.getMaximum();
} ;

_p.setMinimum = function(nMinimum)
{
    this._rangeModel.setMinimum(nMinimum);
} ;

_p.getMinimum = function()
{
    return this._rangeModel.getMinimum();
} ;

_p.layoutAllChildren = function()
{
    BiComponent.prototype.layoutAllChildren.call(this);
    this._layoutSpinnerButtons();
};

_p.layoutAllChildrenY = function()
{
    BiComponent.prototype.layoutAllChildrenY.call(this);
    this._layoutSpinnerButtons();
};

_p._layoutSpinnerButtons = function()
{
    var h = this.getClientHeight();
    this._upButton.setHeight(Math.ceil(h / 2));
    this._downButton.setHeight(Math.floor(h / 2));
};

_p.getPreferredWidth = function()
{
    var pw = Math.max(this._textField.getPreferredWidth(), this._textField.getMaxLength() * 9);
    var labelW = this._textField.getLeft() + pw - (this.getRightToLeft() ? 16 : 0);
    return labelW + 5 + 16;
};

_p.getPreferredHeight = function()
{
    return this._textField.getPreferredHeight() + 5;
} ;

_p.setFont = function(oFont)
{
    this._textField.setFont(oFont);
} ;

_p.getFont = function()
{
    return this._textField.getFont();
} ;

_p.setAlign = function(sAlign)
{
    this._textField.setAlign(sAlign);
} ;

_p.getAlign = function()
{
    return this._textField.getAlign();
} ;

_p.setTabIndex = function(nTabIndex)
{
    BiComponent.prototype.setTabIndex.call(this, -1);
    this._textField.setTabIndex(nTabIndex);
};

_p.getTabIndex = function()
{
    return this._textField.getTabIndex();
} ;

_p.setFocused = function(bFocused)
{
    if (this.getCanFocus())
        this._textField.setFocused(bFocused);
};

_p.setEnabled = function(b)
{
    BiComponent.prototype.setEnabled.call(this, b);
    this._upButton.setEnabled(b);
    this._downButton.setEnabled(b);
    this._textField.setEnabled(b);
};

_p._selectOnTabFocus = function()
{
    this._textField.selectAll();
} ;

_p.setRightToLeft = function(b)
{
    BiComponent.prototype.setRightToLeft.call(this, b);
    this._positionComponents();
    this._textField.setAlign(this.getRightToLeft() ? "left" : "right");
};

_p._positionComponents = function()
{
    if (this.getRightToLeft())
    {
        this._upButton.setRight(null);
        this._upButton.setLeft(0);
        this._downButton.setRight(null);
        this._downButton.setLeft(0);
        this._textField.setRight(0);
        this._textField.setLeft(16);
    }

    else
    {
        this._upButton.setLeft(null);
        this._upButton.setRight(0);
        this._downButton.setLeft(null);
        this._downButton.setRight(0);
        this._textField.setLeft(0);
        this._textField.setRight(16);
    }
};

_p._onkeypress = function(e)
{
    var kc = e.getKeyCode();

    if (kc == BiKeyboardEvent.ENTER && !e.getAltKey())
    {
        this._ensureValidValue();
        this._textField.selectAll();
        this.dispatchEvent(new BiEvent("action"));

        if (this._command)
            this._command.execute();
    }

    else
    {
        var preventDefault = true;

        switch (kc)
        {
            case BiKeyboardEvent.UP:
            case BiKeyboardEvent.DOWN:
            case BiKeyboardEvent.LEFT:
            case BiKeyboardEvent.RIGHT:
            case BiKeyboardEvent.SHIFT:
            case BiKeyboardEvent.CTRL: