Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

More torrent columns + other stuff #145

Merged
merged 6 commits into from
Nov 13, 2021
Merged
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
fully resizable columns
bill-ahmed committed Nov 13, 2021
commit 8b3953ac7076731e6787d99f611118ad3b510602
12 changes: 12 additions & 0 deletions src/app/services/app/application-config.service.ts
Original file line number Diff line number Diff line change
@@ -77,6 +77,18 @@ export class ApplicationConfigService {
this._persistWebUIOptions(updateNow);
}

/**
* Update column width with change in width provided.
*
* E.g. if previous width was 10, and delta = -5, then new width is 5.
* */
setColumnWidth(col: TORRENT_TABLE_COLUMNS, delta: number) {
let colWidths = this.user_preferences.web_ui_options.torrent_table.column_widths
colWidths[col] = colWidths[col] + delta;

this._persistWebUIOptions();
}

async getQbittorrentBuildInfo(): Promise<QbittorrentBuildInfo> {
if(!this.qBitBuildInfo) { this.qBitBuildInfo = await this.data_store.GetApplicationBuildInfo(); }

3 changes: 2 additions & 1 deletion src/app/services/app/defaults.ts
Original file line number Diff line number Diff line change
@@ -2,6 +2,7 @@ import { Constants } from 'src/constants';
import { WebUISettings } from 'src/utils/Interfaces';

const all_columns = Constants.TORRENT_TABLE_COLUMNS
const col_widths = Constants.TORRENT_TABLE_COLUMNS_WIDTHS

/** A class to represent various default configurations for the application. */
export class ApplicationDefaults {
@@ -18,7 +19,7 @@ export class ApplicationDefaults {
order: 'desc'
},
columns_to_show: ['select', 'Actions', 'Name', 'Size', 'Progress', 'Status', 'Down Speed', 'Up Speed', 'ETA', 'Completed On'],
column_widths: all_columns.reduce((prev, col) => { prev[col] = 0; return prev; }, {}) as any
column_widths: all_columns.reduce((prev, col) => { prev[col] = col_widths[col]; return prev; }, {})
},
upload_torrents: {
show_parsed_torrents_from_file: true,
7 changes: 5 additions & 2 deletions src/app/torrents-table/torrents-table.component.html
Original file line number Diff line number Diff line change
@@ -43,7 +43,10 @@
[class]="getClassNameForColumns(col)"

pReorderableColumn
pResizableColumn

pResizableColumn
[pResizableColumnDisabled]="['select', 'Actions'].includes(col)"

[pSortableColumn]="displayedColumnsMapping[col]"
>

@@ -66,7 +69,7 @@

<ng-template pTemplate="colgroup">
<colgroup>
<col *ngFor="let col of displayedColumns" [ngStyle]="{ 'width': col.width || 'initial' }">
<col *ngFor="let col of displayedColumns" [ngStyle]="{ 'width': colWidths[col] + 'px' || 'initial' }">
</colgroup>
</ng-template>

36 changes: 17 additions & 19 deletions src/app/torrents-table/torrents-table.component.scss
Original file line number Diff line number Diff line change
@@ -111,34 +111,32 @@ mat-spinner {
word-wrap: break-word;
word-break: break-word;

width: 450px;
// width: 450px;
}

/** MUST HAVE SIZES FOR EACH COLUMN!! */

&.table-col-select { width: 50px; }
&.table-col-Actions { width: 140px; }
&.table-col-Size { width: 85px; }
&.table-col-Progress { width: 175px; }
&.table-col-Status { width: 140px; }
// &.table-col-Actions { width: 140px; }
// &.table-col-Size { width: 85px; }
// &.table-col-Progress { width: 175px; }
// &.table-col-Status { width: 140px; }

&.table-col-Up-Speed { width: 100px; }
&.table-col-Down-Speed { width: 120px; }
// &.table-col-Up-Speed { width: 100px; }
// &.table-col-Down-Speed { width: 120px; }

&.table-col-ETA { width: 115px; }
&.table-col-Ratio { width: 75px; }
// &.table-col-ETA { width: 115px; }
// &.table-col-Ratio { width: 75px; }

&.table-col-Downloaded { width: 100px; }
&.table-col-Uploaded { width: 100px; }
// &.table-col-Downloaded { width: 100px; }
// &.table-col-Uploaded { width: 100px; }

&.table-col-Added-On { width: 170px; }
&.table-col-Completed-On { width: 170px; }
&.table-col-Last-Activity { width: 170px; }
// &.table-col-Added-On { width: 170px; }
// &.table-col-Completed-On { width: 170px; }
// &.table-col-Last-Activity { width: 170px; }

&.table-col-Category { width: 120px; }
// &.table-col-Category { width: 120px; }

&.table-col-Seeders { width: 85px; }
&.table-col-Leechers { width: 85px; }
// &.table-col-Seeders { width: 85px; }
// &.table-col-Leechers { width: 85px; }
}

i.pi {
13 changes: 10 additions & 3 deletions src/app/torrents-table/torrents-table.component.ts
Original file line number Diff line number Diff line change
@@ -23,6 +23,7 @@ import { TorrentHelperService } from '../services/torrent-management/torrent-hel
import { SnackbarService } from '../services/notifications/snackbar.service';
import { MenuItem } from 'primeng/api';
import { getClassForStatus } from '../../utils/Helpers'
import { Constants } from 'src/constants';


@Component({
@@ -47,6 +48,8 @@ export class TorrentsTableComponent implements OnInit {
// A reverse mapping from column name to torrent property
public displayedColumnsMapping = ApplicationConfigService.TORRENT_TABLE_COLUMNS_MAPPING

public colWidths = Constants.TORRENT_TABLE_COLUMNS_WIDTHS as any;

// Context menu items
public contextMenuItems: MenuItem[];
public contextMenuSelectedTorrent: Torrent;
@@ -260,8 +263,8 @@ export class TorrentsTableComponent implements OnInit {

/** Callback for when table changes col width */
handleColumnResize(event: any) {
console.log('resized', event);
console.log(`element ${event.element.id} resized by ${event.delta}`)
let colName = event.element.id.replace(/-/g, ' ');
this.appConfig.setColumnWidth(colName, event.delta);
}

/** Determine whether a torrent is selected or not */
@@ -369,12 +372,16 @@ export class TorrentsTableComponent implements OnInit {
// Column order
this.displayedColumns = pref.web_ui_options?.torrent_table?.columns_to_show;

// Want to override defaults
let oldColWidths = this.colWidths;
let newColWidths = pref.web_ui_options?.torrent_table?.column_widths
this.colWidths = { ...oldColWidths, ...newColWidths };

// Re-sort data
this.handleSortChange(this.currentMatSort);
}

colNameForMapping(col) {
console.log('col mapping for', col)
return this.displayedColumnsMapping[col].name
}

33 changes: 33 additions & 0 deletions src/constants.ts
Original file line number Diff line number Diff line change
@@ -7,6 +7,9 @@ export class Constants {
'Category', 'Seeders', 'Leechers', 'Downloaded'
];

/**
* Map column name its property in the Torrent object
*/
static TORRENT_TABLE_COLUMNS_MAPPING = {
'Name': 'name',
'Size': 'size',
@@ -28,4 +31,34 @@ export class Constants {
'Seeders': 'num_seeds',
'Leechers': 'num_leechs',
}

/**
* Map column name to width in pixels;
*/
static TORRENT_TABLE_COLUMNS_WIDTHS = {
'Actions': 140,
'Name': 450,

'Size': 85,
'Progress': 175,
'Status': 140,

'Up Speed': 100,
'Down Speed': 120,

'ETA': 115,
'Ratio': 75,

'Downloaded': 100,
'Uploaded': 100,

'Added On': 170,
'Completed On': 170,
'Last Activity': 170,

'Category': 120,

'Seeders': 85,
'Leechers': 85
}
}
2 changes: 1 addition & 1 deletion src/utils/Interfaces.ts
Original file line number Diff line number Diff line change
@@ -274,7 +274,7 @@ export interface WebUITorrentTableSettings {
order: 'asc' | 'desc'
},
columns_to_show: string[],
column_widths: { [x: string]: number }[],
column_widths: { [x: string]: number },
}

export interface WebUINotificationSettings {