mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

Add onClick for an expandable Overview of item details

Browse source 
Adds a onClick action that toggles expanding the item detail
Overview. By default it crops the text to 12 lines on mobile, 6
on larger viewports.

-webkit-line-clamp is supported on all Webkit browsers and Firefox
as of 3/2020. A fallback with max-height is provided as well.

Fixes #888
This commit is contained in:
Andres Ruiz 2020-03-08 15:50:54 -04:00 • committed by Andres J Ruiz Torres
parent b8ee2f86b0
commit 1ddfd2c7bb
2 changed files with 34 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

15
src/controllers/itemDetails.js
View file

@ -972,6 +972,17 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
}
}
function toggleLineClamp(e) {
var target = e.target;
var clampClassName = 'detail-clamp-text';
if (target.classList.contains(clampClassName)) {
target.classList.remove(clampClassName);
} else {
target.classList.add(clampClassName);
}
}
function renderOverview(elems, item) {
for (var i = 0, length = elems.length; i < length; i++) {
var elem = elems[i];
@ -980,6 +991,10 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
if (overview) {
elem.innerHTML = overview;
elem.classList.remove('hide');
elem.classList.add('detail-clamp-text');
elem.addEventListener('click', toggleLineClamp);
var anchors = elem.querySelectorAll('a');
for (var j = 0, length2 = anchors.length; j < length2; j++) {