MultiPowUpload 3.4
Tutorials
  Home page
Contact support

MultiPowUpload tutorials 

  1. Include MultiPowUpload on a page
  2. Setup parameters
  3. How to use JavaScript API
  4. Data types
  5. Hidden mode
  6. Upload thumbnails
  7. Upload modes, chunked upload mode
  8. Redirect users to another page when upload process is complete
  9. Send additional information to server
  10. Skinning UI
  11. Form fields for each file. Configuring description window.
  12. Control MultiPowUpload using server response.
  13. Internationalization of UI.
  14. Auto layout. Relative coordinates.
  15. Upload files directly to Amazon S3
  16. View/download remote files

 

  1. How to include MultiPowUpload on a page:

    • a. Usage of SWFObject. SWFObject is javaScript library that helps you to place Flash movies on a page easily. Read more about SWFObject here: http://code.google.com/p/swfobject/

      Put the following code on the page:

      <!-- div element will be replaced with MultiPowUpload flash movie. -->

      <div id="MultiPowUpload_holder">You need at least version 10 of Flash player. Download the last version
      <a target="_blank" href="http://www.adobe.com/shockwave/download/alternates/">here</a>!
      </div>


      <!-- SWFObject home page: http://code.google.com/p/swfobject/ -->
      <script type="text/javascript" src="Extra/swfobject.js"></script>
      <script type="text/javascript">
      var params = {
      BGColor: "#F8F6E6"
      };

      var attributes = {
      "id": "MultiPowUpload",
      "name": "MultiPowUpload"
      };

      //Here MultiPowUpload parameters should be specified
      var flashvars = {
      "uploadUrl": "FileProcessingScripts/ASP.NET/CSharp/uploadfiles.aspx",
      "useExternalInterface": "true"
      };

      swfobject.embedSWF("ElementITMultiPowUpload.swf", "MultiPowUpload_holder", "450", "350", "10.0.0", "Extra/expressInstall.swf", flashvars, params, attributes);
      </script>

       

    • b. Classic method with <object> and <embed> tags.

      <OBJECT id="MultiPowUpload" codeBase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0"
      width="420" height="250" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" VIEWASTEXT>
      <!-- Replace symbols " with the &quot; at all parameters values and
      symbols "&" with the "%26" at URL values or &amp; at other values!
      The same parameters values should be set for EMBED object below. -->
      <PARAM NAME="FlashVars" VALUE="uploadUrl=FileProcessingScripts/PHP/uploadfiles.php
      &serialNumber=put your serial number here
      ">
      <PARAM NAME="BGColor" VALUE="#FFFFFF">
      <PARAM NAME="Movie" VALUE="ElementITMultiPowUpload.swf">
      <PARAM NAME="AllowScriptAccess" VALUE="always">
      <PARAM NAME="SWLIVECONNECT" VALUE="true">
      <!-- Embed for Netscape,Mozilla/FireFox browsers support. Flashvars parameters are the same.-->
      <!-- Replace symbols " with the &quot; at all parameters values and
      symbols "&" with the "%26" at URL values or &amp; at other values! -->
      <embed bgcolor="#FFFFFF" id="MultiPowUpload" name="MultiPowUpload" src="ElementITMultiPowUpload.swf" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" allowscriptaccess="always" width="400" height="250"
      flashvars="uploadUrl=FileProcessingScripts/PHP/uploadfiles.php
      &serialNumber=put your serial number here
      ">
      </embed>
      </OBJECT>


      It is important to set both the name and id attributes in <object> and <embed> tags if you would like to use JavaScript methods and event handlers!

      All MultiPowUPload parameters should be specified inside flashvars attribute of <object> and <embed> tags. Delimiter is '&' symbol. Replace symbols " with the &quot; at all parameters values and
      symbols "&" with the "%26" in URL values or &amp; in other values!

  2. How to setup parameters

    There are 3 ways to specify parameters:

    1. Using flashvars attribute of <object> and <embed> tags. The same set of parameters should be specified in flashvars attribute <object> and <embed> tags. Check previous section (2. How to include MultiPowUpload on page) to see an example.

    2. If you use SWFObject to put MultiPowUpload on a page, you should set array of MultiPowUpload parameters in this way:

    //Here MultiPowUpload parameters should be specified
    var flashvars = {
    "uploadUrl": "FileProcessingScripts/ASP.NET/CSharp/uploadfiles.aspx",
    "useExternalInterface": "true"
    };

    swfobject.embedSWF("ElementITMultiPowUpload.swf", "MultiPowUpload_holder", "450", "350", "9.0.0", "expressInstall.swf", flashvars, params, attributes);

     

    3. Using external xml file, specified with externalVariablesUrl parameter

    Example of xml file:

    <?xml version="1.0" encoding="UTF-8"?>

    <MultiPowUpload_parameters>
    <!--Example of external propetries file-->
    <param name="sendTestRequest">false</param>
    <param name="removeButtonVisible">false</param>
    <param name="httpErrorCodeDescription_413">Request Entity Too Large.&lt;br&gt;
    For IIS servers: 1. Try to increase UploadReadAheadSize metabase property.&lt;br&gt;
    2. Try to increase MaxRequestEntityAllowed property value in IIS config.&lt;br&gt;
    For apache servers: Try to increase LimitRequestBody parameter in httpd.conf
    </param>
    </MultiPowUpload_parameters>

     

    4. Using JavaScript setParameter method.

    Example:

    MultiPowUpload.setParameter("uploadUrl","uploadfiles.php");

     

  3. How to use JavaScript API (MultiPowUpload events and methods )

    1. Set MultiPowUpload parameter useExternalInterface to true (false by default) .

    3. Set MultiPowUpload parameter javaScriptEventsPrefix to a necessary value ("MultiPowUpload" by default) .

    To use MultiPowUpload events, you should declare appropriate JavaScript functions. Function name format isjavaScriptEventsPrefix+'_'+eventName. List of all available MultiPowUpload events is available in events section.

    Example:

    function MultiPowUpload_onAddFiles(addedFiles)
    {
    	window.alert("Now total files in list is " + MultiPowUpload.getFiles().length+".  Count of added files is "+addedFiles.length);
    }

    MultiPowUPload automatically initializes JavaScript object with the name specified in id and name attributes of SWFObject or <object> and <embed> tags depending on publishing method. In other words you can use MultiPowUpload methods right after onMovieLoad event.

    Example:

    function MultiPowUpload_onMovieLoad()
    { 
    		//Here and later you can use call MultiPowUpload methods like this;
      	MultiPowUpload.getFiles();
    	    //Where MUltiPowUpload is id (and name) attributes of <object> and <embed> tags or the same attributes from SWFObject.
    }


    If you put MultiPowUpload on page using <object> and <embed> tags, you should set both name and id attributes to the same value for correct initialization of MultiPowUpload JavaScript object.

      MultiPowUpload.sortFileList("SIZE", "ASC");

  4. Data types

    Here is the list of all data types used by MultiPowUpload:
    • String - Simple string data type.
    • Number - Number data type is a common type for simple integer values and floating point numbers.
    • Boolean - Boolean data type. Valid values for this data type are "true", "false", "yes", "no".
    • URL - Absolute or relative url to some resource. The absolute url should start with http:// or / , otherwise the url will be relative to the location of the html page where it is placed. This data type is also used to set up the location of the image files, in this case the default parameter value may be empty or "internal". It means that MultiPowUpload use some build-in resources.
    • Color - Datatype to set up colors for some of the UI elements. It is a standard HTML hexidecimal color value with "#" or "0x" prefixes.
    • TextStyle - Combined data type. It contains the following properties:
      • font - Name of the font family.
      • size - Font size in pixels.
      • color - Font color.
      • style - Font style. Valid values: normal, bold, italic, underline.
        You can combine styles, for example, "textStyle.font" : "bold, italic"
      Here is the example on how to set up parameters with the TextStyle data type. Parameter window.caption.textStyle :
      "window.caption.textStyle.color":"#FF00FF"
      "window.caption.textStyle.style":"bold"
  5. HiddenMode

    Sometimes you need to use the html user interface instead of FLASH UI to select files, display a file list, etc. In this case you would like to control MultiPowUpload using Java Script API, and you can do almost everything except displaying a browse dialog. It happens because of Adobe Flash security policies which require direct user iteraction with FLASH UI to show the browse dialog. To avoid this problem, MultiPowUpload can be placed over the existing html object in the hiddenMode. In this mode MUltiPowUpload will display the browse dialog by a mouse click. Here are the steps to place a transparent MultiPowUpload instance over the html object:
    • Set the value of the wmode parameter of <object> or <embed> tag to transparent.
    • Set the position of the object to absolute.
    • Set the value of the hiddenMode parameter to true.
    • Set the value of the overlayObjectId to ID of the target html object.
    Example:
    	var params = {  		
    		wmode: "transparent"
    	};
    	
    	var attributes = {  
    		id: "MultiPowUpload",  
    		name: "MultiPowUpload",
    		style:"position:absolute"	
    	};
    	
    	var flashvars = {
    	  "uploadUrl": "FileProcessingScripts/PHP/uploadfiles.php",
    	  "useExternalInterface": "true",
    	  "overlayObjectId":"browseButton",
    	  "hiddenMode": "true"	  	  
    	};
    
    	swfobject.embedSWF("ElementITMultiPowUpload.swf", "MultiPowUpload_holder", "90", "30", "10.0.0", "Extra/expressInstall.swf", flashvars, params, attributes);
    	
    	
  6. Upload thumbnails

    MultiPowUpload can generate image thumbails on the client side and upload them to a server. Supported image formats are JPEG, PNG, GIF, BMP.
    Here are the steps to configure the thumbnails upload feature:
    • First of all, to enable this feature, you should set the value of the sendThumbnails parameter to true.
    • If you would like to send original images, set the value of the sendOriginalImages parameter to true.
    • Set the values of the thumbnail.width and thumbnail.height parameters. These parameters determine destination dimensions of the resized image. To set thumbnail's height (width) in percentage from orginal image height (width), set the value as a number from 0.0 to 1.0. For example, to generate a thumbnail with the half-size width, set the value of the thumbnail.width parameter to 0.5.
    • You can change the thumbnail format by setting the value of the thumbnail.format parameter. MultiPowUpload supports the following image formats for the thumbnail generation: JPG (by default) , PNG, BMP.
    • Set the value of the thumbnail.resizeMode parameter. This parameter determines how MultiPowUpload will resize images. Let's see how it works. For example, we have set the thumbnail.height parameter to 100 pixels and the thumbnail.width parameter to 100 pixels. Here is the source image with 2592x1944 dimensions (4/3 aspect ratio differs from 100x100 = 1/1):
      Original image

      Available values:

      fit - MultiPowUpload will generate thumbnails with the size based on the aspect ratio of the original image. The result thumbnail dimensions may differ from the thumbnail.width and thumbnail.height parameters if the aspect rato of the original image and the destination thumbnail are different.
      In our example this mode will produce an image with the 100x75 dimensions. The original image is resized by the longest side (in our case - by width).
      = Original image

      fitByWidth - the result thumbnail will always have specified width. The result thumbnails height calculated with respect of the the aspect ratio of the original image.
      In our example this mode will produce an image with the 100x75 dimensions.
      = Original image

      fitByHeight - the result thumbnail will always have specified height. The result thumbnails width calculated with respect of the the aspect ratio of the original image.
      In our example this mode will produce an image with the 133x100 dimensions.
      = Original image

      exactFit - the result thumbnail will always have specified dimensions. If the aspect rato of the original image and the destination thumbnail are different, "unused" space of thumbnail is filled with thumbnail.backgroundColor color. If the value of the thumbnail.format parameter set to "PNG" and the value of the thumbnail.transparentBackground parameter set to true, result thumbnail will have transparent background.
      In our example this mode will produce an image with the 100x100 dimensions. The original image is resized by the longest side (in our case - by width).
      = Original image

      stretch - the result thumbnail will always have specified dimensions. If it is necessary, the image is stretched by width or height.
      In our example this mode will produce an image with the 100x100 dimensions. As you can see, the image is stretched by the smallest side (in our case - by height).
      = Original image

      crop - the result thumbnail will always have specified dimensions. If it is necessary, the image is cropped by width or height.
      In our example this mode will produce an image with the 100x100 dimensions. The result image is cropped by the longest side (in our case - by width).
      = Original image

  7. Uploade modes, chunked upload mode.

    By default, MultiPowUpload uploads files by the classic (RFC 1867) method. Here are several disadvantages of this method:
    • Web server should be configured to handle large file uploads. Some of web hostings do not allow you to change those settings.
    • Flash Player has a cookie bug, which lead to the session and authentication data loss during the upload. Read more here.
    • Some antivirus software works as proxy servers and scan all requests to a web server from the user computer. It may result MultiPowUpload to display wrong progress information. The progress bar goes quickly to 99% and stops waiting for a server response.
    The main advantage of the classic method is the usage of the standard upload algorithm, which allows you to use regular scripts to save uploaded files on server side.
    MultiPowUpload provides an alternate upload method - chunked upload mode. When this mode is enabled, MultiPowUpload will send files to a server by small chunks.
    Here are several advantages of this method:
    • You do not need to configure the web server for large file uploads, because the file is uploaded by small chunks.
    • Flash Player sends browser cookies correctly with this method. The session and authentication info is passed correctly to the server.
    • Progress information is always correct.
    The main disadvantage is the file size limitation: MultiPowUpload can upload only files up to 100 Mb in size by this method. You should also use a special file processing script on server side to save uploaded chunks in one file. To enable this method, set the value of the chunkedUpload.enabled parameter to true.
    You can configure the chunk size with the chunkedUpload.chunkSize parameter. By default, the value of this paraneter is set to -1, in this case MultiPowUpload will automatically select the best value for the chunk size during the upload process. To limit maximum value for the chunk size, when it is controlled by MultiPowUpload, you can use the chunkedUpload.maxChunkSize parameter. The value of this parameter should be less than the upload file size limitation on server side. For example, by default, php limit of the upload file size is 2 Mb.
    Additionally, MultiPowUpload has 2 modes for the chuncked upload method:
    • raw mode: MultiPowUpload will write the file body by chuncks directly to the request. The request will contain only binary file data and nothing more. To enable this mode, set the value of the chunkedUpload.rawMethod parameter to true (by default).
    • multipart mode: MultiPowUPload will encode each chunck using MultiPart encoding. In this case, each chunk will be present as a file on the server side. It allows to stick the file parts together easily. To enable this mode, set the value of the chunkedUpload.rawMethod parameter to false.
    Here is the comparison table of classic and chunked upload methods:
      Classic method Chunked method
    File size limit. 2 Gb Adobe Flash guarantees 100 MB files uploading by this method but even 500 MB files work correctly on most PCs.
    Cookies are sent correctly. No Yes
    Server should be configured for large file uploads. Yes No
    Server side file processing script. Standard Custom script from the distribution package
  8. How to redirect a user to another page when upload/download process is complete?

    Specify the parameter redirectUploadUrl to url of the page which should be loaded when upload process is complete.
    MultiPowupload post information about upload process results to this page. MultiPowUpload sends following information about each file (#INDEX# is index of file from 0 to count of files -1) :

    MultiPowUploadFileSize_#INDEX#  - file size.
    MultiPowUploadFileId_#INDEX# - file id.
    MultiPowUploadFileDate_#INDEX# - file modification date.
    MultiPowUploadFileName_#INDEX# - file name.
    MultiPowUploadFileStatus_#INDEX# - file status. Check possible values here.
    
  9. How to send additional information to server?

    You can send additional information in several ways:
    • a. Add info to uploadUrl property.
      For example:
      "uploadUrl": "uploadfiles.php?paramname1=value1&paramname2=value2"
    • b. Specify formName property.
      In this case you can add a form to your html page and MultiPowUpload will automatically add form values to HTTP request.

    • c. Specify customPostFields property.
      Array of custom fields and values that will be added to the request separated by |
      Example:
      filedName1;value1|FieldName2;value2
    • d. Use JavaScript addPostField(String name, String value) method.
      It adds “name–value” pair to the list that will be sent as text Form items with all files.

      Example:
      MultiPowUpload.addPostField("Username","JDoe");

    • e. Use JavaScript addFilePostField(Stgring fileId,String name, String value) method.
      It adds “name–value” pair to the list that will be sent as text Form items with a specified file.

      Example:
      MultiPowUpload.addFilePostField(file.id, "Username","JDoe");

  10. Skinning UI

    MultiPowUpload provides the possibility to set colors, text styles, icons for most of UI elements and even replace them with the custom image files. To combine all of those parameters in one place, you can use the MultiPowUpload theme package.
    The MultiPowUpload theme package is a simple zip archive, which should contain an xml file with the parameters named theme.xml and the image files if it is necessary.
    The Xml file may contain any MultiPowUpload parameters. The Url to the image files inside the theme archive is relative to the archive root. All files should be placed into the archive root. You can find an example of the theme packages in the distribution package.
    Specify the url to the theme package using the themeUrl parameter.
    Along with the theme package you can set all of the skin related parameters in a regular way, on the html page.
    You can set graphics for states almost for all UI elements: normal, disabled, roll over, down. It is usually enough to specify an image file only for the normal state, then MultiPowUpload will generate the additional image for the disabled state automatically and will use the normal state image for other states.
  11. Form fields for each file. Configuring description window.

    MultiPowUpload allows to have the feature to set up form fields for each file. It may be helpful if you would like to have a description for each file or some other information.
    For example, you have an image gallery and it would be nice to have information about album, some comments for image, tags, etc. for each image file.
    MultiPowUpload is easy to configure to show all of these form fields.
    First of all, let's see how it works. The description windows can be called from the list or the thumbnails view:

    Set the value of the listView.description.visible parameter to true (false by default) to display the line with a description in the ListView.

    Set the value of the thumbnailView.bottomPanel.showEditIcon parameter to true (false by default) to display this icon in the ThumbnailsView.
    When a user clicks some of those controls, MultiPowUpload displays the Description window:

    Using this window, a user can navigate through all the available form fields for each file.
    The navigationPanel is placed on the top of this window. This panel allows to change the active file without closing the window. A user simply clicks on the navigation buttons. Use the descriptionWindow.fileNavigation.enabled parameter to enable or disable this panel.
    The inputsList is located on the left side. This list contains all the configured form fields. Click some of the items in the list to change the rightPanel content, where a user makes an actual input.
    To add a form field into the input list, you should set the following required parameters, where * character should be replaced by the form field name. This name will be used by MultiPowUpload to post data. Here is the configuration for the form field displayed on the screenshot below:
        "descriptionWindow.inputs.album.type":"dropdown",
    "descriptionWindow.inputs.album.index":"2",
    "descriptionWindow.inputs.album.specificForTypes":"",
    "descriptionWindow.inputs.album.dropDownOptions":"Family;Friens;Other",
    "descriptionWindow.inputs.album.label":"Album",
    "descriptionWindow.inputs.album.message":"Select album for image"
    This form field will be posted to server with the "album" name, so on server side you can access its value like this: Request.Form["album"] (ASP.NET) or $_POST["album"] (PHP).
  12. Control MultiPowUpload using server response.

    Starting from version 3.1, MultiPowUpload supports the execution of some commands received from a server in an http response.
    To use this feature, you should write a special xml structure at any place of the response. MultiPowUpload will search for <MultiPowUpload> and </MultiPowUpload> tags in the server response and, if they are found, will try execute a command between these 2 tags.
    Below is the valid xml structure with all commands that are supported in the current version:
    <MultiPowUpload>
    //display message with caption "Warning" message from tag
    <message>Uploaded</message>
    //set value of parameter
    <param name="clearButtonVisible">false</param>
    //display message with specified caption and message
    <function name="showAlert" param1="warning" param2="error message"/>
    //cancell upload
    <callfunction name="cancelUpload"/>
    </MultiPowUpload>
    Here is the decription of all available tags (commands):
    • <function name="functionName" param1="value1" param2="value2"/>
      or
      <callfunction name="functionName" param1="value1" param2="value2"/> - call function with the name specified in the name attribute and 2 parameters (if they are set) from param1 and param2 attributes.
      Available functions to call:
      • showAlert is with 2 parameters. The first parameter will be used as a caption for the modal window, the second parameter - as message text.
      • setRuntimeParam is with 2 parameters. The first functions parameter is the name of the MultiPowUpload parameter, the second - new value of the MultiPowUpload parameter.
      • cancelUpload is without any parameter. The parameter cancels the upload operation.
    • <message>Your text here</message> - It shows a modal window with the "Warning" caption and a message from the tag contents.
    • <param name="parameterName">parameterValue</param> - It sets the value of a parameter with the specified name.
    • <error message="File is invalid!"/> - It show error message and mark file with error status. User will able to see that some of files were not uploaded.
  13. Internationalization of UI.

    Starting from version 3.1, MultiPowUpload provides the feature to detect a user's language automatically and load an necessary file with the translation. This feature can be enabled/disabled using the language.autoDetect parameter (false by deafult). If the parameter is set to true, MultiPowUpload will try to detect the user's language using the following JavaScript statement: (navigator.language) ? navigator.language : navigator.userLanguage. When the language is detected, the 2-letter language code will replace <LANGUAGE_CODE> placeholder in the language.source parameter. If the value of language.source parameter does not contain <LANGUAGE_CODE> placeholder, the language detection will not be performed. If the value of the language.autoDetect parameter is set to false and the value of the language.source parameter contains <LANGUAGE_CODE> placeholder, the language detection will not be performed and the language.source parameter will be ignored.
    The MultiPowUpload distribution package contains a lot of translation files in the Extra/Languages/ subfolder.
    If you would like to set the translation manually, you should set the value of the language.autoDetect parameter to false and remove the <LANGUAGE_CODE> placeholder from the language.source parameter.
    Changing the value of the language.source parameter at runtime using the setParameter method will result the reload of the translation file from the new location and the reinitialization of MultiPowUpload.
  14. Auto layout. Relative coordinates.

    To fit UI elements sizes to a dinamic text, MultiPowUpload have the autoLayout parameter which is enabled by default. When the value of this parameter is set to true, MultiPowUpload will automatically adjust the width and the height of the buttons depending on the text size and reposition all UI elements if their coordinates has been set as relative. You can set the position of almost all UI elements, but dimensions of UI elements sometimes change at runtime (loading different translation files) and they overlap other UI elements. To avoid this issue, MultiPowUpload (starting from 3.1 version) allows to set the position of the UI elements relatively to the position of another UI element. You can use ariphmetic operations and special placeholders inside the values of the parameters that set coordinates of some UI element. Here is syntax of placeholder: <ui_Element_Name.property> - where ui_Element_Name is a name of a UI element, for example, clearButton, and property is one of the Rectangled properties.
    ui_Element_Name can have one of the values listed below:

    • browseButton
    • uploadButton
    • removeButton
    • clearButton
    • cancelButton
    • listViewButton
    • sortButton
    • thumbViewButton
    • browseLabel
    • statusLabel
    • progressBar
    • fileView

    The property can have one of the following values:

    • x - horizontal coordinate.
    • y - vertical coordinate.
    • width - width of the UI element.
    • height - height of the UI element.
    • left - coordinate of the left border. The same as x.
    • right - coordinate of the right border The same as x+width.
    • top - coordinate of the top border. The same as y.
    • bottom - coordinate of the right border. The same as y+height.
    Example :
    "clearButton.x" : "<movie.width>-<clearButton.width>-5" - it sets the horizontal position of the clearButton aligned to the right border of the movie clip.
  15. Upload files directly to amazon S3

    Starting from version 3.3.3 MultiPowUpload allow upload files directly to Amazon S3 servers.
    To upload files to your own Amazon S3 bucket you need to generate required parameters. Please use flash_amazons3generator.html page from distribtiuon package to generate needed parameters. Open flash_amazons3generator.html page in a browser and follow instructions. Your secret key will not be transferred by wire. All calculations done on your computer using JavaScript.
    When done, open flash_uploadtoamazons3.html l page in editor , find var flashvars = {} and put into it parameters generated on flash_amazons3generator.html page.
    Please note, that you should put crossdomain.xml file at the root of your bucket in order to allow MultiPowUpload upload files into this bucket.
    And grant 'public-read' permissions to this file. Read more about crossdomain security policy at MultiPowUpload documentation.
  16. View/download remote files

    Starting from version 3.4 MultiPowUpload provide feature to display files located on remote server with ability to download them from server to local computer.
    There are several ways to specify files for download/preview:
    1. Set list of files directly on html page using remoteFiles parameter.
      Example:
      Images/Dsc_0018.jpg|Dsc_0018.jpg|1346194|123|Images/thumbnail_Dsc_0018.jpg|Wed, 19 Nov 2008 16:19:55 +0400;Images/frog.jpg|frog.jpg|45119|1234|Images/thumbnail_frog.jpg||
    2. Set url to remote file with list of files for download using remoteFiles.source parameter. It can be static file or script that generates data dynamically. MultiPowUpload distribution package contains PHP and ASP.NET sample scripts .
      MultiPowUpload accept json and xml data as source of files list. You should set the type of data in remoteFiles.source file using remoteFiles.source.type parameter.
      Here is example of json data:
      	[
      		{
      			//File id, helpfull to set id if you will update file on server side after some actions in MultiPowUpload. reorder or deletion
      			"id": "1234",
      			//Name of file 
      			"name": "fish.jpg",
      			//File size
      			"size": "98687",
      			//Url to file on your server. Absolute or relative url 
      			"url": "images/sampleImages/fish.jpg",
      			//File date
      			"modificationDate":"Tue, 06 Mar 2012 13:52:25 +0400",
      			//Url to thumbnail
      			"thumbnailUrl":"Images/sampleImages/thumbnail_fish.jpg"
      		},		
      		{
      			"id": "1234567",
      			"name": "frog.jpg",
      			"size": "45119",
      			"url": "images/sampleImages/frog.jpg",
      			"modificationDate":"Fri, 16 Mar 2012 11:42:12 +0400",
      			"thumbnailUrl":"Images/sampleImages/thumbnail_frog.jpg"
      		}
      	]
      	    

      Here is example of xml data:
      	  <?xml version="1.0" encoding="UTF-8"?>
      		
      		<files>    				
      			<file name="fish.jpg" size="98687" id="1234" modificationDate="Tue, 06 Mar 2012 13:52:25 +0400">
      				<url>Images/sampleImages/fish.jpg</url>	
      				<thumbnailUrl>Images/sampleImages/thumbnail_fish.jpg</thumbnailUrl>	
      			</file>
      			<file name="frog.jpg" size="45119" id="1234567" modificationDate="Fri, 16 Mar 2012 11:42:12 +0400">
      				<url>Images/sampleImages/frog.jpg</url>	
      				<thumbnailUrl>Images/sampleImages/thumbnail_frog.jpg</thumbnailUrl>	
      			</file>
      			
      		</files>
      	  
    3. Add files to list dynamically using addRemoteFiles method. Method accept json object with list of files as parameter. See #1 method for details.

    Here is short decription for each attribute (property) :
    • id - unique identificator for each file item. It should unique in current file list . If it's value is empty, MultiPowUpload will generate it by self automatically.
      If file with the same id already exists in file list , it will be replaced by new one.
    • name - File name displayed in files list.
    • size- length of file in bytes.
    • modificationDate - File last modification date in RFC 2822 format. If ommited, current date on user computer will be used.
    • thumbnailUrl - url to thumbnail image file. This image will be displayed in thumbnails view to decrease loading time. If omited , url property will be used to load image preview.
    • url - Absolute or relative url to file on server.

    Additionaly you can use reloadRemoteFiles method to force reload of remote files list from specified source.