Commit 68cdd649 authored by Cédric F.'s avatar Cédric F.

Overlay location events

parent b22f20af
Pipeline #5434587 passed with stage
in 1 minute and 36 seconds
...@@ -38,6 +38,7 @@ type alias Event = ...@@ -38,6 +38,7 @@ type alias Event =
, to : Date , to : Date
, color : Color , color : Color
, label : String , label : String
, location : Bool
} }
...@@ -46,6 +47,7 @@ type alias EventForm = ...@@ -46,6 +47,7 @@ type alias EventForm =
, to : String , to : String
, color : String , color : String
, label : String , label : String
, location : Bool
} }
...@@ -60,7 +62,7 @@ initialModel = ...@@ -60,7 +62,7 @@ initialModel =
, hideUnproductiveYears = False , hideUnproductiveYears = False
, events = [] , events = []
, eventFormOpen = -1 , eventFormOpen = -1
, eventForm = EventForm "" "" "" "" , eventForm = EventForm "" "" "" "" False
, modalOpen = False , modalOpen = False
, now = 0 , now = 0
} }
...@@ -105,11 +107,12 @@ type NewEventField ...@@ -105,11 +107,12 @@ type NewEventField
type Msg type Msg
= Tick Time = Tick Time
| NewUrl Navigation.Location | NewUrl Navigation.Location
| NewDateOfBirth String | NewBirthDate String
| NewLifeExpectancy String | NewLifeExpectancy String
| HideUnproductiveYears Bool | HideUnproductiveYears Bool
| ShowEventForm Int | ShowEventForm Int
| UpdateEvent NewEventField String | UpdateEvent NewEventField String
| UpdateEventLocation Bool
| SaveEvent | SaveEvent
| DeleteEvent | DeleteEvent
| NewConfig String | NewConfig String
......
...@@ -79,16 +79,18 @@ encodeEvent event = ...@@ -79,16 +79,18 @@ encodeEvent event =
, ( "to", encodeDate event.to ) , ( "to", encodeDate event.to )
, ( "color", encodeColor event.color ) , ( "color", encodeColor event.color )
, ( "label", Encode.string event.label ) , ( "label", Encode.string event.label )
, ( "location", Encode.bool event.location )
] ]
eventDecoder : Decode.Decoder Event eventDecoder : Decode.Decoder Event
eventDecoder = eventDecoder =
Decode.map4 Event Decode.map5 Event
(Decode.field "from" dateDecoder) (Decode.field "from" dateDecoder)
(Decode.field "to" dateDecoder) (Decode.field "to" dateDecoder)
(Decode.field "color" colorDecoder) (Decode.field "color" colorDecoder)
(Decode.field "label" Decode.string) (Decode.field "label" Decode.string)
(Decode.field "location" Decode.bool)
encodeDate : Date -> Encode.Value encodeDate : Date -> Encode.Value
......
...@@ -39,7 +39,7 @@ update msg model = ...@@ -39,7 +39,7 @@ update msg model =
in in
( newModel, Cmd.none ) ( newModel, Cmd.none )
NewDateOfBirth string -> NewBirthDate string ->
case Date.fromString string of case Date.fromString string of
Ok date -> Ok date ->
let let
...@@ -102,6 +102,7 @@ update msg model = ...@@ -102,6 +102,7 @@ update msg model =
, to = DateExtra.toISOString <| Date.fromTime model.now , to = DateExtra.toISOString <| Date.fromTime model.now
, color = Color.Convert.colorToHex fallbackColor , color = Color.Convert.colorToHex fallbackColor
, label = "" , label = ""
, location = False
} }
Just event -> Just event ->
...@@ -109,6 +110,7 @@ update msg model = ...@@ -109,6 +110,7 @@ update msg model =
, to = DateExtra.toISOString event.to , to = DateExtra.toISOString event.to
, color = Color.Convert.colorToHex event.color , color = Color.Convert.colorToHex event.color
, label = event.label , label = event.label
, location = event.location
} }
in in
( { model | eventFormOpen = newId, eventForm = eventForm }, Cmd.none ) ( { model | eventFormOpen = newId, eventForm = eventForm }, Cmd.none )
...@@ -135,6 +137,16 @@ update msg model = ...@@ -135,6 +137,16 @@ update msg model =
in in
( { model | eventForm = newForm }, Cmd.none ) ( { model | eventForm = newForm }, Cmd.none )
UpdateEventLocation bool ->
let
form =
model.eventForm
newForm =
{ form | location = bool }
in
( { model | eventForm = newForm }, Cmd.none )
SaveEvent -> SaveEvent ->
let let
eventForm = eventForm =
...@@ -148,6 +160,7 @@ update msg model = ...@@ -148,6 +160,7 @@ update msg model =
, color = , color =
Color.Convert.hexToColor eventForm.color |> Maybe.withDefault fallbackColor Color.Convert.hexToColor eventForm.color |> Maybe.withDefault fallbackColor
, label = eventForm.label , label = eventForm.label
, location = eventForm.location
} }
newEvents = newEvents =
......
...@@ -39,7 +39,7 @@ legendWidth = ...@@ -39,7 +39,7 @@ legendWidth =
weekWidth : number weekWidth : number
weekWidth = weekWidth =
9 10
weekBorder : number weekBorder : number
...@@ -208,6 +208,11 @@ week model year week = ...@@ -208,6 +208,11 @@ week model year week =
events = events =
List.filter match model.events List.filter match model.events
|> List.filter (\event -> not event.location)
locations =
List.filter match model.events
|> List.filter .location
colors = colors =
List.map .color events List.map .color events
...@@ -229,9 +234,36 @@ week model year week = ...@@ -229,9 +234,36 @@ week model year week =
firstColor firstColor
(List.drop 1 colors) (List.drop 1 colors)
filled color = square color =
Collage.square weekWidth |> Collage.filled color Collage.square weekWidth |> Collage.filled color
letter =
List.head locations
|> Maybe.andThen
(\location ->
Just
(location.label
|> String.left 1
|> String.toUpper
|> Text.fromString
|> Text.monospace
|> Text.height weekWidth
|> Text.bold
|> Text.color Color.white
|> Collage.text
|> Collage.moveY 1
)
)
filled color =
Collage.group <|
case letter of
Nothing ->
[ square color ]
Just letter ->
[ square color, letter ]
outlined = outlined =
Collage.square (weekWidth - weekBorder) |> Collage.outlined lineStyle Collage.square (weekWidth - weekBorder) |> Collage.outlined lineStyle
in in
......
...@@ -7,7 +7,7 @@ import DateExtra ...@@ -7,7 +7,7 @@ import DateExtra
import Color.Convert import Color.Convert
import Html exposing (..) import Html exposing (..)
import Html.Attributes exposing (..) import Html.Attributes exposing (..)
import Html.Events exposing (onInput, onClick, onSubmit) import Html.Events exposing (..)
import Lifechart.Model exposing (..) import Lifechart.Model exposing (..)
import Lifechart.Serializer as Serializer import Lifechart.Serializer as Serializer
...@@ -67,7 +67,7 @@ links : Model -> List (Html Msg) ...@@ -67,7 +67,7 @@ links : Model -> List (Html Msg)
links model = links model =
let let
demo = demo =
"ewogICJiaXJ0aC1kYXRlIjogIjE5ODgtMDctMjQiLAogICJsaWZlLWV4cGVjdGFuY3kiOiA4MCwKICAia2lkLXVudGlsIjogMTgsCiAgIm9sZC1mcm9tIjogNzAsCiAgImhpZGUtdW5wcm9kdWN0aXZlLXllYXJzIjogZmFsc2UsCiAgImV2ZW50cyI6IFsKICAgIHsKICAgICAgImZyb20iOiAiMjAxMC0wOS0xNCIsCiAgICAgICJ0byI6ICIyMDE0LTAyLTAxIiwKICAgICAgImNvbG9yIjogIiNmNTc5MDAiLAogICAgICAibGFiZWwiOiAiY29sbGVnZSIKICAgIH0sCiAgICB7CiAgICAgICJmcm9tIjogIjIwMTUtMDYtMDEiLAogICAgICAidG8iOiAiMjAxNi0wNS0zMSIsCiAgICAgICJjb2xvciI6ICIjNzNkMjE2IiwKICAgICAgImxhYmVsIjogInRyaXAiCiAgICB9CiAgXQp9Cg==" "ewogICJiaXJ0aC1kYXRlIjogIjE5ODgtMDctMjQiLAogICJsaWZlLWV4cGVjdGFuY3kiOiA4MCwKICAia2lkLXVudGlsIjogMTgsCiAgIm9sZC1mcm9tIjogNzAsCiAgImhpZGUtdW5wcm9kdWN0aXZlLXllYXJzIjogZmFsc2UsCiAgImV2ZW50cyI6IFsKICAgIHsKICAgICAgImZyb20iOiAiMjAxMC0wOS0xNCIsCiAgICAgICJ0byI6ICIyMDE0LTAyLTAxIiwKICAgICAgImNvbG9yIjogIiNmNTc5MDAiLAogICAgICAibGFiZWwiOiAiY29sbGVnZSIsCiAgICAgICJsb2NhdGlvbiI6IGZhbHNlCiAgICB9LAogICAgewogICAgICAiZnJvbSI6ICIyMDE1LTA2LTAxIiwKICAgICAgInRvIjogIjIwMTYtMDUtMzEiLAogICAgICAiY29sb3IiOiAiIzczZDIxNiIsCiAgICAgICJsYWJlbCI6ICJ0cmlwIiwKICAgICAgImxvY2F0aW9uIjogZmFsc2UKICAgIH0KICBdCn0K"
current = current =
Serializer.serialize model Serializer.serialize model
...@@ -89,7 +89,7 @@ config model = ...@@ -89,7 +89,7 @@ config model =
(List.append dateInputAttributes (List.append dateInputAttributes
[ class "form-control form-control-lg" [ class "form-control form-control-lg"
, value model.birthDateString , value model.birthDateString
, onInput NewDateOfBirth , onInput NewBirthDate
] ]
) )
[] []
...@@ -187,7 +187,12 @@ eventForm model index = ...@@ -187,7 +187,12 @@ eventForm model index =
index == 0 index == 0
delete = delete =
a [ href "javascript:void(0)", onClick DeleteEvent ] [ text "delete" ] a
[ class "btn btn-danger"
, href "javascript:void(0)"
, onClick DeleteEvent
]
[ text "Delete" ]
submit = submit =
input input
...@@ -207,6 +212,9 @@ eventForm model index = ...@@ -207,6 +212,9 @@ eventForm model index =
[ submit ] [ submit ]
else else
[ delete, submit ] [ delete, submit ]
webkitHack =
style [ ( "width", "171px" ) ]
in in
li [ class <| "list-group-item" ++ visibility ] li [ class <| "list-group-item" ++ visibility ]
[ Html.form [ onSubmit SaveEvent ] [ Html.form [ onSubmit SaveEvent ]
...@@ -218,6 +226,7 @@ eventForm model index = ...@@ -218,6 +226,7 @@ eventForm model index =
(List.append dateInputAttributes (List.append dateInputAttributes
[ class "form-control" [ class "form-control"
, value event.from , value event.from
, webkitHack
, onInput (UpdateEvent EventFrom) , onInput (UpdateEvent EventFrom)
] ]
) )
...@@ -244,26 +253,51 @@ eventForm model index = ...@@ -244,26 +253,51 @@ eventForm model index =
[ span [ class "input-group-addon" ] [ text "Label" ] [ span [ class "input-group-addon" ] [ text "Label" ]
, input , input
[ class "form-control" [ class "form-control"
, placeholder "label"
, type_ "text" , type_ "text"
, required True , required True
, value event.label , value event.label
, webkitHack
, onInput (UpdateEvent EventLabel) , onInput (UpdateEvent EventLabel)
] ]
[] []
] ]
] ]
, div [ class "col-xs-2" ] , div [ class "col-xs-6" ]
[ input [ label
[ class "form-control" [ class "form-check-inline"
, style [ ( "line-height", "2.5rem" ) ]
]
[ input
[ class "form-check-input"
, type_ "checkbox"
, checked event.location
, onCheck UpdateEventLocation
]
[]
, text " location (overlay)"
]
, input
[ class <|
"float-xs-right"
++ if event.location then
" hidden-xs-up"
else
""
, type_ "color" , type_ "color"
, required True , required True
, value event.color , value event.color
, style [ ( "height", "2.5rem" ) ] , style
[ ( "height", "2.5rem" )
, ( "width", "2.5rem" )
]
, onInput (UpdateEvent EventColor) , onInput (UpdateEvent EventColor)
] ]
[] []
] ]
, div [ class "col-xs-4 text-xs-right" ] actions ]
, div [ class "row form-group" ]
[ div [ class "col-xs-12 text-xs-right" ] actions
] ]
] ]
] ]
...@@ -282,11 +316,30 @@ events model = ...@@ -282,11 +316,30 @@ events model =
, style , style
[ ( "width", "1rem" ) [ ( "width", "1rem" )
, ( "height", "1rem" ) , ( "height", "1rem" )
, ( "line-height", "1rem" )
, ( "font-weight", "bold" )
, ( "color", "#FFFFFF" )
, ( "margin", "3px 0.5rem 0 0" ) , ( "margin", "3px 0.5rem 0 0" )
, ( "background-color", Color.Convert.colorToHex event.color ) , ( "padding"
, if event.location then
"0 0 3px 3px"
else
"0"
)
, ( "background-color"
, if event.location then
"#000000"
else
Color.Convert.colorToHex event.color
)
] ]
] ]
[] [ text <|
if event.location then
String.left 1 event.label
else
""
]
, span [] [ text event.label ] , span [] [ text event.label ]
] ]
, div [ class "col-xs-7 text-xs-right text-muted" ] , div [ class "col-xs-7 text-xs-right text-muted" ]
......
- UI to edit events - birthDate input is glitchy on Firefox/Safari
- responsive - fail if event.from > event.to
- store location / countries
- store goals - store goals
- responsive
...@@ -9,13 +9,15 @@ ...@@ -9,13 +9,15 @@
"from": "2010-09-14", "from": "2010-09-14",
"to": "2014-02-01", "to": "2014-02-01",
"color": "#f57900", "color": "#f57900",
"label": "college" "label": "college",
"location": false
}, },
{ {
"from": "2015-06-01", "from": "2015-06-01",
"to": "2016-05-31", "to": "2016-05-31",
"color": "#73d216", "color": "#73d216",
"label": "trip" "label": "trip",
"location": false
} }
] ]
} }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment