Gustavo Luigi 2023-08-01 18:28:23 -03:00
parent d400c768c5
commit 1507505ddf
3 changed files with 25 additions and 38 deletions

View File

@ -52,9 +52,9 @@ $(function () {
function initMap() {
function createInfowindowElement(item) {
let infowindowElement = $("#marker-window").clone();
infowindowElement.html(infowindowElement.html().replace('$title', item.title));
infowindowElement.html(infowindowElement.html().replace('$description', item.description ?? ''));
infowindowElement.find(".path").attr("href", item.path);
infowindowElement.find(".js-title").text(item.title);
infowindowElement.find(".js-description").text(item.description ?? '');
infowindowElement.find(".js-path").attr("href", item.path);
infowindowElement.removeClass('d-none');
return infowindowElement[0].outerHTML;
}
@ -141,18 +141,18 @@ function initMap() {
$("#contents").empty();
showedItems.forEach(function (item) {
let locationElement = locationElementTemplate.clone();
locationElement.html(locationElement.html().replace('$title', item.title));
locationElement.html(locationElement.html().replace('data-src="$image"', 'src="' + item.image + '"'));
locationElement.find(".path").attr("href", item.path);
locationElement.find(".js-title").text(item.title);
locationElement.find(".js-image").attr("src", item.image);
locationElement.find(".js-path").attr("href", item.path);

let location = item[textToSlug(locationField)];
if (location && location.postalCode) locationElement.html(locationElement.html().replace('$postalCode', (location.postalCode + " " + (location.addressLocality ?? "")).trim()));
else locationElement.find(".postal-code").hide();
if (location && location.postalCode) locationElement.find(".js-postal-code").text((location.postalCode + " " + (location.addressLocality ?? "")).trim());
else locationElement.find(".js-postal-code").hide();

locationElement.removeClass('d-none');

if (item[textToSlug(tagField)] && Array.isArray(item[textToSlug(tagField)])) item[textToSlug(tagField)].slice(0, 2).forEach(function (besonderheitenItem) {
locationElement.find(".tags").append(`<span class="badge text-bg-secondary">${besonderheitenItem}</span>`);
locationElement.find(".js-tags").append(`<span class="badge text-bg-secondary">${besonderheitenItem}</span>`);
});

locationElement.on('click', function () {

View File

@ -1,7 +1,6 @@
@extends('template.'.config('settings.template').'.content.master')
@section('head')
<title>{{$content->title}} | {{config('settings.name')}}</title>

@stop
@section('content')
<div class="container">
@ -9,44 +8,29 @@
<div class="col-12 mt-4">
<a href="{{url('/')}}"> ← Back</a>
</div>

<div class="col-12 mt-4 mb-4">

<h1>{{$content->title}}</h1>


</div>

<div class="col-12 col-md-4">
<img src="{{$content->image()}}" class="img-fluid rounded" alt="Bild {{$content->title}}">

</div>

<div class="col-12 col-md-7 offset-md-1 fs-4">

{!!$content->beschreibung!!}


{!!$content->{$_description_fielda??''}!!}
</div>

</div>

@if($content->bilder)
@if(isset($_images_field) && $content->{$_images_field})
<div class="row">
<div class="col-12 mt-4 mb-2">
<h2>Bilder</h2>
</div>
@foreach($content->bilder as $bild)
@foreach($content->{$_images_field} as $bild)
<div class="col-12 col-md-3 mb-4">
<img src="{{$bild}}" class="img-fluid rounded">
<x-img src="{{$bild}}" class="img-fluid rounded"/>
</div>
@endforeach
<div class="col-3"></div>
</div>
@endif

</div>
<script>
const contentUrl = "{{url('/api/contents/'.$content->id)}}";

View File

@ -109,11 +109,11 @@
<div class="col-12 col-md-8 g-0 ps-md-3 order-md-last">
<div id="map"></div>
<div id="marker-window" class="d-none">
<h6 id="firstHeading" class="firstHeading">$title</h6>
<div id="bodyContent">
<img class="img-fluid rounded" data-src="$image" alt="">
<p>$description</p>
<a href="" class="path" style="outline: none;">Details</a>
<h6 class="js-title"></h6>
<div>
<img class="img-fluid rounded js-image" src="" alt="">
<p class="js-description"></p>
<a href="" class="js-path" style="outline: none;">Details</a>
</div>
</div>
</div>
@ -122,12 +122,15 @@
<div class="card-body">
<div class="row">
<div class="col-12 col-md-5">
<img class="img-fluid rounded" data-src="$image" alt="">
<img class="img-fluid rounded js-image" src="" alt="">
</div>
<div class="col-12 col-md-7">
<h4 class="fs-6 mt-2 fw-bolder">$title</h4>
<p class="mt-2 text-muted small postal-code"> <svg style="fill: #ea4335; width: 10px; margin-right: 4px; margin-bottom: 2px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><path d="M384 192c0 87.4-117 243-168.3 307.2c-12.3 15.3-35.1 15.3-47.4 0C117 435 0 279.4 0 192C0 86 86 0 192 0S384 86 384 192z"/></svg>$postalCode</p>
<div style="gap: .25rem;" class="d-flex tags"></div>
<h4 class="fs-6 mt-2 fw-bolder js-title"></h4>
<p class="mt-2 text-muted small">
<svg style="fill: #ea4335; width: 10px; margin-right: 4px; margin-bottom: 2px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><path d="M384 192c0 87.4-117 243-168.3 307.2c-12.3 15.3-35.1 15.3-47.4 0C117 435 0 279.4 0 192C0 86 86 0 192 0S384 86 384 192z"/></svg>
<span class="js-postal-code"></span>
</p>
<div class="js-tags"></div>
</div>
</div>
</div>