Skip to content

Commit 863df82

Browse files
marksie1988marksie1988
authored
Merge pull request #1061 from totaldebug/984-option_to_set_title_length
feat: add option to set title length
2 parents a712608 + ef84fba commit 863df82

File tree

19 files changed

+203
-71
lines changed

19 files changed

+203
-71
lines changed

‎dist/atomic-calendar-revive.js‎

Lines changed: 35 additions & 35 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎docs/configuration/language.rst‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@ The Configuration editor supports the following locales:
3535
de German
3636
en English
3737
et Estonian
38+
fi Finnish
3839
fr French
3940
nb Norwegian
4041
sl Slovenian

‎docs/configuration/main.rst‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,4 +40,5 @@ Main Options
4040
compactMode boolean optional v7.3.0 ``false`` if set true will squash text down to allow for much more compact design
4141
hoursOnSameLine boolean optional v7.3.0 ``false`` if set true will move hours to show on the same line as the summary. NOTE using other options can mess up this style
4242
language string optional unknown Not recommended to use, but can set the language code e.g. "gb" / "es"
43+
titleLength integer optional v7.4.0 Sets the maximum length of the event titles
4344
========================= ========= =============== ========== ==========================================================================================================================================================================================================================

‎package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "atomic-calendar-revive",
3-
"version": "7.3.1",
4-
"editor_version": "2.2.2",
3+
"version": "7.4.0",
4+
"editor_version": "2.3.0",
55
"description": "Calendar Card for Home Assistant",
66
"main": "atomic-calendar-revive.js",
77
"scripts": {

‎src/defaults.ts‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -110,4 +110,7 @@ export default {
110110
showDescription: false,
111111
showEventDate: true,
112112
showDatePerEvent: false,
113+
114+
titleLength: 0,
115+
descLength: 0
113116
};

‎src/index-editor.ts‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -114,6 +114,14 @@ export class AtomicCalendarReviveEditor extends ScopedRegistryHost(LitElement) i
114114
return this._config?.name || '';
115115
}
116116

117+
get _titleLength(): number {
118+
return this._config?.titleLength || 0;
119+
}
120+
121+
get _descLength(): number {
122+
return this._config?.descLength || 0;
123+
}
124+
117125
get _firstDayOfWeek(): number {
118126
return this._config?.firstDayOfWeek || 1;
119127
}
@@ -462,6 +470,26 @@ export class AtomicCalendarReviveEditor extends ScopedRegistryHost(LitElement) i
462470
></mwc-textfield>
463471
</div>
464472
</div>
473+
<div class="side-by-side">
474+
<div>
475+
<mwc-textfield
476+
label="${localize('main.fields.titleLength')}"
477+
type="number"
478+
.value=${this._titleLength}
479+
.configValue=${'titleLength'}
480+
@input=${this._valueChanged}
481+
></mwc-textfield>
482+
</div>
483+
<div>
484+
<mwc-textfield
485+
label="${localize('main.fields.descLength')}"
486+
type="number"
487+
.value=${this._descLength}
488+
.configValue=${'descLength'}
489+
@input=${this._valueChanged}
490+
></mwc-textfield>
491+
</div>
492+
</div>
465493
<div class="side-by-side">
466494
<div>
467495
<mwc-textfield

‎src/lib/calendarMode.html.ts‎

