fraport/fradrive
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(course-teaser): display sorting "pills" for course teasers

Browse Source
This commit is contained in:
Sarah Vaupel 2019-08-02 13:36:49 +02:00
parent c99a3c7009
commit d964e1f705
5 changed files with 119 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
src/Handler/Utils/Table/Pagination.hs
View File

@ -1033,38 +1033,37 @@ dbTable PSValidator{..} dbtable@DBTable{ dbtIdent = dbtIdent'@(toPathPiece -> db
table' = let
columnCount :: Int64
columnCount = olength64 $ getColonnade dbtColonnade
in case dbsTemplate of
DBSTCourse c l r s -> do
wRows <- forM rows $ \row' -> let
Course{..} = row' ^. c . _entityVal
lecturerUsers = row' ^. l
courseLecturers = userSurname . entityVal <$> lecturerUsers
isRegistered = row' ^. r
courseSchoolName = schoolName $ row' ^. s . _entityVal
courseSemester = (termToText . unTermKey) courseTerm
in return $(widgetFile "table/course/course-teaser")
return $(widgetFile "table/course/colonnade")
DBSTDefault -> do
let
genHeaders SortableP{..} = forM (toSortable . oneColonnadeHead <$> getColonnade dbtColonnade) $ \Sortable{..} -> do
widget <- sortableContent ^. cellContents
let
directions = [dir | SortingSetting k dir <- psSorting, Just k == sortableKey ]
isSortable = isJust sortableKey
isSorted = (`elem` directions)
attrs = sortableContent ^. cellAttrs
piSorting' = [ sSet | sSet <- fromMaybe [] piSorting, Just (sortKey sSet) /= sortableKey ]
return $(widgetFile "table/cell/header")
genHeaders SortableP{..} = forM (toSortable . oneColonnadeHead <$> getColonnade dbtColonnade) $ \Sortable{..} -> do
widget <- sortableContent ^. cellContents
let
directions = [dir | SortingSetting k dir <- psSorting, Just k == sortableKey ]
isSortable = isJust sortableKey
isSorted = (`elem` directions)
attrs = sortableContent ^. cellAttrs
piSorting' = [ sSet | sSet <- fromMaybe [] piSorting, Just (sortKey sSet) /= sortableKey ]
case dbsTemplate of
DBSTCourse _ _ _ _ -> return $(widgetFile "table/course/header")
DBSTDefault -> return $(widgetFile "table/cell/header")
in do
wHeaders <- maybe (return Nothing) (fmap Just . genHeaders) pSortable
wRows <- forM rows $ \row' -> forM (oneColonnadeEncode <$> getColonnade dbtColonnade) $ \(($ row') -> cell') -> do
widget <- cell' ^. cellContents
let attrs = cell' ^. cellAttrs
return $(widgetFile "table/cell/body")
return $(widgetFile "table/colonnade")
case dbsTemplate of
DBSTCourse c l r s -> do
wRows <- forM rows $ \row' -> let
Course{..} = row' ^. c . _entityVal
lecturerUsers = row' ^. l
courseLecturers = userSurname . entityVal <$> lecturerUsers
isRegistered = row' ^. r
courseSchoolName = schoolName $ row' ^. s . _entityVal
courseSemester = (termToText . unTermKey) courseTerm
in return $(widgetFile "table/course/course-teaser")
return $(widgetFile "table/course/colonnade")
DBSTDefault -> do
wRows <- forM rows $ \row' -> forM (oneColonnadeEncode <$> getColonnade dbtColonnade) $ \(($ row') -> cell') -> do
widget <- cell' ^. cellContents
let attrs = cell' ^. cellAttrs
return $(widgetFile "table/cell/body")
return $(widgetFile "table/colonnade")
pageCount
| PagesizeLimit l <- psLimit

38
templates/default-layout.lucius
View File

@ -649,3 +649,41 @@ section {
.form--inline {
display: inline-block;
}
/*
course teaser: header styling
TODO: move somewhere else?
*/
.course-teaser-header {
padding-top: 20px;
padding-bottom: 20px;
a {
text-decoration: none;
}
.course-header-link {
color: white;
font-weight: bold;
&:hover {
color: inherit;
}
.course-header {
background-color: var(--color-dark);
position: relative;
font-size: 16px;
color: #fff;
line-height: 1.4;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 5px;
padding-right: 25px;
font-weight: bold;
text-align: left;
border-radius: 15px;
margin-right: 10px;
}
}
}

5
templates/table/course/colonnade.hamlet
View File

@ -1,5 +1,10 @@
$newline never
<div .scrolltable>
$maybe wHeaders' <- wHeaders
<div .course-teaser-header>
$forall widget <- wHeaders'
^{widget}
$nothing
$if null wRows && (dbsEmptyStyle == DBESHeading)
<p>_{dbsEmptyMessage}
$else

34
templates/table/course/colonnade.lucius
View File

@ -9,3 +9,37 @@
.scrolltable {
box-shadow: none!important;
}
.course-header.sortable::after,
.course-header.sortable::before {
content: '';
position: absolute;
right: 5px;
top: 20px;
width: 0;
height: 0;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-bottom: 8px solid rgba(255, 255, 255, 0.4);
}
.course-header.sortable::before {
/* magic numbers to move arrow back in the right position after flipping it.
this allows us to use the same border for the up and the down arrow */
transform: translateY(150%) scale(1, -1);
transform-origin: top;
}
.course-header.sortable::after {
transform: translateY(-150%);
}
.course-header.sortable:hover::before,
.course-header.sortable:hover::after {
border-bottom-color: rgba(255, 255, 255, 0.7);
}
.course-header.sorted-asc::before,
.course-header.sorted-desc::after {
border-bottom-color: white !important;
}

13
templates/table/course/header.hamlet Normal file
View File

@ -0,0 +1,13 @@
$newline never
$maybe flag <- sortableKey
$case directions
$of [SortAsc]
<a .course-header-link rel=nofollow href=^{tblLink' $ setParams (wIdent "sorting") (map toPathPiece (SortingSetting flag SortDesc : piSorting'))}>
<span .course-header *{attrs} :isSortable:.sortable :isSorted SortAsc:.sorted-asc :isSorted SortDesc:.sorted-desc>
^{widget}
$of _
<a .course-header-link rel=nofollow href=^{tblLink' $ setParams (wIdent "sorting") (map toPathPiece (SortingSetting flag SortAsc : piSorting'))}>
<span .course-header *{attrs} :isSortable:.sortable :isSorted SortAsc:.sorted-asc :isSorted SortDesc:.sorted-desc>
^{widget}
$nothing