Columns UI: How do you add Total File Size of All Selected to Status Bar/Pane?

Topic: Columns UI: How do you add Total File Size of All Selected to Status Bar/Pane? (Read 2217 times) previous topic - next topic

0 Members and 1 Guest are viewing this topic.

Columns UI: How do you add Total File Size of All Selected to Status Bar/Pane?

2025-02-26 17:58:25

Basically, when I select several files in a playlist, I want to see the Total File Size in the Status Bar or Status Pane. If nothing is selected, I would like to see the Total File Size for everything in the playlist.

Thanks for any help!

Re: Columns UI: How do you add Total File Size of All Selected to Status Bar/Pane?

Reply #1 – 2025-02-28 05:41:57

It looks like total %filesize% is not available on Status Bar / Pane, though just to note you can add it to CUI Playlist Switcher to at least get playlist total.

I wanted similar feature so ended up making my own mod of the JScript Panel 3 status bar sample script. Fortunately in CUI you can turn off the default Status Bar / Pane and add a script version instead at the bottom of the layout.

This one displays selection totals on the left and playlist totals on the right, when paused or stopped, in addition to configurable (right-click) title format on the left and right when playing. Also when playing, it shows the totals for 3 seconds when the current selection or playlist changes, so you can select some tracks and see the totals quickly without interrupting music. Mouse wheel over it changes the volume and middle-click mutes it. And I wanted all this on one line to keep it minimal space (the screenshot is combined with Waveform Seekbar and buttons, etc)

Now, possibly something will not work properly since I have no idea what I'm doing when it comes to JS

- but hey anyone is welcome to fix it up...

Code: [Select]

// ==PREPROCESSOR==
// @name "Status Bar / Mod"
// @author "marc2003 / ghstchldrn"
// @import "%fb2k_component_path%helpers.txt"
// @import "%fb2k_component_path%samples\js\lodash.min.js"
// @import "%fb2k_component_path%samples\js\common.js"
// @import "%fb2k_component_path%samples\js\volume.js"
// ==/PREPROCESSOR==

// "Status Bar Mod"

var properties = {
	tf_left : new _p('Title Format Left', "Playing $replace(%codec%,Musepack,MPC,Vorbis,OGG,Monkey$char(39)s Audio,APE,aac,AAC,opus,OPUS,Opus,OPUS)[  ·  %bitrate% kbps][  ·  %__bitspersample%-bit][  ·  %samplerate% Hz][  ·  $caps(%channels%)][  ·  %length%][   –   Playing $if2($info(video_codec),$if($or(%fy_title%,$strstr($info(@),fy+)),$replace($trim($substr(%video_file_stats%,$strchr(%video_file_stats%,|),$if2($strstr(%video_file_stats%, | aac),99))),| ,, |,, ,  $char(183)  ,vp,VP,h,H.,av,AV,fps, fps,kbps, kbps)))]"),
	tf_right : new _p('Title Format Right', "$puts(path,$if2($info(@),%path%))$puts(s,$if($strstr($get(path),fy+),12,$if($strstr($get(path),https),9,$if($strcmp($left($get(path),3),www),0,8))))$puts(domain,$left($substr($get(path),$get(s),999),$sub($strchr($substr($get(path),$get(s),999),/),1)))$if($or($strstr($get(path),http),$strstr($get(path),www)),From $char(91)$get(domain)$char(93),From $left(%path%,3))[$if(%__hdcd%,  ·  HDCD %__hdcd_gain% '('Peak: $caps(%__hdcd_peak_extend%)')',)][  ·  Album %replaygain_album_gain%][  ·  Track %replaygain_track_gain%]"),
	sl_count : new _p('Show Selection Count', true),
	sl_duration : new _p('Show Selection Duration', true),
	sl_size : new _p('Show Selection Size', true),
	pl_name : new _p('Show Playlist Name', true),
	pl_count : new _p('Show Playlist Count', true),
	pl_duration : new _p('Show Playlist Duration', true),
	pl_size : new _p('Show Playlist Size', true),
	background : new _p('Custom Colour Background', RGB(51, 51, 51)),
	text : new _p('Custom Colour Text', RGB(240, 240, 240))
};

var left_text_playing = fb.TitleFormat(properties.tf_left.value);
var left_text_sl_info = '';
var left_text = '';
var left_text_status = '';
var right_text_playing = fb.TitleFormat(properties.tf_right.value);
var right_text_pl_info = '';
var right_text = '';
var right_text_width = 0;

