Mirrors/stash
1
0
Fork 0
mirror of https://github.com/stashapp/stash.git synced 2025-12-17 20:34:37 +03:00
Code Issues Packages Projects Releases Wiki Activity

Scene ui improvements (#232)

Browse Source 
* Move duration and resolution to overlay

* Improve display of portrait videos

* Condense filter controls

* Add performer images to scene tags

* Add studio overlay to scene cards

* Fade out scene overlays on hover

* CSS grid tweaks

* Align overlay to bottom of video preview

* Fix opacity value

* Fix performer thumbnails

* Show studio overlay on mouseover

* Correct display colour for display mode buttons

* Add scene zoom slider

* Add show studio as text option

* Move select all/none to more button
This commit is contained in:
WithoutPants
2019-12-06 04:24:22 +11:00
committed by Leopere
parent c14153ab5a
commit 12c7faab4e
14 changed files with 391 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
ui/v2/src/components/scenes/SceneList.tsx
View File

@@ -17,6 +17,7 @@ export const SceneList: FunctionComponent<ISceneListProps> = (props: ISceneListP
const listData = ListHook.useList({
filterMode: FilterMode.Scenes,
props,
zoomable: true,
renderContent,
renderSelectedOptions
});
@@ -45,23 +46,24 @@ export const SceneList: FunctionComponent<ISceneListProps> = (props: ISceneListP
);
}
function renderSceneCard(scene : SlimSceneDataFragment, selectedIds: Set<string>) {
function renderSceneCard(scene : SlimSceneDataFragment, selectedIds: Set<string>, zoomIndex: number) {
return (
<SceneCard
key={scene.id}
scene={scene}
zoomIndex={zoomIndex}
selected={selectedIds.has(scene.id)}
onSelectedChanged={(selected: boolean, shiftKey: boolean) => listData.onSelectChange(scene.id, selected, shiftKey)}
/>
)
}
function renderContent(result: QueryHookResult<FindScenesQuery, FindScenesVariables>, filter: ListFilterModel, selectedIds: Set<string>) {
function renderContent(result: QueryHookResult<FindScenesQuery, FindScenesVariables>, filter: ListFilterModel, selectedIds: Set<string>, zoomIndex: number) {
if (!result.data || !result.data.findScenes) { return; }
if (filter.displayMode === DisplayMode.Grid) {
return (
<div className="grid">
{result.data.findScenes.scenes.map((scene) => renderSceneCard(scene, selectedIds))}
{result.data.findScenes.scenes.map((scene) => renderSceneCard(scene, selectedIds, zoomIndex))}
</div>
);
} else if (filter.displayMode === DisplayMode.List) {