Demo
Scaled image upload with javascript callback for target dimension/modifier
This demo uploads single scaled image where target dimension and modifier(s) specified by calling javascript method "imageDimensionCallback", which, in turn, asks it from user via prompt dialog.
<applet id="jumpLoaderApplet" name="jumpLoaderApplet"
code="jmaster.jumploader.app.JumpLoaderApplet.class"
archive="mediautil_z.jar,sanselan_z.jar,jumploader_z.jar"
width="715"
height="500"
mayscript>
<param name="uc_sendImageMetadata" value="true"/>
<param name="uc_imageEditorEnabled" value="true"/>
<param name="uc_useLosslessJpegTransformations" value="true"/>
<param name="uc_uploadUrl" value="uploadHandler.php"/>
<param name="uc_uploadScaledImages" value="true"/>
<param name="uc_scaledInstanceNames" value="callback"/>
<param name="uc_scaledInstanceDimensions" value="callback:imageDimensionCallback"/>
<param name="uc_scaledInstanceQualityFactors" value="900"/>
<param name="ac_fireUploaderFileAdded" value="true"/>
<param name="ac_fireUploaderFileStatusChanged" value="true"/>
<param name="uc_fileNamePattern" value="^.+\.(?i)((jpg)|(jpe)|(jpeg)|(gif)|(png)|(tif)|(tiff))$"/>
<param name="vc_fileNamePattern" value="^.+\.(?i)((jpg)|(jpe)|(jpeg)|(gif)|(png )|(tif)|(tiff))$"/>
<param name="vc_disableLocalFileSystem" value="false"/>
<param name="vc_mainViewFileTreeViewVisible" value="true"/>
<param name="vc_mainViewFileListViewVisible" value="true"/>
<param name="uc_imageRotateEnabled" value="true"/>
</applet>
<script>
/**
* trace event to events textarea
*/
function traceEvent( message ) {
document.debugForm.txtEvents.value += message + "\r\n";
}
/**
* file added notification
*/
function uploaderFileAdded( uploader, file ) {
traceEvent( "uploaderFileAdded, index=" + file.getIndex() + ", imageInfo=" + uploader.getImageInfo(file) );
var originalFileLength = file.getLength();
var newFileLength = 16384;
file.setLength( newFileLength );
traceEvent( "file length changed to " + newFileLength + ", orignal length is " + originalFileLength );
}
/**
* file status changed notification
*/
function uploaderFileStatusChanged( uploader, file ) {
traceEvent( "uploaderFileStatusChanged, index=" + file.getIndex() +
", status=" + file.getStatus() +
", content=" + file.getResponseContent() );
//
// add download link if finished
if( file.isFinished() ) {
var serverFileName = file.getId() + "." + file.getName() + ".zip";
var linkHtml = "<a href='/uploaded/" + serverFileName + "'>" + serverFileName + "</a> " + file.getLength() + " bytes";
var container = document.getElementById( "fileLinks");
container.innerHTML += linkHtml + "<br>";
}
}
function imageDimensionCallback(uploadFile, scaledInstanceName) {
var uploader = document.jumpLoaderApplet.getUploader();
var imageInfo = uploader.getImageInfo(uploadFile);
var width = imageInfo.getImageWidth(0);
var height = imageInfo.getImageHeight(0);
return window.prompt("Scaled image dimension callback, file=" + uploadFile.getName() + " (" +
width + "x" + height + "), instance=" + scaledInstanceName, "800x600xfit");
}
</script>
<form name="debugForm">
<p>Events:<br>
<textarea name="txtEvents" style="width:100%; font:10px monospace" rows="10" wrap="off" id="txtEvents"></textarea>
</p>
</form>
<div id="fileLinks">
</div>