ui-overhaul #3

src/elm/Locale.elm

@@ -1,4 +1,4 @@
-module Locale exposing (Locale, encodeLocale, getDefaultLocale, getEnglishLocale, getGermanLocale, isEnglishLocale, isGermanLocale, localeDecoder, translateApplyTags, translateAskForDrop, translateBatchTagging, translateCancel, translateCheckboxStackData, translateDefaultTags, translateDeleteYourLocalData, translateDrop, translateEmptyFileText, translateEmptyFileTitle, translateEnterATag, translateErrorHeading, translateErrorParsingYourFile, translateHowBatchTaggingWorks, translateHowManualTaggingWorks, translateImport, translateImportData, translateImportDataNoRecordsFound, translateImportDataNoRecordsFoundTitle, translateIncompatibleDataComparison, translateIncompatibleDataIntro, translateIncompatibleDataTitle, translateInfoOnHowDataIsStored, translateIrregularRowsText, translateIrregularRowsTitle, translateLocale, translateManageYourTags, translateNoMatchingRecordsFound, translateNoRecordsToChooseFromSelectAfile, translateNoWorkingData, translateProceed, translateRecordsThatWillBeTagged, translateSave, translateSelectAKeywordOrRegex, translateSelectATagToTag, translateSelectAcsvFile, translateSingleTagging, translateTableFileName, translateTag, translateTagAlreadyExists, translateTaggedRecords, translateTitleDeleteLocalData, translateTitleRemainingWorkingData, translateUncheckStackDataWarning, translateViewSourceCode, translateViewUserDocumentation, translateWarningDeleteLocalData, translateWarningLabel)
+module Locale exposing (Locale, encodeLocale, getDefaultLocale, getEnglishLocale, getGermanLocale, isEnglishLocale, isGermanLocale, localeDecoder, translateApplyTags, translateAskForDrop, translateBatchTagging, translateCancel, translateCheckboxStackData, translateClose, translateDefaultTags, translateDeleteYourLocalData, translateDrop, translateEmptyFileText, translateEmptyFileTitle, translateEnterATag, translateErrorHeading, translateErrorParsingYourFile, translateHowBatchTaggingWorks, translateHowManualTaggingWorks, translateImport, translateImportData, translateImportDataNoRecordsFound, translateImportDataNoRecordsFoundTitle, translateIncompatibleDataComparison, translateIncompatibleDataIntro, translateIncompatibleDataTitle, translateInfoOnHowDataIsStored, translateIrregularRowsText, translateIrregularRowsTitle, translateLocale, translateManageYourTags, translateNoMatchingRecordsFound, translateNoRecordsToChooseFromSelectAfile, translateNoWorkingData, translateProceed, translateRecordsThatWillBeTagged, translateSave, translateSelectAKeywordOrRegex, translateSelectATagToTag, translateSelectAcsvFile, translateSingleTagging, translateTableFileName, translateTag, translateTagAlreadyExists, translateTaggedRecords, translateTitleDeleteLocalData, translateTitleRemainingWorkingData, translateUncheckStackDataWarning, translateViewSourceCode, translateViewUserDocumentation, translateWarningDeleteLocalData, translateWarningLabel)
 
 import Json.Decode as Decode
 import Json.Encode as Encode
@@ -88,6 +88,16 @@ localeDecoder =
 -- "expecting float number"
 
 
+translateClose : Translation
+translateClose locale =
+    case locale of
+        EN ->
+            "Close"
+
+        DE ->
+            "Schliessen"
+
+
 translateViewUserDocumentation : Translation
 translateViewUserDocumentation locale =
     case locale of

src/elm/Main.elm

@@ -88,6 +88,8 @@ type ModalContent
     | ViewDropIrregularRecords (List ColumnHeadingName) (List (List String)) (List (List String))
     | ViewIncompatibleData (List ColumnHeadingName) (List ColumnHeadingName)
     | ViewWorkingData (List ColumnHeadingName) (List (List String))
+    | ViewManageTags
+    | ViewTaggedData
 
 
 type ImportStacking
