Blingbling

From awesome

Blingbling:

Blingbling is a graphical widget library for Awesome Windows Manager. Based on oocairo (http://oocairo.naquadah.org/) it was first an attempt to rewrite the graph and progressbar widgets of Awesome WM. The goal of the Blingbling library is to provide more fancy, customisable and easy to setup graphical widgets, popups or signals for Awesome WM.

Blingbling provides:

Value text box:

This is a text box that can get a value between 0 and 1 and display it as text (like classical textbox widget in awesome). The difference with this widget, is that user can display a colored background with rounded corner (or not) behind the text. Furthermore user can set different colors to display the value (not all the text). ( 30>value< 70 set text color as green, value > 70% set text color as red for example).

Classical graph:

looks like the graph widget of Awesome but with tranparency and text support and more method to customize it.

Tiled graph:

like classical graph but value are displayed with tiles

Progress graph:

looks like the progress bar of Awesome but with tranparency and text support and more method to customize it. Can increase/decrease horizontaly or verticaly.

Progress bar:

like progress graph but graph is displayed on a cylinder.

Volume graph:

widget that display a value using a triangle or for bars with tranparency and text support. Can autoupdate on the master or mpd volume.

Mpd widget:

widget dedicated to mpd. It's read the a fifo generated by mpd and display a graph based on the pcm output. It can displays informations on current song, mpd state and can be bind with mpc command(volume +/-, next song, toggle stop/play).

Net widget:

widget that can display information on the internet connection of a device (upload/download) with arrows and text. Popup with information like ip address, gateway ip address, external ip adress and external tor ip address can be bind to it.

Top popup:

(doesn't need oocairo) popup, displaying colorized top output, that can be bind to any widget. Number of line of top output can be dynamically increase/decrease with mouse wheel up /wheel down

Netstat popup:

(doesn't need oocairo) poup, displaying colorized netstat output, that can be bind to any widget.

System shutdown/Reboot button:

(doesn't need oocairo) button that display a dialog menu for rebooting or shuting down the system. You need to an have active console kit session.

Udisks-glue widget menu:

(doesn't need oocairo) with a custom .udisks-glue.conf and this widget, you can have a menu linked to an icon that display dynamically devices handled by udisks-glue. This menu allows you to mount, unmount, detach or eject devices. Each event generate a popup displaying the type of device, the mount point and the action that have generated the popup (mount, unmount or remove device)

Menu widget:

This widget is based on the original menu widget from awful. With this menu, width of menus or submenus is auto-adjusted. There is no fixed width.

Task warrior widget:

Task warrior widget is an basic interface for task warrior (http://taskwarrior.org/projects/show/taskwarrior). The goal is to provide a quick way to see active projects and tasks and to provide basic management of tasks or project (just set task done for the moment).

Table widget layout:

This layout, when used in a wibox, allow users to display widgets like in a table.

Calendar widget:

It's a wibox that display a calendar of the current month with widgets. By default, you have two buttons for displaying next and previous month. Furthermore, you can see events of a day (from task warrior and remind by default) in a menu when the mouse pass on a day. Users can easily add or remove functions that get events from external applications.

Originally, I have written Blingbling for myself but I share it with the hope that it could interest someone. It meens that for this version, I know it works for me but that all. Testers, feedbacks and suggestions are welcome!

Dependencies

Blingbling require oocairo. The address of the website of the project is : http://oocairo.naquadah.org.

Check you package manager to see if you can install an already packaged version of oocairo for your system.

For example on Archlinux:

 yaourt -S lua-oocairo-git

To install oocairo on Ubuntu

 $ mkdir temp
 $ cd temp
 # apt-get -b source oocairo
 # dpkg -i liblua5.1-oocairo0_1.4-1.2_amd64.deb
 # dpkg -i liblua5.1-oocairo-dev_1.4-1.2_amd64.deb
 $ cd ..
 $ rm -r temp

If you don't find an already packaged version of oocairo, you can install it from the source:

 git clone git://git.naquadah.org/oocairo.git
 cd oocairo*

and see the readme file for installation instructions.

Installation

($XDG_CONFIG_HOME usually ~/.config)

 cd $XDG_CONFIG_HOME/awesome/
 git clone git://github.com/cedlemo/blingbling.git

Usage

(In progress)

You can easily configure the widgets, see the README file for all informations.

examples of value text box widgets:

 --First widget on the left (the configurations for the other widgets are the same)
 my_fs=blingbling.value_text_box.new()
 my_fs:set_height(18)
 my_fs:set_width(40)
 my_fs:set_v_margin(2)
 my_fs:set_filled(true)
 my_fs:set_filled_color("#00000099")
 my_fs:set_values_text_color({{"#88aa00ff",0}, --all value > 0 will be displaying using this color
                              {"#d4aa00ff", 0.75},
                              {"#d45500ff",0.77}})
--There is no maximum number of color that users can set, just put the lower values at first. 
 my_fs:set_default_text_color(beautiful.textbox_widget_as_label_font_color)
 my_fs:set_rounded_size(0.4)
 my_fs:set_background_color("#00000044")
 my_fs:set_label("usage: $percent %")
 vicious.register(my_fs, vicious.widgets.fs, "${/home used_p}", 120)

examples of classical graph, progress graph and netwidget:

 require("blingbling")
 --
 cpulabel= widget({ type = "textbox" })
 cpulabel.text='CPU: '
 --
 mycairograph=blingbling.classical_graph.new()
 mycairograph:set_height(18)
 mycairograph:set_width(360)
 mycairograph:set_tiles_color("#00000022")
 mycairograph:set_show_text(true)
 mycairograph:set_label("Load: $percent %")
 --
 --bind top popup on the graph
 blingbling.popups.htop(mycairograph.widget,
       { title_color =beautiful.notify_font_color_1, 
          user_color= beautiful.notify_font_color_2, 
          root_color=beautiful.notify_font_color_3, 
          terminal = "urxvt"})
vicious.register(mycairograph, vicious.widgets.cpu,'$1',2)
 --
 memwidget=blingbling.classical_graph.new()
 memwidget:set_height(18)
 memwidget:set_width(200)
 memwidget:set_tiles_color("#00000022")
 memwidget:set_show_text(true)
 vicious.register(memwidget, vicious.widgets.mem, '$2', 2)
 --
 mycore1=blingbling.progress_graph.new()
 mycore1:set_height(18)
 mycore1:set_width(6)
 mycore1:set_filled(true)
 mycore1:set_h_margin(1)
 mycore1:set_filled_color("#00000033")
 vicious.register(mycore1, vicious.widgets.cpu, "$2")
 -- 
 mycore2=blingbling.progress_graph.new()
 --
 --
 mycore4=blingbling.progress_graph.new()
 --
 --
 memlabel= widget({ type = "textbox" })
 memlabel.text='MEM: '
 memwidget=blingbling.classical_graph.new()
 memwidget:set_height(18)
 memwidget:set_width(200)
 memwidget:set_tiles_color("#00000022")
 memwidget:set_show_text(true)
 vicious.register(memwidget, vicious.widgets.mem, '$2', 2)
 --
 netwidget = widget({ type = "textbox", name = "netwidget" })
 netwidget.text='NET:'
 --bind nestat popup on textbox 
 blingbling.popups.netstat(netwidget,{ title_color = beautiful.notify_font_color_1, established_color= beautiful.notify_font_color_3, listen_color=beautiful.notify_font_color_2})
--
 my_net=blingbling.net.new()
 my_net:set_height(18)
 --activate popup with ip informations on the net widget
 
 my_net:set_ippopup()
 my_net:set_show_text(true)
 my_net:set_v_margin(3)

 mycairograph=blingbling.classical_graph.new()
 mycairograph:set_height(18)
 mycairograph:set_width(360)
 mycairograph:set_show_text(true)
 mycairograph:set_label("Load: $percent %")
 mycairograph:set_rounded_size(0.4)
 mycairograph:set_filled(true)
 mycairograph:set_filled_color("#00000033")
 vicious.register(mycairograph, vicious.widgets.cpu,'$1',2)
 --bind a top popup on the graph 
 blingbling.popups.htop(mycairograph.widget,
                       { title_color =beautiful.notify_font_color_1, 
                         user_color= beautiful.notify_font_color_2, 
                         root_color=beautiful.notify_font_color_3, 
                         terminal = "urxvt"})
 --
 mycore1=blingbling.progress_graph.new()
 mycore1:set_height(18)
 mycore1:set_width(20)
 mycore1:set_filled(true)
 mycore1:set_h_margin(1)
 mycore1:set_filled_color("#00000033")
 mycore1:set_show_text(true)
 mycore1:set_label("$percent")
 mycore1:set_rounded_size(0.4)
 vicious.register(mycore1, vicious.widgets.cpu, "$2")
 --
 mycore2=blingbling.progress_graph.new()
 --same as mycore1
 mycore3=blingbling.progress_graph.new()
 --same as mycore1
 mycore4=blingbling.progress_graph.new()
 --same as mycore1

examples of tiled graph:

 mycairograph=blingbling.tiled_graph.new()
 mycairograph:set_height(18)
 mycairograph:set_width(360)
 mycairograph:set_tiles_color("#00000022")
 mycairograph:set_show_text(true)
 mycairograph:set_label("Load: $percent %")

examples of progress bar and progress graph:

 my_fs=blingbling.progress_bar.new()
 my_fs:set_height(18)
 my_fs:set_width(40)
 my_fs:set_show_text(true)
 my_fs:set_horizontal(true)  
 --  
 my_fs_root=blingbling.progress_bar.new() 
 my_fs_root:set_height(18)
 my_fs_root:set_width(40)
 my_fs_root:set_v_margin(2)
 my_fs_root:set_show_text(true)
 my_fs_root:set_horizontal(true)
 --
 my_fs_data0=blingbling.progress_graph.new()
 my_fs_data0:set_height(18)
 my_fs_data0:set_width(40)
 my_fs_data0:set_show_text(true)
 my_fs_data0:set_horizontal(true)
 my_fs_data0:set_filled(true)
 --
 my_fs_data1=blingbling.progress_bar.new()
 my_fs_data1:set_height(18)
 my_fs_data1:set_width(40)
 my_fs_data1:set_show_text(true)
 my_fs_data1:set_horizontal(true)
 my_fs_data1:set_filled(true)

 my_fs=blingbling.progress_bar.new()
 my_fs:set_height(18)
 my_fs:set_width(40)
 my_fs:set_show_text(true)
 my_fs:set_horizontal(true)
 --
 my_fs_root=blingbling.progress_bar.new()
 my_fs_root:set_height(18)
 my_fs_root:set_width(40)
 my_fs_root:set_show_text(true)
 my_fs_root:set_horizontal(false)
 --
 my_fs_data0=blingbling.progress_bar.new()
 my_fs_data0:set_height(18)
 my_fs_data0:set_width(40)
 my_fs_data0:set_show_text(true)
 my_fs_data0:set_horizontal(false)
 -- 
 my_fs_data1=blingbling.progress_bar.new()
 my_fs_data1:set_height(18)
 my_fs_data1:set_width(40)
 my_fs_data1:set_show_text(true)
 my_fs_data1:set_horizontal(true)

examples of volume bar and mpd visualizer:

 mpdlabel= widget({ type = "textbox" })
 mpdlabel.text='MPD: '
 --
 my_mpd_volume=blingbling.volume.new()
 my_mpd_volume:set_height(18)
 my_mpd_volume:set_width(30)
 --bind the volume graph on mpd  
 my_mpd_volume:update_mpd()
 --use bar, default is a triangle
 my_mpd_volume:set_bar(true)
 --
 my_mpd=blingbling.mpd_visualizer.new()
 my_mpd:set_height(18)
 my_mpd:set_width(350)
 my_mpd:update()
 --display pcm graph with a line
 my_mpd:set_line(true)
 my_mpd:set_h_margin(4)
 --bind mpc commands on the widget
 my_mpd:set_mpc_commands()
 --Show the artist name and the current song
 my_mpd:set_show_text(true)
 my_mpd:set_label("$artist > $title")
 --
 my_volume=blingbling.volume.new()
 my_volume:set_height(18)
 my_volume:set_width(30)
 --bind the volume widget on the master channel
 my_volume:update_master()
 my_volume:set_master_control()
 my_volume:set_bar(true)

example of reboot button:

 reboot=blingbling.system.rebootmenu(beautiful.reboot, beautiful.dialog_ok,     beautiful.dialog_cancel)

example of udisks-glue menu:

 udisks_glue=blingbling.udisks_glue.new(beautiful.dialog_ok)
 udisks_glue:set_mount_icon(beautiful.dialog_ok)
 udisks_glue:set_umount_icon(beautiful.dialog_cancel)
 udisks_glue:set_detach_icon(beautiful.dialog_cancel)
 udisks_glue:set_Usb_icon(beautiful.usb_icon)
 udisks_glue:set_Cdrom_icon(beautiful.cdrom_icon)

The udisks-glue.conf used:

 filter disks {
            optical = false
            partition_table = false
            usage = filesystem
 }
 filter optical {
           optical = true
 }
 match disks {
          automount = true
          automount_options = sync
          post_mount_command = "echo \'udisks_glue:mount_device(\"%device_file\",\"%mount_point\",\"Usb\")\' | awesome-client"
          post_unmount_command = "echo \'udisks_glue:unmount_device(\"%device_file\",\"%mount_point\",\"Usb\")\' | awesome-client"
          post_removal_command = "echo \'udisks_glue:remove_device(\"%device_file\",\"%mount_point\",\"Usb\")\' | awesome-client"
 }
 match optical {
         automount = true
         automount_options = ro
         post_mount_command = "echo \'udisks_glue:mount_device(\"%device_file\",\"%mount_point\",\"Cdrom\")\' | awesome-client"
         post_unmount_command = "echo \'udisks_glue:unmount_device(\"%device_file\",\"%mount_point\",\"Cdrom\")\' | awesome-client"
         post_removal_command = "echo \'udisks_glue:remove_device(\"%device_file\",\"%mount_point\",\"Cdrom\")\' | awesome-client"
 }

example of task warrior widget (it uses blingbling version of the menu widget):

 task_warrior=blingbling.task_warrior.new(beautiful.tasks_icon)
 task_warrior:set_task_done_icon(beautiful.task_done_icon)
 task_warrior:set_task_icon(beautiful.task_icon)
 task_warrior:set_project_icon(beautiful.project_icon)

example of Table widget layout

This example is the blingbling calendar widget (when not finished). It uses the array layout:

 calendarbox.widgets={
 {displayed_month_and_year, layout = blingbling.layout.array.line_center },
 {day_widgets[1], day_widgets[2], day_widgets[3], day_widgets[4],
 day_widgets[5], day_widgets[6], day_widgets[7], layout =blingbling.layout.array.line_center},
 {days_of_month[1],days_of_month[2], days_of_month[3], days_of_month[4],
 days_of_month[5],days_of_month[6],days_of_month[7],layout =blingbling.layout.array.line_center},
 {days_of_month[8],days_of_month[9], days_of_month[10], days_of_month[11],
 days_of_month[12],days_of_month[13],days_of_month[14],layout =blingbling.layout.array.line_center},
 {days_of_month[15],days_of_month[16], days_of_month[17], days_of_month[18],
 days_of_month[19],days_of_month[20],days_of_month[21],layout =blingbling.layout.array.line_center},
 {days_of_month[22],days_of_month[23], days_of_month[24], days_of_month[25],
 days_of_month[26],days_of_month[27],days_of_month[28],layout =blingbling.layout.array.line_center},
 {days_of_month[29],days_of_month[30], days_of_month[31], days_of_month[32],
 days_of_month[33],days_of_month[34],days_of_month[35],layout =blingbling.layout.array.line_center},
 layout = blingbling.layout.array.stack_lines
 }

example of Calendar widget

 my_cal =blingbling.calendar.new({type = "imagebox", image = beautiful.calendar_icon})
 --you can set blingbling.calendar.new({type = "textbox", text = "calendar"}) if you prefer a textbox
 my_cal:set_cell_padding(4)
 my_cal:set_columns_lines_titles_text_color(beautiful.text_font_color_2)
 my_cal:set_title_text_color(beautiful.bg_focus)
 --with only this you have a calendar  with 2 buttons (next and previous month)

Menu appears when you pass your mouse on a day.Switch between events from remind and task warrior (and all events you had) is done with mouse wheel (up/down).

 my_cal =blingbling.calendar.new({type = "imagebox", image = beautiful.calendar_icon})
 my_cal:set_cell_padding(4)
 my_cal:set_columns_lines_titles_text_color(beautiful.text_font_color_2)
 my_cal:set_title_text_color(beautiful.bg_focus)
 my_cal:set_link_to_external_calendar(true)
 --This last line activate the functions that get events for a day from remind or task warrior (you can remove them and add your own)