From a25f69f30e02f356d77a81ff1f140d6e8a0b762b Mon Sep 17 00:00:00 2001
From: "michael.danielczok" <michael@pcsg.de>
Date: Sun, 20 Sep 2020 20:35:38 +0200
Subject: [PATCH] feat: Image fit setting. quiqqer/timeline#1
---
locale.xml | 20 +++++++++++++++++-
site.xml | 21 +++++++++++++++++++
.../Controls/Timeline.VerticalBothSides.css | 2 +-
.../Controls/Timeline.VerticalBothSides.html | 6 +++++-
src/QUI/Timeline/Controls/Timeline.php | 4 +++-
types/timeline.php | 3 ++-
6 files changed, 51 insertions(+), 5 deletions(-)
diff --git a/locale.xml b/locale.xml
index 900a65e..85d7c55 100644
--- a/locale.xml
+++ b/locale.xml
@@ -52,13 +52,31 @@
<pl><![CDATA[Wertykalna linnia czasu z treścią i ikona (obrazkiem)]]></pl>
</locale>
- <!-- show short -->
+ <!-- show url -->
<locale name="timeline.showLinks">
<de><![CDATA[Links zu den Seiten anzeigen?]]></de>
<en><![CDATA[Show hyerlinks for each site?]]></en>
<pl><![CDATA[]]></pl>
</locale>
+ <!-- image fit -->
+ <locale name="timeline.imageFit">
+ <de><![CDATA[Bild]]></de>
+ <en><![CDATA[Image]]></en>
+ </locale>
+ <locale name="timeline.imageFit.desc">
+ <de><![CDATA[Die Einstellung bezieht sich nur auf die Bilder, nicht auf die Icons]]></de>
+ <en><![CDATA[The setting refers only to the images, not to the icons]]></en>
+ </locale>
+ <locale name="timeline.imageFit.original">
+ <de><![CDATA[Original]]></de>
+ <en><![CDATA[Original]]></en>
+ </locale>
+ <locale name="timeline.imageFit.cover">
+ <de><![CDATA[Decken (Bild kann gestreckt werden)]]></de>
+ <en><![CDATA[Cover (image can be stretched)]]></en>
+ </locale>
+
<!-- counter text -->
<locale name="timeline.verticalBothSides.counterText">
<de><![CDATA[STEP]]></de>
diff --git a/site.xml b/site.xml
index 254d30d..b17d8db 100644
--- a/site.xml
+++ b/site.xml
@@ -13,6 +13,7 @@
<attributes>
<attribute default="VerticalBothSides">quiqqer.timeline.display</attribute>
<attribute default="1">quiqqer.timeline.showLinks</attribute>
+ <attribute default="original">quiqqer.timeline.imageFit</attribute>
</attributes>
<!-- list settings -->
@@ -43,6 +44,26 @@
</text>
</input>
+ <select conf="quiqqer.timeline.imageFit">
+ <text>
+ <locale group="quiqqer/timeline"
+ var="timeline.imageFit"/>
+ </text>
+ <description>
+ <locale group="quiqqer/timeline"
+ var="timeline.imageFit.desc"/>
+ </description>
+
+ <option value="original">
+ <locale group="quiqqer/timeline"
+ var="timeline.imageFit.original"/>
+ </option>
+ <option value="cover">
+ <locale group="quiqqer/timeline"
+ var="timeline.imageFit.cover"/>
+ </option>
+ </select>
+
</settings>
</category>
</settings>
diff --git a/src/QUI/Timeline/Controls/Timeline.VerticalBothSides.css b/src/QUI/Timeline/Controls/Timeline.VerticalBothSides.css
index b9e8844..b086e39 100644
--- a/src/QUI/Timeline/Controls/Timeline.VerticalBothSides.css
+++ b/src/QUI/Timeline/Controls/Timeline.VerticalBothSides.css
@@ -62,7 +62,7 @@
justify-content: center;
}
-.timeline-entry-icon-wrapper picture img.fill-image {
+.timeline-entry-icon-wrapper picture img.image-fit-cover {
object-fit: cover;
width: 100%;
height: 100%;
diff --git a/src/QUI/Timeline/Controls/Timeline.VerticalBothSides.html b/src/QUI/Timeline/Controls/Timeline.VerticalBothSides.html
index 3e422c2..bbab682 100644
--- a/src/QUI/Timeline/Controls/Timeline.VerticalBothSides.html
+++ b/src/QUI/Timeline/Controls/Timeline.VerticalBothSides.html
@@ -26,6 +26,10 @@
itemtype="{$this->getAttribute('child-itemtype')}"
class="timeline-entry"
>
+ {assign var=imageFitClass value=''}
+ {if $imageFit == 'cover'}
+ {assign var=imageFitClass value='image-fit-cover'}
+ {/if}
<!-- Entry Icon -->
<div class="timeline-entry-icon">
@@ -33,7 +37,7 @@
<div class="timeline-entry-icon-wrapper">
{image src=$Child->getAttribute('image_site') max-width="500" max-height="500" type="resize"
title="{$Child->getAttribute('title')}"
- class="fill-image"}
+ class="$imageFitClass"}
</div>
{/if}
</div>
diff --git a/src/QUI/Timeline/Controls/Timeline.php b/src/QUI/Timeline/Controls/Timeline.php
index d245ade..57bcf57 100644
--- a/src/QUI/Timeline/Controls/Timeline.php
+++ b/src/QUI/Timeline/Controls/Timeline.php
@@ -30,6 +30,7 @@ public function __construct($attributes = array())
'order' => 'c_date ASC',
'parentInputList' => false, //todo später für brick
'showLinks' => true,
+ 'imageFit' => 'original', // original, cover
'display' => 'VerticalBothSides',
// Custom children template (path to html file); overwrites "display"
'displayTemplate' => false,
@@ -86,7 +87,8 @@ public function getBody()
'Site' => $Site,
'Project' => $this->getProject(),
'children' => $children,
- 'showLinks' => $this->getAttribute('showLinks')
+ 'showLinks' => $this->getAttribute('showLinks'),
+ 'imageFit' => $this->getAttribute('imageFit')
));
// load custom template (if set)
diff --git a/types/timeline.php b/types/timeline.php
index a18795d..fcfd450 100644
--- a/types/timeline.php
+++ b/types/timeline.php
@@ -9,7 +9,8 @@
'showLinks' => $Site->getAttribute('quiqqer.timeline.showLinks'),
'itemtype' => 'http://schema.org/ItemList',
'child-itemtype' => 'http://schema.org/ListItem',
- 'display' => $Site->getAttribute('quiqqer.timeline.display')
+ 'display' => $Site->getAttribute('quiqqer.timeline.display'),
+ 'imageFit' => $Site->getAttribute('quiqqer.timeline.imageFit')
));
$Engine->assign(array(
--
GitLab