The gtkdialog lib


Did you know about the gtkdialog lib?

Puppies built from Woof-CE uses /usr/lib/gtkdialog/ to unify the look of builtin GUIs. Together with the new vector icon set (in /usr/share/pixmaps/puppy), the gtkdialog lib made it possible to give Puppy a facelift without adding any bloat to the core.

The lib is simple and small. It is meant to reduce the code for repeating requests (as message-boxes), and unify the look for graphical widgets (as scalegrips and svgs). A complete guide how to use the different snippets are found inside each file (open in text-editor). It contains 3 different categories:


1. BOX
These return running gtkdialog boxes with requested info. Gtkdialog is not complex at all, but dead simple boxes often used by Puppy, can be set up with a oneliner. This is not meant as a replacement for Xdialog.

There are atm 4 different types of boxes:
box_help
box_ok
box_splash
box_yesno

Example:
/usr/lib/gtkdialog/box_ok Title error "This is an error"




2. XML
While the box-code produces a running gui, the xml-code is gtkdialog code meant to be embedded inside the parent gui. These are used to unify the look, and is cooperating with pTheme to follow the global theming.

There are 4 xml-snippets available:
xml_button_icon
xml_info
xml_pixmap
xml_scalegrip

Example: - Note the 'xml_info gtk' that activates the gtkdialog-theme set by pTheme.
export GUI='

<vbox space-expand="true" space-fill="true">
'"`/usr/lib/gtkdialog/xml_info fixed puppy_config.svg 60 "This is the header used in Puppy these days. It handles <b>markups</b>."`"'
<button ok></button>
</vbox>'
. /usr/lib/gtkdialog/xml_info gtk #build bg_pixmap for gtk-theme
gtkdialog -p GUI




3. SVG
The svg category returns svg-code to embed in the gtkdialog code. Today, there are 3, but the knob shown in previous post should probably be added here. As expected, the svg bars and text follows the global theming set by pTheme.
svg_analogclock
svg_bar
svg_text

Example:
echo '

<vbox>
<timer visible="false">
<action>/usr/lib/gtkdialog/svg_analogclock 300 > /tmp/clock.svg</action>
<action>refresh:CLOCK</action>
</timer>
<pixmap space-expand="false" space-fill="false">
<variable>CLOCK</variable>
<input file>/tmp/clock.svg</input>
</pixmap>
</vbox>' | gtkdialog -s



Posted on 19 May 2016, 20:19 by zigbert - Categories: Development
No comments - Edit - Delete


gtkdialog knob


Some time ago mister_electronico on the Puppy forum started the discussion of using knobs in gtkdialog code. I gave some feedback but the code never entered a final state. I have now revisited the code, and plan to use it myself.

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
id="RG1" cx="'$((${2}*30/100))'" cy="'$((${2}*30/100))'" fx="'$((${2}*30/100))'" fy="'$((${2}*30/100))'" r="'$((${2}*45/100))'"
gradientUnits="userSpaceOnUse">
<stop style="stop-color:#393939;stop-opacity:1;" offset="1"/>
<stop style="stop-color:#888;stop-opacity:1;" offset="0"/>
</radialGradient>
</defs>
<circle style="fill:#222;" cx="'$(((${2}/2)+(${2}*4/100)))'" cy="'$(((${2}/2)+(${2}*4/100)))'" r="'$((${2}*46/100))'"/>
<circle style="fill:#777;stroke:#444" cx="'$((${2}/2))'" cy="'$((${2}/2))'" r="'$((${2}*46/100))'"/>
<circle style="fill:url(#RG1);stroke:'${3}';stroke-width:'$((${2}*2/100))'" cx="'$((${2}/2))'" cy="'$((${2}/2))'" r="'$((${2}*39/100))'"/>
<circle style="fill:'${4}';" 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

Posted on 10 May 2016, 04:09 by zigbert - Categories: Development
No comments - Edit - Delete


pMusic visualization


This is just for fun - and just because ffmpeg allows us to do it.

At the moment it's a very simple visualization engine. But the more recent ffmpeg releases allows more sophisticated solutions by combining several modes into one visual 'show'. I will include more of these when we get there, but for now, a basic coding-structure is in place.

The visualization presets found in the menu is defined in the file /usr/local/pmusic/txt_visualization, and contains 2 columns: Name and Command.
Wave 1|amovie=/root/.pmusic/tmp/pmusic.sdp, asplit [a][out1]; [a] showwaves [out0]

Wave 2|amovie=/root/.pmusic/tmp/pmusic.sdp, asplit [a][out1]; [a] showwaves=mode=line [out0]
Waves 1|amovie=/root/.pmusic/tmp/pmusic.sdp, asplit [a][out1]; [a] showwaves=mode=p2p:split_channels=1 [out0]
Waves 2|amovie=/root/.pmusic/tmp/pmusic.sdp, asplit [a][out1]; [a] showwaves=mode=cline:split_channels=1 [out0]
It maybe looks complex, but a closer look shows that only the last part of the command is unique. For line 2 that is; showwaves=mode=line

