Fix too long event titles in day view.

This commit is contained in:
Vidir Valberg Gudmundsson 2017-08-21 08:44:54 +02:00
parent 659cfd4a37
commit 6a413cdd3c
2 changed files with 49 additions and 5 deletions

View File

@ -15,7 +15,7 @@ import Date exposing (Date)
-- External modules
import Html exposing (Html, text, div, ul, li, span, i, h4, table, p, a)
import Html.Attributes exposing (classList, style, href)
import Html.Attributes exposing (classList, style, href, alt, title)
import Date.Extra
import List.Extra
@ -225,6 +225,9 @@ eventInstanceBlock offset numberInGroup ( eventInstance, lefts ) =
width =
100 / (toFloat (numberInGroup + 1))
timeInString =
(Date.Extra.toFormattedString "HH:mm" eventInstance.from)
in
a
[ classList
@ -241,10 +244,27 @@ eventInstanceBlock offset numberInGroup ( eventInstance, lefts ) =
]
, href <| routeToString <| EventRoute eventInstance.eventSlug
]
[ p [] [ text ((Date.Extra.toFormattedString "HH:mm" eventInstance.from) ++ " " ++ eventInstance.title) ]
[ p
[ title <|
timeInString
++ " "
++ eventInstance.title
]
[ text <| timeInString ++ " " ++ (ellipsis 20 eventInstance.title) ]
]
ellipsis : Int -> String -> String
ellipsis cutOff value =
if String.length value > cutOff then
(value
|> String.dropRight ((String.length value) - cutOff)
)
++ "..."
else
value
gutter : List Date -> Html Msg
gutter hours =
div

View File

@ -15162,6 +15162,18 @@ var _user$project$Views_DayPicker$dayPicker = function (model) {
});
};
var _user$project$Views_DayView$ellipsis = F2(
function (cutOff, value) {
return (_elm_lang$core$Native_Utils.cmp(
_elm_lang$core$String$length(value),
cutOff) > 0) ? A2(
_elm_lang$core$Basics_ops['++'],
A2(
_elm_lang$core$String$dropRight,
_elm_lang$core$String$length(value) - cutOff,
value),
'...') : value;
});
var _user$project$Views_DayView$px = function (value) {
return A2(
_elm_lang$core$Basics_ops['++'],
@ -15174,6 +15186,7 @@ var _user$project$Views_DayView$eventInstanceBlock = F3(
function (offset, numberInGroup, _p0) {
var _p1 = _p0;
var _p2 = _p1._0;
var timeInString = A2(_justinmimbs$elm_date_extra$Date_Extra$toFormattedString, 'HH:mm', _p2.from);
var width = 100 / _elm_lang$core$Basics$toFloat(numberInGroup + 1);
var minutes = _elm_lang$core$Date$minute(_p2.from);
var hourInMinutes = _elm_lang$core$Date$hour(_p2.from) * 60;
@ -15262,14 +15275,25 @@ var _user$project$Views_DayView$eventInstanceBlock = F3(
ctor: '::',
_0: A2(
_elm_lang$html$Html$p,
{ctor: '[]'},
{
ctor: '::',
_0: _elm_lang$html$Html_Attributes$title(
A2(
_elm_lang$core$Basics_ops['++'],
timeInString,
A2(_elm_lang$core$Basics_ops['++'], ' ', _p2.title))),
_1: {ctor: '[]'}
},
{
ctor: '::',
_0: _elm_lang$html$Html$text(
A2(
_elm_lang$core$Basics_ops['++'],
A2(_justinmimbs$elm_date_extra$Date_Extra$toFormattedString, 'HH:mm', _p2.from),
A2(_elm_lang$core$Basics_ops['++'], ' ', _p2.title))),
timeInString,
A2(
_elm_lang$core$Basics_ops['++'],
' ',
A2(_user$project$Views_DayView$ellipsis, 20, _p2.title)))),
_1: {ctor: '[]'}
}),
_1: {ctor: '[]'}