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

Make notes below the files view and always visible

Browse Source 
It looks similiar to github's readme. If there are no notes, the form
is displayed.
This commit is contained in:
Eike Kettner 2020-08-05 19:15:34 +02:00
parent 1662e1e2c8
commit 0453494cc6
6 changed files with 271 additions and 221 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
modules/webapp/src/main/elm/App/View.elm
View File

@ -305,14 +305,16 @@ loginInfo model =
footer : Model -> Html Msg footer : Model -> Html Msg
footer model = footer model =
div [ class "ui footer" ] div [ class "ui footer" ]
[ a [ href "https://github.com/eikek/docspell" ] [ div [ class "ui center aligned container" ]
[ i [ class "ui github icon" ] [] [ a [ href "https://github.com/eikek/docspell" ]
] [ i [ class "ui github icon" ] []
, span [] ]
[ text "Docspell " , span []
, text model.version.version [ text "Docspell "
, text " (#" , text model.version.version
, String.left 8 model.version.gitCommit |> text , text " (#"
, text ")" , String.left 8 model.version.gitCommit |> text
, text ")"
]
] ]
] ]

4
modules/webapp/src/main/elm/Comp/ItemDetail/Model.elm
View File

@ -79,7 +79,6 @@ type alias Model =
type NotesField type NotesField
= ViewNotes = ViewNotes
| EditNotes Comp.MarkdownInput.Model | EditNotes Comp.MarkdownInput.Model
| HideNotes
type alias AttachmentRename = type alias AttachmentRename =
@ -97,9 +96,6 @@ isEditNotes field =
ViewNotes -> ViewNotes ->
False False
HideNotes ->
False
emptyModel : Model emptyModel : Model
emptyModel = emptyModel =

25
modules/webapp/src/main/elm/Comp/ItemDetail/Update.elm
View File

@ -46,6 +46,7 @@ import Util.Folder exposing (mkFolderOption)
import Util.Http import Util.Http
import Util.List import Util.List
import Util.Maybe import Util.Maybe
import Util.String
type Msg type Msg
@ -67,7 +68,6 @@ type Msg
| SetName String | SetName String
| SaveName | SaveName
| SetNotes String | SetNotes String
| ToggleNotes
| ToggleEditNotes | ToggleEditNotes
| NotesEditMsg Comp.MarkdownInput.Msg | NotesEditMsg Comp.MarkdownInput.Msg
| SaveNotes | SaveNotes
@ -249,7 +249,12 @@ update key flags next msg model =
| item = item | item = item
, nameModel = item.name , nameModel = item.name
, notesModel = item.notes , notesModel = item.notes
, notesField = ViewNotes , notesField =
if Util.String.isNothingOrBlank item.notes then
EditNotes Comp.MarkdownInput.init
else
ViewNotes
, itemDate = item.itemDate , itemDate = item.itemDate
, dueDate = item.dueDate , dueDate = item.dueDate
, visibleAttach = 0 , visibleAttach = 0
@ -437,19 +442,6 @@ update key flags next msg model =
, Cmd.none , Cmd.none
) )
ToggleNotes ->
noSub
( { model
| notesField =
if model.notesField == ViewNotes then
HideNotes
else
ViewNotes
}
, Cmd.none
)
ToggleEditNotes -> ToggleEditNotes ->
noSub noSub
( { model ( { model
@ -475,9 +467,6 @@ update key flags next msg model =
, Cmd.none , Cmd.none
) )
HideNotes ->
noSub ( model, Cmd.none )
ViewNotes -> ViewNotes ->
noSub ( model, Cmd.none ) noSub ( model, Cmd.none )

295
modules/webapp/src/main/elm/Comp/ItemDetail/View.elm
View File

@ -39,97 +39,9 @@ view inav settings model =
div [] div []
[ Html.map ModalEditMsg (Comp.DetailEdit.viewModal settings model.modalEdit) [ Html.map ModalEditMsg (Comp.DetailEdit.viewModal settings model.modalEdit)
, renderItemInfo settings model , renderItemInfo settings model
, div , renderDetailMenu inav model
[ classList
[ ( "ui ablue-comp menu", True )
, ( "top attached"
, model.mailOpen
|| model.addFilesOpen
|| isEditNotes model.notesField
)
]
]
[ a [ class "item", Page.href HomePage ]
[ i [ class "arrow left icon" ] []
]
, a
[ classList
[ ( "item", True )
, ( "disabled", inav.prev == Nothing )
]
, Maybe.map ItemDetailPage inav.prev
|> Maybe.map Page.href
|> Maybe.withDefault (href "#")
]
[ i [ class "caret square left outline icon" ] []
]
, a
[ classList
[ ( "item", True )
, ( "disabled", inav.next == Nothing )
]
, Maybe.map ItemDetailPage inav.next
|> Maybe.map Page.href
|> Maybe.withDefault (href "#")
]
[ i [ class "caret square right outline icon" ] []
]
, a
[ classList
[ ( "toggle item", True )
, ( "active", model.menuOpen )
]
, title "Edit Metadata"
, onClick ToggleMenu
, href ""
]
[ i [ class "edit icon" ] []
]
, a
[ classList
[ ( "toggle item", True )
, ( "active", model.mailOpen )
]
, title "Send Mail"
, onClick ToggleMail
, href "#"
]
[ i [ class "mail outline icon" ] []
]
, a
[ classList
[ ( "toggle item", True )
, ( "active", isEditNotes model.notesField )
]
, if isEditNotes model.notesField then
title "Cancel editing"
else
title "Edit Notes"
, onClick ToggleEditNotes
, href "#"
]
[ Icons.editNotesIcon
]
, a
[ classList
[ ( "toggle item", True )
, ( "active", model.addFilesOpen )
]
, if model.addFilesOpen then
title "Close"
else
title "Add Files"
, onClick AddFilesToggle
, href "#"
]
[ Icons.addFilesIcon
]
]
, renderMailForm settings model , renderMailForm settings model
, renderAddFilesForm model , renderAddFilesForm model
, renderNotes model
, div [ class "ui grid" ] , div [ class "ui grid" ]
[ Html.map DeleteItemConfirm (Comp.YesNoDimmer.view model.deleteItemConfirm) [ Html.map DeleteItemConfirm (Comp.YesNoDimmer.view model.deleteItemConfirm)
, div , div
@ -156,6 +68,7 @@ view inav settings model =
[ [ renderAttachmentsTabMenu model [ [ renderAttachmentsTabMenu model
] ]
, renderAttachmentsTabBody settings model , renderAttachmentsTabBody settings model
, [ renderNotes model ]
, renderIdInfo model , renderIdInfo model
] ]
] ]
@ -166,6 +79,82 @@ view inav settings model =
--- Helper --- Helper
renderDetailMenu : { prev : Maybe String, next : Maybe String } -> Model -> Html Msg
renderDetailMenu inav model =
div
[ classList
[ ( "ui ablue-comp menu", True )
, ( "top attached"
, model.mailOpen
|| model.addFilesOpen
)
]
]
[ a [ class "item", Page.href HomePage ]
[ i [ class "arrow left icon" ] []
]
, a
[ classList
[ ( "item", True )
, ( "disabled", inav.prev == Nothing )
]
, Maybe.map ItemDetailPage inav.prev
|> Maybe.map Page.href
|> Maybe.withDefault (href "#")
]
[ i [ class "caret square left outline icon" ] []
]
, a
[ classList
[ ( "item", True )
, ( "disabled", inav.next == Nothing )
]
, Maybe.map ItemDetailPage inav.next
|> Maybe.map Page.href
|> Maybe.withDefault (href "#")
]
[ i [ class "caret square right outline icon" ] []
]
, a
[ classList
[ ( "toggle item", True )
, ( "active", model.menuOpen )
]
, title "Edit Metadata"
, onClick ToggleMenu
, href ""
]
[ i [ class "edit icon" ] []
]
, a
[ classList
[ ( "toggle item", True )
, ( "active", model.mailOpen )
]
, title "Send Mail"
, onClick ToggleMail
, href "#"
]
[ i [ class "mail outline icon" ] []
]
, a
[ classList
[ ( "toggle item", True )
, ( "active", model.addFilesOpen )
]
, if model.addFilesOpen then
title "Close"
else
title "Add Files"
, onClick AddFilesToggle
, href "#"
]
[ Icons.addFilesIcon
]
]
actionInputDatePicker : DatePicker.Settings actionInputDatePicker : DatePicker.Settings
actionInputDatePicker = actionInputDatePicker =
let let
@ -194,59 +183,97 @@ renderIdInfo model =
renderNotes : Model -> Html Msg renderNotes : Model -> Html Msg
renderNotes model = renderNotes model =
case model.notesField of case model.notesField of
HideNotes ->
case model.item.notes of
Nothing ->
span [ class "invisible hidden" ] []
Just _ ->
div [ class "ui segment" ]
[ a
[ class "ui top left attached label"
, onClick ToggleNotes
, href "#"
]
[ i [ class "eye icon" ] []
, text "Show notes…"
]
]
ViewNotes -> ViewNotes ->
case model.item.notes of div [ class "ui segments" ]
Nothing -> [ div [ class "ui segment" ]
span [ class "hidden invisible" ] [] [ div [ class "ui two column grid" ]
[ div [ class "column" ]
Just str -> [ p [ class "ui header" ]
div [ class "ui raised segment item-notes-display" ] [ text "Notes"
[ Markdown.toHtml [ class "item-notes" ] str ]
, a
[ class "ui left corner label"
, onClick ToggleNotes
, href "#"
] ]
[ i [ class "eye slash icon" ] [] , div [ class "right aligned column" ]
[ a
[ class "ui basic icon link"
, onClick ToggleEditNotes
, href "#"
]
[ i [ class "edit icon" ] []
]
] ]
] ]
]
, div [ class "ui segment" ]
[ Markdown.toHtml [] (Maybe.withDefault "" model.item.notes)
]
]
EditNotes mm -> EditNotes mm ->
div [ class "ui bottom attached segment" ] let
[ Html.map NotesEditMsg (Comp.MarkdownInput.view (Maybe.withDefault "" model.notesModel) mm) classes act =
, div [ class "ui secondary menu" ] classList
[ a [ ( "item", True )
[ class "link item" , ( "active", act )
, href "#"
, onClick SaveNotes
] ]
[ i [ class "save outline icon" ] [] in
, text "Save" div [ class "ui segments" ]
[ div [ class "ui segment" ]
[ div [ class "ui grid" ]
[ div [ class "two wide column" ]
[ p [ class "ui header" ]
[ text "Notes"
]
]
, div [ class "twelve wide center aligned column" ]
[ div [ class "ui horizontal bulleted link list" ]
[ Html.map NotesEditMsg
(Comp.MarkdownInput.viewEditLink classes mm)
, Html.map NotesEditMsg
(Comp.MarkdownInput.viewPreviewLink classes mm)
, Html.map NotesEditMsg
(Comp.MarkdownInput.viewSplitLink classes mm)
]
]
, div [ class "right aligned two wide column" ]
[ a
[ classList
[ ( "ui basic icon link", True )
, ( "invisible hidden", Util.String.isNothingOrBlank model.item.notes )
]
, onClick ToggleEditNotes
, href "#"
]
[ i [ class "cancel icon" ] []
]
]
] ]
, a ]
[ class "link item" , div [ class "ui segment" ]
, href "#" [ Html.map NotesEditMsg
, onClick ToggleEditNotes (Comp.MarkdownInput.viewContent
] (Maybe.withDefault "" model.notesModel)
[ i [ class "cancel icon" ] [] mm
, text "Cancel" )
, div [ class "ui secondary menu" ]
[ a
[ class "link item"
, href "#"
, onClick SaveNotes
]
[ i [ class "save outline icon" ] []
, text "Save"
]
, a
[ classList
[ ( "link item", True )
, ( "invisible hidden", Util.String.isNothingOrBlank model.item.notes )
]
, href "#"
, onClick ToggleEditNotes
]
[ i [ class "cancel icon" ] []
, text "Cancel"
]
] ]
] ]
] ]

139
modules/webapp/src/main/elm/Comp/MarkdownInput.elm
View File

@ -4,6 +4,11 @@ module Comp.MarkdownInput exposing
, init , init
, update , update
, view , view
, viewCheatLink
, viewContent
, viewEditLink
, viewPreviewLink
, viewSplitLink
) )
import Html exposing (..) import Html exposing (..)
@ -26,7 +31,7 @@ type alias Model =
init : Model init : Model
init = init =
{ display = Split { display = Edit
, cheatSheetUrl = "https://www.markdownguide.org/cheat-sheet" , cheatSheetUrl = "https://www.markdownguide.org/cheat-sheet"
} }
@ -46,59 +51,96 @@ update txt msg model =
( { model | display = dsp }, txt ) ( { model | display = dsp }, txt )
viewContent : String -> Model -> Html Msg
viewContent txt model =
case model.display of
Edit ->
editDisplay txt
Preview ->
previewDisplay txt
Split ->
splitDisplay txt
viewEditLink : (Bool -> Attribute Msg) -> Model -> Html Msg
viewEditLink classes model =
a
[ onClick (SetDisplay Edit)
, classes (model.display == Edit)
, href "#"
]
[ text "Edit"
]
viewPreviewLink : (Bool -> Attribute Msg) -> Model -> Html Msg
viewPreviewLink classes model =
a
[ onClick (SetDisplay Preview)
, classes (model.display == Preview)
, href "#"
]
[ text "Preview"
]
viewSplitLink : (Bool -> Attribute Msg) -> Model -> Html Msg
viewSplitLink classes model =
a
[ onClick (SetDisplay Split)
, classes (model.display == Split)
, href "#"
]
[ text "Split"
]
viewCheatLink : String -> Model -> Html msg
viewCheatLink classes model =
a
[ class classes
, target "_new"
, href model.cheatSheetUrl
]
[ i [ class "ui help icon" ] []
, text "Supports Markdown"
]
view : String -> Model -> Html Msg view : String -> Model -> Html Msg
view txt model = view txt model =
div [] div []
[ div [ class "ui top attached tabular mini menu" ] [ div [ class "ui top attached tabular mini menu" ]
[ a [ viewEditLink
[ classList (\act ->
[ ( "ui link item", True ) classList
, ( "active", model.display == Edit ) [ ( "ui link item", True )
] , ( "active", act )
, onClick (SetDisplay Edit) ]
, href "#" )
] model
[ text "Edit" , viewPreviewLink
] (\act ->
, a classList
[ classList [ ( "ui link item", True )
[ ( "ui link item", True ) , ( "active", act )
, ( "active", model.display == Preview ) ]
] )
, onClick (SetDisplay Preview) model
, href "#" , viewSplitLink
] (\act ->
[ text "Preview" classList
] [ ( "ui link item", True )
, a , ( "active", act )
[ classList ]
[ ( "ui link item", True ) )
, ( "active", model.display == Split ) model
] , viewCheatLink "ui right floated help-link link item" model
, onClick (SetDisplay Split)
, href "#"
]
[ text "Split"
]
, a
[ class "ui right floated help-link link item"
, target "_new"
, href model.cheatSheetUrl
]
[ i [ class "ui help icon" ] []
, text "Supports Markdown"
]
] ]
, div [ class "ui bottom attached segment" ] , div [ class "ui bottom attached segment" ]
[ case model.display of [ viewContent txt model
Edit ->
editDisplay txt
Preview ->
previewDisplay txt
Split ->
splitDisplay txt
] ]
] ]
@ -108,6 +150,7 @@ editDisplay txt =
textarea textarea
[ class "markdown-editor" [ class "markdown-editor"
, onInput SetText , onInput SetText
, placeholder "Add notes here…"
] ]
[ text txt ] [ text txt ]

9
modules/webapp/src/main/webjar/docspell.css
View File

@ -42,6 +42,7 @@
.default-layout .main-content { .default-layout .main-content {
margin-top: 45px; margin-top: 45px;
padding-bottom: 2em;
} }
.default-layout .top-menu { .default-layout .top-menu {
@ -67,13 +68,6 @@
width: auto; width: auto;
} }
.default-layout .ui.segment .item-notes {
padding: 0 1em;
}
.default-layout .ui.segment.item-notes-display {
background: rgba(246, 255, 158, 0.4);
}
.default-layout .extracted-text { .default-layout .extracted-text {
font-family: monospace; font-family: monospace;
white-space: pre-wrap; white-space: pre-wrap;
@ -265,7 +259,6 @@ label span.muted {
} }
/* Datepicker /* Datepicker
From: https://github.com/CurrySoftware/elm-datepicker/blob/3.1.0/css/elm-datepicker.css From: https://github.com/CurrySoftware/elm-datepicker/blob/3.1.0/css/elm-datepicker.css
License: BSD-3-Clause License: BSD-3-Clause