Merge pull request #378 from cultuurnet/feature/WID-550

WID-550 - Add icon_uitx option to Annotations
cultuurnet · Jan 16, 2024 · ce7e762 · ce7e762
2 parents 34bc555 + 78d0a4a
commit ce7e762
Show file tree

Hide file tree

Showing 10 changed files with 129 additions and 12 deletions.
diff --git a/src/Widget/Twig/TwigPreprocessor.php b/src/Widget/Twig/TwigPreprocessor.php
@@ -177,6 +177,7 @@ public function preprocessEvent(Event $event, string $langcode, array $settings)
             'hidden_labels' => $event->getHiddenLabels() ?? [],
             'vlieg' => $this->isVliegEvent($event),
             'uitpas' => $this->isUitpasEvent($event),
+            'uitx' => $this->isUitxEvent($event),
             'museumpas' => $this->isMuseumpasEvent($event),
             'facilities' => $this->getFacilitiesWithPresentInformation($event),
             'typeId' => (count($event->getTermsByDomain('eventtype')) > 0) ? $event->getTermsByDomain('eventtype')[0]->getId() : null,
@@ -367,6 +368,18 @@ public function preprocessEventDetail(Event $event, string $langcode, array $set
             }
         }
 
+        if ($variables['uitx'] && !empty($settings['icon_uitx'])) {
+            $referer = parse_url($this->request->server->get('HTTP_REFERER'), PHP_URL_HOST);
+            $utmSource= urlencode($referer);
+
+                $variables['uitx_disclaimer'] = $this->twig->render(
+                    'widgets/search-results-widget/uitx-disclaimer.html.twig',
+                    [
+                        'utmSource' => $utmSource,
+                    ]
+                );
+        }
+
         // Load 'kansentarief' via culturefeed.
         if (!empty($settings['price_information'])) {
             $this->preprocessPriceInfo($event, $variables, $langcode);
@@ -900,6 +913,29 @@ protected function isUitpasEvent(Event $event)
         return false;
     }
 
