Collections - Snippetrenderer for images. Supports Media Source

collections.imageRenderer.php

<?php
// Collections Snippet Renderer
// Version: 0.1
// 2do: autoimatically retrieve assets path from media source

$row    = $modx->getOption('row',       $scriptProperties, '');
$value  = $modx->getOption('value',     $scriptProperties, '');
$column = $modx->getOption('column',    $scriptProperties, '');

$imgName = $value;
$docid   = $row['id'];
$tvName  = substr($column, 3); // tv name without collections prefix (tv_)

$debug = print_r($scriptProperties,true);

//Add mediaSources for specifiv image TVs below

switch($tvName) {
    case 'icon':
        $imgPath = 'assets/tpl/img/icons/';
        break;
    case 'mgThumb':
        $imgPath = 'assets/id/{id}/gallery/';
        break;
    default:
        $imgPath = '';
        break;
}

$find    = array('{id}');
$replace = array($docid);

$imgPath = str_replace($find,$replace,$imgPath);

$thumb = $modx->runSnippet(
    'pthumb'
    ,array( 
         'input' => $imgPath . $imgName
        ,'options' => '&w=60&h=60&zc=C'
    )
);

return '<img src="' . $thumb . '" width="60"><br/>' . $imgName;

wsrnimagerenderer.js

wsrnimagerenderer = function(value, metaData, record, rowIndex, colIndex, store) {
    if (value != '' && value != null) {
        var baseUrl = MODx.config['collections.renderer_image_path'];
        
        /* dynamic mediasource in assets/resources/{id}/ */
        var resourcePath = '../assets/resources/' + record.id + '/'; 
        
        console.log(record)
        
        if (value.indexOf('http://') === 0) {
            baseUrl = '';
        }
        return '<div class="myimagerenderer"><img src="' + baseUrl + resourcePath +  value + '" width="100"></div>';
    }
}