Prepare ui to handle content search

This commit is contained in:
Eike Kettner 2020-06-21 22:29:58 +02:00
parent 3d82e03a8a
commit af4522c0a7
6 changed files with 139 additions and 51 deletions

View File

@ -170,7 +170,7 @@ viewLogin model =
viewHome : Model -> Html Msg viewHome : Model -> Html Msg
viewHome model = viewHome model =
Html.map HomeMsg (Page.Home.View.view model.uiSettings model.homeModel) Html.map HomeMsg (Page.Home.View.view model.flags model.uiSettings model.homeModel)
menuEntry : Model -> Page -> List (Html Msg) -> Html Msg menuEntry : Model -> Page -> List (Html Msg) -> Html Msg

View File

@ -9,6 +9,7 @@ module Comp.FixedDropdown exposing
, update , update
, view , view
, viewString , viewString
, viewStyled
) )
import Html exposing (..) import Html exposing (..)
@ -69,11 +70,12 @@ update msg model =
( model, Just item.id ) ( model, Just item.id )
view : Maybe (Item a) -> Model a -> Html (Msg a) viewStyled : String -> Maybe (Item a) -> Model a -> Html (Msg a)
view selected model = viewStyled classes selected model =
div div
[ classList [ classList
[ ( "ui selection dropdown", True ) [ ( "ui selection dropdown", True )
, ( classes, True )
, ( "open", model.menuOpen ) , ( "open", model.menuOpen )
] ]
, onClick ToggleMenu , onClick ToggleMenu
@ -102,6 +104,11 @@ view selected model =
] ]
view : Maybe (Item a) -> Model a -> Html (Msg a)
view selected model =
viewStyled "" selected model
viewString : Maybe String -> Model String -> Html (Msg String) viewString : Maybe String -> Model String -> Html (Msg String)
viewString selected model = viewString selected model =
view (Maybe.map (\s -> Item s s) selected) model view (Maybe.map (\s -> Item s s) selected) model

View File

