-
Notifications
You must be signed in to change notification settings - Fork 4
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Break up ResultRow #8 - Split ShowResultRow
To avoid circular dependencies between Show and Season result rows, split ShowResultRow into three classes: * ShowResultRowBase - Common show result row functionality * ShowResultRow - A "real" row that will load seasons when clicked. * ShowTitleResultRow - A placeholder row displayed when a show/season is already active. Splitting the class up this way allows SeasonResultRow to only need to know about ShowTitleResultRow, not the "real" ShowResultRow.
- Loading branch information
Showing
4 changed files
with
137 additions
and
61 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,66 @@ | ||
import { $$, buildNode, plural } from './Common.js'; | ||
import { ContextualLog } from '../../Shared/ConsoleLog.js'; | ||
import { PurgedMarkers } from './PurgedMarkerManager.js'; | ||
import { ResultRow } from './ResultRow.js'; | ||
|
||
const Log = new ContextualLog('ShowRowBase'); | ||
|
||
/** | ||
* Base class for a show result row, either a "real" one or a title placeholder. | ||
*/ | ||
export default class ShowResultRowBase extends ResultRow { | ||
|
||
/** @param {ShowData} show */ | ||
constructor(show) { | ||
super(show, 'topLevelResult showResult'); | ||
} | ||
|
||
/** Whether this row is a placeholder title row, used when a specific show/season is selected. */ | ||
titleRow() { return false; } | ||
|
||
/** | ||
* Return the underlying show data associated with this result row. | ||
* @returns {ShowData} */ | ||
show() { return this.mediaItem(); } | ||
|
||
/** | ||
* Callback to invoke when the row is clicked. | ||
* @returns {(e: MouseEvent) => any|null} */ | ||
onClick() { return null; } | ||
|
||
/** | ||
* Creates a DOM element for this show. | ||
* Each entry contains three columns - the show name, the number of seasons, and the number of episodes. */ | ||
buildRow() { | ||
if (this.html()) { | ||
Log.warn('buildRow has already been called for this ShowResultRow, that shouldn\'t happen'); | ||
return this.html(); | ||
} | ||
|
||
const show = this.show(); | ||
const titleNode = buildNode('div', {}, show.title); | ||
if (show.originalTitle) { | ||
titleNode.appendChild(buildNode('span', { class : 'resultRowAltTitle' }, ` (${show.originalTitle})`)); | ||
} | ||
|
||
const customColumn = buildNode('div', { class : 'showResultSeasons' }, plural(show.seasonCount, 'Season')); | ||
const row = this.buildRowColumns(titleNode, customColumn, this.onClick()); | ||
|
||
this.setHtml(row); | ||
return row; | ||
} | ||
|
||
/** | ||
* Returns the callback invoked when clicking on the marker count when purged markers are present. */ | ||
getPurgeEventListener() { | ||
return this.#onShowPurgeClick.bind(this); | ||
} | ||
|
||
/** | ||
* Launches the purge overlay for this show. */ | ||
#onShowPurgeClick() { | ||
// For dummy rows, set focus back to the first tabbable row, as the purged icon might not exist anymore | ||
const focusBack = this.titleRow() ? $$('.tabbableRow', this.html().parentElement) : this.html(); | ||
PurgedMarkers.showSingleShow(this.show().metadataId, focusBack); | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,51 @@ | ||
import { UISection, UISections } from './ResultSections.js'; | ||
import { PlexClientState } from './PlexClientState.js'; | ||
import ShowResultRowBase from './ShowResultRowBase.js'; | ||
|
||
/** @typedef {!import('../../Shared/PlexTypes').ShowData} ShowData */ | ||
|
||
/** | ||
* A show result row that's used as a placeholder when a specific show/season is active. | ||
*/ | ||
export default class ShowTitleResultRow extends ShowResultRowBase { | ||
/** | ||
* @param {ShowData} show */ | ||
constructor(show) { | ||
super(show, 'topLevelResult showResult'); | ||
} | ||
|
||
titleRow() { return true; } | ||
|
||
/** | ||
* Build this placeholder row. Takes the base row and adds a 'back' button. */ | ||
buildRow() { | ||
if (this.html()) { | ||
// Extra data has already been added, and super.buildRow accounts for this, and gives us some warning logging. | ||
return super.buildRow(); | ||
} | ||
|
||
const row = super.buildRow(); | ||
this.addBackButton(row, 'Back to results', async () => { | ||
UISections.clearSections(UISection.Seasons | UISection.Episodes); | ||
await UISections.hideSections(UISection.Seasons | UISection.Episodes); | ||
UISections.showSections(UISection.MoviesOrShows); | ||
}); | ||
|
||
row.classList.add('dynamicText'); | ||
return row; | ||
} | ||
|
||
/** | ||
* Updates various UI states after purged markers are restored/ignored. | ||
* @param {PurgedShow} _unpurged */ | ||
notifyPurgeChange(_unpurged) { | ||
/*async*/ PlexClientState.updateNonActiveBreakdown(this, []); | ||
} | ||
|
||
/** | ||
* Update marker breakdown data after a bulk update. | ||
* @param {{[seasonId: number]: MarkerData[]}} _changedMarkers */ | ||
notifyBulkAction(_changedMarkers) { | ||
return PlexClientState.updateNonActiveBreakdown(this, []); | ||
} | ||
} |