Grimes hatte mal vor längerer Zeit ein Script für eine Seekbar mit laufenden grünen Balken und einigen Anzeigen in drin geschrieben.
Das Script war für WSH Panel mod.Siehe hier und Anhang:

DT_TOP = 0x00000000;
DT_LEFT = 0x00000000;
DT_CENTER = 0x00000001;
DT_RIGHT = 0x00000002;
DT_VCENTER = 0x00000004;
DT_BOTTOM = 0x00000008;
DT_SINGLELINE = 0x00000020;
DT_NOPREFIX = 0x00000800;

//--------

var g_font = gdi.Font("arial",18,1);
var g_font_rating = gdi.Font("Arial Unicode MS",25,0);
var g_fileinfo = null;

var g_drag = 0;
var g_drag_seek = 0;

var ww, wh, area;

//--------

function RGB(r,g,b){
return (0xff000000|(r<<16)|(g<<8)|(b));
}

function RGBA(r,g,b,a){
return ((a<<24)|(r<<16)|(g<<8)|(b));
}

//--------

function Separator(x) {
this.left = x;

this.draw = function (gr) {
gr.FillGradRect(this.left-1,0, 1, wh-1, 90, RGB(133,133,133), RGB(0,0,0));
gr.FillGradRect(this.left,0, 1, wh-1, 90, RGB(163,163,163), RGB(163,163,163));
gr.FillGradRect(this.left+1,0, 1, wh-1, 90, RGB(60,59,59), RGB(0,0,0));
}
}

function separatorsDraw(gr) {
for (i in Separators) {
Separators[i].draw(gr);
}
}

//--------

function TimeFmt(t){
var zpad = function(n){
var str = n.toString();
return (str.length<2) ? "0"+str : str;
}

var h = Math.floor(t/3600); t-=h*3600;
var m = Math.floor(t/60); t-=m*60;
var s = Math.floor(t);
if(h>0) return h.toString()+":"+zpad(m)+":"+zpad(s);
return m.toString()+":"+zpad(s);
}

// --- APPLICATION START

function on_paint(gr){
var pos = 0;
var length = fb.PlaybackLength;
var txt;

if(length > 0){
if(g_drag){
pos = area * g_drag_seek;
txt = "Seek " + TimeFmt(g_drag_seek * length) + " / " + TimeFmt(length);
}
else{
pos = area * (fb.PlaybackTime / length);   
var g_titlefmt = fb.TitleFormat("[%album artist% - ][%album% ]['['%date%']' - ]%title% >> $div($mul(100,%playback_time_seconds%),%length_seconds%) '%'");
txt = g_titlefmt.Eval();
}
}

gr.FillGradRect(4, 0, area, wh/2, 270, RGB(90, 90, 90), RGB(0, 0, 0));
gr.FillGradRect(4, wh/2, area, wh/2, 90, RGB(90, 90, 90), RGB(0, 0, 0));
gr.FillGradRect(0, 0, pos, wh/2, 270, RGB(0, 200, 200), RGB(0, 0, 0));
gr.FillGradRect(0,wh/2, pos, wh/2, 90, RGB(0, 200, 200), RGB(0, 0, 0));

gr.FillGradRect(2, 0, 1, wh-1, 90, RGB(163, 163, 163), RGB(163, 163, 163));
gr.FillGradRect(3, 0, 1, wh-1, 90, RGB(60, 59, 59), RGB(0, 0, 0));

separatorsDraw(gr);

gr.FillGradRect(ww-4, 0, 1, wh-1, 90, RGB(133, 133, 133), RGB(0, 0, 0));
gr.FillGradRect(ww-3, 0, 1, wh-1, 90, RGB(163, 163, 163), RGB(163, 163, 163));

gr.DrawRect(0, 0, ww, wh, 4.0, RGB(0,0,0));

gr.GdiDrawText(txt, g_font, RGB(255, 255, 255), 0, 0, ww, wh, DT_CENTER | DT_VCENTER | DT_SINGLELINE | DT_NOPREFIX);

var tfo_rating_a = fb.Titleformat("$if(%rating%,$repeat($char(9733),%rating%),)");
var tfo_rating_b = fb.Titleformat("$if(%rating%,$repeat($char(9734),$sub(5,%rating%)),)");
var txt_rating_a = tfo_rating_a.Eval();
var txt_rating_b = tfo_rating_b.Eval();

gr.GdiDrawText(txt_rating_a, g_font_rating, RGB(0,255,0), ww-120, 0, 110, wh, DT_LEFT | DT_VCENTER | DT_SINGLELINE);
gr.GdiDrawText(txt_rating_b, g_font_rating, RGB(255,0,0), ww-120, 0, 105, wh, DT_RIGHT | DT_VCENTER | DT_SINGLELINE);
}

