Ein ausgewähtes Bild nicht als Thumbnail sondern in orig. Größe im Backend anzeigen

[wcm4u]

Hallo,
ich habe eine Extension gemacht um Pins im Backend auf ein Bild zu setzen. Ich möchte die Extension erweitern und brauche die folgenden Infos.
1. Wie zeige ich das ausgewählte Bild im Backend in org. Größe an?
2. Wie binde ich meine JS Funktion in meine Bearbeitungsmaske ein?
Die JS Funktion ist schon fertig und soll bei Klick auf das Bild die entsprechenden Koordinaten in das cords-Feld schreiben.
Mein dca für die Pins sieht so aus, dort soll halt das Bild in groß angezeigt werden und die JS-Funktion rein:
Brauche ich dafür ein Backend Template?

<?php
/**
 * Table tl_pinmapper
 */
$GLOBALS['TL_DCA']['tl_pinmapper_elements'] = array
(

    // Config
    'config' => array
    (
        'dataContainer'               => 'Table',
        'ptable'                      => 'tl_pinmapper',
        'enableVersioning'            => true,
        'onload_callback'             => array
        (
            array('tl_pinmapper_elements', 'updatePalette')
        ),
        'sql' => array
        (
            'keys' => array
            (
                'id' => 'primary'
            )
        )
    ),

    // List
    'list' => array
    (
        'sorting' => array
        (
            'mode'                    => 4,
            'fields'                  => array('sorting'),
            'panelLayout'             => 'filter;sort,search,limit',
            'headerFields'            => array('title'),
            'child_record_callback'   => array('tl_pinmapper_elements', 'listElements')
        ),
        
        'global_operations' => array
        (
            'all' => array
            (
                'label'               => &$GLOBALS['TL_LANG']['MSC']['all'],
                'href'                => 'act=select',
                'class'               => 'header_edit_all',
                'attributes'          => 'onclick="Backend.getScrollOffset();" accesskey="e"'
            )
        ),
        'operations' => array
        (
            'edit' => array
            (
                'label'               => &$GLOBALS['TL_LANG']['tl_pinmapper_elements']['edit'],
                'href'                => 'act=edit',
                'icon'                => 'edit.gif'
            ),
            'copy' => array
            (
                'label'               => &$GLOBALS['TL_LANG']['tl_pinmapper_elements']['copy'],
                'href'                => 'act=paste&amp;mode=copy',
                'icon'                => 'copy.gif'
            ),
            'cut' => array
            (
                'label'               => &$GLOBALS['TL_LANG']['tl_pinmapper_elements']['cut'],
                'href'                => 'act=paste&amp;mode=cut',
                'icon'                => 'cut.gif'
            )
            ,
            'delete' => array
            (
                'label'               => &$GLOBALS['TL_LANG']['tl_pinmapper_elements']['delete'],
                'href'                => 'act=delete',
                'icon'                => 'delete.gif',
                'attributes'          => 'onclick="if (!confirm(\'' . $GLOBALS['TL_LANG']['MSC']['deleteConfirm'] . '\')) return false; Backend.getScrollOffset();"'
            ),
            'toggle' => array
            (
                'label'               => &$GLOBALS['TL_LANG']['tl_pinmapper_elements']['toggle'],
                'icon'                => 'visible.gif',
                'attributes'          => 'onclick="Backend.getScrollOffset(); return AjaxRequest.toggleVisibility(this, %s);"',
                'button_callback'     => array('tl_pinmapper_elements', 'toggleIcon')
            ),
            'show' => array
            (
                'label'               => &$GLOBALS['TL_LANG']['tl_pinmapper_elements']['show'],
                'href'                => 'act=show',
                'icon'                => 'show.gif'
            )
        )
    ),

    

    // Palettes
    'palettes' => array
    (
        '__selector__'                => array(''),
        'default'                     => '{title_legend},title,published;{pinmapper_legend},cords,color;'
    ),

    // Subpalettes
    'subpalettes' => array
    (
        ''                            => ''
    ),

    // Fields
    'fields' => array
    (
        'id' => array
        (
            'sql'                     => "int(10) unsigned NOT NULL auto_increment"
        ),
        'pid' => array
        (
            'foreignKey'              => 'tl_pinmapper.title',
            'sql'                     => "int(10) unsigned NOT NULL default '0'",
            'relation'                => array('type'=>'belongsTo', 'load'=>'lazy')
        ),
        'sorting' => array
        (
            'sql'                     => "int(10) unsigned NOT NULL default '0'"
        ),
        'tstamp' => array
        (
            'sql'                     => "int(10) unsigned NOT NULL default '0'"
        ),
        'title' => array
        (
            'label'                   => &$GLOBALS['TL_LANG']['tl_pinmapper_elements']['title'],
            'exclude'                 => true,
            'filter'                  => true,
            'inputType'               => 'text',
            'sorting'                 => true,
            'flag' => 1,
            'eval'                    => array('mandatory'=>true, 'maxlength'=>255),
            'sql'                     => "varchar(255) NOT NULL default ''"
        ),
        'published' => array
        (
            'label'                   => &$GLOBALS['TL_LANG']['tl_pinmapper_elements']['published'],
            'exclude'                 => true,
            'filter'                  => true,
            'default'                 => false,
            'eval'                    => array('tl_class'=>'w50 m12'),
            'inputType'               => 'checkbox',
            'sql'                     => "char(1) NOT NULL default ''"
        ),
       'cords' => array
        (
            'label'                   => &$GLOBALS['TL_LANG']['tl_pinmapper_elements']['cords'],
            'exclude'                 => true,
            'inputType'               => 'imageSize',
            'options'                 => array('%'),
            'reference'               => &$GLOBALS['TL_LANG']['tl_pinmapper_elements']['references'],
            'eval'                    => array('rgxp'=>'digit', 'nospace'=>true, 'mandatory'=>true ,'helpwizard'=>false, 'tl_class'=>'clr'),
            'sql'                     => "varchar(128) NOT NULL default ''"
        ),
        'color' => array
        (
            'label'                   => &$GLOBALS['TL_LANG']['tl_pinmapper_elements']['color'],
            'exclude'                 => true,
            'filter'                  => true,
            'inputType'               => 'select',
            'options'                 => array('GREEN','YELLOW','RED'),
            'default'                 => 'GREEN',
            'reference'               => &$GLOBALS['TL_LANG']['tl_pinmapper_elements']['colors'],
            'eval'                    => array('mandatory'=>true, 'submitOnChange'=>true, 'tl_class'=>'w50'),
            'sql'                     => "varchar(32) NOT NULL default ''"
        )
        
    )
    
);