Lines changed: 13 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -43,15 +43,20 @@ export function getCalendarTitleHTML(config: atomicCardConfig, event: EventClass
4343
const titleColor: string =
4444
typeof event.entityConfig.color != 'undefined' ? event.entityConfig.color : config.eventTitleColor;
4545
const textDecoration: string = event.isDeclined ? 'line-through' : 'none';
46+
let {title} = event;
47+
48+
if (!isHtml(event.title) && config.titleLength && event.title.length > config.titleLength) {
49+
title = event.title.slice(0, config.titleLength);
50+
}
4651

4752
if (config.disableCalEventLink || event.htmlLink === null) {
48-
return html`<span style="text-decoration: ${textDecoration};color: ${titleColor}">${event.title} </span>`;
49-
} else {
50-
return html`<a
53+
return html`<span style="text-decoration: ${textDecoration};color: ${titleColor}">${title} </span>`;
54+
} else {
55+
return html`<a
5156
href="${event.htmlLink}"
5257
style="text-decoration: ${textDecoration};color: ${titleColor}"
5358
target="${config.linkTarget}"
54-
>${event.title}
59+
>${title}
5560
</a>`;
5661
}
5762
}
@@ -64,18 +69,18 @@ export function getCalendarTitleHTML(config: atomicCardConfig, event: EventClass
6469
*/
6570
export function getCalendarDescriptionHTML(config: atomicCardConfig, event: EventClass) {
6671
if (event.description) {
67-
let desc = event.description;
72+
let {description} = event;
6873
if (isHtml(event.description)) {
69-
desc = unsafeHTML(event.description);
74+
description = unsafeHTML(event.description);
7075
}
7176
if (!isHtml(event.description) && config.descLength && event.description.length > config.descLength) {
72-
desc = event.description.slice(0, config.descLength);
77+
description = event.description.slice(0, config.descLength);
7378
}
7479
return html`<div
7580
class="calDescription"
7681
style="--description-color: ${config.descColor}; --description-size: ${config.descSize}%"
7782
>
78-
- ${desc}
83+
- ${description}
7984
</div>`;
8085
}
8186
}

‎src/lib/eventMode.html.ts‎

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -28,23 +28,27 @@ export function getEventIcon(config: atomicCardConfig, event: EventClass) {
2828
* @returns TemplateResult containing title HTML
2929
*/
3030
export function getTitleHTML(config: atomicCardConfig, event: EventClass) {
31-
const titletext: string = event.title;
3231
const titleColor: string =
3332
typeof event.entityConfig.color != 'undefined' ? event.entityConfig.color : config.eventTitleColor;
3433
const dayClassEventRunning = event.isRunning ? `event-titleRunning` : `event-title`;
3534
const textDecoration: string = event.isDeclined ? 'line-through' : 'none';
35+
let {title} = event;
36+
37+
if (!isHtml(event.title) && config.titleLength && event.title.length > config.titleLength) {
38+
title = event.title.slice(0, config.titleLength);
39+
}
3640

3741
if (config.disableEventLink || event.htmlLink == 'undefined' || event.htmlLink === null) {
3842
return html`
3943
<div style="text-decoration: ${textDecoration};color: ${titleColor}">
40-
<div class="${dayClassEventRunning}" style="--event-title-size: ${config.eventTitleSize}%">${getEventIcon(config, event)} ${titletext} ${getMultiDayEventParts(config, event)} </div>
44+
<div class="${dayClassEventRunning}" style="--event-title-size: ${config.eventTitleSize}%">${getEventIcon(config, event)} ${title} ${getMultiDayEventParts(config, event)} </div>
4145
</div>
4246
`;
4347
} else {
4448
return html`
4549
<a href="${event.htmlLink}" style="text-decoration: ${textDecoration};" target="${config.linkTarget}">
4650
<div style="color: ${titleColor}">
47-
<div class="${dayClassEventRunning}" style="--event-title-size: ${config.eventTitleSize}%">${getEventIcon(config, event)} <span>${titletext} ${getMultiDayEventParts(config, event)} </span></div>
51+
<div class="${dayClassEventRunning}" style="--event-title-size: ${config.eventTitleSize}%">${getEventIcon(config, event)} <span>${title} ${getMultiDayEventParts(config, event)} </span></div>
4852
</div>
4953
</a>
5054
`;
@@ -124,7 +128,7 @@ export function getLocationHTML(config: atomicCardConfig, event: EventClass) {
124128
* @returns TemplateResult with current week html
125129
*/
126130
export function getWeekNumberHTML(day: [EventClass], currentWeek: number) {
127-
var currentWeekHTML = html``
131+
let currentWeekHTML = html``
128132
if (currentWeek != day[0].startDateTime.week()) {
129133
currentWeek = day[0].startDateTime.week();
130134
currentWeekHTML = html`<div class="week-number">${localize('ui.common.week')} ${currentWeek.toString()}</div>`
@@ -137,18 +141,18 @@ export function getWeekNumberHTML(day: [EventClass], currentWeek: number) {
137141

138142
export function getDescription(config: atomicCardConfig, event: EventClass) {
139143
if (config.showDescription && event.description) {
140-
let desc = event.description;
144+
let {description} = event;
141145
if (isHtml(event.description)) {
142-
desc = unsafeHTML(event.description);
146+
description = unsafeHTML(event.description);
143147
}
144148

145149
if (!isHtml(event.description) && config.descLength && event.description.length >= config.descLength) {
146-
desc = html`${event.description.slice(0, config.descLength)}`;
150+
description = html`${event.description.slice(0, config.descLength)}`;
147151
}
148152
return html`<div class="event-right">
149153
<div class="event-main">
150154
<div class="event-description" style="--description-color: ${config.descColor}; --description-size: ${config.descSize}%">
151-
${desc}
155+
${description}
152156
</div>
153157
</div>
154158
</div>`;

‎src/localize/languages/da.json‎

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,14 @@
4747
"showRelativeTime": "Vis den relative tid",
4848
"firstDayOfWeek": "Første dag i ugen 0-6",
4949
"cardHeight": "Højde på kort",
50-
"hideDuplicates": "Skjul dubletter"
50+
"hideDuplicates": "Skjul dubletter",
51+
"showMultiDay": "Opdelt flerdages begivenheder",
52+
"showMultiDayEventParts": "Vis flere dages begivenhedsdele",
53+
"eventTitle": "Indstil tom begivenhedstitel",
54+
"compactMode": "Aktiver kompakt tilstand",
55+
"hoursOnSameLine": "Vis timer på begivenhedslinjen",
56+
"titleLength": "Max titellængde (0 for ubegrænset)",
57+
"descLength": "Max beskrivelseslængde (0 for ubegrænset)"
5158
}
5259
},
5360
"event": {
@@ -69,7 +76,12 @@
6976
"fullDayEventText": "Hel dags tekst:",
7077
"showEventIcon": "Vis aftale ikon",
7178
"showHiddenText": "Vis skjulte aftaler tekst?",
72-
"hiddenEventText": "Tekst til skjulte aftaler:"
79+
"hiddenEventText": "Tekst til skjulte aftaler:",
80+
"showCalendarName": "Vis kalendernavn",
81+
"showWeekNumber": "Vis ugenumre",
82+
"showEventDate": "Vis dato for arrangementer",
83+
"showDatePerEvent": "Vis dato ud for hver begivenhed",
84+
"showTimeRemaining": "Vis resterende tid"
7385
}
7486
},
7587
"calendar": {

‎src/localize/languages/de.json‎

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,14 @@
4646
"showRelativeTime": "Relative Zeit anzeigen",
4747
"firstDayOfWeek": "Erster Wochentag 0-6",
4848
"cardHeight": "Kartenhöhe",
49-
"hideDuplicates": "Duplikate ausblenden"
49+
"hideDuplicates": "Duplikate ausblenden",
50+
"showMultiDay": "Split meerdaagse evenementen",
51+
"showMultiDayEventParts": "Toon meerdaagse evenementonderdelen",
52+
"eventTitle": "Lege evenementtitel instellen",
53+
"compactMode": "Schakel de compacte modus in",
54+
"hoursOnSameLine": "Toon uren op de gebeurtenisregel",
55+
"titleLength": "Maximale titellengte (0 voor onbeperkt)",
56+
"descLength": "Maximale beschrijvingslengte (0 voor onbeperkt)"
5057
}
5158
},
5259
"event": {
@@ -68,7 +75,12 @@
6875
"fullDayEventText": "Text für 'Ganztägiger Eintrag':",
6976
"showEventIcon": "Ereignis-Symbol anzeigen?",
7077
"showHiddenText": "Versteckten Ereignistext anzeigen?",
71-
"hiddenEventText": "Text für versteckte Ereignisse"
78+
"hiddenEventText": "Text für versteckte Ereignisse",
79+
"showCalendarName": "Toon agendanaam",
80+
"showWeekNumber": "Toon weeknummers",
81+
"showEventDate": "Toon datum voor evenementen",
82+
"showDatePerEvent": "Toon datum naast elk evenement",
83+
"showTimeRemaining": "Laat de resterende tijd zien"
7284
}
7385
},
7486
"calendar": {

0 commit comments

Comments
 (0)