DEPRECATION WARNING

This documentation is not using the current rendering mechanism and is probably outdated. The extension maintainer should switch to the new system. Details on how to use the rendering mechanism can be found here.

EXT: CSS styled Filelist¶

Author:	Rupert Germann
Created:	2004-07-31T12:12:38
Changed by:	Juraj Šulek
Changed:	2010-09-17T12:11:13.500000000
Email:	juraj@sulek.sk
Info 2:
Info 3:
Info 4:

EXT: CSS styled Filelist¶

Extension Key: css_filelinks

This document is published under the Open Content License

available from http://www.opencontent.org/opl.shtml

The content of this document is related to TYPO3

- a GNU/GPL CMS/Framework available from www.typo3.com

Table of Contents¶

EXT: CSS styled Filelist 1

Introduction 1

What does it do? 1

Users manual 1

Installation 1

Quick start: 2

Configuration 3

fileList 3

description 3

additional class 3

classes 3

layout 4

linkProc 7

Read from Path 8

Configure the layout per filetype 8

Important 9

To-Do list 10

Changelog 10

Introduction¶

What does it do?¶

Extension to make the Filelinks(“tt_content.uploads”) CSS compatible and more typoscript configurable.

Features:

User defined additional classes depending on file-extension.
Better Typoscript configuration
Layout definition.
USER defined placeholders
Preparation for DAM integration (Filelinks DAM usage)

Users manual¶

Installation¶

By installation you can chose some options:

Don't insert _CSS_DEFAULT_STYLE¶

With this first checkbox can you disable inserting form <style> tag with default CSS for this extension direct to HTML. The default CSS can also be disabled with this typoscript:

plugin.tx_cssfilelist._CSS_DEFAULT_STYLE >

Allow the “Read from path¶

With this second checkbox can you enable or disable the field “Read from path”.

Into this field can you enter a directory and all files from this directory will be shown so you don't need to add eachfile separately. If you enter a directory into this field the files inserted to field “Files” will be ignored. For more details about the use from this field see the “Read from Path” section.

The Filelinks field is DAM¶

If you have installed DAM and CSS Multimedia extensions and the CSS Filelinks extension doesn't work you should try to check this checkbox. Because the CSS Multimedia change automatically the Media field to DAM reference field if the DAM is installed and so the CSS Filelinks need to work with this field differently. But it is impossible in some version from Typo3 to check if this field is a DAM reference or not(On FE return it the old TCA but on BE is the new TCA in which the Media field is modified). If you check this checkbox but you don't have installed DAM or CSS Multimedia this setting will be ignored and the Media field will be processed as a normal field.

Path to file icons¶

Default the extensions add to css the path to fileicons as /typo3/gfx/fileicons/ or /t3lib/gfx/fileicons/. If you want to change this e.g. to typo3/gfx/fileicons/ (without slash on beginning) you can use this field. The only requirement is that in this directory must be file “default.gif”.

Quick start:¶

This extension works with an user-function:

userFunc=tx_cssfilelinks->renderFileLinks

This function need some typoscript to correct work. I don't write the full path - you muss give

tt_content.uploads.20.

to all typoscripts in this manual.

E.g. Typoscript:

fileList.field=media

should by

tt_content.uploads.20.fileList.field=media

Configuration¶

fileList¶

fileList{
        field=media
        path=uploads/media/
        path.override.field=select_key
        path.override.listNum=first
        path.override.listNum.splitChar=|
        override.filelist.field=select_key
}

This typoscript say where the filenames are stored and which path to use. This is by default added and you don't need to change it if you use the default media database field.

description¶

description.field=imagecaption
description_ifElementEmpty=###FILENAME###

description and description_ifElementEmpty have stdWrap properties.

::¶

description

description

b

Here the description for files should be stored. You can use stdWrap properties e.g. description.field, description.ifEmpty.field description.value(...) ... Default is this set to description.field=imagecaption

::¶

description

description_ifElementEmpty

b

Define what should be used for description if the description for an element is empty. E.g.

we have this settings:

description.field=imagecaption

description_ifElementEmpty=###FILENAME###

And this description:

“Description 1

Description2

Description4”

the 3-rd element has no description and the ###FILENAME### placeholder will be used. (If you install the dam usage for filelist, you can define which field should be used if the description is empty by this setting: dam.damDescription=field )

additional class¶

additionalClass{
        image=bmp,gif,ico,jpg,png,tiff
        video=wmv,avi,asf,mpg
        audio=mp3,wav,mid
}