@ -504,8 +504,8 @@ update flags settings msg model =
-- View -- View
view : UiSettings -> Model -> Html Msg view : Flags -> UiSettings -> Model -> Html Msg
view settings model = view flags settings model =
let let
formHeader icon headline = formHeader icon headline =
div [ class "ui small dividing header" ] div [ class "ui small dividing header" ]
@ -532,7 +532,12 @@ view settings model =
] ]
] ]
] ]
, div [ class "field" ] , div
[ classList
[ ( "field", True )
, ( "invisible hidden", not flags.config.fullTextSearchEnabled )
]
]
[ label [] [ text "Content Search" ] [ label [] [ text "Content Search" ]
, input , input
[ type_ "text" [ type_ "text"

View File

@ -1,15 +1,18 @@
module Page.Home.Data exposing module Page.Home.Data exposing
( Model ( Model
, Msg(..) , Msg(..)
, SearchType(..)
, ViewMode(..) , ViewMode(..)
, doSearchCmd , doSearchCmd
, init , init
, itemNav , itemNav
, resultsBelowLimit , resultsBelowLimit
, searchTypeString
) )
import Api import Api
import Api.Model.ItemLightList exposing (ItemLightList) import Api.Model.ItemLightList exposing (ItemLightList)
import Comp.FixedDropdown
import Comp.ItemCardList import Comp.ItemCardList
import Comp.SearchMenu import Comp.SearchMenu
import Data.Flags exposing (Flags) import Data.Flags exposing (Flags)
@ -29,11 +32,28 @@ type alias Model =
, moreAvailable : Bool , moreAvailable : Bool
, moreInProgress : Bool , moreInProgress : Bool
, throttle : Throttle Msg , throttle : Throttle Msg
, searchTypeDropdown : Comp.FixedDropdown.Model SearchType
, searchType : SearchType
} }
init : Flags -> Model init : Flags -> Model
init _ = init flags =
let
searchTypeOptions =
if flags.config.fullTextSearchEnabled then
[ BasicSearch, ContentSearch, ContentOnlySearch ]
else
[ BasicSearch ]
defaultSearchType =
if flags.config.fullTextSearchEnabled then
ContentSearch
else
BasicSearch
in
{ searchMenuModel = Comp.SearchMenu.init { searchMenuModel = Comp.SearchMenu.init
, itemListModel = Comp.ItemCardList.init , itemListModel = Comp.ItemCardList.init
, searchInProgress = False , searchInProgress = False
@ -43,6 +63,10 @@ init _ =
, moreAvailable = True , moreAvailable = True
, moreInProgress = False , moreInProgress = False
, throttle = Throttle.create 1 , throttle = Throttle.create 1
, searchTypeDropdown =
Comp.FixedDropdown.initMap searchTypeString
searchTypeOptions
, searchType = defaultSearchType
} }
@ -58,7 +82,26 @@ type Msg
| LoadMore | LoadMore
| UpdateThrottle | UpdateThrottle
| SetBasicSearch String | SetBasicSearch String
| SetFulltextSearch String | SearchTypeMsg (Comp.FixedDropdown.Msg SearchType)
type SearchType
= BasicSearch
| ContentSearch
| ContentOnlySearch
searchTypeString : SearchType -> String
searchTypeString st =
case st of
BasicSearch ->
"All Names"
ContentSearch ->
"Contents"
ContentOnlySearch ->
"Contents Only"
type ViewMode type ViewMode

View File

@ -1,6 +1,7 @@
module Page.Home.Update exposing (update) module Page.Home.Update exposing (update)
import Browser.Navigation as Nav import Browser.Navigation as Nav
import Comp.FixedDropdown
import Comp.ItemCardList import Comp.ItemCardList
import Comp.SearchMenu import Comp.SearchMenu
import Data.Flags exposing (Flags) import Data.Flags exposing (Flags)
@ -150,17 +151,31 @@ update key flags settings msg model =
SetBasicSearch str -> SetBasicSearch str ->
let let
m = smMsg =
case model.searchType of
BasicSearch ->
SearchMenuMsg (Comp.SearchMenu.SetAllName str) SearchMenuMsg (Comp.SearchMenu.SetAllName str)
in
update key flags settings m model
SetFulltextSearch str -> ContentSearch ->
let
m =
SearchMenuMsg (Comp.SearchMenu.SetFulltext str) SearchMenuMsg (Comp.SearchMenu.SetFulltext str)
ContentOnlySearch ->
Debug.todo "implement"
in in
update key flags settings m model update key flags settings smMsg model
SearchTypeMsg lm ->
let
( sm, mv ) =
Comp.FixedDropdown.update lm model.searchTypeDropdown
in
withSub
( { model
| searchTypeDropdown = sm
, searchType = Maybe.withDefault model.searchType mv
}
, Cmd.none
)

View File

@ -1,8 +1,10 @@
module Page.Home.View exposing (view) module Page.Home.View exposing (view)
import Api.Model.ItemSearch import Api.Model.ItemSearch
import Comp.FixedDropdown
import Comp.ItemCardList import Comp.ItemCardList
import Comp.SearchMenu import Comp.SearchMenu
import Data.Flags exposing (Flags)
import Data.UiSettings exposing (UiSettings) import Data.UiSettings exposing (UiSettings)
import Html exposing (..) import Html exposing (..)
import Html.Attributes exposing (..) import Html.Attributes exposing (..)
@ -11,8 +13,8 @@ import Page exposing (Page(..))
import Page.Home.Data exposing (..) import Page.Home.Data exposing (..)
view : UiSettings -> Model -> Html Msg view : Flags -> UiSettings -> Model -> Html Msg
view settings model = view flags settings model =
div [ class "home-page ui padded grid" ] div [ class "home-page ui padded grid" ]
[ div [ div
[ classList [ classList
@ -61,7 +63,7 @@ view settings model =
] ]
] ]
, div [ class "ui attached fluid segment" ] , div [ class "ui attached fluid segment" ]
[ Html.map SearchMenuMsg (Comp.SearchMenu.view settings model.searchMenuModel) [ Html.map SearchMenuMsg (Comp.SearchMenu.view flags settings model.searchMenuModel)
] ]
] ]
, div , div
@ -73,7 +75,7 @@ view settings model =
, ( "item-card-list", True ) , ( "item-card-list", True )
] ]
] ]
[ viewSearchBar model [ viewSearchBar flags model
, case model.viewMode of , case model.viewMode of
Listing -> Listing ->
Html.map ItemCardListMsg Html.map ItemCardListMsg
@ -115,12 +117,36 @@ view settings model =
] ]
viewSearchBar : Model -> Html Msg viewSearchBar : Flags -> Model -> Html Msg
viewSearchBar model = viewSearchBar flags model =
let
searchTypeItem =
Comp.FixedDropdown.Item
model.searchType
(searchTypeString model.searchType)
searchInput =
case model.searchType of
BasicSearch ->
model.searchMenuModel.allNameModel
ContentSearch ->
model.searchMenuModel.fulltextModel
ContentOnlySearch ->
Debug.todo "implement"
searchTypeClass =
if flags.config.fullTextSearchEnabled then
"compact"
else
"hidden invisible"
in
div div
[ classList [ classList
[ ( "invisible hidden", not model.menuCollapsed ) [ ( "invisible hidden", not model.menuCollapsed )
, ( "ui menu container", True ) , ( "ui secondary menu container", True )
] ]
] ]
[ a [ a
@ -141,16 +167,26 @@ viewSearchBar model =
] ]
] ]
, div [ class "ui category search item" ] , div [ class "ui category search item" ]
[ div [ class "ui transparent icon input" ] [ div [ class "ui action input" ]
[ input [ input
[ type_ "text" [ type_ "text"
, placeholder "Basic search" , placeholder "Search "
, onInput SetBasicSearch , onInput SetBasicSearch
, Maybe.map value model.searchMenuModel.allNameModel , Maybe.map value searchInput
|> Maybe.withDefault (value "") |> Maybe.withDefault (value "")
] ]
[] []
, i , Html.map SearchTypeMsg
(Comp.FixedDropdown.viewStyled searchTypeClass
(Just searchTypeItem)
model.searchTypeDropdown
)
, a
[ class "ui basic icon button"
, href "#"
, onClick DoSearch
]
[ i
[ classList [ classList
[ ( "search link icon", not model.searchInProgress ) [ ( "search link icon", not model.searchInProgress )
, ( "loading spinner icon", model.searchInProgress ) , ( "loading spinner icon", model.searchInProgress )
@ -159,24 +195,6 @@ viewSearchBar model =
[] []
] ]
] ]
, div [ class "ui category search item" ]
[ div [ class "ui transparent icon input" ]
[ input
[ type_ "text"
, placeholder "Fulltext search"
, onInput SetFulltextSearch
, Maybe.map value model.searchMenuModel.fulltextModel
|> Maybe.withDefault (value "")
]
[]
, i
[ classList
[ ( "search link icon", not model.searchInProgress )
, ( "loading spinner icon", model.searchInProgress )
]
]
[]
]
] ]
] ]