custom templates for ProEvents Plugin

assets/javascript/app.js

@@ -43,6 +43,13 @@ jumplink.initMomentDataApi = function () {
         var date = moment($this.data('momentDisplayFromNow')).fromNow();
         $this.text(date);
     });
+
+    var $displayToNow = $('[data-moment-display-to-now]');
+    $displayToNow.each(function () {
+        $this = $(this);
+        var date = moment($this.data('momentDisplayToNow')).fromNow();
+        $this.text(date);
+    });
 }
 
 jumplink.setLanguage = function () {

assets/scss/_carousel.scss

@@ -25,7 +25,7 @@
         height: calc(100vh - 8px) !important; // 2 x 4px for the gradient border
         .slick-slide {
             background-position: center center;
-            background-size: 30% 100%;
+            background-size: 30% auto;
             background-repeat: no-repeat;
             width: calc(100vw - 8px) !important; // 2 x 4px for the gradient border
             height: calc(100vh - 8px) !important; // 2 x 4px for the gradient border

pages/PluginProevents/event-details.htm

@@ -0,0 +1,17 @@
+title = "Termin"
+url = "/termine/:event_id"
+layout = "jumplink-barba-default-page"
+description = "Termin Detail Ansicht"
+is_hidden = 0
+contentType = "html"
+
+[proEvent]
+event_id = ":event_id"
+==
+{#<nav class="row breadcrumb bg-white">
+    <a class="breadcrumb-item text-warning" href="/">Start</a>
+    <a class="breadcrumb-item text-warning" href="/termine">Termine</a>
+    <span class="breadcrumb-item active">{{ event_item.title }}</span>
+</nav>#}
+
+{% partial 'PluginProevents/event_detail' %}

pages/PluginProevents/kalender.htm

@@ -0,0 +1,14 @@
+title = "Kalender"
+url = "/kalender"
+layout = "jumplink-barba-default-page-fluid"
+is_hidden = 0
+contentType = "html"
+
+[proEventCalendar]
+eventpage = "ProEvents/event-details"
+style = "responsive"
+calendar = "all_calendars"
+eurocal = 1
+ical = 1
+==
+{% partial 'PluginProevents/calendar' __SELF__=proEventCalendar %}

pages/ProEvents/termine.htm → pages/PluginProevents/termine.htm

@@ -14,4 +14,9 @@
 num = 100
 pagination = 0
 ==
-{% component 'PluginProEventList' %}
+{#<nav class="row breadcrumb bg-white">
+    <a class="breadcrumb-item text-warning" href="/">Start</a>
+    <span class="breadcrumb-item active">{{this.page.title}}</span>
+</nav>#}
+
+{% partial 'PluginProevents/event_list' %}

partials/PluginCatalogProductDetails/default.htm

@@ -61,7 +61,7 @@ <h2 itemprop=”name” content="{{ product.title }}" class="font-handwritten">
                     {% endif %}
                 </div>
 
-                {% if product.sku is defined and show_sku %}
+                {% if product.sku is defined and product.sku|length > 0 and show_sku %}
                     <div itemprop="gtin13" content="{{ product.sku }}" class="w-100">
                         EAN {{ product.sku }}
                         <a href="https://www.ean-search.org/perl/ean-search.pl?q={{ product.sku }}" target="_blank">
@@ -70,7 +70,7 @@ <h2 itemprop=”name” content="{{ product.title }}" class="font-handwritten">
                     </div>
                 {% endif %}
 
-                {% if product.specifications is defined and show_specifications_link %}
+                {% if product.specifications is defined and product.specifications|length > 0 and show_specifications_link %}
                     Weitere Informationen
                     <a href="{{product.specifications | replace({'{{base_specifications_url}}': this.theme.router_base_specifications_url, '{{brand}}': product.brand.slug, '{{name}}': product.slug})}}" target="_blank" class="specifications">
                         {% partial "jumplink-iconset" name="arrow_back" color="link-color" direction="up" size=16 class="" %}

partials/PluginProevents/calendar.htm

@@ -0,0 +1,70 @@
+[viewBag]
+==
+<div class="loader"></div>
+<input type="hidden" value="0" id="cur_date"/>
+<form
+	data-request="{{ __SELF__ }}::listEvents"
+    data-request-update="'{{__SELF__}}::responsive_ajax': '#responsive_cal'"
+    data-request-success="$('#input-item').val('')"
+	class="event_nav">
+	<a
+		data-request = "{{ __SELF__ }}::onPrevMonth"
+    	data-request-update = "'{{__SELF__}}::responsive_ajax': '#responsive_cal'"
+    	data-request-data = "cal_date: $('#curent_date').val()"
+    	data-request-success = "$('#setyear').val($('#year').val());$('#setmo').val($('#month').val());"
+    	class = "button white submo"
+    	>&laquo;</a>
+	&nbsp;
+	<select name="setyear" id="setyear"
+		data-request = "{{ __SELF__ }}::onSetYear"
+    	data-request-update = "'{{__SELF__}}::responsive_ajax': '#responsive_cal'"
+    	data-request-data = "cal_date: $('#setyear').val() + '-' + $('#setmo').val() + '-01'"
+	>
+		<option value="{{ year - 2 }}">{{ year - 2 }}</option>
+		<option value="{{ year - 1 }}">{{ year - 1 }}</option>
+		<option value="{{ year }}" selected >{{ year }}</option>
+		<option value="{{ year + 1 }}">{{ year + 1 }}</option>
+		<option value="{{ year + 2 }}">{{ year + 2 }}</option>
+	</select>
+	<select name="setmo" id="setmo"
+		data-request = "{{ __SELF__ }}::onSetMonth"
+    	data-request-update = "'{{__SELF__}}::responsive_ajax': '#responsive_cal'"
+    	data-request-data = "cal_date: $('#setyear').val() + '-' + $('#setmo').val() + '-01'"
+	>
+		<option value="01" {% if month == 01 %} selected {% endif %}>{{'Jan'|_}}</option>
+		<option value="02" {% if month == 02 %} selected {% endif %}>{{'Feb'|_}}</option>
+		<option value="03" {% if month == 03 %} selected {% endif %}>{{'Mar'|_}}</option>
+		<option value="04" {% if month == 04 %} selected {% endif %}>{{'Apr'|_}}</option>
+		<option value="05" {% if month == 05 %} selected {% endif %}>{{'May'|_}}</option>
+		<option value="06" {% if month == 06 %} selected {% endif %}>{{'Jun'|_}}</option>
+		<option value="07" {% if month == 07 %} selected {% endif %}>{{'Jul'|_}}</option>
+		<option value="08" {% if month == 08 %} selected {% endif %}>{{'Aug'|_}}</option>
+		<option value="09" {% if month == 09 %} selected {% endif %}>{{'Sep'|_}}</option>
+		<option value="10" {% if month == 10 %} selected {% endif %}>{{'Oct'|_}}</option>
+		<option value="11" {% if month == 11 %} selected {% endif %}>{{'Nov'|_}}</option>
+		<option value="12" {% if month == 12 %} selected {% endif %}>{{'Dec'|_}}</option>
+	</select>
+
+	<input type="hidden" name="dateset" value="1">
+	&nbsp;
+	<a
+		data-request ="{{ __SELF__ }}::onNextMonth"
+    	data-request-update ="'{{__SELF__}}::responsive_ajax': '#responsive_cal'"
+    	data-request-data = "cal_date: $('#curent_date').val()"
+    	class="button white addmo"
+    	data-request-success = "$('#setyear').val($('#year').val());$('#setmo').val($('#month').val());"
+    	>&raquo;</a>
+</form>
+
+<div class="calendar" id="responsive_cal">
+	{% partial "PluginProevents/calendar_ajax" %}
+</div>
+{#% put scripts %}
+    <script type="text/javascript">
+        $(document).ready(function(){
+            setToolTips();
+            equalHeights(130,600);
+        });
+    </script>
+{% endput %#}
+<br style="clear: both;"/>

partials/PluginProevents/calendar_ajax.htm

@@ -0,0 +1,100 @@
+[viewBag]
+==
+<div class="title_year"><h3>{{ cal_date|date('F') }} {{year}}</h3></div>
+<input type="hidden" id="curent_date" value="{{ cal_date }}" />
+<input type="hidden" id="year" value="{{ year }}" />
+<input type="hidden" id="month" value="{{ month }}" />
+{% if euro_cal == 1 %}
+    <ul class="weekdays">
+        <li>{{'Monday'|_}}</li>
+        <li>{{'Tuesday'|_}}</li>
+        <li>{{'Wednesday'|_}}</li>
+        <li>{{'Thursday'|_}}</li>
+        <li>{{'Friday'|_}}</li>
+        <li>{{'Saturday'|_}}</li>
+        <li>{{'Sunday'|_}}</li>
+    </ul>
+{% else %}
+    <ul class="weekdays">
+        <li>{{'Sunday'|_}}</li>
+        <li>{{'Monday'|_}}</li>
+        <li>{{'Tuesday'|_}}</li>
+        <li>{{'Wednesday'|_}}</li>
+        <li>{{'Thursday'|_}}</li>
+        <li>{{'Friday'|_}}</li>
+        <li>{{'Saturday'|_}}</li>
+    </ul>
+{% endif %}
+<ul class="days">
+	{% set daycount = 1 %}
+
+	{% if blank != 0 %}
+		{% for i in 1..blank %}
+		    <li class="calendar-day date_fill"><div class="date"></div></li>
+		    {% set daycount = daycount + 1 %}
+		{% endfor %}
+	{% endif %}
+
+	{% for i in 1..days_in_month %}
+		{% set daynum = year ~ '-' ~ month ~ '-' ~ i %}
+		<li class="calendar-day">
+			<div class="date"><span class="day"> {{ daynum|date("D") }} </span> <span class="month"> {{ daynum|date("M") }} </span> {{i}} </div>
+			{% for event_item in events %}
+				{% if daynum|date("Y-m-d") == event_item.event_date|date("Y-m-d") %}
+					<div class="daynum hasevent">
+						{% if event_item.status == 'booked' %}
+							{% set event_color = 'FF5050' %}
+						{% elseif event_item.status == 'available' %}
+							{% set event_color = '2EB82E' %}
+						{% else %}
+							{% set event_color = calendar_colors[event_item.calendar_id] %}
+						{% endif %}
+						{% if event_color %}<div style="background-color: #{{ event_color }}!important;" class="category_color">{% endif %}
+						<a href="{{ eventpage|page({'event_slug': event_item.title|replace({' ':'-'})|lower,'event_id': event_item.id }) }}/" rel="pe_tooltip" onClick="$('#pe_tooltip').remove();">
+							{% if event_item.status == 'booked' %}
+								<i class="icon-remove-sign"></i>
+							{% elseif event_item.status == 'available' %}
+								<i class="icon-ok-sign"></i>
+							{% endif %}
+							{{ event_item.title }}
+						</a>
+						<div class="pe_tooltip_body" style="display: none;">
+							<h4>{{ event_item.title }}</h4>
+							<!-- {% if event_item.event.featured_images[0]['path'] %}
+			                    <p><img src="{{event_item.event.featured_images[0]['path']}}" alt="event_{{event_item.id}}" width="100%" /></p>
+			                {% endif %} -->
+							<h5>{{ event_item.date|date("M dS") }}</h5>
+							{% if event_item.allday > 0 %}
+								{{'All Day'|_}}
+							{% else %}
+								{{ event_item.sttime|date("g:i a") }}  - {{ event_item.entime|date("g:i a") }}
+							{% endif %}
+						</div>
+						{% if event_color %}</div>{% endif %}
+					</div>
+				{% endif %}
+			{% endfor %}
+		</li>
+		{% set daycount = daycount + 1 %}
+		{% if daycount > 7 %}
+			</ul><ul class="days">
+			{% set daycount = 1 %}
+		{% endif %}
+	{% endfor %}
+
+	{% if (daycount - 7) > 0 %}
+		{% for i in i..(daycount - 7) %}
+			<li class="calendar-day date_fill"><div class="date"></div></li>
+			{% set daycount = daycount + 1 %}
+		{% endfor %}
+	{% elseif (daycount - 7) == 0 %}
+		<li class="calendar-day date_fill"><div class="date"></div></li>
+	{% endif %}
+</ul>
+
+{#<script type="text/javascript">
+$(document).ready(function(){
+    setToolTips();
+    equalHeights(130,600);
+});
+</script>#}