This class replace the marker ###ADDITIONALCLASS###(see the layout section). So you can define an additional class depending on file extension. The syntax is simply:

additionalClass.classname=fileextensions separed by ','

EXAMPLE:

additionalClass.image=bmp,ico
additionalClass.stuff=bmp

filename¶

a

filename

b

Additional class

image.bmp¶

a

image.bmp

b

image stuff

image.ico¶

a

image.ico

b

image

document.doc¶

a

document.doc

b

classes¶

Classes{
        addFirst=1
        addLast=1
        addOdd=1
        addEven=1
        ext.prefixIfFirstNumber=
}

The values first,last,even and odd will replace the marker ###FIRSTLASTODDEVEN###(see the layout section).

::¶

Classes

classes.addFirst

b

If the class “first” should be added to the first element.

::¶

Classes

classes.addLast

b

If the class “last” should be added to the last element

::¶

Classes

classes.addOdd

b

If the class “odd” should be added to every odd element.

::¶

Classes

classes.addEven

b

If the class “even” should be added to every even element.

::¶

Classes

classes.ext.prefixIfFirstNumber

b

If the file extension start with a number e.g. *.3df. Then by ###FILEEXT### and ###CLASS### the inserted value will not be a right class definition because the class cannot start with a number. Here you can define a string that will be added to the beginning of the file extension if the file extension starts with a number.

E.g. if you set this:

classes.ext.prefixIfFirstNumber=num

and the file extension is

3ds

the value inserted into ###FILEEXT### and ###CLASS### will be

num3ds

if you set this to blank then only the file extension without prefix will be inserted.

layout¶

