So, here is a simple test-script to show how it works. All in all, it's just a svg that rotates the dot to show the changing value. Atm, the knob rotates when dragging mouse up/down on the knob. Maybe this should be extended to left/right actions as well. Please check out the code; it should be easy to understand with some basic bash/gtkdialog/svg knowledge.

The code:

#!/bin/bash 

export KNOB_WIDTH=120 

export KNOB_COLOR="#A5E8B1" 

export CARD_NR=0 #'aplay -l' shows your cards 

export SPEAKER=Master 
#initial audio level 

TMP="`amixer -c $CARD_NR get "$SPEAKER" | grep -m1 'Left:' | cut -d '%' -f 1 | cut -d '[' -f 2`" #volume level 

ANGLE=$(($TMP*250/100)) #convert from % to angle (0-250) 

echo $ANGLE > /tmp/knob_angle 
draw_knob (){ #$1=angle/value, $2=width, $3=color, $4=dot-color 

 echo ' 

 <svg width="'${2}'" height="'${2}'"> 

 <defs> 

 <radialGradient 

 cx="'$((${2}*30/100))'" cy="'$((${2}*30/100))'" fx="'$((${2}*30/100))'" fy="'$((${2}*30/100))'" r="'$((${2}*45/100))'" 

 gradientUnits="userSpaceOnUse"> 

 <stop offset="1"/> 

 <stop offset="0"/> 

 </radialGradient> 

 </defs> 

 <circle cx="'$(((${2}/2)+(${2}*4/100)))'" cy="'$(((${2}/2)+(${2}*4/100)))'" r="'$((${2}*46/100))'"/> 

 <circle cx="'$((${2}/2))'" cy="'$((${2}/2))'" r="'$((${2}*46/100))'"/> 

 <circle cx="'$((${2}/2))'" cy="'$((${2}/2))'" r="'$((${2}*39/100))'"/> 

 <circle cx="'$((${2}*28/100))'" cy="'$((${2}*74/100))'" r="'$((${2}*4/100))'" transform="rotate('${1}' '$((${2}/2))' '$((${2}/2))')"/> 

 </svg>' 

} 
update (){ #get current, relative position of cursor 

 read ANGLE < /tmp/knob_angle 

 Y="`getcurpos | awk '{print $2}'`" 

 read Y2 < /tmp/cursor_y 

 ANGLE=$(($ANGLE+(($Y2-$Y)*2))) #the knob's value range is equal to moving mouse up/down 125 px. 

 [ $ANGLE -lt 1 ] && ANGLE=0; [ $ANGLE -gt 250 ] && ANGLE=250 #keep value inside range 

 echo $Y > /tmp/cursor_y 

 echo $ANGLE > /tmp/knob_angle 

 draw_knob $ANGLE $KNOB_WIDTH "$KNOB_COLOR" "#eee" > /tmp/knob.svg 

 amixer -c $CARD_NR set "$SPEAKER" $(($ANGLE*100/250))% 

} 
export -f draw_knob update 

draw_knob $ANGLE $KNOB_WIDTH "$KNOB_COLOR" "#eee" > /tmp/knob.svg 
echo ' 

<vbox margin="20"> 

 <timer visible="false" milliseconds="true" interval="100" sensitive="false"> 

 <variable>TIMER</variable> 

 <action>update</action> 

 <action>refresh:KNOB</action> 

 </timer> 

 <eventbox> 

 <pixmap> 

 <variable>KNOB</variable> 

 <input file>/tmp/knob.svg</input> 

 </pixmap> 

 <action signal="button-press-event">getcurpos | awk '"'"'{print $2}'"'"' > /tmp/cursor_y</action> 

 <action signal="button-press-event">enable:TIMER</action> 

 <action signal="button-release-event">disable:TIMER</action> 

 </eventbox> 

 <text><label>Volume</label></text> 

</vbox>' | gtkdialog -s 

Be aware that this knob depends on the getcurpos command. This is included in all recent Puppies. But I doubt that you'll find getcurpos in most other distros, so I see this as Puppy-code. You should probably avoid this code if you plan to offer your gui outside the kennel.

This info is added to the Tips and tricks post

No comments posted yet.