[!--sizeo:4--][span style=\"font-size:14pt;line-height:100%\"][!--/sizeo--]function RGB(r, g, b) {
return (0xff000000 | (r << 16) | (g << 8) | (b));
}
ButtonStates = {
normal: 0,
hover: 1,
down: 2,
hide: 3
}
var DT_TOP = 0x00000000;
var DT_CENTER = 0x00000001;
var DT_VCENTER = 0x00000004;
var DT_WORDBREAK = 0x00000010;
var DT_CALCRECT = 0x00000400;
var DT_NOPREFIX = 0x00000800;
normal = RGB(120, 120, 120);
hover = RGB(220, 220, 0)
down = RGB(0, 0, 220)
ButtonStates = {
normal: 0,
hover: 1,
down: 2,
hide: 3
}
var text_color = {normal: normal, hover: hover, down: down}
var text_color_paused = {normal: hover, hover: hover, down: down}
var g_theme = window.CreateThemeManager("Toolbar");
var g_font = gdi.Font("Tahoma", 12);
function SimpleButton(x, y, w, h, text, text_color, fonClick, state) {
this.state = state ? state : ButtonStates.normal;
this.x = x;
this.y = y;
this.w = w;
this.h = h;
this.text = text;
this.button_normal = text_color.normal;
this.button_hover = text_color.hover;
this.button_down = text_color.down;
this.color = text_color.normal;
this.fonClick = fonClick;
this.containXY = function (x, y) {
return (this.x <= x) && (x <= this.x + this.w) && (this.y <= y) && (y <= this.y + this.h);
}
this.changeState = function (state) {
var old = this.state;
this.state = state;
return old;
}
this.draw = function (gr) {
if (this.state == ButtonStates.hide) return;
switch (this.state)
{
case ButtonStates.normal:
g_theme.SetPartAndStateId(1,2);
this.color = this.button_normal;
break;
case ButtonStates.hover:
g_theme.SetPartAndStateId(1, 2);
this.color = this.button_hover;
break;
case ButtonStates.down:
g_theme.SetPartAndStateId(1, 3);
this.color = this.button_down;
break;
case ButtonStates.hide:
return;
}
g_theme.DrawThemeBackground(gr, this.x, this.y, this.w, this.h);
gr.GdiDrawText(this.text, g_font, this.color, this.x, this.y, this.w, this.h, DT_CENTER| DT_VCENTER | DT_CALCRECT | DT_NOPREFIX);
}
this.onClick = function () {
this.fonClick && this.fonClick();
}
}
function drawAllButtons(gr) {
for (var i in $buttons) {
$buttons[i].draw(gr);
}
}
function chooseButton(x, y) {
for (var i in $buttons) {
if ($buttons[i].containXY(x, y) && $buttons[i].state != ButtonStates.hide) return $buttons[i];
}
return null;
}
function on_size()
{
ww = window.Width;
wh = window.Height;
var x = ww/2-190;
var y = wh/2-13;
var w = 80;
var h = 26;
var d = 100;
$buttons = {
Stop: new SimpleButton( x, y, w, h, "STOP", text_color, function () { fb.Stop(); } ),
Prev: new SimpleButton( x+d, y, w, h, "PREV", text_color, function () { fb.Prev(); } ),
Play: new SimpleButton( x+d*2, y, w, h, (fb.IsPlaying&&!fb.IsPaused)?"PAUSE":"PLAY",(fb.IsPlaying&&!fb.IsPaused)? text_color_paused:text_color, function () { fb.PlayOrPause(); } ),
Next: new SimpleButton( x+d*3, y, w, h, "NEXT", text_color, function () { fb.Next(); } )
}
}
var cur_btn = null;
var g_down = false;
// --- APPLICATION START
function on_playback_pause(is_paused) {
$buttons.Play.text=is_paused?"PLAY":"PAUSE";
$buttons.Play.color=is_paused?text_color_paused:text_color;
window.Repaint();
}
function on_playback_stop() {
$buttons.Play.text="PLAY";
$buttons.Play.color=text_color;
window.Repaint();
}
function on_playback_starting(cmd, is_paused) {
$buttons.Play.text=is_paused?"PLAY":"PAUSE";
$buttons.Play.color=is_paused?text_color_paused:text_color;
window.Repaint();
}
function on_paint(gr) {
gr.FillSolidRect(0, 0, ww, wh, RGB(22,32,41));
drawAllButtons(gr);
}
function on_mouse_move(x, y) {
var old = cur_btn;
cur_btn = chooseButton(x, y);
if (old == cur_btn) {
if (g_down) return;
} else if (g_down && cur_btn && cur_btn.state != ButtonStates.down) {
cur_btn.changeState(ButtonStates.down);
window.Repaint();
return;
}
old && old.changeState(ButtonStates.normal);
cur_btn && cur_btn.changeState(ButtonStates.hover);
window.Repaint();
}
function on_mouse_leave() {
g_down = false;
if (cur_btn) {
cur_btn.changeState(ButtonStates.normal);
window.Repaint();
}
}
function on_mouse_lbtn_down(x, y) {
g_down = true;
if (cur_btn) {
cur_btn.changeState(ButtonStates.down);
window.Repaint();
}
}
function on_mouse_lbtn_up(x, y) {
g_down = false;
if (cur_btn) {
cur_btn.onClick();
cur_btn.changeState(ButtonStates.hover);
window.Repaint();
}
}
// --- APPLICATION END
[/size]
Hi it's me again crying for help! I created simple playback buttons Stop Prev Play/Pause Next using the included sample code "SimpleThemedButton"
The buttons works fine when i click play button the text changes to pause and vice versa, what i can't figure out is how to change text color to hover color when paused etc. The code works when you click pause and resize the window little bit then the color changes, so i think i'm almost there... can somebody please take a look at the code and point me to the right direction.
Topic: WSH Panel Mod (Read 815113 times)
previous topic - next topic