The javascript:
function OpenServerBrowser(url, width, height ) {
var iLeft = (screen.width - width) / 2 ;
var iTop = (screen.height - height) / 2 ;
var sOptions = 'toolbar=no,status=no,resizable=yes,dependent=yes' ;
sOptions += ',width=' + width ;
sOptions += ',height=' + height ;
sOptions += ',left=' + iLeft ;
sOptions += ',top=' + iTop ;
var oWindow = window.open( url, 'FCKBrowseWindow', sOptions ) ;
}
function BrowseServer(jotId) {
window.jotId = jotId;
var w = screen.width * 0.7;
var h = screen.height * 0.7;
OpenServerBrowser('/manager/media/browser/mcpuk/browser.html?Type=files&Connector=/manager/media/browser/mcpuk/connectors/php/connector.php&ServerPath=/<<path-to-your-web-root>>/assets/', w, h);
}
function SetUrl(url, width, height, alt){
document.getElementById('wtImage'+window.jotId).value = url;
}
In the OpenServerBrowser call parameters in the Browse Server function, edit the ServerPath to conform to your server’s path to the assets folder. If you change the Type parameter to "images" you’ll get the image browser.
In the Jot form tpl:
<label for="jotImage[+jot.id+]">Image:<br />
<input tabindex="[+jot.seed:math=`?+6`+]" name="image" type="text" size="20" value="[+form.field.custom.image:esc+]" id="jotImage[+jot.id+]" /><input type="button" value="Select Image" onclick="BrowseServer('[+jot.id+]')" />
</label>
Make sure the id of the input is the same as the getElementById in the javascript’s SetUrl function; this is what puts the selected file’s path into the form field.