var ww = 0;
var wh = 0;
var starting = false;
var show_info = false;
var stop_reason;
var timer;
var font = CreateFontString('Segoe UI Symbol', 9);

get_selection();
get_playlist();
refresh();

function get_selection() {
	var tmp = [];
	var sl_items = fb.GetSelection(0);
	var sl_count = sl_items.Count;
	if (properties.sl_count.enabled) {
		tmp.push(sl_count == 0 ? 'None' : sl_count + (sl_count == 1 ? ' Track' : ' Tracks'));
	}
	if (properties.sl_duration.enabled && sl_count > 0) {
		tmp.push(utils.FormatDuration(sl_items.CalcTotalDuration()));
	}
	if (properties.sl_size.enabled && sl_count > 0) {
		tmp.push(utils.FormatFileSize(sl_items.CalcTotalSize()));
	}
	sl_items.Dispose();
	left_text_sl_info = (properties.sl_count.enabled || properties.sl_duration.enabled || properties.sl_size.enabled ? 'Selection:  ' : '') + tmp.join('  ·  ');
//	window.Repaint();
}

function get_playlist() {
	var tmp = [];
	var ap = plman.ActivePlaylist;
	if (ap >= 0 && ap < plman.PlaylistCount) {
		var pl_items = plman.GetPlaylistItems(ap);
		var pl_count = pl_items.Count;
		if (properties.pl_count.enabled) {
			tmp.push(pl_count + (pl_count == 1 ? ' Track' : ' Tracks'));
		}
		if (properties.pl_duration.enabled) {
			tmp.push(utils.FormatDuration(pl_items.CalcTotalDuration()));
		}
		if (properties.pl_size.enabled) {
			tmp.push(utils.FormatFileSize(pl_items.CalcTotalSize()));
		}
		if (properties.pl_name.enabled) {
			var str = plman.IsPlaylistLocked(ap) ? '🔒 ' : '';
			str += plman.GetPlaylistName(ap);
			tmp.push(str);
		}
		pl_items.Dispose();
	}
	right_text_pl_info = (properties.pl_count.enabled || properties.pl_duration.enabled || properties.pl_size.enabled || properties.pl_name.enabled ? 'Playlist:  ' : '') + tmp.join('  ·  ');
	right_text_width = right_text.calc_width2(font);
//	window.Repaint();
}

function refresh() {
	left_text_status = (fb.IsPlaying ? (fb.IsPaused ? 'Paused...' : 'Playing...') : 'Stopped.') + '                 ';

	if (starting) {
		left_text = 'Starting playback...';
	} else if (fb.IsPaused) {
		left_text = left_text_status + left_text_sl_info;
		right_text = right_text_pl_info;
	} else if (fb.IsPlaying) {
		left_text = left_text_playing.Eval();
		right_text = right_text_playing.Eval();
	} else {
		left_text = left_text_status + left_text_sl_info;
		right_text = right_text_pl_info;
	}
	window.Repaint();
}

function on_mouse_lbtn_dblclk() {
	fb.RunMainMenuCommand('View/Show now playing in playlist');
}