Note!
This will NOT make pMusic depend on a newer ffmpeg as extended visualization is optional. I plan to stick with 1.2. But, ffmpeg is evolving fast, so we have to keep an eye of what we 'need' in the future.

see also:
ffmpeg - the multimedia hub
pMusic - FFmpeg monitor




Posted on 10 Jun 2016, 18:07 by zigbert - Categories: Development
No comments - Edit - Delete


pMusic - FFmpeg monitor


pMusic is a showcase of what gtkdialog is capable to do, and is probably the most complex gtkdialog code out there- It includes solutions of many gtkdialog challenges. Examples are:
- Take advantage of vector graphics and advanced text layout
- Conditional actions to avoid heavy cpu-usage when idle
- Alignments and scaling
- Extended gtk theming
- Different ways for a flexible gui without re-rendering.
- etc...

But there is no reason for a showcase without making it transparent for the users/testers. Sharing knowledge is what moves us forward. pMusic includes the attribute 'pmusic --dump-gtk' to show the generated gtkdialog code of the main gui. Else, most code is sent to temporary files in $HOME/.pmusic/tmp/

pMusic is also a playground to test ffmpeg as an advanced audio backend. For the next major release (5.1.0), it will use more of the ffmpeg features. I will come back to this later, but today we'll talk about transparency.

For years, there has been a plugin (Backend info) to show what's going on in the background. As the use of ffmpeg extends, I find it important to share the backend-codes. Not only to enlighten others, but also to make you offer improved code back to pMusic. It is a win-win situation. When 5.1.0 is shipped, it will include the improved plugin with more ffmpeg knowledge:
- The ffmpeg log
- The play command
- The export (convert) command
- The visualization command
It gives a wider insight of the ffmpeg possibilities, and how pMusic uses them.




Posted on 30 Apr 2016, 06:34 by zigbert - Categories: Development
No comments - Edit - Delete


Icon Theme


With the enormous aid of zigbert and technosaurus I have been able to develop an freedesktop compliant (mostly) icon theme that can be used in any Linux or other Unix (if the specification is supported).

So what?

It is light as a feather. As a comprehensive theme it weighs in at 53KB (xz compressed ~ 200KB gzip compressed). That is very little in terms of an ISO image and it can totally replace all the PNG Rox Filer icons (MIME). Not only is it compatible with Rox but all freedesktop compliant file managers whether they use the GTK, FLTK or QT (or other) UI toolkits (any version).

So where is it?

I have created a github repo with the icon source. It's very simple to build and package. Take a look here and enjoy!

Posted on 24 Apr 2016, 21:03 by 01micko - Categories: Development
2 Comments - Edit - Delete


Puppy Linux sandbox


Recent Woof-CE based puppies have a new tool which is rather obscure and thus often overlooked.

The tool in question is "sandbox". This is a tool that enables the user to run "puppy within puppy". When you run sandbox, you get a fresh environment that resembles the puppy you're running on, except that anything you do inside sandbox will not change anything outside it (with some exceptions ...). It's ideal for testing some nasty pets that like to change your system files without you knowing it - if a pet breaks your installation, well it only does it within sandbox. Your main system continues oblivious to whatever happens in sandbox. And when you leave sandbox, everything you do inside it, is gone.

If you want to setup an alternate environment (with a different savefile), you can do that too. The standard sandbox will lose its contents when you leave, but rw-sandbox will keep it --- the content is gone when you leave the sandbox, but when you re-enter, it will be restored. Just like a savefile.

How to run it? Sandbox and its brother rw-sandbox only runs from terminal. So launch a terminal, and type "sandbox.sh". Choose the layers you want to use, and you will enter the sandbox. Type "exit" to leave the sandbox. Inside the sandbox, you can also launch GUI programs like geany or seamonkey, if you wish to. Just make sure that you kill all of them before leaving sandbox.

To start rw-sandbox, do the same but instead type "rw-sandbox.sh". You will be asked where to create a new savefile (or load an existing one if it already exists). The rest it the same.

Sandbox was originally a feature of Fatdog64, which was backported to Woof-CE last year by request of forum member "eowens". To see what can and cannot be done with sandbox, please see its original documentation page: http://distro.ibiblio.org/fatdog/web/faqs/sandbox.html. Note: Puppy Linux does not have lxc-sandbox, because right now it does not support lxc. Also, the full-desktop emulation is not working on Puppy yet, because it lacks certain tools needed for that. But everything else will work.

And if your copy of Puppy doesn't come with sandbox, pester your favorite developer to rebuild it from Woof-CE. Building fresh from Woof-CE will include sandbox as well as many other updates, such as zigbert's excellent pthemes.


Posted on 14 Apr 2016, 23:19 by jamesb - Categories: Puppy
1 Comment - Edit - Delete


Pages: ... [4] [5] [6] [7] [8]