function on_size(){
ww = window.Width;
wh = window.Height;
area = ww - 4;

Separators = {
one: new Separator((ww-4)/10),
two: new Separator((ww-4)/5),
three: new Separator(3*(ww-4)/10),
four: new Separator(2*(ww-4)/5),
five: new Separator(ww/2),
six: new Separator(3*(ww-4)/5),
seven: new Separator(7*(ww-4)/10),
eight: new Separator(4*(ww-4)/5),
nine: new Separator(9*(ww-4)/10)
}
}

function on_mouse_lbtn_down(x,y){
g_drag = 1;
}

function on_mouse_lbtn_up(x,y){
if(g_drag){
g_drag = 0;
g_drag_seek = x / area;
g_drag_seek = (g_drag_seek<0) ? 0 : (g_drag_seek<1) ? g_drag_seek : 1;
fb.PlaybackTime = fb.PlaybackLength * g_drag_seek;
}
}

function on_mouse_move(x,y){
if(g_drag){
g_drag_seek = x / area;
g_drag_seek = (g_drag_seek<0) ? 0 : (g_drag_seek<1) ? g_drag_seek : 1;
window.Repaint();
}
}

function on_playback_new_track(metadb){
window.Repaint();
}

function on_playback_stop(){
window.Repaint();
}

function on_playback_seek(time){
window.Repaint();
}

function on_playback_time(time){
window.Repaint();
}

// --- APPLICATION END
Script Engine war JScript9. Könnte man dieses Script nicht so modifizieren, dass es bei f2k v2 32/64bit mit JScript Panel funktioniert.

Ich selbst habe dazu einfach zu wenig Ahnung davon.

Ich kenn mich da auch nicht aus.
Du kannst es aber mal mit dem eingebauten JScript Sample "Seekbar" versuchen. Ist recht einfach gehalten. (rechtsklick) JScript Panel | Configure | Samples

Zitat von: grimes in 07. Februar 2023, 12:15:43Ich kenn mich da auch nicht aus.

Schade

Zitat von: grimes in 07. Februar 2023, 12:15:43Du kannst es aber mal mit dem eingebauten JScript Sample "Seekbar" versuchen. Ist recht einfach gehalten. (rechtsklick) JScript Panel | Configure | Samples

Das hatte ich schon. Sieht mir einfach zu langweilig und schlicht aus, im Gegensatz zum vorhandenen (s.Anhang)

Meine Meinung: Die schönste und funktionalste "Seekbar" ist Waveform minibar (mod)

mmmhhhh, da werd ich mal in Hydrogenaudio versuchen marc2003 zu aktivieren.
Danke für den Tip mit Waveform minibar (mod).

Ich hab festgestellt, dass sich WSH Panel Mod trotz UIE-Panel in v2 32bit DUI einbinden lässt.
Dadurch funktioniert jetzt mein Script auch bei v2. 

v2 64 bit werd ich dann demnächst dahingehend auch prüfen.

So, nach vielen Test bekomme ich dieses Script nicht in V2 64bit zum Laufen.

In Hydrogenaudio habe ich angefragt, ob jemand mir helfen könnte, dieses Script (s.o.) so zu modifizieren, dass es in Jscript 3 funktioniert. Leider nie ne Antwort bekommen. Vielleicht ist so ein Problem für die Experten dort zu profan.

