diff options
author | Yorhel <git@yorhel.nl> | 2020-11-02 12:41:00 +0100 |
---|---|---|
committer | Yorhel <git@yorhel.nl> | 2020-11-02 12:41:02 +0100 |
commit | ff3738db5ef84abf93a97724fe4bc397878e57e3 (patch) | |
tree | 45ad5c79585e38fb59db56248b567bef580d6831 | |
parent | 180c4579b4af37a506e80c308fcfdd4ee5d3e177 (diff) |
AdvSearch: Add function to add new fields + display nested queries
Styling is still a mess, but feature-wise it's starting to look like
something.
-rw-r--r-- | data/style.css | 3 | ||||
-rw-r--r-- | elm/AdvSearch/Fields.elm | 44 |
2 files changed, 42 insertions, 5 deletions
diff --git a/data/style.css b/data/style.css index 2472748b..c477ca9b 100644 --- a/data/style.css +++ b/data/style.css @@ -1115,6 +1115,9 @@ p.filselect i { font-style: normal } /****** Advanced Search *******/ .advsearch { max-width: 800px; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: center } +.advsearch .advnest { display: flex } +.advsearch .advnest > div:nth-child(1) { width: 30px } +.advsearch .advnest > div:nth-child(2) { border-left: 1px dashed $border$ } .advsearch .advrow { display: flex; flex-wrap: wrap } .advsearch .advrow > * { margin: 5px; width: 150px } .advsearch .advheader { box-sizing: border-box; background-color: $_blendbg$; padding: 3px; width: 100%; margin-bottom: 2px } diff --git a/elm/AdvSearch/Fields.elm b/elm/AdvSearch/Fields.elm index f33b5bde..ac3f6d0b 100644 --- a/elm/AdvSearch/Fields.elm +++ b/elm/AdvSearch/Fields.elm @@ -4,6 +4,7 @@ import Html exposing (..) import Html.Attributes exposing (..) import Array as A import Lib.Util exposing (..) +import Lib.Html exposing (..) import Lib.DropDown as DD import Lib.Api as Api import AdvSearch.Set as AS @@ -24,6 +25,7 @@ type alias NestModel = type NestMsg = NAddToggle Bool + | NAdd Int | NField Int FieldMsg @@ -40,6 +42,9 @@ nestUpdate : Data -> NestMsg -> NestModel -> (Data, NestModel, Cmd NestMsg) nestUpdate dat msg model = case msg of NAddToggle b -> (dat, { model | add = DD.toggle model.add b }, Cmd.none) + NAdd n -> + let (ndat,f) = fieldInit n dat + in (ndat, { model | add = DD.toggle model.add False, fields = model.fields ++ [f] }, Cmd.none) NField n m -> case List.head (List.drop n model.fields) of Nothing -> (dat, model, Cmd.none) @@ -69,13 +74,42 @@ nestFromQuery ntype ftype dat q = _ -> Nothing +-- TODO: Dropdown to display & switch between and/or +-- TODO: Buttons to move and remove fields nestView : NestModel -> Html NestMsg nestView model = - -- TODO: Dropdown to switch between and/or - -- TODO: Button to add more fields - -- TODO: Buttons to move and remove fields - -- TODO: Use a multi-row layout if there are nested filters - div [ class "advrow" ] <| List.indexedMap (\i f -> Html.map (NField i) (fieldView f)) model.fields + let + isNest (_,(_,_,f)) = + case f of + FMNest _ -> True + _ -> False + list = List.indexedMap (\a b -> (a,b)) model.fields + nests = List.filter isNest list + plains = List.filter (not << isNest) list + plainsV = List.map (\(i,f) -> Html.map (NField i) (fieldView f)) plains + + add = + div [ class "elm_dd_input elm_dd_noarrow", style "width" "13px" ] + [ DD.view model.add Api.Normal (text "+") <| \() -> + [ div [ class "advheader" ] + [ h3 [] [ text "Add filter" ] ] + , ul [] <| + List.map (\(n,f) -> + if f.ftype /= model.ftype || f.title == "" then text "" + else li [] [ a [ href "#", onClickD (NAdd n)] [ text f.title ] ] + ) <| A.toIndexedList fields + ] + ] + + sel = div [] [ text <| if model.ntype == NAnd then "And" else "Or" ] + in + div [ class "advnest" ] + [ sel + , div [] + <| div [ class "advrow" ] (if List.isEmpty nests then plainsV ++ [add] else plainsV) + :: List.map (\(i,f) -> Html.map (NField i) (fieldView f)) nests + ++ (if List.isEmpty nests then [] else [add]) + ] |