@@ -259,7 +261,9 @@ encodeShowModal showModal =
 modalContentDecoder : Decode.Decoder ModalContent
 modalContentDecoder =
     Decode.oneOf
-        [ Decode.field "viewUntaggedWorkspaceData"
+        [ Decode.field "viewTaggedData" (Decode.succeed ViewTaggedData)
+        , Decode.field "viewManageTags" (Decode.succeed ViewManageTags)
+        , Decode.field "viewWorkingData"
             (Decode.map2 ViewWorkingData
                 (Decode.field "columns" <| Decode.list Decode.string)
                 (Decode.field "records" <| Decode.list (Decode.list Decode.string))
@@ -295,6 +299,16 @@ modalContentDecoder =
 encodeModalContent : ModalContent -> Encode.Value
 encodeModalContent modalContent_ =
     case modalContent_ of
+        ViewTaggedData ->
+            Encode.object
+                [ ( "viewTaggedData", Encode.null )
+                ]
+
+        ViewManageTags ->
+            Encode.object
+                [ ( "viewManageTags", Encode.null )
+                ]
+
         ViewWorkingData columns records ->
             let
                 valuesEncoding =
@@ -304,7 +318,7 @@ encodeModalContent modalContent_ =
                         ]
             in
             Encode.object
-                [ ( "viewUntaggedWorkspaceData", valuesEncoding )
+                [ ( "viewWorkingData", valuesEncoding )
                 ]
 
         ViewImportFileRecords columns records stacking ->
@@ -377,10 +391,12 @@ encodeModalContent modalContent_ =
 -}
 type Msg
     = RemoveTag String
+    | UserClickedViewTaggedDataButton
+    | UserClickedManageTagsButton
     | UserClickedItemInPlaceRegexDropDownList ColumnHeadingName Regex
     | UserClickedRequestDeleteDataButton
     | DeleteLocalData
-    | ToggleLocale
+    | UserClickedToggleLocale
     | SetLocale String
     | TagInput String
     | CreateTagFromBuffer
@@ -417,6 +433,12 @@ updateWithStorage msg model =
 update : Msg -> Model -> ( Model, Cmd Msg )
 update msg model =
     case msg of
+        UserClickedViewTaggedDataButton ->
+            ( updateShowModal Modal.RegularView (Locale.translateTaggedRecords model.locale) ViewTaggedData model, Cmd.none )
+
+        UserClickedManageTagsButton ->
+            ( updateShowModal Modal.RegularView (Locale.translateManageYourTags model.locale) ViewManageTags model, Cmd.none )
+
         UserClickedImportFileButton ->
             ( model, File.Select.file [ "text/csv" ] UserSelectedFileFromSysDialog )
 
@@ -544,7 +566,7 @@ update msg model =
                 _ ->
                     ( updateSetLocale Locale.getEnglishLocale model, Cmd.none )
 
-        ToggleLocale ->
+        UserClickedToggleLocale ->
             if Locale.isEnglishLocale model.locale then
                 ( updateSetLocale Locale.getGermanLocale model, Cmd.none )
 
@@ -665,17 +687,24 @@ update msg model =
                     else
                         Dict.insert columnKey searchPatternInput model.batchTaggingOptions
 
+                workingTableData =
+                    Maybe.withDefault (Table.TableData [] []) (getWorkingData model)
+
                 headers =
-                    Maybe.withDefault (Table.TableData [] []) (getWorkingData model) |> .headers
+                    workingTableData.headers
 
                 rows =
-                    Maybe.withDefault (Table.TableData [] []) (getWorkingData model) |> .rows
+                    workingTableData.rows
 
                 matchedRows =
                     matchRows updatedBatchTaggingOptions headers rows
 
                 modelWithUpdatedSelectedWorkingData =
-                    TableData headers matchedRows
+                    if Dict.isEmpty updatedBatchTaggingOptions then
+                        workingTableData
+
+                    else
+                        TableData headers matchedRows
             in
             ( { model | batchTaggingOptions = updatedBatchTaggingOptions, selectedWorkingData = modelWithUpdatedSelectedWorkingData }, Cmd.none )
 
@@ -807,9 +836,49 @@ viewRows responsive headers rows =
     viewRecords responsive headers <| unwrapRows rows
 
 
-viewModalContent : Locale -> ModalContent -> Html.Html Msg
-viewModalContent locale modalContent =
+viewModalContent : Locale -> Model -> ModalContent -> Html.Html Msg
+viewModalContent locale model modalContent =
     case modalContent of
+        ViewTaggedData ->
+            let
+                someTables =
+                    Maybe.withDefault [] (List.head model.tableDataTagged)
+
+                headers_ =
+                    case getWorkspace model of
+                        EmptyWorkspace ->
+                            []
+
+                        Workspace headers ->
+                            headers
+
+                preparedRows : List { tag : Tag, headers : List ( ColumnHeadingName, Msg ), rows : List Row, dataFormats : Dict ColumnHeadingName Table.DataFormat }
+                preparedRows =
+                    List.map
+                        (\{ tag, headers, rows, dataFormats } ->
+                            let
+                                headersWithSortMsg =
+                                    List.map (\column -> ( column, SortTaggedTable tag column )) headers
+                                        |> List.append [ ( Locale.translateTag model.locale, NoOp ) ]
+                            in
+                            { tag = tag, headers = headersWithSortMsg, rows = List.map (prependCellToRow tag) rows, dataFormats = dataFormats }
+                        )
+                        someTables
+
+                rowsViews =
+                    preparedRows
+                        |> List.map
+                            (\tableDataTagged ->
+                                Table.viewWithTagData
+                                    Table.Responsive
+                                    -- use original header list for Tabledownload, since we modified it before
+                                    (TableDownload <| TableDataTagged tableDataTagged.tag headers_ tableDataTagged.rows tableDataTagged.dataFormats)
+                                    tableDataTagged
+                            )
+            in
+            div []
+                rowsViews
+
         ViewImportFileRecords headers records stacking ->
             if List.isEmpty records then
                 text <| Locale.translateImportDataNoRecordsFound locale
@@ -918,10 +987,29 @@ viewModalContent locale modalContent =
             else
                 viewRecords Table.Responsive headers records
 
+        ViewManageTags ->
+            div [ class "uk-padding" ]
+                [ Input.viewWithButton
+                    [ onInput TagInput, value model.addTagInputBuffer, placeholder (Locale.translateEnterATag model.locale) ]
+                    Button.Add
+                    CreateTagFromBuffer
+                , viewTagList
+                    (\tag -> RemoveTag tag)
+                    model.tags
+                ]
+
 
 getModalButtons : Locale -> ModalContent -> List (Modal.Button Msg)
 getModalButtons locale modalContent =
     case modalContent of
+        ViewTaggedData ->
+            [ Modal.DefaultButton Button.Secondary CloseModal (Locale.translateClose locale)
+            ]
+
+        ViewManageTags ->
+            [ Modal.DefaultButton Button.Secondary CloseModal (Locale.translateClose locale)
+            ]
+
         ViewWorkingData _ _ ->
             [ Modal.DefaultButton Button.Secondary CloseModal "Ok"
             ]
@@ -991,7 +1079,7 @@ view model =
                         modal_.displayProperties
                         CloseModal
                         modal_.title
-                        (viewModalContent model.locale modal_.content)
+                        (viewModalContent model.locale model modal_.content)
                         (getModalButtons model.locale modal_.content)
 
                 Nothing ->
@@ -1028,17 +1116,11 @@ view model =
                     taggingSectionNav
                 ]
             , div [ class "uk-margin" ]
-                [ button [ class "uk-button uk-button-small uk-align-right", onClick ToggleLocale ]
-                    [ text <| Locale.translateLocale model.locale ++ ": " ++ localeTranslation ]
-                , button [ class "uk-button uk-button-small uk-align-right uk-button-danger", onClick UserClickedRequestDeleteDataButton ] [ text (Locale.translateDeleteYourLocalData model.locale) ]
-                , span
+                [ span
                     [ class "uk-label uk-text-small" ]
                     [ text "NOTE" ]
                 , span [ class "uk-text-small uk-text-light" ] [ text <| "   " ++ Locale.translateInfoOnHowDataIsStored model.locale ]
                 ]
-            , div []
-                [ viewManageTagsSection (Locale.translateManageYourTags model.locale) (Locale.translateEnterATag model.locale) model.addTagInputError model.addTagInputBuffer model.tags TagInput CreateTagFromBuffer RemoveTag
-                ]
             ]
         , div
             [ class "row" ]
@@ -1343,19 +1425,21 @@ viewTaggingIconNav ( history1, history2 ) =
                 ( NavBar.Disabled NavBar.Undo, NoOp, [] )
     in
     NavBar.viewIconNav
-        [ ( NavBar.Import, UserClickedImportFileButton, [] )
-        , ( NavBar.Spacer, NoOp, [] )
-        , ( NavBar.ViewTableData, UserClickedViewWorkingDataNavButtonInTaggingSection, [] )
-        , ( NavBar.ViewTaggedData, NoOp, [] )
-        , ( NavBar.Spacer, NoOp, [] )
-        , ( NavBar.ViewManageTags, NoOp, [] )
-        , ( NavBar.Spacer, NoOp, [] )
-        , undoButton
+        [ undoButton
+        , ( NavBar.Delete, UserClickedRequestDeleteDataButton, [] )
+        , ( NavBar.Language, UserClickedToggleLocale, [] )
 
         -- , ( NavBar.Disabled NavBar.Redo, NoOp, [] )
         -- , ( NavBar.Disabled NavBar.Backward, NoOp, [] )
         -- , ( NavBar.Disabled NavBar.Forward, NoOp, [] )
         ]
+        [ ( NavBar.Import, UserClickedImportFileButton, [] )
+        , ( NavBar.Spacer, NoOp, [] )
+        , ( NavBar.ViewTableData, UserClickedViewWorkingDataNavButtonInTaggingSection, [] )
+        , ( NavBar.ViewTaggedData, UserClickedViewTaggedDataButton, [] )
+        , ( NavBar.Spacer, NoOp, [] )
+        , ( NavBar.ViewManageTags, UserClickedManageTagsButton, [] )
+        ]
 
 
 viewMappedRecordsPanel : String -> String -> List String -> List TableDataTagged -> Html Msg

src/elm/Modal.elm

@@ -111,7 +111,7 @@ view displayProperties closeMsg heading content buttons =
                     [ ( "uk-modal-full", True ) ]
     in
     div [ class "uk-modal", class "uk-modal-container uk-open", classList displayPropertyClasses, style "display" "block" ]
-        [ div [ class "uk-modal-dialog" ]
+        [ div [ class "uk-modal-dialog uk-animation-slide-top" ]
             [ button [ class "uk-modal-close-full uk-close-large", type_ "button", attribute "uk-close" "", onClick closeMsg ]
                 []
             , div [ class "uk-modal-header" ]

src/elm/NavBar.elm

@@ -19,14 +19,16 @@ type NavItem
     | ViewTableData
     | ViewManageTags
     | ViewTaggedData
+    | Delete
+    | Language
     | Spacer
     | Disabled NavItem
 
 
-viewIconNavItem : List (Html.Attribute a) -> a -> Html.Html a
-viewIconNavItem attr msg =
+viewIconNavItem : String -> List (Html.Attribute a) -> a -> Html.Html a
+viewIconNavItem tooltip attr msg =
     li []
-        [ button (attr ++ [ onClick msg, class "uk-icon" ])
+        [ button (attr ++ [ onClick msg, class "uk-icon", attribute "uk-tooltip" <| "title: " ++ tooltip ])
             []
         ]
 
@@ -35,46 +37,57 @@ mapActionToElement : ( NavItem, msg, List (Html.Attribute msg) ) -> Html.Html ms
 mapActionToElement ( action, msg, attr ) =
     case action of
         Spacer ->
-            viewIconNavItem [ style "border-left" "1px solid #efefef", style "height" "26px" ] msg
+            viewIconNavItem "" [ style "border-left" "1px solid #efefef", style "height" "26px" ] msg
+
+        Language ->
+            viewIconNavItem "Toggle Language" (attribute "uk-icon" "icon: world" :: attr) msg
+
+        Delete ->
+            viewIconNavItem "Delete User Data" (attribute "uk-icon" "icon: trash" :: attr) msg
 
         ViewTaggedData ->
-            viewIconNavItem (attribute "uk-icon" "icon: database" :: attr) msg
+            viewIconNavItem "View Tagged Data" (attribute "uk-icon" "icon: database" :: attr) msg
 
         ViewManageTags ->
-            viewIconNavItem (attribute "uk-icon" "icon: tag" :: attr) msg
+            viewIconNavItem "Manage your Tags" (attribute "uk-icon" "icon: tag" :: attr) msg
 
         Undo ->
-            viewIconNavItem (attribute "uk-icon" "icon: reply" :: attr) msg
+            viewIconNavItem "Undo" (attribute "uk-icon" "icon: reply" :: attr) msg
 
         Redo ->
-            viewIconNavItem (attribute "uk-icon" "icon: forward" :: attr) msg
+            viewIconNavItem "Redo" (attribute "uk-icon" "icon: forward" :: attr) msg
 
         Forward ->
-            viewIconNavItem (attribute "uk-icon" "icon: chevron-right" :: attr) msg
+            viewIconNavItem "Forwards" (attribute "uk-icon" "icon: chevron-right" :: attr) msg
 
         Backward ->
-            viewIconNavItem (attribute "uk-icon" "icon: chevron-left" :: attr) msg
+            viewIconNavItem "Backwards" (attribute "uk-icon" "icon: chevron-left" :: attr) msg
 
         Export ->
-            viewIconNavItem (attribute "uk-icon" "icon: download" :: attr) msg
+            viewIconNavItem "Export to CSV" (attribute "uk-icon" "icon: download" :: attr) msg
 
         Import ->
-            viewIconNavItem (attribute "uk-icon" "icon: plus" :: attr) msg
+            viewIconNavItem "Import from CSV" (attribute "uk-icon" "icon: plus" :: attr) msg
 
         ViewTableData ->
-            viewIconNavItem (attribute "uk-icon" "icon: table" :: attr) msg
+            viewIconNavItem "View Working Data" (attribute "uk-icon" "icon: table" :: attr) msg
 
         Disabled action_ ->
             mapActionToElement ( action_, msg, [ class "ui-disabled uk-disabled" ] )
 
 
-viewIconNav : List ( NavItem, msg, List (Html.Attribute msg) ) -> Html.Html msg
-viewIconNav buttonList =
+viewIconNav : List ( NavItem, msg, List (Html.Attribute msg) ) -> List ( NavItem, msg, List (Html.Attribute msg) ) -> Html.Html msg
+viewIconNav destructiveButtons constructiveButtons =
     div
-        [ class "uk-flex uk-flex-right uk-padding uk-padding-remove-top uk-padding-remove-bottom" ]
+        [ class "uk-flex uk-flex-between uk-padding uk-padding-remove-top uk-padding-remove-bottom" ]
         [ ul [ class "uk-iconnav" ]
             (List.map
                 mapActionToElement
-                buttonList
+                destructiveButtons
+            )
+        , ul [ class "uk-iconnav" ]
+            (List.map
+                mapActionToElement
+                constructiveButtons
             )
         ]

src/elm/Table.elm

@@ -412,7 +412,7 @@ view responsive headers rows =
 
 viewRow : (List (Html.Attribute msg) -> List (Html.Html msg) -> Html.Html msg) -> List (Html.Attribute msg) -> List (Html msg) -> Html msg
 viewRow tableElement elementAttr cells =
-    tr []
+    tr [ class "uk-animation-slide-top" ]
         (List.map
             (\content -> tableElement elementAttr [ content ])
             cells
@@ -434,7 +434,7 @@ viewWithTagData responsive exportAction { tag, headers, rows } =
                     [ class "uk-text-large" ]
                     [ text tag ]
                 ]
-            , NavBar.viewIconNav [ ( NavBar.Export, exportAction, [] ) ]
+            , NavBar.viewIconNav [] [ ( NavBar.Export, exportAction, [] ) ]
             ]
         , view
             responsive