Vielleicht kann mir hier doch inzwischen jemand helfen?

Zwar nur auf 32bit getestet, sollte aber mit JSP3 auf 64bit keinen Unterschied machen:

// ==PREPROCESSOR==
// @import "%fb2k_component_path%helpers.txt"
// ==/PREPROCESSOR==

var g_font = CreateFontString("arial",18,700);
var g_font_rating = CreateFontString("Arial Unicode MS",25,400);
var g_fileinfo = null;

var g_drag = 0;
var g_drag_seek = 0;

var ww, wh, area;

//--------

function RGB(r,g,b){
    return (0xff000000|(r<<16)|(g<<8)|(b));
}

function RGBA(r,g,b,a){
    return ((a<<24)|(r<<16)|(g<<8)|(b));
}

//--------

function Separator(x) {
    this.left = x;
   
    this.draw = function (gr) {
        FillGradientRectangle(gr, this.left-1,0, 1, wh-1, 0, RGB(133,133,133), RGB(0,0,0));
        FillGradientRectangle(gr, this.left,0, 1, wh-1, 0, RGB(163,163,163), RGB(163,163,163));
        FillGradientRectangle(gr, this.left+1,0, 1, wh-1, 0, RGB(60,59,59), RGB(0,0,0));
    }
}

function separatorsDraw(gr) {
    for (i in Separators) {
        Separators[i].draw(gr);
    }
}

//--------

function TimeFmt(t){
    var zpad = function(n){
        var str = n.toString();
        return (str.length<2) ? "0"+str : str;
    }

    var h = Math.floor(t/3600); t-=h*3600;
    var m = Math.floor(t/60); t-=m*60;
    var s = Math.floor(t);
    if(h>0) return h.toString()+":"+zpad(m)+":"+zpad(s);
    return m.toString()+":"+zpad(s);
}

// --- APPLICATION START

function on_paint(gr){
    var pos = 0;
    var length = fb.PlaybackLength;
    var txt;

    if(length > 0){
        if(g_drag){
            pos = area * g_drag_seek;
            txt = "Seek " + TimeFmt(g_drag_seek * length) + " / " + TimeFmt(length);
        }
        else{
            pos = area * (fb.PlaybackTime / length); 
            var g_titlefmt = fb.TitleFormat("[%album artist% - ][%album% ]['['%date%']' - ]%title% >> $div($mul(100,%playback_time_seconds%),%length_seconds%) '%'");
            txt = g_titlefmt.Eval();
        }
    }

    FillGradientRectangle(gr, 4, 0, area, wh/2, 0, RGB(0, 0, 0), RGB(90, 90, 90));
    FillGradientRectangle(gr, 4, wh/2, area, wh/2, 0, RGB(90, 90, 90), RGB(0, 0, 0));
    FillGradientRectangle(gr, 0, 0, pos, wh/2, 0, RGB(0, 0, 0), RGB(0, 200, 200));
    FillGradientRectangle(gr, 0,wh/2, pos, wh/2, 0, RGB(0, 200, 200), RGB(0, 0, 0));

    FillGradientRectangle(gr, 2, 0, 1, wh-1, 0, RGB(163, 163, 163), RGB(163, 163, 163));
    FillGradientRectangle(gr, 3, 0, 1, wh-1, 0, RGB(60, 59, 59), RGB(0, 0, 0));
   
    separatorsDraw(gr);

    FillGradientRectangle(gr, ww-4, 0, 1, wh-1, 1, RGB(133, 133, 133), RGB(0, 0, 0));
    FillGradientRectangle(gr, ww-3, 0, 1, wh-1, 1, RGB(163, 163, 163), RGB(163, 163, 163));

    gr.DrawRectangle(0, 0, ww, wh, 4.0, RGB(0,0,0));

    gr.WriteText(txt, g_font, RGB(255, 255, 255), 0, 0, ww, wh, 2, 2, 0);

    var tfo_rating_a = fb.Titleformat("$if(%rating%,$repeat($char(9733),%rating%),)");
    var tfo_rating_b = fb.Titleformat("$if(%rating%,$repeat($char(9734),$sub(5,%rating%)),)");
    var txt_rating_a = tfo_rating_a.Eval();
    var txt_rating_b = tfo_rating_b.Eval();

    gr.WriteText(txt_rating_a, g_font_rating, RGB(0,255,0), ww-120, 0, 110, wh, 0, 2, 1);
    gr.WriteText(txt_rating_b, g_font_rating, RGB(255,0,0), ww-120, 0, 105, wh, 1, 2, 1);
}

