summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorYorhel <git@yorhel.nl>2020-11-02 13:40:09 +0100
committerYorhel <git@yorhel.nl>2020-11-02 13:40:11 +0100
commitddc4b6779acc962addd7f0dfd31df70d77fff113 (patch)
tree94c1a74504eff881380e5e66e12a35cf3988e498
parentff3738db5ef84abf93a97724fe4bc397878e57e3 (diff)
Advsearch: Add dropdown to change nesting type + styling fixes
NOW we're really getting somewhere!
-rw-r--r--data/style.css10
-rw-r--r--elm/AdvSearch/Fields.elm68
-rw-r--r--elm/AdvSearch/Main.elm2
3 files changed, 51 insertions, 29 deletions
diff --git a/data/style.css b/data/style.css
index c477ca9b..85ab464e 100644
--- a/data/style.css
+++ b/data/style.css
@@ -1114,16 +1114,18 @@ p.filselect i { font-style: normal }
/****** Advanced Search *******/
-.advsearch { max-width: 800px; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: center }
+.advsearch { max-width: 800px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; 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 .advnest > div:nth-child(1) { flex: 0 0 35px; }
+.advsearch .advnest > div:nth-child(2) { flex: 1; border-left: 1px dashed $border$ }
+.advsearch .elm_dd_input { margin: 5px; width: 150px }
+.advsearch .elm_dd_input.elm_dd_noarrow { width: 13px }
.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 }
.advsearch .advheader > h3 { text-align: center; font-weight: bold; font-size: inherit; margin-bottom: 3px }
.advsearch .advheader .opts { display: flex; justify-content: space-between }
.advsearch .advheader .opts > * { margin: 0 }
+.advsearch input.submit { margin-top: 5px }
diff --git a/elm/AdvSearch/Fields.elm b/elm/AdvSearch/Fields.elm
index ac3f6d0b..79015359 100644
--- a/elm/AdvSearch/Fields.elm
+++ b/elm/AdvSearch/Fields.elm
@@ -27,6 +27,7 @@ type NestMsg
= NAddToggle Bool
| NAdd Int
| NField Int FieldMsg
+ | NType NestType Bool
nestInit : NestType -> FieldType -> Data -> (Data, NestModel)
@@ -51,6 +52,7 @@ nestUpdate dat msg model =
Just f ->
let (ndat, nf, nc) = fieldUpdate dat m f
in (ndat, { model | fields = modidx n (always nf) model.fields }, Cmd.map (NField n) nc)
+ NType n _ -> (dat, { model | ntype = n }, Cmd.none)
nestToQuery : NestModel -> Maybe Query
@@ -74,9 +76,16 @@ nestFromQuery ntype ftype dat q =
_ -> Nothing
--- TODO: Dropdown to display & switch between and/or
+nestFieldView : Field -> Html FieldMsg
+nestFieldView (fid, fdd, fm) =
+ let (flbl, fcont, fbody) = fieldView (fid,fdd,fm)
+ in div [ class "advnest" ]
+ [ div [ class "elm_dd_input", style "width" "40px" ] [ DD.view fdd Api.Normal flbl fcont ]
+ , fbody ]
+
+
-- TODO: Buttons to move and remove fields
-nestView : NestModel -> Html NestMsg
+nestView : NestModel -> (Html NestMsg, () -> List (Html NestMsg), Html NestMsg)
nestView model =
let
isNest (_,(_,_,f)) =
@@ -86,13 +95,17 @@ nestView model =
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
+
+ pView (fid, fdd, fm) =
+ let (flbl, fcont, fbody) = fieldView (fid,fdd,fm)
+ in div [ class "elm_dd_input" ] [ DD.view fdd Api.Normal flbl fcont ]
+ pViews = List.map (\(i,f) -> Html.map (NField i) (pView f)) plains
+ nViews = List.map (\(i,f) -> Html.map (NField i) (nestFieldView f)) nests
add =
- div [ class "elm_dd_input elm_dd_noarrow", style "width" "13px" ]
+ div [ class "elm_dd_input elm_dd_noarrow" ]
[ DD.view model.add Api.Normal (text "+") <| \() ->
- [ div [ class "advheader" ]
- [ h3 [] [ text "Add filter" ] ]
+ [ div [ class "advheader" ] [ h3 [] [ text "Add filter" ] ]
, ul [] <|
List.map (\(n,f) ->
if f.ftype /= model.ftype || f.title == "" then text ""
@@ -101,15 +114,19 @@ nestView model =
]
]
- 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])
- ]
+ lbl = text <| if model.ntype == NAnd then "And" else "Or"
+ cont () =
+ [ ul []
+ [ li [] [ linkRadio (model.ntype == NAnd) (NType NAnd) [ text "And" ] ]
+ , li [] [ linkRadio (model.ntype == NOr ) (NType NOr ) [ text "Or" ] ]
+ ]
+ ]
+ body =
+ div []
+ <| div [ class "advrow" ] (pViews ++ if List.isEmpty nests then [add] else [])
+ :: nViews
+ ++ (if List.isEmpty nests then [] else [add])
+ in (lbl, cont, body)
@@ -183,9 +200,11 @@ fieldUpdate : Data -> FieldMsg -> Field -> (Data, Field, Cmd FieldMsg)
fieldUpdate dat msg_ (num, dd, model) =
let maps f m = (dat, (num, dd, (f m)), Cmd.none) -- Simple version: update function returns a Model
mapf fm fc (d,m,c) = (d, (num, dd, (fm m)), Cmd.map fc c) -- Full version: update function returns (Data, Model, Cmd)
+ mapc fm fc (d,m,c) = (d, (num, DD.toggle dd False, (fm m)), Cmd.map fc c) -- Full version that also closes the DD (Ugly hack...)
in case (msg_, model) of
+ (FSNest (NType a b), FMNest m) -> mapc FMNest FSNest (nestUpdate dat (NType a b) m)
(FSNest msg, FMNest m) -> mapf FMNest FSNest (nestUpdate dat msg m)
- (FSLang msg, FMLang m) -> maps FMLang (AS.update msg m)
+ (FSLang msg, FMLang m) -> maps FMLang (AS.update msg m)
(FSOLang msg, FMOLang m) -> maps FMOLang (AS.update msg m)
(FSPlatform msg, FMPlatform m) -> maps FMPlatform (AS.update msg m)
(FSLength msg, FMLength m) -> maps FMLength (AS.update msg m)
@@ -193,16 +212,17 @@ fieldUpdate dat msg_ (num, dd, model) =
_ -> (dat, (num, dd, model), Cmd.none)
-fieldView : Field -> Html FieldMsg
+fieldView : Field -> (Html FieldMsg, () -> List (Html FieldMsg), Html FieldMsg)
fieldView (_, dd, model) =
- let v f (lbl,cont) = div [ class "elm_dd_input" ] [ DD.view dd Api.Normal (Html.map f lbl) <| \() -> List.map (Html.map f) (cont ()) ]
+ let vf f (lbl,cont,body) = (Html.map f lbl, \() -> List.map (Html.map f) (cont ()), Html.map f body)
+ vs f (lbl,cont) = vf f (lbl,cont,text "")
in case model of
- FMCustom m -> v FSCustom (text "Unrecognized query", \() -> [text ""]) -- TODO: Display the Query
- FMNest m -> Html.map FSNest (nestView m)
- FMLang m -> v FSLang (AS.langView False m)
- FMOLang m -> v FSOLang (AS.langView True m)
- FMPlatform m -> v FSPlatform (AS.platformView m)
- FMLength m -> v FSLength (AS.lengthView m)
+ FMCustom m -> vs FSCustom (text "Unrecognized query", \() -> [text ""]) -- TODO: Display the Query
+ FMNest m -> vf FSNest (nestView m)
+ FMLang m -> vs FSLang (AS.langView False m)
+ FMOLang m -> vs FSOLang (AS.langView True m)
+ FMPlatform m -> vs FSPlatform (AS.platformView m)
+ FMLength m -> vs FSLength (AS.lengthView m)
fieldToQuery : Field -> Maybe Query
diff --git a/elm/AdvSearch/Main.elm b/elm/AdvSearch/Main.elm
index 6ac77813..c536ef83 100644
--- a/elm/AdvSearch/Main.elm
+++ b/elm/AdvSearch/Main.elm
@@ -95,6 +95,6 @@ update msg model =
view : Model -> Html Msg
view model = div [ class "advsearch" ]
[ input [ type_ "hidden", id "f", name "f", value <| Maybe.withDefault "" <| Maybe.map (\v -> JE.encode 0 (encodeQuery v)) (fieldToQuery model.query) ] []
- , Html.map Field (fieldView model.query)
+ , Html.map Field (nestFieldView model.query)
, input [ type_ "submit", class "submit", value "Search" ] []
]