TheAnachronism/docspell
1
0
Fork 0
mirror of https://github.com/TheAnachronism/docspell.git synced 2025-03-26 09:05:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improve item card

Browse Source
This commit is contained in:
Eike Kettner 2020-11-13 01:18:22 +01:00
parent e5ce1fd45f
commit 8950cc4dc9
2 changed files with 76 additions and 55 deletions
modules/webapp/src/main
elm/Comp
ItemCard.elm
webjar
docspell.css

114
modules/webapp/src/main/elm/Comp/ItemCard.elm

@ -152,16 +152,20 @@ view cfg settings model item =
]
++ DD.draggable ItemDDMsg item.id
)
[ if fieldHidden Data.Fields.PreviewImage then
span [ class "invisible" ] []
((if fieldHidden Data.Fields.PreviewImage then
[]
else
previewImage settings model item
, mainContent cardAction cardColor isConfirmed settings cfg item
, notesContent settings item
, metaDataContent settings item
, fulltextResultsContent item
]
[ previewMenu model item (currentAttachment model item)
, previewImage settings cardAction model item
]
)
++ [ mainContent cardAction cardColor isConfirmed settings cfg item
, notesContent settings item
, metaDataContent settings item
, fulltextResultsContent item
]
)
fulltextResultsContent : ItemLight -> Html Msg
@ -376,20 +380,21 @@ mainContent cardAction cardColor isConfirmed settings cfg item =
]
previewImage : UiSettings -> Model -> ItemLight -> Html Msg
previewImage settings model item =
previewImage : UiSettings -> Attribute Msg -> Model -> ItemLight -> Html Msg
previewImage settings cardAction model item =
let
mainAttach =
currentAttachment model item
previewUrl =
Maybe.map .id mainAttach
|> Maybe.map Api.attachmentPreviewURL
|> Maybe.withDefault (Api.itemBasePreviewURL item.id)
mainAttach =
currentAttachment model item
in
div
a
[ class "image ds-card-image"
, Data.UiSettings.cardPreviewSize settings
, cardAction
]
[ img
[ class "preview-image"
@ -397,52 +402,73 @@ previewImage settings model item =
, Data.UiSettings.cardPreviewSize settings
]
[]
, pageCountLabel model item mainAttach
]
pageCountLabel : Model -> ItemLight -> Maybe AttachmentLight -> Html Msg
pageCountLabel model item mainAttach =
previewMenu : Model -> ItemLight -> Maybe AttachmentLight -> Html Msg
previewMenu model item mainAttach =
let
pageCount =
Maybe.andThen .pageCount mainAttach
|> Maybe.withDefault 0
in
div
[ classList
[ ( "card-attachment-nav top", True )
, ( "invisible", pageCount == 0 || (item.fileCount == 1 && pageCount == 1) )
]
]
[ if item.fileCount == 1 then
div
[ class "ui secondary basic mini label"
, title "Number of pages"
]
[ text "p."
, text (String.fromInt pageCount)
]
else
div [ class "ui left labeled mini button" ]
[ div [ class "ui basic right pointing mini label" ]
[ currentPosition model item
|> String.fromInt
|> text
, text "/"
, text (String.fromInt item.fileCount)
, text " p."
, text (String.fromInt pageCount)
attachUrl =
Maybe.map .id mainAttach
|> Maybe.map ((++) "/api/v1/sec/attachment/")
|> Maybe.withDefault "/api/v1/sec/attachment/none"
gotoFileBtn =
a
[ class "ui compact basic icon button"
, href attachUrl
, target "_self"
]
[ i [ class "eye icon" ] []
]
in
if pageCount == 0 || (item.fileCount == 1 && pageCount == 1) then
div [ class "card-attachment-nav" ]
[ gotoFileBtn
]
else if item.fileCount == 1 then
div [ class "card-attachment-nav" ]
[ div [ class "ui small top attached basic icon buttons" ]
[ gotoFileBtn
]
, div [ class "ui attached basic fitted center aligned blue segment" ]
[ span
[ title "Number of pages"
]
[ text (String.fromInt pageCount)
, text "p."
]
]
]
else
div [ class "card-attachment-nav" ]
[ div [ class "ui small top attached basic icon buttons" ]
[ gotoFileBtn
, a
[ class "ui mini icon secondary button"
[ class "ui compact icon button"
, href "#"
, onClick (CyclePreview item)
]
[ i [ class "arrow right icon" ] []
]
]
]
, div [ class "ui attached basic blue fitted center aligned segment" ]
[ currentPosition model item
|> String.fromInt
|> text
, text "/"
, text (String.fromInt item.fileCount)
, text ", "
, text (String.fromInt pageCount)
, text "p."
]
]
renderHighlightEntry : HighlightEntry -> Html Msg

17
modules/webapp/src/main/webjar/docspell.css

@ -96,17 +96,12 @@
.default-layout .ui.card .link.content:hover {
box-shadow: 0 0 0 1px #d4d4d5,0 2px 4px 0 rgba(34,36,38,.12),0 2px 10px 0 rgba(34,36,38,.15);
}
.default-layout .image .card-attachment-nav {
.default-layout .card .card-attachment-nav {
position: absolute;
right: 2px;
left: 4px;
top: 4px;
z-index: 10;
}
.default-layout .image .card-attachment-nav.bottom {
bottom: 2px;
}
.default-layout .image .card-attachment-nav.top {
top: 2px;
}
.default-layout .image.ds-card-image {
overflow: auto;
}
@ -123,13 +118,13 @@
margin-left: auto;
margin-right: auto;
}
.default-layout img.preview-image.small {
.default-layout .image.ds-card-image img.preview-image.small {
max-width: 80px;
}
.default-layout img.preview-image.medium {
.default-layout .image.ds-card-image img.preview-image.medium {
max-width: 160px;
}
.default-layout img.preview-image.large {
.default-layout .image.ds-card-image img.preview-image.large {
max-width: none;
}