List channel as button group (#98)

also fixes problem showing result when query is empty string

fixes #92
This commit is contained in:
Rok Garbas 2020-06-12 12:57:47 +02:00 committed by GitHub
parent 2daa4b0d8b
commit 6992416c5a
Failed to generate hash of commit
3 changed files with 58 additions and 36 deletions

View file

@ -114,7 +114,7 @@ submitQuery :
submitQuery old ( new, cmd ) = submitQuery old ( new, cmd ) =
let let
triggerSearch _ newModel msg makeRequest = triggerSearch _ newModel msg makeRequest =
if newModel.query /= Nothing then if newModel.query /= Nothing && newModel.query /= Just "" then
( new ( new
, Cmd.batch , Cmd.batch
[ cmd [ cmd

View file

@ -36,7 +36,8 @@ import Html
) )
import Html.Attributes import Html.Attributes
exposing exposing
( class ( attribute
, class
, classList , classList
, href , href
, type_ , type_
@ -163,16 +164,25 @@ update path navKey msg model =
ChannelChange channel -> ChannelChange channel ->
( { model ( { model
| channel = channel | channel = channel
, result = RemoteData.Loading , result =
if model.query == Nothing || model.query == Just "" then
RemoteData.NotAsked
else
RemoteData.Loading
} }
, createUrl , if model.query == Nothing || model.query == Just "" then
path Cmd.none
channel
model.query else
model.show createUrl
0 path
model.size channel
|> Browser.Navigation.pushUrl navKey model.query
model.show
0
model.size
|> Browser.Navigation.pushUrl navKey
) )
QueryInput query -> QueryInput query ->
@ -321,7 +331,36 @@ view path title model viewSuccess outMsg =
[ h1 [ class "page-header" ] [ text title ] [ h1 [ class "page-header" ] [ text title ]
, div [ class "search-input" ] , div [ class "search-input" ]
[ form [ onSubmit (outMsg QuerySubmit) ] [ form [ onSubmit (outMsg QuerySubmit) ]
[ div [ class "input-append" ] [ p
[]
[ strong []
[ text "Channel: " ]
, div
[ class "btn-group"
, attribute "data-toggle" "buttons-radio"
]
(List.filterMap
(\channel_id ->
channelDetailsFromId channel_id
|> Maybe.map
(\channel ->
button
[ type_ "button"
, classList
[ ( "btn", True )
, ( "active", channel.id == model.channel )
]
, onClick <| outMsg (ChannelChange channel.id)
]
[ text channel.title ]
)
)
channels
)
]
, p
[ class "input-append"
]
[ input [ input
[ type_ "text" [ type_ "text"
, onInput (\x -> outMsg (QueryInput x)) , onInput (\x -> outMsg (QueryInput x))
@ -332,27 +371,6 @@ view path title model viewSuccess outMsg =
[ button [ class "btn" ] [ text "Search" ] [ button [ class "btn" ] [ text "Search" ]
] ]
] ]
, span []
[ strong []
[ text " in " ]
, select
[ onInput (\x -> outMsg (ChannelChange x)) ]
(List.filterMap
(\channel_id ->
channelDetailsFromId channel_id
|> Maybe.map
(\channel ->
option
[ value channel.id
]
[ text channel.title ]
)
)
channels
)
, strong []
[ text " channel." ]
]
] ]
] ]
, case model.result of , case model.result of

View file

@ -35,14 +35,18 @@ header .navbar.navbar-static-top {
.input-append input { .input-append input {
font-size: 24px; font-size: 24px;
height: 40px; height: 40px;
width: 10em; width: auto;
max-width: 15em;
} }
.input-append button { .input-append button {
font-size: 24px; font-size: 24px;
height: 50px; height: 50px;
min-width: 4em;
} }
select { form > p > strong {
width: 100px; vertical-align: middle;
font-size: 1.2em;
margin-left: 0.2em;
} }
} }
.search-result { .search-result {