{block name='productdetails-mediafile'}
    {et_isShopVersionAtLeast value="5.3.0-rc.3" assign='shopIsAtLeast53'}
    {if !empty($Artikel->oMedienDatei_arr)}
        {assign var=mp3List value=false}
        {assign var=titles value=false}
        {$lazyLoadImages=$lazyLoadImages|default:true}
        <div class="mediafiles card-columns {if $mediaType->count < 3}card-columns-2{/if}">
        {foreach $Artikel->oMedienDatei_arr as $oMedienDatei}
            {if ($mediaType->name == $oMedienDatei->cMedienTyp && isset($oMedienDatei->cAttributTab) && strlen($oMedienDatei->cAttributTab) == 0)
            || (isset($oMedienDatei->cAttributTab) && strlen($oMedienDatei->cAttributTab) > 0 && $mediaType->name == $oMedienDatei->cAttributTab)}
                {if $oMedienDatei->nErreichbar == 0}
                    {block name='productdetails-mediafilealert'}
                        <div class="col mediafiles-no-media">
                            <div role="alert" class="alert alert-danger">
                                <div class="sr-only">x</div>
                                {lang key='noMediaFile' section='errorMessages'}
                            </div>
                        </div>
                    {/block}
                {else}
                    {assign var=cName value=$oMedienDatei->cName}
                    {assign var=titles value=$titles|cat:$cName}
                    {if !$oMedienDatei@last}
                        {assign var=titles value=$titles|cat:'|'}
                    {/if}

                    {* Images *}
                    {if $oMedienDatei->nMedienTyp === 1}
                        {block name='productdetails-mediafile-images'}
                            {$cMediaAltAttr = ""}
                            {if isset($oMedienDatei->oMedienDateiAttribut_arr) && count($oMedienDatei->oMedienDateiAttribut_arr) > 0}
                                {foreach $oMedienDatei->oMedienDateiAttribut_arr as $oAttribut}
                                    {if $oAttribut->cName === 'img_alt'}
                                        {assign var=cMediaAltAttr value=$oAttribut->cWert}
                                    {/if}
                                {/foreach}
                            {/if}
                            <div class="card">
                                {if !empty($oMedienDatei->cPfad)}
                                    {et_getImageSize src="{$ShopURL}/{$smarty.const.PFAD_MEDIAFILES}{$oMedienDatei->cPfad}" assign='et_imageSize'}
                                    {else}
                                    {$et_imageSize = []}
                                {/if}
                                <img src="{if !empty($oMedienDatei->cPfad)}{$ShopURL}/{$smarty.const.PFAD_MEDIAFILES}{$oMedienDatei->cPfad}{elseif !empty($oMedienDatei->cURL)}{$oMedienDatei->cURL}{/if}" alt="{$cMediaAltAttr}" class="card-img-top"{if $lazyLoadImages} loading="lazy"{/if}{if !empty($et_imageSize)} {$et_imageSize.attributes}{/if}>
                                <div class="card-body">
                                    <h4 class="card-title">{$oMedienDatei->cName}</h4>
                                    <div class="row">
                                        {if !empty($oMedienDatei->cBeschreibung)}
                                            <div class="col-12 mediafiles-description">
                                                {$oMedienDatei->cBeschreibung}
                                            </div>
                                        {/if}
                                    </div>
                                </div>
                            </div>
                        {/block}
                        {* Audio *}
                    {elseif $oMedienDatei->nMedienTyp === 2}
                        {if strlen($oMedienDatei->cName) > 1}
                            {block name='productdetails-mediafile-audio'}
                                <div class="card">
                                    <div class="card-body">
                                        <h4 class="card-title">{$oMedienDatei->cName}</h4>
                                        <div class="row">
                                            {if !empty($oMedienDatei->cBeschreibung)}
                                                <div class="col-12 mediafiles-description">
                                                    {$oMedienDatei->cBeschreibung}
                                                </div>
                                            {/if}
                                            <div class="col-12">
                                                {if strlen($oMedienDatei->cPfad) > 1 || strlen($oMedienDatei->cURL) > 1}
                                                    {assign var=audiosrc value=$oMedienDatei->cURL}
                                                    {if strlen($oMedienDatei->cPfad) > 1}
                                                        {assign var=audiosrc value=$ShopURL|cat:'/':$smarty.const.PFAD_MEDIAFILES:$oMedienDatei->cPfad}
                                                    {/if}
                                                    {if strlen($audiosrc) > 1}
                                                        <audio controls controlslist="nodownload">
                                                            <source src="{$audiosrc}" type="audio/mpeg">
                                                            {lang key='audioTagNotSupported' section='errorMessages'}
                                                        </audio>
                                                    {/if}
                                                {/if}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            {/block}
                        {/if}

                    {* Video *}
                    {elseif $oMedienDatei->nMedienTyp === 3}
                        {block name='productdetails-mediafile-video'}
                            {if ($oMedienDatei->videoType === 'mp4'
                            || $oMedienDatei->videoType === 'webm'
                            || $oMedienDatei->videoType === 'ogg')}
                                <div class="card">
                                    <div class="card-body">
                                        <h4 class="card-title">{$oMedienDatei->cName}</h4>
                                        <div class="row">
                                            {if !empty($oMedienDatei->cBeschreibung)}
                                                <div class="col-12 mediafiles-description">
                                                    {$oMedienDatei->cBeschreibung}
                                                </div>
                                            {/if}
                                            <div class="col-12">
                                                {if $shopIsAtLeast53}
                                                    {include 'snippets/video.tpl' video=$oMedienDatei->video}
                                                {else}
                                                    <video class="product-detail-video mw-100" controls>
                                                        <source src="{$ShopURL}/{$smarty.const.PFAD_MEDIAFILES}{$oMedienDatei->cPfad}" type="video/{$oMedienDatei->videoType}">
                                                        {lang key='videoTagNotSupported' section='errorMessages'}
                                                    </video>
                                                {/if}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            {else}
                                {lang key='videoTypeNotSupported' section='errorMessages'}
                            {/if}
                        {/block}
                    {* Sonstiges *}
                    {elseif $oMedienDatei->nMedienTyp === 4}
                        {block name='productdetails-mediafile-misc'}
                            <div class="card">
                                <div class="card-body">
                                    <h4 class="card-title">{$oMedienDatei->cName}</h4>
                                    <div class="row">
                                        {if !empty($oMedienDatei->cBeschreibung)}
                                            <div class="col-12 mediafiles-description">
                                                {$oMedienDatei->cBeschreibung}
                                            </div>
                                        {/if}
                                        <div class="col-12">
                                            {if !empty($oMedienDatei->video) && $shopIsAtLeast53}
                                                {include 'snippets/video.tpl' video=$oMedienDatei->video class='yt-container'}
                                            {elseif strpos($oMedienDatei->cURL, 'youtube') !== false || strpos($oMedienDatei->cURL, 'youtu.be') !== false}
                                                {include file='productdetails/mediafile_youtube_embed.tpl'}
                                            {else}
                                                {if isset($oMedienDatei->oEmbed) && $oMedienDatei->oEmbed->code}
                                                    {$oMedienDatei->oEmbed->code}
                                                {/if}
                                                {if !empty($oMedienDatei->cPfad)}
                                                    <p>
                                                        <a href="{$ShopURL}/{$smarty.const.PFAD_MEDIAFILES}{$oMedienDatei->cPfad}" target="_blank">{$oMedienDatei->cName}</a>
                                                    </p>
                                                {elseif !empty($oMedienDatei->cURL)}
                                                    <p>
                                                        <a href="{$oMedienDatei->cURL}" target="_blank"><i class="{et_getIcon key="mediaLink"}"></i> {$oMedienDatei->cName}</a>
                                                    </p>
                                                {/if}
                                            {/if}
                                        </div>
                                    </div>
                                </div>
                            </div>
                        {/block}
                        {* PDF *}
                    {elseif $oMedienDatei->nMedienTyp == 5}
                        {block name='productdetails-mediafile-pdf'}
                            <div class="card">
                                <div class="card-body">
                                    <h4 class="card-title">{$oMedienDatei->cName}</h4>
                                    <div class="row">
                                        {if !empty($oMedienDatei->cBeschreibung)}
                                            <div class="col-12 mediafiles-description">
                                                {$oMedienDatei->cBeschreibung}
                                            </div>
                                        {/if}
                                        <div class="col-12">
                                            {if !empty($oMedienDatei->cPfad)}
                                                <a class="text-decoration-none-util"
                                                    href="{$ShopURL}/{$smarty.const.PFAD_MEDIAFILES}{$oMedienDatei->cPfad}"
                                                    target="_blank"
                                                >
                                                    {image alt="PDF" src="{$ShopURL}/{$smarty.const.PFAD_BILDER}intern/file-pdf.png" lazy=$lazyLoadImages}
                                                    <span class="text-decoration-underline" >{$oMedienDatei->cName}</span>
                                                </a>
                                            {elseif !empty($oMedienDatei->cURL)}
                                                <a class="text-decoration-none-util" href="{$oMedienDatei->cURL}"  target="_blank">
                                                    {image alt="PDF" src="{$ShopURL}/{$smarty.const.PFAD_BILDER}intern/file-pdf.png" lazy=$lazyLoadImages}
                                                    <span class="text-decoration-underline">{$oMedienDatei->cName}</span>
                                                </a>
                                            {/if}
                                        </div>
                                    </div>
                                </div>
                            </div>
                        {/block}
                    {/if}
                {/if}
            {/if}
        {/foreach}
        </div>
    {/if}
{/block}
