From e0c8c45061d050e404ac96f0b31acb87b6526495 Mon Sep 17 00:00:00 2001 From: Eike Kettner Date: Sat, 13 Jun 2020 22:05:16 +0200 Subject: [PATCH] Hide search menu by default and add search bar to top Adds a search bar to the top of the listing page that is the same as the `All Names` search field in the search menu. Search menu can be toggled as before. --- .../webapp/src/main/elm/Page/Home/Data.elm | 3 +- .../webapp/src/main/elm/Page/Home/Update.elm | 11 ++++ .../webapp/src/main/elm/Page/Home/View.elm | 51 +++++++++++++++++-- 3 files changed, 59 insertions(+), 6 deletions(-) diff --git a/modules/webapp/src/main/elm/Page/Home/Data.elm b/modules/webapp/src/main/elm/Page/Home/Data.elm index 7bb62901..047cd2b1 100644 --- a/modules/webapp/src/main/elm/Page/Home/Data.elm +++ b/modules/webapp/src/main/elm/Page/Home/Data.elm @@ -38,7 +38,7 @@ init _ = , itemListModel = Comp.ItemCardList.init , searchInProgress = False , viewMode = Listing - , menuCollapsed = False + , menuCollapsed = True , searchOffset = 0 , moreAvailable = True , moreInProgress = False @@ -57,6 +57,7 @@ type Msg | ToggleSearchMenu | LoadMore | UpdateThrottle + | SetBasicSearch String type ViewMode diff --git a/modules/webapp/src/main/elm/Page/Home/Update.elm b/modules/webapp/src/main/elm/Page/Home/Update.elm index 592efc6e..2ce18d29 100644 --- a/modules/webapp/src/main/elm/Page/Home/Update.elm +++ b/modules/webapp/src/main/elm/Page/Home/Update.elm @@ -143,6 +143,17 @@ update key flags settings msg model = in withSub ( { model | throttle = newThrottle }, cmd ) + SetBasicSearch str -> + let + m = + SearchMenuMsg (Comp.SearchMenu.SetAllName str) + in + update key flags settings m model + + + +--- Helpers + doSearch : Flags -> UiSettings -> Model -> ( Model, Cmd Msg, Sub Msg ) doSearch flags settings model = diff --git a/modules/webapp/src/main/elm/Page/Home/View.elm b/modules/webapp/src/main/elm/Page/Home/View.elm index 4accf452..8d7628e9 100644 --- a/modules/webapp/src/main/elm/Page/Home/View.elm +++ b/modules/webapp/src/main/elm/Page/Home/View.elm @@ -1,11 +1,12 @@ module Page.Home.View exposing (view) +import Api.Model.ItemSearch import Comp.ItemCardList import Comp.SearchMenu import Data.UiSettings exposing (UiSettings) import Html exposing (..) import Html.Attributes exposing (..) -import Html.Events exposing (onClick) +import Html.Events exposing (onClick, onInput) import Page exposing (Page(..)) import Page.Home.Data exposing (..) @@ -75,16 +76,44 @@ view settings model = [ div [ classList [ ( "invisible hidden", not model.menuCollapsed ) - , ( "ui segment container", True ) + , ( "ui menu container", True ) ] ] [ a - [ class "ui basic large circular label" + [ class "item" , onClick ToggleSearchMenu , href "#" + , title "Open search menu" ] - [ i [ class "search icon" ] [] - , text "Search Menu…" + [ i [ class "angle left icon" ] [] + , i [ class "icons" ] + [ i [ class "grey bars icon" ] [] + , i [ class "bottom left corner search icon" ] [] + , if hasMoreSearch model then + i [ class "top right blue corner circle icon" ] [] + + else + span [ class "hidden invisible" ] [] + ] + ] + , div [ class "ui category search item" ] + [ div [ class "ui transparent icon input" ] + [ input + [ type_ "text" + , placeholder "Basic search…" + , onInput SetBasicSearch + , Maybe.map value model.searchMenuModel.allNameModel + |> Maybe.withDefault (value "") + ] + [] + , i + [ classList + [ ( "search link icon", not model.searchInProgress ) + , ( "loading spinner icon", model.searchInProgress ) + ] + ] + [] + ] ] ] , case model.viewMode of @@ -126,3 +155,15 @@ view settings model = ] ] ] + + +hasMoreSearch : Model -> Bool +hasMoreSearch model = + let + is = + Comp.SearchMenu.getItemSearch model.searchMenuModel + + is_ = + { is | allNames = Nothing } + in + is_ /= Api.Model.ItemSearch.empty