function on_mouse_rbtn_up(x, y) {
	var menu = window.CreatePopupMenu();
	var colour_menu = window.CreatePopupMenu();
	var tf_menu = window.CreatePopupMenu();
	var context_popup = window.CreatePopupMenu();
	var context = fb.CreateContextMenuManager();

	if (fb.IsPlaying) {
		context.InitNowPlaying();
		context.BuildMenu(context_popup, 1000);
		context_popup.AppendTo(menu, MF_STRING, 'Now playing');
		menu.AppendMenuSeparator();
	}
	colour_menu.AppendMenuItem(MF_STRING, 1, 'Background...');
	colour_menu.AppendMenuItem(MF_STRING, 2, 'Text...');
	colour_menu.AppendTo(menu, MF_STRING, 'Colours');
	menu.AppendMenuSeparator();
	tf_menu.AppendMenuItem(MF_STRING, 3, 'Left text...');
	tf_menu.AppendMenuItem(MF_STRING, 4, 'Right text...');
	tf_menu.AppendTo(menu, MF_STRING, 'Title format');
	menu.AppendMenuSeparator();
	menu.AppendMenuItem(CheckMenuIf(properties.sl_count.enabled), 10, 'Show selection count');
	menu.AppendMenuItem(CheckMenuIf(properties.sl_duration.enabled), 11, 'Show selection duration');
	menu.AppendMenuItem(CheckMenuIf(properties.sl_size.enabled), 12, 'Show selection size');
	menu.AppendMenuSeparator();
	menu.AppendMenuItem(CheckMenuIf(properties.pl_name.enabled), 20, 'Show playlist name');
	menu.AppendMenuItem(CheckMenuIf(properties.pl_count.enabled), 21, 'Show playlist count');
	menu.AppendMenuItem(CheckMenuIf(properties.pl_duration.enabled), 22, 'Show playlist duration');
	menu.AppendMenuItem(CheckMenuIf(properties.pl_size.enabled), 23, 'Show playlist size');
	menu.AppendMenuSeparator();
	menu.AppendMenuItem(MF_STRING, 30, 'Configure...');

	var idx = menu.TrackPopupMenu(x, y);
	menu.Dispose();

	switch (idx) {
	case 0:
		break;
	case 1:
		properties.background.value = utils.ColourPicker(properties.background.value);
		window.Repaint();
		break;
	case 2:
		properties.text.value = utils.ColourPicker(properties.text.value);
		window.Repaint();
		break;
	case 3:
		try {
			var tmp = utils.TextBox('Enter title format pattern. $rgb is supported.', window.Name, properties.tf_left.value).trim();
			if (tmp.length && tmp != properties.tf_left.value) {
				properties.tf_left.value = tmp;
				left_text_playing.Dispose();
				left_text_playing = fb.TitleFormat(properties.tf_left.value);
				window.Repaint();
			}
		} catch (e) {}
		break;
	case 4:
		try {
			var tmp = utils.TextBox('Enter title format pattern. $rgb is supported.', window.Name, properties.tf_right.value).trim();
			if (tmp.length && tmp != properties.tf_right.value) {
				properties.tf_right.value = tmp;
				right_text_playing.Dispose();
				right_text_playing = fb.TitleFormat(properties.tf_right.value);
				window.Repaint();
			}
		} catch (e) {}
		break;
	case 10:
		properties.sl_count.toggle();
		get_selection();
		refresh();
		break;
	case 11:
		properties.sl_duration.toggle();
		get_selection();
		refresh();
		break;
	case 12:
		properties.sl_size.toggle();
		get_selection();
		refresh();
		break;
	case 20:
		properties.pl_name.toggle();
		get_playlist();
		refresh();
		break;
	case 21:
		properties.pl_count.toggle();
		get_playlist();
		refresh();
		break;
	case 22:
		properties.pl_duration.toggle();
		get_playlist();
		refresh();
		break;
	case 23:
		properties.pl_size.toggle();
		get_playlist();
		refresh();
		break;
	case 30:
		window.ShowConfigure();
		break;
	default:
		context.ExecuteByID(idx - 1000);
		break;
	}

	context.Dispose();
	return true;
}

function on_mouse_wheel(s) {
	if (s < 0)	fb.VolumeDown();
	else fb.VolumeUp();
}

function on_mouse_mbtn_up() {
	fb.VolumeMute();
}

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

function on_paint(gr) {
	gr.Clear(properties.background.value);

	if (left_text.length) {
		gr.WriteText(left_text, font, properties.text.value, 5, 0, ww - 450 - right_text_width, 21, DWRITE_TEXT_ALIGNMENT_LEADING, DWRITE_PARAGRAPH_ALIGNMENT_NEAR, DWRITE_WORD_WRAPPING_NO_WRAP, DWRITE_TRIMMING_GRANULARITY_CHARACTER);
	}

	if (right_text.length) {
		gr.WriteText(right_text, font, properties.text.value, 0, 0, ww - 130, 21, DWRITE_TEXT_ALIGNMENT_TRAILING);
	}

	if (fb.CustomVolume == -1) {
		gr.WriteText(fb.Volume.toFixed(2) < -60.00 ? 'Muted' : fb.Volume.toFixed(2) + ' dB', font, properties.text.value, 0, 0, ww - 5, 21, DWRITE_TEXT_ALIGNMENT_TRAILING);
	} else {
		gr.WriteText('Volume: ' + fb.CustomVolume, font, properties.text.value, 0, 0, ww - 5, 21, DWRITE_TEXT_ALIGNMENT_TRAILING);
	}
}