class tl_pinmapper_elements extends Backend
{
      /**
     * List records
     * @param array
     * @return string
     */
    public function listElements($arrRow)
    {
        $key = $arrRow['published'] ? 'published' : 'unpublished';
        $return = '<div class="cte_type ' . $key . '"><strong>' . $arrRow['title'] . '</strong></div><div>' . $GLOBALS['TL_LANG']['tl_pinmapper_elements']['references'][$arrRow['type']] . '</div>' . "\n";

        return $return;
    }
    
    
    /**
     * Update the palettes
     * @param object
     */
    public function updatePalette(DataContainer $dc)
    {}
    /**
     * Return the "toggle visibility" button
     * @param array
     * @param string
     * @param string
     * @param string
     * @param string
     * @param string
     * @return string
     */
    public function toggleIcon($row, $href, $label, $title, $icon, $attributes)
    {
        if (strlen($this->Input->get('tid')))
        {
            $this->toggleVisibility($this->Input->get('tid'), ($this->Input->get('state') == 1));
            $this->redirect($this->getReferer());
        }

        $href .= '&amp;tid='.$row['id'].'&amp;state='.($row['published'] ? '' : 1);

        if (!$row['published'])
        {
            $icon = 'invisible.gif';
        }        

        return '<a href="'.$this->addToUrl($href).'" title="'.specialchars($title).'"'.$attributes.'>'.Image::getHtml($icon, $label).'</a> ';
    }
}
?>

Viele Grüße
Ramon

[Wusch]

Du könntest dir im dca ein neues Feld anlegen und über den

input_field_callback 

beliebigen HTML-Code ausgeben.

[wcm4u]

Danke Wusch,
das klappt soweit ganz gut.
Habe das mal mit einer hart verdrahteten Bildadresse getestet.
In der Elterntabelle (dca) habe ich das Feld

'imagesrc' => array
		(
			'label'                   => &$GLOBALS['TL_LANG']['tl_pinmapper']['imagesrc'],
			'exclude'                 => true,
			'inputType'               => 'fileTree',
			'eval'                    => array('fieldType'=>'radio', 'filesOnly'=>true, 'extensions'=>'gif,jpg,jpeg,png', 'mandatory'=>true, 'tl_class'=>'clr'),
			'sql'                     => "binary(16) NULL"
		),

Wie kriege ich denn dort definierten Bildpfad in meine Klasse im Kindelement?
dca des Kindelementes:

'bild' => array
		(
			'label'                   => &$GLOBALS['TL_LANG']['tl_pinmapper_elements']['bild'],
			'input_field_callback'    => array('tl_pinmapper_elements', 'showImage')
            
		),

die dazugehörige Klasse:

public function showImage()
    {
        
        $return = '<div class="pin-image"><image src="files/images/test.jpg" /></div>';
return $return;
    } 

Das geht doch bestimmt ohne MySQL Query, oder?
Wenn mich da noch jemand in die richtige Richtung schubsen könnte, wäre das ganz prima.
Vielleicht mit getRelated('pid')? Das bekomme ich aber irgendwie nicht zum laufen.

Grüße
Ramon

[Wusch]

Die Funktion bekommt ja ein DataContainer-Objekt übergeben. Da müssten sich aber nur die Inhalte des aktuellen Datensatzes drin befinden. Über die pid kommst du dann wieder per SQL oder Model an die Daten der Elterntabelle.