Prepare for drag-drop items into tags in list view

This commit is contained in:
Eike Kettner 2020-08-08 14:34:26 +02:00
parent b1ef0c55af
commit f86f644365
3 changed files with 68 additions and 31 deletions

View File

@ -356,8 +356,8 @@ updateDrop ddm flags settings msg model =
TagSelectMsg m -> TagSelectMsg m ->
let let
( m_, sel ) = ( m_, sel, ddd ) =
Comp.TagSelect.update m model.tagSelectModel Comp.TagSelect.updateDrop ddm m model.tagSelectModel
in in
{ model = { model =
{ model { model
@ -366,7 +366,7 @@ updateDrop ddm flags settings msg model =
} }
, cmd = Cmd.none , cmd = Cmd.none
, stateChange = sel /= model.tagSelection , stateChange = sel /= model.tagSelection
, dragDrop = DD.DragDropData ddm Nothing , dragDrop = ddd
} }
DirectionMsg m -> DirectionMsg m ->
@ -643,7 +643,7 @@ viewDrop ddd flags settings model =
] ]
] ]
, div [ class segmentClass ] , div [ class segmentClass ]
[ Html.map TagSelectMsg (Comp.TagSelect.viewTags settings model.tagSelectModel) [ Html.map TagSelectMsg (Comp.TagSelect.viewTagsDrop ddd.model settings model.tagSelectModel)
, Html.map TagSelectMsg (Comp.TagSelect.viewCats settings model.tagSelectModel) , Html.map TagSelectMsg (Comp.TagSelect.viewCats settings model.tagSelectModel)
, Html.map FolderSelectMsg , Html.map FolderSelectMsg
(Comp.FolderSelect.viewDrop ddd.model settings.searchMenuFolderCount model.folderList) (Comp.FolderSelect.viewDrop ddd.model settings.searchMenuFolderCount model.folderList)

View File

@ -6,10 +6,12 @@ module Comp.TagSelect exposing
, emptySelection , emptySelection
, init , init
, update , update
, view1 , updateDrop
, view2 , view
, viewCats , viewCats
, viewDrop
, viewTags , viewTags
, viewTagsDrop
) )
import Api.Model.TagCount exposing (TagCount) import Api.Model.TagCount exposing (TagCount)
@ -20,6 +22,7 @@ import Html exposing (..)
import Html.Attributes exposing (..) import Html.Attributes exposing (..)
import Html.Events exposing (onClick) import Html.Events exposing (onClick)
import Util.ExpandCollapse import Util.ExpandCollapse
import Util.ItemDragDrop as DD
type alias Model = type alias Model =
@ -82,6 +85,7 @@ type Msg
| ToggleCat String | ToggleCat String
| ToggleExpandTags | ToggleExpandTags
| ToggleExpandCats | ToggleExpandCats
| TagDDMsg DD.Msg
type alias Selection = type alias Selection =
@ -99,6 +103,15 @@ emptySelection =
update : Msg -> Model -> ( Model, Selection ) update : Msg -> Model -> ( Model, Selection )
update msg model = update msg model =
let
( m, s, _ ) =
updateDrop DD.init msg model
in
( m, s )
updateDrop : DD.Model -> Msg -> Model -> ( Model, Selection, DD.DragDropData )
updateDrop ddm msg model =
case msg of case msg of
ToggleTag id -> ToggleTag id ->
let let
@ -108,7 +121,7 @@ update msg model =
model_ = model_ =
{ model | selectedTags = next } { model | selectedTags = next }
in in
( model_, getSelection model_ ) ( model_, getSelection model_, DD.DragDropData ddm Nothing )
ToggleCat name -> ToggleCat name ->
let let
@ -118,18 +131,27 @@ update msg model =
model_ = model_ =
{ model | selectedCats = next } { model | selectedCats = next }
in in
( model_, getSelection model_ ) ( model_, getSelection model_, DD.DragDropData ddm Nothing )
ToggleExpandTags -> ToggleExpandTags ->
( { model | expandedTags = not model.expandedTags } ( { model | expandedTags = not model.expandedTags }
, getSelection model , getSelection model
, DD.DragDropData ddm Nothing
) )
ToggleExpandCats -> ToggleExpandCats ->
( { model | expandedCats = not model.expandedCats } ( { model | expandedCats = not model.expandedCats }
, getSelection model , getSelection model
, DD.DragDropData ddm Nothing
) )
TagDDMsg lm ->
let
ddd =
DD.update lm ddm
in
( model, getSelection model, ddd )
updateSelection : String -> Dict String Bool -> Dict String Bool updateSelection : String -> Dict String Bool -> Dict String Bool
updateSelection id selected = updateSelection id selected =
@ -211,7 +233,12 @@ catState model name =
viewTags : UiSettings -> Model -> Html Msg viewTags : UiSettings -> Model -> Html Msg
viewTags settings model = viewTags =
viewTagsDrop DD.init
viewTagsDrop : DD.Model -> UiSettings -> Model -> Html Msg
viewTagsDrop ddm settings model =
div [ class "ui list" ] div [ class "ui list" ]
[ div [ class "item" ] [ div [ class "item" ]
[ I.tagIcon "" [ I.tagIcon ""
@ -220,7 +247,7 @@ viewTags settings model =
[ text "Tags" [ text "Tags"
] ]
, div [ class "ui relaxed list" ] , div [ class "ui relaxed list" ]
(renderTagItems settings model) (renderTagItems ddm settings model)
] ]
] ]
] ]
@ -242,8 +269,13 @@ viewCats settings model =
] ]
view1 : UiSettings -> Model -> Html Msg view : UiSettings -> Model -> Html Msg
view1 settings model = view =
viewDrop DD.init
viewDrop : DD.Model -> UiSettings -> Model -> Html Msg
viewDrop ddm settings model =
div [ class "ui list" ] div [ class "ui list" ]
[ div [ class "item" ] [ div [ class "item" ]
[ I.tagIcon "" [ I.tagIcon ""
@ -252,7 +284,7 @@ view1 settings model =
[ text "Tags" [ text "Tags"
] ]
, div [ class "ui relaxed list" ] , div [ class "ui relaxed list" ]
(renderTagItems settings model) (renderTagItems ddm settings model)
] ]
] ]
, div [ class "item" ] , div [ class "item" ]
@ -268,15 +300,8 @@ view1 settings model =
] ]
view2 : UiSettings -> Model -> List (Html Msg) renderTagItems : DD.Model -> UiSettings -> Model -> List (Html Msg)
view2 settings model = renderTagItems ddm settings model =
[ viewTags settings model
, viewCats settings model
]
renderTagItems : UiSettings -> Model -> List (Html Msg)
renderTagItems settings model =
let let
tags = tags =
model.all model.all
@ -297,13 +322,13 @@ renderTagItems settings model =
ToggleExpandTags ToggleExpandTags
in in
if max <= 0 then if max <= 0 then
List.map (viewTagItem settings model) model.all List.map (viewTagItem ddm settings model) model.all
else if model.expandedTags then else if model.expandedTags then
List.map (viewTagItem settings model) model.all ++ cps List.map (viewTagItem ddm settings model) model.all ++ cps
else else
List.map (viewTagItem settings model) (List.take max model.all) ++ exp List.map (viewTagItem ddm settings model) (List.take max model.all) ++ exp
renderCatItems : UiSettings -> Model -> List (Html Msg) renderCatItems : UiSettings -> Model -> List (Html Msg)
@ -371,8 +396,8 @@ viewCategoryItem settings model cat =
] ]
viewTagItem : UiSettings -> Model -> TagCount -> Html Msg viewTagItem : DD.Model -> UiSettings -> Model -> TagCount -> Html Msg
viewTagItem settings model tag = viewTagItem ddm settings model tag =
let let
state = state =
tagState model tag.tag.id tagState model tag.tag.id
@ -382,12 +407,20 @@ viewTagItem settings model tag =
icon = icon =
getIcon state color I.tagIcon getIcon state color I.tagIcon
dropActive =
DD.getDropId ddm == Just (DD.Tag tag.tag.id)
in in
a a
[ class "item" ([ classList
[ ( "item", True )
, ( "current-drop-target", dropActive )
]
, href "#" , href "#"
, onClick (ToggleTag tag.tag.id) , onClick (ToggleTag tag.tag.id)
] ]
++ DD.droppable TagDDMsg (DD.Tag tag.tag.id)
)
[ icon [ icon
, div [ class "content" ] , div [ class "content" ]
[ div [ div

View File

@ -77,6 +77,10 @@ makeUpdateCmd flags receive droppedMaybe =
Api.setFolder flags dropped.itemId (OptionalId Nothing) receive Api.setFolder flags dropped.itemId (OptionalId Nothing) receive
Tag _ -> Tag _ ->
let
_ =
Debug.log "dropped" dropped
in
Cmd.none Cmd.none
Nothing -> Nothing ->