3

Is it possible to create a image selection field with Flux/Fluid FlexForms like the default TYPO3-Image-ContentElement?

And if yes, how?

I could only create a input field (with wizard) that links to the files table. This is the code:

<flux:flexform.field.input name="file" eval="trim">
    <flux:flexform.field.wizard.link allowedExtensions="jpg,jpeg,png,gif"/>
</flux:flexform.field.input>

But i want it like the TYPO3-Image-ContentElement with thumbnail, filename etc..

native TYPO3 6.1 image selection this is how my fluid image field looks like

biesior
  • 55,576
  • 10
  • 125
  • 182
Benjamin
  • 961
  • 1
  • 11
  • 23

5 Answers5

4

This feature has been added to the current flux master on github.

You can use it like this:

<flux:flexform.field.inline.fal name="myimage"
     multiple="TRUE" maxItems="5"
     enabledControls="{info:1,new:1,dragdrop:1,sort:1,hide:1}"/>
cweiske
  • 30,033
  • 14
  • 133
  • 194
Benjamin
  • 961
  • 1
  • 11
  • 23
3

Maybe someone wants the solution with the current version of flux (7.4.0):

Make the Backend-Field:

<flux:field.inline.fal name="bild" showThumbs="true" allowedExtensions="'gif,jpg,jpeg,tif,tiff,bmp,pcx,tga,png,pdf,ai,svg'" maxItems="1" required="true" />

Call the Image:

{v:content.resources.fal(field: 'bild') -> v:iterator.first() -> v:variable.set(name: 'bild')}
    <f:image treatIdAsReference="1" src="{bild.id}" title="{bild.title}" alt="{bild.alternative}" maxWidth="80" maxHeight="50" crop="{bild.crop}"/>

Full code for my content-element:

<f:layout name="Content"/>

<f:section name="Configuration">
    <flux:form id="footerbild" options="{group: 'FeWo-Seiteninhalte'}">

        <flux:field.inline.fal name="bild" showThumbs="true" allowedExtensions="'gif,jpg,jpeg,tif,tiff,bmp,pcx,tga,png,pdf,ai,svg'" maxItems="1" required="true" />

    </flux:form>
</f:section>

<f:section name="Preview">

    {v:content.resources.fal(field: 'bild') -> v:iterator.first() -> v:variable.set(name: 'bild')}
    <f:image treatIdAsReference="1" src="{bild.id}" title="{bild.title}" alt="{bild.alternative}" maxWidth="80" maxHeight="50" crop="{bild.crop}"/>

</f:section>


<f:section name="Main">

    {v:content.resources.fal(field: 'bild') -> v:iterator.first() -> v:variable.set(name: 'bild')}
    <f:image class="img-responsive" treatIdAsReference="1" src="{bild.id}" title="{bild.title}" alt="{bild.alternative}" crop="{bild.crop}"/>

</f:section>

This does the following in preview:

preview

And this in backend plugin:

Plugin-view

It supports Image-Upload, image-crop with the built-in editor etc.

ljedrz
  • 20,316
  • 4
  • 69
  • 97
Naderio
  • 1,306
  • 11
  • 26
0

The only one way at the moment - to create a new custom field with custom rendering and logic. It's preferable to use the Core to create fields.

You could check the method in the sources of flux extension. Check how classes and wizards are made.

There is similar problem on 4.5.x LTS for DAM support.

Fedir RYKHTIK
  • 9,844
  • 6
  • 58
  • 68
  • 1
    Yes you are right - the table structure of FAL is similar to DAM. But i think it might be possible to create a native like field with flexform.field.inline (IRRE Records). I will wait, maybe someone else has a solution.. https://fedext.net/viewhelpers/flux/Flexform/Field/InlineViewHelper.html – Benjamin Oct 24 '13 at 13:45
  • That will be great to find more simple solution. – Fedir RYKHTIK Oct 24 '13 at 14:05
  • 2
    I would - like Benjamin suggests - try my way with the `flux:flexform.field.inline` ViewHelper. It should allow you sufficient control to create new DAM-relation records. – Claus Due Oct 24 '13 at 14:26
  • Here is the field configuration needed: http://wiki.typo3.org/File_Abstraction_Layer#TCA But there are some configuration values flux seems to be missing: - foreign_match_fields - foreign_selector_fieldTcaOverride - filter I will keep this question up to date with my progress .. – Benjamin Oct 25 '13 at 16:36
  • @Benjamin You could make a custom field, which will add configuration You need. Look how File field is defined, in flux, You could create a Media field with similar properties. Only 2 files needed to achieve the goal, if I remember correctly. – Fedir RYKHTIK Oct 27 '13 at 13:30
0

I did a viewHelper with flux 6.0.1 to have the same media field.

But i test the version from github and mine and we have the same problem : the copy/paste of a content with this type of field don't copy the media. The record from the table sys_file is not copied.

I think typo3 team have the same problem and it's why they don't use this type of field in the "text image" and "image" contents

TeddyBear
  • 1
  • 1
0

How about this: Not really FAL support but it works and no file numbers are shown. Depends on the upload-Folder.

<flux:flexform.sheet name="slider" label="Slider Bilder - Startseite">
  <flux:flexform.section name="sliderImagges">
    <flux:flexform.object name="image" >
      <flux:flexform.field.input name="linkTitle" label="Titel" /> 
        <flux:flexform.field.file name="image" label="Bild"
      uploadFolder="uploads/pics/"
      validate="trim" size="1" showThumbs="1"
      internalType="file" allowed="jpg,png,gif" />
        <flux:flexform.field.input name="url" label="Ziel des Links">
    <flux:flexform.field.wizard.link activeTab="page" />
      </flux:flexform.field.input>
    </flux:flexform.object>
  </flux:flexform.section>
</flux:flexform.sheet>
Eumolpius
  • 87
  • 9