Как получить видео / медиаресурс из flexform с помощью Typoscript

Я использую flexform для выбора фоновых изображений для элементов раздела html.

Выглядит так: dataWrap = |

    dataWrap.override.stdWrap.cObject = COA
    dataWrap.override.stdWrap.cObject {
        10 = TEXT
        10.dataWrap = <section class="content {field:flexform_mdCol1} {field:flexform_mdCol2} {field:flexform_col21class}
        20 = TEXT
        20.value = " style="background-image: url(/
        30 = IMG_RESOURCE
        30 {
            file.import.data = field:flexform_mdCol3
        }
        40 = TEXT
        40.value = );">|</section>
    }
    dataWrap.override.if.isTrue.field = flexform_mdCol3

Проблема в том, что это не работает с видео. Я создал второе поле (mdCol4), чтобы выбрать видео mp4 и поле mdCol3 в качестве плаката и фона в худшем случае. Выглядит так, но не работает.

    dataWrap.override.stdWrap.cObject = COA
    dataWrap.override.stdWrap.cObject {
        10 = TEXT
        10.dataWrap = <section class="content {field:flexform_mdCol1} {field:flexform_mdCol2} {field:flexform_col21class}

        20 = TEXT
        20.value = " style="background-image: url(/
        30 = IMG_RESOURCE
        30 {
            file.import.data = field:flexform_mdCol3
        }
        40 = TEXT
        40.value = );">

        50 = TEXT
        50.value = <video width="1920" height="1080" autoplay loop muted playsinline poster="/
        60 = IMG_RESOURCE
        60 {
            file.import.data = field:flexform_mdCol3
        }
        70 = TEXT
        70.value = ">

        80 = TEXT
        80.value = <source src="/
        90 = IMG_RESOURCE
        90 {
            file.import.data = field:flexform_mdCol4
        }
        100 = TEXT
        100.value = " type="video/mp4"></video>|</section>
    }
    dataWrap.override.if.isTrue.field = flexform_mdCol4

Плакат и фон появляются, но кажется, что IMG_RESOURCE не работает для видео, и я не смог найти какие-то похожие.

TYPO3 - это 8.7.18. Это ошибка или я просто тупой? :)

Любая помощь действительно приветствуется. Заранее спасибо!


person lufi    schedule 11.09.2018    source источник


Ответы (3)


Благодаря подходу и помощи Бернд, вот решение:

    dataWrap.override.stdWrap.cObject = COA
    dataWrap.override.stdWrap.cObject {
        10 = TEXT
        10.dataWrap = <section class="content video {field:flexform_mdCol1} {field:flexform_mdCol2} {field:flexform_col21class}

        20 = TEXT
        20.value = " style="background-image: url(/
        30 = IMG_RESOURCE
        30 {
            file.import.data = field:flexform_mdCol3
        }
        40 = TEXT
        40.value = );">

        50 = TEXT
        50.value = <video width="1920" height="1080" autoplay loop muted playsinline poster="/
        60 = IMG_RESOURCE
        60 {
            file.import.data = field:flexform_mdCol3
        }
        70 = TEXT
        70.value = ">

        75 = CONTENT
        75 {
            table = tt_content
            select {
                table = tt_content
                uid.data = field:uid
            }

            renderObj = COA
            renderObj {
                10 = TEXT
                10 {
                    data = flexform: pi_flexform:flexform_mdCol4
                }
            }
        }

        80 = TEXT
        80.value = <source src="/
        90 = FILES
        90 {
            files.dataWrap = {field:flexform_mdCol4}

            renderObj = TEXT
            renderObj.stdWrap.data = file:current:publicUrl
            renderObj.stdWrap.wrap = |
        }
        100 = TEXT
        100.value = " type="video/mp4"></video>|</section>
    }
    dataWrap.override.if.isTrue.field = flexform_mdCol4
person lufi    schedule 12.09.2018

видео - это не изображение. Создание IMG_RESOURCEобъекта начинается с анализа изображения и изменения размера, если это необходимо.

если вам просто нужен URL-адрес файла, вам не нужна обработка изображений. Просто используйте общедоступный URL:

90 = FILES
90 {
    // if it is exact one file:
    files = flexform_mdCol4

    // otherwise use references:
    # references {
    #     table = tt_content
    #     uid.field = uid
    #     fieldname = flexform_mdCol4
    # }

    renderObj = TEXT
    renderObj.data = file:current.publicUrl
}
person Bernd Wilke πφ    schedule 12.09.2018
comment
Большое спасибо за Вашу помощь. Я пробовал оба способа и разные варианты, которые нашел в Интернете. Но по какой-то причине это все равно не работает. - person lufi; 12.09.2018
comment
Я обнаружил две вещи. Спасибо еще раз. renderObj.data = file: current.publicUrl должен быть renderObj.data = file: current: publicUrl. И если я заменю files = flexform_mdCol4 на files = 1177, uid файла, он заработает. Любая идея, что это может быть? - person lufi; 12.09.2018

только для искусства:

Я забыл заметить вас о возможностях создания чистого кода с помощью опечаток.

вы разделили свои обертки на разные объекты в массиве. это немного плохо для чтения и определения того, что должно быть вместе.

вот мой вариант вашего решения:

Я думаю, что чего-то не хватает в 30 (ваш 75), так как он будет отображать только список uid sys_file без использования / переноса.

dataWrap.override.cObject = COA
dataWrap.override.cObject {
    10 = IMG_RESOURCE
    10 {
         file.import.field = flexform_mdCol3
         dataWrap = <section class="content video {field:flexform_mdCol1} {field:flexform_mdCol2} {field:flexform_col21class}" style="background-image: url(|);">
    }

    20 = IMG_RESOURCE
    20 {
        file.import.data = field:flexform_mdCol3
        wrap = <video width="1920" height="1080" autoplay loop muted playsinline poster="|">
    }

    30 = CONTENT
    30 {
        table = tt_content
        select {
            table = tt_content
            uid.data = field:uid
        }

        renderObj = TEXT
        renderObj {
            data = flexform: pi_flexform:flexform_mdCol4
        }
    }

    40 = FILES
    40 {
        files.field = flexform_mdCol4

        renderObj = TEXT
        renderObj.data = file:current:publicUrl

        wrap = <source src="#" type="video/mp4"></video>|</section>
        wrap.splitChar= #
    }
}
dataWrap.override.if.isTrue.field = flexform_mdCol4

обратите внимание на измененный splitChar в 40, поэтому символ вертикальной черты можно использовать как есть.

person Bernd Wilke πφ    schedule 13.09.2018