A couple of window list hacks

[angela2016]

I've been playing around with themes last weekend and found a few useful hacks in the windowlist app I'd like to share. Feel free to add your own hacks. These things are not always obvious to the uninitiated such as me.

First, copy the applet folder
/usr/share/cinnamon/applets/window-list@cinnamon.org/
to
/home/<your username>/.local/share/cinnamon/applets/
and change the new folder name and data in metadata.json. That way, you don't have to change the original code.

Hack 1) Change icon size on buttons:
Just change the number in this line. This almost drove me mad when I tried to change it in cinnamon.css and it was so easy to change in the applet.

Code: Select all

const DEFAULT_ICON_SIZE = 16;

2) Customize titles for certain programs, for example to avoid path names or website titles showing in panel. Change below title = title.replace(/\s/g, " ");

Code: Select all

let appname = app.get_name();
/*change title name if app name contains a string*/
        if (appname.indexOf("string to look up") !=-1)
            title = "My title";

or

Code: Select all

/*change title name based on default title name*/
        if (title.indexOf("string to look up") !=-1)
           title = "My title 2";

3) Add custom pseudo classes (I added it in the same place as no. 2)

Code: Select all

/*if title contains x, use stylex*/
if (title.indexOf("string to look up") !=-1)
           this.actor.add_style_pseudo_class('stylex');

Then you can define the style within themes in cinnamon.css. For example a special button background:

Code: Select all

.window-list-item-box:stylex {     
         border-image:url("BackgroundY.png");
}

You can combine pseudo classes like this:

Code: Select all

.window-list-item-box:stylex:focus  {  
}

4) Change the default icons for certain app names/titles: exchange the entire function "seticon" and manipulate as you like. And yes, apparently you have to repeat the last lines for each block. I don't know why. I don't know why.

Code: Select all

    setIcon: function() {
        let tracker = Cinnamon.WindowTracker.get_default();
        let app = tracker.get_window_app(this.metaWindow);
        let appname = app.get_name(); /*ADDED*/
        let title = this.metaWindow.get_title(); /*ADDED*/
        
        if (this._applet._scaleMode)
            this.iconSize = Math.round(this._applet._panelHeight * ICON_HEIGHT_FACTOR / global.ui_scale);
        else
            this.iconSize = DEFAULT_ICON_SIZE;

        /*Manipulate default icons */
        if (title.indexOf("something") !=-1) {
            let giconx = Gio.icon_new_for_string('<fullpath>');
            let icon = new St.Icon({ gicon: giconx, icon_size: this.iconSize });
            let old_child = this._iconBox.get_child();
            this._iconBox.set_child(icon);
            if (old_child)
                old_child.destroy();          
        
         } else if (title.indexOf("something else") !=-1) {
            let giconx = Gio.icon_new_for_string('<fullpath>');
            let icon = new St.Icon({ gicon: giconx, icon_size: this.iconSize });
            let old_child = this._iconBox.get_child();
            this._iconBox.set_child(icon);
            if (old_child)
                old_child.destroy();          

        } else {          
             /*default to original code*/
            let icon = app ?
            app.create_icon_texture(this.iconSize) :
            new St.Icon({ icon_name: 'application-default-icon',
                icon_type: St.IconType.FULLCOLOR,
                icon_size: this.iconSize });         
            let old_child = this._iconBox.get_child();
            this._iconBox.set_child(icon);
            if (old_child)
                old_child.destroy();          
        }
    },

Remove the normal window-list from the panel and add your own instead. Note that as far as I can see this really only effects the panel and not the window list itself or the tab preview, etc.

Finally, here's a little before and after.