function on_size(){
    ww = window.Width;
    wh = window.Height;
    area = ww - 4;
   
    Separators = {
        one: new Separator((ww-4)/10),
        two: new Separator((ww-4)/5),
        three: new Separator(3*(ww-4)/10),
        four: new Separator(2*(ww-4)/5),
        five: new Separator(ww/2),
        six: new Separator(3*(ww-4)/5),
        seven: new Separator(7*(ww-4)/10),
        eight: new Separator(4*(ww-4)/5),
        nine: new Separator(9*(ww-4)/10)
    }
}

function on_mouse_lbtn_down(x,y){
    g_drag = 1;
}

function on_mouse_lbtn_up(x,y){
    if(g_drag){
        g_drag = 0;
        g_drag_seek = x / area;
        g_drag_seek = (g_drag_seek<0) ? 0 : (g_drag_seek<1) ? g_drag_seek : 1;
        fb.PlaybackTime = fb.PlaybackLength * g_drag_seek;
    }
}

function on_mouse_move(x,y){
    if(g_drag){
        g_drag_seek = x / area;
        g_drag_seek = (g_drag_seek<0) ? 0 : (g_drag_seek<1) ? g_drag_seek : 1;
        window.Repaint();
    }
}

function on_playback_new_track(metadb){
    window.Repaint();
}

function on_playback_stop(){
    window.Repaint();
}

function on_playback_seek(time){
    window.Repaint();
}

function on_playback_time(time){
    window.Repaint();
}

// --- APPLICATION END

Jep, lööpt und sieht schon mal gut aus. Danke 

Aber die Rating-Sterne liegen übereinander. (s.Bild) und bei Rating 5 werden nur 4 grüne Sterne angezeigt.

Vielleicht kannst du da noch etwas nachbessern.

Versuche in dieser Zeile

gr.WriteText(txt_rating_b, g_font_rating, RGB(255,0,0), ww-120, 0, 105, wh, 1, 2, 1);

den Wert 105 durch 140 zu ersetzen - passt dann zumindest bei mir, vlt. musst du etwas mit dem Wert herumspielen, damit es bei dir auch passt

Ich hatte das gerade selbt probiert und den Wert auf 155 gesetzt. Jetzt funktioniert es. Trotzdem danke für den funktionierenden Tip. 

Allerding bleibt es dabei, das bei Rating 5 nur 4 Sterne angezeigt werden. Da hab ich noch keine Lösung gefunden.

Hallo,

für welche JS-Panel-Version ist das Script geschrieben?
Bei mir kommt dieser Fehler:

JScript Panel 3.5.1 (id:332202)
Laufzeitfehler in JavaScript
Das Objekt unterstützt die Eigenschaft oder Methode "draw" nicht
File: <main>
Line: 49, Col: 9

vielen Dank füer Eure Mühe

Zitat von: mexx in Heute um 13:16:50Ich hatte das gerade selbt probiert und den Wert auf 155 gesetzt. Jetzt funktioniert es. Trotzdem danke für den funktionierenden Tip. 

Allerding bleibt es dabei, das bei Rating 5 nur 4 Sterne angezeigt werden. Da hab ich noch keine Lösung gefunden.

eventuell ww-120 etwas verkleinern, damit der Text weiter links beginnt? z.b. ww-130 oder ww-140