+    /**
+     * Check if event is considered an "UiTX" event.
+     *
+     * @param \CultuurNet\SearchV3\ValueObjects\Event $event
+     * @return bool
+     */
+    protected function isUitxEvent(Event $event)
+    {
+
+        $labels = array_merge($event->getLabels(), $event->getHiddenLabels());
+
+        // Check for label values containing "jongerentip".
+        if ($labels) {
+            foreach ($labels as $label) {
+                if (stripos($label, 'jongerentip') !== false) {
+                    return true;
+                }
+            }
+        }
+
+        return false;
+    }
+
     /**
      * Check if event is considered an "Museumpas" event.
      *

diff --git a/src/Widget/WidgetType/SearchResults.php b/src/Widget/WidgetType/SearchResults.php
@@ -64,6 +64,9 @@
  *              "icon_museumpass":{
  *                  "enabled":true
  *              },
+ *              "icon_uitx":{
+ *                  "enabled":true
+ *              },
  *              "description":{
  *                  "enabled":true,
  *                  "characters":200
@@ -158,6 +161,9 @@
  *              "icon_museumpass":{
  *                  "enabled":true
  *              },
+ *              "icon_uitx":{
+ *                  "enabled":true
+ *              },
  *              "description":{
  *                  "enabled":true,
  *                  "characters":200
@@ -252,6 +258,9 @@
  *              "icon_museumpass":{
  *                  "enabled":"boolean"
  *              },
+ *              "icon_uitx":{
+ *                  "enabled":"boolean"
+ *              },
  *              "description":{
  *                  "enabled":"boolean",
  *                  "characters":"integer"
@@ -349,6 +358,9 @@
  *              "icon_museumpass":{
  *                  "enabled":"boolean"
  *              },
+ *              "icon_uitx":{
+ *                  "enabled":"boolean"
+ *              },
  *              "description":{
  *                  "enabled":"boolean",
  *                  "characters":"integer"

diff --git a/src/Widget/WidgetType/Tips.php b/src/Widget/WidgetType/Tips.php
@@ -50,6 +50,9 @@
  *              "icon_museumpass":{
  *                  "enabled":true
  *              },
+ *              "icon_uitx":{
+ *                  "enabled":true
+ *              },
  *              "description":{
  *                  "enabled":true,
  *                  "characters":200
@@ -136,6 +139,9 @@
  *              "icon_museumpass":{
  *                  "enabled":"boolean"
  *              },
+ *              "icon_uitx":{
+ *                  "enabled":"boolean"
+ *              },
  *              "description":{
  *                  "enabled":"boolean",
  *                  "characters":"integer"

diff --git a/test/Widget/data/page.json b/test/Widget/data/page.json
@@ -81,6 +81,9 @@
                   "icon_museumpass": {
                     "enabled": true
                   },
+                  "icon_uitx": {
+                    "enabled": true
+                  },
                   "description": {
                     "enabled": true,
                     "characters": 200
@@ -146,6 +149,10 @@
                   "show": true,
                   "label": "Museumpas"
                 },
+                "icon_uitx": {
+                  "show": true,
+                  "label": "UiTX"
+                },
                 "description": {
                   "show": true,
                   "characters": 200
@@ -207,6 +214,10 @@
                   "show": true,
                   "label": "Museumpas logo"
                 },
+                "icon_uitx": {
+                  "show": true,
+                  "label": "UiTX logo"
+                },
                 "description": {
                   "show": true,
                   "characters": 200

diff --git a/views/widgets/event-summary.html.twig b/views/widgets/event-summary.html.twig
@@ -74,6 +74,18 @@
 
                     </span>
                 {% endif %}
+                {% if settings_items.icon_uitx.enabled and event.uitx %}
+                    <span class="cnw_sticker cnw_sticker--uitx">
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 99 37">
+                            <g fill-rule="nonzero" fill="none">
+                                <path d="M20.95 21.396c0 2.45-.257 4.426-2.142 6.19-1.686 1.571-3.744 2.127-5.802 2.303-1.8.154-4.144-.115-5.658-1.178-2.084-1.5-2.482-3.72-2.482-6.551V6.549l6.115.508v14.147c0 .76-.029 1.786.371 2.465.458.705 1.372.958 2.144.922.685-.033 1.542-.296 2.056-.83.774-.762.686-1.903.686-2.92V7.492l4.715.392-.002 13.512Zm7.515 6.777-5.658.465V14.519l5.658.176v13.478Zm0-15.011-5.658-.25v-4.87l5.658.47v4.65Zm11.286 14.174-5.715.477V13.505l-4.114-.177V8.632L43.78 9.784v4.141l-4.03-.173v13.584Z" fill="#40404A"/>
+                                <path fill="#40404A" d="M0 0h61.665v37H0l49.333-6.168V6.166z"/>
+                                <path fill="#1EFF00" d="M98.665 0v37h-37V0z"/>
+                                <path d="m85.06 16.99 7.502-7.504a15.412 15.412 0 0 0-3.383-3.383l-7.503 7.502a5.132 5.132 0 0 1 3.383 3.384Zm-6.405-3.385L71.15 6.103a15.4 15.4 0 0 0-3.384 3.383l7.504 7.503a5.132 5.132 0 0 1 3.384-3.384Zm3.021 9.79 7.503 7.502a15.412 15.412 0 0 0 3.383-3.383L85.06 20.01a5.134 5.134 0 0 1-3.383 3.384Zm-6.405-3.384-7.504 7.503a15.4 15.4 0 0 0 3.384 3.383l7.504-7.502a5.133 5.133 0 0 1-3.384-3.384Z" fill="#40404A"/>
+                            </g>
+                        </svg>
+                    </span>
+                {% endif %}
             </span>
 
             <p class="cnw_card-description">

diff --git a/views/widgets/search-results-widget/detail-page.html.twig b/views/widgets/search-results-widget/detail-page.html.twig
@@ -50,6 +50,18 @@
 
                     </span>
                 {% endif %}
+                {% if settings.icon_uitx.enabled and event.uitx %}
+                    <span class="cnw_sticker cnw_sticker--uitx">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="98" height="37" viewBox="0 0 99 37">
+                            <g fill-rule="nonzero" fill="none">
+                                <path d="M20.95 21.396c0 2.45-.257 4.426-2.142 6.19-1.686 1.571-3.744 2.127-5.802 2.303-1.8.154-4.144-.115-5.658-1.178-2.084-1.5-2.482-3.72-2.482-6.551V6.549l6.115.508v14.147c0 .76-.029 1.786.371 2.465.458.705 1.372.958 2.144.922.685-.033 1.542-.296 2.056-.83.774-.762.686-1.903.686-2.92V7.492l4.715.392-.002 13.512Zm7.515 6.777-5.658.465V14.519l5.658.176v13.478Zm0-15.011-5.658-.25v-4.87l5.658.47v4.65Zm11.286 14.174-5.715.477V13.505l-4.114-.177V8.632L43.78 9.784v4.141l-4.03-.173v13.584Z" fill="#40404A"/>
+                                <path fill="#40404A" d="M0 0h61.665v37H0l49.333-6.168V6.166z"/>
+                                <path fill="#1EFF00" d="M98.665 0v37h-37V0z"/>
+                                <path d="m85.06 16.99 7.502-7.504a15.412 15.412 0 0 0-3.383-3.383l-7.503 7.502a5.132 5.132 0 0 1 3.383 3.384Zm-6.405-3.385L71.15 6.103a15.4 15.4 0 0 0-3.384 3.383l7.504 7.503a5.132 5.132 0 0 1 3.384-3.384Zm3.021 9.79 7.503 7.502a15.412 15.412 0 0 0 3.383-3.383L85.06 20.01a5.134 5.134 0 0 1-3.383 3.384Zm-6.405-3.384-7.504 7.503a15.4 15.4 0 0 0 3.384 3.383l7.504-7.502a5.133 5.133 0 0 1-3.384-3.384Z" fill="#40404A"/>
+                            </g>
+                        </svg>
+                    </span>
+                {% endif %}
             </span>
 
                 <p class="cnw_card-description">
@@ -224,6 +236,15 @@
 
                     {% endif %}
 
+                    {% if settings.icon_uitx and event.uitx %}
+
+                        <dt>UiTX</dt>
+                        <dd>
+                            {{ event.uitx_disclaimer | raw }}
+                        </dd>
+
+                    {% endif %}
+
                     {% if settings.contact_information and event.links %}
                     <dt>
                         <em class="cnw_searchresult-detail-label">{{ 'event_detail_links'| transTo(preferredLanguage) }}</em>

diff --git a/views/widgets/search-results-widget/uitx-disclaimer.html.twig b/views/widgets/search-results-widget/uitx-disclaimer.html.twig
@@ -0,0 +1,5 @@
+<div class="cnw_uitx-disclaimer">
+
+    <p class="cnw_uitx-disclaimer-more-info">Deze activiteit werd geselecteerd door jongeren. Meer cultuurtips? Check <a href="https://www.uitinvlaanderen.be/uitx?utm_source={{ utmSource }}&utm_medium=partnerlink&utm_content=home&utm_campaign=uitxlokaal&utm_term=uitx" data-click-tracking-category="detail" data-click-tracking-action="uitx disclaimer more info">uitinvlaanderen.be/uitx</a><p>
+
+</div>
diff --git a/web/assets/css/cn_widget_styling.css b/web/assets/css/cn_widget_styling.css
diff --git a/widgets-static/app/styles/01_components/_detail-page.scss b/widgets-static/app/styles/01_components/_detail-page.scss
@@ -6,16 +6,15 @@
       padding-right: 60px;
     }
   }
-  .cnw_sticker--vlieg {
-    float: right;
-  }
 
   .cnw_sticker {
     margin-right: 10px;
   }
 
   .cnw_sticker--uitpas,
-  .cnw_sticker--museumpas {
+  .cnw_sticker--museumpas,
+  .cnw_sticker--uitx,
+  .cnw_sticker--vlieg {
     margin-top: 10px;
     float: right;
   }

diff --git a/widgets-static/app/styles/01_components/_search-result.scss b/widgets-static/app/styles/01_components/_search-result.scss
@@ -89,6 +89,8 @@
 
   margin-bottom: 20px;
 
+  float: left;
+
 
   .cnw_txt{
     background-color: #44444C;
@@ -111,6 +113,7 @@
   display: block;
   width:45px;
   border: none;
+  float: right;
 
   .uit-logo-bg {
     stop-color : #F0B32C;
@@ -122,7 +125,13 @@
 
 .cnw_sticker--museumpas {
   display: block;
-  width: 45px;
+  width: 55px;
+  float: right;
+}
+
+.cnw_sticker--uitx {
+  display: block;
+  width: 108px;
 }
 
 .cnw_searchresult__options {