Как получить Видео / Медиа Ressouce из flexform с Typoscript - PullRequest
Новая
       7

Как получить Видео / Медиа Ressouce из flexform с Typoscript

0 голосов
/ 11 сентября 2018

Я использую 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. Это ошибка или я просто тупой? :)

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

Ответы [ 3 ]

0 голосов
/ 12 сентября 2018

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

    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
0 голосов
/ 13 сентября 2018

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

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

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

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

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

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, так что символ трубы можно использовать как есть.

0 голосов
/ 12 сентября 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
}
...