layout{
        global=<div class="l###LAYOUT###"><span class="filecount">###FILECOUNT###</span>###FILE###</div>
        file=<a href="###URL###" class="###CLASS###" ###TARGET###>###COUNTER###) ###TITLE### ###FILESIZE###</a>
        fileSize{
                layout=(###SIZE### ###SIZEFORMAT###)
                char=none
                format=auto
                desc=b|kb|mb
                round=2
                decimalPoint=.
        }
}

::¶

layout

layout.global

b

the layout of the whole extension

::¶

layout

layout.file

b

the layout of one file

::¶

layout

layout.fileSize.layout

b

layout of the ###FILESIZE### placeholder

::¶

layout

layout.fileSize.char

b

Say if the characters by ###SIZEFORMAT### should by converted to uppercase or lowercase. Possible options are "upper","lower","firstUpper","firstLower","none". If you enter none you become the original ###SIZEFORMAT### without lower-uppercase conversion.

::¶

layout

layout.fileSize.format

b

Which format should the size have. Posible values are b-bite, kb- kilobite, mb-megabite, auto.

::¶

layout

layout.fileSize.round

b

Set number of digits after the decimal point.

::¶

layout

layout.fileSize.desc

b

You cann set the description for b,kb and mb the syntax is

layout.fileSize.desc=bitedesc| kilobitedesc | megabitedesc

EXAMPLE

by layout.fileSize.desc=kbite|mbite|mgbite

you will become such values 12.01 kbite or 10.00 mbite etc.

::¶

layout

layout.hideNotProcessedMarkers

b

If this is set to 1 then all not processed placeholders are deleted.

E.g. If you set a placeholder ###test### and you don't use this placeholder, with this setting this placeholder don't appear on the frontend.

::¶

layout

layout.fileSize.decimalPoint

b

With this option you can define the decimail point character by filesize. Default this is set to “.” so you will become e.g. “12.34 Kb”.

((generated))¶

stdWrap properties¶

layout.global, layout.file and layout.fileSize.layout have stdWrap properties so you can use e.g. this code:

tt_content.uploads.20.layout.file >
tt_content.uploads.20.layout.file.cObject=COA
tt_content.uploads.20.layout.file.cObject{
        wrap=<div class="###CLASS###">|</div>
        10 = TEXT
        10.wrap=<span>|</span>
        10.value=<a href="###URL###">###TITLE###</a>
        20 <.10
        20.value=###FILESIZE###
        30 < .20
        30.value=###DESCRIPTION###
}

Placeholders¶

###FILE###¶

for layout.global only

###FILE###

b

where the files should be putt

###URL###¶

for layout.file only

###URL###

b

Insert file url.

###CLASS###¶

for layout.file only

###CLASS###

b

This placeholder includes ###FILEEXT### ###ADDITIONALCLASS### ###FIRSTLASTODDEVEN###.

###TARGET###¶

for layout.file only

###TARGET###

b

Insert linkProc.target property

###FILEEXT###¶

for layout.file only

###FILEEXT###

b

Insert File extension. This placeholder can be used in class e.g.

###ADDITIONALCLASS###¶

for layout.file only

###ADDITIONALCLASS###

b

Insert additional class (see the Additional Class section)

###FIRSTLASTODDEVEN###¶

for layout.file only

###FIRSTLASTODDEVEN###

b

Insert the class values first, last, even and odd. (see the classes section)

###COUNTER###¶

for layout.file only

###COUNTER###

b

Insert A simple counter, the first file have counter=1

###ICON###¶

for layout.file only

###ICON###

b

Insert a image with icon or thumbnail in dependence on linkProc.iconCObject settings.

If you set linkProc.iconCObject.makeThumbs=1 then this extension will create thumbnails for images instead from icons.

###TITLE###¶

for layout.file only

###TITLE###

b

Insert file name (if you install the dam usage for filelist, you can define which field should by used as title) if you select linkproc.removePrependedNumbers=1 you will become instead from e.g. “filename_01.jpg” this “filename.jpg”

You can use this typoscript: “title.trimExt=1” if you want to remove the file-extension from title.

###FILENAME###¶

for layout.file only

###FILENAME###

b

Insert file name. Ignore the linkproc.removePrependedNumbers property and dam usage.

###DESCRIPTION###¶

for layout.file only

###DESCRIPTION###

b

Insert description from description field from backend. If you use dam, you can define a tx_dam field from which the description for each file should be taken. For more info see the Manual to “Filelink DAM usage” extension.

###FILESIZE###¶

for layout.file only

###FILESIZE###

b

Insert the layout.fileSizeelement if show filesizesin filelinks backend is allowed. This placeholder is made to supply the show filesizesfunctionality. If you dont need this functionality you cann set the:

...file=.... ###TITLE### (###SIZE### ###SIZEFORMAT###)...

instead off

...file=.... ###TITLE### ###FILESIZE###...

this will work too.

###SIZE###¶

for layout.file only

###SIZE###

b

Insert file size.

###SIZEFORMAT###¶

for layout.file only

###SIZEFORMAT###

b

Insert filesize format (see layout.fileSize.format).

###FILECOUNT###¶

for both

###FILECOUNT###

b

Insert file count.

###LAYOUT####¶

for both

###LAYOUT####

b

Insert the value from layout field from filelinks backend.

User defined placeholders¶

layout{
        userMarker{
                global{
                        MARKER1=TEXT
                        MARKER1.value=test
                }
                file{
                        ICON2 = USER
                        ICON2.userFunc=tx_cssfilelinks->Icons
                }
                dam{
                        FILECREATE=date_cr,date_mod
                        AUTOR=autor
                }
        }
}

There are 3 types of user defined placeholders:

global
file
dam

The first 2 have this SYNTAX:

layout.userMarker.global.USRMARKER=USER
layout.userMarker.global.USRMARKER.userFunc=someClass->someFunction

this marker can be than used this way

layout.global=<div class="###LAYOUT###">###USRMARKER###

File markers have the same syntax.

DAM userMarker:

The last one (the dam) has this SYNTAX:

layout.userMarker.dam.USRMARKER = tx_dam table field names separed by ','

To use this last marker you need to install Filelinks DAM usage (dam_filelinks). If you add more then one field - the last not empty field will be chosen.

Warning: The markers are case sensitive.

This extension add some data to the userMarker.global and userMarker.file typoscript before this typoscript will be processed.

::¶

For global marker

markerData.fileCount

b

file count

::¶

For global marker

markerData.fileLayout

b

the layout field from filelinks backend

::¶

For file marker

markerData.fileUrl

b

file url

::¶

For file marker

markerData.fileName

b

file name

::¶

For file marker

markerData.fileTitle

b

file title

::¶

For file marker

markerData.fileSize

b

file size

::¶

For file marker

markerData.fileExt

b

file extension

::¶

For file marker

markerData.dam

b

If this file was obtained from dam database using the “Dam filelinks usage” extension the markerData.dam will contain the ID from this file, otherwise it will be null.

::¶

For file marker

markerData.fileCount

b

file count

::¶

For file marker

markerData.fileLayout

b

the layout field from filelinks backend

so if you use this code:

layout.userMarker{
        file.ICON = USER
        file.ICON.userFunc=myClass->Icons
}

it changes to

layout.userMarker{
                file.ICON = USER
                file.ICON.userFunc=myClass->Icons
                file.ICON.markerData{
                        fileUrl=...
                        fileName=...
                        fileTitle=...
                        fileSize=...
                        fileExt=...
                        dam=...
                        fileCount=...
                        fileLayout=...
                }
}

and so you can use the markerData in your own scripts

EXAMPLE:¶

For userMarker.file( userMarker.global has the same syntax).

If you want create your own function for icon creating you can make it follows:

layout{
        file=<a href="###URL###" class="###CLASS###">###ICON2### ###TITLE### ###FILESIZE###</a>
        userMarker{
                file.ICON2 = USER
                file.ICON2.userFunc=myClass->Icons
        }
}

and the function can be:

function Icons($content,$conf){
        return '<img src="typo3/gfx/fileicons/'.$conf['markerData.']['fileExt'].'.gif" alt="'.$conf['markerData.']['fileTitle'].'" />';
}

For userMarker.dam:

If you will use this marker you muss install the “Filelist DAM usage(dam_filelist)”. You can show e.g. Autor from that file with this code:

layout{
        file=<a href="###URL###" class="###CLASS###">###AUTOR### ###TITLE### ###FILESIZE###</a>
        userMarker.dam.AUTOR=autor
}

where autor is a field in tx_dam table.

linkProc¶

linkProc {
        target = _blank
        jumpurl = {$styles.content.uploads.jumpurl}
        jumpurl.secure = {$styles.content.uploads.jumpurl_secure}

        removePrependedNumbers = 1

      alternativeIconPath=fileadmin/icons/

      iconCObject = IMAGE
        iconCObject.makeThumbs=0
        iconCObject.file.import.data = register : ICON_REL_PATH
        iconCObject.file.width = 150
}

::¶

linkProc

target

b

Target value for links. If you let this blank the target will not be inserted

::¶

linkProc

jumpurl

b

If you set this to 1 the links will not be “upload/file.jpg” but some like “ http://www.site.com/index.php?id=1&type=0&jumpurl=uploads%2Ffile ”.jpg” and you can secure the “upload” directory e.g. width _htaccess.

::¶

linkProc

jumpurl.secure

b

If you set this to 1 the links will be like “ http://lwww.site.com/in dex.php?id=1&type=0&jumpurl=uploads%2Ffile.jpg&juSecure=1&locationData =9%3Att_content%3A44&juHash=2469f79328 ” which is more secure like only with jumpurl setting.

::¶

linkProc

alternativeIconPath

b

Standard the path where this extension search for icons is 't3lib/gfx/fileicons/'. If you enter an path here then this extension will search for icons in this path. If no matching icon is found it checks for default.gif, if this is not found it search in old path(t3lib/gfx/fileicons/').

::¶

linkProc

removePrependedNumbers

b

If you set this to 1 then if you have file like file_01.jpg the title will be not file_01.jpg but file.jpg.

::¶

linkProc

iconCObject

b

With this cObject you can set how the ###ICON### marker should see.

::¶

linkProc

iconCObject.makeThumbs

b

If you set this to 1 then by images thumbs will be created instead from icons. This option has stdWrap properties.

::¶

linkProc

iconCObject.file.width

b

The width of an icon.

Read from Path¶

Into this field can you enter a directory and all files from this directory will be shown so you don't need to add eachfile separately

The value can be exploded by "|" into parameters:

1: The path

2: comma-list of allowed extensions (no spaces between); if empty all extensions goes.

3: sorting: name, size, ext, date

4: reverse: Set to "r" if you want a reversed sorting

Example:

with command

“fileadmin/myOrder/|jpg,gif,png|name|r”

you will become all jpg, gif and png files from fileadmin/myOrder directory sorted by name reverse.

Configure the layout per filetype¶

((generated))¶

EXAMPLE:¶

filetype.pdf.cObject=COA
filetype.pdf.cObject{
        wrap=<p>|</p>
        10 = TEXT
        10.wrap=<span>|</span>
        10.value=<a href="###URL###">###ICON###</a>   <a href="javascript:window.open('http://docs.google.com/viewer?url={$config.baseURL}###URL###&embeded=true&hl=de','###TITLE###','width=1050,height=760')">###TITLE### ###FILESIZE###</a>
}

Important¶

If you use “Filelinks DAM usage(dam_filelinks)” then by css_filelinks version 0.2.0 and higher you must use dam_filelinks 0.3.0 and higher. This is because until css_filelinks version 0.2.0 was DAM usage hardcoded to this extension and after 0.2.0 all DAM stuff was removed and the dam_filelinks must use hooks. So by css_filelinks < 0.2.0 you must use dam_filelinks < 0.3.0 and by css_filelinks >= 0.2.0 you must use dam_filelinks >= 0.3.0.

To-Do list¶

Nothing yet.

Changelog¶

Changes in css_filelinks 0.2.19

added possibility to configure the layout per filetype (thx. to Reinhard Handler)

Changes in css_filelinks 0.2.18

#6643 fixed

Changes in css_filelinks 0.2.17

ereg_replace replaced by preg_replace

Changes in css_filelinks 0.2.16

New parameter added to hook "getFileUrl"(due to the new dam_filelinks functionality linkProc.jumpurl.damSecure).

Changes in css_filelinks 0.2.15

layout.decimalPoint added

Changes in css_filelinks 0.2.14

Bug repaired by getIcon hookfunction

Changes in css_filelinks 0.2.13

Bug repaired by(linkProc.iconCObject.makeThumbs=1)(thx. to Robert Lockerbie for patch)

Changes in css_filelinks 0.2.12

title.trimExt added.

Changes in css_filelinks 0.2.11

“Path to file icons” added

Changes in css_filelinks 0.2.10

bug repaired (thx. to Peter Bachmann for hint)

Changes in css_filelinks 0.2.9

bug #3796 repaired (thx. to Jan-Claas Dirks)

Changes in css_filelinks 0.2.8

classes.ext.prefixIfFirstNumber added
bug repaired by XCLASS definition

Changes in css_filelinks 0.2.7

iconCObject.makeThumbs has now stdWrap properties

Changes in css_filelinks 0.2.6

Changes by "Read from path" typoscript and php to allow all "stdWrap.filelist" parameters

Changes in css_filelinks 0.2.5

Because the CSS Multimedia change the media field to DAM reference field if DAM is installed the CSS Filelinks did not work correct, this problem is now solved

Changes in css_filelinks 0.2.4

”Read from path” field added

Changes in css_filelinks 0.2.3

just some changes in manual

Changes in css_filelinks 0.2.2

css updated: try to find icons on 2 places: t3lib/gfx/ and typo3/gfx/

Changes in css_filelinks 0.2.1

bug repaired thx. to Pieter for hint

Changes in css_filelinks 0.2.0

all dam stuff is removed from css_filelinks and dam_filelinks use now hooks

Changes in css_filelinks 0.1.8

bug repaired

Changes in css_filelinks 0.1.7

try to find the default icon configuration on 2 places: t3lib/gfx/ and typo3/gfx/

Changes in css_filelinks 0.1.6

bug repaired by jumpurl.secure (thx. to Herbert Roider)
alternativeIconPath added (thx. to Alex Widschwendter for patch)
manual changed

Changes in css_filelinks 0.1.5

manual changed

Changes in css_filelinks 0.1.4

hooks to every function added for better extending
###FILENAME### placeholder added
description_ifElementEmpty property added
manual changed

Changes in css_filelinks 0.1.3

stdWrap properties for: layout.global, layout.file, layout.filesize.layout

Changes in css_filelinks 0.1.2

bug repaired (thx. to Daniel Costas)

Changes in css_filelinks 0.1.1

properties linkProc.target, linkProc.jumpurl, linkProc.jumpurl.secure and linkProc.removePrependedNumbers added
added marker ###TARGET###
added marker ###ICON###
manual changes

Changes in css_filelinks 0.1.0

manual changes
if file don't exist on disk it will not appear on frontend
icon added

Changes in css_filelinks 0.0.11

page TSconfig added
css changes
default layout changes
manual changes

Changes in css_filelinks 0.0.10

description.field property added
manual changes

Changes in css_filelinks 0.0.9

Better Dam integration
manual changes

Changes in css_filelinks 0.0.8

PHP changes
better PHP comments

Changes in css_filelinks 0.0.7

New default CSS
New default file and global layout
Edit icon for frontend editing added
added property layout.hideNotProcessedMarkers
added layout.userMarkers.dam

Changes in css_filelinks 0.0.6

added markerData.fileCount and markerData.fileLayout to layout.userMarker.file
added ###FILEEXT###, ###ADDITIONALCLASS###, ###FIRSTLASTODDEVEN###
added classes.addFirst=1, classes.addLast=1, classes.addOdd=1, classes.addEven=1
manual changes

Changes in css_filelinks 0.0.5

manual changes
userdefined markers

Changes in css_filelinks 0.0.4

manual changes
bug repair

Changes in css_filelinks 0.0.3

manual changes

Changes in css_filelinks 0.0.2

layout.Filesize.format=auto added

css_filelinks 0.0.1

first release

EXT: CSS styled Filelist - 12