function on_playback_starting() {
	if (stop_reason == 2)
		return;

	starting = true;
	refresh();

	window.SetTimeout(function () {
		starting = false;
		refresh();
	}, 1000);
}

function on_playback_new_track() {
	refresh();
}

function on_playback_stop(reason) {
	stop_reason = reason;
	refresh();
}

function on_playback_pause() {
	refresh();
}

function on_playback_time() {
	if (show_info == false) {
		refresh();
	}
}

function on_playlist_items_added(p) {
	if (p == plman.ActivePlaylist) {
		get_playlist();
		refresh();
	}
}

function on_playlist_items_removed(p) {
	if (p == plman.ActivePlaylist) {
		get_playlist();
		refresh();
	}
}

function on_playlists_changed() {
	if (properties.pl_name.enabled) {
		get_playlist();
		refresh();
	}
}

function on_playlist_switch() {
	if (properties.pl_count.enabled || properties.pl_duration.enabled || properties.pl_size.enabled || properties.pl_name.enabled) {
		get_playlist();
		
		show_info = true;
		right_text = right_text_pl_info;
		window.Repaint();

		window.clearTimeout(timer);
		timer = window.SetTimeout(function () {
			show_info = false;
			refresh();
		}, 3000);
	}
}

function on_selection_changed() {
	if ((!fb.IsPlaying || fb.PlaybackTime > 1) && (properties.sl_count.enabled || properties.sl_duration.enabled || properties.sl_size.enabled)) {
		get_selection();
	
		show_info = true;
		left_text = left_text_status + left_text_sl_info;
		window.Repaint();

		window.clearTimeout(timer);
		timer = window.SetTimeout(function () {
			show_info = false;
			refresh();
		}, 3000);
	}
}

function on_size() {
	ww = window.Width;
	wh = window.Height;
	window.MinHeight = window.MaxHeight = 25;
}

Re: Columns UI: How do you add Total File Size of All Selected to Status Bar/Pane?

Reply #2 – 2025-03-08 13:35:54

@anamorphic
Thanks for the detailed reply, I'm going to give it a shot!

Re: Columns UI: How do you add Total File Size of All Selected to Status Bar/Pane?

Reply #3 – 2025-03-08 14:05:28

Quote

Now, possibly something will not work properly since I have no idea what I'm doing when it comes to JS - but hey anyone is welcome to fix it up...

I'm slowly replacing a lot of panels with JS, so I may create a status bar script with configurable background, alignment, input popups for tf, etc. Open for suggestions about the design, since I don't have a definitive idea.

Right now I'm thinking about adding 3 customizable columns which could host any amount of "cells" (in the same row):
- Left
- Center
- Right

Then via menus it would be possible to add multiple TF "cells" into each column. Also special fields like volume, total length of selected tracks, number of selected tracks, etc.

So to add volume and # of tracks, you would just add 2 "cells" to right column. Custom TF to the left. As result it would mimic what CUI does, but would also allow to change the position of any element.

I would use SMP/JSplitter though.

Re: Columns UI: How do you add Total File Size of All Selected to Status Bar/Pane?

Reply #4 – 2025-03-17 18:18:36

So revisiting this, I have not created a status bar package but reused my current toolbar framework. (not saying the first will not happen at some point)

So right now, using the toolbar scripts:
- Can set any number of columns just by placing "buttons".
- Can set the background and text colors as desired.
- There are settings for text size, style (bold, regular, ...), alignment and truncation.
- Display areas can be moved, the same than "buttons".
- Display areas can be resized to specific width or % of total panel width (so it scales at any foobar window size).
- Can evaluate TF with now playing or selection.
- Has multiple special variables re-using my dynamic queries framework. An example can be seen here: https://hydrogenaud.io/index.php/topic,120978.msg1060729.html#msg1060729

List of special variables:
Spoiler (click to show/hide)

Note this has some improvements over DUI/CUI toolbar, like free positioning of every element and also the ability to retrieve playlist name, size, etc. and other system settings (I may expand the list). Additionally, other buttons may be added to it (workin as a status bar but also as a toolbar).

This is how it looks. It's a pretty simple setup, with only one addition to the native bar (the playlist size).

Spoiler (click to show/hide)

And showing how new columns ("buttons") are added or moved:

Spoiler (click to show/hide)

The thing is pretty much wip, but can be found at the playlist-tools-smp repo (nightly).

Notice